Mirrors/cloudcmd
1
0
Fork 0
mirror of https://github.com/coderaiser/cloudcmd.git synced 2026-01-23 02:35:49 +00:00
Code Issues Projects Releases Wiki Activity

feature(modules) menu-io -> supermenu

Browse source
This commit is contained in:
coderaiser 2018-04-27 15:22:24 +03:00
parent b7262f954b
commit 9f0d3b2c4e
23 changed files with 125 additions and 977 deletions
Download patch file Download diff file Expand all files Collapse all files

1
.webpack/js.js
View file

@ -62,6 +62,7 @@ module.exports = {
path: isDev ? distDev : dist,
pathinfo: isDev,
devtoolModuleFilenameTemplate,
publicPath: '/dist/',
},
externals: [
externals

1
bower.json
View file

@ -29,7 +29,6 @@
],
"dependencies": {
"domtokenlist-shim": "~1.1.0",
"menu": "~1.0.2",
"olark": "^1.0.0",
"jquery": "3.3.1",
"fancybox": "^2.1.6",

13
client/client.js
View file

@ -13,6 +13,7 @@ const jonny = require('jonny/legacy');
const currify = require('currify/legacy');
const bind = (f, ...a) => () => f(...a);
const noop = () => {};
const {
apiURL,
@ -184,12 +185,13 @@ function CloudCmdProto(Util, DOM) {
* инициализации
*/
this.init = (prefix, config) => {
const func = bind(exec.series, [
const func = bind(exec.parallel, [
initModules,
baseInit,
loadPlugins,
loadStyle,
exec.with(CloudCmd.route, location.hash),
]);
], noop);
const funcBefore = (callback) => {
const src = prefix + '/join:' + [
@ -227,6 +229,13 @@ function CloudCmdProto(Util, DOM) {
exec.if(document.body.scrollIntoViewIfNeeded, func, funcBefore);
};
function loadStyle(callback) {
const prefix = CloudCmd.PREFIX;
const plugins = prefix + '/dist/cloudcmd.common.css';
DOM.load.css(plugins, callback);
}
function loadPlugins(callback) {
const prefix = CloudCmd.PREFIX;
const plugins = prefix + '/plugins.js';

7
client/dom/index.js
View file

@ -79,13 +79,6 @@ function CmdProto() {
return DOM;
};
/** function loads css and js of Menu
* @param callback
*/
this.loadMenu = function(callback) {
return DOM.loadRemote('menu', callback);
};
/**
* create new folder
*

116
client/modules/edit-file.js
View file

@ -1,12 +1,14 @@
'use strict';
/* global CloudCmd, DOM, MenuIO */
/* global CloudCmd, DOM*/
const Format = require('format-io');
const currify = require('currify/legacy');
const store = require('fullstore/legacy');
const squad = require('squad/legacy');
const fullstore = require('fullstore/legacy');
const exec = require('execon');
const supermenu = require('supermenu');
const call = currify((fn, callback) => {
fn();
@ -18,6 +20,7 @@ CloudCmd.EditFile = function EditFileProto(callback) {
const Dialog = DOM.Dialog;
const EditFile = exec.bind();
const config = CloudCmd.config;
const isFocuse = fullstore();
let Menu;
@ -119,67 +122,62 @@ CloudCmd.EditFile = function EditFileProto(callback) {
event.preventDefault();
!Menu && DOM.loadRemote('menu', (error) => {
let noFocus;
const editor = CloudCmd.Edit.getEditor();
const options = {
beforeShow: (params) => {
params.x -= 18;
params.y -= 27;
},
afterClick: () => {
!noFocus && editor.focus();
}
};
if (Menu)
return;
const editor = CloudCmd.Edit.getEditor();
const options = {
beforeShow: (params) => {
params.x -= 18;
params.y -= 27;
},
const menuData = {
'Save Ctrl+S' : () => {
editor.save();
},
'Go To Line Ctrl+G' : () => {
noFocus = true;
editor.goToLine();
},
'Cut Ctrl+X' : () => {
editor.cutToClipboard();
},
'Copy Ctrl+C' : () => {
editor.copyToClipboard();
},
'Paste Ctrl+V' : () => {
editor.pasteFromClipboard();
},
'Delete Del' : () => {
editor.remove('right');
},
'Select All Ctrl+A' : () => {
editor.selectAll();
},
'Beautify Ctrl+B' : () => {
editor.beautify();
},
'Minify Ctrl+M' : () => {
editor.minify();
},
'Close Esc' : () => {
EditFile.hide();
}
};
if (error)
return Dialog.alert(TITLE, error);
if (Menu || !MenuIO)
return;
const element = CloudCmd.Edit.getElement();
Menu = new MenuIO(element, options, menuData);
Menu.show(position.x, position.y);
});
afterClick: () => {
editor.focus();
}
};
const element = CloudCmd.Edit.getElement();
Menu = supermenu(element, options, getMenuData());
Menu.show(position.x, position.y);
}
function getMenuData() {
return {
'Save Ctrl+S' : () => {
editor.save();
},
'Go To Line Ctrl+G' : () => {
editor.goToLine();
},
'Cut Ctrl+X' : () => {
editor.cutToClipboard();
},
'Copy Ctrl+C' : () => {
editor.copyToClipboard();
},
'Paste Ctrl+V' : () => {
editor.pasteFromClipboard();
},
'Delete Del' : () => {
editor.remove('right');
},
'Select All Ctrl+A' : () => {
editor.selectAll();
},
'Beautify Ctrl+B' : () => {
editor.beautify();
},
'Minify Ctrl+M' : () => {
editor.minify();
},
'Close Esc' : () => {
EditFile.hide();
}
};
};
function setMsgChanged(name) {
MSG_CHANGED = 'Do you want to save changes to ' + name + '?';
}

104
client/modules/edit-names.js
View file

@ -4,6 +4,7 @@
const currify = require('currify/legacy');
const exec = require('execon');
const supermenu = require('supermenu');
const reject = Promise.reject.bind(Promise);
@ -15,8 +16,9 @@ CloudCmd.EditNames = function EditNamesProto(callback) {
const alert = currify(Dialog.alert, TITLE);
const refresh = currify(_refresh);
let Menu;
const EditNames = this;
let Menu, MenuIO;
const ConfigView = {
beforeClose: () => {
exec.ifExist(Menu, 'hide');
@ -149,62 +151,54 @@ CloudCmd.EditNames = function EditNamesProto(callback) {
};
event.preventDefault();
if (Menu)
return;
!Menu && DOM.loadRemote('menu', (error) => {
MenuIO = window.MenuIO;
let noFocus;
const editor = CloudCmd.Edit.getEditor();
const options = {
beforeShow: (params) => {
params.x -= 18;
params.y -= 27;
},
afterClick: () => {
!noFocus && editor.focus();
}
};
const editor = CloudCmd.Edit.getEditor();
const options = {
beforeShow: (params) => {
params.x -= 18;
params.y -= 27;
},
const menuData = {
'Save Ctrl+S' : () => {
editor.save();
EditNames.hide();
},
'Go To Line Ctrl+G' : () => {
noFocus = true;
editor.goToLine();
},
'Cut Ctrl+X' : () => {
editor.cutToClipboard();
},
'Copy Ctrl+C' : () => {
editor.copyToClipboard();
},
'Paste Ctrl+V' : () => {
editor.pasteFromClipboard();
},
'Delete Del' : () => {
editor.remove('right');
},
'Select All Ctrl+A' : () => {
editor.selectAll();
},
'Close Esc' : () => {
EditNames.hide();
}
};
if (error)
return alert(error);
if (Menu || !MenuIO)
return;
const element = CloudCmd.Edit.getElement();
Menu = new MenuIO(element, options, menuData);
Menu.show(position.x, position.y);
});
afterClick: () => {
editor.focus();
}
};
const menuData = {
'Save Ctrl+S' : () => {
editor.save();
EditNames.hide();
},
'Go To Line Ctrl+G' : () => {
editor.goToLine();
},
'Cut Ctrl+X' : () => {
editor.cutToClipboard();
},
'Copy Ctrl+C' : () => {
editor.copyToClipboard();
},
'Paste Ctrl+V' : () => {
editor.pasteFromClipboard();
},
'Delete Del' : () => {
editor.remove('right');
},
'Select All Ctrl+A' : () => {
editor.selectAll();
},
'Close Esc' : () => {
EditNames.hide();
}
};
const element = CloudCmd.Edit.getElement();
Menu = supermenu(element, options, menuData);
Menu.show(position.x, position.y);
}
function isChanged() {

22
client/modules/menu.js
View file

@ -8,6 +8,8 @@ const exec = require('execon');
const currify = require('currify/legacy');
const wrap = require('wraptile/legacy');
const supermenu = require('supermenu');
const {FS} = require('../../common/cloudfunc');
const load = require('../dom/load');
@ -48,19 +50,8 @@ function MenuProto(Position) {
};
this.show = (position) => {
const showFunc = () => {
show(position);
Images.hide();
};
exec.if(window.MenuIO, showFunc, () => {
DOM.loadMenu((error) => {
if (error)
return alert(error);
showFunc();
});
});
show(position);
Images.hide();
};
function getPosition(position) {
@ -118,10 +109,9 @@ function MenuProto(Position) {
const menuData = getMenuData(isAuth);
const options = getOptions(NOT_FILE);
const optionsFile = getOptions();
const MenuIO = window.MenuIO;
MenuContext = new MenuIO(fm, options, menuData);
MenuContextFile = new MenuIO(fm, optionsFile, menuDataFile);
MenuContext = supermenu(fm, options, menuData);
MenuContextFile = supermenu(fm, optionsFile, menuDataFile);
const el = DOM.getCurrentByPosition({x, y});
const menuName = getMenuNameByEl(el);

11
json/modules.json
View file

@ -37,17 +37,6 @@
"//cdnjs.cloudflare.com/ajax/libs/fancybox/{{ version }}/css/jquery.fancybox.min.css",
"//cdnjs.cloudflare.com/ajax/libs/fancybox/{{ version }}/js/jquery.fancybox.min.js"
]
}, {
"name": "menu",
"version": "1.0.2",
"local": [
"/modules/menu/menu-io.min.css",
"/modules/menu/menu-io.min.js"
],
"remote": [
"//cdn.jsdelivr.net/menu-io/{{ version }}/menu-io.min.js",
"//cdn.jsdelivr.net/menu-io/{{ version }}/menu-io.min.css"
]
}],
"data": {
"FilePicker": {

32
modules/menu/.bower.json
View file

@ -1,32 +0,0 @@
{
"name": "menu",
"version": "1.0.2",
"homepage": "https://github.com/coderaiser/menu-io",
"authors": [
"coderaiser <mnemonic.enemy@gmail.com>"
],
"description": "Simple css-based multillevel context menu",
"main": "menu-io.min.js",
"moduleType": [
"globals",
"node"
],
"keywords": [
"menu"
],
"license": "MIT",
"ignore": [
"**/.*",
"gulpfile.js",
"node_modules"
],
"_release": "1.0.2",
"_resolution": {
"type": "version",
"tag": "v1.0.2",
"commit": "f258a85ac333460ef2affc8b8a901be7ce93be2c"
},
"_source": "https://github.com/coderaiser/menu-io.git",
"_target": "~1.0.2",
"_originalSource": "menu"
}

60
modules/menu/ChangeLog
View file

@ -1,60 +0,0 @@
2016.03.01, v1.0.2
fix:
- (package) test: lint:css -> npm run lint:css
feature:
- (stylelint) .stylelintrc -> .stylelintrc.yml
- (package) ~ -> ^
- (package) add stylelint
2016.02.05, v1.0.1
fix:
- (menu) menu cut on left
2016.02.05, v1.0.0
fix:
- (menu) menu cut on small screen
feature:
- (package) add wisdom
- (package) add branch
2015.07.22, v0.7.9
feature:
- (menu) rendy v1.1.0
2015.02.20, v0.7.8
feature:
- (menu) z-index: 1 -> 2
2015.02.06, v0.7.7
feature:
- (menu) speed up
- (bower) ignore: add gulpfile
- (bower) moduleType: add node
2015.01.05, v0.7.5
fix:
- (bower) rm bower_components
feature:
- (jshintrc) add
- (menu) rm util.io-part
- (util) rm
- (package) private
- (gitignore) npm-debug.log
- (bower) v0.7.4

22
modules/menu/LICENSE
View file

@ -1,22 +0,0 @@
(The MIT License)
Copyright (c) 2014-2015 Coderaiser <mnemonic.enemy@gmail.com>
Permission is hereby granted, free of charge, to any person obtaining
a copy of this software and associated documentation files (the
"Software"), to deal in the Software without restriction, including
without limitation the rights to use, copy, modify, merge, publish,
distribute, sublicense, and/or sell copies of the Software, and to
permit persons to whom the Software is furnished to do so, subject to
the following conditions:
The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

96
modules/menu/README.md
View file

@ -1,96 +0,0 @@
Menu [![Build Status][BuildStatusIMGURL]][BuildStatusURL]
====
[BuildStatusURL]: https://travis-ci.org/coderaiser/menu-io "Build Status"
[BuildStatusIMGURL]: https://api.travis-ci.org/coderaiser/menu-io.png?branch=gh-pages
Simple css-based context menu made for [Cloud Commander](http://cloudcmd.io).
Little bit better then other people do :).
So to see at work look [here](http://jsfiddle.net/coderaiser/mAUUz/).
#How come?
Tired to use js based libraries which use jquery and `.hover` classes insteed of `:hover` pseudo-selectors.
#Why should I care?
- `1.6kb` min & gzip for js.
- `1kb` min & gzip for css.
- no dependencies.
- easy to use.
- easy to extend.
# Install
With help of [bower](http://bower.io "Bower").
```
bower install menu
```
#How use?
Create `html` page with `js` and `css` connected.
```html
<link rel="stylesheet" href="http://coderaiser.github.io/menu-io/menu.min.css">
<script src="http://coderaiser.github.io/menu-io/menu.min.js"></script>
```
Add little JavaScript:
```js
var menu = MenuIO({
'item name': function onItemNameClick() {
}
}
```
You could use element and (or) options parameters if you need to.
```js
var element = document.body,
options = {
icon : true, /* add class icon-item-name */
beforeClose : alert,
beforeShow : alert,
beforeClick : alert,
name : 'name of menu' /* if you want use a couple menu on one element */
},
menu = MenuIO(element, options, {
'item name': function onItemNameClick() {
});
```
Look for `examples` directory or copy example from bottom:
```html
<link rel="stylesheet" href="http://coderaiser.github.io/menu-io/menu.min.css">
<script src="http://coderaiser.github.io/menu-io/menu-io.min.js"></script>
<script>
window.addEventListener('load', function onLoad() {
'use strict';
window.removeEventListener('load', onLoad);
var menu = MenuIO({
help: function() {
alert('*help');
},
upload: {
github: {
gist: function() {
alert('*gist');
},
main: function() {
alert('*main');
}
},
dropbox: function() {
alert('*dropbox');
}
}
});
});
</script>
```
#License
MIT

23
modules/menu/bower.json
View file

@ -1,23 +0,0 @@
{
"name": "menu",
"version": "1.0.2",
"homepage": "https://github.com/coderaiser/menu-io",
"authors": [
"coderaiser <mnemonic.enemy@gmail.com>"
],
"description": "Simple css-based multillevel context menu",
"main": "menu-io.min.js",
"moduleType": [
"globals",
"node"
],
"keywords": [
"menu"
],
"license": "MIT",
"ignore": [
"**/.*",
"gulpfile.js",
"node_modules"
]
}

4
modules/menu/example/example.css
View file

@ -1,4 +0,0 @@
html, body, .menu-container {
width: 99%;
height: 99%;
}

16
modules/menu/example/menu-data.js
View file

@ -1,16 +0,0 @@
var menu, MenuIO;
(function() {
'use strict';
var element = document.querySelector('#js-menu-container'),
options = {
icon: true
};
menu = MenuIO(element, options, {
'help': function() {
console.log('*help');
}
});
})();

15
modules/menu/example/menu-min.html
View file

@ -1,15 +0,0 @@
<!doctype html>
<html>
<head>
<title>
Menu Example
</title>
<link rel="stylesheet" href="../menu-io.min.css">
<link rel="stylesheet" href="example.css">
</head>
<body>
<div id="js-menu-container" class="menu-container"></div>
<script src="../menu-io.min.js"></script>
<script src="menu-data.js"></script>
</body>
</html>

15
modules/menu/example/menu.html
View file

@ -1,15 +0,0 @@
<!doctype html>
<html>
<head>
<title>
Menu Example
</title>
<link rel="stylesheet" href="../menu-io.css">
<link rel="stylesheet" href="example.css">
</head>
<body>
<div id="js-menu-container" class="menu-container"></div>
<script src="../menu-io.js"></script>
<script src="menu-data.js"></script>
</body>
</html>

74
modules/menu/menu-io.css
View file

@ -1,74 +0,0 @@
.menu-hidden {
display: none;
}
.menu {
position : absolute;
z-index : 2;
padding : 0;
font-size : 14px;
list-style : none;
color : #222;
background : rgb(255, 255, 255);
background : rgba(255, 255, 255, 0.9);
border-color : rgb(49, 123, 249);
border-color : rgba(49, 123, 249, .40);
border-style : solid;
border-width : 1px;
border-radius : 5px;
-webkit-user-select : none;
-moz-user-select : none;
-ms-user-select : none;
-o-user-select : none;
user-select : none;
}
.menu-button {
background: white;
border: 0;
}
.menu-item {
position: relative;
padding: 3px 20px;
white-space: pre;
}
.menu-item::after {
content: attr(data-key);
float: right;
}
.menu-item:hover {
background-color: #e3f2ff;
}
.menu-item > .menu {
top: 0;
left: 100%;
display: none;
}
.menu-item:hover > .menu {
display: block;
}
.menu-submenu > label::after {
display: block;
float: right;
width: 0;
height: 0;
margin-top: 3px;
margin-right: -10px;
border-color: transparent;
border-left-color: rgb(49, 123, 249);
border-style: solid;
border-width: 5px 0 5px 5px;
content: " ";
}

434
modules/menu/menu-io.js
View file

@ -1,434 +0,0 @@
var MenuIO;
(function (window) {
'use strict';
MenuIO = function(element, options, menuData) {
if (!(this instanceof MenuIO)) {
return new MenuIO(element, options, menuData);
}
var ElementMenu,
Element,
Options = {},
ElementFuncs = new ElementFuncsProto(),
ElementHeight,
ElementWidth,
ElementEvent,
MenuFuncs = {},
TEMPLATE = {
MAIN: '<ul data-name="js-menu" class="menu menu-hidden">' +
'{{ items }}' +
'</ul>',
ITEM: '<li data-name="js-menu-item" class="menu-item{{ className }}"{{ attribute }}>' +
'<label data-menu-path="{{ path }}">{{ name }}</label>' +
'{{ subitems }}' +
'</li>'
};
if (menuData) {
Element =
ElementEvent = element;
Options = options;
} else if (options) {
Element =
ElementEvent = element;
menuData = options;
} else {
Element = document.body;
ElementEvent = window;
menuData = element;
}
function init() {
var name,
isObj = typeof menuData === 'object';
if (!isObj) {
name = menuData;
menuData = {};
menuData[name] = null;
}
ElementMenu = createMenu(menuData);
ElementEvent.addEventListener('click', onClick);
ElementEvent.addEventListener('contextmenu', onContextMenu);
}
function createMenu(menuData) {
var menu,
items = '',
buildItems = function(menuData, path) {
var DATA_MENU = 'data-menu="js-submenu"',
Data_KEY = 'data-key=',
items = '';
if (path)
path += '.';
else
path = '';
Object.keys(menuData).forEach(function(name) {
var nameIcon,
key = '',
subitems = '',
className = '',
attribute = '',
pathName = path + name,
data = menuData[name],
isObj = typeof data === 'object';
if (!isObj) {
MenuFuncs[pathName] = data;
} else {
subitems = rendy(TEMPLATE.MAIN, {
items: buildItems(data, pathName)
});
className = ' menu-submenu';
attribute = ' ' + DATA_MENU;
}
if (Options.icon) {
nameIcon = name
.replace(/\(|\)/g, '')
.replace(/\s/g, '-')
.toLowerCase();
className += ' icon icon-' + nameIcon;
}
if (Options.keys) {
key = Options.keys[name];
if (key)
attribute = ' ' + Data_KEY + key;
}
items += rendy(TEMPLATE.ITEM, {
name : name,
subitems : subitems,
className : className,
attribute : attribute,
path : pathName
});
});
return items;
};
items = buildItems(menuData);
menu = document.createElement('ul');
menu.setAttribute('data-name', 'js-menu');
menu.className = 'menu menu-hidden';
menu.innerHTML = items;
Element.appendChild(menu);
return menu;
}
this.show = showMenuElement;
this.hide = hideMenuElement;
function checkElement(target, position) {
var is,
element = ElementFuncs.getItem(target),
isName = ElementFuncs.isName(element),
isItem = ElementFuncs.isItem(element),
isSub = ElementFuncs.isSubMenu(element);
if (!isName || !isItem) {
element = document.elementFromPoint(position.x, position.y);
isSub = ElementFuncs.isSubMenu(element);
isName = ElementFuncs.isName(element);
isItem = ElementFuncs.isItem(element);
}
is = {
name : isName,
item : isItem,
sub : isSub,
};
return is;
}
function onClick(event, checkResult) {
var itemData, notClick,
afterClick = Options.afterClick,
beforeClick = Options.beforeClick,
name = Options.name,
element = event.target,
is = checkResult || checkElement(element, {
x: event.clientX,
y: event.clientY
});
notClick = exec(beforeClick, name);
if (is.sub) {
event.preventDefault();
} else {
hideMenuElement();
if (!notClick && (is.name || is.item)) {
itemData = getMenuItemData(element);
exec(itemData);
exec(afterClick);
}
}
}
function onContextMenu(event) {
var element = event.target,
x = event.clientX,
y = event.clientY,
is = checkElement(element, {
x: x,
y: y
});
if (is.name || is.item || is.sub)
onClick(event, is);
else {
hideMenuElement();
showMenuElement(x, y);
}
event.preventDefault();
}
function setMenuPosition(x, y) {
var isNumberX = typeof x === 'number',
isNumberY = typeof y === 'number',
heightMenu = getMenuHeight(),
widthMenu = getMenuWidth(),
heightInner = window.innerHeight,
widthInner = window.innerWidth;
if (widthInner < widthMenu + x) {
x -= widthMenu;
if (x < 0)
x = 0;
}
if (heightInner < heightMenu + y) {
y -= heightMenu;
if (y < 0)
y = 0;
}
if (isNumberX)
ElementMenu.style.left = x + 'px';
if (isNumberY)
ElementMenu.style.top = y - 14 + 'px';
}
function showMenuElement(x, y) {
var beforeShow = Options.beforeShow,
name = Options.name,
params = {
x : x,
y : y,
name : name
},
notShow = exec(beforeShow, params);
if (!notShow) {
ElementMenu.classList.remove('menu-hidden');
setMenuPosition(params.x, params.y);
}
}
function hideMenuElement() {
var notHide = exec(Options.beforeClose);
if (!notHide)
ElementMenu.classList.add('menu-hidden');
}
function getMenuItemData(element) {
var path, data;
element = ElementFuncs.getName(element);
if (element) {
path = element.getAttribute('data-menu-path');
}
data = MenuFuncs[path];
return data;
}
function getMenuHeight() {
var styleComputed, height;
if (!ElementHeight) {
styleComputed = getComputedStyle(ElementMenu);
height = styleComputed.height;
ElementHeight = parseInt(height, 10);
}
return ElementHeight;
}
function getMenuWidth() {
var styleComputed, width;
if (!ElementWidth) {
styleComputed = getComputedStyle(ElementMenu);
width = styleComputed.width;
ElementWidth = parseInt(width, 10);
}
return ElementWidth;
}
init();
};
function ElementFuncsProto() {
this.getItem = getItem;
this.getName = getName;
this.isName = isName;
this.isItem = isItem;
this.isMenu = isMenu;
this.isSubMenu = isSubMenu;
function getItem(element) {
var isNameElement;
if (element) {
isNameElement = isName(element);
if (isNameElement)
element = element.parentElement;
}
return element;
}
function getName(element) {
var is;
if (element) {
is = isName(element);
if (!is)
element = element.querySelector('[data-menu-path]');
}
return element;
}
function isName(element) {
var itIs;
if (element)
itIs = element.hasAttribute('data-menu-path');
return itIs;
}
function isItem(element) {
var itIs = checkElementsName(element, 'js-menu-item');
return itIs;
}
function isMenu(element) {
var itIs = checkElementsName(element, 'js-menu');
return itIs;
}
function checkElementsName(element, nameElement, attribute) {
var itIs, name;
if (!attribute)
attribute = 'data-name';
if (element) {
name = element.getAttribute(attribute);
if (name === nameElement)
itIs = true;
}
return itIs;
}
function isSubMenu(element) {
var itIs, item,
attribute = 'data-menu',
value = 'js-submenu';
item = getItem(element);
itIs = checkElementsName(item, value, attribute);
return itIs;
}
}
function exec(callback) {
var ret,
args = [].slice.call(arguments, 1);
if (typeof callback === 'function')
ret = callback.apply(null, args);
return ret;
}
/*
* rendy v1.1.0
* https://github.com/coderaiser/rendy
*/
/**
* render template with data
*
* @param templ
* @param data
*/
function rendy(templ, data) {
var result = templ;
check(templ, data);
Object
.keys(data)
.forEach(function(param) {
var name = '{{ ' + param + ' }}',
str = data[param];
while(~result.indexOf(name))
result = result.replace(name, str);
});
if (~result.indexOf('{{'))
result = result.replace(/{{.*?}}/g, '');
return result;
}
function check(templ, data) {
if (typeof templ !== 'string')
throw(Error('template should be string!'));
if (typeof data !== 'object')
throw(Error('data should be object!'));
}
})(window);

1
modules/menu/menu-io.min.css vendored
View file

@ -1 +0,0 @@
.menu-hidden{display:none}.menu{position:absolute;z-index:2;padding:0;font-size:14px;list-style:none;color:#222;background:#fff;background:rgba(255,255,255,.9);border-color:#317bf9;border-color:rgba(49,123,249,.4);border-style:solid;border-width:1px;border-radius:5px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none}.menu-button{background:#fff;border:0}.menu-item{position:relative;padding:3px 20px;white-space:pre}.menu-item::after{content:attr(data-key);float:right}.menu-item:hover{background-color:#e3f2ff}.menu-item>.menu{top:0;left:100%;display:none}.menu-item:hover>.menu{display:block}.menu-submenu>label::after{display:block;float:right;width:0;height:0;margin-top:3px;margin-right:-10px;border-color:transparent;border-left-color:#317bf9;border-style:solid;border-width:5px 0 5px 5px;content:" "}

1
modules/menu/menu-io.min.js vendored
View file

@ -1 +0,0 @@
var MenuIO;!function(e){"use strict";function t(){function e(e){var t;return e&&(t=n(e),t&&(e=e.parentElement)),e}function t(e){var t;return e&&(t=n(e),t||(e=e.querySelector("[data-menu-path]"))),e}function n(e){var t;return e&&(t=e.hasAttribute("data-menu-path")),t}function a(e){var t=r(e,"js-menu-item");return t}function u(e){var t=r(e,"js-menu");return t}function r(e,t,n){var a,u;return n||(n="data-name"),e&&(u=e.getAttribute(n),u===t&&(a=!0)),a}function i(t){var n,a,u="data-menu",i="js-submenu";return a=e(t),n=r(a,i,u)}this.getItem=e,this.getName=t,this.isName=n,this.isItem=a,this.isMenu=u,this.isSubMenu=i}function n(e){var t,n=[].slice.call(arguments,1);return"function"==typeof e&&(t=e.apply(null,n)),t}function a(e,t){var n=e;return u(e,t),Object.keys(t).forEach(function(e){for(var a="{{ "+e+" }}",u=t[e];~n.indexOf(a);)n=n.replace(a,u)}),~n.indexOf("{{")&&(n=n.replace(/{{.*?}}/g,"")),n}function u(e,t){if("string"!=typeof e)throw Error("template should be string!");if("object"!=typeof t)throw Error("data should be object!")}MenuIO=function(u,r,i){function s(){var e,t="object"==typeof i;t||(e=i,i={},i[e]=null),y=o(i),M.addEventListener("click",c),M.addEventListener("contextmenu",f)}function o(e){var t,n="",u=function(e,t){var n='data-menu="js-submenu"',r="data-key=",i="";return t?t+=".":t="",Object.keys(e).forEach(function(s){var o,m="",c="",f="",l="",d=t+s,h=e[s],b="object"==typeof h;b?(c=a(N.MAIN,{items:u(h,d)}),f=" menu-submenu",l=" "+n):E[d]=h,w.icon&&(o=s.replace(/\(|\)/g,"").replace(/\s/g,"-").toLowerCase(),f+=" icon icon-"+o),w.keys&&(m=w.keys[s],m&&(l=" "+r+m)),i+=a(N.ITEM,{name:s,subitems:c,className:f,attribute:l,path:d})}),i};return n=u(e),t=document.createElement("ul"),t.setAttribute("data-name","js-menu"),t.className="menu menu-hidden",t.innerHTML=n,g.appendChild(t),t}function m(e,t){var n,a=x.getItem(e),u=x.isName(a),r=x.isItem(a),i=x.isSubMenu(a);return u&&r||(a=document.elementFromPoint(t.x,t.y),i=x.isSubMenu(a),u=x.isName(a),r=x.isItem(a)),n={name:u,item:r,sub:i}}function c(e,t){var a,u,r=w.afterClick,i=w.beforeClick,s=w.name,o=e.target,c=t||m(o,{x:e.clientX,y:e.clientY});u=n(i,s),c.sub?e.preventDefault():(h(),u||!c.name&&!c.item||(a=b(o),n(a),n(r)))}function f(e){var t=e.target,n=e.clientX,a=e.clientY,u=m(t,{x:n,y:a});u.name||u.item||u.sub?c(e,u):(h(),d(n,a)),e.preventDefault()}function l(t,n){var a="number"==typeof t,u="number"==typeof n,r=p(),i=v(),s=e.innerHeight,o=e.innerWidth;i+t>o&&(t-=i,0>t&&(t=0)),r+n>s&&(n-=r,0>n&&(n=0)),a&&(y.style.left=t+"px"),u&&(y.style.top=n-14+"px")}function d(e,t){var a=w.beforeShow,u=w.name,r={x:e,y:t,name:u},i=n(a,r);i||(y.classList.remove("menu-hidden"),l(r.x,r.y))}function h(){var e=n(w.beforeClose);e||y.classList.add("menu-hidden")}function b(e){var t,n;return e=x.getName(e),e&&(t=e.getAttribute("data-menu-path")),n=E[t]}function p(){var e,t;return I||(e=getComputedStyle(y),t=e.height,I=parseInt(t,10)),I}function v(){var e,t;return j||(e=getComputedStyle(y),t=e.width,j=parseInt(t,10)),j}if(!(this instanceof MenuIO))return new MenuIO(u,r,i);var y,g,I,j,M,w={},x=new t,E={},N={MAIN:'<ul data-name="js-menu" class="menu menu-hidden">{{ items }}</ul>',ITEM:'<li data-name="js-menu-item" class="menu-item{{ className }}"{{ attribute }}><label data-menu-path="{{ path }}">{{ name }}</label>{{ subitems }}</li>'};i?(g=M=u,w=r):r?(g=M=u,i=r):(g=document.body,M=e,i=u),this.show=d,this.hide=h,s()}}(window);

33
modules/menu/package.json
View file

@ -1,33 +0,0 @@
{
"name": "menu",
"version": "1.0.2",
"private": true,
"branch": "gh-pages",
"author": "coderaiser <mnemonic.enemy@gmail.com> (https://github.com/coderaiser)",
"description": "Simple css-based multillevel context menu",
"homepage": "http://coderaiser.github.io/menu",
"repository": {
"type": "git",
"url": "git://github.com/coderaiser/menu-io.git"
},
"scripts": {
"test": "npm run lint:css && gulp default",
"lint:css": "stylelint menu-io.css",
"wisdom": "npm test"
},
"devDependencies": {
"gulp": "^3.8.8",
"gulp-concat": "^2.2.0",
"gulp-jshint": "^1.5.3",
"gulp-minify-css": "^0.3.1",
"gulp-recess": "^0.3.0",
"gulp-rename": "^1.2.0",
"gulp-uglify": "^0.2.1",
"stylelint": "^4.4.0",
"stylelint-config-standard": "^3.0.0"
},
"license": "MIT",
"engines": {
"node": ">=0.12"
}
}

1
package.json
View file

@ -199,6 +199,7 @@
"style-loader": "^0.21.0",
"stylelint": "^9.0.0",
"stylelint-config-standard": "^18.0.0",
"supermenu": "^2.0.0",
"tape": "^4.4.0",
"tar-stream": "^1.5.2",
"url-loader": "^1.0.1",