Proyectos de Subversion Moodle

Rev

| Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
1 efrain 1
YUI.add('resize-plugin', function (Y, NAME) {
2
 
3
/**
4
 * The Resize Plugin allows you to make a Node or a Widget resizable. It supports all the functionality of
5
 * the standalone Resize utility. Additionally, resizing a widget updates the widget's height,width and x,y
6
 * attributes, if they exist.
7
 
8
 
9
        var overlay = new Y.Overlay({
10
           width: "200px",
11
           srcNode: "#overlay",
12
           visible: false,
13
           align: {node:".example", points:["tc", "bc"]}
14
        });
15
        overlay.plug(Y.Plugin.Resize);
16
 
17
 
18
 *
19
 * @module resize
20
 * @submodule resize-plugin
21
 * @extends Resize
22
 * @class Plugin.Resize
23
 * @constructor
24
 */
25
var ResizePlugin = function(config) {
26
 
27
                //if its a widget, get the bounding box
28
                config.node = ((Y.Widget && config.host instanceof Y.Widget) ? config.host.get('boundingBox') : config.host);
29
                if (config.host instanceof Y.Widget) {
30
                        config.widget = config.host;
31
                }
32
                else {
33
                        config.widget = false;
34
                }
35
 
36
                ResizePlugin.superclass.constructor.call(this, config);
37
        };
38
 
39
        /**
40
        * @property NAME
41
        * @description resize-plugin
42
        * @type {String}
43
        */
44
        ResizePlugin.NAME = "resize-plugin";
45
 
46
        /**
47
        * The Resize instance will be placed on the Node instance under
48
        * the resize namespace. It can be accessed via Node.resize or Widget.resize;
49
        * @property NS
50
        * @type {String}
51
        */
52
        ResizePlugin.NS = "resize";
53
 
54
        /**
55
         * Static property used to define the default attribute
56
         * configuration for the Resize plugin.
57
         *
58
         * @property ATTRS
59
         * @type Object
60
         * @static
61
         */
62
        ResizePlugin.ATTRS = {
63
 
64
              /**
65
               * Stores the node that is being resized
66
               *
67
               * @attribute node
68
               * @default undefined
69
               * @public
70
               */
71
                node: {
72
                        value: undefined
73
                },
74
 
75
                /**
76
                 * Stores the widget that the node belongs to, if one exists
77
                 *
78
                 * @attribute widget
79
                 * @default undefined
80
                 * @public
81
                 */
82
                widget: {
83
                        value:undefined
84
                }
85
        };
86
 
87
 
88
        Y.extend(ResizePlugin, Y.Resize, {
89
 
90
                /**
91
                 * Stores the values for node and widget, and sets up an event-listener
92
                 *
93
                 * @method initializer
94
                 * @protected
95
                 */
96
                initializer: function(config) {
97
 
98
                        this.set('node', config.node);
99
                        this.set('widget', config.widget);
100
 
101
                        this.on('resize:resize', function(e) {
102
                                this._correctDimensions(e);
103
                        });
104
                },
105
 
106
                /**
107
                 * Updates the node's (x,y) values if they are changed via resizing.
108
                 * If the node belongs to a widget, passes the widget down to _setWidgetProperties method
109
                 *
110
                 * @method _correctDimensions
111
                 * @param {EventFacade} e The Event object
112
                 * @private
113
                 */
114
                _correctDimensions: function(e) {
115
 
116
                        var node = this.get('node'),
117
                        x = {
118
                            old: node.getX(),
119
                            cur: e.currentTarget.info.left
120
                        },
121
                        y = {
122
                            old: node.getY(),
123
                            cur: e.currentTarget.info.top
124
                        };
125
 
126
 
127
                        if (this.get('widget')) {
128
                            this._setWidgetProperties(e, x, y);
129
                        }
130
 
131
                        //now set properties on just the node or the widget's bounding box
132
                        if (this._isDifferent(x.old, x.cur)) {
133
                            node.set('x', x.cur);
134
                        }
135
 
136
                        if (this._isDifferent(y.old, y.cur)) {
137
                            node.set('y', y.cur);
138
                        }
139
 
140
                },
141
 
142
 
143
                   /**
144
                    * If the host is a widget, then set the width, height. Then look for widgetPosition and set x,y
145
                    *
146
                    * @method _setWidgetProperties
147
                    * @param {EventFacade} e The Event object
148
                    * @param {Object} x Literal containing old x value and current x value
149
                    * @param {Object} y Literal containing old y value and current y value
150
                    * @private
151
                    */
152
                   _setWidgetProperties: function(e,x,y) {
153
                       //all widgets have width/height attrs. change these only if they differ from the old values
154
 
155
                       var widget = this.get('widget'),
156
                       oldHeight = widget.get('height'),
157
                       oldWidth = widget.get('width'),
158
                       currentWidth = e.currentTarget.info.offsetWidth - e.currentTarget.totalHSurrounding,
159
                       currentHeight = e.currentTarget.info.offsetHeight - e.currentTarget.totalVSurrounding;
160
 
161
                       if (this._isDifferent(oldHeight, currentHeight)) {
162
                          widget.set('height', currentHeight);
163
                       }
164
 
165
                       if (this._isDifferent(oldWidth, currentWidth)) {
166
                          widget.set('width', currentWidth);
167
                       }
168
 
169
 
170
 
171
                       //If the widget uses Y.WidgetPosition, it will also have x,y position support.
172
                       if (widget.hasImpl && widget.hasImpl(Y.WidgetPosition)) {
173
 
174
                           if (this._isDifferent(widget.get('x'), x.cur)) {
175
                               widget.set('x', x.cur);
176
                           }
177
 
178
                           if (this._isDifferent(widget.get('y'), y.cur)) {
179
                               widget.set('y', y.cur);
180
                           }
181
 
182
 
183
                       }
184
                   },
185
 
186
                   /**
187
                      * a little utility method that returns a value if the old !== new, otherwise it returns false.
188
                      *
189
                      * @method _isDifferent
190
                      * @param {Number} oldVal
191
                      * @param {Number} newVal
192
                      * @private
193
                      */
194
                   _isDifferent: function(oldVal, newVal) {
195
                       var retValue = false;
196
                       if (oldVal !== newVal) {
197
                           retValue = newVal;
198
                       }
199
                       return retValue;
200
                   }
201
 
202
 
203
        });
204
        Y.namespace('Plugin');
205
        Y.Plugin.Resize = ResizePlugin;
206
 
207
 
208
}, '3.18.1', {"requires": ["resize-base", "plugin"], "optional": ["resize-constrain"]});