source: Dev/trunk/src/client/dojox/av/widget/Player.js

Last change on this file was 483, checked in by hendrikvanantwerpen, 11 years ago

Added Dojo 1.9.3 release.

File size: 3.8 KB
Line 
1define(['dojo', 'dijit', 'dijit/_Widget', 'dijit/_TemplatedMixin'],function(dojo, dijit, _Widget, _TemplatedMixin){
2
3dojo.experimental("dojox.av.widget.Player");
4
5return dojo.declare("dojox.av.widget.Player", [_Widget, _TemplatedMixin], {
6        // summary:
7        //              A Media Player UI widget for all types of dojox.av and AIR media.
8        // description:
9        //              Currently for markup only. All controls should reside as child
10        //              nodes within the Player node. 'controlType' is used to determine
11        //              the placement of the control. If no type or an unrecognized type
12        //              is used, it will be left-aligned in the same row as the volume.
13        //
14        //              Note:
15        //              Be sure to use 'controlType' as a node attribute. It is not a
16        //              property of the widget.
17        // example:
18        //              |       <div dojoType="dojox.av.widget.Player" playerWidth="100%">
19    //          |               <div controlType="video" initialVolume=".1"
20        //              |                       mediaUrl="video/Grog.flv" autoPlay="true"
21        //              |                       isDebug="false" dojoType="dojox.av.FLVideo"></div>
22    //          |       <div controlType="play" dojoType="dojox.av.widget.PlayButton"></div>
23    //          |       <div controlType="volume" dojoType="dojox.av.widget.VolumeButton"></div>
24    //          |       <div controlType="progress" dojoType="dojox.av.widget.ProgressSlider"></div>
25    //          |       <div controlType="status" dojoType="dojox.av.widget.Status"></div>
26    //          | </div>
27
28        // playerWidth: Number|String
29        //              Sets the width of the player (not the video size)
30        //              Number will be converted to pixels
31        //              String will be used literally. EX: "320px" or "100%"
32        playerWidth: "480px",
33
34        // TODO:
35        //playerHeight
36        //videoWidth: 320,
37        //videoHeight: 240,
38
39        widgetsInTemplate:true,
40        templateString: dojo.cache("dojox.av.widget","resources/Player.html"),
41
42        _fillContent: function(){
43                // summary:
44                //              Finding and collecting child nodes
45                if(!this.items && this.srcNodeRef){
46                        this.items = [];
47                        var nodes = dojo.query("*", this.srcNodeRef);
48                        dojo.forEach(nodes, function(n){
49                                this.items.push(n);
50                        }, this);
51                }
52        },
53
54        postCreate: function(){
55                // summary:
56                //              Do player styling, and place child widgets in the proper location.
57
58                dojo.style(this.domNode, "width", this.playerWidth+(dojo.isString(this.playerWidth)?"":"px"));
59
60                if(dojo.isString(this.playerWidth) && this.playerWidth.indexOf("%")){
61                        dojo.connect(window, "resize", this, "onResize");
62                }
63                this.children = [];
64                var domNode;
65                dojo.forEach(this.items, function(n, i){
66                        n.id = dijit.getUniqueId("player_control");
67                        switch(dojo.attr(n, "controlType")){
68                                case "play":
69                                        this.playContainer.appendChild(n); break;
70                                case "volume" :
71                                        this.controlsBottom.appendChild(n);     break;
72                                case "status" :
73                                        this.statusContainer.appendChild(n);    break;
74                                case "progress":
75                                case "slider":
76                                        this.progressContainer.appendChild(n);  break;
77                                case "video":
78                                        this.mediaNode = n;
79                                        this.playerScreen.appendChild(n);       break;
80                                default:
81
82                        }
83                        this.items[i] = n.id;
84                }, this);
85
86        },
87        startup: function(){
88                // summary:
89                //              Fired when all children are ready. Set the media in
90                //              all children with setMedia()
91
92                this.media = dijit.byId(this.mediaNode.id);
93                if(!dojo.isAIR){
94                        dojo.style(this.media.domNode, "width", "100%");
95                        dojo.style(this.media.domNode, "height", "100%");
96                }
97                dojo.forEach(this.items, function(id){
98                        if(id !== this.mediaNode.id){
99                                var child = dijit.byId(id);
100                                this.children.push(child);
101                                if(child){
102                                        child.setMedia(this.media, this);
103                                }
104                        }
105                }, this);
106        },
107
108        onResize: function(evt){
109                // summary:
110                //              If a player size is a percentage, this will fire an onResize
111                //              event for all children, passing the size of the player.
112
113                var dim = dojo.marginBox(this.domNode);
114                if(this.media && this.media.onResize !== null){
115                        this.media.onResize(dim);
116                }
117                dojo.forEach(this.children, function(child){
118                        if(child.onResize){
119                                child.onResize(dim);
120                        }
121                });
122        }
123
124});
125
126});
Note: See TracBrowser for help on using the repository browser.