|
1
|
|
|
/*! |
|
2
|
|
|
* jQuery UI Resizable 1.12.1 |
|
3
|
|
|
* http://jqueryui.com |
|
4
|
|
|
* |
|
5
|
|
|
* Copyright jQuery Foundation and other contributors |
|
6
|
|
|
* Released under the MIT license. |
|
7
|
|
|
* http://jquery.org/license |
|
8
|
|
|
*/ |
|
9
|
|
|
|
|
10
|
|
|
//>>label: Resizable |
|
11
|
|
|
//>>group: Interactions |
|
12
|
|
|
//>>description: Enables resize functionality for any element. |
|
13
|
|
|
//>>docs: http://api.jqueryui.com/resizable/ |
|
14
|
|
|
//>>demos: http://jqueryui.com/resizable/ |
|
15
|
|
|
//>>css.structure: ../../themes/base/core.css |
|
16
|
|
|
//>>css.structure: ../../themes/base/resizable.css |
|
17
|
|
|
//>>css.theme: ../../themes/base/theme.css |
|
18
|
|
|
|
|
19
|
|
|
( function( factory ) { |
|
20
|
|
|
if ( typeof define === "function" && define.amd ) { |
|
21
|
|
|
|
|
22
|
|
|
// AMD. Register as an anonymous module. |
|
23
|
|
|
define( [ |
|
24
|
|
|
"jquery", |
|
25
|
|
|
"./mouse", |
|
26
|
|
|
"../disable-selection", |
|
27
|
|
|
"../plugin", |
|
28
|
|
|
"../version", |
|
29
|
|
|
"../widget" |
|
30
|
|
|
], factory ); |
|
31
|
|
|
} else { |
|
32
|
|
|
|
|
33
|
|
|
// Browser globals |
|
34
|
|
|
factory( jQuery ); |
|
35
|
|
|
} |
|
36
|
|
|
}( function( $ ) { |
|
37
|
|
|
|
|
38
|
|
|
$.widget( "ui.resizable", $.ui.mouse, { |
|
39
|
|
|
version: "1.12.1", |
|
40
|
|
|
widgetEventPrefix: "resize", |
|
41
|
|
|
options: { |
|
42
|
|
|
alsoResize: false, |
|
43
|
|
|
animate: false, |
|
44
|
|
|
animateDuration: "slow", |
|
45
|
|
|
animateEasing: "swing", |
|
46
|
|
|
aspectRatio: false, |
|
47
|
|
|
autoHide: false, |
|
48
|
|
|
classes: { |
|
49
|
|
|
"ui-resizable-se": "ui-icon ui-icon-gripsmall-diagonal-se" |
|
50
|
|
|
}, |
|
51
|
|
|
containment: false, |
|
52
|
|
|
ghost: false, |
|
53
|
|
|
grid: false, |
|
54
|
|
|
handles: "e,s,se", |
|
55
|
|
|
helper: false, |
|
56
|
|
|
maxHeight: null, |
|
57
|
|
|
maxWidth: null, |
|
58
|
|
|
minHeight: 10, |
|
59
|
|
|
minWidth: 10, |
|
60
|
|
|
|
|
61
|
|
|
// See #7960 |
|
62
|
|
|
zIndex: 90, |
|
63
|
|
|
|
|
64
|
|
|
// Callbacks |
|
65
|
|
|
resize: null, |
|
66
|
|
|
start: null, |
|
67
|
|
|
stop: null |
|
68
|
|
|
}, |
|
69
|
|
|
|
|
70
|
|
|
_num: function( value ) { |
|
71
|
|
|
return parseFloat( value ) || 0; |
|
72
|
|
|
}, |
|
73
|
|
|
|
|
74
|
|
|
_isNumber: function( value ) { |
|
75
|
|
|
return !isNaN( parseFloat( value ) ); |
|
76
|
|
|
}, |
|
77
|
|
|
|
|
78
|
|
|
_hasScroll: function( el, a ) { |
|
79
|
|
|
|
|
80
|
|
|
if ( $( el ).css( "overflow" ) === "hidden" ) { |
|
81
|
|
|
return false; |
|
82
|
|
|
} |
|
83
|
|
|
|
|
84
|
|
|
var scroll = ( a && a === "left" ) ? "scrollLeft" : "scrollTop", |
|
85
|
|
|
has = false; |
|
|
|
|
|
|
86
|
|
|
|
|
87
|
|
|
if ( el[ scroll ] > 0 ) { |
|
88
|
|
|
return true; |
|
89
|
|
|
} |
|
90
|
|
|
|
|
91
|
|
|
// TODO: determine which cases actually cause this to happen |
|
92
|
|
|
// if the element doesn't have the scroll set, see if it's possible to |
|
93
|
|
|
// set the scroll |
|
94
|
|
|
el[ scroll ] = 1; |
|
95
|
|
|
has = ( el[ scroll ] > 0 ); |
|
96
|
|
|
el[ scroll ] = 0; |
|
97
|
|
|
return has; |
|
98
|
|
|
}, |
|
99
|
|
|
|
|
100
|
|
|
_create: function() { |
|
101
|
|
|
|
|
102
|
|
|
var margins, |
|
103
|
|
|
o = this.options, |
|
104
|
|
|
that = this; |
|
105
|
|
|
this._addClass( "ui-resizable" ); |
|
106
|
|
|
|
|
107
|
|
|
$.extend( this, { |
|
108
|
|
|
_aspectRatio: !!( o.aspectRatio ), |
|
109
|
|
|
aspectRatio: o.aspectRatio, |
|
110
|
|
|
originalElement: this.element, |
|
111
|
|
|
_proportionallyResizeElements: [], |
|
112
|
|
|
_helper: o.helper || o.ghost || o.animate ? o.helper || "ui-resizable-helper" : null |
|
113
|
|
|
} ); |
|
114
|
|
|
|
|
115
|
|
|
// Wrap the element if it cannot hold child nodes |
|
116
|
|
|
if ( this.element[ 0 ].nodeName.match( /^(canvas|textarea|input|select|button|img)$/i ) ) { |
|
117
|
|
|
|
|
118
|
|
|
this.element.wrap( |
|
119
|
|
|
$( "<div class='ui-wrapper' style='overflow: hidden;'></div>" ).css( { |
|
120
|
|
|
position: this.element.css( "position" ), |
|
121
|
|
|
width: this.element.outerWidth(), |
|
122
|
|
|
height: this.element.outerHeight(), |
|
123
|
|
|
top: this.element.css( "top" ), |
|
124
|
|
|
left: this.element.css( "left" ) |
|
125
|
|
|
} ) |
|
126
|
|
|
); |
|
127
|
|
|
|
|
128
|
|
|
this.element = this.element.parent().data( |
|
129
|
|
|
"ui-resizable", this.element.resizable( "instance" ) |
|
130
|
|
|
); |
|
131
|
|
|
|
|
132
|
|
|
this.elementIsWrapper = true; |
|
133
|
|
|
|
|
134
|
|
|
margins = { |
|
135
|
|
|
marginTop: this.originalElement.css( "marginTop" ), |
|
136
|
|
|
marginRight: this.originalElement.css( "marginRight" ), |
|
137
|
|
|
marginBottom: this.originalElement.css( "marginBottom" ), |
|
138
|
|
|
marginLeft: this.originalElement.css( "marginLeft" ) |
|
139
|
|
|
}; |
|
140
|
|
|
|
|
141
|
|
|
this.element.css( margins ); |
|
142
|
|
|
this.originalElement.css( "margin", 0 ); |
|
143
|
|
|
|
|
144
|
|
|
// support: Safari |
|
145
|
|
|
// Prevent Safari textarea resize |
|
146
|
|
|
this.originalResizeStyle = this.originalElement.css( "resize" ); |
|
147
|
|
|
this.originalElement.css( "resize", "none" ); |
|
148
|
|
|
|
|
149
|
|
|
this._proportionallyResizeElements.push( this.originalElement.css( { |
|
150
|
|
|
position: "static", |
|
151
|
|
|
zoom: 1, |
|
152
|
|
|
display: "block" |
|
153
|
|
|
} ) ); |
|
154
|
|
|
|
|
155
|
|
|
// Support: IE9 |
|
156
|
|
|
// avoid IE jump (hard set the margin) |
|
157
|
|
|
this.originalElement.css( margins ); |
|
158
|
|
|
|
|
159
|
|
|
this._proportionallyResize(); |
|
160
|
|
|
} |
|
161
|
|
|
|
|
162
|
|
|
this._setupHandles(); |
|
163
|
|
|
|
|
164
|
|
|
if ( o.autoHide ) { |
|
165
|
|
|
$( this.element ) |
|
166
|
|
|
.on( "mouseenter", function() { |
|
167
|
|
|
if ( o.disabled ) { |
|
168
|
|
|
return; |
|
169
|
|
|
} |
|
170
|
|
|
that._removeClass( "ui-resizable-autohide" ); |
|
171
|
|
|
that._handles.show(); |
|
172
|
|
|
} ) |
|
173
|
|
|
.on( "mouseleave", function() { |
|
174
|
|
|
if ( o.disabled ) { |
|
175
|
|
|
return; |
|
176
|
|
|
} |
|
177
|
|
|
if ( !that.resizing ) { |
|
178
|
|
|
that._addClass( "ui-resizable-autohide" ); |
|
179
|
|
|
that._handles.hide(); |
|
180
|
|
|
} |
|
181
|
|
|
} ); |
|
182
|
|
|
} |
|
183
|
|
|
|
|
184
|
|
|
this._mouseInit(); |
|
185
|
|
|
}, |
|
186
|
|
|
|
|
187
|
|
|
_destroy: function() { |
|
188
|
|
|
|
|
189
|
|
|
this._mouseDestroy(); |
|
190
|
|
|
|
|
191
|
|
|
var wrapper, |
|
192
|
|
|
_destroy = function( exp ) { |
|
193
|
|
|
$( exp ) |
|
194
|
|
|
.removeData( "resizable" ) |
|
195
|
|
|
.removeData( "ui-resizable" ) |
|
196
|
|
|
.off( ".resizable" ) |
|
197
|
|
|
.find( ".ui-resizable-handle" ) |
|
198
|
|
|
.remove(); |
|
199
|
|
|
}; |
|
200
|
|
|
|
|
201
|
|
|
// TODO: Unwrap at same DOM position |
|
202
|
|
|
if ( this.elementIsWrapper ) { |
|
203
|
|
|
_destroy( this.element ); |
|
204
|
|
|
wrapper = this.element; |
|
205
|
|
|
this.originalElement.css( { |
|
206
|
|
|
position: wrapper.css( "position" ), |
|
207
|
|
|
width: wrapper.outerWidth(), |
|
208
|
|
|
height: wrapper.outerHeight(), |
|
209
|
|
|
top: wrapper.css( "top" ), |
|
210
|
|
|
left: wrapper.css( "left" ) |
|
211
|
|
|
} ).insertAfter( wrapper ); |
|
212
|
|
|
wrapper.remove(); |
|
213
|
|
|
} |
|
214
|
|
|
|
|
215
|
|
|
this.originalElement.css( "resize", this.originalResizeStyle ); |
|
216
|
|
|
_destroy( this.originalElement ); |
|
217
|
|
|
|
|
218
|
|
|
return this; |
|
219
|
|
|
}, |
|
220
|
|
|
|
|
221
|
|
|
_setOption: function( key, value ) { |
|
222
|
|
|
this._super( key, value ); |
|
223
|
|
|
|
|
224
|
|
|
switch ( key ) { |
|
225
|
|
|
case "handles": |
|
226
|
|
|
this._removeHandles(); |
|
227
|
|
|
this._setupHandles(); |
|
228
|
|
|
break; |
|
229
|
|
|
default: |
|
230
|
|
|
break; |
|
231
|
|
|
} |
|
232
|
|
|
}, |
|
233
|
|
|
|
|
234
|
|
|
_setupHandles: function() { |
|
235
|
|
|
var o = this.options, handle, i, n, hname, axis, that = this; |
|
236
|
|
|
this.handles = o.handles || |
|
237
|
|
|
( !$( ".ui-resizable-handle", this.element ).length ? |
|
238
|
|
|
"e,s,se" : { |
|
239
|
|
|
n: ".ui-resizable-n", |
|
240
|
|
|
e: ".ui-resizable-e", |
|
241
|
|
|
s: ".ui-resizable-s", |
|
242
|
|
|
w: ".ui-resizable-w", |
|
243
|
|
|
se: ".ui-resizable-se", |
|
244
|
|
|
sw: ".ui-resizable-sw", |
|
245
|
|
|
ne: ".ui-resizable-ne", |
|
246
|
|
|
nw: ".ui-resizable-nw" |
|
247
|
|
|
} ); |
|
248
|
|
|
|
|
249
|
|
|
this._handles = $(); |
|
250
|
|
|
if ( this.handles.constructor === String ) { |
|
251
|
|
|
|
|
252
|
|
|
if ( this.handles === "all" ) { |
|
253
|
|
|
this.handles = "n,e,s,w,se,sw,ne,nw"; |
|
254
|
|
|
} |
|
255
|
|
|
|
|
256
|
|
|
n = this.handles.split( "," ); |
|
257
|
|
|
this.handles = {}; |
|
258
|
|
|
|
|
259
|
|
|
for ( i = 0; i < n.length; i++ ) { |
|
260
|
|
|
|
|
261
|
|
|
handle = $.trim( n[ i ] ); |
|
262
|
|
|
hname = "ui-resizable-" + handle; |
|
263
|
|
|
axis = $( "<div>" ); |
|
264
|
|
|
this._addClass( axis, "ui-resizable-handle " + hname ); |
|
265
|
|
|
|
|
266
|
|
|
axis.css( { zIndex: o.zIndex } ); |
|
267
|
|
|
|
|
268
|
|
|
this.handles[ handle ] = ".ui-resizable-" + handle; |
|
269
|
|
|
this.element.append( axis ); |
|
270
|
|
|
} |
|
271
|
|
|
|
|
272
|
|
|
} |
|
273
|
|
|
|
|
274
|
|
|
this._renderAxis = function( target ) { |
|
275
|
|
|
|
|
276
|
|
|
var i, axis, padPos, padWrapper; |
|
277
|
|
|
|
|
278
|
|
|
target = target || this.element; |
|
279
|
|
|
|
|
280
|
|
|
for ( i in this.handles ) { |
|
281
|
|
|
|
|
282
|
|
|
if ( this.handles[ i ].constructor === String ) { |
|
283
|
|
|
this.handles[ i ] = this.element.children( this.handles[ i ] ).first().show(); |
|
284
|
|
|
} else if ( this.handles[ i ].jquery || this.handles[ i ].nodeType ) { |
|
285
|
|
|
this.handles[ i ] = $( this.handles[ i ] ); |
|
286
|
|
|
this._on( this.handles[ i ], { "mousedown": that._mouseDown } ); |
|
287
|
|
|
} |
|
288
|
|
|
|
|
289
|
|
|
if ( this.elementIsWrapper && |
|
290
|
|
|
this.originalElement[ 0 ] |
|
291
|
|
|
.nodeName |
|
292
|
|
|
.match( /^(textarea|input|select|button)$/i ) ) { |
|
293
|
|
|
axis = $( this.handles[ i ], this.element ); |
|
294
|
|
|
|
|
295
|
|
|
padWrapper = /sw|ne|nw|se|n|s/.test( i ) ? |
|
296
|
|
|
axis.outerHeight() : |
|
297
|
|
|
axis.outerWidth(); |
|
298
|
|
|
|
|
299
|
|
|
padPos = [ "padding", |
|
300
|
|
|
/ne|nw|n/.test( i ) ? "Top" : |
|
301
|
|
|
/se|sw|s/.test( i ) ? "Bottom" : |
|
302
|
|
|
/^e$/.test( i ) ? "Right" : "Left" ].join( "" ); |
|
303
|
|
|
|
|
304
|
|
|
target.css( padPos, padWrapper ); |
|
305
|
|
|
|
|
306
|
|
|
this._proportionallyResize(); |
|
307
|
|
|
} |
|
308
|
|
|
|
|
309
|
|
|
this._handles = this._handles.add( this.handles[ i ] ); |
|
310
|
|
|
} |
|
311
|
|
|
}; |
|
312
|
|
|
|
|
313
|
|
|
// TODO: make renderAxis a prototype function |
|
314
|
|
|
this._renderAxis( this.element ); |
|
315
|
|
|
|
|
316
|
|
|
this._handles = this._handles.add( this.element.find( ".ui-resizable-handle" ) ); |
|
317
|
|
|
this._handles.disableSelection(); |
|
318
|
|
|
|
|
319
|
|
|
this._handles.on( "mouseover", function() { |
|
320
|
|
|
if ( !that.resizing ) { |
|
321
|
|
|
if ( this.className ) { |
|
322
|
|
|
axis = this.className.match( /ui-resizable-(se|sw|ne|nw|n|e|s|w)/i ); |
|
323
|
|
|
} |
|
324
|
|
|
that.axis = axis && axis[ 1 ] ? axis[ 1 ] : "se"; |
|
|
|
|
|
|
325
|
|
|
} |
|
326
|
|
|
} ); |
|
327
|
|
|
|
|
328
|
|
|
if ( o.autoHide ) { |
|
329
|
|
|
this._handles.hide(); |
|
330
|
|
|
this._addClass( "ui-resizable-autohide" ); |
|
331
|
|
|
} |
|
332
|
|
|
}, |
|
333
|
|
|
|
|
334
|
|
|
_removeHandles: function() { |
|
335
|
|
|
this._handles.remove(); |
|
336
|
|
|
}, |
|
337
|
|
|
|
|
338
|
|
|
_mouseCapture: function( event ) { |
|
339
|
|
|
var i, handle, |
|
340
|
|
|
capture = false; |
|
341
|
|
|
|
|
342
|
|
|
for ( i in this.handles ) { |
|
343
|
|
|
handle = $( this.handles[ i ] )[ 0 ]; |
|
344
|
|
|
if ( handle === event.target || $.contains( handle, event.target ) ) { |
|
345
|
|
|
capture = true; |
|
346
|
|
|
} |
|
347
|
|
|
} |
|
348
|
|
|
|
|
349
|
|
|
return !this.options.disabled && capture; |
|
350
|
|
|
}, |
|
351
|
|
|
|
|
352
|
|
|
_mouseStart: function( event ) { |
|
353
|
|
|
|
|
354
|
|
|
var curleft, curtop, cursor, |
|
355
|
|
|
o = this.options, |
|
356
|
|
|
el = this.element; |
|
357
|
|
|
|
|
358
|
|
|
this.resizing = true; |
|
359
|
|
|
|
|
360
|
|
|
this._renderProxy(); |
|
361
|
|
|
|
|
362
|
|
|
curleft = this._num( this.helper.css( "left" ) ); |
|
363
|
|
|
curtop = this._num( this.helper.css( "top" ) ); |
|
364
|
|
|
|
|
365
|
|
|
if ( o.containment ) { |
|
366
|
|
|
curleft += $( o.containment ).scrollLeft() || 0; |
|
367
|
|
|
curtop += $( o.containment ).scrollTop() || 0; |
|
368
|
|
|
} |
|
369
|
|
|
|
|
370
|
|
|
this.offset = this.helper.offset(); |
|
371
|
|
|
this.position = { left: curleft, top: curtop }; |
|
372
|
|
|
|
|
373
|
|
|
this.size = this._helper ? { |
|
374
|
|
|
width: this.helper.width(), |
|
375
|
|
|
height: this.helper.height() |
|
376
|
|
|
} : { |
|
377
|
|
|
width: el.width(), |
|
378
|
|
|
height: el.height() |
|
379
|
|
|
}; |
|
380
|
|
|
|
|
381
|
|
|
this.originalSize = this._helper ? { |
|
382
|
|
|
width: el.outerWidth(), |
|
383
|
|
|
height: el.outerHeight() |
|
384
|
|
|
} : { |
|
385
|
|
|
width: el.width(), |
|
386
|
|
|
height: el.height() |
|
387
|
|
|
}; |
|
388
|
|
|
|
|
389
|
|
|
this.sizeDiff = { |
|
390
|
|
|
width: el.outerWidth() - el.width(), |
|
391
|
|
|
height: el.outerHeight() - el.height() |
|
392
|
|
|
}; |
|
393
|
|
|
|
|
394
|
|
|
this.originalPosition = { left: curleft, top: curtop }; |
|
395
|
|
|
this.originalMousePosition = { left: event.pageX, top: event.pageY }; |
|
396
|
|
|
|
|
397
|
|
|
this.aspectRatio = ( typeof o.aspectRatio === "number" ) ? |
|
398
|
|
|
o.aspectRatio : |
|
399
|
|
|
( ( this.originalSize.width / this.originalSize.height ) || 1 ); |
|
400
|
|
|
|
|
401
|
|
|
cursor = $( ".ui-resizable-" + this.axis ).css( "cursor" ); |
|
402
|
|
|
$( "body" ).css( "cursor", cursor === "auto" ? this.axis + "-resize" : cursor ); |
|
403
|
|
|
|
|
404
|
|
|
this._addClass( "ui-resizable-resizing" ); |
|
405
|
|
|
this._propagate( "start", event ); |
|
406
|
|
|
return true; |
|
407
|
|
|
}, |
|
408
|
|
|
|
|
409
|
|
|
_mouseDrag: function( event ) { |
|
410
|
|
|
|
|
411
|
|
|
var data, props, |
|
412
|
|
|
smp = this.originalMousePosition, |
|
413
|
|
|
a = this.axis, |
|
414
|
|
|
dx = ( event.pageX - smp.left ) || 0, |
|
415
|
|
|
dy = ( event.pageY - smp.top ) || 0, |
|
416
|
|
|
trigger = this._change[ a ]; |
|
417
|
|
|
|
|
418
|
|
|
this._updatePrevProperties(); |
|
419
|
|
|
|
|
420
|
|
|
if ( !trigger ) { |
|
421
|
|
|
return false; |
|
422
|
|
|
} |
|
423
|
|
|
|
|
424
|
|
|
data = trigger.apply( this, [ event, dx, dy ] ); |
|
425
|
|
|
|
|
426
|
|
|
this._updateVirtualBoundaries( event.shiftKey ); |
|
427
|
|
|
if ( this._aspectRatio || event.shiftKey ) { |
|
428
|
|
|
data = this._updateRatio( data, event ); |
|
429
|
|
|
} |
|
430
|
|
|
|
|
431
|
|
|
data = this._respectSize( data, event ); |
|
432
|
|
|
|
|
433
|
|
|
this._updateCache( data ); |
|
434
|
|
|
|
|
435
|
|
|
this._propagate( "resize", event ); |
|
436
|
|
|
|
|
437
|
|
|
props = this._applyChanges(); |
|
438
|
|
|
|
|
439
|
|
|
if ( !this._helper && this._proportionallyResizeElements.length ) { |
|
440
|
|
|
this._proportionallyResize(); |
|
441
|
|
|
} |
|
442
|
|
|
|
|
443
|
|
|
if ( !$.isEmptyObject( props ) ) { |
|
444
|
|
|
this._updatePrevProperties(); |
|
445
|
|
|
this._trigger( "resize", event, this.ui() ); |
|
446
|
|
|
this._applyChanges(); |
|
447
|
|
|
} |
|
448
|
|
|
|
|
449
|
|
|
return false; |
|
450
|
|
|
}, |
|
451
|
|
|
|
|
452
|
|
|
_mouseStop: function( event ) { |
|
453
|
|
|
|
|
454
|
|
|
this.resizing = false; |
|
455
|
|
|
var pr, ista, soffseth, soffsetw, s, left, top, |
|
456
|
|
|
o = this.options, that = this; |
|
457
|
|
|
|
|
458
|
|
|
if ( this._helper ) { |
|
459
|
|
|
|
|
460
|
|
|
pr = this._proportionallyResizeElements; |
|
461
|
|
|
ista = pr.length && ( /textarea/i ).test( pr[ 0 ].nodeName ); |
|
462
|
|
|
soffseth = ista && this._hasScroll( pr[ 0 ], "left" ) ? 0 : that.sizeDiff.height; |
|
463
|
|
|
soffsetw = ista ? 0 : that.sizeDiff.width; |
|
464
|
|
|
|
|
465
|
|
|
s = { |
|
466
|
|
|
width: ( that.helper.width() - soffsetw ), |
|
467
|
|
|
height: ( that.helper.height() - soffseth ) |
|
468
|
|
|
}; |
|
469
|
|
|
left = ( parseFloat( that.element.css( "left" ) ) + |
|
470
|
|
|
( that.position.left - that.originalPosition.left ) ) || null; |
|
471
|
|
|
top = ( parseFloat( that.element.css( "top" ) ) + |
|
472
|
|
|
( that.position.top - that.originalPosition.top ) ) || null; |
|
473
|
|
|
|
|
474
|
|
|
if ( !o.animate ) { |
|
475
|
|
|
this.element.css( $.extend( s, { top: top, left: left } ) ); |
|
476
|
|
|
} |
|
477
|
|
|
|
|
478
|
|
|
that.helper.height( that.size.height ); |
|
479
|
|
|
that.helper.width( that.size.width ); |
|
480
|
|
|
|
|
481
|
|
|
if ( this._helper && !o.animate ) { |
|
482
|
|
|
this._proportionallyResize(); |
|
483
|
|
|
} |
|
484
|
|
|
} |
|
485
|
|
|
|
|
486
|
|
|
$( "body" ).css( "cursor", "auto" ); |
|
487
|
|
|
|
|
488
|
|
|
this._removeClass( "ui-resizable-resizing" ); |
|
489
|
|
|
|
|
490
|
|
|
this._propagate( "stop", event ); |
|
491
|
|
|
|
|
492
|
|
|
if ( this._helper ) { |
|
493
|
|
|
this.helper.remove(); |
|
494
|
|
|
} |
|
495
|
|
|
|
|
496
|
|
|
return false; |
|
497
|
|
|
|
|
498
|
|
|
}, |
|
499
|
|
|
|
|
500
|
|
|
_updatePrevProperties: function() { |
|
501
|
|
|
this.prevPosition = { |
|
502
|
|
|
top: this.position.top, |
|
503
|
|
|
left: this.position.left |
|
504
|
|
|
}; |
|
505
|
|
|
this.prevSize = { |
|
506
|
|
|
width: this.size.width, |
|
507
|
|
|
height: this.size.height |
|
508
|
|
|
}; |
|
509
|
|
|
}, |
|
510
|
|
|
|
|
511
|
|
|
_applyChanges: function() { |
|
512
|
|
|
var props = {}; |
|
513
|
|
|
|
|
514
|
|
|
if ( this.position.top !== this.prevPosition.top ) { |
|
515
|
|
|
props.top = this.position.top + "px"; |
|
516
|
|
|
} |
|
517
|
|
|
if ( this.position.left !== this.prevPosition.left ) { |
|
518
|
|
|
props.left = this.position.left + "px"; |
|
519
|
|
|
} |
|
520
|
|
|
if ( this.size.width !== this.prevSize.width ) { |
|
521
|
|
|
props.width = this.size.width + "px"; |
|
522
|
|
|
} |
|
523
|
|
|
if ( this.size.height !== this.prevSize.height ) { |
|
524
|
|
|
props.height = this.size.height + "px"; |
|
525
|
|
|
} |
|
526
|
|
|
|
|
527
|
|
|
this.helper.css( props ); |
|
528
|
|
|
|
|
529
|
|
|
return props; |
|
530
|
|
|
}, |
|
531
|
|
|
|
|
532
|
|
|
_updateVirtualBoundaries: function( forceAspectRatio ) { |
|
533
|
|
|
var pMinWidth, pMaxWidth, pMinHeight, pMaxHeight, b, |
|
534
|
|
|
o = this.options; |
|
535
|
|
|
|
|
536
|
|
|
b = { |
|
537
|
|
|
minWidth: this._isNumber( o.minWidth ) ? o.minWidth : 0, |
|
538
|
|
|
maxWidth: this._isNumber( o.maxWidth ) ? o.maxWidth : Infinity, |
|
539
|
|
|
minHeight: this._isNumber( o.minHeight ) ? o.minHeight : 0, |
|
540
|
|
|
maxHeight: this._isNumber( o.maxHeight ) ? o.maxHeight : Infinity |
|
541
|
|
|
}; |
|
542
|
|
|
|
|
543
|
|
|
if ( this._aspectRatio || forceAspectRatio ) { |
|
544
|
|
|
pMinWidth = b.minHeight * this.aspectRatio; |
|
545
|
|
|
pMinHeight = b.minWidth / this.aspectRatio; |
|
546
|
|
|
pMaxWidth = b.maxHeight * this.aspectRatio; |
|
547
|
|
|
pMaxHeight = b.maxWidth / this.aspectRatio; |
|
548
|
|
|
|
|
549
|
|
|
if ( pMinWidth > b.minWidth ) { |
|
550
|
|
|
b.minWidth = pMinWidth; |
|
551
|
|
|
} |
|
552
|
|
|
if ( pMinHeight > b.minHeight ) { |
|
553
|
|
|
b.minHeight = pMinHeight; |
|
554
|
|
|
} |
|
555
|
|
|
if ( pMaxWidth < b.maxWidth ) { |
|
556
|
|
|
b.maxWidth = pMaxWidth; |
|
557
|
|
|
} |
|
558
|
|
|
if ( pMaxHeight < b.maxHeight ) { |
|
559
|
|
|
b.maxHeight = pMaxHeight; |
|
560
|
|
|
} |
|
561
|
|
|
} |
|
562
|
|
|
this._vBoundaries = b; |
|
563
|
|
|
}, |
|
564
|
|
|
|
|
565
|
|
|
_updateCache: function( data ) { |
|
566
|
|
|
this.offset = this.helper.offset(); |
|
567
|
|
|
if ( this._isNumber( data.left ) ) { |
|
568
|
|
|
this.position.left = data.left; |
|
569
|
|
|
} |
|
570
|
|
|
if ( this._isNumber( data.top ) ) { |
|
571
|
|
|
this.position.top = data.top; |
|
572
|
|
|
} |
|
573
|
|
|
if ( this._isNumber( data.height ) ) { |
|
574
|
|
|
this.size.height = data.height; |
|
575
|
|
|
} |
|
576
|
|
|
if ( this._isNumber( data.width ) ) { |
|
577
|
|
|
this.size.width = data.width; |
|
578
|
|
|
} |
|
579
|
|
|
}, |
|
580
|
|
|
|
|
581
|
|
|
_updateRatio: function( data ) { |
|
582
|
|
|
|
|
583
|
|
|
var cpos = this.position, |
|
584
|
|
|
csize = this.size, |
|
585
|
|
|
a = this.axis; |
|
586
|
|
|
|
|
587
|
|
|
if ( this._isNumber( data.height ) ) { |
|
588
|
|
|
data.width = ( data.height * this.aspectRatio ); |
|
589
|
|
|
} else if ( this._isNumber( data.width ) ) { |
|
590
|
|
|
data.height = ( data.width / this.aspectRatio ); |
|
591
|
|
|
} |
|
592
|
|
|
|
|
593
|
|
|
if ( a === "sw" ) { |
|
594
|
|
|
data.left = cpos.left + ( csize.width - data.width ); |
|
595
|
|
|
data.top = null; |
|
596
|
|
|
} |
|
597
|
|
|
if ( a === "nw" ) { |
|
598
|
|
|
data.top = cpos.top + ( csize.height - data.height ); |
|
599
|
|
|
data.left = cpos.left + ( csize.width - data.width ); |
|
600
|
|
|
} |
|
601
|
|
|
|
|
602
|
|
|
return data; |
|
603
|
|
|
}, |
|
604
|
|
|
|
|
605
|
|
|
_respectSize: function( data ) { |
|
606
|
|
|
|
|
607
|
|
|
var o = this._vBoundaries, |
|
608
|
|
|
a = this.axis, |
|
609
|
|
|
ismaxw = this._isNumber( data.width ) && o.maxWidth && ( o.maxWidth < data.width ), |
|
610
|
|
|
ismaxh = this._isNumber( data.height ) && o.maxHeight && ( o.maxHeight < data.height ), |
|
611
|
|
|
isminw = this._isNumber( data.width ) && o.minWidth && ( o.minWidth > data.width ), |
|
612
|
|
|
isminh = this._isNumber( data.height ) && o.minHeight && ( o.minHeight > data.height ), |
|
613
|
|
|
dw = this.originalPosition.left + this.originalSize.width, |
|
614
|
|
|
dh = this.originalPosition.top + this.originalSize.height, |
|
615
|
|
|
cw = /sw|nw|w/.test( a ), ch = /nw|ne|n/.test( a ); |
|
616
|
|
|
if ( isminw ) { |
|
617
|
|
|
data.width = o.minWidth; |
|
618
|
|
|
} |
|
619
|
|
|
if ( isminh ) { |
|
620
|
|
|
data.height = o.minHeight; |
|
621
|
|
|
} |
|
622
|
|
|
if ( ismaxw ) { |
|
623
|
|
|
data.width = o.maxWidth; |
|
624
|
|
|
} |
|
625
|
|
|
if ( ismaxh ) { |
|
626
|
|
|
data.height = o.maxHeight; |
|
627
|
|
|
} |
|
628
|
|
|
|
|
629
|
|
|
if ( isminw && cw ) { |
|
630
|
|
|
data.left = dw - o.minWidth; |
|
631
|
|
|
} |
|
632
|
|
|
if ( ismaxw && cw ) { |
|
633
|
|
|
data.left = dw - o.maxWidth; |
|
634
|
|
|
} |
|
635
|
|
|
if ( isminh && ch ) { |
|
636
|
|
|
data.top = dh - o.minHeight; |
|
637
|
|
|
} |
|
638
|
|
|
if ( ismaxh && ch ) { |
|
639
|
|
|
data.top = dh - o.maxHeight; |
|
640
|
|
|
} |
|
641
|
|
|
|
|
642
|
|
|
// Fixing jump error on top/left - bug #2330 |
|
643
|
|
|
if ( !data.width && !data.height && !data.left && data.top ) { |
|
644
|
|
|
data.top = null; |
|
645
|
|
|
} else if ( !data.width && !data.height && !data.top && data.left ) { |
|
646
|
|
|
data.left = null; |
|
647
|
|
|
} |
|
648
|
|
|
|
|
649
|
|
|
return data; |
|
650
|
|
|
}, |
|
651
|
|
|
|
|
652
|
|
|
_getPaddingPlusBorderDimensions: function( element ) { |
|
653
|
|
|
var i = 0, |
|
654
|
|
|
widths = [], |
|
655
|
|
|
borders = [ |
|
656
|
|
|
element.css( "borderTopWidth" ), |
|
657
|
|
|
element.css( "borderRightWidth" ), |
|
658
|
|
|
element.css( "borderBottomWidth" ), |
|
659
|
|
|
element.css( "borderLeftWidth" ) |
|
660
|
|
|
], |
|
661
|
|
|
paddings = [ |
|
662
|
|
|
element.css( "paddingTop" ), |
|
663
|
|
|
element.css( "paddingRight" ), |
|
664
|
|
|
element.css( "paddingBottom" ), |
|
665
|
|
|
element.css( "paddingLeft" ) |
|
666
|
|
|
]; |
|
667
|
|
|
|
|
668
|
|
|
for ( ; i < 4; i++ ) { |
|
669
|
|
|
widths[ i ] = ( parseFloat( borders[ i ] ) || 0 ); |
|
670
|
|
|
widths[ i ] += ( parseFloat( paddings[ i ] ) || 0 ); |
|
671
|
|
|
} |
|
672
|
|
|
|
|
673
|
|
|
return { |
|
674
|
|
|
height: widths[ 0 ] + widths[ 2 ], |
|
675
|
|
|
width: widths[ 1 ] + widths[ 3 ] |
|
676
|
|
|
}; |
|
677
|
|
|
}, |
|
678
|
|
|
|
|
679
|
|
|
_proportionallyResize: function() { |
|
680
|
|
|
|
|
681
|
|
|
if ( !this._proportionallyResizeElements.length ) { |
|
682
|
|
|
return; |
|
683
|
|
|
} |
|
684
|
|
|
|
|
685
|
|
|
var prel, |
|
686
|
|
|
i = 0, |
|
687
|
|
|
element = this.helper || this.element; |
|
688
|
|
|
|
|
689
|
|
|
for ( ; i < this._proportionallyResizeElements.length; i++ ) { |
|
690
|
|
|
|
|
691
|
|
|
prel = this._proportionallyResizeElements[ i ]; |
|
692
|
|
|
|
|
693
|
|
|
// TODO: Seems like a bug to cache this.outerDimensions |
|
694
|
|
|
// considering that we are in a loop. |
|
695
|
|
|
if ( !this.outerDimensions ) { |
|
696
|
|
|
this.outerDimensions = this._getPaddingPlusBorderDimensions( prel ); |
|
697
|
|
|
} |
|
698
|
|
|
|
|
699
|
|
|
prel.css( { |
|
700
|
|
|
height: ( element.height() - this.outerDimensions.height ) || 0, |
|
701
|
|
|
width: ( element.width() - this.outerDimensions.width ) || 0 |
|
702
|
|
|
} ); |
|
703
|
|
|
|
|
704
|
|
|
} |
|
705
|
|
|
|
|
706
|
|
|
}, |
|
707
|
|
|
|
|
708
|
|
|
_renderProxy: function() { |
|
709
|
|
|
|
|
710
|
|
|
var el = this.element, o = this.options; |
|
711
|
|
|
this.elementOffset = el.offset(); |
|
712
|
|
|
|
|
713
|
|
|
if ( this._helper ) { |
|
714
|
|
|
|
|
715
|
|
|
this.helper = this.helper || $( "<div style='overflow:hidden;'></div>" ); |
|
716
|
|
|
|
|
717
|
|
|
this._addClass( this.helper, this._helper ); |
|
718
|
|
|
this.helper.css( { |
|
719
|
|
|
width: this.element.outerWidth(), |
|
720
|
|
|
height: this.element.outerHeight(), |
|
721
|
|
|
position: "absolute", |
|
722
|
|
|
left: this.elementOffset.left + "px", |
|
723
|
|
|
top: this.elementOffset.top + "px", |
|
724
|
|
|
zIndex: ++o.zIndex //TODO: Don't modify option |
|
725
|
|
|
} ); |
|
726
|
|
|
|
|
727
|
|
|
this.helper |
|
728
|
|
|
.appendTo( "body" ) |
|
729
|
|
|
.disableSelection(); |
|
730
|
|
|
|
|
731
|
|
|
} else { |
|
732
|
|
|
this.helper = this.element; |
|
733
|
|
|
} |
|
734
|
|
|
|
|
735
|
|
|
}, |
|
736
|
|
|
|
|
737
|
|
|
_change: { |
|
738
|
|
|
e: function( event, dx ) { |
|
739
|
|
|
return { width: this.originalSize.width + dx }; |
|
740
|
|
|
}, |
|
741
|
|
|
w: function( event, dx ) { |
|
742
|
|
|
var cs = this.originalSize, sp = this.originalPosition; |
|
743
|
|
|
return { left: sp.left + dx, width: cs.width - dx }; |
|
744
|
|
|
}, |
|
745
|
|
|
n: function( event, dx, dy ) { |
|
746
|
|
|
var cs = this.originalSize, sp = this.originalPosition; |
|
747
|
|
|
return { top: sp.top + dy, height: cs.height - dy }; |
|
748
|
|
|
}, |
|
749
|
|
|
s: function( event, dx, dy ) { |
|
750
|
|
|
return { height: this.originalSize.height + dy }; |
|
751
|
|
|
}, |
|
752
|
|
|
se: function( event, dx, dy ) { |
|
753
|
|
|
return $.extend( this._change.s.apply( this, arguments ), |
|
754
|
|
|
this._change.e.apply( this, [ event, dx, dy ] ) ); |
|
755
|
|
|
}, |
|
756
|
|
|
sw: function( event, dx, dy ) { |
|
757
|
|
|
return $.extend( this._change.s.apply( this, arguments ), |
|
758
|
|
|
this._change.w.apply( this, [ event, dx, dy ] ) ); |
|
759
|
|
|
}, |
|
760
|
|
|
ne: function( event, dx, dy ) { |
|
761
|
|
|
return $.extend( this._change.n.apply( this, arguments ), |
|
762
|
|
|
this._change.e.apply( this, [ event, dx, dy ] ) ); |
|
763
|
|
|
}, |
|
764
|
|
|
nw: function( event, dx, dy ) { |
|
765
|
|
|
return $.extend( this._change.n.apply( this, arguments ), |
|
766
|
|
|
this._change.w.apply( this, [ event, dx, dy ] ) ); |
|
767
|
|
|
} |
|
768
|
|
|
}, |
|
769
|
|
|
|
|
770
|
|
|
_propagate: function( n, event ) { |
|
771
|
|
|
$.ui.plugin.call( this, n, [ event, this.ui() ] ); |
|
772
|
|
|
( n !== "resize" && this._trigger( n, event, this.ui() ) ); |
|
773
|
|
|
}, |
|
774
|
|
|
|
|
775
|
|
|
plugins: {}, |
|
776
|
|
|
|
|
777
|
|
|
ui: function() { |
|
778
|
|
|
return { |
|
779
|
|
|
originalElement: this.originalElement, |
|
780
|
|
|
element: this.element, |
|
781
|
|
|
helper: this.helper, |
|
782
|
|
|
position: this.position, |
|
783
|
|
|
size: this.size, |
|
784
|
|
|
originalSize: this.originalSize, |
|
785
|
|
|
originalPosition: this.originalPosition |
|
786
|
|
|
}; |
|
787
|
|
|
} |
|
788
|
|
|
|
|
789
|
|
|
} ); |
|
790
|
|
|
|
|
791
|
|
|
/* |
|
792
|
|
|
* Resizable Extensions |
|
793
|
|
|
*/ |
|
794
|
|
|
|
|
795
|
|
|
$.ui.plugin.add( "resizable", "animate", { |
|
796
|
|
|
|
|
797
|
|
View Code Duplication |
stop: function( event ) { |
|
798
|
|
|
var that = $( this ).resizable( "instance" ), |
|
799
|
|
|
o = that.options, |
|
800
|
|
|
pr = that._proportionallyResizeElements, |
|
801
|
|
|
ista = pr.length && ( /textarea/i ).test( pr[ 0 ].nodeName ), |
|
802
|
|
|
soffseth = ista && that._hasScroll( pr[ 0 ], "left" ) ? 0 : that.sizeDiff.height, |
|
803
|
|
|
soffsetw = ista ? 0 : that.sizeDiff.width, |
|
804
|
|
|
style = { |
|
805
|
|
|
width: ( that.size.width - soffsetw ), |
|
806
|
|
|
height: ( that.size.height - soffseth ) |
|
807
|
|
|
}, |
|
808
|
|
|
left = ( parseFloat( that.element.css( "left" ) ) + |
|
809
|
|
|
( that.position.left - that.originalPosition.left ) ) || null, |
|
810
|
|
|
top = ( parseFloat( that.element.css( "top" ) ) + |
|
811
|
|
|
( that.position.top - that.originalPosition.top ) ) || null; |
|
812
|
|
|
|
|
813
|
|
|
that.element.animate( |
|
814
|
|
|
$.extend( style, top && left ? { top: top, left: left } : {} ), { |
|
815
|
|
|
duration: o.animateDuration, |
|
816
|
|
|
easing: o.animateEasing, |
|
817
|
|
|
step: function() { |
|
818
|
|
|
|
|
819
|
|
|
var data = { |
|
820
|
|
|
width: parseFloat( that.element.css( "width" ) ), |
|
821
|
|
|
height: parseFloat( that.element.css( "height" ) ), |
|
822
|
|
|
top: parseFloat( that.element.css( "top" ) ), |
|
823
|
|
|
left: parseFloat( that.element.css( "left" ) ) |
|
824
|
|
|
}; |
|
825
|
|
|
|
|
826
|
|
|
if ( pr && pr.length ) { |
|
827
|
|
|
$( pr[ 0 ] ).css( { width: data.width, height: data.height } ); |
|
828
|
|
|
} |
|
829
|
|
|
|
|
830
|
|
|
// Propagating resize, and updating values for each animation step |
|
831
|
|
|
that._updateCache( data ); |
|
832
|
|
|
that._propagate( "resize", event ); |
|
833
|
|
|
|
|
834
|
|
|
} |
|
835
|
|
|
} |
|
836
|
|
|
); |
|
837
|
|
|
} |
|
838
|
|
|
|
|
839
|
|
|
} ); |
|
840
|
|
|
|
|
841
|
|
|
$.ui.plugin.add( "resizable", "containment", { |
|
842
|
|
|
|
|
843
|
|
|
start: function() { |
|
844
|
|
|
var element, p, co, ch, cw, width, height, |
|
845
|
|
|
that = $( this ).resizable( "instance" ), |
|
846
|
|
|
o = that.options, |
|
847
|
|
|
el = that.element, |
|
848
|
|
|
oc = o.containment, |
|
849
|
|
|
ce = ( oc instanceof $ ) ? |
|
850
|
|
|
oc.get( 0 ) : |
|
851
|
|
|
( /parent/.test( oc ) ) ? el.parent().get( 0 ) : oc; |
|
852
|
|
|
|
|
853
|
|
|
if ( !ce ) { |
|
854
|
|
|
return; |
|
855
|
|
|
} |
|
856
|
|
|
|
|
857
|
|
|
that.containerElement = $( ce ); |
|
858
|
|
|
|
|
859
|
|
|
if ( /document/.test( oc ) || oc === document ) { |
|
860
|
|
|
that.containerOffset = { |
|
861
|
|
|
left: 0, |
|
862
|
|
|
top: 0 |
|
863
|
|
|
}; |
|
864
|
|
|
that.containerPosition = { |
|
865
|
|
|
left: 0, |
|
866
|
|
|
top: 0 |
|
867
|
|
|
}; |
|
868
|
|
|
|
|
869
|
|
|
that.parentData = { |
|
870
|
|
|
element: $( document ), |
|
871
|
|
|
left: 0, |
|
872
|
|
|
top: 0, |
|
873
|
|
|
width: $( document ).width(), |
|
874
|
|
|
height: $( document ).height() || document.body.parentNode.scrollHeight |
|
875
|
|
|
}; |
|
876
|
|
|
} else { |
|
877
|
|
|
element = $( ce ); |
|
878
|
|
|
p = []; |
|
879
|
|
|
$( [ "Top", "Right", "Left", "Bottom" ] ).each( function( i, name ) { |
|
880
|
|
|
p[ i ] = that._num( element.css( "padding" + name ) ); |
|
881
|
|
|
} ); |
|
882
|
|
|
|
|
883
|
|
|
that.containerOffset = element.offset(); |
|
884
|
|
|
that.containerPosition = element.position(); |
|
885
|
|
|
that.containerSize = { |
|
886
|
|
|
height: ( element.innerHeight() - p[ 3 ] ), |
|
887
|
|
|
width: ( element.innerWidth() - p[ 1 ] ) |
|
888
|
|
|
}; |
|
889
|
|
|
|
|
890
|
|
|
co = that.containerOffset; |
|
891
|
|
|
ch = that.containerSize.height; |
|
892
|
|
|
cw = that.containerSize.width; |
|
893
|
|
|
width = ( that._hasScroll ( ce, "left" ) ? ce.scrollWidth : cw ); |
|
894
|
|
|
height = ( that._hasScroll ( ce ) ? ce.scrollHeight : ch ) ; |
|
895
|
|
|
|
|
896
|
|
|
that.parentData = { |
|
897
|
|
|
element: ce, |
|
898
|
|
|
left: co.left, |
|
899
|
|
|
top: co.top, |
|
900
|
|
|
width: width, |
|
901
|
|
|
height: height |
|
902
|
|
|
}; |
|
903
|
|
|
} |
|
904
|
|
|
}, |
|
905
|
|
|
|
|
906
|
|
|
resize: function( event ) { |
|
907
|
|
|
var woset, hoset, isParent, isOffsetRelative, |
|
908
|
|
|
that = $( this ).resizable( "instance" ), |
|
909
|
|
|
o = that.options, |
|
910
|
|
|
co = that.containerOffset, |
|
911
|
|
|
cp = that.position, |
|
912
|
|
|
pRatio = that._aspectRatio || event.shiftKey, |
|
913
|
|
|
cop = { |
|
914
|
|
|
top: 0, |
|
915
|
|
|
left: 0 |
|
916
|
|
|
}, |
|
917
|
|
|
ce = that.containerElement, |
|
918
|
|
|
continueResize = true; |
|
919
|
|
|
|
|
920
|
|
|
if ( ce[ 0 ] !== document && ( /static/ ).test( ce.css( "position" ) ) ) { |
|
921
|
|
|
cop = co; |
|
922
|
|
|
} |
|
923
|
|
|
|
|
924
|
|
|
if ( cp.left < ( that._helper ? co.left : 0 ) ) { |
|
925
|
|
|
that.size.width = that.size.width + |
|
926
|
|
|
( that._helper ? |
|
927
|
|
|
( that.position.left - co.left ) : |
|
928
|
|
|
( that.position.left - cop.left ) ); |
|
929
|
|
|
|
|
930
|
|
|
if ( pRatio ) { |
|
931
|
|
|
that.size.height = that.size.width / that.aspectRatio; |
|
932
|
|
|
continueResize = false; |
|
933
|
|
|
} |
|
934
|
|
|
that.position.left = o.helper ? co.left : 0; |
|
935
|
|
|
} |
|
936
|
|
|
|
|
937
|
|
|
if ( cp.top < ( that._helper ? co.top : 0 ) ) { |
|
938
|
|
|
that.size.height = that.size.height + |
|
939
|
|
|
( that._helper ? |
|
940
|
|
|
( that.position.top - co.top ) : |
|
941
|
|
|
that.position.top ); |
|
942
|
|
|
|
|
943
|
|
|
if ( pRatio ) { |
|
944
|
|
|
that.size.width = that.size.height * that.aspectRatio; |
|
945
|
|
|
continueResize = false; |
|
946
|
|
|
} |
|
947
|
|
|
that.position.top = that._helper ? co.top : 0; |
|
948
|
|
|
} |
|
949
|
|
|
|
|
950
|
|
|
isParent = that.containerElement.get( 0 ) === that.element.parent().get( 0 ); |
|
951
|
|
|
isOffsetRelative = /relative|absolute/.test( that.containerElement.css( "position" ) ); |
|
952
|
|
|
|
|
953
|
|
|
if ( isParent && isOffsetRelative ) { |
|
954
|
|
|
that.offset.left = that.parentData.left + that.position.left; |
|
955
|
|
|
that.offset.top = that.parentData.top + that.position.top; |
|
956
|
|
|
} else { |
|
957
|
|
|
that.offset.left = that.element.offset().left; |
|
958
|
|
|
that.offset.top = that.element.offset().top; |
|
959
|
|
|
} |
|
960
|
|
|
|
|
961
|
|
|
woset = Math.abs( that.sizeDiff.width + |
|
962
|
|
|
( that._helper ? |
|
963
|
|
|
that.offset.left - cop.left : |
|
964
|
|
|
( that.offset.left - co.left ) ) ); |
|
965
|
|
|
|
|
966
|
|
|
hoset = Math.abs( that.sizeDiff.height + |
|
967
|
|
|
( that._helper ? |
|
968
|
|
|
that.offset.top - cop.top : |
|
969
|
|
|
( that.offset.top - co.top ) ) ); |
|
970
|
|
|
|
|
971
|
|
|
if ( woset + that.size.width >= that.parentData.width ) { |
|
972
|
|
|
that.size.width = that.parentData.width - woset; |
|
973
|
|
|
if ( pRatio ) { |
|
974
|
|
|
that.size.height = that.size.width / that.aspectRatio; |
|
975
|
|
|
continueResize = false; |
|
976
|
|
|
} |
|
977
|
|
|
} |
|
978
|
|
|
|
|
979
|
|
|
if ( hoset + that.size.height >= that.parentData.height ) { |
|
980
|
|
|
that.size.height = that.parentData.height - hoset; |
|
981
|
|
|
if ( pRatio ) { |
|
982
|
|
|
that.size.width = that.size.height * that.aspectRatio; |
|
983
|
|
|
continueResize = false; |
|
984
|
|
|
} |
|
985
|
|
|
} |
|
986
|
|
|
|
|
987
|
|
|
if ( !continueResize ) { |
|
988
|
|
|
that.position.left = that.prevPosition.left; |
|
989
|
|
|
that.position.top = that.prevPosition.top; |
|
990
|
|
|
that.size.width = that.prevSize.width; |
|
991
|
|
|
that.size.height = that.prevSize.height; |
|
992
|
|
|
} |
|
993
|
|
|
}, |
|
994
|
|
|
|
|
995
|
|
|
stop: function() { |
|
996
|
|
|
var that = $( this ).resizable( "instance" ), |
|
997
|
|
|
o = that.options, |
|
998
|
|
|
co = that.containerOffset, |
|
999
|
|
|
cop = that.containerPosition, |
|
1000
|
|
|
ce = that.containerElement, |
|
1001
|
|
|
helper = $( that.helper ), |
|
1002
|
|
|
ho = helper.offset(), |
|
1003
|
|
|
w = helper.outerWidth() - that.sizeDiff.width, |
|
1004
|
|
|
h = helper.outerHeight() - that.sizeDiff.height; |
|
1005
|
|
|
|
|
1006
|
|
|
if ( that._helper && !o.animate && ( /relative/ ).test( ce.css( "position" ) ) ) { |
|
1007
|
|
|
$( this ).css( { |
|
1008
|
|
|
left: ho.left - cop.left - co.left, |
|
1009
|
|
|
width: w, |
|
1010
|
|
|
height: h |
|
1011
|
|
|
} ); |
|
1012
|
|
|
} |
|
1013
|
|
|
|
|
1014
|
|
|
if ( that._helper && !o.animate && ( /static/ ).test( ce.css( "position" ) ) ) { |
|
1015
|
|
|
$( this ).css( { |
|
1016
|
|
|
left: ho.left - cop.left - co.left, |
|
1017
|
|
|
width: w, |
|
1018
|
|
|
height: h |
|
1019
|
|
|
} ); |
|
1020
|
|
|
} |
|
1021
|
|
|
} |
|
1022
|
|
|
} ); |
|
1023
|
|
|
|
|
1024
|
|
|
$.ui.plugin.add( "resizable", "alsoResize", { |
|
1025
|
|
|
|
|
1026
|
|
|
start: function() { |
|
1027
|
|
|
var that = $( this ).resizable( "instance" ), |
|
1028
|
|
|
o = that.options; |
|
1029
|
|
|
|
|
1030
|
|
|
$( o.alsoResize ).each( function() { |
|
1031
|
|
|
var el = $( this ); |
|
1032
|
|
|
el.data( "ui-resizable-alsoresize", { |
|
1033
|
|
|
width: parseFloat( el.width() ), height: parseFloat( el.height() ), |
|
1034
|
|
|
left: parseFloat( el.css( "left" ) ), top: parseFloat( el.css( "top" ) ) |
|
1035
|
|
|
} ); |
|
1036
|
|
|
} ); |
|
1037
|
|
|
}, |
|
1038
|
|
|
|
|
1039
|
|
|
resize: function( event, ui ) { |
|
1040
|
|
|
var that = $( this ).resizable( "instance" ), |
|
1041
|
|
|
o = that.options, |
|
1042
|
|
|
os = that.originalSize, |
|
1043
|
|
|
op = that.originalPosition, |
|
1044
|
|
|
delta = { |
|
1045
|
|
|
height: ( that.size.height - os.height ) || 0, |
|
1046
|
|
|
width: ( that.size.width - os.width ) || 0, |
|
1047
|
|
|
top: ( that.position.top - op.top ) || 0, |
|
1048
|
|
|
left: ( that.position.left - op.left ) || 0 |
|
1049
|
|
|
}; |
|
1050
|
|
|
|
|
1051
|
|
|
$( o.alsoResize ).each( function() { |
|
1052
|
|
|
var el = $( this ), start = $( this ).data( "ui-resizable-alsoresize" ), style = {}, |
|
1053
|
|
|
css = el.parents( ui.originalElement[ 0 ] ).length ? |
|
1054
|
|
|
[ "width", "height" ] : |
|
1055
|
|
|
[ "width", "height", "top", "left" ]; |
|
1056
|
|
|
|
|
1057
|
|
|
$.each( css, function( i, prop ) { |
|
1058
|
|
|
var sum = ( start[ prop ] || 0 ) + ( delta[ prop ] || 0 ); |
|
1059
|
|
|
if ( sum && sum >= 0 ) { |
|
1060
|
|
|
style[ prop ] = sum || null; |
|
1061
|
|
|
} |
|
1062
|
|
|
} ); |
|
1063
|
|
|
|
|
1064
|
|
|
el.css( style ); |
|
1065
|
|
|
} ); |
|
1066
|
|
|
}, |
|
1067
|
|
|
|
|
1068
|
|
|
stop: function() { |
|
1069
|
|
|
$( this ).removeData( "ui-resizable-alsoresize" ); |
|
1070
|
|
|
} |
|
1071
|
|
|
} ); |
|
1072
|
|
|
|
|
1073
|
|
|
$.ui.plugin.add( "resizable", "ghost", { |
|
1074
|
|
|
|
|
1075
|
|
|
start: function() { |
|
1076
|
|
|
|
|
1077
|
|
|
var that = $( this ).resizable( "instance" ), cs = that.size; |
|
1078
|
|
|
|
|
1079
|
|
|
that.ghost = that.originalElement.clone(); |
|
1080
|
|
|
that.ghost.css( { |
|
1081
|
|
|
opacity: 0.25, |
|
1082
|
|
|
display: "block", |
|
1083
|
|
|
position: "relative", |
|
1084
|
|
|
height: cs.height, |
|
1085
|
|
|
width: cs.width, |
|
1086
|
|
|
margin: 0, |
|
1087
|
|
|
left: 0, |
|
1088
|
|
|
top: 0 |
|
1089
|
|
|
} ); |
|
1090
|
|
|
|
|
1091
|
|
|
that._addClass( that.ghost, "ui-resizable-ghost" ); |
|
1092
|
|
|
|
|
1093
|
|
|
// DEPRECATED |
|
1094
|
|
|
// TODO: remove after 1.12 |
|
1095
|
|
|
if ( $.uiBackCompat !== false && typeof that.options.ghost === "string" ) { |
|
1096
|
|
|
|
|
1097
|
|
|
// Ghost option |
|
1098
|
|
|
that.ghost.addClass( this.options.ghost ); |
|
1099
|
|
|
} |
|
1100
|
|
|
|
|
1101
|
|
|
that.ghost.appendTo( that.helper ); |
|
1102
|
|
|
|
|
1103
|
|
|
}, |
|
1104
|
|
|
|
|
1105
|
|
|
resize: function() { |
|
1106
|
|
|
var that = $( this ).resizable( "instance" ); |
|
1107
|
|
|
if ( that.ghost ) { |
|
1108
|
|
|
that.ghost.css( { |
|
1109
|
|
|
position: "relative", |
|
1110
|
|
|
height: that.size.height, |
|
1111
|
|
|
width: that.size.width |
|
1112
|
|
|
} ); |
|
1113
|
|
|
} |
|
1114
|
|
|
}, |
|
1115
|
|
|
|
|
1116
|
|
|
stop: function() { |
|
1117
|
|
|
var that = $( this ).resizable( "instance" ); |
|
1118
|
|
|
if ( that.ghost && that.helper ) { |
|
1119
|
|
|
that.helper.get( 0 ).removeChild( that.ghost.get( 0 ) ); |
|
1120
|
|
|
} |
|
1121
|
|
|
} |
|
1122
|
|
|
|
|
1123
|
|
|
} ); |
|
1124
|
|
|
|
|
1125
|
|
|
$.ui.plugin.add( "resizable", "grid", { |
|
1126
|
|
|
|
|
1127
|
|
|
resize: function() { |
|
1128
|
|
|
var outerDimensions, |
|
1129
|
|
|
that = $( this ).resizable( "instance" ), |
|
1130
|
|
|
o = that.options, |
|
1131
|
|
|
cs = that.size, |
|
1132
|
|
|
os = that.originalSize, |
|
1133
|
|
|
op = that.originalPosition, |
|
1134
|
|
|
a = that.axis, |
|
1135
|
|
|
grid = typeof o.grid === "number" ? [ o.grid, o.grid ] : o.grid, |
|
1136
|
|
|
gridX = ( grid[ 0 ] || 1 ), |
|
1137
|
|
|
gridY = ( grid[ 1 ] || 1 ), |
|
1138
|
|
|
ox = Math.round( ( cs.width - os.width ) / gridX ) * gridX, |
|
1139
|
|
|
oy = Math.round( ( cs.height - os.height ) / gridY ) * gridY, |
|
1140
|
|
|
newWidth = os.width + ox, |
|
1141
|
|
|
newHeight = os.height + oy, |
|
1142
|
|
|
isMaxWidth = o.maxWidth && ( o.maxWidth < newWidth ), |
|
1143
|
|
|
isMaxHeight = o.maxHeight && ( o.maxHeight < newHeight ), |
|
1144
|
|
|
isMinWidth = o.minWidth && ( o.minWidth > newWidth ), |
|
1145
|
|
|
isMinHeight = o.minHeight && ( o.minHeight > newHeight ); |
|
1146
|
|
|
|
|
1147
|
|
|
o.grid = grid; |
|
1148
|
|
|
|
|
1149
|
|
|
if ( isMinWidth ) { |
|
1150
|
|
|
newWidth += gridX; |
|
1151
|
|
|
} |
|
1152
|
|
|
if ( isMinHeight ) { |
|
1153
|
|
|
newHeight += gridY; |
|
1154
|
|
|
} |
|
1155
|
|
|
if ( isMaxWidth ) { |
|
1156
|
|
|
newWidth -= gridX; |
|
1157
|
|
|
} |
|
1158
|
|
|
if ( isMaxHeight ) { |
|
1159
|
|
|
newHeight -= gridY; |
|
1160
|
|
|
} |
|
1161
|
|
|
|
|
1162
|
|
|
if ( /^(se|s|e)$/.test( a ) ) { |
|
1163
|
|
|
that.size.width = newWidth; |
|
1164
|
|
|
that.size.height = newHeight; |
|
1165
|
|
|
} else if ( /^(ne)$/.test( a ) ) { |
|
1166
|
|
|
that.size.width = newWidth; |
|
1167
|
|
|
that.size.height = newHeight; |
|
1168
|
|
|
that.position.top = op.top - oy; |
|
1169
|
|
|
} else if ( /^(sw)$/.test( a ) ) { |
|
1170
|
|
|
that.size.width = newWidth; |
|
1171
|
|
|
that.size.height = newHeight; |
|
1172
|
|
|
that.position.left = op.left - ox; |
|
1173
|
|
|
} else { |
|
1174
|
|
|
if ( newHeight - gridY <= 0 || newWidth - gridX <= 0 ) { |
|
1175
|
|
|
outerDimensions = that._getPaddingPlusBorderDimensions( this ); |
|
1176
|
|
|
} |
|
1177
|
|
|
|
|
1178
|
|
|
if ( newHeight - gridY > 0 ) { |
|
1179
|
|
|
that.size.height = newHeight; |
|
1180
|
|
|
that.position.top = op.top - oy; |
|
1181
|
|
|
} else { |
|
1182
|
|
|
newHeight = gridY - outerDimensions.height; |
|
|
|
|
|
|
1183
|
|
|
that.size.height = newHeight; |
|
1184
|
|
|
that.position.top = op.top + os.height - newHeight; |
|
1185
|
|
|
} |
|
1186
|
|
|
if ( newWidth - gridX > 0 ) { |
|
1187
|
|
|
that.size.width = newWidth; |
|
1188
|
|
|
that.position.left = op.left - ox; |
|
1189
|
|
|
} else { |
|
1190
|
|
|
newWidth = gridX - outerDimensions.width; |
|
1191
|
|
|
that.size.width = newWidth; |
|
1192
|
|
|
that.position.left = op.left + os.width - newWidth; |
|
1193
|
|
|
} |
|
1194
|
|
|
} |
|
1195
|
|
|
} |
|
1196
|
|
|
|
|
1197
|
|
|
} ); |
|
1198
|
|
|
|
|
1199
|
|
|
return $.ui.resizable; |
|
1200
|
|
|
|
|
1201
|
|
|
} ) ); |
|
1202
|
|
|
|
yuncms /
framework
Loading history...