move more asynchronous tasks into the url controller; fix bugs with list selection when page loads in item view

This commit is contained in:
rolux 2011-09-20 04:11:25 +00:00
parent 4f34613d80
commit 49c013c4ef
8 changed files with 260 additions and 233 deletions

View file

@ -93,11 +93,12 @@ Ox.load({
pandora.user.ui.theme = 'classic'; pandora.user.ui.theme = 'classic';
} }
pandora.URL.parse();
window.onpopstate = function(event) { window.onpopstate = function(event) {
pandora.URL.update(); pandora.URL.update();
}; };
pandora.URL.parse(function() {
Ox.UI.hideLoadingScreen(); Ox.UI.hideLoadingScreen();
Ox.Theme(pandora.user.ui.theme); Ox.Theme(pandora.user.ui.theme);
@ -109,7 +110,9 @@ Ox.load({
pandora.site.sectionButtonsWidth = pandora.$ui.sectionButtons.width() + 8; pandora.site.sectionButtonsWidth = pandora.$ui.sectionButtons.width() + 8;
}, '/static/'); });
}, '/static/'); // fixme: why does loadResources have an argument after callback????
} }
}); });

View file

@ -227,19 +227,10 @@ pandora.Query = (function() {
Ox.print(Ox.repeat('-', 120)); Ox.print(Ox.repeat('-', 120));
Ox.print('STATE', data); Ox.print('STATE', data);
Ox.print(Ox.repeat('-', 120)); Ox.print(Ox.repeat('-', 120));
Ox.print('@@@@@', data.list, pandora.user.ui.lists[data.list]) pandora.UI.set({list: data.list});
!pandora.user.ui.lists[data.list] && pandora.UI.set( !pandora.user.ui.lists[data.list] && pandora.UI.set(
'lists|' + data.list, pandora.site.user.ui.lists[''] 'lists|' + data.list, pandora.site.user.ui.lists['']
); );
///*
// ---- fixme: remove, server sends wrong data
!pandora.user.ui.lists[data.list].sort && pandora.UI.set(
'lists|' + data.list, pandora.site.user.ui.lists['']
);
// ----
//*/
Ox.print('@@@@@', data.lists, pandora.user.ui.lists[data.list])
pandora.UI.set({list: data.list});
pandora.user.ui.find = data.find; pandora.user.ui.find = data.find;
pandora.user.ui.groupsData = data.groups; pandora.user.ui.groupsData = data.groups;
pandora.user.ui.query = data.query; pandora.user.ui.query = data.query;
@ -287,6 +278,7 @@ pandora.Query = (function() {
toString: function() { toString: function() {
//Ox.print('tS', pandora.user.ui.find) //Ox.print('tS', pandora.user.ui.find)
if (!pandora.user.ui.item) {
var sort = pandora.user.ui.lists[pandora.user.ui.list].sort[0], var sort = pandora.user.ui.lists[pandora.user.ui.list].sort[0],
key = sort.key, key = sort.key,
operator = sort.operator; operator = sort.operator;
@ -294,6 +286,10 @@ pandora.Query = (function() {
find: constructFind(pandora.user.ui.query), find: constructFind(pandora.user.ui.query),
sort: (operator == pandora.getSortOperator(key) ? '' : operator) + key sort: (operator == pandora.getSortOperator(key) ? '' : operator) + key
}); });
} else {
return pandora.user.ui.item + '/' + pandora.user.ui.itemView;
}
}, },
updateGroups: function() { updateGroups: function() {

View file

@ -13,7 +13,7 @@ pandora.UI = (function() {
var obj = Ox.makeObject(arguments); var obj = Ox.makeObject(arguments);
previousUI = Ox.clone(pandora.user.ui, true); previousUI = Ox.clone(pandora.user.ui, true);
Ox.forEach(obj, function(val, key) { Ox.forEach(obj, function(val, key) {
Ox.print('key', key, 'val', val); Ox.print('UI.set key', key, 'val', val);
var i = 0, var i = 0,
keys = key.split('|'), keys = key.split('|'),
ui = pandora.user.ui; ui = pandora.user.ui;

View file

@ -1,12 +1,10 @@
// vim: et:ts=4:sw=4:sts=4:ft=javascript // vim: et:ts=4:sw=4:sts=4:ft=javascript
pandora.URL = (function() { pandora.URL = (function() {
var previousUI = {}, var previousURL = '',
previousURL = '',
regexps = { regexps = {
'^$': function(pathname, search) { '^$': function(pathname, search, callback) {
if (/^\?url=/.test(search)) { if (/^\?url=/.test(search)) {
document.location = decodeURIComponent(search.substr(5)); document.location = decodeURIComponent(search.substr(5));
} else { } else {
@ -24,22 +22,27 @@ pandora.URL = (function() {
}); });
} }
} }
callback();
}, },
'^home$': function(pathname, search) { '^home$': function(pathname, search, callback) {
pandora.$ui.home = pandora.ui.home().showScreen(); pandora.$ui.home = pandora.ui.home().showScreen();
callback();
}, },
'^(items|edits|texts)$': function(pathname, search) { '^(items|edits|texts)$': function(pathname, search, callback) {
pandora.UI.set({ pandora.UI.set({
section: pathname section: pathname
}); });
callback();
}, },
'^(about|contact|faq|news|software|terms|tour)$': function(pathname, search) { '^(about|contact|faq|news|software|terms|tour)$': function(pathname, search, callback) {
pandora.$ui.siteDialog = pandora.ui.siteDialog(pathname).open(); pandora.$ui.siteDialog = pandora.ui.siteDialog(pathname).open();
callback();
}, },
'^help$': function(pathname, search) { '^help$': function(pathname, search, callback) {
pandora.$ui.helpDialog = pandora.ui.helpDialog().open(); pandora.$ui.helpDialog = pandora.ui.helpDialog().open();
callback();
}, },
'^(signin|signout|signup)$': function(pathname, search) { '^(signin|signout|signup)$': function(pathname, search, callback) {
if ((pathname == 'signout') == (pandora.user.level != 'guest')) { if ((pathname == 'signout') == (pandora.user.level != 'guest')) {
pandora.$ui.accountDialog = ( pandora.$ui.accountDialog = (
pandora.user.level == 'guest' pandora.user.level == 'guest'
@ -47,21 +50,24 @@ pandora.URL = (function() {
: pandora.ui.accountSignoutDialog() : pandora.ui.accountSignoutDialog()
).open(); ).open();
} }
callback();
}, },
'^preferences$': function(pathname, search) { '^preferences$': function(pathname, search, callback) {
pandora.$ui.preferencesDialog = pandora.ui.preferencesDialog().open(); pandora.$ui.preferencesDialog = pandora.ui.preferencesDialog().open();
callback();
}, },
'^(calendar|calendars|clip|clips|flow|grid|list|map|maps|timelines)$': function(pathname, search) { '^(calendar|calendars|clip|clips|flow|grid|list|map|maps|timelines)$': function(pathname, search, callback) {
pandora.UI.set({ pandora.UI.set({
section: 'items', section: 'items',
item: '' item: ''
}); });
pandora.UI.set('lists|' + pandora.user.ui.list + '|listView', pathname); pandora.UI.set('lists|' + pandora.user.ui.list + '|listView', pathname);
pandora.Query.fromString(search); pandora.Query.fromString(search);
callback();
}, },
'^[0-9A-Z]': function(pathname, search) { '.*': function(pathname, search, callback) {
var split = pathname.split('/'), var split = pathname.split('/'),
item = split[0], item = decodeURI(split[0]),
points, points,
time = split.length > 1 time = split.length > 1
? /[\d\.:,-]+/.exec(split[split.length - 1]) ? /[\d\.:,-]+/.exec(split[split.length - 1])
@ -74,6 +80,47 @@ pandora.URL = (function() {
view = view ? view[0] view = view ? view[0]
: time ? pandora.user.ui.videoView : time ? pandora.user.ui.videoView
: pandora.user.ui.itemView; : pandora.user.ui.itemView;
pandora.api.get({id: item, keys: ['id']}, function(result) {
if (result.status.code == 200) {
foundItem();
} else {
pandora.api.find({
query: {
conditions: [{key: 'title', value: item, operator: ''}],
operator: '&'
},
sort: [{key: 'votes', operator: ''}], // fixme: not all systems have "votes"
range: [0, 100],
keys: ['id', 'title', 'votes']
}, function(result) {
if (result.data.items.length) {
var re = {
exact: new RegExp('^' + item + '$', 'i'),
word: new RegExp('\\b' + item + '\\b', 'i')
};
item = result.data.items.sort(function(a, b) {
return (parseInt(b.votes) || 0)
+ re.word.test(b.title) * 1000000
+ re.exact.test(b.title) * 2000000
- (parseInt(a.votes) || 0)
- re.word.test(a.title) * 1000000
- re.exact.test(a.title) * 2000000;
})[0].id;
split[0] = item;
foundItem();
} else {
pandora.UI.set({
section: 'items',
item: ''
});
pandora.Query.fromString('?find=' + pathname);
pandora.URL.replace('?find=' + pathname);
callback();
}
});
}
});
function foundItem() {
pandora.UI.set(Ox.extend({ pandora.UI.set(Ox.extend({
section: 'items', section: 'items',
item: item, item: item,
@ -83,12 +130,30 @@ pandora.URL = (function() {
} : {})); } : {}));
if (time) { if (time) {
points = time[0].split(','); points = time[0].split(',');
if (points.length == 2) { if (
points = Ox.flatten([points[0], points[1].split('-')]); points.length == 2
if (points[2] == '') { && (points = Ox.flatten([points[0], points[1].split('-')]))[2] == ''
points[2] = '-1'; ) {
pandora.api.get({
id: item,
keys: ['duration']
}, function(result) {
points[2] = result.data.duration.toString();
foundTime();
});
} else {
foundTime();
} }
} else {
if (!pandora.user.ui.videoPoints[item]) {
pandora.UI.set('videoPoints|' + item, {
'in': 0, out: 0, position: 0
});
} }
foundTime();
}
function foundTime() {
if (time) {
// fixme: this is duplicated, see Ox.VideoPlayer() parsePositionInput() // fixme: this is duplicated, see Ox.VideoPlayer() parsePositionInput()
points = points.map(function(point, i) { points = points.map(function(point, i) {
var parts = point.split(':').reverse(); var parts = point.split(':').reverse();
@ -110,21 +175,31 @@ pandora.URL = (function() {
split[split.length - 1] = points[0] + ( split[split.length - 1] = points[0] + (
points.length == 1 ? '' : ',' + points[1] + '-' + points[2] points.length == 1 ? '' : ',' + points[1] + '-' + points[2]
); );
pandora.URL.replace(split.join('/'));
} else if (!pandora.user.ui.videoPoints[item]) {
pandora.UI.set('videoPoints|' + item, {
'in': 0, out: 0, position: 0
});
} }
}, pandora.URL.replace(split.join('/'));
'.*': function(pathname, search) { // on page load, we have to check if the item is in the previously selected list
var query = search || 'find=' + pathname; // if it is not, the movie browser has to be reloaded
pandora.UI.set({ if (pandora.user.ui.list) {
section: 'items', pandora.user.ui.query = {
item: '' conditions: [{key: 'list', value: pandora.user.ui.list, operator: ''}],
operator: '&'
};
pandora.api.find({
query: pandora.user.ui.query,
positions: [pandora.user.ui.item],
sort: [{key: 'id', operator: ''}]
}, function(result) {
if (Ox.isUndefined(result.data.positions[pandora.user.ui.item])) {
pandora.UI.set({list: ''});
pandora.user.ui.query = {conditions:[], operator: '&'};
}
callback();
}); });
pandora.Query.fromString(query); } else {
pandora.URL.replace('?' + query); callback();
}
}
}
} }
}; };
@ -132,81 +207,13 @@ pandora.URL = (function() {
previousURL = document.location.pathname + document.location.search; previousURL = document.location.pathname + document.location.search;
} }
return { function updateURL() {
parse: function() {
var pathname = document.location.pathname.substr(1),
search = document.location.search.substr(1);
if (/\/$/.test(pathname)) {
pathname = pathname.substr(0, pathname.length - 1);
}
/*
var url = document.location.pathname.substr(1)
+ document.location.search
+ document.location.hash;
*/
Ox.forEach(regexps, function(fn, re) {
re = new RegExp(re);
if (re.test(pathname)) {
Ox.print('URL re ' + re);
fn(pathname, search);
return false;
}
});
pandora.Query.updateGroups();
pandora.user.ui.showHome = false;
},
push: function(title, url) {
if (arguments.length == 1) { // fixme: remove later
url = title;
}
if (url[0] != '/') {
url = '/' + url;
}
saveURL();
history.pushState({}, pandora.site.site.name + (title ? ' - ' + title : ''), url);
},
pushPrevious: function() {
history.pushState({}, '', previousURL);
},
set: function(title, url) {
if (arguments.length == 1) { // fixme: remove later
url = title;
}
if (url[0] != '/') {
url = '/' + url;
}
history.pushState({}, pandora.site.site.name + (title ? ' - ' + title : ''), url);
this._update();
},
replace: function(title, url) {
if (arguments.length == 1) { // fixme: remove later
url = title;
}
if (url[0] != '/') {
url = '/' + url;
}
saveURL();
history.replaceState({}, pandora.site.site.name + (title ? ' - ' + title : ''), url);
},
update: function() {
this.set(pandora.Query.toString());
},
_update: function() {
// fixme: make this method private
var previousUI = pandora.UI.getPrevious(); var previousUI = pandora.UI.getPrevious();
Ox.print('now', pandora.user.ui, 'previously', previousUI)
Ox.Request.cancel(); Ox.Request.cancel();
$('video').each(function() { $('video').each(function() {
$(this).trigger('stop'); $(this).trigger('stop');
}); });
this.parse(); pandora.URL.parse(function() {
if (pandora.user.ui.section != previousUI.section) { if (pandora.user.ui.section != previousUI.section) {
pandora.$ui.appPanel.replaceElement(1, pandora.$ui.mainPanel = pandora.ui.mainPanel()); pandora.$ui.appPanel.replaceElement(1, pandora.$ui.mainPanel = pandora.ui.mainPanel());
} else if (!pandora.user.ui.item && !previousUI.item) { } else if (!pandora.user.ui.item && !previousUI.item) {
@ -218,7 +225,6 @@ pandora.URL = (function() {
if (list.listView != previousList.listView) { if (list.listView != previousList.listView) {
pandora.$ui.mainMenu.checkItem('viewMenu_movies_' + list.listView); pandora.$ui.mainMenu.checkItem('viewMenu_movies_' + list.listView);
pandora.$ui.viewSelect.options({value: list.listView}); pandora.$ui.viewSelect.options({value: list.listView});
Ox.print('is', isClipView, 'was', wasClipView);
if (isClipView != wasClipView) { if (isClipView != wasClipView) {
pandora.$ui.mainMenu.replaceMenu('sortMenu', pandora.getSortMenu()); pandora.$ui.mainMenu.replaceMenu('sortMenu', pandora.getSortMenu());
pandora.$ui.sortSelect.replaceWith(pandora.$ui.sortSelect = pandora.ui.sortSelect()); pandora.$ui.sortSelect.replaceWith(pandora.$ui.sortSelect = pandora.ui.sortSelect());
@ -229,14 +235,12 @@ pandora.URL = (function() {
} }
if (!Ox.isEqual(list.sort, previousList.sort)) { if (!Ox.isEqual(list.sort, previousList.sort)) {
pandora.$ui.mainMenu.checkItem('sortMenu_sortmovies_' + list.sort[0].key); pandora.$ui.mainMenu.checkItem('sortMenu_sortmovies_' + list.sort[0].key);
pandora.$ui.mainMenu.checkItem('sortMenu_ordermovies_' + ( pandora.$ui.mainMenu.checkItem('sortMenu_ordermovies_' + ((
list.sort[0].operator == '' ? pandora.getSortOperator(list.sort[0].key) list.sort[0].operator || pandora.getSortOperator(list.sort[0].key)
: list.sort[0].operator == '+' ? 'ascending' : 'descending' ) == '+' ? 'ascending' : 'descending'));
));
pandora.$ui.sortSelect.options({value: list.sort[0].key}); pandora.$ui.sortSelect.options({value: list.sort[0].key});
} }
pandora.$ui.leftPanel.replaceElement(2, pandora.$ui.info = pandora.ui.info()); pandora.$ui.leftPanel.replaceElement(2, pandora.$ui.info = pandora.ui.info());
Ox.print('EQUAL?', pandora.user.ui.query, previousUI.query, Ox.isEqual(pandora.user.ui.query, previousUI.query))
if (Ox.isEqual(pandora.user.ui.query, previousUI.query)) { if (Ox.isEqual(pandora.user.ui.query, previousUI.query)) {
pandora.$ui.contentPanel.replaceElement(1, pandora.$ui.list = pandora.ui.list()); pandora.$ui.contentPanel.replaceElement(1, pandora.$ui.list = pandora.ui.list());
} else { } else {
@ -268,8 +272,72 @@ pandora.URL = (function() {
$item.options('position') $item.options('position')
); );
} }
});
} }
return {
parse: function(callback) {
var pathname = document.location.pathname.substr(1),
search = document.location.search.substr(1);
if (/\/$/.test(pathname)) {
pathname = pathname.substr(0, pathname.length - 1);
}
Ox.forEach(regexps, function(fn, re) {
re = new RegExp(re);
if (re.test(pathname)) {
Ox.print('URL re ' + re);
fn(pathname, search, function() {
pandora.Query.updateGroups();
pandora.user.ui.showHome = false;
callback();
});
return false;
}
});
},
push: function(title, url) {
if (arguments.length == 1) { // fixme: remove later
url = title;
}
if (url[0] != '/') {
url = '/' + url;
}
saveURL();
history.pushState({}, pandora.site.site.name + (title ? ' - ' + title : ''), url);
},
pushPrevious: function() {
history.pushState({}, '', previousURL);
},
set: function(title, url) {
if (arguments.length == 1) { // fixme: remove later
url = title;
}
if (url[0] != '/') {
url = '/' + url;
}
history.pushState({}, pandora.site.site.name + (title ? ' - ' + title : ''), url);
updateURL();
},
replace: function(title, url) {
if (arguments.length == 1) { // fixme: remove later
url = title;
}
if (url[0] != '/') {
url = '/' + url;
}
saveURL();
history.replaceState({}, pandora.site.site.name + (title ? ' - ' + title : ''), url);
},
update: function() {
this.set(pandora.Query.toString());
},
}; };
}()); }());

View file

@ -9,7 +9,8 @@ pandora.ui.backButton = function() {
}) })
.bindEvent({ .bindEvent({
click: function() { click: function() {
pandora.URL.set(pandora.Query.toString()); pandora.UI.set({item: null});
pandora.URL.update();
} }
}); });
return that; return that;

View file

@ -1,6 +1,6 @@
// vim: et:ts=4:sw=4:sts=4:ft=javascript // vim: et:ts=4:sw=4:sts=4:ft=javascript
pandora.ui.browser = function() { pandora.ui.browser = function() {
var sizes, that; var that;
if (!pandora.user.ui.item) { if (!pandora.user.ui.item) {
pandora.user.ui.groupsSizes = pandora.getGroupsSizes(); pandora.user.ui.groupsSizes = pandora.getGroupsSizes();
pandora.$ui.groups = pandora.ui.groups(); pandora.$ui.groups = pandora.ui.groups();

View file

@ -371,17 +371,18 @@ pandora.ui.folderList = function(id) {
pandora.$ui.list.triggerEvent('paste', data); pandora.$ui.list.triggerEvent('paste', data);
}, },
select: function(data) { select: function(data) {
//pandora.user.ui.item && pandora.UI.set({item: ''});
if (data.ids.length) { if (data.ids.length) {
Ox.forEach(pandora.$ui.folderList, function($list, id_) { Ox.forEach(pandora.$ui.folderList, function($list, id_) {
id != id_ && $list.options('selected', []); id != id_ && $list.options('selected', []);
}); });
//pandora.UI.set({list: data.ids[0]});
pandora.URL.set('?find=' + (id == 'volumes' ? 'volume' : 'list') + ':' + data.ids[0]);
} else {
//pandora.UI.set({list: ''});
pandora.URL.set('');
} }
pandora.URL.set(data.ids.length ? '?find=list:' + data.ids[0] : '');
/*
pandora.UI.set({
item: '',
list: data.ids.length ? data.ids[0] : ''
});
*/
}, },
submit: function(data) { submit: function(data) {
data_ = {id: data.id}; data_ = {id: data.id};

View file

@ -11,51 +11,9 @@ pandora.ui.item = function() {
if (result.status.code == 200) { if (result.status.code == 200) {
// fixme: probably does not belong here // fixme: probably does not belong here
document.title = '0xDB - ' + result.data.title; document.title = '0xDB - ' + result.data.title;
if (pandora.user.ui.videoPoints[result.data.id].out == -1) {
pandora.UI.set('videoPoints|' + result.data.id + '|out', result.data.duration);
pandora.URL.replace(
document.location.pathname
+ Ox.formatDuration(result.data.duration, 3).replace(/\.000$/, '')
);
}
} }
if (result.status.code != 200) { /*if (result.status.code != 200) {
// fixme: this is quite a hack
var title = decodeURI(pandora.user.ui.item).toLowerCase(),
videoPoints;
if (pandora.user.ui.item in pandora.user.ui.videoPoints) {
videoPoints = pandora.user.ui.videoPoints[pandora.user.ui.item];
pandora.UI.set(['videoPoints', pandora.user.ui.item].join('|'), null);
}
pandora.api.find({
query: {
conditions: [{key: 'title', value: title, operator: ''}],
operator: ''
},
sort: [{key: 'votes', operator: '-'}], // fixme: operator '' should work as well
range: [0, 100],
keys: ['id', 'title', 'votes']
}, function(result) {
if (result.data.items.length) {
Ox.print(result.data.items)
var re = {
exact: new RegExp('^' + title + '$', 'i'),
word: new RegExp('\\b' + title + '\\b', 'i')
},
id = result.data.items.sort(function(a, b) {
return (parseInt(b.votes) || 0)
+ re.word.test(b.title) * 1000000
+ re.exact.test(b.title) * 2000000
- (parseInt(a.votes) || 0)
- re.word.test(a.title) * 1000000
- re.exact.test(a.title) * 2000000;
})[0].id;
pandora.user.ui.item = '';
!Ox.isUndefined(videoPoints)
&& pandora.UI.set(['videoPoints', id].join('|'), videoPoints);
pandora.URL.set(id);
} else {
pandora.$ui.contentPanel.replaceElement(1, pandora.$ui.contentPanel.replaceElement(1,
Ox.Element() Ox.Element()
.css({marginTop: '32px', fontSize: '12px', textAlign: 'center'}) .css({marginTop: '32px', fontSize: '12px', textAlign: 'center'})
@ -65,9 +23,9 @@ pandora.ui.item = function() {
+ ' you\'re looking for.' + ' you\'re looking for.'
) )
); );
} }*/
});
} else if (!result.data.rendered && [ if (!result.data.rendered && [
'clips', 'map', 'player', 'timeline' 'clips', 'map', 'player', 'timeline'
].indexOf(pandora.user.ui.itemView)>-1) { ].indexOf(pandora.user.ui.itemView)>-1) {
pandora.$ui.contentPanel.replaceElement(1, pandora.$ui.contentPanel.replaceElement(1,