isobit-ui 0.0.275 → 0.0.278

package/dist/index.js

@@ -1,5 +1,5 @@
 /*!
- * isobit-ui v0.0.275
+ * isobit-ui v0.0.278
  * (c) Erik Alarcon Pinedo
  * Released under the MIT License.
  */
@@ -4568,7 +4568,7 @@ Vue.n = function (v) {
   return v;
 };
 
-Vue.resize = function () {
+var resize = function resize() {
   //dialog.style.left = (window.innerWidth - dialog.offsetWidth) / 2 + 'px';
   var h = window.innerHeight;
   document.body.children[0].style.height = h + '.px';
@@ -4772,6 +4772,11 @@ Vue.resize = function () {
   }
 };
 
+setTimeout(Vue.resize = resize, 400);
+window.addEventListener('resize', function () {
+  setTimeout(resize, 400);
+});
+
 function HTML2Canvas(props) {
   this.props = props;
   this.ctx = props.ctx;
@@ -4813,6 +4818,19 @@ function HTML2Canvas(props) {
   };
 }
 
+_ = Object.assign(_, {
+  remoteServer: '',
+  _id: 0,
+  networkStatus: {
+    connected: true
+  },
+  storeFunction: {},
+  varMap: {},
+  id: function id() {
+    return ++_._id;
+  }
+});
+
 _.sum = function (c) {
   return this.reduce(function (a, b) {
     b = c ? b[c] : b;
@@ -5288,71 +5306,295 @@ window.ui = _.ui = function (cfg) {
         return str.replace(_.contextPath, _.contextPath + '/api');
       },
       open: function open(response, path, o) {
-        var me = this;
+        var me = this,
+            el;
+
+        if (response.$el) {
+          response = response.$el;
+          path = {};
+        } else if (response instanceof HTMLElement) {
+          path = {};
+        } else if (response.target) {
+          el = response.target;
+          return me.open(el.pathname ? el.pathname : el.href);
+        } else if (response === 'GET') {
+          if (typeof path == 'string') {
+            var cfg = {
+              path: _.currentPath = path + (typeof o == 'string' ? '/' + o : '')
+            };
 
-        if (response === 'GET') {
-          _.currentPath = path + '/' + o; //                    window.history.pushState(_.currentPath, t, '{}');
+            if (typeof o == 'function') {
+              cfg.result = o;
+            } else if (_typeof(o) == 'object') {
+              cfg = Vue.mergeDeep(cfg, o);
+            }
 
-          axios.get((_.currentPath + '/?modal').replace(/([^:]\/)\/+/g, "$1")).then(me.open)["catch"](me.error);
-          return;
-        } else if (typeof response == 'string') {
-          if (path === true) window.app.$router.replace(_.currentPath = response);else window.app.$router.push(_.currentPath = response);
-          return;
+            return me.open(response, cfg);
+          } else if (!path.data) {
+            //Tiene q buscarse el elemt si existe
+            //console.log('path='+path.path);
+            el = document.querySelector('[path=\'' + path.path + '\']'); //console.log(el);
+
+            if (el) {
+              var dd = document.querySelector('#layoutUnit-center > .ui-layout-unit-content,#page-content'); //console.log(dd);
+
+              for (var i = 0; i < dd.children.length; i++) {
+                //Se ocultan todas las demas paginas
+                if (dd.children[i].style) {
+                  if (dd.children[i].className == 'ui-panel' && dd.children[i].style.display != 'none') {
+                    backPanel = dd.children[i];
+                  }
+
+                  dd.children[i].style.display = 'none';
+                }
+              }
+
+              el.style.removeProperty('display');
+              return el;
+            } else {
+              return axios.get((path.path + '/?modal').replace(/([^:]\/)\/+/g, "$1")).then(function (r) {
+                r["class"] = path["class"] ? path["class"] : '';
+                r.path = path.path;
+                r.result = path.callback;
+                r = Object.assign(r, path);
+                me.open(response, r);
+              })["catch"](me.error);
+            }
+          }
+        } else if (!response.data) {
+          return me.open('GET', response, path);
+        } else if (response.data) {
+          path = response;
         }
 
-        var overlay = document.createElement("div");
-        overlay.classList.add("v-overlay");
-        overlay.style.padding = "40px";
-        document.body.appendChild(overlay);
-        var dialog = document.createElement("div");
-        dialog.classList.add("v-dialog");
-        dialog.innerHTML = response.data;
-        var s = dialog.getElementsByTagName('script'); //console.log('patttt=' + _.currentPath);
+        var dialog,
+            nid = Vue.id(),
+            scriptDom = [],
+            for_,
+            ifor = 0;
 
-        dialog.setAttribute("path", _.currentPath);
+        if (response instanceof HTMLElement) {
+          dialog = response;
+          dialog.classList.add("v-dialog");
+        } else {
+          dialog = document.createElement("div");
+          dialog.classList.add("v-dialog");
+          dialog.innerHTML = path.data;
+          var s = dialog.getElementsByTagName('script'); //console.log('patttt=' + _.currentPath);
 
-        var nid = _.id();
+          dialog.setAttribute("path", _.currentPath);
+          var ld = dialog.children; //console.log(s);
 
-        dialog.setAttribute("callback", nid);
-        overlay.appendChild(dialog);
+          for (var k = 0; k < s.length; k++) {
+            scriptDom.push(s[k]);
+          }
 
-        for (var i = 0; s.length > i; i++) {
-          eval(s[i].innerHTML);
+          for (k = 0; k < ld.length; k++) {
+            //console.log(ld[k].tagName);
+            if (ld[k].tagName == 'V-FORM' || ld[k].tagName == 'V-PANEL') {
+              for_ = ld[k];
+              ifor = k;
+            }
+          }
         }
 
-        overlay.style.visibility = "unset";
-        overlay.style.opacity = "unset";
-        overlay.style.overflow = "auto";
-        dialog.style.margin = "0 auto";
-        dialog.style.position = "unset";
+        var backPanel;
 
-        _.storeFunction[nid] = function (o) {
-          if (o === true) me.refresh();
+        var close = function close() {
+          dialog.style.display = "none";
+          overlay = dialog.parentNode;
+
+          if (overlay.classList.contains('v-overlay')) {
+            //para los dialog
+            overlay.style.display = "none";
+            dialog.parentNode.removeChild(dialog);
+            overlay.parentNode.removeChild(overlay);
+          }
+
+          if (backPanel) {
+            dialog.parentNode.removeChild(dialog);
+            backPanel.style.display = 'block';
+          }
+
+          _.resize();
         };
 
-        var resize = function resize() {
-          dialog.style.left = (window.innerWidth - dialog.offsetWidth) / 2 + 'px';
+        if (for_ && for_.classList.contains('panel')) {
+          //Si elemto tiene declarado el id se debe considerar que es 
+          if (for_.id) {
+            window.currentEl = '#' + for_.id;
+          } else {
+            var clsId = 'cls-id-' + Vue.id();
+            for_.classList.add(clsId);
+            window.currentEl = '.' + clsId;
+          }
+
+          dd = document.querySelector('#layoutUnit-center > .ui-layout-unit-content,#page-content');
 
-          if (window.innerWidth < 600) {
-            var dc = dialog.querySelector('.ui-dialog-content'); //console.log(dc);
+          for (i = 0; i < dd.children.length; i++) {
+            //Se ocultan todas las demas paginas
+            if (dd.children[i].style) {
+              if (dd.children[i].className == 'ui-panel' && dd.children[i].style.display != 'none') {
+                backPanel = dd.children[i];
+              }
 
-            var h = dialog.querySelector('.ui-panel-titlebar'); //console.log(h.clientHeight);
+              dd.children[i].style.display = 'none';
+            }
+          } //se agrega el dialog recuperado y se genera
 
-            var ih = window.innerHeight - 94 - h.clientHeight;
-            dc.style.height = ih + "px";
+
+          dd.appendChild(dialog); //console.log(scriptDom);
+
+          for (var l2 = 0; scriptDom.length > l2; l2++) {
+            //console.log(s[l2]);
+            try {
+              eval(scriptDom[l2].innerHTML);
+            } catch (e) {
+              console.error(e);
+            }
           }
+
+          dialog.style.display = 'none';
+          var td;
+          var aux = dialog.children[ifor]; //todo los elementos del dialog son agregados al panel
+
+          while (dialog.children.length > 0) {
+            if (!td) td = dialog.children[0];
+            dd.appendChild(dialog.children[0]);
+          }
+
+          dialog.parentNode.removeChild(dialog);
+          dialog = aux; //console.log(path);
+
+          dialog.setAttribute("path", path.path);
+        } else {
+          var overlay = document.createElement("div");
+          console.log('create overlay');
+          overlay.classList.add("v-overlay");
+          overlay.style.padding = "40px";
+          document.body.appendChild(overlay);
+          overlay.appendChild(dialog);
+
+          if (!(response instanceof HTMLElement)) {
+            for (l2 = 0; s.length > l2; l2++) {
+              //console.log(s[l2]);
+              try {
+                eval(s[l2].innerHTML);
+              } catch (e) {
+                console.error(e);
+              }
+            }
+          }
+
+          overlay.style.visibility = "unset";
+          overlay.style.opacity = "unset";
+          overlay.style.overflow = "auto";
+          dialog.style.margin = "0 auto";
+          dialog.style.position = "unset"; //console.log(dialog);
+
+          var resize = function resize(e) {
+            dialog.style.left = (window.innerWidth - dialog.offsetWidth) / 2 + 'px';
+
+            if (window.innerWidth < 600) {
+              //console.log(333333);
+              var dc = dialog.querySelector('.v-dialog-content'); //console.log(dc);
+
+              var h = dialog.querySelector('.v-panel-titlebar'); //console.log(h.clientHeight);
+
+              var ih = window.innerHeight - 94 - h.clientHeight;
+              dc.style.height = ih + "px";
+            }
+          };
+
+          window.addEventListener('resize', resize);
+
+          if (path["class"] === 'v-search') {
+            var d = dialog;
+            d.className = d.className + ' ' + path["class"];
+            d.style.width = "100%";
+            d.style.height = "calc(100% - 2px)";
+            var children = d.querySelector('div');
+            var f = d.querySelector('form');
+            var t = d.querySelector('.v-datatable');
+            var tb = d.querySelector('.v-datatable-scrollable-body');
+            children.style.height = 'calc(100% - 2px)';
+            children.style.overflowY = 'auto';
+            children.children[1].style.padding = '0px';
+            children.children[1].style.height = 'calc(100% - 33px)';
+            f.style.height = '100%';
+            f.style.overflowY = 'auto';
+            t.style.height = 'calc(100% - 52px)';
+            tb.style.height = 'calc(100% - 72px)';
+            tb.style.overflowY = 'auto';
+            var pag = d.querySelector('.v-paginator');
+            pag.style.display = 'inline-block';
+            f.appendChild(pag);
+            tb = document.createElement("button");
+            tb.innerHTML = 'Recuperar';
+            tb.style.padding = '4px 16px';
+            tb.className = "_ ui-widget v-state-default ui-corner-all v-button ui-button-text-only";
+
+            var vue = _.varMap[children.getAttribute("vueid")];
+
+            tb.onclick = function (e) {
+              e.preventDefault();
+              vue.refresh();
+            };
+
+            f.appendChild(tb);
+            tb = document.createElement("button");
+            tb.innerHTML = 'Seleccionar';
+            tb.style.padding = '4px 16px';
+            tb.className = "_ ui-widget v-state-default ui-corner-all v-button ui-button-text-only";
+            vue = _.varMap[children.getAttribute("vueid")];
+
+            tb.onclick = function (e) {
+              e.preventDefault();
+              var d = [];
+              var t = vue.$children[0].$children[0];
+
+              for (i = 0; i < t.selected.length; i++) {
+                d.push(t.filteredData[t.selected[i]]);
+              }
+
+              path.result(d);
+              delete path.result;
+              vue.close(e);
+            };
+
+            f.appendChild(tb);
+          }
+
+          resize();
+        }
+
+        _.storeFunction['PROPS=' + nid] = path;
+
+        _.storeFunction[nid] = function (o) {
+          if (path.result) {
+            path.result(o);
+          }
+
+          if (o === true) me.refresh();
         };
 
-        window.addEventListener('resize', resize);
-        var h = dialog.querySelector('.ui-panel-titlebar');
+        var _vue_ = dialog.querySelector('[vueid]');
+
+        if (_vue_) {
+          path.__vue__ = _vue_.__vue__;
+
+          _vue_.__vue__.$emit('opened', path);
+        }
+
+        dialog.setAttribute("callback", nid);
+        var h = dialog.querySelector('.v-panel-titlebar');
 
         if (h) {
           var acl = h.querySelector('.ui-js-close');
 
           window.onkeyup = function (event) {
             if (event.keyCode == 27) {
-              dialog.style.display = "none";
-              overlay.style.display = "none";
+              close();
             }
           };
 
@@ -5365,18 +5607,20 @@ window.ui = _.ui = function (cfg) {
             span.style.color = "white";
             span.className = "fa fa-window-close v-dialog-close";
             acl = document.createElement("a");
-            acl.className = "ui-js-close ui-dialog-titlebar-icon ui-dialog-titlebar-close ui-corner-all";
+            acl.className = "ui-js-close v-dialog-titlebar-icon v-dialog-titlebar-close ui-corner-all";
             acl.appendChild(span);
             h.appendChild(acl);
-            acl.addEventListener("click", function () {
-              dialog.style.display = "none";
-              overlay.style.display = "none";
-              Vue.resize();
-            });
+            acl.addEventListener("click", close);
           }
         }
 
-        Vue.resize();
+        dialog.style.display = 'block';
+
+        _.resize();
+
+        document.documentElement.style.overflow = 'hidden'; // firefox, chrome
+
+        document.body.scroll = "no"; // ie only
       },
       close: function close(ok) {
         var dlg = this.$el.parentElement;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "isobit-ui",
-	"version": "0.0.275",
+	"version": "0.0.278",
 	"description": "Vue component to play videos",
 	"keywords": [
 		"ui",