diff options
Diffstat (limited to 'js/dojo-1.6/dojox/widget/rotator/ThumbnailController.js')
| -rw-r--r-- | js/dojo-1.6/dojox/widget/rotator/ThumbnailController.js | 107 |
1 files changed, 107 insertions, 0 deletions
diff --git a/js/dojo-1.6/dojox/widget/rotator/ThumbnailController.js b/js/dojo-1.6/dojox/widget/rotator/ThumbnailController.js new file mode 100644 index 0000000..22282d0 --- /dev/null +++ b/js/dojo-1.6/dojox/widget/rotator/ThumbnailController.js @@ -0,0 +1,107 @@ +/*
+ Copyright (c) 2004-2011, The Dojo Foundation All Rights Reserved.
+ Available via Academic Free License >= 2.1 OR the modified BSD license.
+ see: http://dojotoolkit.org/license for details
+*/
+
+
+if(!dojo._hasResource["dojox.widget.rotator.ThumbnailController"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
+dojo._hasResource["dojox.widget.rotator.ThumbnailController"] = true;
+dojo.provide("dojox.widget.rotator.ThumbnailController");
+
+(function(d){
+
+ var _css = "dojoxRotatorThumb",
+ _selected = _css + "Selected";
+
+ d.declare("dojox.widget.rotator.ThumbnailController", null, {
+ // summary:
+ // A rotator controller that displays thumbnails of each rotator pane.
+ //
+ // description:
+ // The ThumbnailController will look at each of the rotator's panes and
+ // only if the node is an <img> tag, then it will create an thumbnail of
+ // the pane's image using the <img> tag's "thumbsrc" or "src" attribute.
+ //
+ // The size of the thumbnails and the style of the selected thumbnail is
+ // controlled using CSS.
+ //
+ // example:
+ // | <div dojoType="dojox.widget.Rotator" jsId="myRotator">
+ // | <img src="/path/to/image1.jpg" thumbsrc="/path/to/thumb1.jpg" alt="Image 1"/>
+ // | <img src="/path/to/image2.jpg" thumbsrc="/path/to/thumb2.jpg" alt="Image 2"/>
+ // | </div>
+ // | <div dojoType="dojox.widget.rotator.ThumbnailController" rotator="myRotator"></div>
+
+ // rotator: dojox.widget.Rotator
+ // An instance of a Rotator widget.
+ rotator: null,
+
+ constructor: function(/*Object*/params, /*DomNode|string*/node){
+ // summary:
+ // Initializes the thumbnails and connect to the rotator.
+
+ d.mixin(this, params);
+
+ this._domNode = node;
+
+ // check if we have a valid rotator
+ var r = this.rotator;
+ if(r){
+ // remove all of the controller's child nodes just in case
+ while(node.firstChild){
+ node.removeChild(node.firstChild);
+ }
+
+ for(var i=0; i<r.panes.length; i++){
+ var n = r.panes[i].node,
+ s = d.attr(n, "thumbsrc") || d.attr(n, "src"),
+ t = d.attr(n, "alt") || "";
+
+ if(/img/i.test(n.tagName)){
+ (function(j){
+ d.create("a", {
+ classname: _css + ' ' + _css + j + ' ' + (j == r.idx ? _selected : ""),
+ href: s,
+ onclick: function(e){
+ d.stopEvent(e);
+ if(r){
+ r.control.apply(r, ["go", j]);
+ }
+ },
+ title: t,
+ innerHTML: '<img src="' + s + '" alt="' + t + '"/>'
+ }, node);
+ })(i);
+ }
+ }
+
+ this._con = d.connect(r, "onUpdate", this, "_onUpdate");
+ }
+ },
+
+ destroy: function(){
+ // summary:
+ // Disconnect from the rotator.
+
+ d.disconnect(this._con);
+ d.destroy(this._domNode);
+ },
+
+ _onUpdate: function(/*string*/type){
+ // summary:
+ // Updates various pager controls when the rotator updates.
+
+ var r = this.rotator; // no need to test if this is null since _onUpdate is only fired by the rotator
+ if(type == "onAfterTransition"){
+ var n = d.query('.' + _css, this._domNode).removeClass(_selected);
+ if(r.idx < n.length){
+ d.addClass(n[r.idx], _selected);
+ }
+ }
+ }
+ });
+
+})(dojo);
+
+}
|
