dojox/widget/Toaster.js

  • Provides:

    • dojox.widget.Toaster
  • Requires:

    • dojo.fx in common in project dojo
    • dojo.window in common in project dojo
    • dijit._Widget in common in project dijit
    • dijit._Templated in common in project dijit
  • dojox.widget.Toaster

    • type
      Function
    • chains:
      • dijit._Widget: (prototype)
      • dijit._Widget: (call)
      • dijit._Templated: (call)
    • mixins:
      • dijit._Templated.prototype: (prototype)
    • summary
      Message that slides in from the corner of the screen, used for notifications
      like "new email".
  • dojox.widget.Toaster.templateString

    • summary
  • dojox.widget.Toaster.messageTopic

    • type
      String
    • summary
      Name of topic; anything published to this topic will be displayed as a message.
      Message format is either String or an object like
      {message: "hello word", type: "error", duration: 500}
  • dojox.widget.Toaster.messageTypes

    • type
      Object
    • summary
  • dojox.widget.Toaster.defaultType

    • type
      String
    • summary
      If message type isn't specified (see "messageTopic" parameter),
      then display message as this type.
      Possible values in messageTypes enumeration ("message", "warning", "error", "fatal")
  • dojox.widget.Toaster.positionDirection

    • type
      String
    • summary
      Position from which message slides into screen, one of
      ["br-up", "br-left", "bl-up", "bl-right", "tr-down", "tr-left", "tl-down", "tl-right"]
  • dojox.widget.Toaster.positionDirectionTypes

    • type
      Array
    • summary
      Possible values for positionDirection parameter
  • dojox.widget.Toaster.duration

    • type
      Integer
    • summary
      Number of milliseconds to show message
  • dojox.widget.Toaster.slideDuration

    • type
      Integer
    • summary
      Number of milliseconds for the slide animation, increasing will cause the Toaster
      to slide in more slowly.
  • dojox.widget.Toaster.separator

    • type
      String
    • summary
      String used to separate messages if consecutive calls are made to setContent before previous messages go away
  • dojox.widget.Toaster.postCreate

    • type
      Function
    • source: [view]
         this.inherited(arguments);
         this.hide();

         
         // place node as a child of body for positioning
         dojo.body().appendChild(this.domNode);

         
         if(this.messageTopic){
          dojo.subscribe(this.messageTopic, this, "_handleMessage");
         }
    • summary
  • dojox.widget.Toaster._handleMessage

    • type
      Function
    • parameters:
      • message: (typeof String|Object)
    • source: [view]
         if(dojo.isString(message)){
          this.setContent(message);
         }else{
          this.setContent(message.message, message.type, message.duration);
         }
    • summary
  • dojox.widget.Toaster._capitalize

    • type
      Function
    • parameters:
      • w: (typeof String)
    • source: [view]
          return w.substring(0,1).toUpperCase() + w.substring(1);
    • summary
  • dojox.widget.Toaster.setContent

    • type
      Function
    • parameters:
      • message: (typeof String|Function)
        the message. If this is a function, it will be called with this toaster widget as the only argument.
      • messageType: (typeof String)
        type of message; possible values in messageTypes enumeration ("message", "warning", "error", "fatal")
      • duration: (typeof int)
        duration in milliseconds to display message before removing it. Widget has default value.
    • source: [view]
         duration = duration||this.duration;
         // sync animations so there are no ghosted fades and such
         if(this.slideAnim){
          if(this.slideAnim.status() != "playing"){
           this.slideAnim.stop();
          }
          if(this.slideAnim.status() == "playing" || (this.fadeAnim && this.fadeAnim.status() == "playing")){
           setTimeout(dojo.hitch(this, function(){
            this.setContent(message, messageType, duration);
           }), 50);
           return;
          }
         }


         // determine type of content and apply appropriately
         for(var type in this.messageTypes){
          dojo.removeClass(this.containerNode, "dijitToaster" + this._capitalize(this.messageTypes[type]));
         }


         dojo.style(this.containerNode, "opacity", 1);


         this._setContent(message);


         dojo.addClass(this.containerNode, "dijitToaster" + this._capitalize(messageType || this.defaultType));


         // now do funky animation of widget appearing from
         // bottom right of page and up
         this.show();
         var nodeSize = dojo.marginBox(this.containerNode);
         this._cancelHideTimer();
         if(this.isVisible){
          this._placeClip();
          //update hide timer if no sticky message in stack
          if(!this._stickyMessage) {
           this._setHideTimer(duration);
          }
         }else{
          var style = this.containerNode.style;
          var pd = this.positionDirection;
          // sets up initial position of container node and slide-out direction
          if(pd.indexOf("-up") >= 0){
           style.left=0+"px";
           style.top=nodeSize.h + 10 + "px";
          }else if(pd.indexOf("-left") >= 0){
           style.left=nodeSize.w + 10 +"px";
           style.top=0+"px";
          }else if(pd.indexOf("-right") >= 0){
           style.left = 0 - nodeSize.w - 10 + "px";
           style.top = 0+"px";
          }else if(pd.indexOf("-down") >= 0){
           style.left = 0+"px";
           style.top = 0 - nodeSize.h - 10 + "px";
          }else{
           throw new Error(this.id + ".positionDirection is invalid: " + pd);
          }
          this.slideAnim = dojo.fx.slideTo({
           node: this.containerNode,
           top: 0, left: 0,
           duration: this.slideDuration});
          this.connect(this.slideAnim, "onEnd", function(nodes, anim){
            //we build the fadeAnim here so we dont have to duplicate it later
            // can't do a fadeHide because we're fading the
            // inner node rather than the clipping node
            this.fadeAnim = dojo.fadeOut({
             node: this.containerNode,
             duration: 1000});
            this.connect(this.fadeAnim, "onEnd", function(evt){
             this.isVisible = false;
             this.hide();
            });
            this._setHideTimer(duration);
            this.connect(this, 'onSelect', function(evt){
             this._cancelHideTimer();
             //force clear sticky message
             this._stickyMessage=false;
             this.fadeAnim.play();
            });


            this.isVisible = true;
           });
          this.slideAnim.play();
         }
    • summary
      sets and displays the given message and show duration
  • dojox.widget.Toaster._setContent

    • type
      Function
    • parameters:
      • message: (typeof )
    • source: [view]
         if(dojo.isFunction(message)){
          message(this);
          return;
         }
         if(message && this.isVisible){
          message = this.contentNode.innerHTML + this.separator + message;
         }
         this.contentNode.innerHTML = message;
    • summary
  • dojox.widget.Toaster._cancelHideTimer

    • summary
  • dojox.widget.Toaster._setHideTimer

    • summary
  • dojox.widget.Toaster._placeClip

    • type
      Function
    • source: [view]
         var view = dojo.window.getBox();


         var nodeSize = dojo.marginBox(this.containerNode);


         var style = this.clipNode.style;
         // sets up the size of the clipping node
         style.height = nodeSize.h+"px";
         style.width = nodeSize.w+"px";


         // sets up the position of the clipping node
         var pd = this.positionDirection;
         if(pd.match(/^t/)){
          style.top = view.t+"px";
         }else if(pd.match(/^b/)){
          style.top = (view.h - nodeSize.h - 2 + view.t)+"px";
         }
         if(pd.match(/^[tb]r-/)){
          style.left = (view.w - nodeSize.w - 1 - view.l)+"px";
         }else if(pd.match(/^[tb]l-/)){
          style.left = 0 + "px";
         }


         style.clip = "rect(0px, " + nodeSize.w + "px, " + nodeSize.h + "px, 0px)";
         if(dojo.isIE){
          if(!this.bgIframe){
           this.clipNode.id = dijit.getUniqueId("dojox_widget_Toaster_clipNode");
           this.bgIframe = new dijit.BackgroundIframe(this.clipNode);
          }
          var iframe = this.bgIframe.iframe;
          if(iframe){ iframe.style.display="block"; }
         }
    • summary
  • dojox.widget.Toaster.onSelect

    • type
      Function
    • parameters:
      • e: (typeof Event)
    • source: [view]
         // summary: callback for when user clicks the message
    • summary
      callback for when user clicks the message
  • dojox.widget.Toaster.show

    • type
      Function
    • source: [view]
         dojo.style(this.domNode, 'display', 'block');


         this._placeClip();


         if(!this._scrollConnected){
          this._scrollConnected = dojo.connect(window, "onscroll", this, this._placeClip);
         }
    • summary
      show the Toaster
  • dojox.widget.Toaster.hide

    • type
      Function
    • source: [view]
         dojo.style(this.domNode, 'display', 'none');


         if(this._scrollConnected){
          dojo.disconnect(this._scrollConnected);
          this._scrollConnected = false;
         }


         dojo.style(this.containerNode, "opacity", 1);
    • summary
      hide the Toaster
  • dojox.widget.Toaster.messageTypes.MESSAGE

    • summary
  • dojox.widget.Toaster.messageTypes.WARNING

    • summary
  • dojox.widget.Toaster.messageTypes.ERROR

    • summary
  • dojox.widget.Toaster.messageTypes.FATAL

    • summary
  • dojox.widget.Toaster.slideAnim

    • summary
  • dojox.widget.Toaster.fadeAnim

    • summary
  • dojox.widget.Toaster.isVisible

    • summary
  • dojox.widget.Toaster._stickyMessage

    • summary
  • dojox.widget.Toaster.contentNode.innerHTML

    • summary
  • dojox.widget.Toaster.clipNode.id

    • summary
  • dojox.widget.Toaster.bgIframe

    • summary
  • dojox.widget.Toaster._scrollConnected

    • summary
  • dojox.widget

    • type
      Object
    • summary
  • dojox

    • type
      Object
    • summary