diff options
Diffstat (limited to 'js/dojo-1.6/dojox/av/widget/VolumeButton.xd.js')
| -rw-r--r-- | js/dojo-1.6/dojox/av/widget/VolumeButton.xd.js | 204 |
1 files changed, 204 insertions, 0 deletions
diff --git a/js/dojo-1.6/dojox/av/widget/VolumeButton.xd.js b/js/dojo-1.6/dojox/av/widget/VolumeButton.xd.js new file mode 100644 index 0000000..e752343 --- /dev/null +++ b/js/dojo-1.6/dojox/av/widget/VolumeButton.xd.js @@ -0,0 +1,204 @@ +/*
+ Copyright (c) 2004-2011, The Dojo Foundation All Rights Reserved.
+ Available via Academic Free License >= 2.1 OR the modified BSD license.
+ see: http://dojotoolkit.org/license for details
+*/
+
+
+dojo._xdResourceLoaded(function(dojo, dijit, dojox){
+return {depends: [["provide", "dojox.av.widget.VolumeButton"],
+["require", "dijit._Widget"],
+["require", "dijit._Templated"],
+["require", "dijit.form.Button"]],
+defineResource: function(dojo, dijit, dojox){if(!dojo._hasResource["dojox.av.widget.VolumeButton"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
+dojo._hasResource["dojox.av.widget.VolumeButton"] = true;
+dojo.provide("dojox.av.widget.VolumeButton");
+dojo.require("dijit._Widget");
+dojo.require("dijit._Templated");
+dojo.require("dijit.form.Button");
+
+dojo.declare("dojox.av.widget.VolumeButton", [dijit._Widget, dijit._Templated], {
+ // summary:
+ // A volume widget to use with dojox.av.widget.Player
+ //
+ // description:
+ // Controls and displays the volume of the media. This widget
+ // opens a slider on click that is used to adjust the volume.
+ // The icon changes according to the volume level.
+ //
+ templateString: dojo.cache("dojox.av.widget", "resources/VolumeButton.html", "<div class=\"Volume\" dojoAttachEvent=\"mousedown:onShowVolume\">\r\n\t<div class=\"VolumeSlider\" dojoAttachPoint=\"volumeSlider\">\r\n \t<div class=\"VolumeSliderBack\" dojoAttachPoint=\"volumeSliderBack\"></div>\r\n \t<div class=\"VolumeSliderHandle\" dojoAttachPoint=\"handle\" dojoAttachEvent=\"mousedown:startDrag, mouseup:endDrag, mouseover:handleOver, mouseout:handleOut\"></div>\t\r\n </div>\r\n <div class=\"icon\"></div>\r\n</div>\r\n"),
+ //
+ postCreate: function(){
+ // summary:
+ // Initialize the widget.
+ //
+ this.handleWidth = dojo.marginBox(this.handle).w;
+ this.width = dojo.marginBox(this.volumeSlider).w;
+ this.slotWidth = 100;
+ dojo.setSelectable(this.handle, false);
+ this.volumeSlider = this.domNode.removeChild(this.volumeSlider);
+ },
+ setMedia: function(/* Object */med){
+ // summary:
+ // A common method to set the media in all Player widgets.
+ // May do connections and initializations.
+ //
+ this.media = med;
+ this.updateIcon();
+ },
+ updateIcon: function(/*Float*/ vol){
+ // summary:
+ // Changes the icon on the button according to volume level.
+ //
+ vol = (vol===undefined) ? this.media.volume() : vol;
+ if(vol===0){
+ dojo.attr(this.domNode, "class", "Volume mute");
+ }else if(vol<.334){
+ dojo.attr(this.domNode, "class", "Volume low");
+ }else if(vol<.667){
+ dojo.attr(this.domNode, "class", "Volume med");
+ }else{
+ dojo.attr(this.domNode, "class", "Volume high");
+ }
+ },
+
+ onShowVolume: function(/*DOMEvent*/evt){
+ // summary:
+ // Shows the volume slider.
+ //
+ if(this.showing==undefined){
+ dojo.body().appendChild(this.volumeSlider);
+ this.showing = false;
+ }
+ if(!this.showing){
+
+ var TOPMARG = 2;
+ var LEFTMARG = 7;
+ var vol = this.media.volume();
+ var dim = this._getVolumeDim();
+ var hand = this._getHandleDim();
+ this.x = dim.x - this.width;
+
+
+
+ dojo.style(this.volumeSlider, "display", "");
+ dojo.style(this.volumeSlider, "top", dim.y+"px");
+ dojo.style(this.volumeSlider, "left", (this.x)+"px");
+
+ var x = (this.slotWidth * vol);
+
+ dojo.style(this.handle, "top", (TOPMARG+(hand.w/2))+"px");
+ dojo.style(this.handle, "left", (x+LEFTMARG+(hand.h/2))+"px");
+
+ this.showing = true;
+ //this.startDrag();
+
+ this.clickOff = dojo.connect(dojo.doc, "onmousedown", this, "onDocClick");
+ }else{
+ this.onHideVolume();
+ }
+ },
+ onDocClick: function(/*DOMEvent*/evt){
+ // summary:
+ // Fired on document.onmousedown. Checks if clicked inside
+ // of this widget or not.
+ //
+ if(!dojo.isDescendant(evt.target, this.domNode) && !dojo.isDescendant(evt.target, this.volumeSlider)){
+ this.onHideVolume();
+ }
+ },
+
+ onHideVolume: function(){
+ // summary:
+ // Hides volume slider.
+ //
+ this.endDrag();
+ dojo.style(this.volumeSlider, "display", "none");
+ this.showing = false;
+ },
+
+ onDrag: function(/*DOMEvent*/evt){
+ // summary:
+ // Fired on mousemove. Updates volume and position of
+ // slider handle.
+ var beg = this.handleWidth/2;
+ var end = beg + this.slotWidth
+ var x = evt.clientX - this.x;
+ if(x<beg) x = beg;
+ if(x>end) x=end;
+ dojo.style(this.handle, "left", (x)+"px");
+
+ var p = (x-beg)/(end-beg);
+ this.media.volume(p);
+ this.updateIcon(p);
+ },
+ startDrag: function(){
+ // summary:
+ // Fired on mousedown of the slider handle.
+ //
+ this.isDragging = true;
+ this.cmove = dojo.connect(dojo.doc, "mousemove", this, "onDrag");
+ this.cup = dojo.connect(dojo.doc, "mouseup", this, "endDrag");
+ },
+ endDrag: function(){
+ // summary:
+ // Fired on mouseup of the slider handle.
+ //
+ this.isDragging = false;
+ if(this.cmove) dojo.disconnect(this.cmove);
+ if(this.cup) dojo.disconnect(this.cup);
+ this.handleOut();
+ },
+
+ handleOver: function(){
+ // summary:
+ // Highlights the slider handle on mouseover, and
+ // stays highlighted during drag.
+ //
+ dojo.addClass(this.handle, "over");
+ },
+ handleOut: function(){
+ // summary:
+ // Unhighlights handle onmouseover, or on endDrag.
+ //
+ if(!this.isDragging){
+ dojo.removeClass(this.handle, "over");
+ }
+ },
+
+ _getVolumeDim: function(){
+ // summary:
+ // Gets dimensions of slider background node.
+ // Only uses dojo.coords once, unless the page
+ // or player is resized.
+ //
+ if(this._domCoords){
+ return this._domCoords;
+ }
+ this._domCoords = dojo.coords(this.domNode);
+ return this._domCoords;
+ },
+ _getHandleDim: function(){
+ // summary:
+ // Gets dimensions of slider handle.
+ // Only uses dojo.marginBox once.
+ if(this._handleCoords){
+ return this._handleCoords;
+ }
+ this._handleCoords = dojo.marginBox(this.handle);
+ return this._handleCoords;
+ },
+
+ onResize: function(/*Object*/playerDimensions){
+ // summary:
+ // Fired on player resize. Zeros dimensions
+ // so that it can be calculated again.
+ //
+ this.onHideVolume();
+ this._domCoords = null;
+ }
+});
+
+}
+
+}};});
|