app.url navigation

This commit is contained in:
j 2010-12-06 23:32:17 +01:00
parent bf995d6edc
commit f1d4d5da63
4 changed files with 109 additions and 71 deletions

View file

@ -113,7 +113,7 @@ def siteJson():
"findQuery": {"conditions": [], "operator": ""}, "findQuery": {"conditions": [], "operator": ""},
"groupsQuery": {"conditions": [], "operator": "|"}, "groupsQuery": {"conditions": [], "operator": "|"},
"groupsSize": 128, "groupsSize": 128,
"itemView": "info", "itemView": "timeline",
"listQuery": {"conditions": [], "operator": ""}, "listQuery": {"conditions": [], "operator": ""},
"listsSize": 192, "listsSize": 192,
"listView": "icons", "listView": "icons",

View file

@ -116,7 +116,7 @@
"findQuery": {"conditions": [], "operator": ""}, "findQuery": {"conditions": [], "operator": ""},
"groupsQuery": {"conditions": [], "operator": "|"}, "groupsQuery": {"conditions": [], "operator": "|"},
"groupsSize": 128, "groupsSize": 128,
"itemView": "info", "itemView": "timeline",
"listQuery": {"conditions": [], "operator": ""}, "listQuery": {"conditions": [], "operator": ""},
"listsSize": 192, "listsSize": 192,
"listView": "icons", "listView": "icons",

View file

@ -47,7 +47,7 @@ def get_ui(user):
"findQuery": {"conditions": [], "operator": ""}, "findQuery": {"conditions": [], "operator": ""},
"groupsQuery": {"conditions": [], "operator": "|"}, "groupsQuery": {"conditions": [], "operator": "|"},
"groupsSize": 128, "groupsSize": 128,
"itemView": "info", "itemView": "timeline",
"listQuery": {"conditions": [], "operator": ""}, "listQuery": {"conditions": [], "operator": ""},
"listsSize": 192, "listsSize": 192,
"listView": "icons", "listView": "icons",

View file

@ -63,12 +63,31 @@ var app = new Ox.App({
app.template.info = $('<div>').load('/static/html/itemInfo.html'); app.template.info = $('<div>').load('/static/html/itemInfo.html');
$.each(app.afterLaunch, function(i, f) {f()}); $.each(app.afterLaunch, function(i, f) {f()});
app.url();
window.onpopstate = function() { app.url()};
}); });
// Objects // Objects
app.url = function(url) {
if(!url)
var url = document.location.pathname;
else {
var title = document.title + ' '+ url;
history.pushState({}, title, url);
}
if(/[0-9A-Z]/.exec(url.substring(1,2))) {
var id = url.split('/')[1];
var view = url.split('/')[2] || app.user.ui.itemView;
app.constructItem(id, view);
} else {
app.Query.fromString(location.hash.substr(2));
app.$ui.rightPanel.replace(1, app.constructContentPanel());
}
}
app.Query = (function() { app.Query = (function() {
@ -329,58 +348,7 @@ app.constructApp = function() {
size: 24 size: 24
}, },
{ {
element: app.$ui.contentPanel = new Ox.SplitPanel({ element: app.constructContentPanel()
elements: [
{
collapsible: true,
element: app.$ui.groupsOuterPanel = new Ox.SplitPanel({
elements: [
{
element: app.$ui.groups[0],
size: app.ui.groups[0].size
},
{
element: app.$ui.groupsInnerPanel = new Ox.SplitPanel({
elements: [
{
element: app.$ui.groups[1],
size: app.ui.groups[1].size
},
{
element: app.$ui.groups[2],
},
{
element: app.$ui.groups[3],
size: app.ui.groups[3].size
}
],
orientation: 'horizontal'
})
},
{
element: app.$ui.groups[4],
size: app.ui.groups[4].size
},
],
id: 'browser',
orientation: 'horizontal'
})
.bindEvent('resize', function(event, data) {
Ox.print('resizing groups...')
$.each(app.$ui.groups, function(i, list) {
list.size();
});
}),
resizable: true,
resize: [96, 112, 128, 144, 160, 176],
size: app.user.ui.groupsSize
},
{
element: app.$ui.list = app.constructList(app.user.ui.listView)
}
],
orientation: 'vertical'
})
}, },
{ {
element: app.$ui.statusbar, element: app.$ui.statusbar,
@ -548,9 +516,69 @@ app.constructInfo = function() {
); );
} }
app.constructContentPanel = function(listView) {
listView = listView || app.user.ui.listView;
return app.$ui.contentPanel = new Ox.SplitPanel({
elements: [
{
collapsible: true,
element: app.$ui.groupsOuterPanel = new Ox.SplitPanel({
elements: [
{
element: app.$ui.groups[0],
size: app.ui.groups[0].size
},
{
element: app.$ui.groupsInnerPanel = new Ox.SplitPanel({
elements: [
{
element: app.$ui.groups[1],
size: app.ui.groups[1].size
},
{
element: app.$ui.groups[2],
},
{
element: app.$ui.groups[3],
size: app.ui.groups[3].size
}
],
orientation: 'horizontal'
})
},
{
element: app.$ui.groups[4],
size: app.ui.groups[4].size
},
],
id: 'browser',
orientation: 'horizontal'
})
.bindEvent('resize', function(event, data) {
Ox.print('resizing groups...')
$.each(app.$ui.groups, function(i, list) {
list.size();
});
}),
resizable: true,
resize: [96, 112, 128, 144, 160, 176],
size: app.user.ui.groupsSize
},
{
element: app.$ui.list = app.constructList(listView)
}
],
orientation: 'vertical'
});
}
app.constructItem = function(id, view) { app.constructItem = function(id, view) {
var $item; var $item;
//location.hash = '!' + id; //location.hash = '!' + id;
app.$ui.mainMenu.enableItem('openmovie');
app.$ui.mainMenu.checkItem('viewMenu_openmovie_' + view);
//FIXME: there should be a menu function for this
$.map(app.config.listViews, function(view, i) { app.$ui.mainMenu.uncheckItem('viewMenu_movies_'+view.id); });
app.$ui.contentPanel.empty(); app.$ui.contentPanel.empty();
if (view == 'timeline') { if (view == 'timeline') {
app.api.getItem(id, function(result) { app.api.getItem(id, function(result) {
@ -658,22 +686,17 @@ app.constructItem = function(id, view) {
app.api.getItem(id, function(result) { app.api.getItem(id, function(result) {
item_debug = result.data.item; item_debug = result.data.item;
var item = result.data.item; var item = result.data.item;
$item = new Ox.Container(); var $item = new Ox.Container();
$item.append(app.template.info.tmpl(item)); $item.append(app.template.info.tmpl(item));
app.$ui.contentPanel.replace(1, $item); app.$ui.rightPanel.replace(1, $item);
/*
app.$ui.rightPanel app.$ui.rightPanel
/*.unbindEvent('resize')*/
.bindEvent('resize', function(event, data) { .bindEvent('resize', function(event, data) {
Ox.print('seems to work', data) app.$ui.editor.options({
$item.options({ width: data - app.$ui.timelinePanel.size(1) - 1
width: data - 256 - 1
});
});
app.$window.resize(function() {
$item.options({
width: app.$document.width() - app.$ui.leftPanel.width() - 1 - 256 - 1
}); });
}); });
*/
}); });
} }
@ -851,7 +874,8 @@ app.constructList = function(view) {
app.$ui.selected.html(app.constructStatus('selected', data)); app.$ui.selected.html(app.constructStatus('selected', data));
}, },
open: function(event, data) { open: function(event, data) {
app.constructItem(data.ids[0], 'timeline') var id = data.ids[0];
app.url('/' + id);
}, },
openpreview: function(event, data) { openpreview: function(event, data) {
app.requests.preview && app.api.cancel(app.requests.preview); app.requests.preview && app.api.cancel(app.requests.preview);
@ -1137,7 +1161,7 @@ app.constructMainMenu = function() {
] }, ] },
{ id: 'viewMenu', title: 'View', items: [ { id: 'viewMenu', title: 'View', items: [
{ id: 'movies', title: 'View Movies', items: [ { id: 'movies', title: 'View Movies', items: [
{ group: 'viewmovies', min: 1, max: 1, items: $.map(app.config.listViews, function(view, i) { { group: 'viewmovies', min: 0, max: 1, items: $.map(app.config.listViews, function(view, i) {
return $.extend({ return $.extend({
checked: app.user.ui.listView == view.id, checked: app.user.ui.listView == view.id,
}, view); }, view);
@ -1153,9 +1177,13 @@ app.constructMainMenu = function() {
{ id: 'video', title: 'Video' } { id: 'video', title: 'Video' }
] }, ] },
{}, {},
{ id: 'openmovie', title: ['Open Movie', 'Open Movies'], disabled: true, items: $.map(app.config.itemViews, function(view, i) { { id: 'openmovie', title: ['Open Movie', 'Open Movies'], disabled: true, items: [
return view; { group: 'movieview', min: 0, max: 1, items: $.map(app.config.itemViews, function(view, i) {
return $.extend({
checked: app.user.ui.itemView == view.id,
}, view);
}) }, }) },
]},
{}, {},
{ id: 'lists', title: 'Hide Lists', keyboard: 'shift l' }, { id: 'lists', title: 'Hide Lists', keyboard: 'shift l' },
{ id: 'info', title: 'Hide Info', keyboard: 'shift i' }, { id: 'info', title: 'Hide Info', keyboard: 'shift i' },
@ -1229,6 +1257,13 @@ app.constructMainMenu = function() {
if (data.id == 'find') { if (data.id == 'find') {
var id = data.checked[0].id; var id = data.checked[0].id;
app.$ui.findSelect.selectItem(id); app.$ui.findSelect.selectItem(id);
} else if (data.id == 'movieview') {
var view = data.checked[0].id;
var id = document.location.pathname.split('/')[1];
if (view == 'info')
app.url('/'+id+'/info');
else
app.url('/'+id);
} else if (data.id == 'ordermovies') { } else if (data.id == 'ordermovies') {
var id = data.checked[0].id; var id = data.checked[0].id;
app.$ui.list.sortList(user.ui.sort[0].key, id == 'ascending' ? '' : '-'); app.$ui.list.sortList(user.ui.sort[0].key, id == 'ascending' ? '' : '-');
@ -1237,6 +1272,9 @@ app.constructMainMenu = function() {
operator = Ox.getObjectById(app.config.sortKeys, id).operator; operator = Ox.getObjectById(app.config.sortKeys, id).operator;
app.$ui.mainMenu.checkItem('sortMenu_ordermovies_' + (operator === '' ? 'ascending' : 'descending')); app.$ui.mainMenu.checkItem('sortMenu_ordermovies_' + (operator === '' ? 'ascending' : 'descending'));
app.$ui.list.sortList(id, operator); app.$ui.list.sortList(id, operator);
} else if (data.id == 'viewmovies') {
var view = data.checked[0].id;
app.url('/?v='+view);
} }
}, },
click: function(event, data) { click: function(event, data) {