Mercurial > hg > STI-GWT
comparison war/scripts/jQuery/ui/jquery.ui.resizable.js @ 3:cf06b77a8bbd
Committed branch of the e4D repos sti-gwt branch 16384.
git-svn-id: http://dev.dariah.eu/svn/repos/eu.dariah.de/ap1/sti-gwt-dariah-geobrowser@36 f2b5be40-def6-11e0-8a09-b3c1cc336c6b
author | StefanFunk <StefanFunk@f2b5be40-def6-11e0-8a09-b3c1cc336c6b> |
---|---|
date | Tue, 17 Jul 2012 13:34:40 +0000 |
parents | |
children |
comparison
equal
deleted
inserted
replaced
2:2897af43ccc6 | 3:cf06b77a8bbd |
---|---|
1 /* | |
2 * jQuery UI Resizable 1.8.14 | |
3 * | |
4 * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) | |
5 * Dual licensed under the MIT or GPL Version 2 licenses. | |
6 * http://jquery.org/license | |
7 * | |
8 * http://docs.jquery.com/UI/Resizables | |
9 * | |
10 * Depends: | |
11 * jquery.ui.core.js | |
12 * jquery.ui.mouse.js | |
13 * jquery.ui.widget.js | |
14 */ | |
15 (function( $, undefined ) { | |
16 | |
17 $.widget("ui.resizable", $.ui.mouse, { | |
18 widgetEventPrefix: "resize", | |
19 options: { | |
20 alsoResize: false, | |
21 animate: false, | |
22 animateDuration: "slow", | |
23 animateEasing: "swing", | |
24 aspectRatio: false, | |
25 autoHide: false, | |
26 containment: false, | |
27 ghost: false, | |
28 grid: false, | |
29 handles: "e,s,se", | |
30 helper: false, | |
31 maxHeight: null, | |
32 maxWidth: null, | |
33 minHeight: 10, | |
34 minWidth: 10, | |
35 zIndex: 1000 | |
36 }, | |
37 _create: function() { | |
38 | |
39 var self = this, o = this.options; | |
40 this.element.addClass("ui-resizable"); | |
41 | |
42 $.extend(this, { | |
43 _aspectRatio: !!(o.aspectRatio), | |
44 aspectRatio: o.aspectRatio, | |
45 originalElement: this.element, | |
46 _proportionallyResizeElements: [], | |
47 _helper: o.helper || o.ghost || o.animate ? o.helper || 'ui-resizable-helper' : null | |
48 }); | |
49 | |
50 //Wrap the element if it cannot hold child nodes | |
51 if(this.element[0].nodeName.match(/canvas|textarea|input|select|button|img/i)) { | |
52 | |
53 //Opera fix for relative positioning | |
54 if (/relative/.test(this.element.css('position')) && $.browser.opera) | |
55 this.element.css({ position: 'relative', top: 'auto', left: 'auto' }); | |
56 | |
57 //Create a wrapper element and set the wrapper to the new current internal element | |
58 this.element.wrap( | |
59 $('<div class="ui-wrapper" style="overflow: hidden;"></div>').css({ | |
60 position: this.element.css('position'), | |
61 width: this.element.outerWidth(), | |
62 height: this.element.outerHeight(), | |
63 top: this.element.css('top'), | |
64 left: this.element.css('left') | |
65 }) | |
66 ); | |
67 | |
68 //Overwrite the original this.element | |
69 this.element = this.element.parent().data( | |
70 "resizable", this.element.data('resizable') | |
71 ); | |
72 | |
73 this.elementIsWrapper = true; | |
74 | |
75 //Move margins to the wrapper | |
76 this.element.css({ marginLeft: this.originalElement.css("marginLeft"), marginTop: this.originalElement.css("marginTop"), marginRight: this.originalElement.css("marginRight"), marginBottom: this.originalElement.css("marginBottom") }); | |
77 this.originalElement.css({ marginLeft: 0, marginTop: 0, marginRight: 0, marginBottom: 0}); | |
78 | |
79 //Prevent Safari textarea resize | |
80 this.originalResizeStyle = this.originalElement.css('resize'); | |
81 this.originalElement.css('resize', 'none'); | |
82 | |
83 //Push the actual element to our proportionallyResize internal array | |
84 this._proportionallyResizeElements.push(this.originalElement.css({ position: 'static', zoom: 1, display: 'block' })); | |
85 | |
86 // avoid IE jump (hard set the margin) | |
87 this.originalElement.css({ margin: this.originalElement.css('margin') }); | |
88 | |
89 // fix handlers offset | |
90 this._proportionallyResize(); | |
91 | |
92 } | |
93 | |
94 this.handles = o.handles || (!$('.ui-resizable-handle', this.element).length ? "e,s,se" : { n: '.ui-resizable-n', e: '.ui-resizable-e', s: '.ui-resizable-s', w: '.ui-resizable-w', se: '.ui-resizable-se', sw: '.ui-resizable-sw', ne: '.ui-resizable-ne', nw: '.ui-resizable-nw' }); | |
95 if(this.handles.constructor == String) { | |
96 | |
97 if(this.handles == 'all') this.handles = 'n,e,s,w,se,sw,ne,nw'; | |
98 var n = this.handles.split(","); this.handles = {}; | |
99 | |
100 for(var i = 0; i < n.length; i++) { | |
101 | |
102 var handle = $.trim(n[i]), hname = 'ui-resizable-'+handle; | |
103 var axis = $('<div class="ui-resizable-handle ' + hname + '"></div>'); | |
104 | |
105 // increase zIndex of sw, se, ne, nw axis | |
106 //TODO : this modifies original option | |
107 if(/sw|se|ne|nw/.test(handle)) axis.css({ zIndex: ++o.zIndex }); | |
108 | |
109 //TODO : What's going on here? | |
110 if ('se' == handle) { | |
111 axis.addClass('ui-icon ui-icon-gripsmall-diagonal-se'); | |
112 }; | |
113 | |
114 //Insert into internal handles object and append to element | |
115 this.handles[handle] = '.ui-resizable-'+handle; | |
116 this.element.append(axis); | |
117 } | |
118 | |
119 } | |
120 | |
121 this._renderAxis = function(target) { | |
122 | |
123 target = target || this.element; | |
124 | |
125 for(var i in this.handles) { | |
126 | |
127 if(this.handles[i].constructor == String) | |
128 this.handles[i] = $(this.handles[i], this.element).show(); | |
129 | |
130 //Apply pad to wrapper element, needed to fix axis position (textarea, inputs, scrolls) | |
131 if (this.elementIsWrapper && this.originalElement[0].nodeName.match(/textarea|input|select|button/i)) { | |
132 | |
133 var axis = $(this.handles[i], this.element), padWrapper = 0; | |
134 | |
135 //Checking the correct pad and border | |
136 padWrapper = /sw|ne|nw|se|n|s/.test(i) ? axis.outerHeight() : axis.outerWidth(); | |
137 | |
138 //The padding type i have to apply... | |
139 var padPos = [ 'padding', | |
140 /ne|nw|n/.test(i) ? 'Top' : | |
141 /se|sw|s/.test(i) ? 'Bottom' : | |
142 /^e$/.test(i) ? 'Right' : 'Left' ].join(""); | |
143 | |
144 target.css(padPos, padWrapper); | |
145 | |
146 this._proportionallyResize(); | |
147 | |
148 } | |
149 | |
150 //TODO: What's that good for? There's not anything to be executed left | |
151 if(!$(this.handles[i]).length) | |
152 continue; | |
153 | |
154 } | |
155 }; | |
156 | |
157 //TODO: make renderAxis a prototype function | |
158 this._renderAxis(this.element); | |
159 | |
160 this._handles = $('.ui-resizable-handle', this.element) | |
161 .disableSelection(); | |
162 | |
163 //Matching axis name | |
164 this._handles.mouseover(function() { | |
165 if (!self.resizing) { | |
166 if (this.className) | |
167 var axis = this.className.match(/ui-resizable-(se|sw|ne|nw|n|e|s|w)/i); | |
168 //Axis, default = se | |
169 self.axis = axis && axis[1] ? axis[1] : 'se'; | |
170 } | |
171 }); | |
172 | |
173 //If we want to auto hide the elements | |
174 if (o.autoHide) { | |
175 this._handles.hide(); | |
176 $(this.element) | |
177 .addClass("ui-resizable-autohide") | |
178 .hover(function() { | |
179 if (o.disabled) return; | |
180 $(this).removeClass("ui-resizable-autohide"); | |
181 self._handles.show(); | |
182 }, | |
183 function(){ | |
184 if (o.disabled) return; | |
185 if (!self.resizing) { | |
186 $(this).addClass("ui-resizable-autohide"); | |
187 self._handles.hide(); | |
188 } | |
189 }); | |
190 } | |
191 | |
192 //Initialize the mouse interaction | |
193 this._mouseInit(); | |
194 | |
195 }, | |
196 | |
197 destroy: function() { | |
198 | |
199 this._mouseDestroy(); | |
200 | |
201 var _destroy = function(exp) { | |
202 $(exp).removeClass("ui-resizable ui-resizable-disabled ui-resizable-resizing") | |
203 .removeData("resizable").unbind(".resizable").find('.ui-resizable-handle').remove(); | |
204 }; | |
205 | |
206 //TODO: Unwrap at same DOM position | |
207 if (this.elementIsWrapper) { | |
208 _destroy(this.element); | |
209 var wrapper = this.element; | |
210 wrapper.after( | |
211 this.originalElement.css({ | |
212 position: wrapper.css('position'), | |
213 width: wrapper.outerWidth(), | |
214 height: wrapper.outerHeight(), | |
215 top: wrapper.css('top'), | |
216 left: wrapper.css('left') | |
217 }) | |
218 ).remove(); | |
219 } | |
220 | |
221 this.originalElement.css('resize', this.originalResizeStyle); | |
222 _destroy(this.originalElement); | |
223 | |
224 return this; | |
225 }, | |
226 | |
227 _mouseCapture: function(event) { | |
228 var handle = false; | |
229 for (var i in this.handles) { | |
230 if ($(this.handles[i])[0] == event.target) { | |
231 handle = true; | |
232 } | |
233 } | |
234 | |
235 return !this.options.disabled && handle; | |
236 }, | |
237 | |
238 _mouseStart: function(event) { | |
239 | |
240 var o = this.options, iniPos = this.element.position(), el = this.element; | |
241 | |
242 this.resizing = true; | |
243 this.documentScroll = { top: $(document).scrollTop(), left: $(document).scrollLeft() }; | |
244 | |
245 // bugfix for http://dev.jquery.com/ticket/1749 | |
246 if (el.is('.ui-draggable') || (/absolute/).test(el.css('position'))) { | |
247 el.css({ position: 'absolute', top: iniPos.top, left: iniPos.left }); | |
248 } | |
249 | |
250 //Opera fixing relative position | |
251 if ($.browser.opera && (/relative/).test(el.css('position'))) | |
252 el.css({ position: 'relative', top: 'auto', left: 'auto' }); | |
253 | |
254 this._renderProxy(); | |
255 | |
256 var curleft = num(this.helper.css('left')), curtop = num(this.helper.css('top')); | |
257 | |
258 if (o.containment) { | |
259 curleft += $(o.containment).scrollLeft() || 0; | |
260 curtop += $(o.containment).scrollTop() || 0; | |
261 } | |
262 | |
263 //Store needed variables | |
264 this.offset = this.helper.offset(); | |
265 this.position = { left: curleft, top: curtop }; | |
266 this.size = this._helper ? { width: el.outerWidth(), height: el.outerHeight() } : { width: el.width(), height: el.height() }; | |
267 this.originalSize = this._helper ? { width: el.outerWidth(), height: el.outerHeight() } : { width: el.width(), height: el.height() }; | |
268 this.originalPosition = { left: curleft, top: curtop }; | |
269 this.sizeDiff = { width: el.outerWidth() - el.width(), height: el.outerHeight() - el.height() }; | |
270 this.originalMousePosition = { left: event.pageX, top: event.pageY }; | |
271 | |
272 //Aspect Ratio | |
273 this.aspectRatio = (typeof o.aspectRatio == 'number') ? o.aspectRatio : ((this.originalSize.width / this.originalSize.height) || 1); | |
274 | |
275 var cursor = $('.ui-resizable-' + this.axis).css('cursor'); | |
276 $('body').css('cursor', cursor == 'auto' ? this.axis + '-resize' : cursor); | |
277 | |
278 el.addClass("ui-resizable-resizing"); | |
279 this._propagate("start", event); | |
280 return true; | |
281 }, | |
282 | |
283 _mouseDrag: function(event) { | |
284 | |
285 //Increase performance, avoid regex | |
286 var el = this.helper, o = this.options, props = {}, | |
287 self = this, smp = this.originalMousePosition, a = this.axis; | |
288 | |
289 var dx = (event.pageX-smp.left)||0, dy = (event.pageY-smp.top)||0; | |
290 var trigger = this._change[a]; | |
291 if (!trigger) return false; | |
292 | |
293 // Calculate the attrs that will be change | |
294 var data = trigger.apply(this, [event, dx, dy]), ie6 = $.browser.msie && $.browser.version < 7, csdif = this.sizeDiff; | |
295 | |
296 // Put this in the mouseDrag handler since the user can start pressing shift while resizing | |
297 this._updateVirtualBoundaries(event.shiftKey); | |
298 if (this._aspectRatio || event.shiftKey) | |
299 data = this._updateRatio(data, event); | |
300 | |
301 data = this._respectSize(data, event); | |
302 | |
303 // plugins callbacks need to be called first | |
304 this._propagate("resize", event); | |
305 | |
306 el.css({ | |
307 top: this.position.top + "px", left: this.position.left + "px", | |
308 width: this.size.width + "px", height: this.size.height + "px" | |
309 }); | |
310 | |
311 if (!this._helper && this._proportionallyResizeElements.length) | |
312 this._proportionallyResize(); | |
313 | |
314 this._updateCache(data); | |
315 | |
316 // calling the user callback at the end | |
317 this._trigger('resize', event, this.ui()); | |
318 | |
319 return false; | |
320 }, | |
321 | |
322 _mouseStop: function(event) { | |
323 | |
324 this.resizing = false; | |
325 var o = this.options, self = this; | |
326 | |
327 if(this._helper) { | |
328 var pr = this._proportionallyResizeElements, ista = pr.length && (/textarea/i).test(pr[0].nodeName), | |
329 soffseth = ista && $.ui.hasScroll(pr[0], 'left') /* TODO - jump height */ ? 0 : self.sizeDiff.height, | |
330 soffsetw = ista ? 0 : self.sizeDiff.width; | |
331 | |
332 var s = { width: (self.helper.width() - soffsetw), height: (self.helper.height() - soffseth) }, | |
333 left = (parseInt(self.element.css('left'), 10) + (self.position.left - self.originalPosition.left)) || null, | |
334 top = (parseInt(self.element.css('top'), 10) + (self.position.top - self.originalPosition.top)) || null; | |
335 | |
336 if (!o.animate) | |
337 this.element.css($.extend(s, { top: top, left: left })); | |
338 | |
339 self.helper.height(self.size.height); | |
340 self.helper.width(self.size.width); | |
341 | |
342 if (this._helper && !o.animate) this._proportionallyResize(); | |
343 } | |
344 | |
345 $('body').css('cursor', 'auto'); | |
346 | |
347 this.element.removeClass("ui-resizable-resizing"); | |
348 | |
349 this._propagate("stop", event); | |
350 | |
351 if (this._helper) this.helper.remove(); | |
352 return false; | |
353 | |
354 }, | |
355 | |
356 _updateVirtualBoundaries: function(forceAspectRatio) { | |
357 var o = this.options, pMinWidth, pMaxWidth, pMinHeight, pMaxHeight, b; | |
358 | |
359 b = { | |
360 minWidth: isNumber(o.minWidth) ? o.minWidth : 0, | |
361 maxWidth: isNumber(o.maxWidth) ? o.maxWidth : Infinity, | |
362 minHeight: isNumber(o.minHeight) ? o.minHeight : 0, | |
363 maxHeight: isNumber(o.maxHeight) ? o.maxHeight : Infinity | |
364 }; | |
365 | |
366 if(this._aspectRatio || forceAspectRatio) { | |
367 // We want to create an enclosing box whose aspect ration is the requested one | |
368 // First, compute the "projected" size for each dimension based on the aspect ratio and other dimension | |
369 pMinWidth = b.minHeight * this.aspectRatio; | |
370 pMinHeight = b.minWidth / this.aspectRatio; | |
371 pMaxWidth = b.maxHeight * this.aspectRatio; | |
372 pMaxHeight = b.maxWidth / this.aspectRatio; | |
373 | |
374 if(pMinWidth > b.minWidth) b.minWidth = pMinWidth; | |
375 if(pMinHeight > b.minHeight) b.minHeight = pMinHeight; | |
376 if(pMaxWidth < b.maxWidth) b.maxWidth = pMaxWidth; | |
377 if(pMaxHeight < b.maxHeight) b.maxHeight = pMaxHeight; | |
378 } | |
379 this._vBoundaries = b; | |
380 }, | |
381 | |
382 _updateCache: function(data) { | |
383 var o = this.options; | |
384 this.offset = this.helper.offset(); | |
385 if (isNumber(data.left)) this.position.left = data.left; | |
386 if (isNumber(data.top)) this.position.top = data.top; | |
387 if (isNumber(data.height)) this.size.height = data.height; | |
388 if (isNumber(data.width)) this.size.width = data.width; | |
389 }, | |
390 | |
391 _updateRatio: function(data, event) { | |
392 | |
393 var o = this.options, cpos = this.position, csize = this.size, a = this.axis; | |
394 | |
395 if (isNumber(data.height)) data.width = (data.height * this.aspectRatio); | |
396 else if (isNumber(data.width)) data.height = (data.width / this.aspectRatio); | |
397 | |
398 if (a == 'sw') { | |
399 data.left = cpos.left + (csize.width - data.width); | |
400 data.top = null; | |
401 } | |
402 if (a == 'nw') { | |
403 data.top = cpos.top + (csize.height - data.height); | |
404 data.left = cpos.left + (csize.width - data.width); | |
405 } | |
406 | |
407 return data; | |
408 }, | |
409 | |
410 _respectSize: function(data, event) { | |
411 | |
412 var el = this.helper, o = this._vBoundaries, pRatio = this._aspectRatio || event.shiftKey, a = this.axis, | |
413 ismaxw = isNumber(data.width) && o.maxWidth && (o.maxWidth < data.width), ismaxh = isNumber(data.height) && o.maxHeight && (o.maxHeight < data.height), | |
414 isminw = isNumber(data.width) && o.minWidth && (o.minWidth > data.width), isminh = isNumber(data.height) && o.minHeight && (o.minHeight > data.height); | |
415 | |
416 if (isminw) data.width = o.minWidth; | |
417 if (isminh) data.height = o.minHeight; | |
418 if (ismaxw) data.width = o.maxWidth; | |
419 if (ismaxh) data.height = o.maxHeight; | |
420 | |
421 var dw = this.originalPosition.left + this.originalSize.width, dh = this.position.top + this.size.height; | |
422 var cw = /sw|nw|w/.test(a), ch = /nw|ne|n/.test(a); | |
423 | |
424 if (isminw && cw) data.left = dw - o.minWidth; | |
425 if (ismaxw && cw) data.left = dw - o.maxWidth; | |
426 if (isminh && ch) data.top = dh - o.minHeight; | |
427 if (ismaxh && ch) data.top = dh - o.maxHeight; | |
428 | |
429 // fixing jump error on top/left - bug #2330 | |
430 var isNotwh = !data.width && !data.height; | |
431 if (isNotwh && !data.left && data.top) data.top = null; | |
432 else if (isNotwh && !data.top && data.left) data.left = null; | |
433 | |
434 return data; | |
435 }, | |
436 | |
437 _proportionallyResize: function() { | |
438 | |
439 var o = this.options; | |
440 if (!this._proportionallyResizeElements.length) return; | |
441 var element = this.helper || this.element; | |
442 | |
443 for (var i=0; i < this._proportionallyResizeElements.length; i++) { | |
444 | |
445 var prel = this._proportionallyResizeElements[i]; | |
446 | |
447 if (!this.borderDif) { | |
448 var b = [prel.css('borderTopWidth'), prel.css('borderRightWidth'), prel.css('borderBottomWidth'), prel.css('borderLeftWidth')], | |
449 p = [prel.css('paddingTop'), prel.css('paddingRight'), prel.css('paddingBottom'), prel.css('paddingLeft')]; | |
450 | |
451 this.borderDif = $.map(b, function(v, i) { | |
452 var border = parseInt(v,10)||0, padding = parseInt(p[i],10)||0; | |
453 return border + padding; | |
454 }); | |
455 } | |
456 | |
457 if ($.browser.msie && !(!($(element).is(':hidden') || $(element).parents(':hidden').length))) | |
458 continue; | |
459 | |
460 prel.css({ | |
461 height: (element.height() - this.borderDif[0] - this.borderDif[2]) || 0, | |
462 width: (element.width() - this.borderDif[1] - this.borderDif[3]) || 0 | |
463 }); | |
464 | |
465 }; | |
466 | |
467 }, | |
468 | |
469 _renderProxy: function() { | |
470 | |
471 var el = this.element, o = this.options; | |
472 this.elementOffset = el.offset(); | |
473 | |
474 if(this._helper) { | |
475 | |
476 this.helper = this.helper || $('<div style="overflow:hidden;"></div>'); | |
477 | |
478 // fix ie6 offset TODO: This seems broken | |
479 var ie6 = $.browser.msie && $.browser.version < 7, ie6offset = (ie6 ? 1 : 0), | |
480 pxyoffset = ( ie6 ? 2 : -1 ); | |
481 | |
482 this.helper.addClass(this._helper).css({ | |
483 width: this.element.outerWidth() + pxyoffset, | |
484 height: this.element.outerHeight() + pxyoffset, | |
485 position: 'absolute', | |
486 left: this.elementOffset.left - ie6offset +'px', | |
487 top: this.elementOffset.top - ie6offset +'px', | |
488 zIndex: ++o.zIndex //TODO: Don't modify option | |
489 }); | |
490 | |
491 this.helper | |
492 .appendTo("body") | |
493 .disableSelection(); | |
494 | |
495 } else { | |
496 this.helper = this.element; | |
497 } | |
498 | |
499 }, | |
500 | |
501 _change: { | |
502 e: function(event, dx, dy) { | |
503 return { width: this.originalSize.width + dx }; | |
504 }, | |
505 w: function(event, dx, dy) { | |
506 var o = this.options, cs = this.originalSize, sp = this.originalPosition; | |
507 return { left: sp.left + dx, width: cs.width - dx }; | |
508 }, | |
509 n: function(event, dx, dy) { | |
510 var o = this.options, cs = this.originalSize, sp = this.originalPosition; | |
511 return { top: sp.top + dy, height: cs.height - dy }; | |
512 }, | |
513 s: function(event, dx, dy) { | |
514 return { height: this.originalSize.height + dy }; | |
515 }, | |
516 se: function(event, dx, dy) { | |
517 return $.extend(this._change.s.apply(this, arguments), this._change.e.apply(this, [event, dx, dy])); | |
518 }, | |
519 sw: function(event, dx, dy) { | |
520 return $.extend(this._change.s.apply(this, arguments), this._change.w.apply(this, [event, dx, dy])); | |
521 }, | |
522 ne: function(event, dx, dy) { | |
523 return $.extend(this._change.n.apply(this, arguments), this._change.e.apply(this, [event, dx, dy])); | |
524 }, | |
525 nw: function(event, dx, dy) { | |
526 return $.extend(this._change.n.apply(this, arguments), this._change.w.apply(this, [event, dx, dy])); | |
527 } | |
528 }, | |
529 | |
530 _propagate: function(n, event) { | |
531 $.ui.plugin.call(this, n, [event, this.ui()]); | |
532 (n != "resize" && this._trigger(n, event, this.ui())); | |
533 }, | |
534 | |
535 plugins: {}, | |
536 | |
537 ui: function() { | |
538 return { | |
539 originalElement: this.originalElement, | |
540 element: this.element, | |
541 helper: this.helper, | |
542 position: this.position, | |
543 size: this.size, | |
544 originalSize: this.originalSize, | |
545 originalPosition: this.originalPosition | |
546 }; | |
547 } | |
548 | |
549 }); | |
550 | |
551 $.extend($.ui.resizable, { | |
552 version: "1.8.14" | |
553 }); | |
554 | |
555 /* | |
556 * Resizable Extensions | |
557 */ | |
558 | |
559 $.ui.plugin.add("resizable", "alsoResize", { | |
560 | |
561 start: function (event, ui) { | |
562 var self = $(this).data("resizable"), o = self.options; | |
563 | |
564 var _store = function (exp) { | |
565 $(exp).each(function() { | |
566 var el = $(this); | |
567 el.data("resizable-alsoresize", { | |
568 width: parseInt(el.width(), 10), height: parseInt(el.height(), 10), | |
569 left: parseInt(el.css('left'), 10), top: parseInt(el.css('top'), 10), | |
570 position: el.css('position') // to reset Opera on stop() | |
571 }); | |
572 }); | |
573 }; | |
574 | |
575 if (typeof(o.alsoResize) == 'object' && !o.alsoResize.parentNode) { | |
576 if (o.alsoResize.length) { o.alsoResize = o.alsoResize[0]; _store(o.alsoResize); } | |
577 else { $.each(o.alsoResize, function (exp) { _store(exp); }); } | |
578 }else{ | |
579 _store(o.alsoResize); | |
580 } | |
581 }, | |
582 | |
583 resize: function (event, ui) { | |
584 var self = $(this).data("resizable"), o = self.options, os = self.originalSize, op = self.originalPosition; | |
585 | |
586 var delta = { | |
587 height: (self.size.height - os.height) || 0, width: (self.size.width - os.width) || 0, | |
588 top: (self.position.top - op.top) || 0, left: (self.position.left - op.left) || 0 | |
589 }, | |
590 | |
591 _alsoResize = function (exp, c) { | |
592 $(exp).each(function() { | |
593 var el = $(this), start = $(this).data("resizable-alsoresize"), style = {}, | |
594 css = c && c.length ? c : el.parents(ui.originalElement[0]).length ? ['width', 'height'] : ['width', 'height', 'top', 'left']; | |
595 | |
596 $.each(css, function (i, prop) { | |
597 var sum = (start[prop]||0) + (delta[prop]||0); | |
598 if (sum && sum >= 0) | |
599 style[prop] = sum || null; | |
600 }); | |
601 | |
602 // Opera fixing relative position | |
603 if ($.browser.opera && /relative/.test(el.css('position'))) { | |
604 self._revertToRelativePosition = true; | |
605 el.css({ position: 'absolute', top: 'auto', left: 'auto' }); | |
606 } | |
607 | |
608 el.css(style); | |
609 }); | |
610 }; | |
611 | |
612 if (typeof(o.alsoResize) == 'object' && !o.alsoResize.nodeType) { | |
613 $.each(o.alsoResize, function (exp, c) { _alsoResize(exp, c); }); | |
614 }else{ | |
615 _alsoResize(o.alsoResize); | |
616 } | |
617 }, | |
618 | |
619 stop: function (event, ui) { | |
620 var self = $(this).data("resizable"), o = self.options; | |
621 | |
622 var _reset = function (exp) { | |
623 $(exp).each(function() { | |
624 var el = $(this); | |
625 // reset position for Opera - no need to verify it was changed | |
626 el.css({ position: el.data("resizable-alsoresize").position }); | |
627 }); | |
628 }; | |
629 | |
630 if (self._revertToRelativePosition) { | |
631 self._revertToRelativePosition = false; | |
632 if (typeof(o.alsoResize) == 'object' && !o.alsoResize.nodeType) { | |
633 $.each(o.alsoResize, function (exp) { _reset(exp); }); | |
634 }else{ | |
635 _reset(o.alsoResize); | |
636 } | |
637 } | |
638 | |
639 $(this).removeData("resizable-alsoresize"); | |
640 } | |
641 }); | |
642 | |
643 $.ui.plugin.add("resizable", "animate", { | |
644 | |
645 stop: function(event, ui) { | |
646 var self = $(this).data("resizable"), o = self.options; | |
647 | |
648 var pr = self._proportionallyResizeElements, ista = pr.length && (/textarea/i).test(pr[0].nodeName), | |
649 soffseth = ista && $.ui.hasScroll(pr[0], 'left') /* TODO - jump height */ ? 0 : self.sizeDiff.height, | |
650 soffsetw = ista ? 0 : self.sizeDiff.width; | |
651 | |
652 var style = { width: (self.size.width - soffsetw), height: (self.size.height - soffseth) }, | |
653 left = (parseInt(self.element.css('left'), 10) + (self.position.left - self.originalPosition.left)) || null, | |
654 top = (parseInt(self.element.css('top'), 10) + (self.position.top - self.originalPosition.top)) || null; | |
655 | |
656 self.element.animate( | |
657 $.extend(style, top && left ? { top: top, left: left } : {}), { | |
658 duration: o.animateDuration, | |
659 easing: o.animateEasing, | |
660 step: function() { | |
661 | |
662 var data = { | |
663 width: parseInt(self.element.css('width'), 10), | |
664 height: parseInt(self.element.css('height'), 10), | |
665 top: parseInt(self.element.css('top'), 10), | |
666 left: parseInt(self.element.css('left'), 10) | |
667 }; | |
668 | |
669 if (pr && pr.length) $(pr[0]).css({ width: data.width, height: data.height }); | |
670 | |
671 // propagating resize, and updating values for each animation step | |
672 self._updateCache(data); | |
673 self._propagate("resize", event); | |
674 | |
675 } | |
676 } | |
677 ); | |
678 } | |
679 | |
680 }); | |
681 | |
682 $.ui.plugin.add("resizable", "containment", { | |
683 | |
684 start: function(event, ui) { | |
685 var self = $(this).data("resizable"), o = self.options, el = self.element; | |
686 var oc = o.containment, ce = (oc instanceof $) ? oc.get(0) : (/parent/.test(oc)) ? el.parent().get(0) : oc; | |
687 if (!ce) return; | |
688 | |
689 self.containerElement = $(ce); | |
690 | |
691 if (/document/.test(oc) || oc == document) { | |
692 self.containerOffset = { left: 0, top: 0 }; | |
693 self.containerPosition = { left: 0, top: 0 }; | |
694 | |
695 self.parentData = { | |
696 element: $(document), left: 0, top: 0, | |
697 width: $(document).width(), height: $(document).height() || document.body.parentNode.scrollHeight | |
698 }; | |
699 } | |
700 | |
701 // i'm a node, so compute top, left, right, bottom | |
702 else { | |
703 var element = $(ce), p = []; | |
704 $([ "Top", "Right", "Left", "Bottom" ]).each(function(i, name) { p[i] = num(element.css("padding" + name)); }); | |
705 | |
706 self.containerOffset = element.offset(); | |
707 self.containerPosition = element.position(); | |
708 self.containerSize = { height: (element.innerHeight() - p[3]), width: (element.innerWidth() - p[1]) }; | |
709 | |
710 var co = self.containerOffset, ch = self.containerSize.height, cw = self.containerSize.width, | |
711 width = ($.ui.hasScroll(ce, "left") ? ce.scrollWidth : cw ), height = ($.ui.hasScroll(ce) ? ce.scrollHeight : ch); | |
712 | |
713 self.parentData = { | |
714 element: ce, left: co.left, top: co.top, width: width, height: height | |
715 }; | |
716 } | |
717 }, | |
718 | |
719 resize: function(event, ui) { | |
720 var self = $(this).data("resizable"), o = self.options, | |
721 ps = self.containerSize, co = self.containerOffset, cs = self.size, cp = self.position, | |
722 pRatio = self._aspectRatio || event.shiftKey, cop = { top:0, left:0 }, ce = self.containerElement; | |
723 | |
724 if (ce[0] != document && (/static/).test(ce.css('position'))) cop = co; | |
725 | |
726 if (cp.left < (self._helper ? co.left : 0)) { | |
727 self.size.width = self.size.width + (self._helper ? (self.position.left - co.left) : (self.position.left - cop.left)); | |
728 if (pRatio) self.size.height = self.size.width / o.aspectRatio; | |
729 self.position.left = o.helper ? co.left : 0; | |
730 } | |
731 | |
732 if (cp.top < (self._helper ? co.top : 0)) { | |
733 self.size.height = self.size.height + (self._helper ? (self.position.top - co.top) : self.position.top); | |
734 if (pRatio) self.size.width = self.size.height * o.aspectRatio; | |
735 self.position.top = self._helper ? co.top : 0; | |
736 } | |
737 | |
738 self.offset.left = self.parentData.left+self.position.left; | |
739 self.offset.top = self.parentData.top+self.position.top; | |
740 | |
741 var woset = Math.abs( (self._helper ? self.offset.left - cop.left : (self.offset.left - cop.left)) + self.sizeDiff.width ), | |
742 hoset = Math.abs( (self._helper ? self.offset.top - cop.top : (self.offset.top - co.top)) + self.sizeDiff.height ); | |
743 | |
744 var isParent = self.containerElement.get(0) == self.element.parent().get(0), | |
745 isOffsetRelative = /relative|absolute/.test(self.containerElement.css('position')); | |
746 | |
747 if(isParent && isOffsetRelative) woset -= self.parentData.left; | |
748 | |
749 if (woset + self.size.width >= self.parentData.width) { | |
750 self.size.width = self.parentData.width - woset; | |
751 if (pRatio) self.size.height = self.size.width / self.aspectRatio; | |
752 } | |
753 | |
754 if (hoset + self.size.height >= self.parentData.height) { | |
755 self.size.height = self.parentData.height - hoset; | |
756 if (pRatio) self.size.width = self.size.height * self.aspectRatio; | |
757 } | |
758 }, | |
759 | |
760 stop: function(event, ui){ | |
761 var self = $(this).data("resizable"), o = self.options, cp = self.position, | |
762 co = self.containerOffset, cop = self.containerPosition, ce = self.containerElement; | |
763 | |
764 var helper = $(self.helper), ho = helper.offset(), w = helper.outerWidth() - self.sizeDiff.width, h = helper.outerHeight() - self.sizeDiff.height; | |
765 | |
766 if (self._helper && !o.animate && (/relative/).test(ce.css('position'))) | |
767 $(this).css({ left: ho.left - cop.left - co.left, width: w, height: h }); | |
768 | |
769 if (self._helper && !o.animate && (/static/).test(ce.css('position'))) | |
770 $(this).css({ left: ho.left - cop.left - co.left, width: w, height: h }); | |
771 | |
772 } | |
773 }); | |
774 | |
775 $.ui.plugin.add("resizable", "ghost", { | |
776 | |
777 start: function(event, ui) { | |
778 | |
779 var self = $(this).data("resizable"), o = self.options, cs = self.size; | |
780 | |
781 self.ghost = self.originalElement.clone(); | |
782 self.ghost | |
783 .css({ opacity: .25, display: 'block', position: 'relative', height: cs.height, width: cs.width, margin: 0, left: 0, top: 0 }) | |
784 .addClass('ui-resizable-ghost') | |
785 .addClass(typeof o.ghost == 'string' ? o.ghost : ''); | |
786 | |
787 self.ghost.appendTo(self.helper); | |
788 | |
789 }, | |
790 | |
791 resize: function(event, ui){ | |
792 var self = $(this).data("resizable"), o = self.options; | |
793 if (self.ghost) self.ghost.css({ position: 'relative', height: self.size.height, width: self.size.width }); | |
794 }, | |
795 | |
796 stop: function(event, ui){ | |
797 var self = $(this).data("resizable"), o = self.options; | |
798 if (self.ghost && self.helper) self.helper.get(0).removeChild(self.ghost.get(0)); | |
799 } | |
800 | |
801 }); | |
802 | |
803 $.ui.plugin.add("resizable", "grid", { | |
804 | |
805 resize: function(event, ui) { | |
806 var self = $(this).data("resizable"), o = self.options, cs = self.size, os = self.originalSize, op = self.originalPosition, a = self.axis, ratio = o._aspectRatio || event.shiftKey; | |
807 o.grid = typeof o.grid == "number" ? [o.grid, o.grid] : o.grid; | |
808 var ox = Math.round((cs.width - os.width) / (o.grid[0]||1)) * (o.grid[0]||1), oy = Math.round((cs.height - os.height) / (o.grid[1]||1)) * (o.grid[1]||1); | |
809 | |
810 if (/^(se|s|e)$/.test(a)) { | |
811 self.size.width = os.width + ox; | |
812 self.size.height = os.height + oy; | |
813 } | |
814 else if (/^(ne)$/.test(a)) { | |
815 self.size.width = os.width + ox; | |
816 self.size.height = os.height + oy; | |
817 self.position.top = op.top - oy; | |
818 } | |
819 else if (/^(sw)$/.test(a)) { | |
820 self.size.width = os.width + ox; | |
821 self.size.height = os.height + oy; | |
822 self.position.left = op.left - ox; | |
823 } | |
824 else { | |
825 self.size.width = os.width + ox; | |
826 self.size.height = os.height + oy; | |
827 self.position.top = op.top - oy; | |
828 self.position.left = op.left - ox; | |
829 } | |
830 } | |
831 | |
832 }); | |
833 | |
834 var num = function(v) { | |
835 return parseInt(v, 10) || 0; | |
836 }; | |
837 | |
838 var isNumber = function(value) { | |
839 return !isNaN(parseInt(value, 10)); | |
840 }; | |
841 | |
842 })(jQuery); |