From 7d7430c0a6d7a2e3c07b54d041560786e369eb4f Mon Sep 17 00:00:00 2001 From: Hadi Nategh Date: Wed, 25 Feb 2015 11:18:26 +0000 Subject: [PATCH] Save splitter preferd size base on percentage instead of pixel, because user may switch between different screen with different resolution --- etemplate/js/et2_widget_split.js | 61 +++++++++++++++++++++++++------- 1 file changed, 49 insertions(+), 12 deletions(-) diff --git a/etemplate/js/et2_widget_split.js b/etemplate/js/et2_widget_split.js index c0fe5075ad..d0db876205 100644 --- a/etemplate/js/et2_widget_split.js +++ b/etemplate/js/et2_widget_split.js @@ -63,7 +63,7 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable,et2_IPrint], /** * Constructor - * + * * @memberOf et2_split */ init: function() { @@ -93,7 +93,7 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable,et2_IPrint], destroy: function() { // Stop listening this.left.next().off("mouseup"); - + // Destroy splitter, restore children this.div.trigger("destroy"); @@ -101,7 +101,7 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable,et2_IPrint], this.dynheight.free(); this._super.apply(this, arguments); - + // Remove placeholder children if(this._children.length == 0) { @@ -152,7 +152,7 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable,et2_IPrint], window.setTimeout(function() { self._init_splitter(); },1); - + // Not done yet, but widget will let you know return this.loading.promise(); @@ -183,12 +183,48 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable,et2_IPrint], sizeLeft: this.dynheight.outerNode.width() / 2 }; + var widget = this; + //Convert percent size to pixel + var per2pix = function(_size) + { + var size = _size.replace("%",''); + if (widget.orientation == "v") + { + return size * widget.dynheight.outerNode.width() / 100; + } + else + { + return size * widget.dynheight.outerNode.height() / 100; + } + } + + //Convert pixel size to percent + var pix2per = function (_size) + { + if (widget.orientation == "v") + { + return _size * 100 / widget.dynheight.outerNode.width() + '%'; + } + else + { + return _size * 100 / widget.dynheight.outerNode.height() + '%'; + } + } + // Check for position preference, load it in if(this.id) { var pref = this.egw().preference('splitter-size-' + this.id, this.egw().getAppName()); if(pref) { + // TODO:This condition can be removed for the next release + // because this is a correction data and supposely all new prefs size + // are all in percent + if (pref[Object.keys(pref)].toString().match(/%/g)) + { + pref [Object.keys(pref)] = per2pix(pref [Object.keys(pref)]); + } + if(this.orientation == "v" && pref['sizeLeft'] < this.dynheight.outerNode.width() || this.orientation == "h" && pref['sizeTop'] < this.dynheight.outerNode.height()) { @@ -214,7 +250,7 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable,et2_IPrint], this.div.splitter(options); this.div.trigger('resize',[options.sizeTop || options.sizeLeft || 0]); - + // Start docked? if(options.dock) { @@ -226,10 +262,10 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable,et2_IPrint], this.dock(); } } - + // Add icon to splitter bar var icon = "ui-icon-grip-" - + (this.dock_side ? "solid" : "dotted") + "-" + + (this.dock_side ? "solid" : "dotted") + "-" + (this.orientation == "h" ? "horizontal" : "vertical"); $j(document.createElement("div")) @@ -245,20 +281,21 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable,et2_IPrint], // Force immediate layout, so proper layout & sizes are available // for resize(). Chrome defers layout, so current DOM node sizes - // are not available to widgets if they ask. + // are not available to widgets if they ask. var display = this.style.display; this.style.display = 'none'; this.offsetHeight; this.style.display = display; - + if(e.namespace == options.eventNamespace.substr(1) && !self.isDocked()) { // Store current position in preferences var size = self.orientation == "v" ? {sizeLeft: self.left.width()} : {sizeTop: self.left.height()}; self.prefSize = size[this.orientation == "v" ?'sizeLeft' : 'sizeTop']; - self.egw().set_preference(self.egw().getAppName(), 'splitter-size-' + self.id, size); + var prefInPercent = self.orientation == "v" ?{sizeLeft:pix2per(size.sizeLeft)}:{sizeTop:pix2per(size.sizeTop)}; + self.egw().set_preference(self.egw().getAppName(), 'splitter-size-' + self.id, prefInPercent); } - + // Ok, update children self.iterateOver(function(widget) { if(widget != self) @@ -328,7 +365,7 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable,et2_IPrint], */ set_orientation: function(orient) { this.orientation = orient; - + this._init_splitter(); },