diff --git a/etemplate/js/et2_widget_split.js b/etemplate/js/et2_widget_split.js
index fc65d57607..a56d0a3a97 100644
--- a/etemplate/js/et2_widget_split.js
+++ b/etemplate/js/et2_widget_split.js
@@ -67,7 +67,8 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable],
init: function() {
this._super.apply(this, arguments);
- this.div = $j(document.createElement("div"));
+ this.div = $j(document.createElement("div"))
+ .addClass('et2_split');
// Create the dynheight component which dynamically scales the inner
// container.
@@ -79,6 +80,9 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable],
// Add something so we can see it - will be replaced if there's children
this.left = $j("
Top / Left
").appendTo(this.div);
this.right = $j("Bottom / Right
").appendTo(this.div);
+
+ // Deferred object so we can wait for children
+ this.loading = jQuery.Deferred();
},
destroy: function() {
@@ -141,7 +145,10 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable],
window.setTimeout(function() {
self._init_splitter();
},1);
- return true;
+
+
+ // Not done yet, but widget will let you know
+ return this.loading.promise();
},
/**
@@ -153,7 +160,9 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable],
var options = {
type: this.orientation,
dock: this.dock_side,
- splitterClass: "et2_split"
+ splitterClass: "et2_split",
+ outline: true,
+ eventNamespace: '.et2_split.'+this.id
};
// Check for position preference, load it in
@@ -174,6 +183,16 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable],
// Initialize splitter
this.div.splitter(options);
+
+ // Start docked?
+ if(options.dock)
+ {
+ if(options.dock == "bottomDock" && options.sizeTop >= this.div.height() ||
+ options.dock == "topDock" && options.sizeTop == 0)
+ {
+ this.dock();
+ }
+ }
// Add icon to splitter bar
var icon = "ui-icon-grip-"
@@ -189,12 +208,20 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable],
if(this.id && this.egw().getAppName())
{
self = this;
- this.left.next().on("mouseup", function() {
- // Store current position in preferences
- var size = self.orientation == "v" ? {sizeLeft: self.left.width()} : {sizeTop: self.left.height()};
- self.egw().set_preference(self.egw().getAppName(), 'splitter-size-' + self.id, size);
+ this.left.on("resize"+options.eventNamespace, function(e) {
+ 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.egw().set_preference(self.egw().getAppName(), 'splitter-size-' + self.id, size);
+ }
+ self.iterateOver(function(widget) {
+ if(widget != self) widget.resize();
+ },self,et2_IResizeable);
});
}
+
+ this.loading.resolve();
},
/**
@@ -203,6 +230,7 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable],
resize: function() {
if(this.dynheight)
{
+ var old = {w: this.div.width(), h: this.div.height()};
this.dynheight.update(function(w,h) {
if(this.orientation == "v")
{
@@ -213,15 +241,23 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable],
{
this.left.width(w);
this.right.width(w);
- if(this.dock_side == "topDock")
- {
- this.right.height(h);
- }
- else
- {
- this.left.height(h);
+ if(this.isDocked()) {
+ if(this.dock_side == "topDock")
+ {
+ this.right.height(h);
+ this.left.height(0);
+ }
+ else
+ {
+ this.left.height(h);
+ this.right.height(0);
+ }
}
}
+ if(w != old.w || h != old.h)
+ {
+ this.div.trigger('resize.et2_split.'+this.id);
+ }
}, this);
}
},
@@ -267,6 +303,7 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable],
* Docking requires the dock attribute to be set.
*/
dock: function() {
+ if(this.isDocked()) return;
this.div.trigger("dock");
},
@@ -278,6 +315,15 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable],
this.div.trigger("undock");
},
+ /**
+ * Determine if the splitter is docked
+ * @return boolean
+ */
+ isDocked: function() {
+ var bar = $j('.splitter-bar',this.div);
+ return bar.hasClass('splitter-bar-horizontal-docked') || bar.hasClass('splitter-bar-vertical-docked');
+ },
+
/**
* Toggle the splitter's docked state.
* Docking requires the dock attribute to be set.
diff --git a/etemplate/templates/default/etemplate2.css b/etemplate/templates/default/etemplate2.css
index 8a80447736..9ddfc2a929 100644
--- a/etemplate/templates/default/etemplate2.css
+++ b/etemplate/templates/default/etemplate2.css
@@ -104,6 +104,7 @@ div.et2_hbox>div {
width: 100%;
min-width: 100px;
min-height: 100px;
+ height: 100%;
}
.splitter-bar-vertical { cursor: ew-resize; width: 5px;}
.splitter-bar-horizontal { cursor: ns-resize; height: 5px;}
diff --git a/phpgwapi/js/jquery/splitter.js b/phpgwapi/js/jquery/splitter.js
index 299c006c82..366ee72b2e 100644
--- a/phpgwapi/js/jquery/splitter.js
+++ b/phpgwapi/js/jquery/splitter.js
@@ -113,7 +113,7 @@ var splitterCounter = 0;
A.css(opts.origin, 0).css(opts.split, pos).css(opts.fixed, splitter._DF);
B.css(opts.origin, pos+bar._DA)
.css(opts.split, splitter._DA-bar._DA-pos).css(opts.fixed, splitter._DF);
- panes.trigger("resize");
+ panes.trigger("resize"+opts.eventNamespace);
}
function dimSum(jq, dims) {
// Opera returns -1 for missing min/max width, turn into 0