X-Git-Url: http://p2p-next.cs.pub.ro/gitweb/?a=blobdiff_plain;f=js%2Fjquery.ui.nsvideo.js;h=ec30d875daf4780176217fe6ca3de0e11799f7c5;hb=954fc0210d9151cb86ca4dad6a955f59ba135915;hp=6edd92b7c324f7675c067e0f5003c96491f6cc2d;hpb=442f9ef1ac6b7b7eb2cdd13434673e1cd0f7758c;p=living-lab-site.git
diff --git a/js/jquery.ui.nsvideo.js b/js/jquery.ui.nsvideo.js
index 6edd92b..ec30d87 100644
--- a/js/jquery.ui.nsvideo.js
+++ b/js/jquery.ui.nsvideo.js
@@ -1,5 +1,5 @@
/*
- * jQuery UI NS-Video @VERSION
+ * jQuery UI NS-Video 1.0.0 beta
*
* Copyright 2011, CÄlin-Andrei Burloiu
* Dual licensed under the MIT or GPL Version 2 licenses.
@@ -13,18 +13,20 @@
(function( $, undefined ) {
$.widget( "ui.nsvideo", {
- version: "@VERSION",
+ version: "1.0.0 beta",
options: {
type: 'ns-html5',
- width: 800,
- height: 600,
- showStatus: true,
+ srcIndex: 0,
+ width: 0,
+ height: 0,
+ minWidth: 0,
+ maxWidth: 0,
+ showState: true,
refreshInterval: 0.1, // seconds
- autoplay: false
+ autoplay: false,
+ initialDuration: "--:--"
},
-
- min: 0,
-
+
_create: function() {
var widget = this;
@@ -54,9 +56,11 @@ $.widget( "ui.nsvideo", {
.slider({
value: 0,
min: 0,
- max: 1000, //Math.floor(widget.$video[0].duration),
+ max: 1000,
slide: function(event, ui) {
widget.videoPlugin('crtTime', [ui.value]);
+ widget.videoPlugin('refreshTime');
+ widget.videoPlugin('refreshState');
}
});
@@ -72,7 +76,7 @@ $.widget( "ui.nsvideo", {
});
// Time information (current and total)
- widget.$time = $('--:-- / --:--
')
+ widget.$time = $('00:00 / ' + widget.options.initialDuration + '
')
.appendTo(widget.$controls);
// Full screen
@@ -86,26 +90,27 @@ $.widget( "ui.nsvideo", {
widget.videoPlugin('fullscreen');
});
- // Video definition buttonset
+ // Video format buttonset
if (typeof widget.options.src == 'object')
{
- var $definitions = $('')
+ var $formats = $('')
.appendTo(widget.$controls);
- $definitions = $('.ui-nsvideo-definitions', $definitions[0]);
+ $formats = $('.ui-nsvideo-formats', $formats[0]);
$.each(widget.options.src, function(index, value) {
- id = widget.element.attr('id') + '-def-' + index;
- $('')
- .appendTo($definitions)
- .attr('checked', (index == widget.options.definition))
+ id = widget.element.attr('id') + '-format-' + index;
+ definition = value.res.substring(value.res.indexOf('x')+1)+'p';
+ $('')
+ .appendTo($formats)
+ .attr('checked', (index == widget.options.srcIndex))
.click(function() {
widget.videoPlugin('pause');
- widget.definition(index);
+ widget.srcIndex(index);
});
- $('')
- .appendTo($definitions);
+ $('')
+ .appendTo($formats);
});
- $definitions.buttonset();
+ $formats.buttonset();
}
// Volume
@@ -132,24 +137,18 @@ $.widget( "ui.nsvideo", {
});
// Status information
- if (widget.options.showStatus)
- {
- widget.$stateText = $('...
')
- .appendTo(widget.$controls)
- .css('cursor', 'pointer')
- .click(function() {
- widget.videoPlugin('refreshAll');
- });
- }
+ widget.$stateText = $('...
')
+ .appendTo(widget.$controls)
+ .css('cursor', 'pointer')
+ .click(function() {
+ widget.videoPlugin('refreshAll');
+ });
+ if (! widget.options.showState)
+ widget.$stateText.hide();
// Clear fix helper
$('')
.appendTo(widget.$controls);
-
- // Initialize video plugin
- widget.$video.ready(function() {
- widget.videoPlugin('init');
- });
},
_destroy: function() {
@@ -192,14 +191,29 @@ $.widget( "ui.nsvideo", {
// Select video source.
// If src option is string, that's the source.
- // If src is an object, properties are definitions and values are
- // sources.
+ // If src is an object, there is a list of associative arrays, each
+ // one having the mandatory keys "src" and "res" (resolution).
var src = widget.crtSrc();
if (src == null)
return widget;
widget.$videoContainer.html('');
+ // Install buttons or not supported message if required
+ if (typeof $.fn.nsinstall == 'function')
+ {
+ widget.$installContainer = $('')
+ .appendTo(widget.$videoContainer);
+ widget.$installContainer
+ .nsinstall({
+ type: widget.options.type,
+ hideIfAlreadyInstalled: true
+ });
+ if (widget.$installContainer.nsinstall('option', 'error')
+ == 'already installed')
+ widget.$installContainer.hide();
+ }
+
var width = widget.options.width;
var height = widget.options.height;
@@ -214,12 +228,15 @@ $.widget( "ui.nsvideo", {
.bind({
ended: function() {
widget.html5.pause();
+ widget.html5.refreshState();
},
play: function() {
widget.html5.play();
+ widget.html5.refreshState();
},
pause: function() {
widget.html5.pause();
+ widget.html5.refreshState();
},
timeupdate: function() {
widget.html5.refreshTime();
@@ -230,16 +247,48 @@ $.widget( "ui.nsvideo", {
loadedmetadata: function() {
widget.html5.refreshTime();
widget.html5.refreshVolume();
- if (widget.options.width == 0)
- widget.element.css('width',
- widget.$video.width() + 8 + 'px');
+ widget.html5.refreshState();
+ widget._setWidgetWidth();
+
+ if (widget.$video[0].error != 3
+ && widget.$video[0].error != 4)
+ widget.$installContainer.hide();
},
seeked: function() {
widget.html5.play();
+ widget.html5.refreshState();
},
volumechange: function() {
widget.html5.refreshVolume();
- }
+ },
+
+ loadstart: function() {
+ widget.html5.refreshState();
+ },
+ suspend: function() {
+ widget.html5.refreshState();
+ },
+ abort: function() {
+ widget.html5.refreshState();
+ },
+ error: function() {
+ widget.html5.refreshState();
+ },
+ emptied: function() {
+ widget.html5.refreshState();
+ },
+ stalled: function() {
+ widget.html5.refreshState();
+ },
+ loadeddata: function() {
+ widget.html5.refreshState();
+ },
+ waiting: function() {
+ widget.html5.refreshState();
+ },
+ seeking: function() {
+ widget.html5.refreshState();
+ },
});
}
// VLC
@@ -270,8 +319,86 @@ $.widget( "ui.nsvideo", {
}
}
- widget.element.css('width',
+ // BUG: this if is because of a NS-VLC bug.
+ if (widget.options.type != 'ns-vlc')
+ widget.$video.css('position', 'relative');
+
+ // Adjust video size for auto-resizing within ranges minWidth and
+ // maxWidth.
+ if ( (width == 0 || height == 0)
+ && (widget.options.minWidth != 0 && widget.options.maxWidth != 0
+ || this.options.type.indexOf('vlc') != -1) )
+ {
+ widget.adjustVideoSizeFromMeta();
+ }
+
+ // Initialize video plugin
+ widget.$video.ready(function() {
+ widget.videoPlugin('init');
+ });
+
+ widget._setWidgetWidth();
+ },
+
+ adjustVideoSizeFromMeta: function() {
+ var widget = this;
+
+ if (typeof widget.options.src == 'object'
+ && (typeof widget.options.src[ widget.options.srcIndex ].res)
+ != 'undefined'
+ && (typeof widget.options.src[ widget.options.srcIndex ].dar)
+ != 'undefined')
+ {
+ var resolution = widget.options.src[ widget.options.srcIndex ].res;
+ var dar = widget.options.src[ widget.options.srcIndex ].dar;
+ var darL = parseInt(
+ dar.substring(0, dar.indexOf(':')));
+ var darR = parseInt(
+ dar.substring(dar.indexOf(':') + 1));
+ var videoHeight = parseInt(
+ resolution.substring(resolution.indexOf('x') + 1));
+ var videoWidth = Math.round(videoHeight * darL / darR);
+
+ // Video width must be between minWidth and maxWidth pixels.
+ if (widget.options.minWidth != 0 && widget.options.maxWidth != 0)
+ {
+ if (videoWidth > widget.options.maxWidth)
+ {
+ videoHeight = Math.round(widget.options.maxWidth / videoWidth
+ * videoHeight);
+ videoWidth = widget.options.maxWidth;
+ }
+ else if (videoWidth < widget.options.minWidth)
+ {
+ videoHeight = Math.round(widget.options.minWidth / videoWidth
+ * videoHeight);
+ videoWidth = widget.options.minWidth;
+ }
+ }
+
+ widget.$video.css('width', videoWidth);
+ widget.$video.css('height', videoHeight);
+ }
+ },
+
+ _setWidgetWidth: function() {
+ if (widget.$video.width() < 640)
+ {
+ widget.element.css('width',
+ 427 + 8 + 'px');//TODO 640 + 8
+ widget.$video.css('left',
+ Math.round(widget.$videoContainer.width()/2
+ - widget.$video.width()/2)
+ + 'px');
+ }
+ else
+ {
+ widget.element.css('width',
widget.$video.width() + 8 + 'px');
+ widget.$video.css('left', '0');
+ }
+
+ this._trigger('resize');
},
setPlayButton: function() {
@@ -332,13 +459,15 @@ $.widget( "ui.nsvideo", {
return null;
},
- definition: function(def) {
+ srcIndex: function(srcIndex) {
var widget = this;
- if (typeof def == 'undefined')
- return widget.options.definition;
+ if (typeof srcIndex == 'undefined')
+ return widget.options.srcIndex;
- widget.options.definition = def;
+ widget.options.srcIndex = srcIndex;
+
+ // Refresh.
widget.video();
return widget;
@@ -350,6 +479,10 @@ $.widget( "ui.nsvideo", {
if (typeof type == 'undefined')
return widget.options.type;
+ widget.videoPlugin('pause');
+ if (widget.vlc.timerHandle)
+ clearTimeout(widget.vlc.timerHandle);
+
widget.options.type = type;
widget.video();
@@ -369,14 +502,14 @@ $.widget( "ui.nsvideo", {
src = widget.options.src;
else if (typeof widget.options.src == 'object')
{
- if (typeof widget.options.definition == 'undefined')
+ if (typeof widget.options.srcIndex == 'undefined')
return null;
- if (typeof widget.options.src[ widget.options.definition ]
+ if (typeof widget.options.src[ widget.options.srcIndex ].src
== 'undefined')
return null;
- src = widget.options.src[ widget.options.definition ];
+ src = widget.options.src[ widget.options.srcIndex ].src;
}
if (widget.options.type == 'ns-html5')
@@ -389,9 +522,34 @@ $.widget( "ui.nsvideo", {
widget: this,
//lastTime: null,
+ ERR_STATES: {
+ MEDIA_ERR_ABORTED: [1, "error: aborted"],
+ MEDIA_ERR_NETWORK: [2, "network error"],
+ MEDIA_ERR_DECODE: [3, "decode error"],
+ MEDIA_ERR_SRC_NOT_SUPPORTED: [4, "error: source not supported"]
+ },
+
+ NETWORK_STATES: {
+ NETWORK_EMPTY: [0, "no data from network"],
+ NETWORK_IDLE: [1, ""],
+ NETWORK_LOADING: [2, "loading..."],
+ NETWORK_LOADED: [3, "loading completed"],
+ NETWORK_NO_SOURCE: [4, "network: no source"]
+ },
+
+ READY_STATES: {
+ HAVE_NOTHING: [0, "please wait..."],
+ HAVE_METADATA: [1, ""],
+ HAVE_CURRENT_DATA: [2, ""],
+ HAVE_FUTURE_DATA: [3, ""],
+ HAVE_ENOUGH_DATA: [4, "have enough data"]
+ },
+
init: function() {
//widget.html5.refreshAll();
+ widget.html5.refreshState();
+
//if (widget.options.autoplay)
// widget.html5.play();
},
@@ -491,8 +649,6 @@ $.widget( "ui.nsvideo", {
widget.html5.refreshState();
widget.html5.refreshVolume();
widget.html5.refreshLoadedProgress();
- widget.$time.html('--:-- / --:--');
- widget.$stateText.html('...');
widget.html5.refreshTime();
},
@@ -534,8 +690,68 @@ $.widget( "ui.nsvideo", {
return widget;
},
+ _state: function(type, code) {
+ var r;
+ $.each(widget.html5[type + '_STATES'], function(index, value) {
+ if ('' + code == '' + value[0])
+ {
+ r = value;
+ return false;
+ }
+ });
+
+ return r;
+ },
+
refreshState: function() {
- // TODO refresh HTML5 plugin state
+ var err = "";
+ var normal = "";
+ var network = "";
+ var ready = "";
+ var state = "";
+
+ if (widget.$video[0].error)
+ err = widget.html5._state('ERR',
+ widget.$video[0].error.code)[1];
+
+ if (! widget.$video[0].paused)
+ normal = "playing...";
+ else
+ {
+ normal = "paused";
+ }
+ if (widget.$video[0].seeking)
+ normal = "seeking";
+ if (widget.$video[0].ended)
+ normal = "ended";
+
+ network = widget.html5._state('NETWORK',
+ widget.$video[0].networkState)[1];
+
+ ready = widget.html5._state('READY',
+ widget.$video[0].readyState)[1];
+
+ if (err !== "")
+ state = err;
+ else
+ {
+ state = normal;
+
+ if (normal !== "" && (network !== "" || ready !== "") )
+ state += ' / ';
+
+ if (network !== "")
+ state += network;
+
+ if (network !== "" && ready !== "")
+ state += ' / ';
+
+ if (ready !== "")
+ state += ready;
+ }
+
+ widget.$stateText
+ .html(state);
return widget;
},
@@ -589,15 +805,17 @@ $.widget( "ui.nsvideo", {
vlc: {
widget: this,
timerHandle: null,
+ idleRefreshInterval: 1, // seconds
STATES: {
- IDLE_CLOSE: [0, "Idle / Close"],
- OPENING: [1, "Opening..."],
- BUFFERING: [2, "Buffering..."],
- PLAYING: [3, "Playing..."],
- PAUSED: [4, "Paused"],
- STOPPING: [5, "Stopping..."],
- ERROR: [6, "Error!"]
+ IDLE: [0, "idle"],
+ OPENING: [1, "opening..."],
+ BUFFERING: [2, "buffering..."],
+ PLAYING: [3, "playing..."],
+ PAUSED: [4, "paused"],
+ STOPPING: [5, "stopping..."],
+ ENDED: [6, "ended"],
+ ERROR: [7, "error!"]
},
init: function() {
@@ -618,6 +836,11 @@ $.widget( "ui.nsvideo", {
},
play: function() {
+ if(typeof widget.$video[0].playlist.isPlaying == 'undefined')
+ return widget;
+
+ widget.$installContainer.hide();
+
if (! widget.$video[0].playlist.isPlaying)
widget.$video[0].playlist.play();
@@ -634,6 +857,9 @@ $.widget( "ui.nsvideo", {
},
pause: function() {
+ if (typeof widget.$video[0].playlist === 'undefined')
+ return widget;
+
if (widget.$video[0].playlist.isPlaying)
widget.$video[0].playlist.togglePause();
@@ -729,7 +955,21 @@ $.widget( "ui.nsvideo", {
widget.options.refreshInterval * 1000);
}
else
- widget.vlc.pause();
+ {
+ if (widget.$video[0].input.state == widget.vlc.STATES.ENDED[0])
+ {
+ widget.vlc.pause();
+ try {
+ widget.$video[0].playlist.stop();
+ } catch(e) {
+ console.log('Exception: ' + e);
+ }
+ }
+
+ widget.vlc.refreshTime();
+ widget.vlc.timerHandle = setTimeout(widget.vlc.refreshHandler,
+ widget.vlc.idleRefreshInterval * 1000);
+ }
widget.vlc.refreshState();
},
@@ -742,8 +982,8 @@ $.widget( "ui.nsvideo", {
try {
widget.vlc.refreshTime();
} catch(e) {
- console.log(e);
- widget.$time.html('--:-- / --:--');
+ console.log('Exception: ' + e);
+ widget.$time.html('00:00 / ' + widget.options.initialDuration);
}
},
@@ -797,6 +1037,8 @@ $.widget( "ui.nsvideo", {
refreshState: function() {
widget.$stateText
.html(widget.vlc._state(widget.$video[0].input.state)[1]);
+
+ return widget;
},
refreshVolume: function() {