src_minplayer.playLoader.js.html in HTML5 Media 7
1 /** The minplayer namespace. */
2 var minplayer = minplayer || {};
3
4 /**
5 * @constructor
6 * @extends minplayer.display
7 * @class The play loader base class, which is used to control the busy
8 * cursor, big play button, and the opaque background which shows when the
9 * player is paused.
10 *
11 * @param {object} context The jQuery context.
12 * @param {object} options This components options.
13 */
14 minplayer.playLoader = function(context, options) {
15
16 // Define the flags that control the busy cursor.
17 this.busy = new minplayer.flags();
18
19 // Define the flags that control the big play button.
20 this.bigPlay = new minplayer.flags();
21
22 // Define the flags the control the preview.
23 this.previewFlag = new minplayer.flags();
24
25 /** The preview image. */
26 this.preview = null;
27
28 /** If the playLoader is enabled. */
29 this.enabled = true;
30
31 // Derive from display
32 minplayer.display.call(this, 'playLoader', context, options);
33 };
34
35 /** Derive from minplayer.display. */
36 minplayer.playLoader.prototype = new minplayer.display();
37
38 /** Reset the constructor. */
39 minplayer.playLoader.prototype.constructor = minplayer.playLoader;
40
41 /**
42 * The constructor.
43 */
44 minplayer.playLoader.prototype.construct = function() {
45
46 // Call the media display constructor.
47 minplayer.display.prototype.construct.call(this);
48
49 // Set the plugin name within the options.
50 this.options.pluginName = 'playLoader';
51
52 // Get the media plugin.
53 this.initialize();
54
55 // We are now ready.
56 this.ready();
57 };
58
59 /**
60 * Initialize the playLoader.
61 */
62 minplayer.playLoader.prototype.initialize = function() {
63
64 // Get the media plugin.
65 this.get('media', function(media) {
66
67 // Only bind if this player does not have its own play loader.
68 if (!media.hasPlayLoader(this.options.preview)) {
69
70 // Enable the playLoader.
71 this.enabled = true;
72
73 // Get the poster image.
74 if (!this.options.preview) {
75 this.options.preview = media.elements.media.attr('poster');
76 }
77
78 // Reset the media's poster image.
79 media.elements.media.attr('poster', '');
80
81 // Load the preview image.
82 this.loadPreview();
83
84 // Trigger a play event when someone clicks on the controller.
85 if (this.elements.bigPlay) {
86 minplayer.click(this.elements.bigPlay.unbind(), function(event) {
87 event.preventDefault();
88 minplayer.showAll();
89 jQuery(this).hide();
90 media.play();
91 });
92 }
93
94 // Bind to the player events to control the play loader.
95 media.unbind('loadstart').bind('loadstart', (function(playLoader) {
96 return function(event) {
97 playLoader.busy.setFlag('media', true);
98 playLoader.bigPlay.setFlag('media', true);
99 playLoader.previewFlag.setFlag('media', true);
100 playLoader.checkVisibility();
101 };
102 })(this));
103 media.bind('waiting', (function(playLoader) {
104 return function(event) {
105 playLoader.busy.setFlag('media', true);
106 playLoader.checkVisibility();
107 };
108 })(this));
109 media.bind('loadeddata', (function(playLoader) {
110 return function(event) {
111 playLoader.busy.setFlag('media', false);
112 playLoader.checkVisibility();
113 };
114 })(this));
115 media.bind('playing', (function(playLoader) {
116 return function(event) {
117 playLoader.busy.setFlag('media', false);
118 playLoader.bigPlay.setFlag('media', false);
119 if (media.mediaFile.type !== 'audio') {
120 playLoader.previewFlag.setFlag('media', false);
121 }
122 playLoader.checkVisibility();
123 };
124 })(this));
125 media.bind('pause', (function(playLoader) {
126 return function(event) {
127 playLoader.bigPlay.setFlag('media', true);
128 playLoader.checkVisibility();
129 };
130 })(this));
131 }
132 else {
133
134 // Hide the display.
135 this.enabled = false;
136 this.hide(this.elements.busy);
137 this.hide(this.elements.bigPlay);
138 this.hide(this.elements.preview);
139 this.hide();
140 }
141 });
142 };
143
144 /**
145 * Loads the preview image.
146 *
147 * @return {boolean} Returns true if an image was loaded, false otherwise.
148 */
149 minplayer.playLoader.prototype.loadPreview = function() {
150
151 // Ignore if disabled.
152 if (!this.enabled) {
153 return;
154 }
155
156 // If the preview element exists.
157 if (this.elements.preview) {
158
159 // If there is a preview to show...
160 if (this.options.preview) {
161
162 // Say that this has a preview.
163 this.elements.preview.addClass('has-preview').show();
164
165 // Create a new preview image.
166 this.preview = new minplayer.image(this.elements.preview, this.options);
167
168 // Create the image.
169 this.preview.load(this.options.preview);
170 return true;
171 }
172 else {
173
174 // Hide the preview.
175 this.elements.preview.hide();
176 }
177 }
178
179 return false;
180 };
181
182 /**
183 * Hide or show certain elements based on the state of the busy and big play
184 * button.
185 */
186 minplayer.playLoader.prototype.checkVisibility = function() {
187
188 // Ignore if disabled.
189 if (!this.enabled) {
190 return;
191 }
192
193 // Hide or show the busy cursor based on the flags.
194 if (this.busy.flag) {
195 this.elements.busy.show();
196 }
197 else {
198 this.elements.busy.hide();
199 }
200
201 // Hide or show the big play button based on the flags.
202 if (this.bigPlay.flag) {
203 this.elements.bigPlay.show();
204 }
205 else {
206 this.elements.bigPlay.hide();
207 }
208
209 if (this.previewFlag.flag) {
210 this.elements.preview.show();
211 }
212 else {
213 this.elements.preview.hide();
214 }
215
216 // Show the control either flag is set.
217 if (this.bigPlay.flag || this.busy.flag || this.previewFlag.flag) {
218 this.display.show();
219 }
220
221 // Hide the whole control if both flags are 0.
222 if (!this.bigPlay.flag && !this.busy.flag && !this.previewFlag.flag) {
223 this.display.hide();
224 }
225 };
226
File
player/doc/symbols/src/src_minplayer.playLoader.js.html
View source
<html><head><meta http-equiv="content-type" content="text/html; charset=utf-8"> <style>
.KEYW {color: #933;}
.COMM {color: #bbb; font-style: italic;}
.NUMB {color: #393;}
.STRN {color: #393;}
.REGX {color: #339;}
.line {border-right: 1px dotted #666; color: #666; font-style: normal;}
</style></head><body><pre><span class='line'> 1</span> <span class="COMM">/** The minplayer namespace. */</span><span class="WHIT">
<span class='line'> 2</span> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">minplayer</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">minplayer</span><span class="WHIT"> </span><span class="PUNC">||</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 3</span>
<span class='line'> 4</span> </span><span class="COMM">/**
<span class='line'> 5</span> * @constructor
<span class='line'> 6</span> * @extends minplayer.display
<span class='line'> 7</span> * @class The play loader base class, which is used to control the busy
<span class='line'> 8</span> * cursor, big play button, and the opaque background which shows when the
<span class='line'> 9</span> * player is paused.
<span class='line'> 10</span> *
<span class='line'> 11</span> * @param {object} context The jQuery context.
<span class='line'> 12</span> * @param {object} options This components options.
<span class='line'> 13</span> */</span><span class="WHIT">
<span class='line'> 14</span> </span><span class="NAME">minplayer.playLoader</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">context</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">options</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 15</span>
<span class='line'> 16</span> </span><span class="WHIT"> </span><span class="COMM">// Define the flags that control the busy cursor.</span><span class="WHIT">
<span class='line'> 17</span> </span><span class="WHIT"> </span><span class="NAME">this.busy</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">new</span><span class="WHIT"> </span><span class="NAME">minplayer.flags</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 18</span>
<span class='line'> 19</span> </span><span class="WHIT"> </span><span class="COMM">// Define the flags that control the big play button.</span><span class="WHIT">
<span class='line'> 20</span> </span><span class="WHIT"> </span><span class="NAME">this.bigPlay</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">new</span><span class="WHIT"> </span><span class="NAME">minplayer.flags</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 21</span>
<span class='line'> 22</span> </span><span class="WHIT"> </span><span class="COMM">// Define the flags the control the preview.</span><span class="WHIT">
<span class='line'> 23</span> </span><span class="WHIT"> </span><span class="NAME">this.previewFlag</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">new</span><span class="WHIT"> </span><span class="NAME">minplayer.flags</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 24</span>
<span class='line'> 25</span> </span><span class="WHIT"> </span><span class="COMM">/** The preview image. */</span><span class="WHIT">
<span class='line'> 26</span> </span><span class="WHIT"> </span><span class="NAME">this.preview</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">null</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 27</span>
<span class='line'> 28</span> </span><span class="WHIT"> </span><span class="COMM">/** If the playLoader is enabled. */</span><span class="WHIT">
<span class='line'> 29</span> </span><span class="WHIT"> </span><span class="NAME">this.enabled</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">true</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 30</span>
<span class='line'> 31</span> </span><span class="WHIT"> </span><span class="COMM">// Derive from display</span><span class="WHIT">
<span class='line'> 32</span> </span><span class="WHIT"> </span><span class="NAME">minplayer.display.call</span><span class="PUNC">(</span><span class="KEYW">this</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="STRN">'playLoader'</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">context</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">options</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 33</span> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 34</span>
<span class='line'> 35</span> </span><span class="COMM">/** Derive from minplayer.display. */</span><span class="WHIT">
<span class='line'> 36</span> </span><span class="NAME">minplayer.playLoader.prototype</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">new</span><span class="WHIT"> </span><span class="NAME">minplayer.display</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 37</span>
<span class='line'> 38</span> </span><span class="COMM">/** Reset the constructor. */</span><span class="WHIT">
<span class='line'> 39</span> </span><span class="NAME">minplayer.playLoader.prototype.constructor</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">minplayer.playLoader</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 40</span>
<span class='line'> 41</span> </span><span class="COMM">/**
<span class='line'> 42</span> * The constructor.
<span class='line'> 43</span> */</span><span class="WHIT">
<span class='line'> 44</span> </span><span class="NAME">minplayer.playLoader.prototype.construct</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 45</span>
<span class='line'> 46</span> </span><span class="WHIT"> </span><span class="COMM">// Call the media display constructor.</span><span class="WHIT">
<span class='line'> 47</span> </span><span class="WHIT"> </span><span class="NAME">minplayer.display.prototype.construct.call</span><span class="PUNC">(</span><span class="KEYW">this</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 48</span>
<span class='line'> 49</span> </span><span class="WHIT"> </span><span class="COMM">// Set the plugin name within the options.</span><span class="WHIT">
<span class='line'> 50</span> </span><span class="WHIT"> </span><span class="NAME">this.options.pluginName</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="STRN">'playLoader'</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 51</span>
<span class='line'> 52</span> </span><span class="WHIT"> </span><span class="COMM">// Get the media plugin.</span><span class="WHIT">
<span class='line'> 53</span> </span><span class="WHIT"> </span><span class="NAME">this.initialize</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 54</span>
<span class='line'> 55</span> </span><span class="WHIT"> </span><span class="COMM">// We are now ready.</span><span class="WHIT">
<span class='line'> 56</span> </span><span class="WHIT"> </span><span class="NAME">this.ready</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 57</span> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 58</span>
<span class='line'> 59</span> </span><span class="COMM">/**
<span class='line'> 60</span> * Initialize the playLoader.
<span class='line'> 61</span> */</span><span class="WHIT">
<span class='line'> 62</span> </span><span class="NAME">minplayer.playLoader.prototype.initialize</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 63</span>
<span class='line'> 64</span> </span><span class="WHIT"> </span><span class="COMM">// Get the media plugin.</span><span class="WHIT">
<span class='line'> 65</span> </span><span class="WHIT"> </span><span class="NAME">this.get</span><span class="PUNC">(</span><span class="STRN">'media'</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">media</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 66</span>
<span class='line'> 67</span> </span><span class="WHIT"> </span><span class="COMM">// Only bind if this player does not have its own play loader.</span><span class="WHIT">
<span class='line'> 68</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="PUNC">!</span><span class="NAME">media.hasPlayLoader</span><span class="PUNC">(</span><span class="NAME">this.options.preview</span><span class="PUNC">)</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 69</span>
<span class='line'> 70</span> </span><span class="WHIT"> </span><span class="COMM">// Enable the playLoader.</span><span class="WHIT">
<span class='line'> 71</span> </span><span class="WHIT"> </span><span class="NAME">this.enabled</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">true</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 72</span>
<span class='line'> 73</span> </span><span class="WHIT"> </span><span class="COMM">// Get the poster image.</span><span class="WHIT">
<span class='line'> 74</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="PUNC">!</span><span class="NAME">this.options.preview</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 75</span> </span><span class="WHIT"> </span><span class="NAME">this.options.preview</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">media.elements.media.attr</span><span class="PUNC">(</span><span class="STRN">'poster'</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 76</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'> 77</span>
<span class='line'> 78</span> </span><span class="WHIT"> </span><span class="COMM">// Reset the media's poster image.</span><span class="WHIT">
<span class='line'> 79</span> </span><span class="WHIT"> </span><span class="NAME">media.elements.media.attr</span><span class="PUNC">(</span><span class="STRN">'poster'</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="STRN">''</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 80</span>
<span class='line'> 81</span> </span><span class="WHIT"> </span><span class="COMM">// Load the preview image.</span><span class="WHIT">
<span class='line'> 82</span> </span><span class="WHIT"> </span><span class="NAME">this.loadPreview</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 83</span>
<span class='line'> 84</span> </span><span class="WHIT"> </span><span class="COMM">// Trigger a play event when someone clicks on the controller.</span><span class="WHIT">
<span class='line'> 85</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">this.elements.bigPlay</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 86</span> </span><span class="WHIT"> </span><span class="NAME">minplayer.click</span><span class="PUNC">(</span><span class="NAME">this.elements.bigPlay.unbind</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">event</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 87</span> </span><span class="WHIT"> </span><span class="NAME">event.preventDefault</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 88</span> </span><span class="WHIT"> </span><span class="NAME">minplayer.showAll</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 89</span> </span><span class="WHIT"> </span><span class="NAME">jQuery</span><span class="PUNC">(</span><span class="KEYW">this</span><span class="PUNC">)</span><span class="PUNC">.</span><span class="NAME">hide</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 90</span> </span><span class="WHIT"> </span><span class="NAME">media.play</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 91</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 92</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'> 93</span>
<span class='line'> 94</span> </span><span class="WHIT"> </span><span class="COMM">// Bind to the player events to control the play loader.</span><span class="WHIT">
<span class='line'> 95</span> </span><span class="WHIT"> </span><span class="NAME">media.unbind</span><span class="PUNC">(</span><span class="STRN">'loadstart'</span><span class="PUNC">)</span><span class="PUNC">.</span><span class="NAME">bind</span><span class="PUNC">(</span><span class="STRN">'loadstart'</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">playLoader</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 96</span> </span><span class="WHIT"> </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">event</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 97</span> </span><span class="WHIT"> </span><span class="NAME">playLoader.busy.setFlag</span><span class="PUNC">(</span><span class="STRN">'media'</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="KEYW">true</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 98</span> </span><span class="WHIT"> </span><span class="NAME">playLoader.bigPlay.setFlag</span><span class="PUNC">(</span><span class="STRN">'media'</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="KEYW">true</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 99</span> </span><span class="WHIT"> </span><span class="NAME">playLoader.previewFlag.setFlag</span><span class="PUNC">(</span><span class="STRN">'media'</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="KEYW">true</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>100</span> </span><span class="WHIT"> </span><span class="NAME">playLoader.checkVisibility</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>101</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>102</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="PUNC">(</span><span class="KEYW">this</span><span class="PUNC">)</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>103</span> </span><span class="WHIT"> </span><span class="NAME">media.bind</span><span class="PUNC">(</span><span class="STRN">'waiting'</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">playLoader</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>104</span> </span><span class="WHIT"> </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">event</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>105</span> </span><span class="WHIT"> </span><span class="NAME">playLoader.busy.setFlag</span><span class="PUNC">(</span><span class="STRN">'media'</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="KEYW">true</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>106</span> </span><span class="WHIT"> </span><span class="NAME">playLoader.checkVisibility</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>107</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>108</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="PUNC">(</span><span class="KEYW">this</span><span class="PUNC">)</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>109</span> </span><span class="WHIT"> </span><span class="NAME">media.bind</span><span class="PUNC">(</span><span class="STRN">'loadeddata'</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">playLoader</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>110</span> </span><span class="WHIT"> </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">event</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>111</span> </span><span class="WHIT"> </span><span class="NAME">playLoader.busy.setFlag</span><span class="PUNC">(</span><span class="STRN">'media'</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="KEYW">false</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>112</span> </span><span class="WHIT"> </span><span class="NAME">playLoader.checkVisibility</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>113</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>114</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="PUNC">(</span><span class="KEYW">this</span><span class="PUNC">)</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>115</span> </span><span class="WHIT"> </span><span class="NAME">media.bind</span><span class="PUNC">(</span><span class="STRN">'playing'</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">playLoader</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>116</span> </span><span class="WHIT"> </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">event</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>117</span> </span><span class="WHIT"> </span><span class="NAME">playLoader.busy.setFlag</span><span class="PUNC">(</span><span class="STRN">'media'</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="KEYW">false</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>118</span> </span><span class="WHIT"> </span><span class="NAME">playLoader.bigPlay.setFlag</span><span class="PUNC">(</span><span class="STRN">'media'</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="KEYW">false</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>119</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">media.mediaFile.type</span><span class="WHIT"> </span><span class="PUNC">!==</span><span class="WHIT"> </span><span class="STRN">'audio'</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>120</span> </span><span class="WHIT"> </span><span class="NAME">playLoader.previewFlag.setFlag</span><span class="PUNC">(</span><span class="STRN">'media'</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="KEYW">false</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>121</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>122</span> </span><span class="WHIT"> </span><span class="NAME">playLoader.checkVisibility</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>123</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>124</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="PUNC">(</span><span class="KEYW">this</span><span class="PUNC">)</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>125</span> </span><span class="WHIT"> </span><span class="NAME">media.bind</span><span class="PUNC">(</span><span class="STRN">'pause'</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">playLoader</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>126</span> </span><span class="WHIT"> </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="NAME">event</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>127</span> </span><span class="WHIT"> </span><span class="NAME">playLoader.bigPlay.setFlag</span><span class="PUNC">(</span><span class="STRN">'media'</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="KEYW">true</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>128</span> </span><span class="WHIT"> </span><span class="NAME">playLoader.checkVisibility</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>129</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>130</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="PUNC">(</span><span class="KEYW">this</span><span class="PUNC">)</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>131</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>132</span> </span><span class="WHIT"> </span><span class="KEYW">else</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>133</span>
<span class='line'>134</span> </span><span class="WHIT"> </span><span class="COMM">// Hide the display.</span><span class="WHIT">
<span class='line'>135</span> </span><span class="WHIT"> </span><span class="NAME">this.enabled</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">false</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>136</span> </span><span class="WHIT"> </span><span class="NAME">this.hide</span><span class="PUNC">(</span><span class="NAME">this.elements.busy</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>137</span> </span><span class="WHIT"> </span><span class="NAME">this.hide</span><span class="PUNC">(</span><span class="NAME">this.elements.bigPlay</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>138</span> </span><span class="WHIT"> </span><span class="NAME">this.hide</span><span class="PUNC">(</span><span class="NAME">this.elements.preview</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>139</span> </span><span class="WHIT"> </span><span class="NAME">this.hide</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>140</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>141</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>142</span> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>143</span>
<span class='line'>144</span> </span><span class="COMM">/**
<span class='line'>145</span> * Loads the preview image.
<span class='line'>146</span> *
<span class='line'>147</span> * @return {boolean} Returns true if an image was loaded, false otherwise.
<span class='line'>148</span> */</span><span class="WHIT">
<span class='line'>149</span> </span><span class="NAME">minplayer.playLoader.prototype.loadPreview</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>150</span>
<span class='line'>151</span> </span><span class="WHIT"> </span><span class="COMM">// Ignore if disabled.</span><span class="WHIT">
<span class='line'>152</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="PUNC">!</span><span class="NAME">this.enabled</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>153</span> </span><span class="WHIT"> </span><span class="KEYW">return</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>154</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>155</span>
<span class='line'>156</span> </span><span class="WHIT"> </span><span class="COMM">// If the preview element exists.</span><span class="WHIT">
<span class='line'>157</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">this.elements.preview</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>158</span>
<span class='line'>159</span> </span><span class="WHIT"> </span><span class="COMM">// If there is a preview to show...</span><span class="WHIT">
<span class='line'>160</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">this.options.preview</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>161</span>
<span class='line'>162</span> </span><span class="WHIT"> </span><span class="COMM">// Say that this has a preview.</span><span class="WHIT">
<span class='line'>163</span> </span><span class="WHIT"> </span><span class="NAME">this.elements.preview.addClass</span><span class="PUNC">(</span><span class="STRN">'has-preview'</span><span class="PUNC">)</span><span class="PUNC">.</span><span class="NAME">show</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>164</span>
<span class='line'>165</span> </span><span class="WHIT"> </span><span class="COMM">// Create a new preview image.</span><span class="WHIT">
<span class='line'>166</span> </span><span class="WHIT"> </span><span class="NAME">this.preview</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">new</span><span class="WHIT"> </span><span class="NAME">minplayer.image</span><span class="PUNC">(</span><span class="NAME">this.elements.preview</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">this.options</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>167</span>
<span class='line'>168</span> </span><span class="WHIT"> </span><span class="COMM">// Create the image.</span><span class="WHIT">
<span class='line'>169</span> </span><span class="WHIT"> </span><span class="NAME">this.preview.load</span><span class="PUNC">(</span><span class="NAME">this.options.preview</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>170</span> </span><span class="WHIT"> </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="KEYW">true</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>171</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>172</span> </span><span class="WHIT"> </span><span class="KEYW">else</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>173</span>
<span class='line'>174</span> </span><span class="WHIT"> </span><span class="COMM">// Hide the preview.</span><span class="WHIT">
<span class='line'>175</span> </span><span class="WHIT"> </span><span class="NAME">this.elements.preview.hide</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>176</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>177</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>178</span>
<span class='line'>179</span> </span><span class="WHIT"> </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="KEYW">false</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>180</span> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>181</span>
<span class='line'>182</span> </span><span class="COMM">/**
<span class='line'>183</span> * Hide or show certain elements based on the state of the busy and big play
<span class='line'>184</span> * button.
<span class='line'>185</span> */</span><span class="WHIT">
<span class='line'>186</span> </span><span class="NAME">minplayer.playLoader.prototype.checkVisibility</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>187</span>
<span class='line'>188</span> </span><span class="WHIT"> </span><span class="COMM">// Ignore if disabled.</span><span class="WHIT">
<span class='line'>189</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="PUNC">!</span><span class="NAME">this.enabled</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>190</span> </span><span class="WHIT"> </span><span class="KEYW">return</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>191</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>192</span>
<span class='line'>193</span> </span><span class="WHIT"> </span><span class="COMM">// Hide or show the busy cursor based on the flags.</span><span class="WHIT">
<span class='line'>194</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">this.busy.flag</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>195</span> </span><span class="WHIT"> </span><span class="NAME">this.elements.busy.show</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>196</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>197</span> </span><span class="WHIT"> </span><span class="KEYW">else</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>198</span> </span><span class="WHIT"> </span><span class="NAME">this.elements.busy.hide</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>199</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>200</span>
<span class='line'>201</span> </span><span class="WHIT"> </span><span class="COMM">// Hide or show the big play button based on the flags.</span><span class="WHIT">
<span class='line'>202</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">this.bigPlay.flag</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>203</span> </span><span class="WHIT"> </span><span class="NAME">this.elements.bigPlay.show</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>204</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>205</span> </span><span class="WHIT"> </span><span class="KEYW">else</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>206</span> </span><span class="WHIT"> </span><span class="NAME">this.elements.bigPlay.hide</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>207</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>208</span>
<span class='line'>209</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">this.previewFlag.flag</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>210</span> </span><span class="WHIT"> </span><span class="NAME">this.elements.preview.show</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>211</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>212</span> </span><span class="WHIT"> </span><span class="KEYW">else</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>213</span> </span><span class="WHIT"> </span><span class="NAME">this.elements.preview.hide</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>214</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>215</span>
<span class='line'>216</span> </span><span class="WHIT"> </span><span class="COMM">// Show the control either flag is set.</span><span class="WHIT">
<span class='line'>217</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">this.bigPlay.flag</span><span class="WHIT"> </span><span class="PUNC">||</span><span class="WHIT"> </span><span class="NAME">this.busy.flag</span><span class="WHIT"> </span><span class="PUNC">||</span><span class="WHIT"> </span><span class="NAME">this.previewFlag.flag</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>218</span> </span><span class="WHIT"> </span><span class="NAME">this.display.show</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>219</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>220</span>
<span class='line'>221</span> </span><span class="WHIT"> </span><span class="COMM">// Hide the whole control if both flags are 0.</span><span class="WHIT">
<span class='line'>222</span> </span><span class="WHIT"> </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="PUNC">!</span><span class="NAME">this.bigPlay.flag</span><span class="WHIT"> </span><span class="PUNC">&&</span><span class="WHIT"> </span><span class="PUNC">!</span><span class="NAME">this.busy.flag</span><span class="WHIT"> </span><span class="PUNC">&&</span><span class="WHIT"> </span><span class="PUNC">!</span><span class="NAME">this.previewFlag.flag</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>223</span> </span><span class="WHIT"> </span><span class="NAME">this.display.hide</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>224</span> </span><span class="WHIT"> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>225</span> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>226</span> </span></pre></body></html>
