separated the slider from the playerWidget.
--- a/src/js/widgets/playerWidget.js Thu Nov 10 14:28:08 2011 +0100
+++ b/src/js/widgets/playerWidget.js Thu Nov 10 15:06:22 2011 +0100
@@ -54,28 +54,11 @@
var LdtpPlayerY = this.selector.children("#Ldt-PlaceHolder").attr("top");
var LdtpPlayerX = this.selector.children("#Ldt-PlaceHolder").attr("left");
-
- this.selector.find("#slider-range-min").slider( { //range: "min",
- value: 0,
- min: 1,
- max: this._serializer.currentMedia().meta["dc:duration"]/1000,//1:54:52.66 = 3600+3240+
- step: 0.1,
- slide: function(event, ui) {
- self._Popcorn.currentTime(ui.value);
- },
- /* change event is similar to slide, but it happens when the slider position is
- modified programatically. We use it for unit tests */
- change: function(event, ui) {
- self._Popcorn.trigger("test.fixture", ui.value);
- }
- } );
-
// handle clicks by the user on the video.
this._Popcorn.listen("play", IriSP.wrap(this, this.playButtonUpdater));
this._Popcorn.listen("pause", IriSP.wrap(this, this.playButtonUpdater));
- this._Popcorn.listen("timeupdate", IriSP.wrap(this, this.sliderUpdater));
this.selector.children("#amount").val(this.selector.children("#slider-range-min").slider("value")+" s");
this.selector.children(".Ldt-Control1 button:first").button({
icons: {
@@ -153,12 +136,6 @@
}
};
-/* updates the slider as time passes */
-IriSP.PlayerWidget.prototype.sliderUpdater = function() {
- var currentPosition = this._Popcorn.currentTime();
- this.selector.find( "#slider-range-min" ).slider( "value", currentPosition);
-};
-
IriSP.PlayerWidget.prototype.searchButtonHandler = function() {
var self = this;
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/src/js/widgets/sliderWidget.js Thu Nov 10 15:06:22 2011 +0100
@@ -0,0 +1,33 @@
+IriSP.SliderWidget = function(Popcorn, config, Serializer) {
+ IriSP.Widget.call(this, Popcorn, config, Serializer);
+};
+
+IriSP.SliderWidget.prototype = new IriSP.Widget();
+
+IriSP.SliderWidget.prototype.draw = function() {
+ var self = this;
+
+ this.selector.slider( { //range: "min",
+ value: 0,
+ min: 1,
+ max: this._serializer.currentMedia().meta["dc:duration"]/1000,//1:54:52.66 = 3600+3240+
+ step: 0.1,
+ slide: function(event, ui) {
+ self._Popcorn.currentTime(ui.value);
+ },
+ /* change event is similar to slide, but it happens when the slider position is
+ modified programatically. We use it for unit tests */
+ change: function(event, ui) {
+ self._Popcorn.trigger("test.fixture", ui.value);
+ }
+
+ });
+
+ this._Popcorn.listen("timeupdate", IriSP.wrap(this, this.sliderUpdater));
+};
+
+/* updates the slider as time passes */
+IriSP.SliderWidget.prototype.sliderUpdater = function() {
+ var currentPosition = this._Popcorn.currentTime();
+ this.selector.slider( "value", currentPosition);
+};
\ No newline at end of file
--- a/unittests/index.html Thu Nov 10 14:28:08 2011 +0100
+++ b/unittests/index.html Thu Nov 10 15:06:22 2011 +0100
@@ -32,6 +32,7 @@
<script src="tests/init.js" type="text/javascript"></script>
<script src="tests/tooltipWidget.js" type="text/javascript"></script>
<script src="tests/polemicWidget.js" type="text/javascript"></script>
+ <script src="tests/sliderWidget.js" type="text/javascript"></script>
</head>
<script>
$(document).ready(function(){
@@ -52,6 +53,7 @@
test_init();
test_tooltip_widget();
test_polemic_widget();
+ test_slider_widget();
});
</script>
<body>
--- a/unittests/tests/playerWidget.js Thu Nov 10 14:28:08 2011 +0100
+++ b/unittests/tests/playerWidget.js Thu Nov 10 15:06:22 2011 +0100
@@ -65,16 +65,6 @@
ok(!this.Popcorn.muted(), "the player is un muted");
ok(spy_handler.called, "handling function has been called");
});
-
- test("test slider seeking", function() {
- var player = new IriSP.PlayerWidget(this.Popcorn, this.config, this.ser);
- player.draw();
-
- var spy_callback = this.spy();
- player._Popcorn.listen("test.fixture", spy_callback);
- player.selector.find("#slider-range-min").slider("value", 30);
- ok(spy_callback.called, "handling function has been called");
- });
test("test search button event handler", function() {
var player = new IriSP.PlayerWidget(this.Popcorn, this.config, this.ser);
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/unittests/tests/sliderWidget.js Thu Nov 10 15:06:22 2011 +0100
@@ -0,0 +1,43 @@
+function test_slider_widget() {
+ module("slider widget testing",
+ {setup : function() {
+ this.Popcorn = Popcorn.youtube("#popcorn-div", "http://www.youtube.com/watch?v=QH2-TGUlwu4");
+
+ this.dt = new IriSP.DataLoader();
+ this.ser = new IriSP.MockSerializer(this.dt, "/url"); /* dummy serializer */
+
+ this.config = {
+ metadata:{
+ format:'cinelab',
+ src:'test.json',
+ load:'json'},
+ width:650,
+ height:1,
+ mode:'radio',
+ container:'widget-div',
+ debug:true,
+ css:'../src/css/LdtPlayer.css'}
+ },
+ teardown: function() {
+ /* free the popcorn object because it has signal handlers attached to it */
+ this.Popcorn = Popcorn.youtube("#popcorn-div", "http://www.youtube.com/watch?v=QH2-TGUlwu4");
+ }});
+
+ test("test widget initialization", function() {
+ var widget = new IriSP.SliderWidget(this.Popcorn, this.config, this.ser);
+ widget.draw();
+
+ ok(IriSP.jQuery("#widget-div").hasClass("ui-slider"), "test if the div has been set-up");
+
+ });
+
+ test("test slider seeking", function() {
+ var widget = new IriSP.SliderWidget(this.Popcorn, this.config, this.ser);
+ widget.draw();
+
+ var spy_callback = this.spy();
+ widget._Popcorn.listen("test.fixture", spy_callback);
+ IriSP.jQuery("#widget-div").slider("value", 30);
+ ok(spy_callback.called, "handling function has been called");
+ });
+}
\ No newline at end of file