|
77 | 77 | }
|
78 | 78 | return prop
|
79 | 79 | },
|
80 |
| - _sizeProp: function(pane,prefix){ |
| 80 | + _sizeProp: function(prefix){ |
81 | 81 | prefix = prefix || '';
|
82 |
| - return toCamelCase(prefix +" " + (this.options[pane].resizable.handles.match(/e|w/) ? 'width' : 'height') ); |
| 82 | + return toCamelCase(prefix +" " + (this.options.type == 'horizontal' ? 'width' : 'height' )); |
83 | 83 | },
|
84 | 84 |
|
85 | 85 | _create: function(){
|
|
114 | 114 | self._open(pane)
|
115 | 115 |
|
116 | 116 | // set max width/height dynamically
|
117 |
| - $pane.resizable('option', self._sizeProp(pane,'max'), self._maxSize(pane)); |
| 117 | + $pane.resizable('option', self._sizeProp('max'), self._maxSize(pane)); |
118 | 118 | if ($pane.find('iframe').length){
|
119 | 119 | var $mask = $('<div class="iframe-mask"/>')
|
120 | 120 | $mask
|
|
154 | 154 |
|
155 | 155 |
|
156 | 156 | // prevent the pane to toggle after a mouseup event, if the orginal size has significantly been changed
|
157 |
| - if (Math.abs(ui.size[self._sizeProp(pane)] - ui.originalSize[self._sizeProp(pane)]) > 3){ |
| 157 | + if (Math.abs(ui.size[self._sizeProp()] - ui.originalSize[self._sizeProp()]) > 3){ |
158 | 158 | preventToggling = true;
|
159 | 159 | setTimeout(function(){
|
160 | 160 | preventToggling = false;
|
|
166 | 166 |
|
167 | 167 |
|
168 | 168 | // close the sidePane if not visible anymore, otherwise record its dimension
|
169 |
| - if (ui.size[self._sizeProp(pane)] < self.options[pane][self._sizeProp(pane, 'closing')]){ |
| 169 | + if (ui.size[self._sizeProp()] < self.options[pane][self._sizeProp('closing')]){ |
170 | 170 | self.close(pane)
|
171 | 171 | }
|
172 | 172 | else {
|
173 | 173 | self._opened(pane);
|
174 |
| - self.options[pane][self._sizeProp(pane)] = ui.size[self._sizeProp(pane)] |
| 174 | + self.options[pane][self._sizeProp()] = ui.size[self._sizeProp()] |
175 | 175 | }
|
176 | 176 |
|
177 | 177 | });
|
|
195 | 195 | // set pane dimension
|
196 | 196 | if(self.options[pane].sliding){
|
197 | 197 | self._sliding(pane)
|
198 |
| - $pane[self._sizeProp(pane)](0); |
| 198 | + $pane[self._sizeProp()](0); |
199 | 199 | self._closed(pane);
|
200 | 200 |
|
201 | 201 | }
|
202 | 202 | else if (self.options[pane].opened){
|
203 | 203 | self._open(pane, false);
|
204 |
| - $pane[self._sizeProp(pane,'outer')](self.options[pane][self._sizeProp(pane)], true) |
| 204 | + $pane[self._sizeProp('outer')](self.options[pane][self._sizeProp()], true) |
205 | 205 | }
|
206 | 206 |
|
207 | 207 | }
|
208 | 208 | });
|
209 | 209 |
|
210 |
| - this._resizeElement(); |
211 |
| - |
212 | 210 | if (this.element.hasClass('ui-layout-pane')){
|
213 | 211 | this.element.bind('resize',function(e){
|
214 | 212 | if (e.target == self.element[0]){
|
215 |
| - self._resizeElement(); |
| 213 | + self.resizeElement(); |
216 | 214 | }
|
217 | 215 | })
|
218 | 216 | }
|
219 | 217 | else {
|
220 | 218 | $(window).bind('resize', function(e){
|
221 |
| - self._resizeElement(); |
| 219 | + self.resizeElement(); |
222 | 220 | })
|
223 | 221 | }
|
| 222 | + |
| 223 | + this.resizeElement(); |
| 224 | + |
224 | 225 | },
|
225 | 226 |
|
226 |
| - _resizeElement: function(){ |
| 227 | + resizeElement: function(){ |
227 | 228 | var self = this;
|
228 | 229 |
|
229 | 230 | if (this.element[0].tagName == "BODY"){
|
230 |
| - this.element |
| 231 | + self.element |
231 | 232 | .css({padding: '0', margin: '0'})
|
232 | 233 | .outerWidth($(window).width(), true)
|
233 | 234 | .outerHeight($(window).height(), true);
|
234 |
| - } else if(!this.element.hasClass('ui-layout-pane')) { |
235 |
| - this.element |
236 |
| - .outerHeight(this.element.parent().innerHeight(), true) |
237 |
| - .outerWidth(this.element.parent().innerWidth(), true); |
| 235 | + } else if(!self.element.hasClass('ui-layout-pane')) { |
| 236 | + self.element |
| 237 | + .outerHeight(self.element.parent().innerHeight(), true) |
| 238 | + .outerWidth(self.element.parent().innerWidth(), true); |
238 | 239 | }
|
239 | 240 |
|
240 |
| - this._panes().each(function() { |
| 241 | + self._panes().each(function() { |
241 | 242 | if (self.options.type == 'horizontal')
|
242 | 243 | $(this).outerHeight(self.element.innerHeight(), true)
|
243 | 244 | else
|
244 | 245 | $(this).outerWidth(self.element.innerWidth(), true)
|
245 | 246 | });
|
246 | 247 |
|
247 | 248 | // resize center pane
|
248 |
| - this.resize(); |
| 249 | + self.resize(); |
249 | 250 |
|
| 251 | + return this; |
250 | 252 | },
|
251 | 253 | resize: function(){
|
252 | 254 | var self = this,
|
253 | 255 | $pane = this.panes['center'],
|
254 | 256 | $prev = $pane.prev('.ui-layout-pane');
|
255 | 257 |
|
256 |
| - var prefixedProp = function(prefix){ |
257 |
| - var prop = self.options.type == 'horizontal' ? 'width' : 'height'; |
258 |
| - return toCamelCase('outer '+ prop) |
259 |
| - } |
260 |
| - |
261 |
| - var parseValue = function(text){ |
262 |
| - return parseInt(text.match(/-*\d+/)) |
263 |
| - } |
264 |
| - |
265 | 258 | var sum = 0;
|
266 |
| - this.element.children(".ui-layout-pane:visible").not('.ui-layout-pane-center').each(function(){ |
267 |
| - sum+= $(this).hasClass('ui-layout-pane-sliding') ? $(this)[prefixedProp('outer')](true) - $(this)[prefixedProp('inner')]() : $(this)[prefixedProp('outer')](true); |
| 259 | + this.element.children(".ui-layout-pane").not('.ui-layout-pane-center').each(function(){ |
| 260 | + if ($(this).hasClass('ui-layout-pane-sliding')){ |
| 261 | + sum+= $(this)[self._sizeProp('outer')](true) - $(this)[self._sizeProp('inner')]() |
| 262 | + } |
| 263 | + else{ |
| 264 | + sum+= $(this)[self._sizeProp('outer')](true); |
| 265 | + } |
268 | 266 | });
|
269 | 267 |
|
270 |
| - $pane[prefixedProp('outer')](this.element[prefixedProp('max')]() - sum, true ); |
271 |
| - |
| 268 | + $pane[self._sizeProp('outer')](this.element[self._sizeProp('inner')]() - sum, true ); |
272 | 269 |
|
273 | 270 | var offset = function(){
|
274 | 271 | return self.options.type == 'horizontal' ? $prev.css('marginRight')+' 0' : '0 ' + $prev.css('marginBottom')
|
275 | 272 | }
|
| 273 | + |
276 | 274 | if ($prev.length && !$prev.hasClass('ui-layout-pane-sliding')){
|
277 | 275 | $pane.position({
|
278 | 276 | offset: offset(),
|
|
284 | 282 | }
|
285 | 283 | else{
|
286 | 284 | $pane.position({
|
287 |
| - offset: $prev.hasClass('ui-layout-pane-sliding') ? offset() : '', |
| 285 | + offset: $prev.hasClass('ui-layout-pane-sliding') ? offset() : '0 0', |
288 | 286 | of: this.element,
|
289 | 287 | my: 'left top',
|
290 |
| - at: 'left top' |
| 288 | + at: 'left top', |
| 289 | + collision: "none" |
291 | 290 | })
|
292 | 291 | }
|
293 | 292 |
|
294 | 293 | this._trigger('resize')
|
295 | 294 | // emulate a resize event from the center pane
|
296 | 295 | $pane.trigger('resize');
|
297 |
| - return this.element |
| 296 | + |
| 297 | + return this |
298 | 298 | },
|
299 | 299 | _putForeground:function(pane){
|
300 | 300 | var $pane = this.panes[pane],
|
|
362 | 362 | _maxSize:function(pane){
|
363 | 363 | var options = this.options[pane],
|
364 | 364 | $pane = this.panes[pane],
|
365 |
| - property = this._sizeProp(pane) |
| 365 | + property = this._sizeProp() |
366 | 366 |
|
367 |
| - return Math.min(options.resizable[this._sizeProp(pane,'max')], this.element[this._sizeProp(pane,'inner')]() - ( this.options['center'].minWidth + this._panes().not($pane).not(this.panes['center'])[this._sizeProp(pane,'outer')](true) )) |
| 367 | + return Math.min(options.resizable[this._sizeProp('max')], this.element[this._sizeProp('inner')]() - ( this.options['center'].minWidth + this._panes().not($pane).not(this.panes['center'])[this._sizeProp('outer')](true) )) |
368 | 368 | },
|
369 | 369 |
|
370 | 370 | _removeInlineStyleAttr: function(pane){
|
|
398 | 398 | callback = callback || null ;
|
399 | 399 | if (this.options[pane].opened){
|
400 | 400 | this._close(pane)
|
401 |
| - css[self._sizeProp(pane)] = 0; |
| 401 | + css[self._sizeProp()] = 0; |
402 | 402 | this._animate(pane, css, function(){
|
403 | 403 | self._closed(pane);
|
404 | 404 | if (callback)
|
|
413 | 413 | css = {} ;
|
414 | 414 | if (!this.options[pane].opened){
|
415 | 415 | this._open(pane)
|
416 |
| - css[self._sizeProp(pane)] = Math.min(this.options[pane][this._sizeProp(pane)], this._maxSize(pane)) ; |
| 416 | + css[self._sizeProp()] = Math.min(this.options[pane][this._sizeProp()], this._maxSize(pane)) ; |
417 | 417 | this._animate(pane, css, function(){
|
418 | 418 | self._opened(pane)
|
419 | 419 | if (callback)
|
|
0 commit comments