| author | hamidouk |
| Mon, 24 Oct 2011 17:26:58 +0200 | |
| branch | popcorn-port |
| changeset 131 | 44c1170e0044 |
| parent 121 | 607f481ef4c3 |
| child 145 | b477c9430d36 |
| permissions | -rw-r--r-- |
| 109 | 1 |
IriSP.PlayerWidget = function(Popcorn, config, Serializer) { |
2 |
IriSP.Widget.call(this, Popcorn, config, Serializer); |
|
3 |
}; |
|
| 115 | 4 |
|
5 |
IriSP.PlayerWidget.prototype = new IriSP.Widget(); |
|
6 |
||
| 98 | 7 |
IriSP.PlayerWidget.prototype.draw = function() { |
8 |
var _this = this; |
|
| 131 | 9 |
var width = this.width; |
10 |
var height = this.height; |
|
11 |
var heightS = this.height-20; |
|
| 98 | 12 |
|
| 131 | 13 |
if (this._config.mode=="radio") { |
| 98 | 14 |
|
| 131 | 15 |
//IriSP.jQuery( "#"+this._config.container ).before(IriSP.search_template); |
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
16 |
var radioPlayer = Mustache.to_html(IriSP.radio_template, {"share_template" : IriSP.share_template}); |
|
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
17 |
this.selector.append(radioPlayer); |
| 98 | 18 |
|
19 |
// special tricks for IE 7 |
|
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
20 |
if (IriSP.jQuery.browser.msie == true && IriSP.jQuery.browser.version == "7.0"){ |
| 98 | 21 |
//LdtSearchContainer |
22 |
//__IriSP.jQuery("#LdtPlayer").attr("margin-top","50px"); |
|
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
23 |
this.selector.children("#Ldt-Root").css("padding-top","25px"); |
| 98 | 24 |
} |
| 131 | 25 |
} else if (this._config.mode == "video") { |
| 98 | 26 |
|
27 |
var videoPlayer = Mustache.to_html(IriSP.video_template, {"share_template" : IriSP.share_template, "heightS" : heightS}); |
|
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
28 |
this.selector.append(videoPlayer); |
| 98 | 29 |
} |
30 |
|
|
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
31 |
this.selector.children("#Ldt-Annotations").width(width - (75 * 2)); |
|
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
32 |
this.selector.children("#Ldt-Show-Arrow-container").width(width - (75 * 2)); |
|
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
33 |
this.selector.children("#Ldt-ShowAnnotation-audio").width(width - 10); |
|
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
34 |
this.selector.children("#Ldt-ShowAnnotation-video").width(width - 10); |
|
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
35 |
this.selector.children("#Ldt-SaKeyword").width(width - 10); |
|
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
36 |
this.selector.children("#Ldt-controler").width(width - 10); |
|
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
37 |
this.selector.children("#Ldt-Control").attr("z-index", "100"); |
|
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
38 |
this.selector.children("#Ldt-controler").hide(); |
| 98 | 39 |
|
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
40 |
this.selector.children("#Ldt-ShowAnnotation-audio").append(IriSP.annotation_loading_template); |
| 98 | 41 |
|
| 131 | 42 |
if(this._config.mode=='radio'){ |
43 |
this.selector.children("#Ldt-load-container").attr("width",this.width); |
|
| 98 | 44 |
} |
45 |
|
|
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
46 |
this.selector.children("#Ldt-controler").show(); |
| 98 | 47 |
//__IriSP.jQuery("#Ldt-Root").css('display','visible'); |
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
48 |
this.selector.children("#Ldt-ShowAnnotation").click( function () { |
| 98 | 49 |
//__IriSP.jQuery(this).slideUp(); |
50 |
} ); |
|
51 |
||
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
52 |
var LdtpPlayerY = this.selector.children("#Ldt-PlaceHolder").attr("top"); |
|
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
53 |
var LdtpPlayerX = this.selector.children("#Ldt-PlaceHolder").attr("left"); |
| 98 | 54 |
|
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
55 |
this.selector.find("#slider-range-min").slider( { //range: "min", |
| 98 | 56 |
value: 0, |
57 |
min: 1, |
|
58 |
max: this._serializer.currentMedia().meta["dc:duration"]/1000,//1:54:52.66 = 3600+3240+ |
|
59 |
step: 0.1, |
|
60 |
slide: function(event, ui) { |
|
61 |
_this._Popcorn.currentTime(ui.value); |
|
62 |
}, |
|
63 |
/* change event is similar to slide, but it happens when the slider position is |
|
64 |
modified programatically. We use it for unit tests */ |
|
65 |
/* |
|
66 |
change: function(event, ui) { |
|
67 |
_this._Popcorn.currentTime(ui.value); |
|
68 |
} |
|
69 |
*/ |
|
70 |
} ); |
|
71 |
|
|
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
72 |
this.selector.children("#amount").val(this.selector.children("#slider-range-min").slider("value")+" s"); |
|
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
73 |
this.selector.children(".Ldt-Control1 button:first").button({ |
| 98 | 74 |
icons: { |
75 |
primary: 'ui-icon-play' |
|
76 |
}, |
|
77 |
text: false |
|
78 |
}).click(function() { _this.playHandler.call(_this); }) |
|
79 |
.next().button({ |
|
80 |
icons: { |
|
81 |
primary: 'ui-icon-seek-next' |
|
82 |
}, |
|
83 |
text: false |
|
84 |
}); |
|
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
85 |
this.selector.children(".Ldt-Control2 button:first").button({ |
| 98 | 86 |
icons: { |
87 |
primary: 'ui-icon-search'//, |
|
88 |
//secondary: 'ui-icon-volume-off' |
|
89 |
}, |
|
90 |
text: false |
|
91 |
}).next().button({ |
|
92 |
icons: { |
|
93 |
primary: 'ui-icon-volume-on' |
|
94 |
}, |
|
95 |
text: false |
|
96 |
}).click(function() { _this.muteHandler.call(_this); } ); |
|
97 |
||
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
98 |
this.selector.children("#ldt-CtrlPlay").attr( "style", "background-color:#CD21C24;" ); |
| 98 | 99 |
|
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
100 |
this.selector.children("#Ldt-load-container").hide(); |
| 98 | 101 |
|
| 131 | 102 |
if( this._config.mode=="radio" & IriSP.jQuery.browser.msie != true ) { |
| 98 | 103 |
IriSP.jQuery( "#Ldtplayer1" ).attr( "height", "0" ); |
104 |
} |
|
105 |
||
106 |
this._Popcorn.listen("timeupdate", IriSP.wrap(this, this.sliderUpdater)); |
|
107 |
}; |
|
108 |
||
109 |
IriSP.PlayerWidget.prototype.playHandler = function() { |
|
110 |
var status = this._Popcorn.media.paused; |
|
111 |
|
|
112 |
if ( status == true ){ |
|
113 |
this._Popcorn.play(); |
|
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
114 |
this.selector.children(".ui-icon-play").css( "background-position", "-16px -160px" ); |
|
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
115 |
this.selector.children("#ldt-CtrlPlay").attr("title", "Play"); |
| 98 | 116 |
} else { |
117 |
this._Popcorn.pause(); |
|
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
118 |
this.selector.children(".ui-icon-play").css( "background-position","0px -160px" ); |
|
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
119 |
this.selector.children("#ldt-CtrlPlay").attr("title", "Pause"); |
| 98 | 120 |
} |
121 |
}; |
|
122 |
||
123 |
IriSP.PlayerWidget.prototype.muteHandler = function() { |
|
124 |
if (!this._Popcorn.muted()) { |
|
125 |
this._Popcorn.mute(true); |
|
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
126 |
this.selector.children(" .ui-icon-volume-on ").css("background-position", "-130px -160px"); |
| 98 | 127 |
} else { |
128 |
this._Popcorn.mute(false); |
|
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
129 |
this.selector.children( ".ui-icon-volume-on" ).css("background-position", "-144px -160px" ); |
| 98 | 130 |
} |
131 |
}; |
|
132 |
||
133 |
IriSP.PlayerWidget.prototype.sliderUpdater = function() { |
|
134 |
var currentPosition = this._Popcorn.currentTime(); |
|
|
121
607f481ef4c3
some refactoring to use this.selector instead of directly using jquery.
hamidouk
parents:
115
diff
changeset
|
135 |
this.selector.find( "#slider-range-min" ).slider( "value", currentPosition); |
| 98 | 136 |
}; |
137 |