add timeline item view
This commit is contained in:
parent
f5f6ff468f
commit
707fdd95ed
9 changed files with 36 additions and 19 deletions
|
@ -560,6 +560,7 @@
|
||||||
"itemViews": [
|
"itemViews": [
|
||||||
{"id": "info", "title": "Info"},
|
{"id": "info", "title": "Info"},
|
||||||
{"id": "clips", "title": "Clips"},
|
{"id": "clips", "title": "Clips"},
|
||||||
|
{"id": "timeline", "title": "Timeline"},
|
||||||
{"id": "player", "title": "Player"},
|
{"id": "player", "title": "Player"},
|
||||||
{"id": "editor", "title": "Editor"},
|
{"id": "editor", "title": "Editor"},
|
||||||
{"id": "map", "title": "Map"},
|
{"id": "map", "title": "Map"},
|
||||||
|
|
|
@ -474,6 +474,7 @@
|
||||||
"itemViews": [
|
"itemViews": [
|
||||||
{"id": "info", "title": "Info"},
|
{"id": "info", "title": "Info"},
|
||||||
{"id": "clips", "title": "Clips"},
|
{"id": "clips", "title": "Clips"},
|
||||||
|
{"id": "timeline", "title": "Timeline"},
|
||||||
{"id": "player", "title": "Player"},
|
{"id": "player", "title": "Player"},
|
||||||
{"id": "editor", "title": "Editor"},
|
{"id": "editor", "title": "Editor"},
|
||||||
{"id": "map", "title": "Map"},
|
{"id": "map", "title": "Map"},
|
||||||
|
|
|
@ -125,7 +125,7 @@ pandora.UI = (function() {
|
||||||
add['lists.' + that.encode(list) + '.selection'] = [args.item];
|
add['lists.' + that.encode(list) + '.selection'] = [args.item];
|
||||||
if (
|
if (
|
||||||
!args.itemView
|
!args.itemView
|
||||||
&& ['player', 'editor'].indexOf(pandora.user.ui.itemView) > -1
|
&& ['timeline', 'player', 'editor'].indexOf(pandora.user.ui.itemView) > -1
|
||||||
&& !pandora.user.ui.videoPoints[item]
|
&& !pandora.user.ui.videoPoints[item]
|
||||||
&& !args['videoPoints.' + item]
|
&& !args['videoPoints.' + item]
|
||||||
) {
|
) {
|
||||||
|
@ -136,7 +136,7 @@ pandora.UI = (function() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (['player', 'editor'].indexOf(args.itemView) > -1) {
|
if (['timeline', 'player', 'editor'].indexOf(args.itemView) > -1) {
|
||||||
// when switching to a video view, add it as default video view
|
// when switching to a video view, add it as default video view
|
||||||
args.videoView = args.itemView;
|
args.videoView = args.itemView;
|
||||||
if (
|
if (
|
||||||
|
|
|
@ -37,7 +37,7 @@ pandora.URL = (function() {
|
||||||
: '';
|
: '';
|
||||||
} else if (state.view == 'calendar') {
|
} else if (state.view == 'calendar') {
|
||||||
// ...
|
// ...
|
||||||
} else if (['player', 'editor'].indexOf(state.view) > -1) {
|
} else if (['timeline', 'player', 'editor'].indexOf(state.view) > -1) {
|
||||||
var videoPoints = pandora.user.ui.videoPoints[state.item] || {};
|
var videoPoints = pandora.user.ui.videoPoints[state.item] || {};
|
||||||
state.span = videoPoints.annotation || Ox.merge(
|
state.span = videoPoints.annotation || Ox.merge(
|
||||||
videoPoints.position
|
videoPoints.position
|
||||||
|
@ -89,7 +89,7 @@ pandora.URL = (function() {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (state.span) {
|
if (state.span) {
|
||||||
if (['player', 'editor'].indexOf(state.view) > -1) {
|
if (['timeline', 'player', 'editor'].indexOf(state.view) > -1) {
|
||||||
if (Ox.isArray(state.span)) {
|
if (Ox.isArray(state.span)) {
|
||||||
set['videoPoints.' + state.item] = {
|
set['videoPoints.' + state.item] = {
|
||||||
annotation: '',
|
annotation: '',
|
||||||
|
@ -226,6 +226,7 @@ pandora.URL = (function() {
|
||||||
calendar: 'date'
|
calendar: 'date'
|
||||||
},
|
},
|
||||||
item: {
|
item: {
|
||||||
|
timeline: 'duration',
|
||||||
player: 'duration',
|
player: 'duration',
|
||||||
editor: 'duration',
|
editor: 'duration',
|
||||||
map: 'location',
|
map: 'location',
|
||||||
|
|
|
@ -89,7 +89,7 @@ pandora.ui.info = function() {
|
||||||
'videoPoints.' + id,
|
'videoPoints.' + id,
|
||||||
{'in': 0, out: 0, position: data.position}
|
{'in': 0, out: 0, position: data.position}
|
||||||
);
|
);
|
||||||
if (ui.item && ['player', 'editor'].indexOf(ui.itemView) > -1) {
|
if (ui.item && ['timeline', 'player', 'editor'].indexOf(ui.itemView) > -1) {
|
||||||
pandora.$ui[ui.itemView].options({
|
pandora.$ui[ui.itemView].options({
|
||||||
position: data.position
|
position: data.position
|
||||||
});
|
});
|
||||||
|
|
|
@ -4,7 +4,9 @@
|
||||||
pandora.ui.item = function() {
|
pandora.ui.item = function() {
|
||||||
|
|
||||||
var that = Ox.Element(),
|
var that = Ox.Element(),
|
||||||
isVideoView = ['player', 'editor'].indexOf(pandora.user.ui.itemView) > -1;
|
isVideoView = [
|
||||||
|
'timeline', 'player', 'editor'
|
||||||
|
].indexOf(pandora.user.ui.itemView) > -1;
|
||||||
|
|
||||||
pandora.api.get({
|
pandora.api.get({
|
||||||
id: pandora.user.ui.item,
|
id: pandora.user.ui.item,
|
||||||
|
@ -50,7 +52,7 @@ pandora.ui.item = function() {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!result.data.rendered && [
|
if (!result.data.rendered && [
|
||||||
'clips', 'map', 'player', 'editor'
|
'clips', 'timeline', 'player', 'editor', 'map', 'calendar'
|
||||||
].indexOf(pandora.user.ui.itemView) > -1) {
|
].indexOf(pandora.user.ui.itemView) > -1) {
|
||||||
pandora.$ui.contentPanel.replaceElement(1,
|
pandora.$ui.contentPanel.replaceElement(1,
|
||||||
Ox.Element()
|
Ox.Element()
|
||||||
|
@ -125,6 +127,12 @@ pandora.ui.item = function() {
|
||||||
pandora.ui.clipsView(result.data.videoRatio)
|
pandora.ui.clipsView(result.data.videoRatio)
|
||||||
);
|
);
|
||||||
|
|
||||||
|
} else if (pandora.user.ui.itemView == 'timeline') {
|
||||||
|
|
||||||
|
pandora.$ui.contentPanel.replaceElement(1,
|
||||||
|
pandora.$ui.editor = pandora.ui.timeline(result.data)
|
||||||
|
);
|
||||||
|
|
||||||
} else if (pandora.user.ui.itemView == 'player') {
|
} else if (pandora.user.ui.itemView == 'player') {
|
||||||
|
|
||||||
pandora.$ui.contentPanel.replaceElement(1,
|
pandora.$ui.contentPanel.replaceElement(1,
|
||||||
|
|
|
@ -87,7 +87,7 @@ pandora.ui.mainMenu = function() {
|
||||||
}) },
|
}) },
|
||||||
] },
|
] },
|
||||||
{ id: 'clips', title: 'Open Clips', items: [
|
{ id: 'clips', title: 'Open Clips', items: [
|
||||||
{ group: 'videoview', min: 1, max: 1, items: ['player', 'editor'].map(function(view) {
|
{ group: 'videoview', min: 1, max: 1, items: ['timeline', 'player', 'editor'].map(function(view) {
|
||||||
return {id: view, title: Ox.toTitleCase(view), checked: ui.videoView == view};
|
return {id: view, title: Ox.toTitleCase(view), checked: ui.videoView == view};
|
||||||
}) }
|
}) }
|
||||||
] },
|
] },
|
||||||
|
@ -442,8 +442,8 @@ pandora.ui.mainMenu = function() {
|
||||||
},
|
},
|
||||||
pandora_itemview: function(data) {
|
pandora_itemview: function(data) {
|
||||||
var action,
|
var action,
|
||||||
isVideoView = ['player', 'editor'].indexOf(data.value) > -1,
|
isVideoView = ['timeline', 'player', 'editor'].indexOf(data.value) > -1,
|
||||||
wasVideoView = ['player', 'editor'].indexOf(data.previousValue) > -1;
|
wasVideoView = ['timeline', 'player', 'editor'].indexOf(data.previousValue) > -1;
|
||||||
that.checkItem('viewMenu_item_' + data.value);
|
that.checkItem('viewMenu_item_' + data.value);
|
||||||
if (isVideoView) {
|
if (isVideoView) {
|
||||||
that.checkItem('viewMenu_clips_' + data.value);
|
that.checkItem('viewMenu_clips_' + data.value);
|
||||||
|
@ -451,7 +451,7 @@ pandora.ui.mainMenu = function() {
|
||||||
if (isVideoView != wasVideoView) {
|
if (isVideoView != wasVideoView) {
|
||||||
that[isVideoView ? 'enableItem' : 'disableItem']('showannotations');
|
that[isVideoView ? 'enableItem' : 'disableItem']('showannotations');
|
||||||
}
|
}
|
||||||
if ((data.value == 'video') != (data.previousValue == 'video')) {
|
if ((data.value == 'player') != (data.previousValue == 'player')) {
|
||||||
action = data.value == 'player' ? 'enableItem' : 'disableItem';
|
action = data.value == 'player' ? 'enableItem' : 'disableItem';
|
||||||
that[action]('showtimeline');
|
that[action]('showtimeline');
|
||||||
that[action]('fullscreen');
|
that[action]('fullscreen');
|
||||||
|
|
|
@ -43,6 +43,8 @@ pandora.ui.rightPanel = function() {
|
||||||
pandora.$ui.browser.scrollToSelection();
|
pandora.$ui.browser.scrollToSelection();
|
||||||
if (pandora.user.ui.itemView == 'clips') {
|
if (pandora.user.ui.itemView == 'clips') {
|
||||||
pandora.$ui.clipList.size();
|
pandora.$ui.clipList.size();
|
||||||
|
} else if (pandora.user.ui.itemView == 'timeline') {
|
||||||
|
pandora.$ui.timeline.options({width: data.size});
|
||||||
} else if (pandora.user.ui.itemView == 'player') {
|
} else if (pandora.user.ui.itemView == 'player') {
|
||||||
pandora.$ui.player.options({width: data.size});
|
pandora.$ui.player.options({width: data.size});
|
||||||
} else if (pandora.user.ui.itemView == 'editor') {
|
} else if (pandora.user.ui.itemView == 'editor') {
|
||||||
|
|
|
@ -663,7 +663,7 @@ pandora.getMetadataByIdOrName = function(item, view, str, callback) {
|
||||||
Ox.Log('URL', 'getMetadataByIdOrName', item, view, str);
|
Ox.Log('URL', 'getMetadataByIdOrName', item, view, str);
|
||||||
var isName = str[0] == '@',
|
var isName = str[0] == '@',
|
||||||
canBeAnnotation = (
|
canBeAnnotation = (
|
||||||
!view || view == 'player' || view == 'editor'
|
!view || view == 'timeline' || view == 'player' || view == 'editor'
|
||||||
) && item && !isName,
|
) && item && !isName,
|
||||||
canBeEvent = !view || view == 'calendar',
|
canBeEvent = !view || view == 'calendar',
|
||||||
canBePlace = !view || view == 'map';
|
canBePlace = !view || view == 'map';
|
||||||
|
@ -1063,11 +1063,17 @@ pandora.resizeWindow = function() {
|
||||||
pandora.$ui.item.resize();
|
pandora.$ui.item.resize();
|
||||||
} else if (pandora.user.ui.itemView == 'clips') {
|
} else if (pandora.user.ui.itemView == 'clips') {
|
||||||
pandora.$ui.clipList.size();
|
pandora.$ui.clipList.size();
|
||||||
|
} else if (pandora.user.ui.itemView == 'timeline') {
|
||||||
|
pandora.$ui.timeline && pandora.$ui.timeline.options({
|
||||||
|
// fixme: duplicated
|
||||||
|
height: pandora.$ui.contentPanel.size(1),
|
||||||
|
width: pandora.$ui.document.width() - pandora.$ui.mainPanel.size(0) - 1
|
||||||
|
});
|
||||||
} else if (pandora.user.ui.itemView == 'player') {
|
} else if (pandora.user.ui.itemView == 'player') {
|
||||||
pandora.$ui.player && pandora.$ui.player.options({
|
pandora.$ui.player && pandora.$ui.player.options({
|
||||||
// fixme: duplicated
|
// fixme: duplicated
|
||||||
height: pandora.$ui.contentPanel.size(1),
|
height: pandora.$ui.contentPanel.size(1),
|
||||||
width: pandora.$ui.document.width() - pandora.$ui.mainPanel.size(0) - 1
|
width: pandora.$ui.document.width() - pandora.$ui.mainPanel.size(0) - 1
|
||||||
});
|
});
|
||||||
} else if (pandora.user.ui.itemView == 'editor') {
|
} else if (pandora.user.ui.itemView == 'editor') {
|
||||||
pandora.$ui.editor && pandora.$ui.editor.options({
|
pandora.$ui.editor && pandora.$ui.editor.options({
|
||||||
|
@ -1121,12 +1127,10 @@ pandora.unloadWindow = function() {
|
||||||
// fixme: ajax request has to have async set to false for this to work
|
// fixme: ajax request has to have async set to false for this to work
|
||||||
pandora.user.ui.section == 'items'
|
pandora.user.ui.section == 'items'
|
||||||
&& pandora.user.ui.item
|
&& pandora.user.ui.item
|
||||||
&& ['player', 'editor'].indexOf(pandora.user.ui.itemView) > -1
|
&& ['timeline', 'player', 'editor'].indexOf(pandora.user.ui.itemView) > -1
|
||||||
&& pandora.UI.set(
|
&& pandora.UI.set(
|
||||||
'videoPosition.' + pandora.user.ui.item,
|
'videoPosition.' + pandora.user.ui.item,
|
||||||
pandora.$ui[
|
pandora.$ui[pandora.user.ui.itemView].options('position')
|
||||||
pandora.user.ui.itemView == 'video' ? 'player' : 'editor'
|
|
||||||
].options('position')
|
|
||||||
);
|
);
|
||||||
*/
|
*/
|
||||||
};
|
};
|
||||||
|
|
Loading…
Reference in a new issue