From 6e0ff7158c4c71337b23f2d8dd1c623383c8fa2f Mon Sep 17 00:00:00 2001 From: j <0x006A@0x2620.org> Date: Tue, 20 Dec 2011 18:39:26 +0530 Subject: [PATCH 1/4] change video resolution, trigger ended event in player --- source/Ox.UI/js/Video/Ox.VideoEditor.js | 20 ++++++++++++++------ source/Ox.UI/js/Video/Ox.VideoElement.js | 8 ++++---- source/Ox.UI/js/Video/Ox.VideoPanelPlayer.js | 5 +++++ source/Ox.UI/js/Video/Ox.VideoPlayer.js | 6 ++++++ 4 files changed, 29 insertions(+), 10 deletions(-) diff --git a/source/Ox.UI/js/Video/Ox.VideoEditor.js b/source/Ox.UI/js/Video/Ox.VideoEditor.js index 0a928832..dbff9bfc 100644 --- a/source/Ox.UI/js/Video/Ox.VideoEditor.js +++ b/source/Ox.UI/js/Video/Ox.VideoEditor.js @@ -35,6 +35,7 @@ Ox.VideoEditor = function(options, self) { position: 0, posterFrame: 0, posterFrameControls: false, + resolution: 0, showAnnotations: false, showLargeTimeline: true, subtitles: [], @@ -190,6 +191,7 @@ Ox.VideoEditor = function(options, self) { paused: true, position: type == 'play' ? self.options.position : self.options[type], posterFrame: self.options.posterFrame, + resolution: self.options.resolution, showMarkers: true, showMilliseconds: 3, sizeIsLarge: self.options.videoSize == 'large', @@ -215,6 +217,9 @@ Ox.VideoEditor = function(options, self) { changePlayer(data); that.triggerEvent('position', data); }, + resolution: function(data) { + that.triggerEvent('resolution', data); + }, size: toggleSize, volume: function(data) { that.triggerEvent('volume', data); @@ -326,9 +331,10 @@ Ox.VideoEditor = function(options, self) { self.resolutions = []; Ox.forEach(self.options.video, function(url, resolution) { - Ox.Log('Video', url, resolution) + Ox.Log('Video', url, resolution); self.resolutions.push( - {id: resolution + '', title: resolution + 'p'} + {id: resolution + '', title: resolution + 'p', + checked: self.options.resolution == resolution} ); }); @@ -425,6 +431,9 @@ Ox.VideoEditor = function(options, self) { title: 'Keyboard Shortcuts', width: 256 }).open(); + } else if (Ox.getObjectById(self.resolutions, id)) { + //FIXME: uncheck previous resolution + self.$player[0].options({resolution: id}); } } }) @@ -445,13 +454,12 @@ Ox.VideoEditor = function(options, self) { self.$resolutionSelect = Ox.Select({ - items: [{id: '96', title: '96p'},{id: '240', title: '240p'}],//self.resolutions, - width: 48 + items: self.resolutions, + width: 48, }) .css({float: 'left'}) .bindEvent({ - change: function() { - + change: function(data) { } }); //.appendTo(self.$videobar); diff --git a/source/Ox.UI/js/Video/Ox.VideoElement.js b/source/Ox.UI/js/Video/Ox.VideoElement.js index d50e1331..6f5c3681 100644 --- a/source/Ox.UI/js/Video/Ox.VideoElement.js +++ b/source/Ox.UI/js/Video/Ox.VideoElement.js @@ -418,12 +418,12 @@ Ox.VideoElement = function(options, self) { ret = self.video.src; } else { self.options.src = Ox.isArray(arguments[0]) ? arguments[0] : [arguments[0]]; - self.videos[currentPart].src = self.options.src[currentPart]; - self.videos.forEach(function(video, i) { - if (i != currentPart) { + self.$video[self.currentPart].src = self.options.src[self.currentPart]; + self.$video.each(function(video, i) { + if (i != self.currentPart) { video.src = self.options.src[i]; } - }) + }); ret = that; } return ret; diff --git a/source/Ox.UI/js/Video/Ox.VideoPanelPlayer.js b/source/Ox.UI/js/Video/Ox.VideoPanelPlayer.js index ea4dcaea..7898d331 100644 --- a/source/Ox.UI/js/Video/Ox.VideoPanelPlayer.js +++ b/source/Ox.UI/js/Video/Ox.VideoPanelPlayer.js @@ -30,6 +30,7 @@ Ox.VideoPanelPlayer = function(options, self) { playInToOut: false, position: 0, poster: '', + resolution: 0, scaleToFill: false, showAnnotations: true, showTimeline: true, @@ -77,6 +78,7 @@ Ox.VideoPanelPlayer = function(options, self) { out: self.options.out, paused: true, position: self.options.position, + resolution: self.options.resolution, scaleToFill: self.options.scaleToFill, subtitles: self.options.subtitles, timeline: self.options.timeline, @@ -103,6 +105,9 @@ Ox.VideoPanelPlayer = function(options, self) { setPosition(data); that.triggerEvent('position', data); }, + resolution: function(data) { + that.triggerEvent('resolution', data); + }, scale: function(data) { that.triggerEvent('scale', data); }, diff --git a/source/Ox.UI/js/Video/Ox.VideoPlayer.js b/source/Ox.UI/js/Video/Ox.VideoPlayer.js index f764e742..3a689701 100644 --- a/source/Ox.UI/js/Video/Ox.VideoPlayer.js +++ b/source/Ox.UI/js/Video/Ox.VideoPlayer.js @@ -1112,6 +1112,7 @@ Ox.VideoPlayer = function(options, self) { self.iconIsVisible = true; } self.options.rewind && rewind(); + that.triggerEvent('ended'); } function find(query) { @@ -1806,6 +1807,9 @@ Ox.VideoPlayer = function(options, self) { self.$playButton && self.$playButton.options({ disabled: true }); + that.triggerEvent('resolution', { + resolution: self.options.resolution + }); } function setSize($element, css, animate, callback) { @@ -2244,6 +2248,8 @@ Ox.VideoPlayer = function(options, self) { setPosition(value); } else if (key == 'posterFrame') { self.options.paused && setMarkers(); + } else if (key == 'resolution') { + setResolution(); } else if (key == 'scaleToFill') { toggleScale(); } From 87ba2a10ab16f48fde98f51eec78855b99e93c72 Mon Sep 17 00:00:00 2001 From: j <0x006A@0x2620.org> Date: Tue, 20 Dec 2011 19:15:24 +0530 Subject: [PATCH 2/4] video editor resolution toggle --- source/Ox.UI/js/Menu/Ox.MenuButton.js | 14 +++++++++++++- source/Ox.UI/js/Video/Ox.VideoEditor.js | 11 +++++++---- 2 files changed, 20 insertions(+), 5 deletions(-) diff --git a/source/Ox.UI/js/Menu/Ox.MenuButton.js b/source/Ox.UI/js/Menu/Ox.MenuButton.js index 7b1f51b1..20951fa3 100644 --- a/source/Ox.UI/js/Menu/Ox.MenuButton.js +++ b/source/Ox.UI/js/Menu/Ox.MenuButton.js @@ -113,18 +113,30 @@ Ox.MenuButton = function(options, self) { } } + /*@ + checkItem + @*/ that.checkItem = function(id) { self.$menu.checkItem(id); }; + /*@ + disableItem + @*/ that.disableItem = function(id) { self.$menu.getItem(id).options({disabled: true}); }; + /*@ + enableItem + @*/ that.enableItem = function(id) { self.$menu.getItem(id).options({disabled: false}); }; + /*@ + remove + @*/ self.superRemove = that.remove; that.remove = function() { self.$menu.remove(); @@ -133,4 +145,4 @@ Ox.MenuButton = function(options, self) { return that; -}; \ No newline at end of file +}; diff --git a/source/Ox.UI/js/Video/Ox.VideoEditor.js b/source/Ox.UI/js/Video/Ox.VideoEditor.js index dbff9bfc..75bfa2a8 100644 --- a/source/Ox.UI/js/Video/Ox.VideoEditor.js +++ b/source/Ox.UI/js/Video/Ox.VideoEditor.js @@ -396,7 +396,10 @@ Ox.VideoEditor = function(options, self) { {id: 'toggleSize', title: 'Large Player', selected: self.options.playerSize == 'large', keyboard: 'shift +'}, {} ], - self.resolutions, + { + 'id': 'resolution', title:'Resolution', + items: [ { group: 'resolution', min: 1, max: 1, items: self.resolutions } ] + }, [ {}, {id: 'largeTimeline', title: 'Hide Large Timeline', disabled: true}, @@ -431,9 +434,9 @@ Ox.VideoEditor = function(options, self) { title: 'Keyboard Shortcuts', width: 256 }).open(); - } else if (Ox.getObjectById(self.resolutions, id)) { - //FIXME: uncheck previous resolution - self.$player[0].options({resolution: id}); + } else if (id == 'resolution') { + self.options.resolution = parseInt(data.checked[0].id); + self.$player[0].options({resolution: self.options.resolution}); } } }) From 734b08d9c69a5e7db8415e8a6ce9da8087649ec2 Mon Sep 17 00:00:00 2001 From: j <0x006A@0x2620.org> Date: Wed, 21 Dec 2011 16:23:09 +0530 Subject: [PATCH 3/4] remove extra loop --- source/Ox.UI/js/Video/Ox.AnnotationPanel.js | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/source/Ox.UI/js/Video/Ox.AnnotationPanel.js b/source/Ox.UI/js/Video/Ox.AnnotationPanel.js index e1e9dd08..199a1fb9 100644 --- a/source/Ox.UI/js/Video/Ox.AnnotationPanel.js +++ b/source/Ox.UI/js/Video/Ox.AnnotationPanel.js @@ -78,12 +78,7 @@ Ox.AnnotationPanel = function(options, self) { .addClass('OxAnnotation OxTarget'); return $item; }, - items: self.options.items.map(function(v, i) { - return { - id: v.id || i + '', - value: v.value - }; - }), + items: self.options.items, max: 1, unique: 'id' }) From 5168f360535dcd871294011906edac230934a5b7 Mon Sep 17 00:00:00 2001 From: j <0x006A@0x2620.org> Date: Wed, 21 Dec 2011 16:24:17 +0530 Subject: [PATCH 4/4] move api discovery into its own function --- source/Ox.UI/js/Core/Ox.Api.js | 75 ++++++++++++++++++++++++++++++++++ source/Ox.UI/js/Core/Ox.App.js | 54 ++---------------------- 2 files changed, 79 insertions(+), 50 deletions(-) create mode 100644 source/Ox.UI/js/Core/Ox.Api.js diff --git a/source/Ox.UI/js/Core/Ox.Api.js b/source/Ox.UI/js/Core/Ox.Api.js new file mode 100644 index 00000000..2f527dbd --- /dev/null +++ b/source/Ox.UI/js/Core/Ox.Api.js @@ -0,0 +1,75 @@ +// vim: et:ts=4:sw=4:sts=4:ft=javascript +'use strict'; +/*@ +Ox.Api bin remote api to object +options Options object + timeout request timeout + url request url +callback called once api discover is done +@*/ + +Ox.Api = function(options, callback) { + + var self = { + options: Ox.extend({ + timeout: 60000, + type: 'POST', + url: '/api/' + }, options || {}), + time: new Date() + }, + that = { + api: function(callback) { + Ox.Request.send({ + url: self.options.url, + data: { + action: 'api' + }, + callback: callback + }); + }, + cancel: function(id) { + Ox.Request.cancel(id); + } + }; + + $.ajaxSetup({ + timeout: self.options.timeout, + type: self.options.type, + url: self.options.url + }); + + /*@ + api bakcend API + [action] all api requests available on backend + cancel cancel a request + options get or set options + @*/ + that.api(function(result) { + Ox.forEach(result.data.actions, function(val, key) { + that[key] = function(/*data, age, callback*/) { + var data = {}, age = -1, callback = null; + Ox.forEach(arguments, function(argument) { + if (Ox.isObject(argument)) { + data = argument; + } else if (Ox.isNumber(argument)) { + age = argument; + } else if (Ox.isFunction(argument)) { + callback = argument; + } + }); + return Ox.Request.send(Ox.extend({ + age: age, + callback: callback, + data: { + action: key, + data: JSON.stringify(data) + }, + url: self.options.url + }, !val.cache ? {age: 0}: {})); + }; + }); + callback && callback(); + }); + return that; +}; diff --git a/source/Ox.UI/js/Core/Ox.App.js b/source/Ox.UI/js/Core/Ox.App.js index 2d6a4ee8..5766a1df 100644 --- a/source/Ox.UI/js/Core/Ox.App.js +++ b/source/Ox.UI/js/Core/Ox.App.js @@ -20,63 +20,17 @@ Ox.App = function(options) { options: Ox.extend({ timeout: 60000, type: 'POST', - url: '/api/', + url: '/api/' }, options || {}), time: new Date() }, that = Ox.Element({}, Ox.extend({}, self)); - that.api = { - api: function(callback) { - Ox.Request.send({ - url: self.options.url, - data: { - action: 'api' - }, - callback: callback - }); - }, - cancel: function(id) { - Ox.Request.cancel(id); - } - }; - - $.ajaxSetup({ - timeout: self.options.timeout, + that.api = Ox.Api({ type: self.options.type, + timeout: self.options.timeout, url: self.options.url - }); - - /*@ - api bakcend API - [action] all api requests available on backend - cancel cancel a request - options get or set options - @*/ - that.api.api(function(result) { - Ox.forEach(result.data.actions, function(val, key) { - that.api[key] = function(/*data, age, callback*/) { - var data = {}, age = -1, callback = null; - Ox.forEach(arguments, function(argument) { - if (Ox.isObject(argument)) { - data = argument; - } else if (Ox.isNumber(argument)) { - age = argument; - } else if (Ox.isFunction(argument)) { - callback = argument; - } - }); - return Ox.Request.send(Ox.extend({ - age: age, - callback: callback, - data: { - action: key, - data: JSON.stringify(data) - }, - url: self.options.url - }, !val.cache ? {age: 0}: {})); - }; - }); + }, function() { that.api.init(getUserData(), function(result) { //Ox.UI.hideLoadingScreen(); that.triggerEvent({