mirror of
https://github.com/EGroupware/egroupware.git
synced 2024-12-26 00:29:38 +01:00
Fix some splitter issues:
- Loaded at wrong size - Docking lost previous pane size - Docking overwrote bar location preference - Allowed etemplate to think load was done too early
This commit is contained in:
parent
379cc5042d
commit
e231ca5212
@ -67,7 +67,8 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable],
|
|||||||
init: function() {
|
init: function() {
|
||||||
this._super.apply(this, arguments);
|
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
|
// Create the dynheight component which dynamically scales the inner
|
||||||
// container.
|
// 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
|
// Add something so we can see it - will be replaced if there's children
|
||||||
this.left = $j("<div>Top / Left</div>").appendTo(this.div);
|
this.left = $j("<div>Top / Left</div>").appendTo(this.div);
|
||||||
this.right = $j("<div>Bottom / Right</div>").appendTo(this.div);
|
this.right = $j("<div>Bottom / Right</div>").appendTo(this.div);
|
||||||
|
|
||||||
|
// Deferred object so we can wait for children
|
||||||
|
this.loading = jQuery.Deferred();
|
||||||
},
|
},
|
||||||
|
|
||||||
destroy: function() {
|
destroy: function() {
|
||||||
@ -141,7 +145,10 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable],
|
|||||||
window.setTimeout(function() {
|
window.setTimeout(function() {
|
||||||
self._init_splitter();
|
self._init_splitter();
|
||||||
},1);
|
},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 = {
|
var options = {
|
||||||
type: this.orientation,
|
type: this.orientation,
|
||||||
dock: this.dock_side,
|
dock: this.dock_side,
|
||||||
splitterClass: "et2_split"
|
splitterClass: "et2_split",
|
||||||
|
outline: true,
|
||||||
|
eventNamespace: '.et2_split.'+this.id
|
||||||
};
|
};
|
||||||
|
|
||||||
// Check for position preference, load it in
|
// Check for position preference, load it in
|
||||||
@ -175,6 +184,16 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable],
|
|||||||
// Initialize splitter
|
// Initialize splitter
|
||||||
this.div.splitter(options);
|
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
|
// Add icon to splitter bar
|
||||||
var icon = "ui-icon-grip-"
|
var icon = "ui-icon-grip-"
|
||||||
+ (this.dock_side ? "solid" : "dotted") + "-"
|
+ (this.dock_side ? "solid" : "dotted") + "-"
|
||||||
@ -189,12 +208,20 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable],
|
|||||||
if(this.id && this.egw().getAppName())
|
if(this.id && this.egw().getAppName())
|
||||||
{
|
{
|
||||||
self = this;
|
self = this;
|
||||||
this.left.next().on("mouseup", function() {
|
this.left.on("resize"+options.eventNamespace, function(e) {
|
||||||
|
if(e.namespace == options.eventNamespace.substr(1) && !self.isDocked())
|
||||||
|
{
|
||||||
// Store current position in preferences
|
// Store current position in preferences
|
||||||
var size = self.orientation == "v" ? {sizeLeft: self.left.width()} : {sizeTop: self.left.height()};
|
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.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() {
|
resize: function() {
|
||||||
if(this.dynheight)
|
if(this.dynheight)
|
||||||
{
|
{
|
||||||
|
var old = {w: this.div.width(), h: this.div.height()};
|
||||||
this.dynheight.update(function(w,h) {
|
this.dynheight.update(function(w,h) {
|
||||||
if(this.orientation == "v")
|
if(this.orientation == "v")
|
||||||
{
|
{
|
||||||
@ -213,15 +241,23 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable],
|
|||||||
{
|
{
|
||||||
this.left.width(w);
|
this.left.width(w);
|
||||||
this.right.width(w);
|
this.right.width(w);
|
||||||
|
if(this.isDocked()) {
|
||||||
if(this.dock_side == "topDock")
|
if(this.dock_side == "topDock")
|
||||||
{
|
{
|
||||||
this.right.height(h);
|
this.right.height(h);
|
||||||
|
this.left.height(0);
|
||||||
}
|
}
|
||||||
else
|
else
|
||||||
{
|
{
|
||||||
this.left.height(h);
|
this.left.height(h);
|
||||||
|
this.right.height(0);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
if(w != old.w || h != old.h)
|
||||||
|
{
|
||||||
|
this.div.trigger('resize.et2_split.'+this.id);
|
||||||
|
}
|
||||||
}, this);
|
}, this);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -267,6 +303,7 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable],
|
|||||||
* Docking requires the dock attribute to be set.
|
* Docking requires the dock attribute to be set.
|
||||||
*/
|
*/
|
||||||
dock: function() {
|
dock: function() {
|
||||||
|
if(this.isDocked()) return;
|
||||||
this.div.trigger("dock");
|
this.div.trigger("dock");
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -278,6 +315,15 @@ var et2_split = et2_DOMWidget.extend([et2_IResizeable],
|
|||||||
this.div.trigger("undock");
|
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.
|
* Toggle the splitter's docked state.
|
||||||
* Docking requires the dock attribute to be set.
|
* Docking requires the dock attribute to be set.
|
||||||
|
@ -104,6 +104,7 @@ div.et2_hbox>div {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
min-width: 100px;
|
min-width: 100px;
|
||||||
min-height: 100px;
|
min-height: 100px;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
.splitter-bar-vertical { cursor: ew-resize; width: 5px;}
|
.splitter-bar-vertical { cursor: ew-resize; width: 5px;}
|
||||||
.splitter-bar-horizontal { cursor: ns-resize; height: 5px;}
|
.splitter-bar-horizontal { cursor: ns-resize; height: 5px;}
|
||||||
|
2
phpgwapi/js/jquery/splitter.js
vendored
2
phpgwapi/js/jquery/splitter.js
vendored
@ -113,7 +113,7 @@ var splitterCounter = 0;
|
|||||||
A.css(opts.origin, 0).css(opts.split, pos).css(opts.fixed, splitter._DF);
|
A.css(opts.origin, 0).css(opts.split, pos).css(opts.fixed, splitter._DF);
|
||||||
B.css(opts.origin, pos+bar._DA)
|
B.css(opts.origin, pos+bar._DA)
|
||||||
.css(opts.split, splitter._DA-bar._DA-pos).css(opts.fixed, splitter._DF);
|
.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) {
|
function dimSum(jq, dims) {
|
||||||
// Opera returns -1 for missing min/max width, turn into 0
|
// Opera returns -1 for missing min/max width, turn into 0
|
||||||
|
Loading…
Reference in New Issue
Block a user