summaryrefslogtreecommitdiffstatshomepage
path: root/includes/js/dojox/image
diff options
context:
space:
mode:
authorGravatar mensonge2008-11-14 15:39:19 +0000
committerGravatar mensonge2008-11-14 15:39:19 +0000
commit1c5685d68f1b73270fb814fe04cbb490eb90ba5f (patch)
tree3d3ada08a934b96fc31531f1327690d7edc6f766 /includes/js/dojox/image
parent104d59099e048688c4dbac37d72137006e396558 (diff)
downloadscuttle-1c5685d68f1b73270fb814fe04cbb490eb90ba5f.tar.gz
scuttle-1c5685d68f1b73270fb814fe04cbb490eb90ba5f.zip
Minor fix: Remove DOJO library (60Mo) replaced by link to Google CDN (online DOJO library)
git-svn-id: https://semanticscuttle.svn.sourceforge.net/svnroot/semanticscuttle/trunk@159 b3834d28-1941-0410-a4f8-b48e95affb8f
Diffstat (limited to 'includes/js/dojox/image')
-rw-r--r--includes/js/dojox/image/Gallery.js182
-rw-r--r--includes/js/dojox/image/Lightbox.js451
-rw-r--r--includes/js/dojox/image/Magnifier.js75
-rw-r--r--includes/js/dojox/image/MagnifierLite.js126
-rw-r--r--includes/js/dojox/image/README66
-rw-r--r--includes/js/dojox/image/SlideShow.js598
-rw-r--r--includes/js/dojox/image/ThumbnailPicker.js535
-rw-r--r--includes/js/dojox/image/resources/Gallery.html4
-rw-r--r--includes/js/dojox/image/resources/Lightbox.html15
-rw-r--r--includes/js/dojox/image/resources/Magnifier.css5
-rw-r--r--includes/js/dojox/image/resources/Magnifier.css.commented.css5
-rw-r--r--includes/js/dojox/image/resources/SlideShow.html14
-rw-r--r--includes/js/dojox/image/resources/ThumbnailPicker.html11
-rw-r--r--includes/js/dojox/image/resources/image.css283
-rw-r--r--includes/js/dojox/image/resources/image.css.commented.css345
-rw-r--r--includes/js/dojox/image/resources/images/buttons.gifbin4620 -> 0 bytes
-rw-r--r--includes/js/dojox/image/resources/images/buttons.pngbin9259 -> 0 bytes
-rw-r--r--includes/js/dojox/image/resources/images/close.pngbin675 -> 0 bytes
-rw-r--r--includes/js/dojox/image/resources/images/close_dark.pngbin711 -> 0 bytes
-rw-r--r--includes/js/dojox/image/resources/images/left.pngbin626 -> 0 bytes
-rw-r--r--includes/js/dojox/image/resources/images/loading.gifbin4178 -> 0 bytes
-rw-r--r--includes/js/dojox/image/resources/images/right.pngbin621 -> 0 bytes
-rw-r--r--includes/js/dojox/image/resources/images/warning.pngbin995 -> 0 bytes
-rw-r--r--includes/js/dojox/image/tests/images.json32
-rw-r--r--includes/js/dojox/image/tests/images/extraWide.jpgbin49250 -> 0 bytes
-rw-r--r--includes/js/dojox/image/tests/images/huuuge.pngbin37958 -> 0 bytes
-rw-r--r--includes/js/dojox/image/tests/images/imageHoriz.jpgbin47693 -> 0 bytes
-rw-r--r--includes/js/dojox/image/tests/images/imageHoriz2.jpgbin77176 -> 0 bytes
-rw-r--r--includes/js/dojox/image/tests/images/imageVert.jpgbin71533 -> 0 bytes
-rw-r--r--includes/js/dojox/image/tests/images/spanke.jpgbin302741 -> 0 bytes
-rw-r--r--includes/js/dojox/image/tests/images/square.jpgbin82010 -> 0 bytes
-rw-r--r--includes/js/dojox/image/tests/test_Gallery.html67
-rw-r--r--includes/js/dojox/image/tests/test_Lightbox.html105
-rw-r--r--includes/js/dojox/image/tests/test_Magnifier.html98
-rw-r--r--includes/js/dojox/image/tests/test_MagnifierLite.html91
-rw-r--r--includes/js/dojox/image/tests/test_SlideShow.html68
-rw-r--r--includes/js/dojox/image/tests/test_ThumbnailPicker.html134
37 files changed, 0 insertions, 3310 deletions
diff --git a/includes/js/dojox/image/Gallery.js b/includes/js/dojox/image/Gallery.js
deleted file mode 100644
index d29ae22..0000000
--- a/includes/js/dojox/image/Gallery.js
+++ /dev/null
@@ -1,182 +0,0 @@
-if(!dojo._hasResource["dojox.image.Gallery"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
-dojo._hasResource["dojox.image.Gallery"] = true;
-dojo.provide("dojox.image.Gallery");
-dojo.experimental("dojox.image.Gallery");
-//
-// dojox.image.Gallery courtesy Shane O Sullivan, licensed under a Dojo CLA
-// @author Copyright 2007 Shane O Sullivan (shaneosullivan1@gmail.com)
-//
-// For a sample usage, see http://www.skynet.ie/~sos/photos.php
-//
-// TODO: Make public, document params and privitize non-API conformant methods.
-// document topics.
-
-dojo.require("dojo.fx");
-dojo.require("dijit._Widget");
-dojo.require("dijit._Templated");
-dojo.require("dojox.image.ThumbnailPicker");
-dojo.require("dojox.image.SlideShow");
-
-dojo.declare("dojox.image.Gallery",
- [dijit._Widget, dijit._Templated],
- {
- // summary:
- // Gallery widget that wraps a dojox.image.ThumbnailPicker and dojox.image.SlideShow widget
- //
- // imageHeight: Number
- // Maximum height of an image in the SlideShow widget
- imageHeight: 375,
-
- // imageWidth: Number
- // Maximum width of an image in the SlideShow widget
- imageWidth: 500,
-
- // pageSize: Number
- // The number of records to retrieve from the data store per request.
- pageSize: dojox.image.SlideShow.prototype.pageSize,
-
- // autoLoad: Boolean
- // If true, images are loaded before the user views them. If false, an
- // image is loaded when the user displays it.
- autoLoad: true,
-
- // linkAttr: String
- // Defines the name of the attribute to request from the store to retrieve the
- // URL to link to from an image, if any.
- linkAttr: "link",
-
- // imageThumbAttr: String
- // Defines the name of the attribute to request from the store to retrieve the
- // URL to the thumbnail image.
- imageThumbAttr: "imageUrlThumb",
-
- // imageLargeAttr: String
- // Defines the name of the attribute to request from the store to retrieve the
- // URL to the image.
- imageLargeAttr: "imageUrl",
-
- // titleAttr: String
- // Defines the name of the attribute to request from the store to retrieve the
- // title of the picture, if any.
- titleAttr: "title",
-
- // slideshowInterval: Integer
- // time in seconds, between image changes in the slide show.
- slideshowInterval: 3,
-
- templateString:"<div dojoAttachPoint=\"outerNode\" class=\"imageGalleryWrapper\">\n\t<div dojoAttachPoint=\"thumbPickerNode\"></div>\n\t<div dojoAttachPoint=\"slideShowNode\"></div>\n</div>\n",
-
- postCreate: function(){
- // summary: Initializes the widget, creates the ThumbnailPicker and SlideShow widgets
- this.widgetid = this.id;
- this.inherited(arguments)
-
- this.thumbPicker = new dojox.image.ThumbnailPicker({
- linkAttr: this.linkAttr,
- imageLargeAttr: this.imageLargeAttr,
- titleAttr: this.titleAttr,
- useLoadNotifier: true,
- size: this.imageWidth
- }, this.thumbPickerNode);
-
-
- this.slideShow = new dojox.image.SlideShow({
- imageHeight: this.imageHeight,
- imageWidth: this.imageWidth,
- autoLoad: this.autoLoad,
- linkAttr: this.linkAttr,
- imageLargeAttr: this.imageLargeAttr,
- titleAttr: this.titleAttr,
- slideshowInterval: this.slideshowInterval,
- pageSize: this.pageSize
- }, this.slideShowNode);
-
- var _this = this;
- //When an image is shown in the Slideshow, make sure it is visible
- //in the ThumbnailPicker
- dojo.subscribe(this.slideShow.getShowTopicName(), function(packet){
- //if(packet.index < _this.thumbPicker._thumbIndex
- // || packet.index > _this.thumbPicker._thumbIndex + _this.thumbPicker.numberThumbs -1){
- //if(!_this.thumbPicker.isVisible(packet.index)){
- //var index = packet.index - (packet.index % _this.thumbPicker.numberThumbs);
- _this.thumbPicker._showThumbs(packet.index);
- //}
- });
- //When the user clicks a thumbnail, show that image
- dojo.subscribe(this.thumbPicker.getClickTopicName(), function(evt){
- _this.slideShow.showImage(evt.index);
- });
- //When the ThumbnailPicker moves to show a new set of pictures,
- //make the Slideshow start loading those pictures first.
- dojo.subscribe(this.thumbPicker.getShowTopicName(), function(evt){
- _this.slideShow.moveImageLoadingPointer(evt.index);
- });
- //When an image finished loading in the slideshow, update the loading
- //notification in the ThumbnailPicker
- dojo.subscribe(this.slideShow.getLoadTopicName(), function(index){
- _this.thumbPicker.markImageLoaded(index);
- });
- this._centerChildren();
- },
-
- setDataStore: function(dataStore, request, /*optional*/paramNames){
- // summary: Sets the data store and request objects to read data from.
- // dataStore:
- // An implementation of the dojo.data.api.Read API. This accesses the image
- // data.
- // request:
- // An implementation of the dojo.data.api.Request API. This specifies the
- // query and paging information to be used by the data store
- // paramNames:
- // An object defining the names of the item attributes to fetch from the
- // data store. The four attributes allowed are 'linkAttr', 'imageLargeAttr',
- // 'imageThumbAttr' and 'titleAttr'
- this.thumbPicker.setDataStore(dataStore, request, paramNames);
- this.slideShow.setDataStore(dataStore, request, paramNames);
- },
-
- reset: function(){
- // summary: Resets the widget to its initial state
- this.slideShow.reset();
- this.thumbPicker.reset();
- },
-
- showNextImage: function(inTimer){
- // summary: Changes the image being displayed in the SlideShow to the next
- // image in the data store
- // inTimer: Boolean
- // If true, a slideshow is active, otherwise the slideshow is inactive.
- this.slideShow.showNextImage();
- },
-
- toggleSlideshow: function(){
- // summary: Switches the slideshow mode on and off.
- this.slideShow.toggleSlideshow();
- },
-
- showImage: function(index, /*optional*/callback){
- // summary: Shows the image at index 'idx'.
- // idx: Number
- // The position of the image in the data store to display
- // callback: Function
- // Optional callback function to call when the image has finished displaying.
- this.slideShow.showImage(index, callback);
- },
-
- _centerChildren: function() {
- // summary: Ensures that the ThumbnailPicker and the SlideShow widgets
- // are centered.
- var thumbSize = dojo.marginBox(this.thumbPicker.outerNode);
- var slideSize = dojo.marginBox(this.slideShow.outerNode);
-
- var diff = (thumbSize.w - slideSize.w) / 2;
-
- if(diff > 0) {
- dojo.style(this.slideShow.outerNode, "marginLeft", diff + "px");
- } else if(diff < 0) {
- dojo.style(this.thumbPicker.outerNode, "marginLeft", (diff * -1) + "px");
- }
- }
-});
-
-}
diff --git a/includes/js/dojox/image/Lightbox.js b/includes/js/dojox/image/Lightbox.js
deleted file mode 100644
index 79056d3..0000000
--- a/includes/js/dojox/image/Lightbox.js
+++ /dev/null
@@ -1,451 +0,0 @@
-if(!dojo._hasResource["dojox.image.Lightbox"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
-dojo._hasResource["dojox.image.Lightbox"] = true;
-dojo.provide("dojox.image.Lightbox");
-dojo.experimental("dojox.image.Lightbox");
-
-dojo.require("dijit.Dialog");
-dojo.require("dojox.fx._base");
-
-dojo.declare("dojox.image.Lightbox",
- dijit._Widget,{
- // summary:
- // A dojo-based Lightbox implementation.
- //
- // description:
- // An Elegant, keyboard accessible, markup and store capable Lightbox widget to show images
- // in a modal dialog-esque format. Can show individual images as Modal dialog, or can group
- // images with multiple entry points, all using a single "master" Dialog for visualization
- //
- // key controls:
- // ESC - close
- // Down Arrow / Rt Arrow / N - Next Image
- // Up Arrow / Lf Arrow / P - Previous Image
- //
- // example:
- // | <a href="image1.jpg" dojoType="dojox.image.Lightbox">show lightbox</a>
- //
- // example:
- // | <a href="image2.jpg" dojoType="dojox.image.Lightbox" group="one">show group lightbox</a>
- // | <a href="image3.jpg" dojoType="dojox.image.Lightbox" group="one">show group lightbox</a>
- //
- // example:
- // | not implemented fully yet, though works with basic datastore access. need to manually call
- // | widget._attachedDialog.addImage(item,"fromStore") for each item in a store result set.
- // | <div dojoType="dojox.image.Lightbox" group="fromStore" store="storeName"></div>
- //
- // group: String
- // Grouping images in a page with similar tags will provide a 'slideshow' like grouping of images
- group: "",
-
- // title: String
- // A string of text to be shown in the Lightbox beneath the image (empty if using a store)
- title: "",
-
- // href; String
- // Link to image to use for this Lightbox node (empty if using a store).
- href: "",
-
- // duration: Integer
- // Generic time in MS to adjust the feel of widget. could possibly add various
- // durations for the various actions (dialog fadein, sizeing, img fadein ...)
- duration: 500,
-
- // _allowPassthru: Boolean
- // Privately set this to disable/enable natural link of anchor tags
- _allowPassthru: false,
-
- // _attachedDialg: dojox.image._LightboxDialog
- // The pointer to the global lightbox dialog for this widget
- _attachedDialog: null, // try to share a single underlay per page?
-
- startup: function(){
- this.inherited(arguments);
- // setup an attachment to the masterDialog (or create the masterDialog)
- var tmp = dijit.byId('dojoxLightboxDialog');
- if(tmp){
- this._attachedDialog = tmp;
- }else{
- // this is the first instance to start, so we make the masterDialog
- this._attachedDialog = new dojox.image._LightboxDialog({ id: "dojoxLightboxDialog" });
- this._attachedDialog.startup();
- }
- if(!this.store){
- // FIXME: full store support lacking, have to manually call this._attachedDialog.addImage(imgage,group) as it stands
- this._addSelf();
- this.connect(this.domNode, "onclick", "_handleClick");
- }
- },
-
- _addSelf: function(){
- // summary: Add this instance to the master LightBoxDialog
- this._attachedDialog.addImage({
- href: this.href,
- title: this.title
- },this.group||null);
- },
-
- _handleClick: function(/* Event */e){
- // summary: Handle the click on the link
- if(!this._allowPassthru){ e.preventDefault(); }
- else{ return; }
- this.show();
- },
-
- show: function(){
- // summary: Show the Lightbox with this instance as the starting point
- this._attachedDialog.show(this);
- },
-
- disable: function(){
- // summary: Disables event clobbering and dialog, and follows natural link
- this._allowPassthru = true;
- },
-
- enable: function(){
- // summary: Enables the dialog (prevents default link)
- this._allowPassthru = false;
- }
-
-});
-
-dojo.declare("dojox.image._LightboxDialog",
- dijit.Dialog,{
- // summary:
- // The "dialog" shared between any Lightbox instances on the page
- //
- // description:
- //
- // A widget that intercepts anchor links (typically around images)
- // and displays a modal Dialog. this is the actual Dialog, which you can
- // create and populate manually, though should use simple Lightbox's
- // unless you need to direct access.
- //
- // There should only be one of these on a page, so all dojox.image.Lightbox's will us it
- // (the first instance of a Lightbox to be show()'n will create me If i do not exist)
- //
- // title: String
- // The current title, read from object passed to show()
- title: "",
-
- // FIXME: implement titleTemplate
-
- // inGroup: Array
- // Array of objects. this is populated by from the JSON object _groups, and
- // should not be populate manually. it is a placeholder for the currently
- // showing group of images in this master dialog
- inGroup: null,
-
- // imgUrl: String
- // The src="" attribute of our imageNode (can be null at statup)
- imgUrl: "",
-
- // errorMessage: String
- // The text to display when an unreachable image is linked
- errorMessage: "Image not found.",
-
- // adjust: Boolean
- // If true, ensure the image always stays within the viewport
- // more difficult than necessary to disable, but enabled by default
- // seems sane in most use cases.
- adjust: true,
-
- // an object of arrays, each array (of objects) being a unique 'group'
- _groups: { XnoGroupX: [] },
-
- // errorImg: Url
- // Path to the image used when a 404 is encountered
- errorImg: dojo.moduleUrl("dojox.image","resources/images/warning.png"),
-
- // privates:
- _imageReady: false,
- _blankImg: dojo.moduleUrl("dojo","resources/blank.gif"),
- _clone: null, // the "untained" image
- _wasStyled: null, // indicating taint on the imgNode
-
- // animation holders:
- _loadingAnim:null,
- _showImageAnim: null,
- _showNavAnim: null,
- _animConnects: [],
-
- templateString:"<div class=\"dojoxLightbox\" dojoAttachPoint=\"containerNode\">\n\t<div style=\"position:relative\">\n\t\t<div dojoAttachPoint=\"imageContainer\" class=\"dojoxLightboxContainer\">\n\t\t\t<img dojoAttachPoint=\"imgNode\" src=\"${imgUrl}\" class=\"dojoxLightboxImage\" alt=\"${title}\">\n\t\t\t<div class=\"dojoxLightboxFooter\" dojoAttachPoint=\"titleNode\">\n\t\t\t\t<div class=\"dijitInline LightboxClose\" dojoAttachPoint=\"closeNode\"></div>\n\t\t\t\t<div class=\"dijitInline LightboxNext\" dojoAttachPoint=\"nextNode\"></div>\t\n\t\t\t\t<div class=\"dijitInline LightboxPrev\" dojoAttachPoint=\"prevNode\"></div>\n\n\t\t\t\t<div class=\"dojoxLightboxText\"><span dojoAttachPoint=\"textNode\">${title}</span><span dojoAttachPoint=\"groupCount\" class=\"dojoxLightboxGroupText\"></span></div>\n\t\t\t</div>\n\t\t</div>\t\n\t\t\n\t</div>\n</div>\n",
-
- startup: function(){
- // summary: Add some extra event handlers, and startup our superclass.
-
- this.inherited(arguments);
- this._clone = dojo.clone(this.imgNode);
- this.connect(document.documentElement,"onkeypress","_handleKey");
- this.connect(window,"onresize","_position");
- this.connect(this.nextNode, "onclick", "_nextImage");
- this.connect(this.prevNode, "onclick", "_prevImage");
- this.connect(this.closeNode, "onclick", "hide");
- this._makeAnims();
- this._vp = dijit.getViewport();
-
- },
-
- show: function(/* Object */groupData){
- // summary: Show the Master Dialog. Starts the chain of events to show
- // an image in the dialog, including showing the dialog if it is
- // not already visible
- //
- // groupData: Object
- // needs href and title attributes. the values for this image.
-
- var _t = this; // size
-
- // we only need to call dijit.Dialog.show() if we're not already open.
- if(!_t.open){ _t.inherited(arguments); }
-
- if(this._wasStyled){
- // ugly fix for IE being stupid:
- dojo._destroyElement(_t.imgNode);
- _t.imgNode = dojo.clone(_t._clone);
- dojo.place(_t.imgNode,_t.imageContainer,"first");
- _t._makeAnims();
- _t._wasStyled = false;
- }
-
- dojo.style(_t.imgNode,"opacity","0");
- dojo.style(_t.titleNode,"opacity","0");
-
- _t._imageReady = false;
- _t.imgNode.src = groupData.href;
-
- if((groupData.group && groupData !== "XnoGroupX") || _t.inGroup){
- if(!_t.inGroup){
- _t.inGroup = _t._groups[(groupData.group)];
- // determine where we were or are in the show
- dojo.forEach(_t.inGroup,function(g,i){
- if(g.href == groupData.href){
- _t._positionIndex = i;
- }
- },_t);
- }
- if(!_t._positionIndex){
- _t._positionIndex=0;
- _t.imgNode.src = _t.inGroup[_t._positionIndex].href;
- }
- // FIXME: implement titleTemplate
- _t.groupCount.innerHTML = " (" +(_t._positionIndex+1) +" of "+_t.inGroup.length+")";
- _t.prevNode.style.visibility = "visible";
- _t.nextNode.style.visibility = "visible";
- }else{
- // single images don't have buttons, or counters:
- _t.groupCount.innerHTML = "";
- _t.prevNode.style.visibility = "hidden";
- _t.nextNode.style.visibility = "hidden";
- }
- _t.textNode.innerHTML = groupData.title;
-
- if(!_t._imageReady || _t.imgNode.complete === true){
- // connect to the onload of the image
- _t._imgConnect = dojo.connect(_t.imgNode, "onload", _t, function(){
- _t._imageReady = true;
- _t.resizeTo({
- w: _t.imgNode.width,
- h: _t.imgNode.height,
- duration:_t.duration
- });
- // cleanup
- dojo.disconnect(_t._imgConnect);
- if(_t._imgError){ dojo.disconnect(_t._imgError); }
- });
-
- // listen for 404's:
- _t._imgError = dojo.connect(_t.imgNode, "onerror", _t, function(){
- dojo.disconnect(_t._imgError);
- // trigger the above onload with a new src:
- _t.imgNode.src = _t.errorImg;
- _t._imageReady = true;
- _t.textNode.innerHTML = _t.errorMessage;
- });
-
- // onload doesn't fire in IE if you connect before you set the src.
- // hack to re-set the src after onload connection made:
- if(dojo.isIE){ _t.imgNode.src = _t.imgNode.src; }
-
- }else{
- // do it quickly. kind of a hack, but image is ready now
- _t.resizeTo({ w: _t.imgNode.width, h: _t.imgNode.height, duration: 1 });
- }
-
- },
-
- _nextImage: function(){
- // summary: Load next image in group
- if(!this.inGroup){ return; }
- if(this._positionIndex+1<this.inGroup.length){
- this._positionIndex++;
- }else{
- this._positionIndex = 0;
- }
- this._loadImage();
- },
-
- _prevImage: function(){
- // summary: Load previous image in group
-
- if(this.inGroup){
- if(this._positionIndex == 0){
- this._positionIndex = this.inGroup.length - 1;
- }else{
- this._positionIndex--;
- }
- this._loadImage();
- }
- },
-
- _loadImage: function(){
- // summary: Do the prep work before we can show another image
- this._loadingAnim.play(1);
- },
-
- _prepNodes: function(){
- // summary: A localized hook to accompany _loadImage
- this._imageReady = false;
- this.show({
- href: this.inGroup[this._positionIndex].href,
- title: this.inGroup[this._positionIndex].title
- });
- },
-
- resizeTo: function(/* Object */size){
- // summary: Resize our dialog container, and fire _showImage
-
- if(this.adjust && (size.h + 80 > this._vp.h || size.w + 50 > this._vp.w)){
- size = this._scaleToFit(size);
- }
-
- var _sizeAnim = dojox.fx.sizeTo({
- node: this.containerNode,
- duration: size.duration||this.duration,
- width: size.w,
- height: size.h + 30
- });
- this.connect(_sizeAnim,"onEnd","_showImage");
- _sizeAnim.play(15);
- },
-
- _showImage: function(){
- // summary: Fade in the image, and fire showNav
- this._showImageAnim.play(1);
- },
-
- _showNav: function(){
- // summary: Fade in the footer, and setup our connections.
- this._showNavAnim.play(1);
- },
-
- hide: function(){
- // summary: Hide the Master Lightbox
- dojo.fadeOut({node:this.titleNode, duration:200,
- onEnd: dojo.hitch(this,function(){
- // refs #5112 - if you _don't_ change the .src, safari will _never_ fire onload for this image
- this.imgNode.src = this._blankImg;
- })
- }).play(5);
- this.inherited(arguments);
- this.inGroup = null;
- this._positionIndex = null;
- },
-
- addImage: function(child, group){
- // summary: Add an image to this Master Lightbox
- //
- // child: Object
- // The image information to add.
- // href: String - link to image (required)
- // title: String - title to display
- //
- // group: String?
- // attach to group of similar tag or null for individual image instance
- var g = group;
- if(!child.href){ return; }
- if(g){
- if(!this._groups[g]){
- this._groups[g] = [];
- }
- this._groups[g].push(child);
- }else{ this._groups["XnoGroupX"].push(child); }
- },
-
- _handleKey: function(/* Event */e){
- // summary: Handle keyboard navigation internally
- if(!this.open){ return; }
-
- var dk = dojo.keys;
- var key = (e.charCode == dk.SPACE ? dk.SPACE : e.keyCode);
- switch(key){
-
- case dk.ESCAPE: this.hide(); break;
-
- case dk.DOWN_ARROW:
- case dk.RIGHT_ARROW:
- case 78: // key "n"
- this._nextImage(); break;
-
- case dk.UP_ARROW:
- case dk.LEFT_ARROW:
- case 80: // key "p"
- this._prevImage(); break;
- }
- },
-
- _scaleToFit: function(/* Object */size){
- // summary: resize an image to fit within the bounds of the viewport
- // size: Object
- // The 'size' object passed around for this image
- var ns = {};
-
- // one of the dimensions is too big, go with the smaller viewport edge:
- if(this._vp.h > this._vp.w){
- // don't actually touch the edges:
- ns.w = this._vp.w - 70;
- ns.h = ns.w * (size.h / size.w);
- }else{
- // give a little room for the titlenode, too:
- ns.h = this._vp.h - 80;
- ns.w = ns.h * (size.w / size.h);
- }
-
- // trigger the nasty width="auto" workaround in show()
- this._wasStyled = true;
-
- // we actually have to style this image, it's too big
- var s = this.imgNode.style;
- s.height = ns.h + "px";
- s.width = ns.w + "px";
-
- ns.duration = size.duration;
- return ns; // Object
-
- },
-
- _position: function(/* Event */e){
- // summary: we want to know the viewport size any time it changes
- this.inherited(arguments);
- this._vp = dijit.getViewport();
- },
-
- _makeAnims: function(){
- // summary: make and cleanup animation and animation connections
-
- dojo.forEach(this._animConnects,dojo.disconnect);
- this._animConnects = [];
- this._showImageAnim = dojo.fadeIn({
- node: this.imgNode,
- duration: this.duration
- });
- this._animConnects.push(dojo.connect(this._showImageAnim, "onEnd", this, "_showNav"));
- this._loadingAnim = dojo.fx.combine([
- dojo.fadeOut({ node:this.imgNode, duration:175 }),
- dojo.fadeOut({ node:this.titleNode, duration:175 })
- ]);
- this._animConnects.push(dojo.connect(this._loadingAnim, "onEnd", this, "_prepNodes"));
- this._showNavAnim = dojo.fadeIn({ node: this.titleNode, duration:225 });
- }
-});
-
-}
diff --git a/includes/js/dojox/image/Magnifier.js b/includes/js/dojox/image/Magnifier.js
deleted file mode 100644
index b6a3923..0000000
--- a/includes/js/dojox/image/Magnifier.js
+++ /dev/null
@@ -1,75 +0,0 @@
-if(!dojo._hasResource["dojox.image.Magnifier"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
-dojo._hasResource["dojox.image.Magnifier"] = true;
-dojo.provide("dojox.image.Magnifier");
-
-dojo.require("dojox.gfx");
-dojo.require("dojox.image.MagnifierLite");
-
-dojo.declare("dojox.image.Magnifier",
- [dojox.image.MagnifierLite],{
- // summary: Adds magnification on a portion of an image element, using dojox.gfx
- //
- // description: An unobtrusive way to add an unstyled overlay
- // above the srcNode image element. The overlay/glass is a
- // scaled version of the src image (so larger images sized down
- // are clearer).
- //
- // over-ride the _createGlass method to create your custom surface,
- // being sure to create an img node on that surface.
-
- _createGlass: function(){
- // summary: create the glassNode, and an img on a dojox.gfx surface
-
- // images are hard to make into workable templates, so just add outer overlay
- // and skip using dijit._Templated
- this.glassNode = dojo.doc.createElement('div');
- this.surfaceNode = this.glassNode.appendChild(dojo.doc.createElement('div'));
-
- dojo.addClass(this.glassNode,"glassNode");
- dojo.body().appendChild(this.glassNode);
-
- with(this.glassNode.style){
- height = this.glassSize + "px";
- width = this.glassSize + "px";
- }
-
- this.surface = dojox.gfx.createSurface(this.surfaceNode, this.glassSize, this.glassSize);
- this.img = this.surface.createImage({
- src:this.domNode.src,
- width:this._zoomSize.w,
- height:this._zoomSize.h
- });
-
- },
-
- _placeGlass: function(e){
- // summary: position the overlay centered under the cursor
- var x = e.pageX - 2;
- var y = e.pageY - 2 ;
- var xMax = this.offset.x + this.offset.w + 2;
- var yMax = this.offset.y + this.offset.h + 2;
-
- // with svg, our mouseout connection to the image surface doesn't
- // fire, so we'r have to manually calculate offsets
- if(x<this.offset.x || y<this.offset.y || x>xMax || y>yMax){
- this._hideGlass();
- }else{
- this.inherited(arguments);
- }
- },
-
- _setImage: function(e){
- // summary: set the image's offset in the clipping window relative to the mouse position
-
- var xOff = (e.pageX - this.offset.l) / this.offset.w;
- var yOff = (e.pageY - this.offset.t) / this.offset.h;
- var x = (this._zoomSize.w * xOff * -1)+(this.glassSize*xOff);
- var y = (this._zoomSize.h * yOff * -1)+(this.glassSize*yOff);
- // set the image offset
- this.img.setShape({ x: x, y:y });
-
- }
-
-});
-
-}
diff --git a/includes/js/dojox/image/MagnifierLite.js b/includes/js/dojox/image/MagnifierLite.js
deleted file mode 100644
index 2e37340..0000000
--- a/includes/js/dojox/image/MagnifierLite.js
+++ /dev/null
@@ -1,126 +0,0 @@
-if(!dojo._hasResource["dojox.image.MagnifierLite"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
-dojo._hasResource["dojox.image.MagnifierLite"] = true;
-dojo.provide("dojox.image.MagnifierLite");
-dojo.experimental("dojox.image.MagnifierLite");
-
-dojo.require("dijit._Widget");
-
-dojo.declare("dojox.image.MagnifierLite",
- [dijit._Widget],{
- // summary: Adds magnification on a portion of an image element
- //
- // description: An unobtrusive way to add an unstyled overlay
- // above the srcNode image element. The overlay/glass is a
- // scaled version of the src image (so larger images sized down
- // are clearer).
- //
- // The logic behind requiring the src image to be large is
- // "it's going to be downloaded, anyway" so this method avoids
- // having to make thumbnails and 2 http requests among other things.
- //
- // glassSize: Int
- // the width and height of the bounding box
- glassSize: 125,
-
- // scale: Decimal
- // the multiplier of the Mangification.
- scale: 6,
-
- postCreate: function(){
- this.inherited(arguments);
-
- // images are hard to make into workable templates, so just add outer overlay
- // and skip using dijit._Templated
- this._adjustScale();
- this._createGlass();
-
- this.connect(this.domNode,"onmouseenter","_showGlass");
- this.connect(this.glassNode,"onmousemove","_placeGlass");
- this.connect(this.img,"onmouseout","_hideGlass");
-
- // when position of domNode changes, _adjustScale needs to run.
- // window.resize isn't it always, FIXME:
- this.connect(window,"onresize","_adjustScale");
-
- },
-
- _createGlass: function(){
- // summary: make img and glassNode elements as children of the body
-
- this.glassNode = dojo.doc.createElement('div');
- this.surfaceNode = this.glassNode.appendChild(dojo.doc.createElement('div'));
- dojo.addClass(this.glassNode,"glassNode");
- dojo.body().appendChild(this.glassNode);
- with(this.glassNode.style){
- height = this.glassSize + "px";
- width = this.glassSize + "px";
- }
-
- this.img = dojo.doc.createElement('img');
- this.glassNode.appendChild(this.img);
- this.img.src = this.domNode.src;
- // float the image around inside the .glassNode
- with(this.img.style){
- position = "relative";
- top = 0; left = 0;
- width = this._zoomSize.w+"px";
- height = this._zoomSize.h+"px";
- }
-
- },
-
- _adjustScale: function(){
- // summary: update the calculations should this.scale change
-
- this.offset = dojo.coords(this.domNode,true);
- this._imageSize = { w: this.offset.w, h:this.offset.h };
- this._zoomSize = {
- w: this._imageSize.w * this.scale,
- h: this._imageSize.h * this.scale
- };
- },
-
- _showGlass: function(e){
- // summary: show the overlay
- this._placeGlass(e);
- with(this.glassNode.style){
- visibility = "visible";
- display = "";
- }
-
- },
-
- _hideGlass: function(e){
- // summary: hide the overlay
- this.glassNode.style.visibility = "hidden";
- this.glassNode.style.display = "none";
- },
-
- _placeGlass: function(e){
- // summary: position the overlay centered under the cursor
-
- this._setImage(e);
- var t = Math.floor(e.pageY - (this.glassSize/2));
- var l = Math.floor(e.pageX - (this.glassSize/2));
- dojo.style(this.glassNode,"top",t);
- dojo.style(this.glassNode,"left",l);
-
- },
-
- _setImage: function(e){
- // summary: set the image's offset in the clipping window relative to the mouse position
-
- var xOff = (e.pageX - this.offset.l) / this.offset.w;
- var yOff = (e.pageY - this.offset.t) / this.offset.h;
- var x = (this._zoomSize.w * xOff * -1)+(this.glassSize*xOff);
- var y = (this._zoomSize.h * yOff * -1)+(this.glassSize*yOff);
- with(this.img.style){
- top = y+"px";
- left = x+"px";
- }
-
- }
-
-});
-
-}
diff --git a/includes/js/dojox/image/README b/includes/js/dojox/image/README
deleted file mode 100644
index 38e9c3d..0000000
--- a/includes/js/dojox/image/README
+++ /dev/null
@@ -1,66 +0,0 @@
--------------------------------------------------------------------------------
-dojox.image
--------------------------------------------------------------------------------
-Version 1.0
-Release date: 10/31/07
--------------------------------------------------------------------------------
-Project state:
-prototype | experimental
--------------------------------------------------------------------------------
-Credits
- Peter Higgins (dante)
- Shane O'Sullivan (shaneosullivan1@gmail.com)
--------------------------------------------------------------------------------
-Project description
-
- A class to provide a common API for images, and home for image
- related Widgets.
-
--------------------------------------------------------------------------------
-Dependencies:
-
- LightBox: dojo core, dojox.fx and optionally dojox.data. uses
- either tundra or soria theme, no standalone icons.
-
- SlideShow: dojo core, dojo.fx, and dojo.data (optional
- dojox.data store implementations apply)
-
- ThumbNailPicker: dojo core, dojo.fx and dojo.data. Combined
- with a SlideShow, creates a sample Gallery app.
-
- Gallery: core, dojox.image.SlideShow, dojox.image.ThumbNailPicker
-
- Magnifier: dojo core, dijit._Widget, dojox.gfx
-
--------------------------------------------------------------------------------
-Documentation
-
--------------------------------------------------------------------------------
-Installation instructions
-
-Grab the following from the Dojo SVN Repository:
-http://svn.dojotoolkit.org/dojo/dojox/trunk/image/*
-
-Install into the following directory structure:
-/dojox/image/
-
-...which should be at the same level as your Dojo checkout.
--------------------------------------------------------------------------------
-Additional Notes
-
- LightBox: currently works as individual items, and grouped items,
- but usage of dojo.data is broken (atm). the API is subject to
- change, and is marked accordingly.
-
- Hoping to implement: Carossel, and Reflect using
- a common API provided by dojox.image.Pane (?)
-
- SlideShow: Shows an image, one by one, from a datastore. Acts
- as standing ImagePane implementation,
-
- Gallery: A combination Thumbnail view and SlideShow, using
- a datastore, and providing navigation, and common API.
-
- Magnifier: Unobtrusive way to attach a hovering window window
- when moving the mouse over an image. The window shows a a zoomed
- version of the original source. (experimental)
diff --git a/includes/js/dojox/image/SlideShow.js b/includes/js/dojox/image/SlideShow.js
deleted file mode 100644
index 4767cf1..0000000
--- a/includes/js/dojox/image/SlideShow.js
+++ /dev/null
@@ -1,598 +0,0 @@
-if(!dojo._hasResource["dojox.image.SlideShow"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
-dojo._hasResource["dojox.image.SlideShow"] = true;
-dojo.provide("dojox.image.SlideShow");
-//
-// dojox.image.SlideShow courtesy Shane O Sullivan, licensed under a Dojo CLA
-// For a sample usage, see http://www.skynet.ie/~sos/photos.php
-//
-// @author Copyright 2007 Shane O Sullivan (shaneosullivan1@gmail.com)
-//
-// TODO: more cleanups
-//
-dojo.require("dojo.string");
-dojo.require("dojo.fx");
-dojo.require("dijit._Widget");
-dojo.require("dijit._Templated");
-
-dojo.declare("dojox.image.SlideShow",
- [dijit._Widget, dijit._Templated],
- {
- // summary: A Slideshow Widget
-
- // imageHeight: Number
- // The maximum height of an image
- imageHeight: 375,
-
- // imageWidth: Number
- // The maximum width of an image.
- imageWidth: 500,
-
- // title: String
- // the initial title of the SlideShow
- title: "",
-
- // titleTemplate: String
- // a way to customize the wording in the title. supported parameters to be populated are:
- // ${title} = the passed title of the image
- // ${current} = the current index of the image
- // ${total} = the total number of images in the SlideShow
- //
- // should add more?
- titleTemplate: '${title} <span class="slideShowCounterText">(${current} of ${total})</span>',
-
- // noLink: Boolean
- // Prevents the slideshow from putting an anchor link around the displayed image
- // enables if true, though still will not link in absence of a url to link to
- noLink: false,
-
- // loop: Boolean
- // true/false - make the slideshow loop
- loop: true,
-
- // hasNav: Boolean
- // toggle to enable/disable the visual navigation controls
- hasNav: true,
-
- // images: Array
- // Contains the DOM nodes that individual images are stored in when loaded or loading.
- images: [],
-
- // pageSize: Number
- // The number of images to request each time.
- pageSize: 20,
-
- // autoLoad: Boolean
- // If true, then images are preloaded, before the user navigates to view them.
- // If false, an image is not loaded until the user views it.
- autoLoad: true,
-
- // autoStart: Boolean
- // If true, the SlideShow begins playing immediately
- autoStart: false,
-
- // fixedHeight: Boolean
- // If true, the widget does not resize itself to fix the displayed image.
- fixedHeight: false,
-
- // imageStore: Object
- // Implementation of the dojo.data.api.Read API, which provides data on the images
- // to be displayed.
- imageStore: null,
-
- // linkAttr: String
- // Defines the name of the attribute to request from the store to retrieve the
- // URL to link to from an image, if any.
- linkAttr: "link",
-
- // imageLargeAttr: String
- // Defines the name of the attribute to request from the store to retrieve the
- // URL to the image.
- imageLargeAttr: "imageUrl",
-
- // titleAttr: String
- // Defines the name of the attribute to request from the store to retrieve the
- // title of the picture, if any.
- titleAttr: "title",
-
- // slideshowInterval: Number
- // Time, in seconds, between image transitions during a slideshow.
- slideshowInterval: 3,
-
- templateString:"<div dojoAttachPoint=\"outerNode\" class=\"slideShowWrapper\">\n\t<div style=\"position:relative;\" dojoAttachPoint=\"innerWrapper\">\n\t\t<div class=\"slideShowNav\" dojoAttachEvent=\"onclick: _handleClick\">\n\t\t\t<div class=\"dijitInline slideShowTitle\" dojoAttachPoint=\"titleNode\">${title}</div>\n\t\t</div>\n\t\t<div dojoAttachPoint=\"navNode\" class=\"slideShowCtrl\" dojoAttachEvent=\"onclick: _handleClick\">\n\t\t\t<span dojoAttachPoint=\"navPrev\" class=\"slideShowCtrlPrev\"></span>\n\t\t\t<span dojoAttachPoint=\"navPlay\" class=\"slideShowCtrlPlay\"></span>\n\t\t\t<span dojoAttachPoint=\"navNext\" class=\"slideShowCtrlNext\"></span>\n\t\t</div>\n\t\t<div dojoAttachPoint=\"largeNode\" class=\"slideShowImageWrapper\"></div>\t\t\n\t\t<div dojoAttachPoint=\"hiddenNode\" class=\"slideShowHidden\"></div>\n\t</div>\n</div>\n",
-
- // _tempImgPath: URL
- // URL to the image to display when an image is not yet fully loaded.
- _tempImgPath: dojo.moduleUrl("dojo", "resources/blank.gif"),
-
- // _imageCounter: Number
- // A counter to keep track of which index image is to be loaded next
- _imageCounter: 0,
-
- // _tmpImage: DomNode
- // The temporary image to show when a picture is loading.
- _tmpImage: null,
-
- // _request: Object
- // Implementation of the dojo.data.api.Request API, which defines the query
- // parameters for accessing the store.
- _request: null,
-
- postCreate: function(){
- // summary: Initilizes the widget, sets up listeners and shows the first image
- this.inherited(arguments);
- var img = document.createElement("img");
-
- // FIXME: should API be to normalize an image to fit in the specified height/width?
- img.setAttribute("width", this.imageWidth);
- img.setAttribute("height", this.imageHeight);
-
- if(this.hasNav){
- dojo.connect(this.outerNode, "onmouseover", function(evt){
- try{_this._showNav();}
- catch(e){} //TODO: remove try/catch
- });
- dojo.connect(this.outerNode, "onmouseout", function(evt){
- try{_this._hideNav(evt);}
- catch(e){} //TODO: remove try/catch
- });
- }
-
- this.outerNode.style.width = this.imageWidth + "px";
-
- img.setAttribute("src", this._tempImgPath);
- var _this = this;
-
- this.largeNode.appendChild(img);
- this._tmpImage = this._currentImage = img;
- this._fitSize(true);
-
- this._loadImage(0, function(){
- _this.showImage(0);
- });
- this._calcNavDimensions();
- },
-
- setDataStore: function(dataStore, request, /*optional*/paramNames){
- // summary: Sets the data store and request objects to read data from.
- // dataStore:
- // An implementation of the dojo.data.api.Read API. This accesses the image
- // data.
- // request:
- // An implementation of the dojo.data.api.Request API. This specifies the
- // query and paging information to be used by the data store
- // paramNames:
- // An object defining the names of the item attributes to fetch from the
- // data store. The three attributes allowed are 'linkAttr', 'imageLargeAttr' and 'titleAttr'
- this.reset();
- var _this = this;
-
- this._request = {
- query: {},
- start: request.start || 0,
- count: request.count || this.pageSize,
- onBegin: function(count, request){
- _this.maxPhotos = count;
- }
- };
- if(request.query){ dojo.mixin(this._request.query, request.query); }
- if(paramNames){
- dojo.forEach(["imageLargeAttr", "linkAttr", "titleAttr"], function(attrName){
- if(paramNames[attrName]){ this[attrName] = paramNames[attrName]; }
- }, this);
- }
-
- var _complete = function(items){
- _this.showImage(0);
- _this._request.onComplete = null;
- if(_this.autoStart){
- _this.toggleSlideShow();
- }
- };
-
- this.imageStore = dataStore;
- this._request.onComplete = _complete;
- this._request.start = 0;
- this.imageStore.fetch(this._request);
- },
-
- reset: function(){
- // summary: Resets the widget to its initial state
- // description: Removes all previously loaded images, and clears all caches.
- while(this.largeNode.firstChild){
- this.largeNode.removeChild(this.largeNode.firstChild);
- }
- this.largeNode.appendChild(this._tmpImage);
- while(this.hiddenNode.firstChild){
- this.hiddenNode.removeChild(this.hiddenNode.firstChild);
- }
- dojo.forEach(this.images, function(img){
- if(img && img.parentNode){ img.parentNode.removeChild(img); }
- });
- this.images = [];
- this.isInitialized = false;
- this._imageCounter = 0;
- },
-
- isImageLoaded: function(index){
- // summary: Returns true if image at the specified index is loaded, false otherwise.
- // index:
- // The number index in the data store to check if it is loaded.
- return this.images && this.images.length > index && this.images[index];
- },
-
- moveImageLoadingPointer: function(index){
- // summary: If 'autoload' is true, this tells the widget to start loading
- // images from the specified pointer.
- // index:
- // The number index in the data store to start loading images from.
- this._imageCounter = index;
- },
-
- destroy: function(){
- // summary: Cleans up the widget when it is being destroyed
- if(this._slideId) { this._stop(); }
- this.inherited(arguments);
- },
-
- showNextImage: function(inTimer, forceLoop){
- // summary: Changes the image being displayed to the next image in the data store
- // inTimer: Boolean
- // If true, a slideshow is active, otherwise the slideshow is inactive.
- if(inTimer && this._timerCancelled){return false;}
-
- if(this.imageIndex + 1 >= this.maxPhotos){
- if(inTimer && (this.loop || forceLoop)){ this.imageIndex = -1; }
- else{
- if(this._slideId){ this._stop(); }
- return false;
- }
- }
- var _this = this;
- this.showImage(this.imageIndex + 1, function(){
- if(inTimer){ _this._startTimer(); }
- });
- return true;
- },
-
- toggleSlideShow: function(){
- // summary: Switches the slideshow mode on and off.
- if(this._slideId){
- this._stop();
- }else{
- dojo.toggleClass(this.domNode,"slideShowPaused");
- this._timerCancelled = false;
- var success = this.showNextImage(true, true);
- if(!success){
- this._stop();
- }
- }
- },
-
- getShowTopicName: function(){
- // summary: Returns the topic id published to when an image is shown
- // description:
- // The information published is: index, title and url
- return (this.widgetId || this.id) + "/imageShow";
- },
-
- getLoadTopicName: function(){
- // summary: Returns the topic id published to when an image finishes loading.
- // description:
- // The information published is the index position of the image loaded.
- return (this.widgetId ? this.widgetId : this.id) + "/imageLoad";
- },
-
- showImage: function(index, /* Function? */callback){
- // summary: Shows the image at index 'index'.
- // index: Number
- // The position of the image in the data store to display
- // callback: Function
- // Optional callback function to call when the image has finished displaying.
-
- if(!callback && this._slideId){ this.toggleSlideShow(); }
- var _this = this;
- var current = this.largeNode.getElementsByTagName("div");
- this.imageIndex = index;
-
- var showOrLoadIt = function() {
- //If the image is already loaded, then show it.
- if(_this.images[index]){
- while(_this.largeNode.firstChild){
- _this.largeNode.removeChild(_this.largeNode.firstChild);
- }
- _this.images[index].style.opacity = 0;
- _this.largeNode.appendChild(_this.images[index]);
- _this._currentImage = _this.images[index]._img;
- _this._fitSize();
-
- var onEnd = function(a,b,c) {
- var img = _this.images[index].firstChild;
- if(img.tagName.toLowerCase() != "img"){img = img.firstChild;}
- title = img.getAttribute("title");
-
- if(_this._navShowing){
- _this._showNav(true);
- }
- dojo.publish(_this.getShowTopicName(), [{
- index: index,
- title: title,
- url: img.getAttribute("src")
- }]);
- if(callback) { callback(a,b,c); }
- _this._setTitle(title);
- };
-
- dojo.fadeIn({
- node: _this.images[index],
- duration: 300,
- onEnd: onEnd
- }).play();
- }else{
- //If the image is not loaded yet, load it first, then show it.
- _this._loadImage(index, function(){
- dojo.publish(_this.getLoadTopicName(), [index]);
- _this.showImage(index, callback);
- });
- }
- };
-
- //If an image is currently showing, fade it out, then show
- //the new image. Otherwise, just show the new image.
- if(current && current.length > 0){
- dojo.fadeOut({
- node: current[0],
- duration: 300,
- onEnd: function(){
- _this.hiddenNode.appendChild(current[0]);
- showOrLoadIt();
- }
- }).play();
- }else{
- showOrLoadIt();
- }
- },
-
- _fitSize: function(force){
- // summary: Fits the widget size to the size of the image being shown,
- // or centers the image, depending on the value of 'fixedHeight'
- // force: Boolean
- // If true, the widget is always resized, regardless of the value of 'fixedHeight'
- if(!this.fixedHeight || force){
- var height = (this._currentImage.height + (this.hasNav ? 20:0));
- dojo.style(this.innerWrapper, "height", height + "px");
- return;
- }
- dojo.style(this.largeNode, "paddingTop", this._getTopPadding() + "px");
- },
-
- _getTopPadding: function(){
- if(!this.fixedHeight){return 0;}
- // summary: Returns the padding to place at the top of the image to center it vertically.
- return (this.imageHeight - this._currentImage.height)/2;
- },
-
- _loadNextImage: function(){
- //summary: Load the next unloaded image.
- if(!this.autoLoad){ return; }
- while(this.images.length >= this._imageCounter && this.images[this._imageCounter]){
- this._imageCounter++;
- }
- this._loadImage(this._imageCounter);
- },
-
- _loadImage: function(index, callbackFn){
- // summary: Load image at specified index
- // description:
- // This function loads the image at position 'index' into the
- // internal cache of images. This does not cause the image to be displayed.
- // index:
- // The position in the data store to load an image from.
- // callbackFn:
- // An optional function to execute when the image has finished loading.
- if(this.images[index] || !this._request) { return; }
-
- var pageStart = index - (index % this.pageSize);
-
- this._request.start = pageStart;
-
- this._request.onComplete = function(items){
- var diff = index - pageStart;
- if(items && items.length > diff){
- loadIt(items[diff]);
- }else{ /* Squelch - console.log("Got an empty set of items"); */ }
- }
-
- var _this = this;
- var loadIt = function(item){
- var url = _this.imageStore.getValue(item, _this.imageLargeAttr);
- var img = document.createElement("img");
- var div = document.createElement("div");
- div._img = img;
-
- var link = _this.imageStore.getValue(item,_this.linkAttr);
- if(!link || _this.noLink){ div.appendChild(img);
- }else{
- var a = document.createElement("a");
- a.setAttribute("href", link);
- a.setAttribute("target","_blank");
- div.appendChild(a);
- a.appendChild(img);
- }
-
- div.setAttribute("id",_this.id + "_imageDiv" + index);
- dojo.connect(img, "onload", function(){
- _this._fitImage(img);
- div.setAttribute("width",_this.imageWidth);
- div.setAttribute("height",_this.imageHeight);
-
- dojo.publish(_this.getLoadTopicName(), [index]);
- _this._loadNextImage();
- if(callbackFn){ callbackFn(); }
- });
- _this.hiddenNode.appendChild(div);
-
- var titleDiv = document.createElement("div");
- dojo.addClass(titleDiv, "slideShowTitle");
- div.appendChild(titleDiv);
-
- _this.images[index] = div;
- img.setAttribute("src", url);
-
- var title = _this.imageStore.getValue(item,_this.titleAttr);
- if(title){ img.setAttribute("title",title); }
- }
- this.imageStore.fetch(this._request);
- },
-
- _stop: function(){
- // summary: Stops a running slide show.
- if(this._slideId){ clearTimeout(this._slideId); }
- this._slideId = null;
- this._timerCancelled = true;
- dojo.removeClass(this.domNode,"slideShowPaused");
- },
-
- _prev: function(){
- // summary: Show the previous image.
- // FIXME: either pull code from showNext/prev, or call it here
- if(this.imageIndex < 1){ return; }
- this.showImage(this.imageIndex - 1);
- },
-
- _next: function(){
- // summary: Show the next image
- this.showNextImage();
- },
-
- _startTimer: function(){
- // summary: Starts a timeout to show the next image when a slide show is active
- var id = this.id;
- this._slideId = setTimeout(function(){dijit.byId(id).showNextImage(true);}, this.slideshowInterval * 1000);
- },
-
- _calcNavDimensions: function() {
- // summary:
- // Calculates the dimensions of the navigation controls
- dojo.style(this.navNode, "position", "absolute");
-
- //Place the navigation controls far off screen
- dojo.style(this.navNode, "top", "-10000px");
-
- //Make the navigation controls visible
- dojo._setOpacity(this.navNode, 99);
-
- this.navPlay._size = dojo.marginBox(this.navPlay);
- this.navPrev._size = dojo.marginBox(this.navPrev);
- this.navNext._size = dojo.marginBox(this.navNext);
-
- dojo._setOpacity(this.navNode, 0);
- dojo.style(this.navNode, "position", "");
- dojo.style(this.navNode, "top", "");
- },
-
- _setTitle: function(title){
- // summary: Sets the title of the image to be displayed
- // title: String
- // The String title of the image
- this.titleNode.innerHTML = dojo.string.substitute(this.titleTemplate,
- { title: title, current: 1 + this.imageIndex, total: this.maxPhotos});
- },
-
- _fitImage: function(img) {
- // summary: Ensures that the image width and height do not exceed the maximum.
- // img: Node
- // The image DOM node to optionally resize
- var width = img.width;
- var height = img.height;
-
- if(width > this.imageWidth){
- height = Math.floor(height * (this.imageWidth / width));
- img.setAttribute("height", height + "px");
- img.setAttribute("width", this.imageWidth + "px");
- }
- if(height > this.imageHeight){
- width = Math.floor(width * (this.imageHeight / height));
- img.setAttribute("height", this.imageHeight + "px");
- img.setAttribute("width", width + "px");
- }
- },
-
- _handleClick: function(/* Event */e){
- // summary: Performs navigation on the images based on users mouse clicks
- // e:
- // An Event object
- switch(e.target){
- case this.navNext:this._next(); break;
- case this.navPrev:this._prev(); break;
- case this.navPlay:this.toggleSlideShow(); break;
- }
- },
-
- _showNav: function(force){
- // summary:
- // Shows the navigation controls
- // force: Boolean
- // If true, the navigation controls are repositioned even if they are
- // currently visible.
- if(this._navShowing && !force){return;}
- dojo.style(this.navNode, "marginTop", "0px");
- dojo.style(this.navPlay, "marginLeft", "0px");
- var wrapperSize = dojo.marginBox(this.outerNode);
-
- var margin = this._currentImage.height - this.navPlay._size.h - 10 + this._getTopPadding();
-
- if(margin > this._currentImage.height){margin += 10;}
- dojo[this.imageIndex < 1 ? "addClass":"removeClass"](this.navPrev, "slideShowCtrlHide");
- dojo[this.imageIndex + 1 >= this.maxPhotos ? "addClass":"removeClass"](this.navNext, "slideShowCtrlHide");
-
- var _this = this;
- if(this._navAnim) {
- this._navAnim.stop();
- }
- if(this._navShowing){return;}
- this._navAnim = dojo.fadeIn({node: this.navNode, duration: 300,
- onEnd: function(){_this._navAnim=null;}});
-
- this._navAnim.play();
- this._navShowing = true;
- },
-
- _hideNav: function(/* Event */e){
- // summary: Hides the navigation controls
- // e: Event
- // The DOM Event that triggered this function
- if(!e || !this._overElement(this.outerNode, e)) {
- var _this = this;
- if(this._navAnim) {
- this._navAnim.stop();
- }
- this._navAnim = dojo.fadeOut({node: this.navNode,duration:300,
- onEnd: function(){_this._navAnim=null;}});
- this._navAnim.play();
- this._navShowing = false;
- }
- },
-
- _overElement: function(/*DomNode*/element, /*Event*/e){
- // summary:
- // Returns whether the mouse is over the passed element.
- // Element must be display:block (ie, not a <span>)
-
- //When the page is unloading, if this method runs it will throw an
- //exception.
- if(typeof(dojo)=="undefined"){return false;}
- element = dojo.byId(element);
- var m = {x: e.pageX, y: e.pageY};
- var bb = dojo._getBorderBox(element);
- var absl = dojo.coords(element, true);
- var left = absl.x;
-
- return (m.x >= left
- && m.x <= (left + bb.w)
- && m.y >= absl.y
- && m.y <= (top + bb.h)
- ); // boolean
- }
-});
-
-}
diff --git a/includes/js/dojox/image/ThumbnailPicker.js b/includes/js/dojox/image/ThumbnailPicker.js
deleted file mode 100644
index 42f9862..0000000
--- a/includes/js/dojox/image/ThumbnailPicker.js
+++ /dev/null
@@ -1,535 +0,0 @@
-if(!dojo._hasResource["dojox.image.ThumbnailPicker"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
-dojo._hasResource["dojox.image.ThumbnailPicker"] = true;
-dojo.provide("dojox.image.ThumbnailPicker");
-dojo.experimental("dojox.image.ThumbnailPicker");
-//
-// dojox.image.ThumbnailPicker courtesy Shane O Sullivan, licensed under a Dojo CLA
-// @author Copyright 2007 Shane O Sullivan (shaneosullivan1@gmail.com)
-//
-// For a sample usage, see http://www.skynet.ie/~sos/photos.php
-//
-// document topics.
-
-dojo.require("dojo.fx");
-dojo.require("dijit._Widget");
-dojo.require("dijit._Templated");
-
-dojo.declare("dojox.image.ThumbnailPicker",
- [dijit._Widget, dijit._Templated],
- {
- // summary: A scrolling Thumbnail Picker widget
- //
- // imageStore: Object
- // A data store that implements the dojo.data Read API.
- imageStore: null,
-
- // request: Object
- // A dojo.data Read API Request object.
- request: null,
-
- // size: Number
- // Width or height in pixels, depending if horizontal or vertical.
- size: 500, //FIXME: use CSS?
-
- // thumbHeight: Number
- // Default height of a thumbnail image
- thumbHeight: 75, // FIXME: use CSS?
-
- // thumbWidth: Number
- // Default width of an image
- thumbWidth: 100, // FIXME: use CSS?
-
- // useLoadNotifier: Boolean
- // Setting useLoadNotifier to true makes a colored DIV appear under each
- // thumbnail image, which is used to display the loading status of each
- // image in the data store.
- useLoadNotifier: false,
-
- // useHyperlink: boolean
- // Setting useHyperlink to true causes a click on a thumbnail to open a link.
- useHyperlink: false,
-
- // hyperlinkTarget: String
- // If hyperlinkTarget is set to "new", clicking on a thumb will open a new window
- // If it is set to anything else, clicking a thumbnail will open the url in the
- // current window.
- hyperlinkTarget: "new",
-
- // isClickable: Boolean
- // When set to true, the cursor over a thumbnail changes.
- isClickable: true,
-
- // isScrollable: Boolean
- // When true, uses smoothScroll to move between pages
- isScrollable: true,
-
- // isHorizontal: Boolean
- // If true, the thumbnails are displayed horizontally. Otherwise they are displayed
- // vertically
- isHorizontal: true,
-
- //autoLoad: Boolean
- autoLoad: true,
-
- // linkAttr: String
- // The attribute name for accessing the url from the data store
- linkAttr: "link",
-
- // imageThumbAttr: String
- // The attribute name for accessing the thumbnail image url from the data store
- imageThumbAttr: "imageUrlThumb",
-
- // imageLargeAttr: String
- // The attribute name for accessing the large image url from the data store
- imageLargeAttr: "imageUrl",
-
- // pageSize: Number
- // The number of images to request each time.
- pageSize: 20,
-
- // titleAttr: String
- // The attribute name for accessing the title from the data store
- titleAttr: "title",
-
- templateString:"<div dojoAttachPoint=\"outerNode\" class=\"thumbOuter\">\n\t<div dojoAttachPoint=\"navPrev\" class=\"thumbNav thumbClickable\">\n\t <img src=\"\" dojoAttachPoint=\"navPrevImg\"/> \n\t</div>\n\t<div dojoAttachPoint=\"thumbScroller\" class=\"thumbScroller\">\n\t <div dojoAttachPoint=\"thumbsNode\" class=\"thumbWrapper\"></div>\n\t</div>\n\t<div dojoAttachPoint=\"navNext\" class=\"thumbNav thumbClickable\">\n\t <img src=\"\" dojoAttachPoint=\"navNextImg\"/> \n\t</div>\n</div>\n",
- tempImgPath: dojo.moduleUrl("dojo", "resources/blank.gif"),
-
- // thumbs: Array
- // Stores the image nodes for the thumbnails.
- _thumbs: [],
-
- // _thumbIndex: Number
- // The index of the first thumbnail shown
- _thumbIndex: 0,
-
- // _maxPhotos: Number
- // The total number of photos in the image store
- _maxPhotos: 0,
-
- // _loadedImages: Object
- // Stores the indices of images that have been marked as loaded using the
- // markImageLoaded function.
- _loadedImages: {},
-
- postCreate: function(){
- // summary: Initializes styles and listeners
- this.widgetid = this.id;
- this.inherited(arguments);
- this.pageSize = Number(this.pageSize);
-
- this._scrollerSize = this.size - (51 * 2);
-
- var sizeProp = this._sizeProperty = this.isHorizontal ? "width" : "height";
-
- // FIXME: do this via css? calculate the correct width for the widget
- dojo.style(this.outerNode, "textAlign","center");
- dojo.style(this.outerNode, sizeProp, this.size+"px");
-
- dojo.style(this.thumbScroller, sizeProp, this._scrollerSize + "px");
-
- //If useHyperlink is true, then listen for a click on a thumbnail, and
- //open the link
- if(this.useHyperlink){
- dojo.subscribe(this.getClickTopicName(), this, function(packet){
- var index = packet.index;
- var url = this.imageStore.getValue(packet.data,this.linkAttr);
-
- //If the data item doesn't contain a URL, do nothing
- if(!url){return;}
-
- if(this.hyperlinkTarget == "new"){
- window.open(url);
- }else{
- window.location = url;
- }
- });
- }
-
- if(this.isScrollable) {
- // FIXME: does this break builds or anything?
- dojo.require("dojox.fx.scroll");
- dojo.require("dojox.fx.easing");
- }
- if(this.isClickable){
- dojo.addClass(this.thumbsNode, "thumbClickable");
- }
- this._totalSize = 0;
- this.init();
- },
-
- init: function(){
- // summary: Creates DOM nodes for thumbnail images and initializes their listeners
- if(this.isInitialized) {return false;}
-
- var classExt = this.isHorizontal ? "Horiz" : "Vert";
-
- // FIXME: can we setup a listener around the whole element and determine based on e.target?
- dojo.addClass(this.navPrev, "prev" + classExt);
- dojo.addClass(this.navNext, "next" + classExt);
- dojo.addClass(this.thumbsNode, "thumb"+classExt);
- dojo.addClass(this.outerNode, "thumb"+classExt);
-
- this.navNextImg.setAttribute("src", this.tempImgPath);
- this.navPrevImg.setAttribute("src", this.tempImgPath);
-
- this.connect(this.navPrev, "onclick", "_prev");
- this.connect(this.navNext, "onclick", "_next");
- this.isInitialized = true;
-
- if(this.isHorizontal){
- this._offsetAttr = "offsetLeft";
- this._sizeAttr = "offsetWidth";
- this._scrollAttr = "scrollLeft";
- }else{
- this._offsetAttr = "offsetTop";
- this._sizeAttr = "offsetHeight";
- this._scrollAttr = "scrollTop";
- }
-
- this._updateNavControls();
- if(this.imageStore && this.request){this._loadNextPage();}
- return true;
- },
-
- getClickTopicName: function(){
- // summary: Returns the name of the dojo topic that can be
- // subscribed to in order to receive notifications on
- // which thumbnail was selected.
- return (this.widgetId || this.id) + "/select"; // String
- },
-
- getShowTopicName: function(){
- // summary: Returns the name of the dojo topic that can be
- // subscribed to in order to receive notifications on
- // which thumbnail is now visible
- return (this.widgetId || this.id) + "/show"; // String
- },
-
- setDataStore: function(dataStore, request, /*optional*/paramNames){
- // summary: Sets the data store and request objects to read data from.
- // dataStore:
- // An implementation of the dojo.data.api.Read API. This accesses the image
- // data.
- // request:
- // An implementation of the dojo.data.api.Request API. This specifies the
- // query and paging information to be used by the data store
- // paramNames:
- // An object defining the names of the item attributes to fetch from the
- // data store. The four attributes allowed are 'linkAttr', 'imageLargeAttr',
- // 'imageThumbAttr' and 'titleAttr'
- this.reset();
-
- this.request = {
- query: {},
- start: request.start || 0,
- count: request.count || 10,
- onBegin: dojo.hitch(this, function(total){
- this._maxPhotos = total;
- })
- };
-
- if(request.query){ dojo.mixin(this.request.query, request.query);}
-
- if(paramNames){
- dojo.forEach(["imageThumbAttr", "imageLargeAttr", "linkAttr", "titleAttr"], function(attrName){
- if(paramNames[attrName]){ this[attrName] = paramNames[attrName]; }
- }, this);
- }
-
- this.request.start = 0;
- this.request.count = this.pageSize;
- this.imageStore = dataStore;
-
- if(!this.init()){this._loadNextPage();}
- },
-
- reset: function(){
- // summary: Resets the widget back to its original state.
- this._loadedImages = {};
- dojo.forEach(this._thumbs, function(img){
- if(img){
- // dojo.event.browser.clean(img);
- if(img.parentNode){
- img.parentNode.removeChild(img);
- }
- }
- });
-
- this._thumbs = [];
- this.isInitialized = false;
- this._noImages = true;
- },
-
- isVisible: function(index) {
- // summary: Returns true if the image at the specified index is currently visible. False otherwise.
- var img = this._thumbs[index];
- if(!img){return false;}
- var pos = this.isHorizontal ? "offsetLeft" : "offsetTop";
- var size = this.isHorizontal ? "offsetWidth" : "offsetHeight";
- var scrollAttr = this.isHorizontal ? "scrollLeft" : "scrollTop";
- var offset = img[pos] - this.thumbsNode[pos];
- return (offset >= this.thumbScroller[scrollAttr]
- && offset + img[size] <= this.thumbScroller[scrollAttr] + this._scrollerSize);
- },
-
- _next: function() {
- // summary: Displays the next page of images
- var pos = this.isHorizontal ? "offsetLeft" : "offsetTop";
- var size = this.isHorizontal ? "offsetWidth" : "offsetHeight";
- var baseOffset = this.thumbsNode[pos];
- var firstThumb = this._thumbs[this._thumbIndex];
- var origOffset = firstThumb[pos] - baseOffset;
-
- var index = -1, img;
-
- for(var i = this._thumbIndex + 1; i < this._thumbs.length; i++){
- img = this._thumbs[i];
- if(img[pos] - baseOffset + img[size] - origOffset > this._scrollerSize){
- this._showThumbs(i);
- return;
- }
- }
- },
-
- _prev: function(){
- // summary: Displays the next page of images
- if(this.thumbScroller[this.isHorizontal ? "scrollLeft" : "scrollTop"] == 0){return;}
- var pos = this.isHorizontal ? "offsetLeft" : "offsetTop";
- var size = this.isHorizontal ? "offsetWidth" : "offsetHeight";
-
- var firstThumb = this._thumbs[this._thumbIndex];
- var origOffset = firstThumb[pos] - this.thumbsNode[pos];
-
- var index = -1, img;
-
- for(var i = this._thumbIndex - 1; i > -1; i--) {
- img = this._thumbs[i];
- if(origOffset - img[pos] > this._scrollerSize){
- this._showThumbs(i + 1);
- return;
- }
- }
- this._showThumbs(0);
- },
-
- _checkLoad: function(img, index){
- dojo.publish(this.getShowTopicName(), [{index:index}]);
- this._updateNavControls();
- this._loadingImages = {};
-
- this._thumbIndex = index;
-
- //If we have not already requested the data from the store, do so.
- if(this.thumbsNode.offsetWidth - img.offsetLeft < (this._scrollerSize * 2)){
- this._loadNextPage();
- }
- },
-
- _showThumbs: function(index){
- // summary: Displays thumbnail images, starting at position 'index'
- // index: Number
- // The index of the first thumbnail
-
-//FIXME: When is this be called with an invalid index? Do we need this check at all?
-// if(typeof index != "number"){ index = this._thumbIndex; }
- index = Math.min(Math.max(index, 0), this._maxPhotos);
-
- if(index >= this._maxPhotos){ return; }
-
- var img = this._thumbs[index];
- if(!img){ return; }
-
- var left = img.offsetLeft - this.thumbsNode.offsetLeft;
- var top = img.offsetTop - this.thumbsNode.offsetTop;
- var offset = this.isHorizontal ? left : top;
-
- if( (offset >= this.thumbScroller[this._scrollAttr]) &&
- (offset + img[this._sizeAttr] <= this.thumbScroller[this._scrollAttr] + this._scrollerSize)
- ){
- // FIXME: WTF is this checking for?
- return;
- }
-
-
- if(this.isScrollable){
- var target = this.isHorizontal ? {x: left, y: 0} : { x:0, y:top};
- dojox.fx.smoothScroll({
- target: target,
- win: this.thumbScroller,
- duration:300,
- easing:dojox.fx.easing.easeOut,
- onEnd: dojo.hitch(this, "_checkLoad", img, index)
- }).play(10);
- }else{
- if(this.isHorizontal){
- this.thumbScroller.scrollLeft = left;
- }else{
- this.thumbScroller.scrollTop = top;
- }
- this._checkLoad(img, index);
- }
- },
-
- markImageLoaded: function(index){
- // summary: Changes a visual cue to show the image is loaded
- // description: If 'useLoadNotifier' is set to true, then a visual cue is
- // given to state whether the image is loaded or not. Calling this function
- // marks an image as loaded.
- var thumbNotifier = dojo.byId("loadingDiv_"+this.widgetid+"_"+index);
- if(thumbNotifier){this._setThumbClass(thumbNotifier, "thumbLoaded");}
- this._loadedImages[index] = true;
- },
-
- _setThumbClass: function(thumb, className){
- // summary: Adds a CSS class to a thumbnail, only if 'autoLoad' is true
- // thumb: DomNode
- // The thumbnail DOM node to set the class on
- // className: String
- // The CSS class to add to the DOM node.
- if(!this.autoLoad){ return; }
- dojo.addClass(thumb, className);
- },
-
- _loadNextPage: function(){
- // summary: Loads the next page of thumbnail images
- if(this._loadInProgress){return;}
- this._loadInProgress = true;
- var start = this.request.start + (this._noImages ? 0 : this.pageSize);
-
- var pos = start;
- while(pos < this._thumbs.length && this._thumbs[pos]){pos ++;}
-
- //Define the function to call when the items have been
- //returned from the data store.
- var complete = function(items, request){
- if(items && items.length){
- var itemCounter = 0;
- var loadNext = dojo.hitch(this, function(){
- if(itemCounter >= items.length){
- this._loadInProgress = false;
- return;
- }
- var counter = itemCounter++;
-
- this._loadImage(items[counter], pos + counter, loadNext);
- });
- loadNext();
-
- //Show or hide the navigation arrows on the thumbnails,
- //depending on whether or not the widget is at the start,
- //end, or middle of the list of images.
- this._updateNavControls();
- }else{
- this._loadInProgress = false;
- }
- };
-
- //Define the function to call if the store reports an error.
- var error = function(){
- this._loadInProgress = false;
- console.debug("Error getting items");
- };
-
- this.request.onComplete = dojo.hitch(this, complete);
- this.request.onError = dojo.hitch(this, error);
-
- //Increment the start parameter. This is the dojo.data API's
- //version of paging.
- this.request.start = start;
- this._noImages = false;
-
- //Execute the request for data.
- this.imageStore.fetch(this.request);
-
- },
-
- _loadImage: function(data, index, callback){
- var url = this.imageStore.getValue(data,this.imageThumbAttr);
- var img = document.createElement("img");
- var imgContainer = document.createElement("div");
- imgContainer.setAttribute("id","img_" + this.widgetid+"_"+index);
- imgContainer.appendChild(img);
- img._index = index;
- img._data = data;
-
- this._thumbs[index] = imgContainer;
- var loadingDiv;
- if(this.useLoadNotifier){
- loadingDiv = document.createElement("div");
- loadingDiv.setAttribute("id","loadingDiv_" + this.widgetid+"_"+index);
-
- //If this widget was previously told that the main image for this
- //thumb has been loaded, make the loading indicator transparent.
- this._setThumbClass(loadingDiv,
- this._loadedImages[index] ? "thumbLoaded":"thumbNotifier");
-
- imgContainer.appendChild(loadingDiv);
- }
- var size = dojo.marginBox(this.thumbsNode);
- var defaultSize;
- var sizeParam;
- if(this.isHorizontal){
- defaultSize = this.thumbWidth;
- sizeParam = 'w';
- } else{
- defaultSize = this.thumbHeight;
- sizeParam = 'h';
- }
- size = size[sizeParam];
- var sl = this.thumbScroller.scrollLeft, st = this.thumbScroller.scrollTop;
- dojo.style(this.thumbsNode, this._sizeProperty, (size + defaultSize + 20) + "px");
- //Remember the scroll values, as changing the size can alter them
- this.thumbScroller.scrollLeft = sl;
- this.thumbScroller.scrollTop = st;
- this.thumbsNode.appendChild(imgContainer);
-
- dojo.connect(img, "onload", this, function(){
- var realSize = dojo.marginBox(img)[sizeParam];
- this._totalSize += (Number(realSize) + 4);
- dojo.style(this.thumbsNode, this._sizeProperty, this._totalSize + "px");
-
- if(this.useLoadNotifier){dojo.style(loadingDiv, "width", (img.width - 4) + "px"); }
- callback();
- return false;
- });
-
- dojo.connect(img, "onclick", this, function(evt){
- dojo.publish(this.getClickTopicName(), [{
- index: evt.target._index,
- data: evt.target._data,
- url: img.getAttribute("src"),
- largeUrl: this.imageStore.getValue(data,this.imageLargeAttr),
- title: this.imageStore.getValue(data,this.titleAttr),
- link: this.imageStore.getValue(data,this.linkAttr)
- }]);
- return false;
- });
- dojo.addClass(img, "imageGalleryThumb");
- img.setAttribute("src", url);
- var title = this.imageStore.getValue(data, this.titleAttr);
- if(title){ img.setAttribute("title",title); }
- this._updateNavControls();
-
- },
-
- _updateNavControls: function(){
- // summary: Updates the navigation controls to hide/show them when at
- // the first or last images.
- var cells = [];
- var change = function(node, add){
- var fn = add ? "addClass" : "removeClass";
- dojo[fn](node,"enabled");
- dojo[fn](node,"thumbClickable");
- };
-
- var pos = this.isHorizontal ? "scrollLeft" : "scrollTop";
- var size = this.isHorizontal ? "offsetWidth" : "offsetHeight";
- change(this.navPrev, (this.thumbScroller[pos] > 0));
-
- var last = this._thumbs[this._thumbs.length - 1];
- var addClass = (this.thumbScroller[pos] + this._scrollerSize < this.thumbsNode[size]);
- change(this.navNext, addClass);
- }
-});
-
-}
diff --git a/includes/js/dojox/image/resources/Gallery.html b/includes/js/dojox/image/resources/Gallery.html
deleted file mode 100644
index 571dc4f..0000000
--- a/includes/js/dojox/image/resources/Gallery.html
+++ /dev/null
@@ -1,4 +0,0 @@
-<div dojoAttachPoint="outerNode" class="imageGalleryWrapper">
- <div dojoAttachPoint="thumbPickerNode"></div>
- <div dojoAttachPoint="slideShowNode"></div>
-</div> \ No newline at end of file
diff --git a/includes/js/dojox/image/resources/Lightbox.html b/includes/js/dojox/image/resources/Lightbox.html
deleted file mode 100644
index 1eb292f..0000000
--- a/includes/js/dojox/image/resources/Lightbox.html
+++ /dev/null
@@ -1,15 +0,0 @@
-<div class="dojoxLightbox" dojoAttachPoint="containerNode">
- <div style="position:relative">
- <div dojoAttachPoint="imageContainer" class="dojoxLightboxContainer">
- <img dojoAttachPoint="imgNode" src="${imgUrl}" class="dojoxLightboxImage" alt="${title}">
- <div class="dojoxLightboxFooter" dojoAttachPoint="titleNode">
- <div class="dijitInline LightboxClose" dojoAttachPoint="closeNode"></div>
- <div class="dijitInline LightboxNext" dojoAttachPoint="nextNode"></div>
- <div class="dijitInline LightboxPrev" dojoAttachPoint="prevNode"></div>
-
- <div class="dojoxLightboxText"><span dojoAttachPoint="textNode">${title}</span><span dojoAttachPoint="groupCount" class="dojoxLightboxGroupText"></span></div>
- </div>
- </div>
-
- </div>
-</div> \ No newline at end of file
diff --git a/includes/js/dojox/image/resources/Magnifier.css b/includes/js/dojox/image/resources/Magnifier.css
deleted file mode 100644
index 85eba72..0000000
--- a/includes/js/dojox/image/resources/Magnifier.css
+++ /dev/null
@@ -1,5 +0,0 @@
-.glassNode {
- overflow:hidden;
- position:absolute;
- visibility:hidden;
-}
diff --git a/includes/js/dojox/image/resources/Magnifier.css.commented.css b/includes/js/dojox/image/resources/Magnifier.css.commented.css
deleted file mode 100644
index 85eba72..0000000
--- a/includes/js/dojox/image/resources/Magnifier.css.commented.css
+++ /dev/null
@@ -1,5 +0,0 @@
-.glassNode {
- overflow:hidden;
- position:absolute;
- visibility:hidden;
-}
diff --git a/includes/js/dojox/image/resources/SlideShow.html b/includes/js/dojox/image/resources/SlideShow.html
deleted file mode 100644
index fa4aca6..0000000
--- a/includes/js/dojox/image/resources/SlideShow.html
+++ /dev/null
@@ -1,14 +0,0 @@
-<div dojoAttachPoint="outerNode" class="slideShowWrapper">
- <div style="position:relative;" dojoAttachPoint="innerWrapper">
- <div class="slideShowNav" dojoAttachEvent="onclick: _handleClick">
- <div class="dijitInline slideShowTitle" dojoAttachPoint="titleNode">${title}</div>
- </div>
- <div dojoAttachPoint="navNode" class="slideShowCtrl" dojoAttachEvent="onclick: _handleClick">
- <span dojoAttachPoint="navPrev" class="slideShowCtrlPrev"></span>
- <span dojoAttachPoint="navPlay" class="slideShowCtrlPlay"></span>
- <span dojoAttachPoint="navNext" class="slideShowCtrlNext"></span>
- </div>
- <div dojoAttachPoint="largeNode" class="slideShowImageWrapper"></div>
- <div dojoAttachPoint="hiddenNode" class="slideShowHidden"></div>
- </div>
-</div> \ No newline at end of file
diff --git a/includes/js/dojox/image/resources/ThumbnailPicker.html b/includes/js/dojox/image/resources/ThumbnailPicker.html
deleted file mode 100644
index 561ce2d..0000000
--- a/includes/js/dojox/image/resources/ThumbnailPicker.html
+++ /dev/null
@@ -1,11 +0,0 @@
-<div dojoAttachPoint="outerNode" class="thumbOuter">
- <div dojoAttachPoint="navPrev" class="thumbNav thumbClickable">
- <img src="" dojoAttachPoint="navPrevImg"/>
- </div>
- <div dojoAttachPoint="thumbScroller" class="thumbScroller">
- <div dojoAttachPoint="thumbsNode" class="thumbWrapper"></div>
- </div>
- <div dojoAttachPoint="navNext" class="thumbNav thumbClickable">
- <img src="" dojoAttachPoint="navNextImg"/>
- </div>
-</div> \ No newline at end of file
diff --git a/includes/js/dojox/image/resources/image.css b/includes/js/dojox/image/resources/image.css
deleted file mode 100644
index e626e0f..0000000
--- a/includes/js/dojox/image/resources/image.css
+++ /dev/null
@@ -1,283 +0,0 @@
-
-.dijitDialogUnderlay {
- background-color:#000;
-}
-.dojoxLightbox {
- position:absolute;
- z-index:999;
- overflow:hidden;
- width:100px;
- height:100px;
- border:11px solid #fff;
- background:#fff url('images/loading.gif') no-repeat center center;
-
- -webkit-box-shadow: 0px 6px 10px #636363;
- -webkit-border-radius: 3px;
- -moz-border-radius:4px;
-}
-.dojoxLightboxContainer {
- position:absolute;
- top:0; left:0;
-}
-.dojoxLightboxFooter {
- height:50px;
- position:relative;
- bottom:0;
- left:0;
- margin-top:8px;
- color:#333;
- z-index:1000;
- font-size:10pt;
-}
-.dojoxLightboxGroupText {
- color:#666;
- font-size:8pt;
-}
-.LightboxNext,
-.LightboxPrev,
-.LightboxClose {
- float:right;
- width:16px;
- height:16px;
- cursor:pointer;
-}
-.nihilo .LightboxClose,
-.tundra .LightboxClose {
- background:url('images/close.png') no-repeat center center;
-}
-.nihilo .LightboxNext,
-.tundra .LightboxNext {
- background:url('images/right.png') no-repeat center center;
-}
-.nihilo .LightboxPrev,
-.tundra .LightboxPrev {
- background:url('images/left.png') no-repeat center center;
-}
-.soria .LightboxClose,
-.soria .LightboxNext,
-.soria .LightboxPrev {
- width:15px;
- height:15px;
- background:url('../../../dijit/themes/soria/images/spriteRoundedIconsSmall.png') no-repeat center center;
- background-position:-60px;
-}
-.soria .LightboxNext {
- background-position:-30px 0;
-}
-.soria .LightboxPrev {
- background-position:0 0;
-}
-.slideShowWrapper {
- position:relative;
- background:#fff;
- padding:8px;
- border:1px solid #333;
- padding-bottom:20px;
- overflow:hidden;
- text-align: center;
- -moz-border-radius:3pt;
- -webkit-border-radius:4pt;
- -webkit-drop-shadow:#ccc 4pt;
-}
-.slideShowNav {
- position:absolute;
- bottom:-18px;
- left:0px;
- padding:0px 3px 2px 0px;
- background-color:#fff;
- width:100%;
-}
-.slideShowNavWrapper { float:right; }
-.slideShowTitle {
- float:left;
- color:#333;
- font-size:10pt;
-}
-.slideShowTitle .slideShowCounterText {
- font-size:6pt; color:#666;
-}
-.slideShowHidden {
- position:absolute;
- display: none;
- height: 1px;
- width: 1px;
-}
-.slideShowImageWrapper {
- position:relative;
- text-align: center;
- margin-top: -42px;
- float: left;
- width: 100%;
-}
-.slideShowImageWrapper img {
- border: 0px none;
-}
-.slideShowNotifier {
- background-color: red;
- width: 100px;
- height: 5px;
- font-size: 1%;
-}
-.slideShowSlideShow {
- position:absolute;
- top:30px;
- padding: 0 5px;
- border: 0px;
- text-decoration: none;
- color: #2e6ab1;
-}
-.slideShowLoading { background-color: #fad66a; }
-.slideShowLoaded { background-color: transparent; }
-.slideShowCtrlPrev {
- background-position: -96px 0px;
- float: left;
-}
-.slideShowCtrlNext {
- background-position: -144px 0px;
- float: right;
-}
-.slideShowCtrlPlay {
- background-position: -190px 0px;
- position: absolute;
-}
-.slideShowPaused .slideShowCtrlPlay {
- background-position: -236px 0px;
- position: absolute;
-}
-.slideShowCtrl span.slideShowCtrlHide {
- background-image: url("../../../dojo/resources/blank.gif");
- cursor: auto;
-}
-.slideShowCtrl {
- height: 50px;
- width: 100%;
- position: relative;
- z-index:999;
- float: left;
-}
-.slideShowCtrl span {
- width: 50px;
- height: 100%;
- background-image: url("images/buttons.png");
- cursor: pointer;
-}
-.dj_ie6 .slideShowCtrl span {
- background-image: url("images/buttons.gif");
-}
-.dj_ie6 .slideShowPager li.currentpage,
-.dj_ie6 .pagination li.disablepage{
-
- margin-right: 5px;
- padding-right: 0;
-}
-.thumbWrapper .thumbNav {
- background-repeat: no-repeat;
- background-position: center;
- padding-top: 1px;
- width: 30px;
- height: 100%;
-}
-.thumbOuter {
- padding-bottom: 2px;
-}
-.thumbOuter.thumbHoriz {
- width: 500px;
- height: 85px;
-}
-.thumbOuter.thumbVert {
- width: 100px;
- height: 400px;
-}
-.thumbOuter .enabled {
- background: transparent url("images/buttons.png") no-repeat center center;
-}
-.dj_ie6 .thumbOuter .enabled { background-image: url("images/buttons.gif"); }
-.thumbOuter .thumbNav img {
- width: 48px;
- height: 75px;
-}
-.thumbOuter .thumbClickable div {
- cursor: pointer;
-}
-.thumbOuter .prevHoriz {
- background-position: -96px 12px;
- position: relative;
- float: left;
- height: 100%;
-}
-.thumbOuter .nextHoriz {
- background-position: -144px 12px;
- position: relative;
- float: right;
- height: 100%;
-}
-.thumbOuter .prevVert {
- background-position: 0px 0px;
- height: 48px;
- width:48px;
- margin-left:24px;
-}
-.thumbOuter .nextVert {
- background-position: -48px 0px;
- height: 48px;
- width:48px;
- margin-left:24px;
-}
-.thumbWrapper img {
- height: 75px;
- max-width: 100px;
- width: expression(this.width > 100 ? 100: true);
-}
-.thumbWrapper .thumbNav .imageGalleryThumb {
- height: 50px;
-}
-.thumbWrapper .thumbNotifier {
- background-color: red;
- width: 0px;
- margin-left: 2px;
- height: 5px;
- font-size: 1%;
-}
-.thumbWrapper .thumbLoaded {
- background-color: transparent;
-}
-.thumbScroller {
- overflow-x: hidden;
- overflow-y: hidden;
- white-space: nowrap;
- text-align: center;
-}
-.thumbHoriz .thumbScroller {
- width: 500px;
- height: 85px;
- float: left;
-}
-.thumbVert .thumbScroller {
- height: 500px;
- width: 100px;
-}
-.thumbWrapper {
- float: left;
-}
-.thumbVert .thumbWrapper {
- width: 100px;
- height: 10px;
-}
-.thumbHoriz .thumbWapper {
- height:85px;
- width: 10px;
-}
-.thumbWrapper.thumbHoriz div {
- float: left;
- padding-right: 2px;
-}
-.thumbWrapper.thumbVert {
- width: 100px;
-}
-.thumbWrapper.thumbVert div {
- padding-bottom: 2px;
-}
-.imageGalleryWrapper {
- padding-bottom: 20px;
- text-align: center;
-}
diff --git a/includes/js/dojox/image/resources/image.css.commented.css b/includes/js/dojox/image/resources/image.css.commented.css
deleted file mode 100644
index 3539a71..0000000
--- a/includes/js/dojox/image/resources/image.css.commented.css
+++ /dev/null
@@ -1,345 +0,0 @@
-/*
- This is the master CSS file for the dojox.image project, and provides all
- needed definitions for:
-
- dojox.image.Lightbox
- dojox.image.Gallery [which is a combination of:]
- dojox.image.SlideShow
- dojox.image.ThumbNailPicker
-
-*/
-
-
-/* dojox.image.Lightbox:base */
-/* FIXME: should be be doing this? I want a black underlay, but this sets ALL dialogs to black,
- but because it's decendant of body, i can't set this color any other way ... */
-.dijitDialogUnderlay {
- background-color:#000;
-}
-
-.dojoxLightbox {
- position:absolute;
- z-index:999;
- overflow:hidden;
- width:100px;
- height:100px;
- border:11px solid #fff;
- background:#fff url('images/loading.gif') no-repeat center center;
-
- /* special safari + FF specific rounding + shadows */
- -webkit-box-shadow: 0px 6px 10px #636363; /* #adadad; */
- -webkit-border-radius: 3px;
- -moz-border-radius:4px;
-}
-
-.dojoxLightboxContainer {
- position:absolute;
- top:0; left:0;
-}
-
-.dojoxLightboxFooter {
- height:50px;
- position:relative;
- bottom:0;
- left:0;
- margin-top:8px;
- color:#333;
- z-index:1000;
- font-size:10pt;
-}
-
-.dojoxLightboxGroupText {
- color:#666;
- font-size:8pt;
-}
-
-.LightboxNext,
-.LightboxPrev,
-.LightboxClose {
- float:right;
- width:16px;
- height:16px;
- cursor:pointer;
-}
-
-/* dojox.image.Lightbox:tundra:nihilo */
-
-.nihilo .LightboxClose,
-.tundra .LightboxClose {
- background:url('images/close.png') no-repeat center center;
-}
-.nihilo .LightboxNext,
-.tundra .LightboxNext {
- background:url('images/right.png') no-repeat center center;
-}
-.nihilo .LightboxPrev,
-.tundra .LightboxPrev {
- background:url('images/left.png') no-repeat center center;
-}
-
-/* dojox.image.Lightbox:soria */
-.soria .LightboxClose,
-.soria .LightboxNext,
-.soria .LightboxPrev {
- width:15px;
- height:15px;
- background:url('../../../dijit/themes/soria/images/spriteRoundedIconsSmall.png') no-repeat center center;
- background-position:-60px;
-}
-.soria .LightboxNext {
- background-position:-30px 0;
-}
-.soria .LightboxPrev {
- background-position:0 0;
-}
-
-
-
-/* dojox.image.SlideShow */
-
-.slideShowWrapper {
- position:relative;
- background:#fff;
- padding:8px;
- border:1px solid #333;
- padding-bottom:20px;
- overflow:hidden;
- text-align: center;
- -moz-border-radius:3pt;
- -webkit-border-radius:4pt;
- -webkit-drop-shadow:#ccc 4pt;
-}
-.slideShowNav {
- position:absolute;
- bottom:-18px;
- left:0px;
- padding:0px 3px 2px 0px;
- background-color:#fff;
- width:100%;
-}
-.slideShowNavWrapper { float:right; }
-.slideShowTitle {
- float:left;
- color:#333;
- font-size:10pt;
-}
-.slideShowTitle .slideShowCounterText {
- font-size:6pt; color:#666;
-}
-.slideShowHidden {
- position:absolute;
- display: none;
- height: 1px;
- width: 1px;
-}
-.slideShowImageWrapper {
- position:relative;
- text-align: center;
- margin-top: -42px;
- float: left;
- width: 100%;
-}
-.slideShowImageWrapper img {
- border: 0px none;
-}
-.slideShowNotifier {
- background-color: red;
- width: 100px;
- height: 5px;
- font-size: 1%;/*IE hack to get around the Empty-Div bug*/
-}
-.slideShowSlideShow {
- position:absolute;
- top:30px;
- padding: 0 5px;
- border: 0px;
- text-decoration: none;
- color: #2e6ab1;
-}
-.slideShowLoading { background-color: #fad66a; }
-.slideShowLoaded { background-color: transparent; }
-/*
-.sprite-arrowbottom { background-position: 0 -30px; }
-.sprite-arrowtop { background-position: 0 -430px; }
-*/
-.slideShowCtrlPrev {
- background-position: -96px 0px;
- float: left;
-}
-.slideShowCtrlNext {
- background-position: -144px 0px;
- float: right;
-}
-.slideShowCtrlPlay {
- background-position: -190px 0px;
- position: absolute;
-}
-.slideShowPaused .slideShowCtrlPlay {
- background-position: -236px 0px;
- position: absolute;
-}
-.slideShowCtrl span.slideShowCtrlHide {
- background-image: url("../../../dojo/resources/blank.gif");
- cursor: auto;
-}
-
-.slideShowCtrl {
- height: 50px;
- width: 100%;
- position: relative;
- z-index:999;
- float: left;
-}
-.slideShowCtrl span {
- width: 50px;
- height: 100%;
- background-image: url("images/buttons.png");
- cursor: pointer;
-}
-.dj_ie6 .slideShowCtrl span {
- background-image: url("images/buttons.gif");
-}
-
-.dj_ie6 .slideShowPager li.currentpage,
-.dj_ie6 .pagination li.disablepage{
- /*IE 6 and below. Adjust non linked LIs slightly to account for bugs*/
- margin-right: 5px;
- padding-right: 0;
-}
-
-/* dojox.image.ThumbnailPicker */
-
-.thumbWrapper .thumbNav {
- background-repeat: no-repeat;
- background-position: center;
- padding-top: 1px;
- width: 30px;
- height: 100%;
-}
-
-.thumbOuter {
- padding-bottom: 2px;
-}
-
-.thumbOuter.thumbHoriz {
- width: 500px;
- height: 85px;
-}
-
-.thumbOuter.thumbVert {
- width: 100px;
- height: 400px;
-}
-
-.thumbOuter .enabled {
- background: transparent url("images/buttons.png") no-repeat center center;
-}
-.dj_ie6 .thumbOuter .enabled { background-image: url("images/buttons.gif"); }
-
-.thumbOuter .thumbNav img {
- width: 48px;
- height: 75px;
-}
-.thumbOuter .thumbClickable div {
- cursor: pointer;
-}
-.thumbOuter .prevHoriz {
- background-position: -96px 12px;
- position: relative;
- float: left;
- height: 100%;
-}
-
-.thumbOuter .nextHoriz {
- background-position: -144px 12px;
- position: relative;
- float: right;
- height: 100%;
-/* margin-top: -85px;*/
-}
-.thumbOuter .prevVert {
- background-position: 0px 0px;
- height: 48px;
- width:48px;
- margin-left:24px;
-}
-
-.thumbOuter .nextVert {
- background-position: -48px 0px;
- height: 48px;
- width:48px;
- margin-left:24px;
-}
-
-.thumbWrapper img {
- height: 75px;
- max-width: 100px;
- width: expression(this.width > 100 ? 100: true);/*IE Hack*/
-}
-
-.thumbWrapper .thumbNav .imageGalleryThumb {
- height: 50px;
-}
-
-.thumbWrapper .thumbNotifier {
- background-color: red;
- width: 0px;
- margin-left: 2px;
- height: 5px;
- font-size: 1%;/*IE hack to get around the Empty-Div bug*/
-}
-
-.thumbWrapper .thumbLoaded {
- background-color: transparent;
-}
-
-.thumbScroller {
- overflow-x: hidden;
- overflow-y: hidden;
- white-space: nowrap;
- text-align: center;
-}
-
-.thumbHoriz .thumbScroller {
- width: 500px;
- height: 85px;
- float: left;
-}
-
-.thumbVert .thumbScroller {
- height: 500px;
- width: 100px;
-}
-
-.thumbWrapper {
- float: left;
-}
-
-.thumbVert .thumbWrapper {
- width: 100px;
- height: 10px;
-}
-.thumbHoriz .thumbWapper {
- height:85px;
- width: 10px;
-}
-
-.thumbWrapper.thumbHoriz div {
- float: left;
- padding-right: 2px;
-}
-
-.thumbWrapper.thumbVert {
- width: 100px;
-}
-
-.thumbWrapper.thumbVert div {
- padding-bottom: 2px;
-}
-
-/* dojox.image.Gallery */
-
-.imageGalleryWrapper {
- padding-bottom: 20px;
- text-align: center;
-}
diff --git a/includes/js/dojox/image/resources/images/buttons.gif b/includes/js/dojox/image/resources/images/buttons.gif
deleted file mode 100644
index 5f9081f..0000000
--- a/includes/js/dojox/image/resources/images/buttons.gif
+++ /dev/null
Binary files differ
diff --git a/includes/js/dojox/image/resources/images/buttons.png b/includes/js/dojox/image/resources/images/buttons.png
deleted file mode 100644
index 306e2f8..0000000
--- a/includes/js/dojox/image/resources/images/buttons.png
+++ /dev/null
Binary files differ
diff --git a/includes/js/dojox/image/resources/images/close.png b/includes/js/dojox/image/resources/images/close.png
deleted file mode 100644
index 1ac9d10..0000000
--- a/includes/js/dojox/image/resources/images/close.png
+++ /dev/null
Binary files differ
diff --git a/includes/js/dojox/image/resources/images/close_dark.png b/includes/js/dojox/image/resources/images/close_dark.png
deleted file mode 100644
index 105fe55..0000000
--- a/includes/js/dojox/image/resources/images/close_dark.png
+++ /dev/null
Binary files differ
diff --git a/includes/js/dojox/image/resources/images/left.png b/includes/js/dojox/image/resources/images/left.png
deleted file mode 100644
index 0848dba..0000000
--- a/includes/js/dojox/image/resources/images/left.png
+++ /dev/null
Binary files differ
diff --git a/includes/js/dojox/image/resources/images/loading.gif b/includes/js/dojox/image/resources/images/loading.gif
deleted file mode 100644
index e4ab783..0000000
--- a/includes/js/dojox/image/resources/images/loading.gif
+++ /dev/null
Binary files differ
diff --git a/includes/js/dojox/image/resources/images/right.png b/includes/js/dojox/image/resources/images/right.png
deleted file mode 100644
index 7cab686..0000000
--- a/includes/js/dojox/image/resources/images/right.png
+++ /dev/null
Binary files differ
diff --git a/includes/js/dojox/image/resources/images/warning.png b/includes/js/dojox/image/resources/images/warning.png
deleted file mode 100644
index a52a55f..0000000
--- a/includes/js/dojox/image/resources/images/warning.png
+++ /dev/null
Binary files differ
diff --git a/includes/js/dojox/image/tests/images.json b/includes/js/dojox/image/tests/images.json
deleted file mode 100644
index bd0cf96..0000000
--- a/includes/js/dojox/image/tests/images.json
+++ /dev/null
@@ -1,32 +0,0 @@
-{ items: [
- {
- "thumb":"images/extraWide.jpg",
- "large":"images/extraWide.jpg",
- "title":"I'm wide, me",
- "link":"http://www.flickr.com/photos/44153025@N00/748348847"
- },
- {
- "thumb":"images/imageHoriz.jpg",
- "large":"images/imageHoriz.jpg",
- "title":"I'm a horizontal picture",
- "link":"http://www.flickr.com/photos/44153025@N00/735656038"
- },
- {
- "thumb":"images/imageHoriz2.jpg",
- "large":"images/imageHoriz2.jpg",
- "title":"I'm another horizontal picture",
- "link":"http://www.flickr.com/photos/44153025@N00/714540483"
- },
- {
- "thumb":"images/imageVert.jpg",
- "large":"images/imageVert.jpg",
- "title":"I'm a vertical picture",
- "link":"http://www.flickr.com/photos/44153025@N00/715392758"
- },
- {
- "large":"images/square.jpg",
- "thumb":"images/square.jpg",
- "link" :"images/square.jpg",
- "title":"1:1 aspect ratio"
- }
-]} \ No newline at end of file
diff --git a/includes/js/dojox/image/tests/images/extraWide.jpg b/includes/js/dojox/image/tests/images/extraWide.jpg
deleted file mode 100644
index 2161825..0000000
--- a/includes/js/dojox/image/tests/images/extraWide.jpg
+++ /dev/null
Binary files differ
diff --git a/includes/js/dojox/image/tests/images/huuuge.png b/includes/js/dojox/image/tests/images/huuuge.png
deleted file mode 100644
index ee98a39..0000000
--- a/includes/js/dojox/image/tests/images/huuuge.png
+++ /dev/null
Binary files differ
diff --git a/includes/js/dojox/image/tests/images/imageHoriz.jpg b/includes/js/dojox/image/tests/images/imageHoriz.jpg
deleted file mode 100644
index 3948416..0000000
--- a/includes/js/dojox/image/tests/images/imageHoriz.jpg
+++ /dev/null
Binary files differ
diff --git a/includes/js/dojox/image/tests/images/imageHoriz2.jpg b/includes/js/dojox/image/tests/images/imageHoriz2.jpg
deleted file mode 100644
index fbbf404..0000000
--- a/includes/js/dojox/image/tests/images/imageHoriz2.jpg
+++ /dev/null
Binary files differ
diff --git a/includes/js/dojox/image/tests/images/imageVert.jpg b/includes/js/dojox/image/tests/images/imageVert.jpg
deleted file mode 100644
index 1652338..0000000
--- a/includes/js/dojox/image/tests/images/imageVert.jpg
+++ /dev/null
Binary files differ
diff --git a/includes/js/dojox/image/tests/images/spanke.jpg b/includes/js/dojox/image/tests/images/spanke.jpg
deleted file mode 100644
index ec95fb0..0000000
--- a/includes/js/dojox/image/tests/images/spanke.jpg
+++ /dev/null
Binary files differ
diff --git a/includes/js/dojox/image/tests/images/square.jpg b/includes/js/dojox/image/tests/images/square.jpg
deleted file mode 100644
index 9094d5a..0000000
--- a/includes/js/dojox/image/tests/images/square.jpg
+++ /dev/null
Binary files differ
diff --git a/includes/js/dojox/image/tests/test_Gallery.html b/includes/js/dojox/image/tests/test_Gallery.html
deleted file mode 100644
index 320c481..0000000
--- a/includes/js/dojox/image/tests/test_Gallery.html
+++ /dev/null
@@ -1,67 +0,0 @@
-<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
-<html>
-<head>
- <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
- <title>Testing the Image Gallery</title>
-
- <style type="text/css">
- @import "../../../dijit/tests/css/dijitTests.css";
- @import "../resources/image.css";
- </style>
-
-
- <script type="text/javascript" src="../../../dojo/dojo.js" djconfig="parseOnLoad:true, isDebug: true, defaultTestTheme:'soria'"></script>
- <script type="text/javascript" src="../../../dijit/tests/_testCommon.js"></script>
- <script type="text/javascript" src="../ThumbnailPicker.js"></script>
- <script type="text/javascript" src="../SlideShow.js"></script>
- <script type="text/javascript" src="../Gallery.js"></script>
- <script type="text/javascript" src="../../../dojo/data/util/simpleFetch.js"></script>
- <script type="text/javascript" src="../../data/FlickrStore.js"></script>
- <script type="text/javascript" src="../../data/FlickrRestStore.js"></script>
- <script type="text/javascript" src="../../../dojo/data/ItemFileReadStore.js"></script>
-
- <script type="text/javascript">
- // dojo.require("dojox.image.Gallery");
- dojo.require("dojox.data.FlickrRestStore");
- dojo.require("dojo.parser"); // find widgets
-
- dojo.addOnLoad(function(){
- var flickrRestStore = new dojox.data.FlickrRestStore();
- var req = {
- query: {
- userid: "44153025@N00",
- apikey: "8c6803164dbc395fb7131c9d54843627",
- sort: [
- {
- attribute: "interestingness",
- descending: true
- }
- ],
- // tags: ["superhorse", "redbones", "beachvolleyball"],
- tag_mode: "any"
- },
- count: 20
- };
- dijit.byId('gallery1').setDataStore(flickrRestStore, req);
-/*
- dijit.byId('gallery2').setDataStore(imageItemStore,{ count:20 },{
- imageThumbAttr: "thumb",
- imageLargeAttr: "large"
- });
-*/
- });
- </script>
-</head>
-<body>
- <h1 class="testTitle">dojox.image.Gallery</h1>
-
- <h2>From FlickrRestStore:</h2>
- <div id="gallery1" dojoType="dojox.image.Gallery" imageWidth="700" imageHeight="500"></div>
-
-<!--
- <h2>From ItemFileReadStore:</h2>
- <div id="gallery2" dojoType="dojox.image.Gallery"></div>
--->
-
-</body>
-</html>
diff --git a/includes/js/dojox/image/tests/test_Lightbox.html b/includes/js/dojox/image/tests/test_Lightbox.html
deleted file mode 100644
index 15b34c8..0000000
--- a/includes/js/dojox/image/tests/test_Lightbox.html
+++ /dev/null
@@ -1,105 +0,0 @@
-<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
- "http://www.w3.org/TR/html4/strict.dtd">
-<html>
-<head>
- <title>dojox.image.Lightbox Tests | The Dojo Toolkit</title>
-
- <script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug:true, parseOnLoad: true"></script>
- <script type="text/javascript" src="../../../dijit/tests/_testCommon.js"></script>
- <script type="text/javascript" src="../Lightbox.js"></script>
- <script type="text/javascript">
- // dojo.require("dojox.image.Lightbox"); // un-comment when not debugging
- dojo.require("dojo.parser"); // scan page for widgets and instantiate them
- dojo.require("dojox.data.FlickrStore");
- </script>
-
- <style type="text/css">
- @import "../../../dojo/resources/dojo.css";
- @import "../../../dijit/themes/dijit.css";
- @import "../../../dijit/tests/css/dijitTests.css";
-
- /* you need this file */
- @import "../resources/image.css";
-
- body, html { width:100%; height:100%; margin:0; padding:0; }
-
- </style>
-
- <script type="text/javascript">
- // programatic flickrstore implementation [basic]
- function onComplete(items,request){
- if (items.length>0){
- dojo.forEach(items,function(item){
- var part = {
- title: flickrStore.getValue(item,"title"),
- href: flickrStore.getValue(item,"imageUrl")
- };
- // FIXME: make addImage more accessible, or do this internally
- // _attachedDialog is dijit.byId("dojoxLightboxDialog"), and the
- // is only one per page.
- dijit.byId('fromStore')._attachedDialog.addImage(part,"flickrStore");
- });
- dojo.byId('flickrButton').disabled = false;
- }
- }
-
- function onError(error,request){
- console.warn(error,request);
- }
-
- function init(){
- var flickrRequest = {
- query: {},
- onComplete: onComplete,
- onError: onError,
- userid: "jetstreet",
- tags: "jetstreet",
- count: 10
- };
- flickrStore.fetch(flickrRequest);
- }
- dojo.addOnLoad(init);
- </script>
-
-
-</head>
-<body>
-
-<div style="padding:20px;">
- <h1 class="testTitle">a Dojo based Lightbox implementation:</h1>
-
- <h3>Individual</h3>
- <p>
- <a href="images/imageVert.jpg" dojoType="dojox.image.Lightbox" title="More Guatemala...">tall</a>
- <a href="images/imageHoriz.jpg" dojoType="dojox.image.Lightbox" title="Antigua, Guatemala">4:3 image</a>
- <a href="images/broken.jpg" dojoType="dojox.image.Lightbox" title="broken href example">Broken link</a>
- <a href="images/huuuge.png" dojoType="dojox.image.Lightbox" title="a large image">large than viewport?</a>
- </p>
-
- <h3>Grouped:</h3>
- <p>
- <a href="images/imageHoriz2.jpg" dojoType="dojox.image.Lightbox" group="group1" title="Amsterdam Train Depot">wide image</a>
- <a href="images/square.jpg" dojoType="dojox.image.Lightbox" group="group1" title="1:1 aspect">square</a>
- <a href="images/extraWide.jpg" dojoType="dojox.image.Lightbox" group="group1" title="Greeneville, TN">wide image</a>
- <a href="images/broken.jpg" dojoType="dojox.image.Lightbox" group="group1" title="broken href example">Broken link</a>
- </p>
-
- <h3>Alternate Group:</h3>
- <p>
- <a href="images/imageHoriz2.jpg" dojoType="dojox.image.Lightbox" group="group2" title="Amsterdam Train Depot">wide image</a>
- <a href="images/square.jpg" dojoType="dojox.image.Lightbox" group="group2" title="1:1 aspect">square</a>
- <a href="images/imageHoriz.jpg" dojoType="dojox.image.Lightbox" group="group2" title="Antigua, Guatemala">4:3 image</a>
- <a href="images/imageVert.jpg" dojoType="dojox.image.Lightbox" group="group2" title="More Guatemala...">tall</a>
- </p>
-
- <h3>From dojox.data.FlickrStore:</h3>
-
- <div dojoType="dojox.data.FlickrStore" jsId="flickrStore" label="title"></div>
- <div id="fromStore" dojoType="dojox.image.Lightbox" store="flickrStore" group="flickrStore"></div>
-
- <input id="flickrButton" type="button" onclick="dijit.byId('fromStore').show()" value="show flickr lightbox" disabled="disabled">
-
-</div>
-
-</body>
-</html>
diff --git a/includes/js/dojox/image/tests/test_Magnifier.html b/includes/js/dojox/image/tests/test_Magnifier.html
deleted file mode 100644
index fef1ddd..0000000
--- a/includes/js/dojox/image/tests/test_Magnifier.html
+++ /dev/null
@@ -1,98 +0,0 @@
-<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" >
-<head>
- <title>Testing image</title>
- <style type="text/css">
- @import "../../../dojo/resources/dojo.css";
- @import "../../../dijit/tests/css/dijitTests.css";
- @import "../../../dijit/themes/tundra/tundra.css";
- /* needed for glass overlay: */
- @import "../resources/Magnifier.css";
-
- p { padding:20px; border:1px solid #ededed; }
- #testImage { border:2px solid #000; }
-
- </style>
- <script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true, parseOnLoad:true"></script>
- <!-- for debugging -->
- <script type="text/javascript" src="../MagnifierLite.js"></script>
- <script type="text/javascript" src="../Magnifier.js"></script>
-
- <script type="text/javascript">
- dojo.require("dojox.image.Magnifier");
- dojo.require("dijit.form.Button");
- </script>
-
-</head>
-<body class="tundra">
-
- <h1 class="testTitle">dojox.image.Magnifier test page</h1>
-
- <p>They are just images. It's entirely unobtrusive to add magnification to an image, and style it accordingly.</p>
- <p>This widget is based on <a href="test_MagnifierLite.html">dojox.image.MagnifierLite</a>, an image-only variant on this dojox.gfx
- based Widget. The idea was/is to include addational surfaces in some kind of _Templated GFX widget, based on _Widget.</p>
- <p>
- Scale= 2.34, 5.67, and 8.90: <br>
- <img id="testImage" dojoType="dojox.image.Magnifier" src="images/spanke.jpg"
- style="width:200px; height:130px;" scale="2.34" />
- <img id="testImage4" dojoType="dojox.image.Magnifier" src="images/spanke.jpg"
- style="width:200px; height:130px;" scale="5.67" />
-
- <img id="testImage5" dojoType="dojox.image.Magnifier" src="images/spanke.jpg"
- style="width:200px; height:130px;" scale="8.90" />
- </p>
-
- <p>
- <img id="testImage2" dojoType="dojox.image.Magnifier" src="images/spanke.jpg"
- style="width:200px; height:130px; padding-right:20px; float:left" />
- I Am Some inline text.<br>lorem ipsum.<br style="clear:both">
- </p>
-
- <p>A Transparent .png:<br>
-
- <img style="width:400px; height:260px" id="test3"
- dojoType="dojox.image.Magnifier" glassSize="215" scale="3"
- src="../../../util/resources/logo/positive/dojo.logo.big.png" />
- </p>
-
- <p>Programatic:<br>
-
- <button dojoType="dijit.form.Button" id="foob">
- Make It
- <script type="dojo/method" event="onClick">
- this.setAttribute("disabled",true);
- dijit.byId("foobd").setAttribute("disabled",false);
- new dojox.image.Magnifier({ scale:4.2, glassSize:200 },"foobar");
- </script>
- </button>
-
- <button dojoType="dijit.form.Button" id="foobd" disabled="disabled">
- Destroy It
- <script type="dojo/method" event="onClick">
- this.setAttribute("disabled",true);
- dijit.byId("foobar").destroy();
- console.log('layout changed:');
- dijit.byId("after1")._adjustScale();
- dijit.byId("after2")._adjustScale();
- </script>
- </button>
-
- <br /><!-- srcNodeRef : -->
- <img id="foobar" style="width:300px; height:195px;" src="images/spanke.jpg" />
- </p>
-
- <p>Remote file (GTA:LCS/psp map):<br>
- <img id='after1' style="width:167px; height:240px; border:4px solid #333;"
- src="http://img.qj.net/uploads/articles_module/66700/stauntonhpackages_qjpreviewth.png"
- scale="6" glassSize="150" dojoType="dojox.image.Magnifier"
- />
-
- <br>Everybody loves Zelda, right?<br>
- <img id='after2' style="width:585px; height:201px" scale="7" glassSize="185" dojoType="dojox.image.Magnifier" src="http://www.zelda-infinite.com/games/zelda1/overworld.png" />
- </p>
-
- <p id="programaticContainer">
- <!-- not yet? -->
- </p>
-
-</body>
-</html>
diff --git a/includes/js/dojox/image/tests/test_MagnifierLite.html b/includes/js/dojox/image/tests/test_MagnifierLite.html
deleted file mode 100644
index 6e6ccd7..0000000
--- a/includes/js/dojox/image/tests/test_MagnifierLite.html
+++ /dev/null
@@ -1,91 +0,0 @@
-<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" >
-<head>
- <title>Testing image</title>
- <style type="text/css">
- @import "../../../dojo/resources/dojo.css";
- @import "../../../dijit/tests/css/dijitTests.css";
- @import "../../../dijit/themes/tundra/tundra.css";
- @import "../resources/Magnifier.css";
-
- p { padding:20px; border:1px solid #ededed; }
- #testImage { border:2px solid #000; }
-
- </style>
-
- <script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true, parseOnLoad:true"></script>
- <script type="text/javascript" src="../MagnifierLite.js"></script>
- <script type="text/javascript">
- dojo.require("dojox.image.MagnifierLite");
- dojo.require("dijit.form.Button");
- </script>
-
-</head>
-<body class="tundra">
-
- <h1 class="testTitle">dojox.image.MagnifierLite test page</h1>
-
- <p>They are just images. It's entirely unobtrusive to add magnification to an image, and style it accordingly.</p>
-
- <p>This is the base class for <a href="test_Magnifier.html">dojox.image.Magnifier</a>, a dojox.gfx-based extension
- this portion does not require the dojox.gfx package, but is limited to CSS-based styling.
- </p>
-
- <p>
- Scale= 2.34, 5.67, and 8.90: <br>
- <img id="testImage" dojoType="dojox.image.MagnifierLite" src="images/spanke.jpg"
- style="width:200px; height:130px;" scale="2.34" />
- <img id="testImage4" dojoType="dojox.image.MagnifierLite" src="images/spanke.jpg"
- style="width:200px; height:130px;" scale="5.67" />
-
- <img id="testImage5" dojoType="dojox.image.MagnifierLite" src="images/spanke.jpg"
- style="width:200px; height:130px;" scale="8.90" />
- </p>
-
- <p>
- <img id="testImage2" dojoType="dojox.image.MagnifierLite" src="images/spanke.jpg"
- style="width:200px; height:130px; padding-right:20px; float:left" />
- I Am Some inline text.<br>lorem ipsum.<br style="clear:both">
- </p>
-
- <p>A Transparent .png: (url unavailable in release versions, need build-utils package, or svn)<br>
-
- <img style="width:400px; height:260px" id="test3"
- dojoType="dojox.image.MagnifierLite" glassSize="215" scale="3"
- src="../../../util/resources/logo/positive/dojo.logo.big.png" />
- </p>
-
- <p>Programatic: (destroy() removes this.domNode)<br>
-
- <button dojoType="dijit.form.Button" id="foob">
- Make It
- <script type="dojo/method" event="onClick">
- this.setAttribute("disabled",true);
- dijit.byId("foobd").setAttribute("disabled",false);
- new dojox.image.MagnifierLite({ scale:4.2, glassSize:200 },"foobar");
- </script>
- </button>
-
- <button dojoType="dijit.form.Button" id="foobd" disabled="disabled">
- Destroy It
- <script type="dojo/method" event="onClick">
- this.setAttribute("disabled",true);
- dijit.byId("foobar").destroy();
- </script>
- </button>
-
- <br /><!-- srcNodeRef : -->
- <img id="foobar" style="width:300px; height:195px;" src="images/spanke.jpg" />
- </p>
-
- <p>Remote file (GTA:LCS/psp map):<br>
- <img style="width:167px; height:240px; border:4px solid #333;"
- src="http://img.qj.net/uploads/articles_module/66700/stauntonhpackages_qjpreviewth.png"
- scale="6" glassSize="150" dojoType="dojox.image.MagnifierLite"
- />
-
- <br>Everybody loves Zelda:<br>
- <img style="width:585px; height:201px" scale="7" glassSize="185" dojoType="dojox.image.MagnifierLite" src="http://www.zelda-infinite.com/games/zelda1/overworld.png" />
- </p>
-
-</body>
-</html>
diff --git a/includes/js/dojox/image/tests/test_SlideShow.html b/includes/js/dojox/image/tests/test_SlideShow.html
deleted file mode 100644
index 9200c4b..0000000
--- a/includes/js/dojox/image/tests/test_SlideShow.html
+++ /dev/null
@@ -1,68 +0,0 @@
-<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
-<html>
-<head>
- <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
- <title>Testing dojox.image.SlideShow</title>
-
- <style type="text/css">
- @import "../../../dijit/tests/css/dijitTests.css";
- @import "../resources/image.css";
- </style>
-
- <script type="text/javascript" src="../../../dojo/dojo.js" djconfig="parseOnLoad:false, isDebug: true, defaultTestTheme: 'soria'"></script>
- <script type="text/javascript" src="../../../dijit/tests/_testCommon.js"></script>
- <script type="text/javascript" src="../SlideShow.js"></script>
- <script type="text/javascript" src="../../../dojo/data/ItemFileReadStore.js"></script>
- <script type="text/javascript" src="../../data/FlickrRestStore.js"></script>
-
- <script type="text/javascript">
- // dojo.require("dojox.image.SlideShow");
- // dojo.require("dojox.data.FlickrRestStore");
- // dojo.require("dojo.data.ItemFileReadStore");
- dojo.require("dojo.parser"); // find widgets
-
- dojo.addOnLoad(function(){
- //Initialize the first SlideShow with an ItemFileReadStore
- dojo.parser.parse(dojo.body());
- dijit.byId('slideshow1').setDataStore(imageItemStore,
- { query: {}, count:20 },
- {
- imageThumbAttr: "thumb",
- imageLargeAttr: "large"
- }
- );
-
- //INitialize the second store with a FlickrRestStore
- var flickrRestStore = new dojox.data.FlickrRestStore();
- var req = {
- query: {
- userid: "44153025@N00",
- apikey: "8c6803164dbc395fb7131c9d54843627"
- },
- count: 20
- };
- dijit.byId('slideshow2').setDataStore(flickrRestStore, req);
- });
-
- </script>
-</head>
-<body>
- <h1 class="testTitle">dojox.image.SlideShow</h1>
-
- <h2>from dojo.data.ItemFileReadStore</h2>
- <div jsId="imageItemStore" dojoType="dojo.data.ItemFileReadStore" url="images.json"></div>
-
- This SlideShow should display five photos, and loop. It should also
- open a URL when the image is clicked. The widget should also resize to
- fit the image.
- <div id="slideshow1" dojoType="dojox.image.SlideShow"></div>
-
- <h2>from dojox.data.FlickrRestStore</h2>
- This SlideShow should display five photos, and not loop. It should also not
- open a URL when the image is clicked. AutoLoading of images is also disabled.
- The time between images in a SlideShow is 1 second. The widget should not resize to fit the image
- <div id="slideshow2" dojoType="dojox.image.SlideShow" noLink="true" loop="false" autoLoad="false"
- slideshowInterval="1" fixedHeight="true"></div>
-
-</body>
-</html>
diff --git a/includes/js/dojox/image/tests/test_ThumbnailPicker.html b/includes/js/dojox/image/tests/test_ThumbnailPicker.html
deleted file mode 100644
index 90cdf2e..0000000
--- a/includes/js/dojox/image/tests/test_ThumbnailPicker.html
+++ /dev/null
@@ -1,134 +0,0 @@
-<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
-<html>
-<head>
- <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
- <title>Testing the ThumbnailPicker</title>
-
- <style type="text/css">
- @import "../../../dijit/tests/css/dijitTests.css";
- @import "../resources/image.css";
- </style>
-
- <script type="text/javascript" src="../../../dojo/dojo.js" djconfig="parseOnLoad:true, isDebug: true, defaultTestTheme:'soria'"></script>
- <script type="text/javascript" src="../../../dijit/tests/_testCommon.js"></script>
- <script type="text/javascript" src="../ThumbnailPicker.js"></script>
-
- <script type="text/javascript">
- // dojo.require("dojox.image.Gallery");
- dojo.require("dojox.data.FlickrRestStore");
- dojo.require("dojo.data.ItemFileReadStore");
- dojo.require("dojo.parser"); // find widgets
-
- /*
- Initializes the ThumbnailPicker with a data store that
- reads from the Flickr REST APIs.
- */
- function initFlickrGallery() {
- var flickrRestStore = new dojox.data.FlickrRestStore();
- var req = {
- query: {
- userid: "44153025@N00",//The Flickr user id to use
- apikey: "8c6803164dbc395fb7131c9d54843627",//An API key is required.
- sort: [
- {
- descending: true //Use descending sort order, ascending is default.
- }
- ],
- tags: ["superhorse", "redbones", "beachvolleyball","dublin","croatia"],
- tag_mode: "any" //Match any of the tags
- },
- count: 20
- };
-
- //Set the flickr data store on two of the dojox.image.ThumbnailPicker widgets
- dijit.byId('thumbPicker1').setDataStore(flickrRestStore, req);
- dijit.byId('thumbPicker3').setDataStore(flickrRestStore, req);
- }
-
- /*
- Initializes the second ThumbnailPicker widget with a data store that
- reads information from a JSON URL. This also tells the ThumbnailPicker
- the name of the JSON attributes to read from each data item retrieved
- from the JSON URL.
- */
- function initItemStoreGallery(){
- var itemRequest = {
- query: {},
- count: 20
- };
- var itemNameMap = {
- imageThumbAttr: "thumb",
- imageLargeAttr: "large"
- };
-
- //Set the dojo.data.ItemFileReadStore on two of the dojox.image.ThumbnailPicker widgets
- //Note the use of the 'itemNameMap', which tells the widget what attributes to
- //read from the store. Look in the 'images.json' file in the same folder as this
- //file to see the data being read by the widget.
- dijit.byId('thumbPicker2').setDataStore(imageItemStore, itemRequest, itemNameMap);
- dijit.byId('thumbPicker4').setDataStore(imageItemStore, itemRequest, itemNameMap);
- }
-
- //Subscribe to clicks on the thumbnails, and print out the information provided
- function doSubscribe(){
- function updateDiv(packet){
- dojo.byId('PublishedData').innerHTML = "You selected the thumbnail:"
- + "<br/><b>Index:</b> " + packet.index
- + "<br/><b>Url:</b> " + packet.url
- + "<br/><b>Large Url:</b> " + packet.largeUrl
- + "<br/><b>Title:</b> " + packet.title
- + "<br/><b>Link:</b> " + packet.link
- ;
- };
-
- //When an image in the ThumbnailPicker is clicked on, it publishes
- //information on the image to a topic, whose name is found by calling
- //the 'getTopicName' function on the widget.
- dojo.subscribe(dijit.byId('thumbPicker1').getClickTopicName(), updateDiv);
- dojo.subscribe(dijit.byId('thumbPicker2').getClickTopicName(), updateDiv);
- }
-
- dojo.addOnLoad(initFlickrGallery);
- dojo.addOnLoad(initItemStoreGallery);
- dojo.addOnLoad(doSubscribe);
- </script>
-</head>
-<body>
- <h1 class="testTitle">dojox.image.ThumbnailPicker</h1>
-
- <div id="PublishedData" style="background-color:light-grey">
- When you click on a thumbnail image, it's information is placed here
- </div>
-
- <h2>From FlickrRestStore:</h2>
- This ThumbnailPicker should have 8 thumbnails, with each of them linking
- to a URL when clicked on. The cursor should also change when over an image.
- <div id="thumbPicker1" dojoType="dojox.image.ThumbnailPicker" size="500"
- useHyperlink="true" ></div>
-
- <h2>From ItemFileReadStore:</h2>
- This ThumbnailPicker should have 5 thumbnails. Clicking on a thumbnail should NOT
- open a URL, and the cursor should not change when over an image that is not an arrow.
-
- <div id="thumbPicker2" dojoType="dojox.image.ThumbnailPicker" size="400"
- isClickable="false"></div>
- <div jsId="imageItemStore" dojoType="dojo.data.ItemFileReadStore" url="images.json"></div>
-
- <h2>From FlickrRestStore:</h2>
- This ThumbnailPicker should have 6 thumbnails, with each of them linking
- to a URL when clicked on. The cursor should also change when over an image.
- Unlike the ThumbnailPicker above, when these links are clicked on, this page
- changes, instead of a popup window.
-
- <div id="thumbPicker3" dojoType="dojox.image.ThumbnailPicker" size="600"
- useHyperLink="true" hyperlinkTarget="this"></div>
-
- <h2>From ItemFileReadStore, and vertical:</h2>
- This ThumbnailPicker should have 5 thumbnails. Clicking on a thumbnail should NOT
- open a URL, and the cursor should not change when over an image that is not an arrow.
- The thumbnails should also be aligned vertically.
- <div id="thumbPicker4" dojoType="dojox.image.ThumbnailPicker" size="300"
- isClickable="false" isHorizontal="false"></div>
-
-</body>
-</html>