mirror of
https://github.com/amark/gun.git
synced 2025-06-06 06:06:50 +00:00
meta lib: removes extra indentation
This commit is contained in:
Jussi Rytkönen
parent
badb490d50
commit
4a66bface6
544
lib/meta.js
544
lib/meta.js
@ -12,281 +12,281 @@
|
|||||||
|
|
||||||
/* UNBUILD */
|
/* UNBUILD */
|
||||||
;USE(function(module){
|
;USE(function(module){
|
||||||
var noop = function(){}, u;
|
var noop = function(){}, u;
|
||||||
$.fn.or = function(s){ return this.length ? this : $(s||'body') };
|
$.fn.or = function(s){ return this.length ? this : $(s||'body') };
|
||||||
var m = window.meta = {edit:[]};
|
var m = window.meta = {edit:[]};
|
||||||
var k = m.key = {};
|
var k = m.key = {};
|
||||||
k.meta = {17:17, 91:17, 93:17, 224:17, 18: 17}; // ALT added
|
k.meta = {17:17, 91:17, 93:17, 224:17, 18: 17}; // ALT added
|
||||||
function withMeta(eve){ return eve.metaKey || eve.ctrlKey || eve.altKey } // ALT added
|
function withMeta(eve){ return eve.metaKey || eve.ctrlKey || eve.altKey } // ALT added
|
||||||
k.down = function(eve){
|
k.down = function(eve){
|
||||||
var key = (k.eve = m.eve = eve).which = eve.which || eve.fake || eve.keyCode;
|
var key = (k.eve = m.eve = eve).which = eve.which || eve.fake || eve.keyCode;
|
||||||
if(eve.repeat){ return }
|
if(eve.repeat){ return }
|
||||||
if(!k.meta[key] && withMeta(eve) && !k.at[key]) {
|
if(!k.meta[key] && withMeta(eve) && !k.at[key]) {
|
||||||
return m.flip(false)
|
return m.flip(false)
|
||||||
} // cancel and close when no action and "meta key" held down (e.g. ctrl+c)
|
} // cancel and close when no action and "meta key" held down (e.g. ctrl+c)
|
||||||
if(!eve.fake && key === k.last){ return }; k.last = key; // jussi: polyfilling eve.repeat?
|
if(!eve.fake && key === k.last){ return }; k.last = key; // jussi: polyfilling eve.repeat?
|
||||||
if(!eve.fake && $(eve.target).closest('input, textarea, [contenteditable=true]').length && !$(eve.target).closest('#meta').length){
|
if(!eve.fake && $(eve.target).closest('input, textarea, [contenteditable=true]').length && !$(eve.target).closest('#meta').length){
|
||||||
if(meta.flip.is() && !withMeta(eve)) eve.preventDefault()
|
if(meta.flip.is() && !withMeta(eve)) eve.preventDefault()
|
||||||
}
|
}
|
||||||
m.check('on', key, k.at || (k.at = m.edit));
|
m.check('on', key, k.at || (k.at = m.edit));
|
||||||
if(k.meta[key]){ m.flip() }
|
if(k.meta[key]){ m.flip() }
|
||||||
}
|
}
|
||||||
k.down.keys = {} // currently pressed keys
|
k.down.keys = {} // currently pressed keys
|
||||||
k.up = function(eve){ var tmp;
|
k.up = function(eve){ var tmp;
|
||||||
var key = (k.eve = m.eve = eve).which = eve.which || eve.fake || eve.keyCode;
|
var key = (k.eve = m.eve = eve).which = eve.which || eve.fake || eve.keyCode;
|
||||||
k.last = null;
|
k.last = null;
|
||||||
m.check('up', key);
|
m.check('up', key);
|
||||||
if(k.meta[key] && m.check.fired){
|
if(k.meta[key] && m.check.fired){
|
||||||
m.close()
|
m.close()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
m.flip = function(tmp){
|
m.flip = function(tmp){
|
||||||
m.flip.active = true;
|
m.flip.active = true;
|
||||||
((tmp === false) || (!tmp && m.ui.board.is(':visible')))?
|
((tmp === false) || (!tmp && m.ui.board.is(':visible')))?
|
||||||
m.close() : m.open();
|
m.close() : m.open();
|
||||||
m.flip.active = false;
|
m.flip.active = false;
|
||||||
}
|
}
|
||||||
m.open = function(){
|
m.open = function(){
|
||||||
m.check.fired = null;
|
m.check.fired = null;
|
||||||
m.ui.board.removeClass('meta-none');
|
m.ui.board.removeClass('meta-none');
|
||||||
}
|
}
|
||||||
m.close = function(){
|
m.close = function(){
|
||||||
Object.keys(k.down.keys).forEach((keyDown) => {
|
Object.keys(k.down.keys).forEach((keyDown) => {
|
||||||
m.check('up', keyDown);
|
m.check('up', keyDown);
|
||||||
})
|
})
|
||||||
m.ui.board.addClass('meta-none')
|
m.ui.board.addClass('meta-none')
|
||||||
}
|
}
|
||||||
m.flip.is = function(){
|
m.flip.is = function(){
|
||||||
return m.ui.board.is(':visible');
|
return m.ui.board.is(':visible');
|
||||||
}
|
}
|
||||||
m.flip.wait = 500;
|
m.flip.wait = 500;
|
||||||
m.check = function(how, key, at){
|
m.check = function(how, key, at){
|
||||||
if(!m.flip.is() && !k.meta[key]){ return } // TEMP: cancel non-open events when closed TODO make optional
|
if(!m.flip.is() && !k.meta[key]){ return } // TEMP: cancel non-open events when closed TODO make optional
|
||||||
at = k.at || m.edit;
|
at = k.at || m.edit;
|
||||||
var next = at[key];
|
var next = at[key];
|
||||||
if(!next){ return }
|
if(!next){ return }
|
||||||
var tmp = k.eve || noop;
|
var tmp = k.eve || noop;
|
||||||
if(tmp.preventDefault){ tmp.preventDefault()} // prevent typing (etc) when action found
|
if(tmp.preventDefault){ tmp.preventDefault()} // prevent typing (etc) when action found
|
||||||
if(next[how]){
|
if(next[how]){
|
||||||
next[how](m.eve);
|
next[how](m.eve);
|
||||||
meta.ui.blink();
|
meta.ui.blink();
|
||||||
m.check.fired = true;
|
m.check.fired = true;
|
||||||
if(how == 'up') delete k.down.keys[key]
|
if(how == 'up') delete k.down.keys[key]
|
||||||
else k.down.keys[key] = 1;
|
else k.down.keys[key] = 1;
|
||||||
}
|
}
|
||||||
if('up' == how){ return }
|
if('up' == how){ return }
|
||||||
if(at != next && !next.back){ next.back = at }
|
if(at != next && !next.back){ next.back = at }
|
||||||
(k.combo || (k.combo = [])).push(key);
|
(k.combo || (k.combo = [])).push(key);
|
||||||
m.list(next, true);
|
m.list(next, true);
|
||||||
}
|
}
|
||||||
function defaultSort(a,b){
|
function defaultSort(a,b){
|
||||||
a = a.combo.slice(-1)[0] || 0;
|
a = a.combo.slice(-1)[0] || 0;
|
||||||
if(a.length){ a = a.toUpperCase().charCodeAt(0) }
|
if(a.length){ a = a.toUpperCase().charCodeAt(0) }
|
||||||
b = b.combo.slice(-1)[0] || 0;
|
b = b.combo.slice(-1)[0] || 0;
|
||||||
if(b.length){ b = b.toUpperCase().charCodeAt(0) }
|
if(b.length){ b = b.toUpperCase().charCodeAt(0) }
|
||||||
return (a < b)? -1 : 1;
|
return (a < b)? -1 : 1;
|
||||||
}
|
}
|
||||||
m.list = function(at, opt){
|
m.list = function(at, opt){
|
||||||
if(!at){ return m.flip(false) }
|
if(!at){ return m.flip(false) }
|
||||||
var l = [];
|
var l = [];
|
||||||
$.each(at, function(i,k){ 'back' != i && k && k.combo && k.name && l.push(k) });
|
$.each(at, function(i,k){ 'back' != i && k && k.combo && k.name && l.push(k) });
|
||||||
if(!l.length){ return }
|
if(!l.length){ return }
|
||||||
k.at = at;
|
k.at = at;
|
||||||
if(at.sort !== null){ l = l.sort(at.sort || defaultSort) }
|
if(at.sort !== null){ l = l.sort(at.sort || defaultSort) }
|
||||||
var $ul = $('#meta .meta-menu ul')
|
var $ul = $('#meta .meta-menu ul')
|
||||||
$ul.children('li').addClass('meta-none').hide(); setTimeout(function(){ $ul.children('.meta-none').remove() },250); // necessary fix for weird bug glitch
|
$ul.children('li').addClass('meta-none').hide(); setTimeout(function(){ $ul.children('.meta-none').remove() },250); // necessary fix for weird bug glitch
|
||||||
$.each(l, function(i, k){
|
$.each(l, function(i, k){
|
||||||
var $li = $('<li>').text(k.name).data(k)
|
var $li = $('<li>').text(k.name).data(k)
|
||||||
$ul.append($li);
|
$ul.append($li);
|
||||||
if(k.styles) meta.ui.iniline($li[0], k.styles);
|
if(k.styles) meta.ui.iniline($li[0], k.styles);
|
||||||
});
|
});
|
||||||
if(opt){ m.flip(true) }
|
if(opt){ m.flip(true) }
|
||||||
$ul.append($('<li>').html('←').on('click', back));
|
$ul.append($('<li>').html('←').on('click', back));
|
||||||
}
|
}
|
||||||
m.ask = function(help, cb){
|
m.ask = function(help, cb){
|
||||||
var $ul = $('#meta .meta-menu ul').empty();
|
var $ul = $('#meta .meta-menu ul').empty();
|
||||||
var $put = $('<input>').attr('id', 'meta-ask').attr('placeholder', help);
|
var $put = $('<input>').attr('id', 'meta-ask').attr('placeholder', help);
|
||||||
var $form = $('<form>').append($put).on('submit', function(eve){
|
var $form = $('<form>').append($put).on('submit', function(eve){
|
||||||
eve.preventDefault();
|
eve.preventDefault();
|
||||||
cb($put.val());
|
cb($put.val());
|
||||||
$li.remove();
|
$li.remove();
|
||||||
k.wipe();
|
k.wipe();
|
||||||
});
|
});
|
||||||
var $li = $('<li>').append($form);
|
var $li = $('<li>').append($form);
|
||||||
$ul.append($li);
|
$ul.append($li);
|
||||||
m.flip(true);
|
m.flip(true);
|
||||||
$put.focus();
|
$put.focus();
|
||||||
}
|
}
|
||||||
k.wipe = function(opt){
|
k.wipe = function(opt){
|
||||||
k.combo = [];
|
k.combo = [];
|
||||||
if(!opt){ m.flip(false) }
|
if(!opt){ m.flip(false) }
|
||||||
m.list(k.at = m.edit);
|
m.list(k.at = m.edit);
|
||||||
};
|
};
|
||||||
m.tap = function(){
|
m.tap = function(){
|
||||||
var on = $('.meta-on')
|
var on = $('.meta-on')
|
||||||
.or($($(document.querySelectorAll(':hover')).get().reverse()).first())
|
.or($($(document.querySelectorAll(':hover')).get().reverse()).first())
|
||||||
.or($(document.elementFromPoint(meta.tap.x, meta.tap.y)));
|
.or($(document.elementFromPoint(meta.tap.x, meta.tap.y)));
|
||||||
return on;
|
return on;
|
||||||
}
|
}
|
||||||
meta.edit = function(e){
|
meta.edit = function(e){
|
||||||
var path = [];
|
var path = [];
|
||||||
$.each(e.combo || (e.combo = []), function(i,k){
|
$.each(e.combo || (e.combo = []), function(i,k){
|
||||||
if(!k || !k.length){ if('number' == typeof k){ path.push(k) } return }
|
if(!k || !k.length){ if('number' == typeof k){ path.push(k) } return }
|
||||||
path.push(k.toUpperCase().charCodeAt(0));
|
path.push(k.toUpperCase().charCodeAt(0));
|
||||||
});
|
});
|
||||||
var at = meta.edit, l = e.combo.length;
|
var at = meta.edit, l = e.combo.length;
|
||||||
$.each(path, function(i,k){ at = at[k] = at[k] || Object.create(defaults) });
|
$.each(path, function(i,k){ at = at[k] = at[k] || Object.create(defaults) });
|
||||||
$.extend(at, e) // fixes overwriting when sub action is defined before parent
|
$.extend(at, e) // fixes overwriting when sub action is defined before parent
|
||||||
e.combow = path.join(','); // deprecate?
|
e.combow = path.join(','); // deprecate?
|
||||||
m.list(k.at || meta.edit);
|
m.list(k.at || meta.edit);
|
||||||
}
|
}
|
||||||
function back(){ // close root or go back on submenu
|
function back(){ // close root or go back on submenu
|
||||||
k.at == m.edit ? m.flip(false) : m.check('down', 'back')
|
k.at == m.edit ? m.flip(false) : m.check('down', 'back')
|
||||||
}
|
}
|
||||||
var defaults = {
|
var defaults = {
|
||||||
8: { on: back }, // backspace
|
8: { on: back }, // backspace
|
||||||
27: { up: k.wipe } // esc: close and reset menu
|
27: { up: k.wipe } // esc: close and reset menu
|
||||||
}
|
}
|
||||||
$.extend(meta.edit, defaults)
|
$.extend(meta.edit, defaults)
|
||||||
})(USE, './metaCore');
|
})(USE, './metaCore');
|
||||||
;USE(function(module){
|
;USE(function(module){
|
||||||
/* UI */
|
/* UI */
|
||||||
meta.ui = {
|
meta.ui = {
|
||||||
blink: function(){ // hint visually that action has happened
|
blink: function(){ // hint visually that action has happened
|
||||||
$('#meta').css('transition', 'none').css('background', 'none')
|
$('#meta').css('transition', 'none').css('background', 'none')
|
||||||
setTimeout(function(){
|
setTimeout(function(){
|
||||||
$('#meta')[0].style.transition = null
|
$('#meta')[0].style.transition = null
|
||||||
$('#meta')[0].style.background = null
|
$('#meta')[0].style.background = null
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
depth: function(n){
|
depth: function(n){
|
||||||
if (n) {
|
if (n) {
|
||||||
$('#meta').css('background', 'hsl(60, 100%,'+(85-(n*10))+'%)');
|
$('#meta').css('background', 'hsl(60, 100%,'+(85-(n*10))+'%)');
|
||||||
} else {
|
} else {
|
||||||
$('#meta')[0].style.background = null
|
$('#meta')[0].style.background = null
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
var $m = $('<div>').attr('id', 'meta');
|
var $m = $('<div>').attr('id', 'meta');
|
||||||
$m.append($('<span>').html('☰').addClass('meta-start'));
|
$m.append($('<span>').html('☰').addClass('meta-start'));
|
||||||
$m.append($('<div>').addClass('meta-menu meta-none').append('<ul>'));
|
$m.append($('<div>').addClass('meta-menu meta-none').append('<ul>'));
|
||||||
$m.on('mouseenter', function(){
|
$m.on('mouseenter', function(){
|
||||||
if (meta.flip.active || meta.flip.is()) return;
|
if (meta.flip.active || meta.flip.is()) return;
|
||||||
meta.flip();
|
meta.flip();
|
||||||
})
|
})
|
||||||
$m.on('mouseleave', function(){
|
$m.on('mouseleave', function(){
|
||||||
if (meta.flip.active || !meta.flip.is()) return;
|
if (meta.flip.active || !meta.flip.is()) return;
|
||||||
meta.flip(false);
|
meta.flip(false);
|
||||||
})
|
})
|
||||||
$(document.body).append($m);
|
$(document.body).append($m);
|
||||||
meta.ui.board = $('.meta-menu', $m);
|
meta.ui.board = $('.meta-menu', $m);
|
||||||
css({
|
css({
|
||||||
'#meta': {
|
'#meta': {
|
||||||
display: 'block',
|
display: 'block',
|
||||||
position: 'fixed',
|
position: 'fixed',
|
||||||
bottom: '2em',
|
bottom: '2em',
|
||||||
right: '2em',
|
right: '2em',
|
||||||
background: 'white',
|
background: 'white',
|
||||||
'font-size': '18pt',
|
'font-size': '18pt',
|
||||||
'font-family': 'Tahoma, arial',
|
'font-family': 'Tahoma, arial',
|
||||||
'border-radius': '1em',
|
'border-radius': '1em',
|
||||||
'text-align': 'center',
|
'text-align': 'center',
|
||||||
'z-index': 999999,
|
'z-index': 999999,
|
||||||
margin: 0,
|
margin: 0,
|
||||||
padding: 0,
|
padding: 0,
|
||||||
width: '2em',
|
width: '2em',
|
||||||
height: '2em',
|
height: '2em',
|
||||||
outline: 'none',
|
outline: 'none',
|
||||||
color: '#000044',
|
color: '#000044',
|
||||||
overflow: 'visible',
|
overflow: 'visible',
|
||||||
transition: 'all 0.2s ease-in'
|
transition: 'all 0.2s ease-in'
|
||||||
},
|
},
|
||||||
'#meta *': {outline: 'none'},
|
'#meta *': {outline: 'none'},
|
||||||
'#meta .meta-none': {display: 'none'},
|
'#meta .meta-none': {display: 'none'},
|
||||||
'#meta span': {'line-height': '2em'},
|
'#meta span': {'line-height': '2em'},
|
||||||
'#meta .meta-menu': {
|
'#meta .meta-menu': {
|
||||||
background: 'rgba(0,0,0,0.1)',
|
background: 'rgba(0,0,0,0.1)',
|
||||||
width: '12em',
|
width: '12em',
|
||||||
right: '-2em',
|
right: '-2em',
|
||||||
bottom: '-2em',
|
bottom: '-2em',
|
||||||
overflow: 'visible',
|
overflow: 'visible',
|
||||||
position: 'absolute',
|
position: 'absolute',
|
||||||
'overflow-y': 'scroll',
|
'overflow-y': 'scroll',
|
||||||
'text-align': 'right',
|
'text-align': 'right',
|
||||||
'min-height': '20em',
|
'min-height': '20em',
|
||||||
height: '100vh'
|
height: '100vh'
|
||||||
},
|
},
|
||||||
'#meta .meta-menu ul': {
|
'#meta .meta-menu ul': {
|
||||||
padding: 0,
|
padding: 0,
|
||||||
margin: '1em 1em 2em 0',
|
margin: '1em 1em 2em 0',
|
||||||
'list-style-type': 'none'
|
'list-style-type': 'none'
|
||||||
},
|
},
|
||||||
'#meta .meta-menu ul li': {
|
'#meta .meta-menu ul li': {
|
||||||
display: 'block',
|
display: 'block',
|
||||||
'float': 'right',
|
'float': 'right',
|
||||||
background: 'white',
|
background: 'white',
|
||||||
opacity: 0.7,
|
opacity: 0.7,
|
||||||
padding: '0.5em 1em',
|
padding: '0.5em 1em',
|
||||||
'border-radius': '1em',
|
'border-radius': '1em',
|
||||||
'margin-left': '0.25em',
|
'margin-left': '0.25em',
|
||||||
'margin-top': '0.25em',
|
'margin-top': '0.25em',
|
||||||
'cursor': 'pointer'
|
'cursor': 'pointer'
|
||||||
},
|
},
|
||||||
'#meta .meta-menu ul li:hover': {
|
'#meta .meta-menu ul li:hover': {
|
||||||
opacity: 1
|
opacity: 1
|
||||||
},
|
},
|
||||||
'#meta a': {color: 'black'},
|
'#meta a': {color: 'black'},
|
||||||
'#meta .meta-menu ul:before': {
|
'#meta .meta-menu ul:before': {
|
||||||
content: "' '",
|
content: "' '",
|
||||||
display: 'block',
|
display: 'block',
|
||||||
'min-height': '15em',
|
'min-height': '15em',
|
||||||
height: '50vh'
|
height: '50vh'
|
||||||
},
|
},
|
||||||
'#meta .meta-start': {
|
'#meta .meta-start': {
|
||||||
cursor: 'pointer'
|
cursor: 'pointer'
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
function css(css){
|
function css(css){
|
||||||
var tmp = '';
|
var tmp = '';
|
||||||
$.each(css, function(c,r){
|
$.each(css, function(c,r){
|
||||||
tmp += c + ' {\n';
|
tmp += c + ' {\n';
|
||||||
$.each(r, function(k,v){
|
$.each(r, function(k,v){
|
||||||
tmp += '\t'+ k +': '+ v +';\n';
|
tmp += '\t'+ k +': '+ v +';\n';
|
||||||
});
|
});
|
||||||
tmp += '}\n';
|
tmp += '}\n';
|
||||||
});
|
});
|
||||||
var tag = document.createElement('style');
|
var tag = document.createElement('style');
|
||||||
tag.innerHTML = tmp;
|
tag.innerHTML = tmp;
|
||||||
$m.append(tag)
|
$m.append(tag)
|
||||||
}
|
}
|
||||||
meta.ui.iniline = function(el, cssObj){
|
meta.ui.iniline = function(el, cssObj){
|
||||||
for(var k in cssObj) { el.style[k] = cssObj[k]; }
|
for(var k in cssObj) { el.style[k] = cssObj[k]; }
|
||||||
}
|
}
|
||||||
})(USE, './metaUI');
|
})(USE, './metaUI');
|
||||||
;USE(function(module){
|
;USE(function(module){
|
||||||
var m = meta, k = m.key;
|
var m = meta, k = m.key;
|
||||||
$(window).on('focus', k.wipe.bind(null, false)); // .on('blur', k.wipe.bind(null, false))
|
$(window).on('focus', k.wipe.bind(null, false)); // .on('blur', k.wipe.bind(null, false))
|
||||||
$(document).on('mousedown mousemove mouseup', function(eve){
|
$(document).on('mousedown mousemove mouseup', function(eve){
|
||||||
m.tap.eve = eve;
|
m.tap.eve = eve;
|
||||||
m.tap.x = eve.pageX||0;
|
m.tap.x = eve.pageX||0;
|
||||||
m.tap.y = eve.pageY||0;
|
m.tap.y = eve.pageY||0;
|
||||||
m.tap.on = $(eve.target);
|
m.tap.on = $(eve.target);
|
||||||
})
|
})
|
||||||
var [start, end] = 'ontouchstart' in window
|
var [start, end] = 'ontouchstart' in window
|
||||||
? ['touchstart', 'touchend']
|
? ['touchstart', 'touchend']
|
||||||
: ['mousedown', 'mouseup']
|
: ['mousedown', 'mouseup']
|
||||||
$(document).on(start, '#meta .meta-menu li', function(eve){
|
$(document).on(start, '#meta .meta-menu li', function(eve){
|
||||||
var combo = $(this).data().combo;
|
var combo = $(this).data().combo;
|
||||||
eve.fake = eve.which = combo && combo.slice(-1)[0].toUpperCase().charCodeAt(0);
|
eve.fake = eve.which = combo && combo.slice(-1)[0].toUpperCase().charCodeAt(0);
|
||||||
eve.tap = true;
|
eve.tap = true;
|
||||||
k.down(eve);
|
k.down(eve);
|
||||||
$(document).one(end, () => k.up(eve))
|
$(document).one(end, () => k.up(eve))
|
||||||
return;
|
return;
|
||||||
});
|
});
|
||||||
$(document).on('keydown', k.down).on('keyup', k.up);
|
$(document).on('keydown', k.down).on('keyup', k.up);
|
||||||
$('#meta').on(start, function(ev) {
|
$('#meta').on(start, function(ev) {
|
||||||
if (ev.target.tagName == 'LI' || ev.target.tagName == 'UL') return
|
if (ev.target.tagName == 'LI' || ev.target.tagName == 'UL') return
|
||||||
meta.flip()
|
meta.flip()
|
||||||
})
|
})
|
||||||
})(USE, './metaEvents');
|
})(USE, './metaEvents');
|
||||||
}());
|
}());
|
||||||
Loading…
x
Reference in New Issue
Block a user