dojox/image/Gallery.js

• Provides:

  • dojox.image.Gallery

• Requires:

  • dojo.fx in common in project dojo
  • dijit._Widget in common in project dijit
  • dijit._Templated in common in project dijit
  • dojox.image.ThumbnailPicker in common
  • dojox.image.SlideShow in common

• dojox.image.Gallery

  • type

    Function

  • chains:
    • dijit._Widget: (prototype)
    • dijit._Widget: (call)
    • dijit._Templated: (call)
  • mixins:
    • dijit._Templated.prototype: (prototype)
  • summary

    Gallery widget that wraps a dojox.image.ThumbnailPicker and dojox.image.SlideShow widget

• dojox.image.Gallery.imageHeight

  • type

    Number

  • summary

    Maximum height of an image in the SlideShow widget

• dojox.image.Gallery.imageWidth

  • type

    Number

  • summary

    Maximum width of an image in the SlideShow widget

• dojox.image.Gallery.pageSize

  • type

    Number

  • summary

    The number of records to retrieve from the data store per request.

• dojox.image.Gallery.autoLoad

  • type

    Boolean

  • summary

    If true, images are loaded before the user views them. If false, an
    image is loaded when the user displays it.

• dojox.image.Gallery.linkAttr

  • type

    String

  • summary

    Defines the name of the attribute to request from the store to retrieve the
    URL to link to from an image, if any.

• dojox.image.Gallery.imageThumbAttr

  • type

    String

  • summary

    Defines the name of the attribute to request from the store to retrieve the
    URL to the thumbnail image.

• dojox.image.Gallery.imageLargeAttr

  • type

    String

  • summary

    Defines the name of the attribute to request from the store to retrieve the
    URL to the image.

• dojox.image.Gallery.titleAttr

  • type

    String

  • summary

    Defines the name of the attribute to request from the store to retrieve the
    title of the picture, if any.

• dojox.image.Gallery.slideshowInterval

  • type

    Integer

  • summary

    Time, in seconds, between image changes in the slide show.

• dojox.image.Gallery.templateString

  • summary

• dojox.image.Gallery.postCreate

  • type

    Function

  • source: [view]
      this.widgetid = this.id;
      this.inherited(arguments)
    
      
      this.thumbPicker = new dojox.image.ThumbnailPicker({
       linkAttr: this.linkAttr,
       imageLargeAttr: this.imageLargeAttr,
       imageThumbAttr: this.imageThumbAttr,
       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){
       _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();
  • summary

    Initializes the widget, creates the ThumbnailPicker and SlideShow widgets

• dojox.image.Gallery.setDataStore

  • type

    Function

  • parameters:
    • dataStore: (typeof An)

      implementation of the dojo.data.api.Read API. This accesses the image
      data.

    • request: (typeof An)

      implementation of the dojo.data.api.Request API. This specifies the
      query and paging information to be used by the data store

    • paramNames: (typeof optional)

      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'

  • source: [view]
      this.thumbPicker.setDataStore(dataStore, request, paramNames);
      this.slideShow.setDataStore(dataStore, request, paramNames);
  • summary

    Sets the data store and request objects to read data from.

• dojox.image.Gallery.reset

  • type

    Function

  • source: [view]
      this.slideShow.reset();
      this.thumbPicker.reset();
  • summary

    Resets the widget to its initial state

• dojox.image.Gallery.showNextImage

  • type

    Function

  • parameters:
    • inTimer: (typeof Boolean)

      If true, a slideshow is active, otherwise the slideshow is inactive.

  • source: [view]
      this.slideShow.showNextImage();
  • summary

    Changes the image being displayed in the SlideShow to the next
    image in the data store

• dojox.image.Gallery.toggleSlideshow

  • type

    Function

  • source: [view]
      dojo.deprecated("dojox.widget.Gallery.toggleSlideshow is deprecated. Use toggleSlideShow instead.", "", "2.0");
      this.toggleSlideShow();
  • summary

• dojox.image.Gallery.toggleSlideShow

  • type

    Function

  • source: [view]
      this.slideShow.toggleSlideShow();
  • summary

    Switches the slideshow mode on and off.

• dojox.image.Gallery.showImage

  • type

    Function

  • parameters:
    • index: (typeof )
    • callback: (typeof optional)

      Function
      Optional callback function to call when the image has finished displaying.

  • source: [view]
      this.slideShow.showImage(index, callback);
  • summary

    Shows the image at index 'idx'.
    idx: Number
    The position of the image in the data store to display

• dojox.image.Gallery.resize

  • type

    Function

  • parameters:
    • dim: (typeof )
  • source: [view]
      this.thumbPicker.resize(dim);
  • summary

• dojox.image.Gallery._centerChildren

  • type

    Function

  • source: [view]
      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");
      }
  • summary

    Ensures that the ThumbnailPicker and the SlideShow widgets
    are centered.

• dojox.image.Gallery.widgetid

  • summary

• dojox.image.Gallery.thumbPicker

  • summary

• dojox.image.Gallery.slideShow

  • summary

• dojox.image

  • type

    Object

  • summary

• dojox

  • type

    Object

  • summary