complete beta test ready compact mode

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,

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) {

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) {
+    function restoreSettings(save) {
-        var loaded = 0,
+        var newset = ls2o('ws-settings'),
-            toload = ls2o('ws-widgets',[]),
+            camera = ls2o('ws-camera');
-            newset = ls2o('ws-settings'),
-            camera = ls2o('ws-camera'),
-            position = true;
 
         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()
+        API.conf.save()
-        restoreWorkspace(null, true);
+        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();
+        API.conf.load();
-        saveSettings();
+        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();

js/license.js

@@ -1,7 +1,7 @@
 var exports = {
     COPYRIGHT:"Copyright (C) Stewart Allen <sa@grid.space> - 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;

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;
     }
 

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",

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;
 }