The object ID. Each object has its own unique $oid. It is mainly used for debugging purpose.
Trick: you can test if a JavaScript object is a ZK object by examining this property, such as `if (o.$oid) alert('o is a ZK object');`
Notice: zk.Class extends from zk.Object (so a class also has $oid)
Optional controlThe control object for this draggable.
Optional deadOptional handleOptional lastOptional nodeThe DOM element that is draggable (the whole element).
The options of this draggable.
handle
```ts {@link DOMElement} handle ```A child DOM element that the user can drag the whole element. Specify one if not the whole element (the node argument) can be dragged. It becomes the value of handle if specified.
null (i.e., node is used.
Specifies how many pixels to snap the dragging. For example, if the snap is 10, then the dragging has no effect if the offset is only 4, and the dragging offset is considered as 10 if it was 5.
The first format specifies the snaps for the x and y coordinate, such as [5, 3]. The second format specifies the snap for both x and y coordinate. The third format is used to calculate the snap dynamically based on the current position.
null
Specifies the effect to execute when the dragging is started. It usually generates an animation effect.
a default action. To disable it, pass zk.$void.
Specifies the effect to execute when the dragging is finished. It usually generates an animation effect.
a default action. To disable it, pass zk.$void.
The function to do the revert effect. Notice that it is ignored if the revert option is false (or returns false).
null.
The revert option could be a boolean, or a function that returns a boolean value. The boolean value decides whether to revert the dragging after dragged. If true, the element is reverted to its original location.
false
To have a custom revert effect, you can specify a function as the #reverteffect option. It is usually an animation effect; see zEffect;
Specifies the constraint. The first format specifies either 'vertical' or 'horizontal' to indicate that it can be dragged only in the vertical or horizontal direction.
The second format specified a function that can modify the position dynamically. For example, you can limit the drag at the diagonal direction.
Returns real position, or null if the pos argument is correct
Specified whether to make a copy of the element and then drag the copy instead of the element itself.
If true is specified (the first format), node is cloned and the cloned element will be dragged.
If a function is specified (the second format), the function is called and it shall create and return a DOM element (so called a ghost or a copy)that will be used for dragging. Furthermore, after dragging, `endghosting`, if specified, will be called to clean up.
null (the element, node, will be dragged directly.
Example: ```ts var html = '
Called after the dragging is finished to clean up what have been done by the function specified in `ghosting`.
It is optional since zk.Draggable will remove the DOM element created by the function specified in `ghosting`.
Notice that it is ignored if the `ghosting` option is not specified with a function.
null
Specifies whether to create a DIV to cover the whole browser window when dragging. The DIV is helpful if the browser window contains iframe and other objects that will 'eat' the mousemove effect (and cause the dragging stopped abruptly).
false
Specifies whether to create a stackup (actually an iframe) that makes sure the element being dragging is on top of others.
false
The z-index that will be assigned when dragging the element. If it is a function, it is assumed to be a function returning the z-index (or -1 if it prefer not to change z-index)
not assign any value to z-index
Called after the dragging has changed the position of the element (node). It is called after the function specified in the snap and draw or constraint option. It is also called it has been scrolled.
Used to override the default change of the element's position. If not specified, the constraint option is, if any, called and then node's position (left and top) are changed. You can provide your own way to change the position.
null
Specify which DOM element to consider its scrollLeft and scrollTop. In other words, it is the element with scrollbar that affects the location of the draggable element (zk.Draggable#node).
null
Notice that scroll could be DOM element, including window, or its ID.
The scroll sensitivity.
20
The scroll speed.
15
Optional orgOptional orgOptional orgZOptional orgnodeOptional runOptional scrollOptional stackupOptional z_Optional z_Optional z_Optional z_Optional z_Optional z_Determines if this object is an instance of the class represented by the specified Class parameter. Example:
if (obj.$instanceof(zul.wgt.Label, zul.wgt.Image)) {
}
Rest ...klass: any[]the Class object to be checked. Any number of arguments can be specified.
true if this object is an instance of the class
Invokes a method defined in the superclass with any number of arguments. It is like Function's call() that takes any number of arguments.
Example: ```ts multiply: function (n) { return this.$super('multiply', n + 2); } ```
the object being returned by the method of the superclass.
Invokes a method defined in the superclass with any number of arguments. It is like Function's call() that takes any number of arguments.
It is similar to ZKObject.$super, but this method works even if the superclass calls back the same member method. In short, it is tedious but safer.
Example: ```ts foo.MyClass = zk.$extends(foo.MySuper, { multiply: function (n) { return this.$super(foo.MyClass, 'multiply', n + 2); } ```
Notice that the class specified in the first argument is not the super class having the method. Rather, it is the class that invokes this method.
the object being returned by the method of the superclass.
Invokes a method defined in the superclass with an array of arguments. It is like Function's apply() that takes an array of arguments.
Example: ```ts multiply: function () { return this.$supers('multiply', arguments); } ```
the object being returned by the method of the superclass.
Invokes a method defined in the superclass with an array of arguments. It is like Function's apply() that takes an array of arguments.
It is similar to zk.Object.$supers, but this method works even if the superclass calls back the same member method. In short, it is tedious but safer.
Example: ```ts foo.MyClass = zk.$extends(foo.MySuper, { multiply: function () { return this.$supers(foo.MyClass, 'multiply', arguments); } ```
Notice that the class specified in the first argument is not the super class having the method. Rather, it is the class that invokes this method.
the object being returned by the method of the superclass.
Specifies a function that shall be called after the object is initialized, i.e., after zk.Object.$init is called. This method can be called only during the execution of zk.Object.$init.
It is an advance feature that is used to allow a base class to do something that needs to wait for all deriving classes have been initialized.
Invocation Sequence:
the function to register for execution later
Proxies a member function such that it can be called with this object in a context that this object is not available. It sounds a bit strange at beginning but useful when passing a member of an object that will be executed as a global function.
Example: Let us say if you want a member function to be called periodically, you can do as follows. ```ts setInterval(wgt.proxy(wgt.doIt), 1000); //assume doIt is a member function of wgt ```
With proxy, when doIt is called, this references to wgt. On the other hand, the following won't work since this doesn't reference to wgt, when doIt is called. ```ts setInterval(wgt.doIt, 1000); //WRONG! doIt will not be called with wgt ```
Notice that this method caches the result so that it will return the same proxied function, if you pass the same function again.
a function that can be called as a global function
(that actually have this referencing to this object).
A draggable object used to make a DOM element draggable.