mirror of
https://github.com/matrix-construct/construct
synced 2024-11-30 10:42:47 +01:00
130 lines
3 KiB
JavaScript
130 lines
3 KiB
JavaScript
/*
|
|
// Matrix Construct
|
|
//
|
|
// Copyright (C) Matrix Construct Developers, Authors & Contributors
|
|
// Copyright (C) 2016-2018 Jason Volk <jason@zemos.net>
|
|
//
|
|
// Permission to use, copy, modify, and/or distribute this software for any
|
|
// purpose with or without fee is hereby granted, provided that the above
|
|
// copyright notice and this permission notice is present in all copies. The
|
|
// full license for this software is available in the LICENSE file.
|
|
*/
|
|
|
|
'use strict';
|
|
|
|
/**
|
|
*
|
|
* Menu controller
|
|
*
|
|
*/
|
|
mc.ng.app.controller('menu', class extends mc.ng.controller
|
|
{
|
|
constructor($scope)
|
|
{
|
|
super("menu", $scope);
|
|
}
|
|
|
|
/* (a)ng-click on a menu button
|
|
*
|
|
* 1. Item tab can define a click(event) function.
|
|
* 2. Item tab can define a target element, which will be shown/hidden.
|
|
*/
|
|
async toggle(menu, name, event, ...args)
|
|
{
|
|
let e = event.delegateTarget;
|
|
let item = menu[name];
|
|
if(item === undefined)
|
|
return;
|
|
|
|
if(item.disabled)
|
|
return;
|
|
|
|
if(item.holds !== undefined && event.type == "click")
|
|
return;
|
|
|
|
if(typeof(item.click) == "function")
|
|
if(await item.click(event, ...args) === false)
|
|
return;
|
|
|
|
if(item.target !== undefined)
|
|
{
|
|
let state = mc.show[item.target]? true : false;
|
|
mc.show[item.target] = !state;
|
|
}
|
|
}
|
|
|
|
/* hold down on a menu button
|
|
* use ng-mousedown and ng-mouseup, or ng-click
|
|
*
|
|
*/
|
|
hold(menu, name, event, ...args)
|
|
{
|
|
let e = event.delegateTarget;
|
|
let item = menu[name];
|
|
if(item === undefined)
|
|
return;
|
|
|
|
if(item.holds === undefined)
|
|
return;
|
|
|
|
let click = () =>
|
|
this.toggle(menu, name, event, ...args);
|
|
|
|
switch(event.type)
|
|
{
|
|
case "mousedown":
|
|
$(e).addClass("holding");
|
|
item.holding = mc.timeout(item.holds, click);
|
|
event.stopPropagation();
|
|
break;
|
|
|
|
case "mouseup":
|
|
$(e).removeClass("holding");
|
|
mc.timeout.cancel(item.holding);
|
|
event.stopPropagation();
|
|
break;
|
|
}
|
|
}
|
|
|
|
/* Determines whether a menu button is considered "selected"
|
|
* which generally applies a CSS class to change the color etc.
|
|
*
|
|
* The goal here is not simply to determine selection by the user's interaction
|
|
* with the menu button itself, but to also allow distant functionality to assert
|
|
* the menu button is no longer selected. For example: closing a div without using
|
|
* menu button that opened it should not leave the menu button in the selected state.
|
|
*
|
|
* Options:
|
|
* 1. Use mc.show boolean dictionary by element ID
|
|
* 2. A boolean value in the menu item tab 'selected': true/false,
|
|
* 3. A function in place of the boolean value in #1.
|
|
* 4. If the menu item uses the "target" concept, the target element is :hidden.
|
|
*/
|
|
selected(menu, name, item)
|
|
{
|
|
if(item === undefined)
|
|
return false;
|
|
|
|
switch(typeof(item.selected))
|
|
{
|
|
case "undefined":
|
|
break;
|
|
|
|
case "function":
|
|
return item.selected();
|
|
|
|
default:
|
|
return item.selected == true;
|
|
}
|
|
|
|
if(item.target !== undefined)
|
|
{
|
|
if($(item.target).length == 0)
|
|
return false;
|
|
|
|
return mc.show[item.target] === true? true : false;
|
|
}
|
|
|
|
return false;
|
|
}
|
|
});
|