From 4b3d69fb5b17f23eda6a5f4c72e5db0bfdaec0ea Mon Sep 17 00:00:00 2001 From: Stewart Allen Date: Sun, 29 Mar 2020 20:23:48 -0400 Subject: [PATCH] complete beta test ready compact mode --- js/kiri-conf.js | 1 + js/kiri-init.js | 23 ++++++++++++--- js/kiri.js | 68 +++++++++++++++++++++++++-------------------- js/license.js | 2 +- js/moto-ui.js | 47 +++++++++++++++++++++++++------ web/kiri/lang/en.js | 2 ++ web/moto/style.css | 21 ++++++++++++-- 7 files changed, 118 insertions(+), 46 deletions(-) diff --git a/js/kiri-conf.js b/js/kiri-conf.js index 9df20052..ecf6dec8 100644 --- a/js/kiri-conf.js +++ b/js/kiri-conf.js @@ -500,6 +500,7 @@ var gs_kiri_conf = exports; }, controller:{ view: null, + compact: false, zoomSpeed: 1.0, reverseZoom: true, showOrigin: false, diff --git a/js/kiri-init.js b/js/kiri-init.js index 06b9e7b5..a4d7c07b 100644 --- a/js/kiri-init.js +++ b/js/kiri-init.js @@ -75,15 +75,22 @@ var gs_kiri_init = exports; function booleanSave() { let current = settings(); + let isCompact = current.controller.compact; current.controller.showOrigin = UI.showOrigin.checked; current.controller.autoLayout = UI.autoLayout.checked; current.controller.freeLayout = UI.freeLayout.checked; current.controller.alignTop = UI.alignTop.checked; current.controller.reverseZoom = UI.reverseZoom.checked; + current.controller.compact = UI.compact.checked; SPACE.view.setZoom(current.controller.reverseZoom, current.controller.zoomSpeed); platform.layout(); platform.update_stock(); API.conf.save(); + // if compact mode changed, reload UI + if (isCompact !== current.controller.compact) { + UC.setDefaults(isCompact); + LOC.reload(); + } } function onLayerToggle() { @@ -1065,6 +1072,9 @@ var gs_kiri_init = exports; // MAIN INITIALIZATION FUNCTION function init_one() { + // ensure we have settings from last session + API.conf.restore(); + let assets = $('assets'), control = $('control'), container = $('container'), @@ -1084,6 +1094,8 @@ var gs_kiri_init = exports; SPACE.platform.onMove(API.conf.save); SPACE.platform.setRound(true); + UC.setCompact(settings().controller.compact); + Object.assign(UI, { // from static HTML alert: { @@ -1203,7 +1215,7 @@ var gs_kiri_init = exports; UC.newButton(LANG.su_tool, showTools, {modes:CAM}) ],[ UI.localButton = - UC.newButton(LANG.su_locl, API.show.local, {modes:FDM_CAM}) + UC.newButton(LANG.su_locl, API.show.local, {modes:FDM_CAM, expert:true}) ],[ UI.helpButton = UC.newButton(LANG.su_help, API.help.show) @@ -1213,9 +1225,9 @@ var gs_kiri_init = exports; wsFuncTable: UC.newTableRow([ [ UI.load = - UC.newButton(LANG.fn_impo, function() { API.event.import() }), + UC.newButton(LANG.fn_impo, function() { API.event.import() }, {class:"asym"}), UI.import = - UC.newButton("+") + UC.newButton("+", undefined, {class:"asym"}) ],[ UI.modeArrange = UC.newButton(LANG.fn_arra, platform.layout), @@ -1255,6 +1267,7 @@ var gs_kiri_init = exports; ]), layout: UC.newGroup(LANG.op_menu), + compact: UC.newBoolean(LANG.op_comp_s, booleanSave, {title:LANG.op_comp_l}), showOrigin: UC.newBoolean(LANG.op_show_s, booleanSave, {title:LANG.op_show_l}), alignTop: UC.newBoolean(LANG.op_alig_s, booleanSave, {title:LANG.op_alig_l, modes:CAM}), autoLayout: UC.newBoolean(LANG.op_auto_s, booleanSave, {title:LANG.op_auto_l}), @@ -1290,7 +1303,7 @@ var gs_kiri_init = exports; UC.newButton(LANG.se_save, settingsSave) ],[ UI.settingsExpert = - UC.newButton(LANG.se_xprt, () => { UC.setExpert(true); SDB.setItem('expert', true) }, {modes:FDM, expert: false}), + UC.newButton(LANG.se_xprt, () => { UC.setExpert(true); SDB.setItem('expert', true) }, {modes:FDM, expert:false}), UI.settingsExpert = UC.newButton(LANG.se_bsic, () => { UC.setExpert(false); SDB.removeItem('expert') }, {modes:FDM, expert:true}) ] @@ -1597,6 +1610,8 @@ var gs_kiri_init = exports; UI.freeLayout.checked = current.controller.freeLayout; UI.autoLayout.checked = current.controller.autoLayout; UI.alignTop.checked = current.controller.alignTop; + UI.reverseZoom.checked = current.controller.reverseZoom; + UI.compact.checked = current.controller.compact; // load script extensions if (SETUP.s) SETUP.s.forEach(function(lib) { diff --git a/js/kiri.js b/js/kiri.js index 32fb24fe..defe5c93 100644 --- a/js/kiri.js +++ b/js/kiri.js @@ -137,10 +137,11 @@ self.kiri.copyright = exports.COPYRIGHT; conf: { get: getSettings, put: putSettings, - load: loadNamedSetting, + load: loadSettings, save: saveSettings, show: showSettings, - update: updateSettings + update: updateSettings, + restore: restoreSettings }, color, const: { @@ -640,7 +641,7 @@ self.kiri.copyright = exports.COPYRIGHT; setViewMode(VIEWS.PREVIEW); clearPrint(); - saveSettings(); + API.conf.save(); if (MODE === MODES.CAM) { setOpacity(color.cam_preview_opacity); @@ -708,7 +709,7 @@ self.kiri.copyright = exports.COPYRIGHT; setViewMode(VIEWS.SLICE); clearPrint(); - saveSettings(); + API.conf.save(); platform.deselect(); var firstMesh = true, @@ -1349,7 +1350,7 @@ self.kiri.copyright = exports.COPYRIGHT; updateSettingsFromFields(settings.process); updateSettingsFromFields(settings.layers); updateSettingsFromFields(settings.controller); - saveSettings(); + API.conf.save(); platform.update_stock(); } @@ -1374,7 +1375,7 @@ self.kiri.copyright = exports.COPYRIGHT; cull(settings.cdev.FDM, filter.fdm.d); cull(settings.cdev.CAM, filter.cam.d); // store camera view - var view = SPACE.view.save(); + let view = SPACE.view.save(); if (view.left || view.up) settings.controller.view = view; SDB.setItem('ws-settings', JSON.stringify(settings)); } @@ -1414,7 +1415,7 @@ self.kiri.copyright = exports.COPYRIGHT; } function saveWorkspace() { - saveSettings(); + API.conf.save(); var newWidgets = [], oldWidgets = js2o(SDB.getItem('ws-widgets'), []); forAllWidgets(function(widget) { @@ -1429,12 +1430,9 @@ self.kiri.copyright = exports.COPYRIGHT; alert2("workspace saved", 1); } - function restoreWorkspace(ondone, skip_widget_load) { - var loaded = 0, - toload = ls2o('ws-widgets',[]), - newset = ls2o('ws-settings'), - camera = ls2o('ws-camera'), - position = true; + function restoreSettings(save) { + var newset = ls2o('ws-settings'), + camera = ls2o('ws-camera'); if (newset) { fillMissingSettings(settingsDefault, newset); @@ -1443,7 +1441,7 @@ self.kiri.copyright = exports.COPYRIGHT; if (settings.controller.view) { camera = settings.controller.view; SDB.removeItem('ws-camera'); - UI.reverseZoom.checked = settings.controller.reverseZoom; + // UI.reverseZoom.checked = settings.controller.reverseZoom; } // merge custom filters from localstorage into settings localFilters.forEach(function(fname) { @@ -1453,9 +1451,19 @@ self.kiri.copyright = exports.COPYRIGHT; }); SDB.removeItem(localFilterKey); // save updated settings - saveSettings(); + if (save) API.conf.save(); } + return {newset, camera}; + } + + function restoreWorkspace(ondone, skip_widget_load) { + let {newset, camera} = restoreSettings(true); + + let loaded = 0, + toload = ls2o('ws-widgets',[]), + position = true; + updateFields(); platform.update_size(); platform.update_stock(); @@ -1538,11 +1546,11 @@ self.kiri.copyright = exports.COPYRIGHT; function putSettings(newset) { settings = newset; - saveSettings() - restoreWorkspace(null, true); + API.conf.save() + API.space.restore(null, true); } - function editNamedSetting(e) { + function editSettings(e) { var mode = getMode(), name = e.target.getAttribute("name"), load = settings.sproc[mode][name], @@ -1552,16 +1560,16 @@ self.kiri.copyright = exports.COPYRIGHT; try { settings.sproc[mode][name] = JSON.parse(edit); if (name === settings.process.processName) { - loadNamedSetting(null, name); + API.conf.load(null, name); } - saveSettings(); + API.conf.save(); } catch (e) { alert('malformed settings object'); } } } - function loadNamedSetting(e, named) { + function loadSettings(e, named) { var mode = getMode(), name = e ? e.target.getAttribute("load") : named || settings.cproc[mode], load = settings.sproc[mode][name]; @@ -1594,15 +1602,15 @@ self.kiri.copyright = exports.COPYRIGHT; if (!named) { hideDialog(); } - updateSettings(); + API.conf.update(); if (e) triggerSettingsEvent(); } - function deleteNamedSetting(e) { + function deleteSettings(e) { var name = e.target.getAttribute("del"); delete settings.sproc[getMode()][name]; updateSettingsList(); - saveSettings(); + API.conf.save(); triggerSettingsEvent(); } @@ -1620,7 +1628,7 @@ self.kiri.copyright = exports.COPYRIGHT; name = sk; load.setAttribute('load', sk); - load.onclick = loadNamedSetting; + load.onclick = API.conf.load; load.appendChild(DOC.createTextNode(sk)); if (sk == settings.process.processName) { load.setAttribute('class', 'selected') @@ -1628,13 +1636,13 @@ self.kiri.copyright = exports.COPYRIGHT; del.setAttribute('del', sk); del.setAttribute('title', "remove '"+sk+"'"); - del.onclick = deleteNamedSetting; + del.onclick = deleteSettings; del.appendChild(DOC.createTextNode('x')); edit.innerHTML = '↑'; edit.setAttribute('name', sk); edit.setAttribute('title', 'edit'); - edit.onclick = editNamedSetting; + edit.onclick = editSettings; row.setAttribute("class", "flow-row"); row.appendChild(edit); @@ -1795,8 +1803,8 @@ self.kiri.copyright = exports.COPYRIGHT; MODE = MODES[mode]; // updates right-hand menu by enabling/disabling fields UC.setMode(MODE); - loadNamedSetting(); - saveSettings(); + API.conf.load(); + API.conf.save(); clearWidgetCache(); SPACE.update(); UI.modeFDM.setAttribute('class', MODE === MODES.FDM ? 'buton' : ''); @@ -1807,7 +1815,7 @@ self.kiri.copyright = exports.COPYRIGHT; if (camStock) { camStock.material.visible = settings.mode === 'CAM'; } - restoreWorkspace(null, true); + API.space.restore(null, true); // if (MODE !== MODES.FDM) platform.layout(); if (then) then(); triggerSettingsEvent(); diff --git a/js/license.js b/js/license.js index 56ae04b9..bf883f85 100644 --- a/js/license.js +++ b/js/license.js @@ -1,7 +1,7 @@ var exports = { COPYRIGHT:"Copyright (C) Stewart Allen - All Rights Reserved", LICENSE:"See the license.md file included with the source distribution", - VERSION:"1.7.9" + VERSION:"1.8.0" }; if (!module) var module = {}; module.exports = exports; diff --git a/js/moto-ui.js b/js/moto-ui.js index 55f957f0..151e53d7 100644 --- a/js/moto-ui.js +++ b/js/moto-ui.js @@ -27,7 +27,8 @@ var gs_moto_ui = exports; DOC = SELF.document, prefix = "tab", NOMODE = "nomode", - compact = false; + compact = false, + exitimer = undefined; SELF.$ = (SELF.$ || function (id) { return DOC.getElementById(id) } ); @@ -55,10 +56,26 @@ var gs_moto_ui = exports; newBlank: newBlank, newGroup: newGroup, setGroup: setGroup, + setCompact: setCompact, + setDefaults: setDefaults, checkpoint, restore }; + function setDefaults(bool) { + Object.keys(localStorage).forEach(name => { + let namepre = `${prefix}-show-`; + if (name.indexOf(namepre) === 0) { + localStorage[name] = bool; + } + }); + } + + function setCompact(bool) { + compact = bool; + return this; + } + function setMode(mode) { if (compact) { $('control-left').classList.add('compact'); @@ -135,14 +152,21 @@ var gs_moto_ui = exports; } toggleGroup(label, dbkey); }; - if (compact) row.onmouseenter = function(ev) { - if (ev.target !== a && ev.target !== row) { - return; - } - showGroup(label); - }; - if (compact) { + row.onmouseenter = function(ev) { + if (ev.target !== a && ev.target !== row) { + return; + } + clearTimeout(exitimer); + showGroup(label); + }; + row.onmouseleave = function(ev) { + if (ev.target !== a && ev.target !== row) { + return; + } + clearTimeout(exitimer); + exitimer = setTimeout(showGroup, 1000); + }; addTo._group = label; addModeControls(addTo, options); lastGroup.push(addTo); @@ -483,10 +507,17 @@ var gs_moto_ui = exports; function newButton(label, action, options) { let b = DOC.createElement('button'), t = DOC.createTextNode(label); + b.appendChild(t); b.onclick = function() { action() }; + + if (options && options.class) { + b.classList.add(options.class); + } + addModeControls(b, options); addId(b, options); + return b; } diff --git a/web/kiri/lang/en.js b/web/kiri/lang/en.js index 7b106ba6..4ece9de6 100644 --- a/web/kiri/lang/en.js +++ b/web/kiri/lang/en.js @@ -98,6 +98,8 @@ kiri.lang['en-us'] = { // OPTIONS op_menu: "options", + op_comp_s: "compact", + op_comp_l: "compact user interface", op_show_s: "show origin", op_show_l: "show device or process origin", op_alig_s: "align top", diff --git a/web/moto/style.css b/web/moto/style.css index 3ae0d85e..fd555e00 100644 --- a/web/moto/style.css +++ b/web/moto/style.css @@ -104,10 +104,12 @@ th, tr, td, span, div, label, button { margin-top: 5px; margin-bottom: 3px; padding: 3px 2px 2px 3px; - text-align: center; - text-transform: uppercase; font-size: 12px; font-weight: bold; + text-align: center; +} +.grouphead > a { + text-transform: uppercase; } .grouphead:hover { cursor: default; @@ -208,7 +210,7 @@ th, tr, td, span, div, label, button { margin-bottom: 1px !important; margin-right: 2px !important; } -.control > div > div { +.control .flow-row { align-items: center; justify-content: center; } @@ -282,6 +284,19 @@ th, tr, td, span, div, label, button { border: 0 !important; background-color: rgba(255,255,255,0.5) !important; } +.compact .grouphead { + padding: 5px !important; + background-color: rgba(170,221,255,0.25); +} +.compact .grouphead:hover { + background-color: rgba(170,221,255,0.9); +} +.compact .grouphead a { + margin: 5px !important; +} +.compact .asym { + width: auto !important; +} #control-left::-webkit-scrollbar, #control-right::-webkit-scrollbar { display: none; }