2 Copyright (c) 2009, Yahoo! Inc. All rights reserved.
3 Code licensed under the BSD License:
4 http://developer.yahoo.net/yui/license.txt
8 YUI.add('dd-proxy', function(Y) {
12 * The Drag & Drop Utility allows you to create a draggable interface efficiently, buffering you from browser-level abnormalities and enabling you to focus on the interesting logic surrounding your particular implementation. This component enables you to create a variety of standard draggable objects with just a few lines of code and then, using its extensive API, add your own specific implementation logic.
17 * This plugin for dd-drag is for creating a proxy drag node, instead of dragging the original node.
25 DRAG_NODE = 'dragNode',
29 var P = function(config) {
30 P.superclass.constructor.apply(this, arguments);
36 * @description The Proxy instance will be placed on the Drag instance under the proxy namespace.
45 * @attribute moveOnEnd
46 * @description Move the original node at the end of the drag. Default: true
53 * @attribute hideOnEnd
54 * @description Hide the drag node at the end of the drag. Default: true
61 * @attribute resizeFrame
62 * @description Make the Proxy node assume the size of the original node. Default: true
69 * @attribute positionProxy
70 * @description Make the Proxy node appear in the same place as the original node. Default: true
77 * @attribute borderStyle
78 * @description The default border style for the border of the proxy. Default: 1px solid #808080
82 value: '1px solid #808080'
90 * @description Holds the event handles for setting the proxy
96 * @description Handler for the proxy config attribute
100 Y.on('domready', Y.bind(this._init, this));
106 var i, h, h1, host = this.get(HOST), dnode = host.get(DRAG_NODE);
107 if (dnode.compareTo(host.get(NODE))) {
109 host.set(DRAG_NODE, DDM._proxy);
112 Y.each(this._hands, function(v) {
115 h = DDM.on('ddm:start', Y.bind(function() {
116 if (DDM.activeDrag === host) {
120 h1 = DDM.on('ddm:end', Y.bind(function() {
121 if (host.get('dragging')) {
122 if (this.get('moveOnEnd')) {
123 host.get(NODE).setXY(host.lastXY);
125 if (this.get('hideOnEnd')) {
126 host.get(DRAG_NODE).setStyle('display', 'none');
130 this._hands = [h, h1];
132 initializer: function() {
135 destructor: function() {
136 var host = this.get(HOST);
137 Y.each(this._hands, function(v) {
140 host.set(DRAG_NODE, host.get(NODE));
144 Y.namespace('Plugin');
145 Y.extend(P, Y.Base, proto);
146 Y.Plugin.DDProxy = P;
148 //Add a couple of methods to the DDM
154 * @method _createFrame
155 * @description Create the proxy element if it doesn't already exist and set the DD.DDM._proxy value
157 _createFrame: function() {
161 var p = Y.Node.create('<div></div>'),
162 b = Y.Node.get('body');
165 position: 'absolute',
172 b.insertBefore(p, b.get('firstChild'));
173 p.set('id', Y.stamp(p));
174 p.addClass(DDM.CSS_PREFIX + '-proxy');
183 * @description If resizeProxy is set to true (default) it will resize the proxy element to match the size of the Drag Element.
184 * If positionProxy is set to true (default) it will position the proxy element in the same location as the Drag Element.
186 _setFrame: function(drag) {
187 var n = drag.get(NODE), d = drag.get(DRAG_NODE), ah, cur = 'auto';
188 if (drag.proxy.get('resizeFrame')) {
189 DDM._proxy.setStyles({
190 height: n.get('offsetHeight') + 'px',
191 width: n.get('offsetWidth') + 'px'
195 ah = DDM.activeDrag.get('activeHandle');
197 cur = ah.getStyle('cursor');
200 cur = DDM.get('dragCursor');
205 visibility: 'hidden',
208 border: drag.proxy.get('borderStyle')
213 if (drag.proxy.get('positionProxy')) {
214 d.setXY(drag.nodeXY);
216 d.setStyle('visibility', 'visible');
220 //Create the frame when DOM is ready
221 Y.on('domready', Y.bind(DDM._createFrame, DDM));
225 }, '3.0.0' ,{requires:['dd-ddm', 'dd-drag'], skinnable:false});