3
Copyright 2012 Yahoo! Inc. All rights reserved.
4
Licensed under the BSD License.
5
http://yuilibrary.com/license/
7
YUI.add('resize-proxy', function(Y) {
9
var ACTIVE_HANDLE_NODE = 'activeHandleNode',
11
DRAG_CURSOR = 'dragCursor',
13
PARENT_NODE = 'parentNode',
15
PROXY_NODE = 'proxyNode',
17
RESIZE_PROXY = 'resize-proxy',
20
getCN = Y.ClassNameManager.getClassName,
22
CSS_RESIZE_PROXY = getCN(RESIZE, PROXY);
26
Adds a `proxyNode` attribute and resizes it instead of the actual node. __very similar to DDProxy__
28
var resize = new Y.Resize({
29
//Selector of the node to resize
32
resize.plug(Y.Plugin.ResizeProxy);
37
@submodule resize-proxy
44
function ResizeProxy() {
45
ResizeProxy.superclass.constructor.apply(this, arguments);
55
* The Resize proxy element.
57
* @attribute proxyNode
58
* @default Generated using an internal HTML markup
64
return Y.Node.create(this.PROXY_TEMPLATE);
70
Y.extend(ResizeProxy, Y.Plugin.Base, {
72
* Template used to create the resize proxy.
74
* @property PROXY_TEMPLATE
77
PROXY_TEMPLATE: '<div class="'+CSS_RESIZE_PROXY+'"></div>',
79
initializer: function() {
82
instance.afterHostEvent('resize:start', instance._afterResizeStart);
83
instance.beforeHostMethod('_resize', instance._beforeHostResize);
84
instance.afterHostMethod('_resizeEnd', instance._afterHostResizeEnd);
87
destructor: function() {
90
instance.get(PROXY_NODE).remove(true);
93
_afterHostResizeEnd: function(event) {
95
drag = event.dragEvent.target;
97
// reseting actXY from drag when drag end
100
// if proxy is true, hide it on resize end
101
instance._syncProxyUI();
103
instance.get(PROXY_NODE).hide();
106
_afterResizeStart: function(event) {
109
instance._renderProxy();
112
_beforeHostResize: function(event) {
114
host = this.get(HOST);
116
host._handleResizeAlignEvent(event.dragEvent);
118
// if proxy is true _syncProxyUI instead of _syncUI
119
instance._syncProxyUI();
121
return new Y.Do.Prevent();
125
* Render the <a href="ResizeProxy.html#config_proxyNode">proxyNode</a> element and
126
* make it sibling of the <a href="Resize.html#config_node">node</a>.
128
* @method _renderProxy
131
_renderProxy: function() {
133
host = this.get(HOST),
134
proxyNode = instance.get(PROXY_NODE);
136
if (!proxyNode.inDoc()) {
137
host.get(WRAPPER).get(PARENT_NODE).append(
144
* Sync the proxy UI with internal values from
145
* <a href="ResizeProxy.html#property_info">info</a>.
147
* @method _syncProxyUI
150
_syncProxyUI: function() {
152
host = this.get(HOST),
154
activeHandleNode = host.get(ACTIVE_HANDLE_NODE),
155
proxyNode = instance.get(PROXY_NODE),
156
cursor = activeHandleNode.getStyle(CURSOR);
158
proxyNode.show().setStyle(CURSOR, cursor);
160
host.delegate.dd.set(DRAG_CURSOR, cursor);
162
proxyNode.sizeTo(info.offsetWidth, info.offsetHeight);
164
proxyNode.setXY([ info.left, info.top ]);
168
Y.namespace('Plugin');
169
Y.Plugin.ResizeProxy = ResizeProxy;
172
}, '3.5.1' ,{requires:['resize-base', 'plugin'], skinnable:false});