16mm
/
mcopy
1
0
Fork 0
Code Issues 14 Pull Requests Projects 2 Releases 13 Wiki Activity

Refactor lib/gui/index.js to use const/let

This commit is contained in:
mmcwilliams 2018-02-01 14:55:20 -05:00
parent 7636e6b913
commit 3ac7733635
1 changed files with 83 additions and 102 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

185
app/lib/ui/index.js
View File

@ -1,10 +1,13 @@
var gui = {}; /* jslint esversion: 6*/
const gui = {};
//GUI //GUI
gui.fmtZero = function (val, len) { gui.fmtZero = function (val, len) {
var raw = val, 'use strict';
str = val + '', const raw = val;
output = '' let str = val + '';
let output = '';
if (raw < 0) { if (raw < 0) {
output = '-' + Array(len - (str.length - 1)).join('0') + str.replace('-', ''); output = '-' + Array(len - (str.length - 1)).join('0') + str.replace('-', '');
} else { } else {
@ -18,17 +21,14 @@ gui.fmtZero = function (val, len) {
return output; return output;
}; };
gui.counterFormat = function (t, normal, prevent) { gui.counterFormat = function (t, normal, prevent) {
var raw = t.value; 'use strict';
const raw = t.value;
t.value = gui.fmtZero(raw, 6); t.value = gui.fmtZero(raw, 6);
if (typeof normal !== 'undefined' && parseInt(raw) !== normal) { if (typeof normal !== 'undefined' && parseInt(raw) !== normal) {
$(t).addClass('changed'); $(t).addClass('changed');
} else { } else {
$(t).removeClass('changed'); $(t).removeClass('changed');
} }
if (typeof prevent === 'undefined') { prevent = false; }
if (!prevent) {
gui.shootGoto(t);
}
}; };
gui.notify = function (title, message) { gui.notify = function (title, message) {
'use strict'; 'use strict';
@ -42,38 +42,16 @@ gui.notify = function (title, message) {
// Response is response from notification // Response is response from notification
}); });
}; };
gui.shootGoto = function (t) {
var elem = $(t),
id = elem.attr('id').split('_'),
val = 0,
comp = 0,
other = {};
if (id[1] === 'cam') {
comp = mcopy.state.camera.pos;
} else if (id[1] === 'proj') {
comp = mcopy.state.projector.pos;
}
if (id[0] === 'shoot') {
other = $('#goto_' + id[1]);
val = parseInt(elem.val()) + comp;
other.val(val);
gui.counterFormat(other[0], comp, true);
//other.trigger('change');
} else if (id[0] === 'goto'){
other = $('#shoot_' + id[1]);
val = parseInt(elem.val()) - comp;
other.val(val);
gui.counterFormat(other[0], undefined, true);
} else {
//ALLOW TO EXECUTE WITH NO RESULTS
//console.log('You screwed up the markup.');
}
};
gui.updateCam = function (t) { gui.updateCam = function (t) {
var val = t.value, 'use strict';
change; const val = t.value;
if (parseInt(val) === mcopy.state.camera.pos) { return false; } let change;
change = confirm('Are you sure you want to set camera counter to ' + val + '?');
if (parseInt(val) === mcopy.state.camera.pos) {
return false;
}
change = confirm(`Are you sure you want to set camera counter to ${val}?`);
if (change) { if (change) {
mcopy.state.camera.pos = parseInt(val); mcopy.state.camera.pos = parseInt(val);
gui.updateState(); gui.updateState();
@ -83,10 +61,13 @@ gui.updateCam = function (t) {
} }
}; };
gui.updateProj = function (t) { gui.updateProj = function (t) {
var val = t.value, 'use strict';
change; const val = t.value;
if (parseInt(val) === mcopy.state.projector.pos) { return false; } let change;
change = confirm('Are you sure you want to set projector counter to ' + val + '?'); if (parseInt(val) === mcopy.state.projector.pos) {
return false;
}
change = confirm(`Are you sure you want to set projector counter to ${val}?`);
if (change) { if (change) {
mcopy.state.projector.pos = parseInt(val); mcopy.state.projector.pos = parseInt(val);
gui.updateState(); gui.updateState();
@ -96,8 +77,9 @@ gui.updateProj = function (t) {
} }
}; };
gui.updateState = function () { gui.updateState = function () {
var cpos = mcopy.state.camera.pos, 'use strict';
ppos = mcopy.state.projector.pos; const cpos = mcopy.state.camera.pos;
const ppos = mcopy.state.projector.pos;
$('#seq_cam_count').val(cpos).change(); $('#seq_cam_count').val(cpos).change();
$('#seq_proj_count').val(ppos).change(); $('#seq_proj_count').val(ppos).change();
@ -122,12 +104,13 @@ gui.spinnerCfg = {
zIndex: 2e9, // The z-index (defaults to 2000000000) zIndex: 2e9, // The z-index (defaults to 2000000000)
top: '50%', // Top position relative to parent top: '50%', // Top position relative to parent
left: '50%' // Left position relative to parent left: '50%' // Left position relative to parent
} };
gui.spinner = function (state, msg = '') { gui.spinner = function (state, msg) {
var target, 'use strict';
spinner; let target;
if (msg !== '') { let spinner;
gui.spinnerMsg(msg) if (msg && msg !== '') {
gui.spinnerMsg(msg);
} }
if (state && !$('#spinner').hasClass('created')) { if (state && !$('#spinner').hasClass('created')) {
target = document.getElementById('spinner'); target = document.getElementById('spinner');
@ -137,14 +120,16 @@ gui.spinner = function (state, msg = '') {
$('#spinner').show(); $('#spinner').show();
} else if (!state) { } else if (!state) {
$('#spinner').hide(); $('#spinner').hide();
gui.spinnerMsg('') gui.spinnerMsg('');
} }
}; };
gui.spinnerMsg = function (msg) { gui.spinnerMsg = function (msg) {
$('#spinnerMsg').text(msg) 'use strict';
} $('#spinnerMsg').text(msg);
};
gui.overlay = function (state) { gui.overlay = function (state) {
'use strict';
if (state) { if (state) {
$('#overlay').show(); $('#overlay').show();
} else { } else {
@ -154,7 +139,7 @@ gui.overlay = function (state) {
gui.info = function (title, message) { gui.info = function (title, message) {
'use strict'; 'use strict';
var config = { const config = {
type : 'info', type : 'info',
buttons : ['Ok'], buttons : ['Ok'],
title: title, title: title,
@ -176,7 +161,7 @@ gui.info = function (title, message) {
gui.confirm = function () {}; gui.confirm = function () {};
gui.warn = function (title, message) { gui.warn = function (title, message) {
'use strict'; 'use strict';
var config = { const config = {
type : 'warning', type : 'warning',
buttons : ['Ok'], buttons : ['Ok'],
title: title, title: title,
@ -204,10 +189,10 @@ gui.mscript.init = function () {
}); });
gui.mscript.editor.setSize(null, $(window).height() - $('footer').eq(0).height() - 30); gui.mscript.editor.setSize(null, $(window).height() - $('footer').eq(0).height() - 30);
gui.mscript.editor.on('change', function (e) { gui.mscript.editor.on('change', function (e) {
var data = gui.mscript.editor.getValue(), const data = gui.mscript.editor.getValue();
output = gui.mscript.parse(data); const output = gui.mscript.parse(data);
}); });
$(document).on('resize', function () { $(document).on('resize', function (e) {
gui.mscript.editor.setSize(null, $(window).height() - $('footer').eq(0).height() - 30); gui.mscript.editor.setSize(null, $(window).height() - $('footer').eq(0).height() - 30);
}); });
}; };
@ -218,9 +203,11 @@ gui.mscript.open = function () {
}; };
gui.mscript.update = function () { gui.mscript.update = function () {
//ehhhhh //ehhhhh
'use strict';
$('#mscript textarea').val(mcopy.state.sequence.arr.join('\n')); $('#mscript textarea').val(mcopy.state.sequence.arr.join('\n'));
}; };
gui.mscript.parse = function (str) { gui.mscript.parse = function (str) {
'use strict';
/*var cmd = 'node mscript.js "' + str + '\n"'; /*var cmd = 'node mscript.js "' + str + '\n"';
gui.mscript.raw = str; gui.mscript.raw = str;
mcopy.exec(cmd, function (data) { mcopy.exec(cmd, function (data) {
@ -248,13 +235,13 @@ gui.console.init = function () {
gui.console.lines = []; gui.console.lines = [];
gui.console.parse = function () { gui.console.parse = function () {
'use strict'; 'use strict';
var lines = gui.console.elem.val().split('\n'), const lines = gui.console.elem.val().split('\n');
line = lines[lines.length - 2].replace('>', '').trim(); const line = lines[lines.length - 2].replace('>', '').trim();
gui.console.lines.push(line); gui.console.lines.push(line);
}; };
gui.console.exec = function () { gui.console.exec = function () {
'use strict'; 'use strict';
var command; let command;
gui.console.parse(); gui.console.parse();
command = gui.console.lines[gui.console.lines.length - 1].replace('>', '').trim(); command = gui.console.lines[gui.console.lines.length - 1].replace('>', '').trim();
console.log(command); console.log(command);
@ -269,7 +256,7 @@ gui.console.exec = function () {
}; };
gui.console.newLine = function () { gui.console.newLine = function () {
'use strict'; 'use strict';
var current = gui.console.elem.val(); let current = gui.console.elem.val();
current += '> '; current += '> ';
gui.console.elem.val(current); gui.console.elem.val(current);
}; };
@ -288,16 +275,15 @@ gui.grid.init = function () {
gui.grid.state = function (i) { gui.grid.state = function (i) {
'use strict'; 'use strict';
var elem = $('input[x=' + i + ']'), const elem = $(`input[x=${i}]`);
lightElem = $('.L' + '[x=' + i + ']'); const lightElem = $(`.L[x=${i}]`);
if (typeof mcopy.state.sequence.arr[i] !== 'undefined') { if (typeof mcopy.state.sequence.arr[i] !== 'undefined') {
elem.prop('checked', false); elem.prop('checked', false);
$('.' + mcopy.state.sequence.arr[i] + '[x=' + i + ']').prop('checked', true); $(`.${mcopy.state.sequence.arr[i]}[x=${i}]`).prop('checked', true);
if (mcopy.state.sequence.arr[i] === 'CF' if (mcopy.state.sequence.arr[i] === 'CF' || mcopy.state.sequence.arr[i] === 'CB') {
|| mcopy.state.sequence.arr[i] === 'CB') { lightElem.css('background', `rgb(${mcopy.state.sequence.light[i]})`)
lightElem.css('background', 'rgb(' + mcopy.state.sequence.light[i] + ')')
.addClass('a') .addClass('a')
.prop('title', 'rgb(' + mcopy.state.sequence.light[i] + ')'); .prop('title', `rgb(${mcopy.state.sequence.light[i]})`);
} else { } else {
lightElem.css('background', 'transparent') lightElem.css('background', 'transparent')
@ -312,15 +298,16 @@ gui.grid.state = function (i) {
}; };
gui.grid.refresh = function () { gui.grid.refresh = function () {
'use strict'; 'use strict';
var cmds = ['cam_forward', 'proj_forward', 'cam_backward', 'proj_backward', 'light_set', 'numbers'], const cmds = ['cam_forward', 'proj_forward', 'cam_backward', 'proj_backward', 'light_set', 'numbers'];
check = '<input type="checkbox" x="xxxx" />', const check = '<input type="checkbox" x="xxxx" />';
div = '<div x="xxxx"></div>', const div = '<div x="xxxx"></div>';
elem, const width = 970 - 34 + ((940 / 24) * Math.abs(24 - mcopy.state.sequence.size));
width = 970 - 34 + ((940 / 24) * Math.abs(24 - mcopy.state.sequence.size)); let elem;
$('#sequence').width(width + 'px');
for (var i = 0; i < cmds.length; i++) { $('#sequence').width(`${width}px`);
for (let i = 0; i < cmds.length; i++) {
$('#' + cmds[i]).empty(); $('#' + cmds[i]).empty();
for (var x = 0; x < mcopy.state.sequence.size; x++) { for (let x = 0; x < mcopy.state.sequence.size; x++) {
if (i === cmds.length - 1) { if (i === cmds.length - 1) {
elem = div.replace('xxxx', x); elem = div.replace('xxxx', x);
$('#' + cmds[i]).append($(elem).text(x)); $('#' + cmds[i]).append($(elem).text(x));
@ -337,13 +324,12 @@ gui.grid.refresh = function () {
}; };
gui.grid.click = function (t) { gui.grid.click = function (t) {
'use strict'; 'use strict';
var i = parseInt($(t).attr('x')), const i = parseInt($(t).attr('x'));
c; let c;
if ($(t).prop('checked')) { if ($(t).prop('checked')) {
c = $(t).attr('class').replace('.', ''); c = $(t).attr('class').replace('.', '');
mcopy.state.sequence.arr[i] = c; mcopy.state.sequence.arr[i] = c;
if (c === 'CF' if (c === 'CF' || c === 'CB') {
|| c === 'CB') {
mcopy.state.sequence.light[i] = light.color.join(','); mcopy.state.sequence.light[i] = light.color.join(',');
} else { } else {
mcopy.state.sequence.light[i] = ''; mcopy.state.sequence.light[i] = '';
@ -357,7 +343,7 @@ gui.grid.click = function (t) {
}; };
gui.grid.clear = function () { gui.grid.clear = function () {
'use strict'; 'use strict';
var doit = confirm('Are you sure you want to clear this sequence?'); const doit = confirm('Are you sure you want to clear this sequence?');
if (doit) { if (doit) {
seq.clear(); seq.clear();
gui.grid.refresh(); gui.grid.refresh();
@ -367,7 +353,7 @@ gui.grid.clear = function () {
}; };
gui.grid.loopChange = function (t) { gui.grid.loopChange = function (t) {
'use strict'; 'use strict';
var count = parseInt(t.value); const count = parseInt(t.value);
mcopy.loop = count; mcopy.loop = count;
seq.stats(); seq.stats();
}; };
@ -375,7 +361,7 @@ gui.grid.plus_24 = function () {
'use strict'; 'use strict';
mcopy.state.sequence.size += 24; mcopy.state.sequence.size += 24;
gui.grid.refresh(); gui.grid.refresh();
console.log('Sequencer expanded to ' + mcopy.state.sequence.size + ' steps'); console.log(`Sequencer expanded to ${mcopy.state.sequence.size} steps`);
}; };
gui.grid.setLight = function (x, rgb) { gui.grid.setLight = function (x, rgb) {
'use strict'; 'use strict';
@ -383,8 +369,8 @@ gui.grid.setLight = function (x, rgb) {
gui.grid.state(x); gui.grid.state(x);
}; };
gui.grid.blackout = function (t) { gui.grid.blackout = function (t) {
var elem = $(t), const elem = $(t);
i = elem.attr('x'); const i = elem.attr('x');
if (typeof mcopy.state.sequence.light[i] === 'undefined') { if (typeof mcopy.state.sequence.light[i] === 'undefined') {
return false; return false;
} }
@ -396,34 +382,29 @@ gui.grid.blackout = function (t) {
}; };
gui.grid.changeAll = function (rgb) { gui.grid.changeAll = function (rgb) {
'use strict'; 'use strict';
var i; for (let [i, c] of mcopy.state.sequence.arr.entries()) {
for (i = 0; i < mcopy.state.sequence.arr.length; i++) { if (c === 'CF' || c === 'CB') {
if (mcopy.state.sequence.arr[i] === 'CF'
|| mcopy.state.sequence.arr[i] === 'CB') {
gui.grid.setLight(i, rgb); gui.grid.setLight(i, rgb);
} }
} }
}; };
gui.grid.swatches = function (x) { gui.grid.swatches = function (x) {
'use strict'; 'use strict';
var current = mcopy.state.sequence.light[x]; const current = mcopy.state.sequence.light[x];
gui.grid.swatchesElem = w2popup.open({ gui.grid.swatchesElem = w2popup.open({
title : 'Select Color', title : 'Select Color',
body : $('#light-swatches').html(), body : $('#light-swatches').html(),
buttons : '<button id="sequencer-ok" class="btn btn-default">Ok</button> <button id="sequencer-changeall" class="btn btn-warning">Change All</button> <button id="sequencer-cancel" class="btn btn-default">Cancel</button>', buttons : '<button id="sequencer-ok" class="btn btn-default">Ok</button> <button id="sequencer-changeall" class="btn btn-warning">Change All</button> <button id="sequencer-cancel" class="btn btn-default">Cancel</button>',
onClose : function () { onClose : () => {}
}
}); });
$('.w2ui-msg-body .swatch').removeClass('default set'); $('.w2ui-msg-body .swatch').removeClass('default set');
$('.w2ui-msg-body .swatch[color="' + current + '"').eq(0).addClass('default set'); $(`.w2ui-msg-body .swatch[color="${current}"`).eq(0).addClass('default set');
$('#sequencer-cancel').on('click', function () { $('#sequencer-cancel').on('click', gui.grid.swatchesElem.close);
gui.grid.swatchesElem.close();
});
$('#sequencer-changeall').on('click', function () { $('#sequencer-changeall').on('click', function () {
var doit = confirm('You sure you want to change all light settings?'), const doit = confirm('You sure you want to change all light settings?');
elem = $('.w2ui-msg-body .default'), const elem = $('.w2ui-msg-body .default');
rgb; let rgb;
if (doit && elem.length > 0) { if (doit && elem.length > 0) {
rgb = elem.attr('color').split(','); rgb = elem.attr('color').split(',');
gui.grid.changeAll(rgb); gui.grid.changeAll(rgb);