restore winbox positions

public_html/deployment/js/functions.js

@@ -2,8 +2,81 @@
 // VARS
 // ----------------------------------------------------------------------
 
+// current winbox instances
 var aWinBoxes = {};
-var WINBOX_background = "#456";
+
+// default frame border color for winboxes
+var WINBOX_data = false;
+var WINBOX_lsvariable = "winbox_data";
+var WINBOX_defaults = {
+    background: "#456",
+    border: 5,
+    class: ["no-min", "no-max", "no-full", "ciwinboxinfos"],
+
+    // viewport
+    top: 70,
+    right: 20,
+    bottom: 20,
+    left: 20
+
+};
+
+
+/**
+ * get data of all winboxes - or of a single winbox only - from localstorage
+ * @param {string} sId  optional: id of a winbox
+ * @returns 
+ */
+function wb_getdata(sId) {
+    WINBOX_data = WINBOX_data 
+        ? WINBOX_data 
+        : (localStorage.getItem(WINBOX_lsvariable) 
+            ? JSON.parse(localStorage.getItem(WINBOX_lsvariable)) 
+            : {}
+        );
+    return sId
+        ? (WINBOX_data[sId] ? WINBOX_data[sId] : {})
+        : WINBOX_data;
+}
+/**
+ * get data of all winboxes - or of a single winbox only - from localstorage
+ * @param {string} sId  optional: id of a winbox
+ * @returns 
+ */
+function wb_getdefaults(sId, aOverrides) {
+    var _aReturn = Object.assign({}, WINBOX_defaults);
+    for (var key in aOverrides) {
+        _aReturn[key] = aOverrides[key];
+    }
+    var _aData = wb_getdata(sId);
+    for (var key in _aData) {
+        _aReturn[key] = _aData[key];
+    }
+    if (_aReturn['x']<_aReturn['left']){
+        _aReturn['x']=_aReturn['left'];
+    }
+    if (_aReturn['y']<_aReturn['top']){
+        _aReturn['y']=_aReturn['top'];
+    }
+    console.log(_aReturn);
+    return _aReturn;
+}
+/**
+ * save data for a given winbox
+ * @param {string} sId         id of a winbox
+ * @param {array} _aNewvalues  properties to store as key+value
+ */
+function wb_savedata(sId, _aNewvalues) {
+    WINBOX_data = WINBOX_data ? WINBOX_data : wb_getdata();
+    if (!WINBOX_data[sId]) {
+        WINBOX_data[sId] = {};
+    }
+    for (var key in _aNewvalues) {
+        WINBOX_data[sId][key] = _aNewvalues[key];
+    }
+    localStorage.setItem(WINBOX_lsvariable, JSON.stringify(WINBOX_data));
+}
+
 
 // ----------------------------------------------------------------------
 // FUNCTIONS
@@ -52,7 +125,6 @@ function hideModalMessage() {
     return false;
 }
 
-
 /**
  * show a window displaying the content of a given dom id using Winbox
  * 
@@ -66,14 +138,9 @@ function showIdAsModalMessage(sId, sTitle) {
         return true;
     }
     var oWrapper = document.getElementById(sId);
-    aWinBoxes[sId] = WinBox({
+    var aOptions = wb_getdefaults(sId, {
         title: sTitle,
         id: 'winbox-' + sId,
-        border: 5,
-        background: WINBOX_background,
-        class: ["no-min", "no-max", "no-full", "ciwinboxinfos"],
-
-        // modal: true, // collides with bootsrap3 .modal.less
 
         // position + size
         x: "center",
@@ -81,41 +148,36 @@ function showIdAsModalMessage(sId, sTitle) {
         width: 700,
         height: 500,
 
-        // viewport
-        top: 70,
-        right: 20,
-        bottom: 20,
-        left: 20,
 
         // take content from existing div
         // mount: oWrapper
         // mount: document.getElementById(sId).cloneNode(true),
         html: oWrapper.innerHTML,
 
+        onmove:   function (x, y) { wb_savedata(sId, { x: x,     y: y      }); },
+        onresize: function (x, y) { wb_savedata(sId, { width: x, height: y }); },
         onclose: function () {
             delete aWinBoxes[sId];
         }
     });
+    aWinBoxes[sId] = WinBox(aOptions);
 
     return false;
 }
 
 /**
  * shellcmd plugin ... toggle output window
- * @param {string} isPluginOutputDiv  id of the wrapper
+ * @param {string} sId  id of the wrapper
  * @param {object} oLink              a tag in the navbar with link for toggling window 
  */
-function toggleShellWindow(isPluginOutputDiv, oLink) {
-    if (aWinBoxes[isPluginOutputDiv]) {
-        aWinBoxes[isPluginOutputDiv].close();
+function toggleShellWindow(sId, oLink) {
+    if (aWinBoxes[sId]) {
+        aWinBoxes[sId].close();
     } else {
-        var oWrapper = document.getElementById(isPluginOutputDiv);
-        aWinBoxes[isPluginOutputDiv] = WinBox({
+        var oWrapper = document.getElementById(sId);
+        var aOptions = wb_getdefaults(sId, {
             title: oLink.innerText,
-            id: 'winbox-' + isPluginOutputDiv,
-            border: 5,
-            /*background: "#628",*/
-            background: WINBOX_background,
+            id: 'winbox-' + sId,
             class: ["no-min", "no-max", /* "no-full", "no-resize", "no-move"*/ "ciwinbox"],
 
             // position + size
@@ -124,24 +186,24 @@ function toggleShellWindow(isPluginOutputDiv, oLink) {
             width: 10,
             height: 10,
 
-            // viewport
-            top: 70,
-            right: 20,
-            bottom: 20,
-            left: 20,
-
             // take content from existing div
             mount: oWrapper,
 
+            onmove:   function (x, y) { wb_savedata(sId, { x: x,     y: y      }); },
+            onresize: function (x, y) { wb_savedata(sId, { width: x, height: y }); },        
             onclose: function () {
-                delete aWinBoxes[isPluginOutputDiv];
+                delete aWinBoxes[sId];
                 $(oLink).removeClass('active');
             }
         });
+        aWinBoxes[sId] = WinBox(aOptions);
+
         if (oLink) {
             $(oLink).addClass('active');
         }
-        window.setTimeout("aWinBoxes['" + isPluginOutputDiv + "'].resize(" + (oWrapper.clientWidth + 25) + ", " + (oWrapper.clientHeight + 150) + ").move('center', 'center')", 10);
+        if(aOptions['width']==10){
+            window.setTimeout("aWinBoxes['" + sId + "'].resize(" + (oWrapper.clientWidth + 25) + ", " + (oWrapper.clientHeight + 150) + ").move('center', 'center')", 10);
+        }
     }
 }