decentral1se/pandora
1
0
Fork 0
forked from 0x2620/pandora
Code Issues Pull requests Projects Releases Wiki Activity

new UI/URL handling (intermediate state)

Browse source
This commit is contained in:
rolux 2011-09-23 10:44:54 +00:00
parent a6a285367b
commit 41134b5eb1
30 changed files with 1213 additions and 741 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

43
pandora/0xdb.json
View file

@ -6,13 +6,13 @@
"canSeeFiles": {"guest": -1, "member": -1, "staff": 3, "admin": 4} "canSeeFiles": {"guest": -1, "member": -1, "staff": 3, "admin": 4}
}, },
"clipKeys": [ "clipKeys": [
{"id": "clip:text", "title": "Clip Text", "type": "string"}, {"id": "clip:text", "title": "Text", "type": "string"},
{"id": "clip:position", "title": "Clip Position", "type": "float"}, {"id": "clip:position", "title": "Position", "type": "float"},
{"id": "clip:duration", "title": "Clip Duration", "type": "float"}, {"id": "clip:duration", "title": "Duration", "type": "float"},
{"id": "clip:hue", "title": "Clip Hue", "type": "hue"}, {"id": "clip:hue", "title": "Hue", "type": "hue"},
{"id": "clip:saturation", "title": "Clip Saturation", "type": "float"}, {"id": "clip:saturation", "title": "Saturation", "type": "float"},
{"id": "clip:lightness", "title": "Clip Lightness", "type": "float"}, {"id": "clip:lightness", "title": "Lightness", "type": "float"},
{"id": "clip:volume", "title": "Clip Volume", "type": "float"} {"id": "clip:volume", "title": "Volume", "type": "float"}
], ],
"groups": [ "groups": [
{"id": "director", "title": "Director", "type": "string"}, {"id": "director", "title": "Director", "type": "string"},
@ -29,7 +29,7 @@
], ],
"itemKeys": [ "itemKeys": [
{ {
"id": "all", "id": "*",
"title": "All", "title": "All",
"type": "text", "type": "text",
"find": true "find": true
@ -543,7 +543,13 @@
"preferences": {}, "preferences": {},
"ui": { "ui": {
"annotationsSize": 256, "annotationsSize": 256,
"find": {"index": -1, "key": "", "value": ""}, "columns": {
"Colors": {
"columns": ["title", "director", "country", "year", "hue", "saturation", "brightness"],
"columnWidth": {}
}
},
"find": {"conditions": [], "operator": "&"},
"groups": [ "groups": [
{"id": "director", "sort": [{"key": "items", "operator": "-"}]}, {"id": "director", "sort": [{"key": "items", "operator": "-"}]},
{"id": "country", "sort": [{"key": "items", "operator": "-"}]}, {"id": "country", "sort": [{"key": "items", "operator": "-"}]},
@ -555,20 +561,15 @@
"icons": "posters", "icons": "posters",
"infoIconSize": 256, "infoIconSize": 256,
"item": "", "item": "",
"itemSort": [{"key": "clip:position", "operator": ""}],
"itemView": "info", "itemView": "info",
"list": "", "list": "",
"lists": { "listColumns": ["title", "director", "country", "year", "language", "runtime", "genre"],
"": { "listColumnWidth": {},
"columns": ["title", "director", "country", "year", "language", "runtime", "genre"], "listSelection": [],
"columnWidth": {}, "listSort": [{"key": "director", "operator": ""}],
"listView": "grid", "listView": "grid",
"selected": [], "lists": {},
"sort": [
{"key": "director", "operator": ""}
]
}
},
"query": {"conditions": [], "operator": ""},
"section": "items", "section": "items",
"showAnnotations": true, "showAnnotations": true,
"showControls": true, "showControls": true,
@ -586,8 +587,8 @@
} }
}, },
"showSidebar": true, "showSidebar": true,
"showSitePosters": false,
"sidebarSize": 256, "sidebarSize": 256,
"sitePage": "home",
"theme": "modern", "theme": "modern",
"videoPoints": {}, "videoPoints": {},
"videoScale": "fit", "videoScale": "fit",

6
pandora/item/managers.py
View file

@ -23,10 +23,10 @@ def parseCondition(condition):
} }
... ...
''' '''
k = condition.get('key', 'all') k = condition.get('key', '*')
k = {'id': 'itemId'}.get(k, k) k = {'id': 'itemId'}.get(k, k)
if not k: if not k:
k = 'all' k = '*'
v = condition['value'] v = condition['value']
op = condition.get('operator') op = condition.get('operator')
if not op: if not op:
@ -192,7 +192,7 @@ class ItemManager(Manager):
return QuerySet(self.model) return QuerySet(self.model)
def filter_list(self, qs, l, user): def filter_list(self, qs, l, user):
if l != "all": if l != "*":
l = l.split(":") l = l.split(":")
only_public = True only_public = True
if not user.is_anonymous(): if not user.is_anonymous():

2
pandora/item/models.py
View file

@ -499,7 +499,7 @@ class Item(models.Model):
elif key['type'] == 'layer': elif key['type'] == 'layer':
qs = Annotation.objects.filter(layer__name=i, item=self).order_by('start') qs = Annotation.objects.filter(layer__name=i, item=self).order_by('start')
save(i, '\n'.join([l.value for l in qs])) save(i, '\n'.join([l.value for l in qs]))
elif i != 'all' and i not in self.facet_keys: elif i != '*' and i not in self.facet_keys:
value = self.get(i) value = self.get(i)
if isinstance(value, list): if isinstance(value, list):
value = u'\n'.join(value) value = u'\n'.join(value)

1
pandora/urls.py
View file

@ -50,6 +50,7 @@ urlpatterns += patterns('',
(r'^[A-Z0-9].*$', 'app.views.index'), (r'^[A-Z0-9].*$', 'app.views.index'),
(r'^[a-z0-9].+$', 'app.views.index'), (r'^[a-z0-9].+$', 'app.views.index'),
(r'^$', 'app.views.index'), (r'^$', 'app.views.index'),
(r'^.*$', 'app.views.index'),
) )
urlpatterns += patterns('django.views.generic.simple', urlpatterns += patterns('django.views.generic.simple',

98
static/js/pandora.js
View file

@ -61,6 +61,7 @@ Ox.load({
findKeys: Ox.map(data.site.itemKeys, function(key) { findKeys: Ox.map(data.site.itemKeys, function(key) {
return key.find ? key : null; return key.find ? key : null;
}), }),
itemsSection: pandora.site.itemName.plural.toLowerCase(),
sectionFolders: { sectionFolders: {
items: [ items: [
{id: 'personal', title: 'Personal Lists'}, {id: 'personal', title: 'Personal Lists'},
@ -79,22 +80,32 @@ Ox.load({
{id: 'featured', title: 'Featured Texts', showBrowser: false} {id: 'featured', title: 'Featured Texts', showBrowser: false}
] ]
}, },
sortKeys: Ox.map(data.site.itemKeys, function(key) { sortKeys: Ox.map(pandora.site.itemKeys, function(key) {
return key.columnWidth ? Ox.extend(key, { return key.columnWidth ? Ox.extend(key, {
operator: pandora._getSortOperator(key.type) operator: pandora._getSortOperator(key.type)
}) : null; }) : null;
}) })
}); });
pandora.site.listSettings = {};
Ox.map(pandora.site.user.ui, function(val, key) {
if (/^list[A-Z]/.test(key)) {
pandora.site.listSettings[key] = key[0].toLowerCase() + key.substr(1);
}
});
if (Ox.isEmpty(pandora.user.ui.lists)) {
var listSettings = {};
Ox.forEach(pandora.site.listSettings, function(listSetting, setting) {
listSettings[listSetting] = pandora.site.user.ui[setting];
});
pandora.UI.set('lists|', listSettings);
}
Ox.extend(pandora.user, { Ox.extend(pandora.user, {
sectionElement: 'buttons', sectionElement: 'buttons',
selectedMovies: [], selectedMovies: [], // fixme: used for what?
videoFormat: Ox.UI.getVideoFormat(pandora.site.video.formats) videoFormat: Ox.UI.getVideoFormat(pandora.site.video.formats)
}); });
// fixme: this should not happen
if (!pandora.user.ui.lists[pandora.user.ui.list]) {
Ox.print('THIS SHOULD NOT HAPPEN', pandora.site.user.ui.lists[''])
pandora.user.ui.lists[pandora.user.ui.list] = pandora.site.user.ui.lists[''];
}
if (data.user.level == 'guest' && $.browser.mozilla) { if (data.user.level == 'guest' && $.browser.mozilla) {
pandora.user.ui.theme = 'classic'; pandora.user.ui.theme = 'classic';
@ -106,78 +117,7 @@ Ox.load({
// set up url controller // set up url controller
var itemsName = pandora.site.itemName.plural.toLowerCase(), pandora.URL.init().parse(function() {
sortKeys = {}, spanType = {}, views = {};
views[itemsName] = {
list: Ox.merge(
// 'grid' is the default view
['grid'],
Ox.map(pandora.site.listViews, function(view) {
return view.id == 'grid' ? null : view.id;
})
),
item: Ox.merge(
// 'info' is the default view, pandora.user.ui.videoView
// is the default view if there is a duration
['info', pandora.user.ui.videoView],
pandora.site.itemViews.map(function(view) {
return [
'info', pandora.user.ui.videoView
].indexOf(view.id) > -1 ? null : view.id;
})
)
};
sortKeys[itemsName] = {list: {}, item: {}};
views[itemsName].list.forEach(function(view) {
sortKeys[itemsName].list[view] = Ox.merge(
pandora.isClipView(view) ? Ox.clone(pandora.site.clipKeys) : [],
// 'director' is the default sort key
[Ox.getObjectById(pandora.site.sortKeys, 'director')],
Ox.map(pandora.site.sortKeys, function(key) {
return key.id == 'director' ? null : key;
})
);
});
views[itemsName].item.forEach(function(view) {
if (pandora.isClipView(view, true)) {
sortKeys[itemsName].item[view] = Ox.merge(
// 'clip:position' is the default sort key
[Ox.getObjectById(pandora.site.clipKeys, 'clip:position')],
Ox.map(pandora.site.clipKeys, function(key) {
return key.id == 'clip:position' ? null : key;
})
);
}
});
spanType[itemsName] = {
list: {
map: 'location',
calendar: 'date'
},
item: {
video: 'duration',
timeline: 'duration',
map: 'location',
calendar: 'date'
}
};
pandora._URL = Ox.URL({
findKeys: pandora.site.findKeys,
getItem: pandora.getItemByIdOrTitle,
getSpan: pandora.getMetadataByIdOrName,
pages: [
'about', 'contact', 'faq', 'help', 'home', 'news',
'preferences', 'signin', 'signout', 'signup',
'software', 'terms', 'tour'
],
sortKeys: sortKeys,
spanType: spanType,
types: [pandora.site.itemName.plural.toLowerCase(), 'edits', 'texts'],
views: views
});
pandora.URL.parse(function() {
Ox.UI.hideLoadingScreen(); Ox.UI.hideLoadingScreen();

55
static/js/pandora/UI.js
View file

@ -1,19 +1,40 @@
// vim: et:ts=4:sw=4:sts=4:ft=javascript // vim: et:ts=4:sw=4:sts=4:ft=javascript
pandora.UI = (function() { pandora.UI = (function() {
// fixme: why do we use '|', and not '.', as a separator? // fixme: "|" as separator doesn't buy us much, use "."
var previousUI = {}; var self = {}, that = {};
return { self.previousUI = {};
// sets pandora.user.ui.key to val // sets pandora.user.ui.key to val
// key foo|bar|baz sets pandora.user.ui.foo.bar.baz // key foo|bar|baz sets pandora.user.ui.foo.bar.baz
// (we have to use '|' as a separator since list names may contain '.')
// val null removes a key // val null removes a key
getPrevious: function() { that.getPrevious = function(key) {
return previousUI; return !key ? self.previousUI : self.previousUI[key];
}, };
set: function(/*{key: val} or key, val*/) { that.set = function(/*{key: val} or key, val*/) {
var obj = Ox.makeObject(arguments); var obj = Ox.makeObject(arguments),
previousUI = Ox.clone(pandora.user.ui, true); set = {};
self.previousUI = Ox.clone(pandora.user.ui, true);
Ox.forEach(obj, function(val, key) {
var listSettings = pandora.site.listSettings
if (key == 'list' && !pandora.user.ui.lists[val]) {
// add default list settings
obj['lists|' + val] = {};
Ox.forEach(listSettings, function(listSetting, setting) {
obj['lists|' + val][listSetting] = pandora.site.user.ui[setting];
});
} else if (Object.keys(listSettings).indexOf(key) > -1) {
// add list setting
obj['lists|' + pandora.user.ui.list + '|' + listSettings[key]] = val;
} else if (
key == 'itemView'
&& ['video', 'timeline'].indexOf(val) > -1
&& !pandora.user.ui.videoPoints[pandora.user.ui.item]
) {
// add default videoPoints
obj['videoPoints|' + pandora.user.ui.item] = {'in': 0, out: 0, position: 0};
}
});
Ox.forEach(obj, function(val, key) { Ox.forEach(obj, function(val, key) {
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;
@ -21,18 +42,22 @@ pandora.UI = (function() {
ui = ui[keys[i]]; ui = ui[keys[i]];
i++; i++;
} }
if (ui[keys[i]] !== val) { if (!Ox.isEqual(ui[keys[i]], val)) {
if (val === null) { if (val === null) {
delete ui[keys[i]] delete ui[keys[i]]
} else { } else {
ui[keys[i]] = val; ui[keys[i]] = val;
} }
} else { set[key] = val;
delete obj[key];
} }
}); });
Ox.len(obj) && pandora.api.setUI(obj); if (Ox.len(set)) {
} Ox.forEach(set, function(val, key) {
Ox.Event.trigger(key, val);
});
pandora.api.setUI(set);
} }
};
return that;
}()); }());

607
static/js/pandora/URL.js
View file

@ -1,132 +1,10 @@
// vim: et:ts=4:sw=4:sts=4:ft=javascript // vim: et:ts=4:sw=4:sts=4:ft=javascript
/*
FIXME:
we may want slashes in list names, and ampersands in queries
*/
pandora.URL = (function() { pandora.URL = (function() {
var previousURL = '', var self = {}, that = {};
regexps = {
'^$': function(pathname, search, callback) { /*
if (/^\?url=/.test(search)) {
document.location = decodeURIComponent(search.substr(5));
} else {
if (!search && pandora.user.ui.showHome) {
pandora.$ui.home = pandora.ui.home().showScreen();
Ox.print('LIST', pandora.user.ui.list)
pandora.user.ui.list && pandora.Query.fromString(
'find=list:' + pandora.user.ui.list
);
} else {
pandora.Query.fromString(search);
pandora.UI.set({
section: 'items',
item: ''
});
}
}
callback();
},
'^home$': function(pathname, search, callback) {
pandora.$ui.home = pandora.ui.home().showScreen();
callback();
},
'^(items|edits|texts)$': function(pathname, search, callback) {
pandora.UI.set({
section: pathname
});
callback();
},
'^(about|contact|faq|news|software|terms|tour)$': function(pathname, search, callback) {
pandora.$ui.siteDialog = pandora.ui.siteDialog(pathname).open();
callback();
},
'^help$': function(pathname, search, callback) {
pandora.$ui.helpDialog = pandora.ui.helpDialog().open();
callback();
},
'^(signin|signout|signup)$': function(pathname, search, callback) {
if ((pathname == 'signout') == (pandora.user.level != 'guest')) {
pandora.$ui.accountDialog = (
pandora.user.level == 'guest'
? pandora.ui.accountDialog(pathname)
: pandora.ui.accountSignoutDialog()
).open();
}
callback();
},
'^preferences$': function(pathname, search, callback) {
pandora.$ui.preferencesDialog = pandora.ui.preferencesDialog().open();
callback();
},
'^(calendar|calendars|clip|clips|flow|grid|list|map|maps|timelines)$': function(pathname, search, callback) {
pandora.UI.set({
section: 'items',
item: ''
});
pandora.UI.set('lists|' + pandora.user.ui.list + '|listView', pathname);
pandora.Query.fromString(search);
callback();
},
'.*': function(pathname, search, callback) {
var split = pathname.split('/'),
item = decodeURI(split[0]),
points,
time = split.length > 1
? /[\d\.:,-]+/.exec(split[split.length - 1])
: null,
view = new RegExp(
'^(' + pandora.site.itemViews.map(function(v) {
return v.id;
}).join('|') + ')$'
).exec(split[1]);
view = view ? view[0]
: time ? pandora.user.ui.videoView
: 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() { function foundItem() {
pandora.UI.set(Ox.extend({ pandora.UI.set(Ox.extend({
section: 'items', section: 'items',
@ -207,31 +85,282 @@ pandora.URL = (function() {
} }
} }
} }
*/
function everyCondition(conditions, key, operator) {
// If every condition has the given key and operator
// (excluding conditions where all subconditions match)
// returns true, otherwise false
return Ox.every(conditions, function(condition) {
return condition.key == key && condition.operator == operator;
});
} }
function getFindState(find, listsState, groupsState) {
// The find element is populated if exactly one condition in an & query
// has a findKey as key and "=" as operator (and all other conditions
// are either list or groups), or if all conditions in an | query have
// the same group id as key and "==" as operator
var conditions, indices, state = {index: -1, key: '*', value: ''};
if (find.operator == '&') {
// number of conditions that are not list or groups
conditions = find.conditions.length
- (listsState != '')
- groupsState.filter(function(group) {
return group.index > -1;
}).length;
// indices of non-advanced find queries
indices = Ox.map(pandora.site.findKeys, function(findKey) {
var index = oneCondition(find.conditions, findKey.id, '=');
return index > -1 ? index : null;
});
state = conditions == 1 && indices.length == 1 ? {
index: indices[0],
key: find.conditions[indices[0]].key,
value: decodeURIComponent(find.conditions[indices[0]].value)
} : {
index: -1,
key: conditions == 0 && indices.length == 0 ? '*' : 'advanced',
value: ''
}; };
} else {
function saveURL() { state = {
previousURL = document.location.pathname + document.location.search; index: -1,
key: 'advanced',
value: ''
};
Ox.forEach(pandora.user.ui.groups, function(key) {
if (everyCondition(find.conditions, key, '==')) {
state.key = '*';
return false;
}
});
}
return state;
} }
function updateURL() { function getGroupsState(find) {
// A group is selected if exactly one condition in an & query or every
// condition in an | query has the group id as key and "==" as operator
return pandora.user.ui.groups.map(function(group) {
// FIXME: cant index be an empty array, instead of -1?
var key = group.id,
state = {index: -1, find: Ox.clone(find, true), selected: []};
if (find.operator == '&') {
// include conditions where all subconditions match
state.index = oneCondition(find.conditions, key, '==', true);
if (state.index > -1) {
state.selected = find.conditions[state.index].conditions
? find.conditions[state.index].conditions.map(function(condition) {
return condition.value;
})
: [find.conditions[state.index].value];
}
} else {
if (everyCondition(find.conditions, key, '==')) {
state.index = Ox.range(find.conditions.length);
state.selected = find.conditions.map(function(condition) {
return condition.value;
});
}
}
if (state.selected.length) {
if (Ox.isArray(state.index)) {
// every condition in an | query matches this group
state.find = {conditions: [], operator: ''};
} else {
// one condition in an & query matches this group
state.find.conditions.splice(state.index, 1);
if (state.find.conditions.length == 1) {
if (state.find.conditions[0].conditions) {
// unwrap single remaining bracketed query
state.find = {
conditions: state.find.conditions[0].conditions,
operator: state.find.conditions[0].operator
};
}
}
}
}
return state;
});
}
function getListsState(find) {
// A list is selected if exactly one condition in an & query has "list"
// as key and "==" as operator
var index, state = '';
if (find.operator == '&') {
index = oneCondition(find.conditions, 'list', '==');
if (index > -1) {
state = find.conditions[index].value;
}
}
return state;
}
function getState() {
if (!pandora.user.ui.lists[pandora.user.ui.list]) {
pandora.user.ui.lists[pandora.user.ui.list] = pandora.site.user.ui.lists[''];
}
return {
type: pandora.user.ui.section == 'items'
? pandora.site.itemsSection
: pandora.user.ui.section,
item: pandora.user.ui.item,
view: !pandora.user.ui.item
? pandora.user.ui.lists[pandora.user.ui.list].view
: pandora.user.ui.itemView,
sort: !pandora.user.ui.item
? pandora.user.ui.lists[pandora.user.ui.list].sort
: pandora.isClipView(pandora.user.ui.itemView)
? pandora.user.ui.itemSort : [],
find: !pandora.user.ui.item
? pandora.user.ui.find
: ''
};
}
function oneCondition(conditions, key, operator, includeSubconditions) {
// If exactly one condition has the given key and operator
// (including or excluding conditions where all subconditions match)
// returns the corresponding index, otherwise returns -1
var indices = Ox.map(conditions, function(condition, i) {
return (
condition.conditions
? includeSubconditions && everyCondition(condition.conditions, key, operator)
: condition.key == key && condition.operator == operator
) ? i : null;
});
return indices.length == 1 ? indices[0] : -1;
}
function setState(state) {
Ox.print('STATE:', state)
var previousUI = pandora.UI.getPrevious(); var previousUI = pandora.UI.getPrevious();
// var previousUI = Ox.clone(pandora.user.ui);
Ox.Request.cancel(); Ox.Request.cancel();
$('video').each(function() { $('video').each(function() {
$(this).trigger('stop'); $(this).trigger('stop');
}); });
pandora.URL.parse(function() { pandora.user.ui._groupsState = getGroupsState(pandora.user.ui.find);
pandora.user.ui._findState = getFindState(pandora.user.ui.find, pandora.user.ui.list, pandora.user.ui._groupsState);
if (Ox.isEmpty(state)) {
if (pandora.user.ui.showHome) {
pandora.$ui.home = pandora.ui.home().showScreen();
/*
Ox.print('LIST', pandora.user.ui.list)
pandora.user.ui.list && pandora.Query.fromString(
'find=list:' + pandora.user.ui.list
);
*/
} else {
pandora.UI.set({
section: 'items',
item: ''
});
}
} else if (state.page) {
if (state.page == 'home') {
//pandora.$ui.home = pandora.ui.home().showScreen();
pandora.$ui.home = pandora.ui.home().fadeInScreen();
} else if ([
'about', 'contact', 'faq', 'news', 'software', 'terms', 'tour'
].indexOf(state.page) > -1) {
pandora.$ui.siteDialog = pandora.ui.siteDialog(state.page).open();
} else if (state.page == 'help') {
pandora.$ui.helpDialog = pandora.ui.helpDialog().open();
} else if (['signup', 'signin'].indexOf(state.page) > -1) {
if (pandora.user.level == 'guest') {
pandora.ui.accountDialog(state.page).open();
} else {
pandora.URL.replace('/');
}
} else if (['preferences', 'signout'].indexOf(state.page) > -1) {
if (pandora.user.level == 'guest') {
pandora.URL.replace('/');
} else if (state.page == 'preferences') {
pandora.ui.preferencesDialog().open();
} else {
pandora.ui.accountSignoutDialog().open();
}
} else if (state.page == 'api') {
document.location.href = '/api/';
}
} else {
pandora.UI.set({
section: state.type == pandora.site.itemsSection ? 'items' : state.type,
item: state.item,
});
state.find && pandora.UI.set({
find: state.find,
list: getListsState(state.find)
});
if (!pandora.user.ui.lists[pandora.user.ui.list]) {
pandora.UI.set(
'lists|' + pandora.user.ui.list,
pandora.site.user.ui.lists['']
);
}
if (state.view) {
pandora.UI.set(
!pandora.user.ui.item
? 'lists|' + pandora.user.ui.list + '|view'
: 'itemView',
state.view
);
}
pandora.user.ui._groupsState = getGroupsState(pandora.user.ui.find);
Ox.print('_groupsState =', pandora.user.ui._groupsState);
pandora.user.ui._findState = getFindState(pandora.user.ui.find, pandora.user.ui.list, pandora.user.ui._groupsState);
if (['video', 'timeline'].indexOf(pandora.user.ui.itemView) > -1) {
if (state.span) {
pandora.UI.set('videoPoints|' + pandora.user.ui.item, {
position: state.span[0],
'in': state.span[1] || 0,
out: state.span[2] || 0
});
} else if (!pandora.user.ui.videoPoints[pandora.user.ui.item]) {
pandora.UI.set('videoPoints|' + pandora.user.ui.item, {
position: 0,
'in': 0,
out: 0
});
}
}
state.sort && pandora.UI.set(
!pandora.user.ui.item
? 'lists|' + pandora.user.ui.list + '|sort'
: 'itemSort',
state.sort
);
if (!pandora.$ui.appPanel) {
return;
}
if (pandora.user.ui.section != previousUI.section) { if (pandora.user.ui.section != previousUI.section) {
// new 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) {
// list to list // list to list
Ox.print('pUI', previousUI);
var isClipView = pandora.isClipView(), var isClipView = pandora.isClipView(),
list = pandora.user.ui.lists[pandora.user.ui.list], list = pandora.user.ui.lists[pandora.user.ui.list],
previousList = previousUI.lists[previousUI.list], previousList = previousUI.lists[previousUI.list],
wasClipView = pandora.isClipView(previousList.listView); wasClipView = pandora.isClipView(previousList.view);
if (list.listView != previousList.listView) { if (pandora.user.ui.list != previousUI.list) {
pandora.$ui.mainMenu.checkItem('viewMenu_movies_' + list.listView); pandora.$ui.findElement.replaceWith(pandora.$ui.findElement = pandora.ui.findElement());
pandora.$ui.viewSelect.options({value: list.listView}); }
if (list.view != previousList.view) {
pandora.$ui.mainMenu.checkItem('viewMenu_movies_' + list.view);
pandora.$ui.viewSelect.options({value: list.view});
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());
@ -248,7 +377,84 @@ pandora.URL = (function() {
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());
if (Ox.isEqual(pandora.user.ui.query, previousUI.query)) { if (Ox.isEqual(pandora.user.ui.find, previousUI.find)) {
pandora.$ui.contentPanel.replaceElement(1, pandora.$ui.list = pandora.ui.list());
} else {
pandora.user.ui._groupsState.forEach(function(data, i) {
if (!Ox.isEqual(data.find, previousUI._groupsState[i].find)) {
pandora.$ui.groups[i].reloadList();
}
});
pandora.$ui.contentPanel.replaceElement(1, pandora.$ui.list = pandora.ui.list());
//pandora.$ui.mainPanel.replaceElement(1, pandora.$ui.rightPanel = pandora.ui.rightPanel());
}
// fixme: should list selection and deselection happen here?
// (home and menu may cause a list switch)
} else if (!pandora.user.ui.item || !previousUI.item) {
// list to item or item to list
pandora.$ui.leftPanel.replaceElement(2, pandora.$ui.info = pandora.ui.info());
pandora.$ui.mainPanel.replaceElement(1, pandora.$ui.rightPanel = pandora.ui.rightPanel());
} else {
// item to item
if (pandora.user.ui.item != previousUI.item) {
pandora.$ui.leftPanel.replaceElement(2, pandora.$ui.info = pandora.ui.info());
}
pandora.$ui.contentPanel.replaceElement(1, pandora.ui.item());
}
if (
previousUI.item
&& ['video', 'timeline'].indexOf(previousUI.itemView) > -1
) {
var $item = pandora.$ui[
previousUI.itemView == 'video' ? 'player' : 'editor'
];
$item && pandora.UI.set(
'videoPoints|' + previousUI.item + '|position',
$item.options('position')
);
}
}
pandora.user.ui.showHome = false;
}
function updateUI() {
// remove later
var previousUI = pandora.UI.getPrevious();
Ox.Request.cancel();
$('video').each(function() {
$(this).trigger('stop');
});
pandora.URL.parse(function() {
if (pandora.user.ui.section != previousUI.section) {
pandora.$ui.appPanel.replaceElement(1, pandora.$ui.mainPanel = pandora.ui.mainPanel());
} else if (!pandora.user.ui.item && !previousUI.item) {
// list to list
var isClipView = pandora.isClipView(),
list = pandora.user.ui.lists[pandora.user.ui.list],
previousList = previousUI.lists[previousUI.list],
wasClipView = pandora.isClipView(previousList.view);
if (list.view != previousList.view) {
pandora.$ui.mainMenu.checkItem('viewMenu_movies_' + list.view);
pandora.$ui.viewSelect.options({value: list.view});
if (isClipView != wasClipView) {
pandora.$ui.mainMenu.replaceMenu('sortMenu', pandora.getSortMenu());
pandora.$ui.sortSelect.replaceWith(pandora.$ui.sortSelect = pandora.ui.sortSelect());
if (isClipView && !wasClipView) {
pandora.UI.set('lists|' + pandora.user.ui.list + '|selected', []);
}
}
}
if (!Ox.isEqual(list.sort, previousList.sort)) {
pandora.$ui.mainMenu.checkItem('sortMenu_sortmovies_' + list.sort[0].key);
pandora.$ui.mainMenu.checkItem('sortMenu_ordermovies_' + ((
list.sort[0].operator || pandora.getSortOperator(list.sort[0].key)
) == '+' ? 'ascending' : 'descending'));
pandora.$ui.sortSelect.options({value: list.sort[0].key});
}
pandora.$ui.leftPanel.replaceElement(2, pandora.$ui.info = pandora.ui.info());
if (Ox.isEqual(pandora.user.ui.find, previousUI.find)) {
pandora.$ui.contentPanel.replaceElement(1, pandora.$ui.list = pandora.ui.list()); pandora.$ui.contentPanel.replaceElement(1, pandora.$ui.list = pandora.ui.list());
} else { } else {
pandora.$ui.mainPanel.replaceElement(1, pandora.$ui.rightPanel = pandora.ui.rightPanel()); pandora.$ui.mainPanel.replaceElement(1, pandora.$ui.rightPanel = pandora.ui.rightPanel());
@ -281,8 +487,133 @@ pandora.URL = (function() {
}); });
} }
return { that.init = function() {
var itemsSection = pandora.site.itemsSection,
findKeys, sortKeys = {}, spanType = {}, views = {};
views[itemsSection] = {
list: Ox.merge(
// listView is the default view
[pandora.user.ui.listView],
Ox.map(pandora.site.listViews, function(view) {
return view.id == pandora.user.ui.listView ? null : view.id;
})
),
item: Ox.merge(
// itemView is the default view,
// videoView is the default view if there is a duration
[pandora.user.ui.itemView, pandora.user.ui.videoView],
pandora.site.itemViews.map(function(view) {
return [
'info', pandora.user.ui.videoView
].indexOf(view.id) > -1 ? null : view.id;
})
)
};
sortKeys[itemsSection] = {list: {}, item: {}};
views[itemsSection].list.forEach(function(view) {
sortKeys[itemsSection].list[view] = Ox.merge(
pandora.isClipView(view) ? Ox.clone(pandora.site.clipKeys) : [],
// listSort[0].key is the default sort key
[Ox.getObjectById(pandora.site.sortKeys, pandora.user.ui.listSort[0].key)],
Ox.map(pandora.site.sortKeys, function(key) {
return key.id == pandora.user.ui.listSort[0].key ? null : key;
})
);
});
views[itemsSection].item.forEach(function(view) {
if (pandora.isClipView(view, true)) {
sortKeys[itemsSection].item[view] = Ox.merge(
// itemSort[0].key is the default sort key
[Ox.getObjectById(pandora.site.clipKeys, pandora.user.ui.itemSort[0].key)],
Ox.map(pandora.site.clipKeys, function(key) {
return key.id == pandora.user.ui.itemSort ? null : key;
})
);
}
});
spanType[itemsSection] = {
list: {
map: 'location',
calendar: 'date'
},
item: {
video: 'duration',
timeline: 'duration',
map: 'location',
calendar: 'date'
}
};
findKeys = Ox.merge([{id: 'list', type: 'string'}], pandora.site.itemKeys);
self.URL = Ox.URL({
findKeys: findKeys,
getItem: pandora.getItemByIdOrTitle,
getSpan: pandora.getMetadataByIdOrName,
pages: [
'about', 'api', 'contact', 'faq', 'help', 'home', 'news',
'preferences', 'signin', 'signout', 'signup',
'software', 'terms', 'tour'
],
sortKeys: sortKeys,
spanType: spanType,
types: [pandora.site.itemName.plural.toLowerCase(), 'edits', 'texts'],
views: views
});
return that;
};
// on page load, this sets the state from the URL
that.parse = function(callback) {
if (document.location.pathname.substr(0, 4) == 'url=') {
document.location.href = decodeURI(document.location.pathname.substr(4));
} else {
self.URL.parse(function(state) {
setState(state);
callback();
});
}
return that;
};
// sets the URL to the previous URL
that.pop = function() {
self.URL.pop();
};
// pushes a new URL (as string or from state)
that.push = function(url) {
Ox.print('push', arguments[0])
if (url) {
self.URL.push(url, setState);
} else {
var state = getState();
Ox.print('&&&&&&&', state)
self.URL.push(state);
setState(state);
}
return that;
};
// replaces the current URL (as string or from state)
that.replace = function(url) {
if (url) {
self.URL.replace(url, setState)
} else {
self.URL.replace(getState());
}
return that;
};
return that;
/*
parse: function(callback) { parse: function(callback) {
var pathname = document.location.pathname.substr(1), var pathname = document.location.pathname.substr(1),
search = document.location.search.substr(1); search = document.location.search.substr(1);
@ -342,8 +673,8 @@ pandora.URL = (function() {
update: function() { update: function() {
this.set(pandora.Query.toString()); this.set(pandora.Query.toString());
}, }
}; */
}()); }());

28
static/js/pandora/pandora.js
View file

@ -298,16 +298,15 @@ pandora.getGroupsSizes = function() {
pandora.getInfoHeight = function() { pandora.getInfoHeight = function() {
// fixme: new, check if it can be used more // fixme: new, check if it can be used more
var isVideoPreview, list var isVideoPreview
if (!pandora.user.ui.item) { if (!pandora.user.ui.item) {
list = pandora.user.ui.lists[pandora.user.ui.list]; isVideoPreview = pandora.user.ui.listSelection.length && !pandora.isClipView();
isVideoPreview = list.selected.length && !pandora.isClipView(list.listView);
} else { } else {
isVideoPreview = !pandora.isClipView(pandora.user.ui.itemView, true); isVideoPreview = !pandora.isClipView();
} }
return pandora.user.ui.showInfo * Math.min( return pandora.user.ui.showInfo * Math.min(
isVideoPreview isVideoPreview
? pandora.user.ui.sidebarSize / (16/9) + 16 ? Math.round(pandora.user.ui.sidebarSize / (16/9)) + 16
: pandora.user.ui.sidebarSize, : pandora.user.ui.sidebarSize,
window.innerHeight - 109 // 20 menu + 24 bar + 64 (4 closed folders) + 1 resizebar window.innerHeight - 109 // 20 menu + 24 bar + 64 (4 closed folders) + 1 resizebar
); );
@ -329,7 +328,6 @@ pandora.getItemByIdOrTitle = function(str, callback) {
}, function(result) { }, function(result) {
var id = ''; var id = '';
if (result.data.items.length) { if (result.data.items.length) {
Ox.print('AAAAAA', result.data.items)
var items = Ox.map(result.data.items, function(item) { var items = Ox.map(result.data.items, function(item) {
// test if exact match or word match // test if exact match or word match
var sort = new RegExp('^' + str + '$', 'i').test(item.title) ? 2000000 var sort = new RegExp('^' + str + '$', 'i').test(item.title) ? 2000000
@ -338,7 +336,6 @@ pandora.getItemByIdOrTitle = function(str, callback) {
// fixme: remove the (...|| 0) check once the backend sends correct data // fixme: remove the (...|| 0) check once the backend sends correct data
}); });
if (items.length) { if (items.length) {
Ox.print('BBBBBB', items)
id = items.sort(function(a, b) { id = items.sort(function(a, b) {
return b.sort - a.sort; return b.sort - a.sort;
})[0].id; })[0].id;
@ -458,24 +455,24 @@ pandora.getMetadataByIdOrName = function(item, view, str, callback) {
}; };
pandora.getSortMenu = function() { pandora.getSortMenu = function() {
var list = pandora.user.ui.lists[pandora.user.ui.list], var ui = pandora.user.ui,
isClipView = pandora.isClipView(list.listView); isClipView = pandora.isClipView(ui.listView);
return { id: 'sortMenu', title: 'Sort', items: [ return { id: 'sortMenu', title: 'Sort', items: [
{ id: 'sortmovies', title: 'Sort ' + (isClipView ? 'Clips' : pandora.site.itemName.plural) + ' by', items: [ { id: 'sortmovies', title: 'Sort ' + (isClipView ? 'Clips' : pandora.site.itemName.plural) + ' by', items: [
{ group: 'sortmovies', min: 1, max: 1, items: Ox.merge(isClipView ? Ox.merge(pandora.site.clipKeys.map(function(key) { { group: 'sortmovies', min: 1, max: 1, items: Ox.merge(isClipView ? Ox.merge(pandora.site.clipKeys.map(function(key) {
return Ox.extend({ return Ox.extend({
checked: list.sort[0].key == key.id checked: ui.listSort[0].key == key.id
}, key); }, key);
}), {}) : [], pandora.site.sortKeys.map(function(key) { }), {}) : [], pandora.site.sortKeys.map(function(key) {
return Ox.extend({ return Ox.extend({
checked: list.sort[0].key == key.id checked: ui.listSort[0].key == key.id
}, key); }, key);
})) } })) }
] }, ] },
{ id: 'ordermovies', title: 'Order ' + (isClipView ? 'Clips' : pandora.site.itemName.plural), items: [ { id: 'ordermovies', title: 'Order ' + (isClipView ? 'Clips' : pandora.site.itemName.plural), items: [
{ group: 'ordermovies', min: 1, max: 1, items: [ { group: 'ordermovies', min: 1, max: 1, items: [
{ id: 'ascending', title: 'Ascending', checked: (list.sort[0].operator || pandora.getSortOperator(list.sort[0].key)) == '+' }, { id: 'ascending', title: 'Ascending', checked: (ui.listSort[0].operator || pandora.getSortOperator(ui.listSort[0].key)) == '+' },
{ id: 'descending', title: 'Descending', checked: (list.sort[0].operator || pandora.getSortOperator(list.sort[0].key)) == '-' } { id: 'descending', title: 'Descending', checked: (ui.listSort[0].operator || pandora.getSortOperator(ui.listSort[0].key)) == '-' }
]} ]}
] }, ] },
{ id: 'advancedsort', title: 'Advanced Sort...', keyboard: 'shift control s' }, { id: 'advancedsort', title: 'Advanced Sort...', keyboard: 'shift control s' },
@ -548,7 +545,10 @@ pandora.getVideoPartsAndPoints = function(durations, points) {
}; };
pandora.isClipView = function(view, item) { pandora.isClipView = function(view, item) {
view = view || pandora.user.ui.lists[pandora.user.ui.list].listView; if (arguments.length == 0) {
item = pandora.user.ui.item;
view = !item ? pandora.user.ui.listView : pandora.user.ui.itemView;
}
return ( return (
!item ? ['calendar', 'clip', 'map'] : ['calendar', 'clips', 'map'] !item ? ['calendar', 'clip', 'map'] : ['calendar', 'clips', 'map']
).indexOf(view) > -1; ).indexOf(view) > -1;

1
static/js/pandora/ui/backButton.js
View file

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

33
static/js/pandora/ui/browser.js
View file

@ -44,23 +44,25 @@ pandora.ui.browser = function() {
draggable: true, draggable: true,
id: 'list', id: 'list',
item: function(data, sort, size) { item: function(data, sort, size) {
var icons = pandora.user.ui.icons, var ui = pandora.user.ui,
ratio = icons == 'posters' ? data.posterRatio : 1; ratio = ui.icons == 'posters'
? (ui.showSitePoster ? 5/8 : data.posterRatio) : 1,
size = size || 64; size = size || 64;
return { return {
height: ratio <= 1 ? size : size / ratio, height: ratio <= 1 ? size : size / ratio,
id: data.id, id: data.id,
info: data[['title', 'director'].indexOf(sort[0].key) > -1 ? 'year' : sort[0].key], info: data[['title', 'director'].indexOf(sort[0].key) > -1 ? 'year' : sort[0].key],
title: data.title + (data.director ? ' (' + data.director + ')' : ''), title: data.title + (data.director ? ' (' + data.director + ')' : ''),
url: icons == 'posters' url: '/' + data.id + '/' + (
? '/' + data.id + '/poster' + size + '.jpg' ui.icons == 'posters'
: '/' + data.id + '/icon' + size + '.jpg', ? (ui.showSitePoster ? 'siteposter' : 'poster') : 'icon'
) + size + '.jpg',
width: ratio >= 1 ? size : size * ratio width: ratio >= 1 ? size : size * ratio
}; };
}, },
items: function(data, callback) { items: function(data, callback) {
pandora.api.find(Ox.extend(data, { pandora.api.find(Ox.extend(data, {
query: pandora.user.ui.query query: pandora.user.ui.find
}), callback); }), callback);
}, },
keys: ['director', 'id', 'posterRatio', 'title', 'year'], keys: ['director', 'id', 'posterRatio', 'title', 'year'],
@ -69,7 +71,7 @@ pandora.ui.browser = function() {
orientation: 'horizontal', orientation: 'horizontal',
selected: [pandora.user.ui.item], selected: [pandora.user.ui.item],
size: 64, size: 64,
sort: pandora.user.ui.lists[pandora.user.ui.list].sort, sort: pandora.user.ui.listSort,
unique: 'id' unique: 'id'
}) })
.bindEvent({ .bindEvent({
@ -77,8 +79,10 @@ pandora.ui.browser = function() {
that.scrollToSelection(); that.scrollToSelection();
}, },
select: function(data) { select: function(data) {
pandora.UI.set('lists|' + pandora.user.ui.list + '|selected', data.ids); pandora.UI.set({
pandora.URL.set(data.ids[0]); 'listSelection': data.ids,
'item': data.ids[0]
});
}, },
toggle: function(data) { toggle: function(data) {
pandora.UI.set({showMovies: !data.collapsed}); pandora.UI.set({showMovies: !data.collapsed});
@ -90,6 +94,17 @@ pandora.ui.browser = function() {
} }
}); });
pandora.enableDragAndDrop(that, false); pandora.enableDragAndDrop(that, false);
Ox.Event.bind({
icons: function(value) {
that.options({
borderRadius: value == 'posters' ? 0 : 8,
defaultRatio: value == 'posters' ? 5/8 : 1
}).reloadList(true);
},
showSitePoster: function() {
that.reloadList(true);
}
});
} }
that.update = function() { that.update = function() {
pandora.$ui.contentPanel.replaceElement(0, pandora.$ui.browser = pandora.ui.browser()); pandora.$ui.contentPanel.replaceElement(0, pandora.$ui.browser = pandora.ui.browser());

8
static/js/pandora/ui/contentPanel.js
View file

@ -28,6 +28,14 @@ pandora.ui.contentPanel = function() {
], ],
orientation: 'vertical' orientation: 'vertical'
}); });
Ox.Event.bind({
listView: function() {
that.replaceElement(1, pandora.$ui.list = pandora.ui.list());
},
itemView: function() {
that.replaceElement(1, pandora.$ui.item = pandora.ui.item());
}
});
return that; return that;
}; };

4
static/js/pandora/ui/filter.js
View file

@ -49,8 +49,8 @@ pandora.ui.filter = function(list) {
}); });
} else { } else {
pandora.user.ui.query = data.query; pandora.UI.set('query', data.query);
pandora.URL.update(); pandora.URL.push();
//reload(); //reload();
} }
} }

27
static/js/pandora/ui/findElement.js
View file

@ -1,8 +1,8 @@
// vim: et:ts=4:sw=4:sts=4:ft=javascript // vim: et:ts=4:sw=4:sts=4:ft=javascript
pandora.ui.findElement = function() { pandora.ui.findElement = function() {
var findIndex = pandora.user.ui.find.index, var findIndex = pandora.user.ui._findState.index,
findKey = pandora.user.ui.find.key, findKey = pandora.user.ui._findState.key,
findValue = pandora.user.ui.find.value; findValue = pandora.user.ui._findState.value;
var that = Ox.FormElementGroup({ var that = Ox.FormElementGroup({
elements: Ox.merge(pandora.user.ui.list ? [ elements: Ox.merge(pandora.user.ui.list ? [
pandora.$ui.findListSelect = Ox.Select({ pandora.$ui.findListSelect = Ox.Select({
@ -78,20 +78,21 @@ pandora.ui.findElement = function() {
&& pandora.$ui.findListSelect.value() == 'list', && pandora.$ui.findListSelect.value() == 'list',
key = pandora.$ui.findSelect.value(), key = pandora.$ui.findSelect.value(),
conditions = data.value ? [{ conditions = data.value ? [{
key: key == 'all' ? '' : key, key: key,
value: data.value, value: data.value,
operator: '' operator: '='
}] : []; }] : [];
if (findInList) { if (findInList) {
pandora.user.ui.query = { pandora.UI.set('find', {
conditions: Ox.merge([{ conditions: Ox.merge([{
key: 'list', key: 'list',
value: pandora.user.ui.list, value: pandora.user.ui.list,
operator: '' operator: '=='
}], conditions), }], conditions),
operator: '&' operator: '&'
} });
data.value && findIndex == 0 && pandora.user.ui.query.conditions.reverse(); // fixme: what was this?
// data.value && findIndex == 0 && pandora.user.ui.find.conditions.reverse();
} else { } else {
if (pandora.user.ui.list) { if (pandora.user.ui.list) {
Ox.forEach(pandora.$ui.folderList, function($list) { Ox.forEach(pandora.$ui.folderList, function($list) {
@ -99,12 +100,12 @@ pandora.ui.findElement = function() {
}); });
pandora.UI.set({list: ''}); pandora.UI.set({list: ''});
} }
pandora.user.ui.query = { pandora.UI.set('find', {
conditions: conditions, conditions: conditions,
operator: '' operator: ''
});
} }
} pandora.URL.push();
pandora.URL.set(pandora.Query.toString());
} }
}) })
]), ]),
@ -115,7 +116,7 @@ pandora.ui.findElement = function() {
margin: '4px' margin: '4px'
}); });
function autocompleteFunction() { function autocompleteFunction() {
return pandora.user.ui.query.conditions.length ? function(value, callback) { return pandora.user.ui.find.conditions.length ? function(value, callback) {
var elementValue = that.value(), var elementValue = that.value(),
key = elementValue[pandora.user.ui.list ? 1 : 0], key = elementValue[pandora.user.ui.list ? 1 : 0],
findKey = Ox.getObjectById(pandora.site.findKeys, key); findKey = Ox.getObjectById(pandora.site.findKeys, key);

18
static/js/pandora/ui/foldersList.js
View file

@ -29,9 +29,11 @@ pandora.ui.folderList = function(id) {
width: 16 width: 16
}, },
{ {
/*
format: function(value) { format: function(value) {
return value.split('/').join(': '); return value.split('/').join(': ');
}, },
*/
id: 'id', id: 'id',
operator: '+', operator: '+',
unique: true, unique: true,
@ -376,13 +378,25 @@ pandora.ui.folderList = function(id) {
id != id_ && $list.options('selected', []); id != id_ && $list.options('selected', []);
}); });
} }
pandora.URL.set(data.ids.length ? '?find=list:' + data.ids[0] : ''); // pandora.URL.push(data.ids.length ? '/list==' + data.ids[0] : '')
/* /*
pandora.UI.set({ pandora.UI.set({
item: '', item: '',
list: data.ids.length ? data.ids[0] : '' list: data.ids.length ? data.ids[0] : ''
}); })
pandora.URL.push();
*/ */
pandora.UI.set({
item: '',
list: data.ids.length ? data.ids[0] : '',
find: {
conditions: data.ids.length ? [
{key: 'list', value: data.ids[0], operator: '=='}
] : [],
operator: '&'
}
})
pandora.URL.push();
}, },
submit: function(data) { submit: function(data) {
data_ = {id: data.id}; data_ = {id: data.id};

64
static/js/pandora/ui/group.js
View file

@ -1,6 +1,5 @@
// vim: et:ts=4:sw=4:sts=4:ft=javascript // vim: et:ts=4:sw=4:sts=4:ft=javascript
pandora.ui.group = function(id) { pandora.ui.group = function(id) {
//Ox.print('group', id, Ox.getPositionById(pandora.user.ui.groups, id))
var i = Ox.getPositionById(pandora.user.ui.groups, id), var i = Ox.getPositionById(pandora.user.ui.groups, id),
group = Ox.getObjectById(pandora.site.groups, id), group = Ox.getObjectById(pandora.site.groups, id),
panelWidth = pandora.$ui.document.width() - (pandora.user.ui.showSidebar * pandora.user.ui.sidebarSize) - 1, panelWidth = pandora.$ui.document.width() - (pandora.user.ui.showSidebar * pandora.user.ui.sidebarSize) - 1,
@ -32,7 +31,6 @@ pandora.ui.group = function(id) {
.css({ .css({
float: 'left', float: 'left',
width: pandora.user.ui.groupsSizes[i] - 64 - Ox.UI.SCROLLBAR_SIZE, width: pandora.user.ui.groupsSizes[i] - 64 - Ox.UI.SCROLLBAR_SIZE,
//background: 'red',
textOverflow: 'ellipsis', textOverflow: 'ellipsis',
overflowX: 'hidden' overflowX: 'hidden'
}) })
@ -62,14 +60,14 @@ pandora.ui.group = function(id) {
delete data.keys; delete data.keys;
return pandora.api.find(Ox.extend(data, { return pandora.api.find(Ox.extend(data, {
group: id, group: id,
query: pandora.user.ui.groupsData[i].query query: pandora.user.ui._groupsState[i].find
}), callback); }), callback);
//} else { //} else {
// callback({data: {items: data.keys ? [] : 0}}); // callback({data: {items: data.keys ? [] : 0}});
//} //}
}, },
scrollbarVisible: true, scrollbarVisible: true,
selected: pandora.user.ui.groupsData[i].selected, selected: pandora.user.ui._groupsState[i].selected,
sort: [{ sort: [{
key: pandora.user.ui.groups[i].sort[0].key, key: pandora.user.ui.groups[i].sort[0].key,
operator: pandora.user.ui.groups[i].sort[0].operator operator: pandora.user.ui.groups[i].sort[0].operator
@ -80,52 +78,61 @@ pandora.ui.group = function(id) {
pandora.$ui.list.triggerEvent('paste', data); pandora.$ui.list.triggerEvent('paste', data);
}, },
select: function(data) { select: function(data) {
// FIXME: cant index be an empty array, instead of -1?
var conditions = data.ids.map(function(value) { var conditions = data.ids.map(function(value) {
return { return {
key: id, key: id,
value: value, value: value,
operator: '=' operator: '=='
}; };
}), }),
index = pandora.user.ui.groupsData[i].index; index = pandora.user.ui._groupsState[i].index,
find = Ox.clone(pandora.user.ui.find, true);
if (Ox.isArray(index)) { if (Ox.isArray(index)) {
// this group had multiple selections and the | query // this group had multiple selections and the | query
// was on the top level, i.e. not bracketed // was on the top level, i.e. not bracketed
pandora.user.ui.query = { find = {
conditions: conditions, conditions: conditions,
operator: conditions.length > 1 ? '|' : '' operator: conditions.length > 1 ? '|' : '&'
} }
} else { } else {
if (index == -1) { if (index == -1) {
// this group had no selection, i.e. no query // this group had no selection, i.e. no query
index = pandora.user.ui.query.conditions.length; index = find.conditions.length;
if (pandora.user.ui.query.operator == '|') { if (find.operator == '|') {
pandora.user.ui.query = { find = {
conditions: [pandora.user.ui.query], conditions: [find],
operator: '&' operator: '&'
}; };
index = 1; index = 1;
} else { } else {
pandora.user.ui.query.operator = index ? '&' : ''; find.operator = '&';
} }
} }
if (conditions.length == 0) { if (conditions.length == 0) {
pandora.user.ui.query.conditions.splice(index, 1); // nothing selected
if (pandora.user.ui.query.conditions.length == 1) { find.conditions.splice(index, 1);
pandora.user.ui.query.operator = ''; if (find.conditions.length == 1) {
find.operator = '&';
} }
} else if (conditions.length == 1) { } else if (conditions.length == 1) {
pandora.user.ui.query.conditions[index] = conditions[0]; // one item selected
find.conditions[index] = conditions[0];
} else { } else {
pandora.user.ui.query.conditions[index].conditions = conditions; // multiple items selected
pandora.user.ui.query.conditions[index].operator = '|'; find.conditions[index].conditions = conditions;
delete pandora.user.ui.query.conditions[index].key; find.conditions[index].operator = '|';
delete pandora.user.ui.query.conditions[index].value; delete find.conditions[index].key;
delete find.conditions[index].value;
} }
} }
/*
pandora.Query.updateGroups(); pandora.Query.updateGroups();
pandora.URL.push(pandora.Query.toString()); pandora.URL.push(pandora.Query.toString());
pandora.reloadGroups(i); pandora.reloadGroups(i);
*/
pandora.UI.set('find', find);
pandora.URL.push();
}, },
sort: function(data) { sort: function(data) {
Ox.print('SORT', data) Ox.print('SORT', data)
@ -154,9 +161,9 @@ pandora.ui.group = function(id) {
i_ = Ox.getPositionById(pandora.user.ui.groups, id_); i_ = Ox.getPositionById(pandora.user.ui.groups, id_);
if (i_ == -1) { if (i_ == -1) {
// new group was not part of old group set // new group was not part of old group set
if (pandora.user.ui.groupsData[i].selected.length) { if (pandora.user.ui._groupsState[i].selected.length) {
// if group with selection gets replaced, reload // if group with selection gets replaced, reload
pandora.user.ui.query.conditions.splice(pandora.user.ui.groupsData[i].index, 1); pandora.user.ui.find.conditions.splice(pandora.user.ui._groupsState[i].index, 1);
pandora.Query.updateGroups(); pandora.Query.updateGroups();
pandora.URL.push(pandora.Query.toString()); pandora.URL.push(pandora.Query.toString());
pandora.reloadGroups(i); pandora.reloadGroups(i);
@ -169,9 +176,9 @@ pandora.ui.group = function(id) {
// if part of the existing query works as a group selection in the new group // if part of the existing query works as a group selection in the new group
} else { } else {
// swap two existing groups // swap two existing groups
var groupsData = Ox.clone(pandora.user.ui.groupsData[i]); var groupsData = Ox.clone(pandora.user.ui._groupsState[i]);
pandora.user.ui.groupsData[i] = pandora.user.ui.groupsData[i_]; pandora.user.ui._groupsState[i] = pandora.user.ui._groupsState[i_];
pandora.user.ui.groupsData[i_] = groupsData; pandora.user.ui._groupsState[i_] = groupsData;
groups[i] = makeGroup(id_, pandora.user.ui.groups[i_].sort); groups[i] = makeGroup(id_, pandora.user.ui.groups[i_].sort);
groups[i_] = makeGroup(id, pandora.user.ui.groups[i].sort); groups[i_] = makeGroup(id, pandora.user.ui.groups[i].sort);
pandora.UI.set({groups: groups}); pandora.UI.set({groups: groups});
@ -187,8 +194,8 @@ pandora.ui.group = function(id) {
sort: sort || [{key: group.type == 'integer' ? 'name' : 'items', operator: '-'}] sort: sort || [{key: group.type == 'integer' ? 'name' : 'items', operator: '-'}]
}; };
} }
function replaceGroup(i, id, query) { function replaceGroup(i, id, find) {
// if query is passed, selected items will be derived from it // if find is passed, selected items will be derived from it
var isOuter = i % 4 == 0; var isOuter = i % 4 == 0;
pandora.$ui[isOuter ? 'browser' : 'groupsInnerPanel'].replaceElement( pandora.$ui[isOuter ? 'browser' : 'groupsInnerPanel'].replaceElement(
isOuter ? i / 2 : i - 1, isOuter ? i / 2 : i - 1,
@ -202,7 +209,6 @@ pandora.ui.group = function(id) {
pandora.ui.groups = function() { pandora.ui.groups = function() {
var $groups = []; var $groups = [];
//pandora.user.queryGroups = [];
pandora.user.ui.groups.forEach(function(group, i) { pandora.user.ui.groups.forEach(function(group, i) {
$groups[i] = pandora.ui.group(group.id); $groups[i] = pandora.ui.group(group.id);
}); });

14
static/js/pandora/ui/home.js
View file

@ -59,7 +59,7 @@ pandora.ui.home = function() {
}) })
.bind({ .bind({
click: function() { click: function() {
pandora.URL.pushPrevious(); pandora.URL.pop();
that.fadeOutScreen(); that.fadeOutScreen();
} }
}) })
@ -107,7 +107,7 @@ pandora.ui.home = function() {
click: function() { click: function() {
var folder = pandora.getListData().folder; var folder = pandora.getListData().folder;
folder && pandora.$ui.folderList[folder].options({selected: []}); folder && pandora.$ui.folderList[folder].options({selected: []});
pandora.URL.set('/?find=' + $findInput.value()); pandora.URL.push('/*=' + $findInput.value());
that.fadeOutScreen(); that.fadeOutScreen();
} }
}) })
@ -127,7 +127,7 @@ pandora.ui.home = function() {
}) })
.bindEvent({ .bindEvent({
click: function() { click: function() {
pandora.URL.pushPrevious(); pandora.URL.push();
that.fadeOutScreen(); that.fadeOutScreen();
} }
}) })
@ -147,7 +147,7 @@ pandora.ui.home = function() {
}) })
.bindEvent({ .bindEvent({
click: function() { click: function() {
pandora.URL.set('/signup'); pandora.URL.push('/signup');
that.fadeOutScreen(); that.fadeOutScreen();
} }
}), }),
@ -166,7 +166,7 @@ pandora.ui.home = function() {
}) })
.bindEvent({ .bindEvent({
click: function() { click: function() {
pandora.URL.set('/signin'); pandora.URL.push('/signin');
that.fadeOutScreen(); that.fadeOutScreen();
} }
}), }),
@ -185,7 +185,7 @@ pandora.ui.home = function() {
}) })
.bindEvent({ .bindEvent({
click: function() { click: function() {
pandora.URL.set('/preferences'); pandora.URL.push('/preferences');
that.fadeOutScreen(); that.fadeOutScreen();
} }
}), }),
@ -204,7 +204,7 @@ pandora.ui.home = function() {
}) })
.bindEvent({ .bindEvent({
click: function() { click: function() {
pandora.URL.set('/about'); pandora.URL.push('/about');
that.fadeOutScreen(); that.fadeOutScreen();
} }
}) })

11
static/js/pandora/ui/info.js
View file

@ -1,7 +1,10 @@
// vim: et:ts=4:sw=4:sts=4:ft=javascript // vim: et:ts=4:sw=4:sts=4:ft=javascript
pandora.ui.info = function() { pandora.ui.info = function() {
var list = pandora.user.ui.lists[pandora.user.ui.list], var id = pandora.user.ui.item || (
id = pandora.user.ui.item || (list.selected.length ? list.selected[list.selected.length - 1] : null), pandora.user.ui.listSelection.length
? pandora.user.ui.listSelection[pandora.user.ui.listSelection.length - 1]
: null
),
view = getView(), view = getView(),
that = Ox.Element() that = Ox.Element()
.css({overflowX: 'hidden', overflowY: 'auto'}) .css({overflowX: 'hidden', overflowY: 'auto'})
@ -13,7 +16,7 @@ pandora.ui.info = function() {
}); });
Ox.print('INFO', view) Ox.print('INFO', view)
if (view == 'list') { if (view == 'list') {
that.empty().append(pandora.$ui.listInfo = pandora.ui.listInfo(list)); that.empty().append(pandora.$ui.listInfo = pandora.ui.listInfo(pandora.user.ui.list));
} else if (view == 'poster') { } else if (view == 'poster') {
pandora.api.get({id: id, keys: ['director', 'posterRatio', 'title']}, function(result) { pandora.api.get({id: id, keys: ['director', 'posterRatio', 'title']}, function(result) {
var ratio = result.data.posterRatio, var ratio = result.data.posterRatio,
@ -75,7 +78,7 @@ pandora.ui.listInfo = function(data) {
.attr({src: !pandora.user.ui.list ? '/static/png/icon256.png' : Ox.UI.getImageURL('symbolIcon')}) .attr({src: !pandora.user.ui.list ? '/static/png/icon256.png' : Ox.UI.getImageURL('symbolIcon')})
.css(getIconCSS()) .css(getIconCSS())
.appendTo(that); .appendTo(that);
$('<div>').css({padding: '16px 0 16px 0', fontWeight: 'bold'}).html(!pandora.user.ui.list ? 'All Movies' : pandora.user.ui.list.replace('/', ': ')).appendTo(that); $('<div>').css({padding: '16px 0 16px 0', fontWeight: 'bold'}).html(!pandora.user.ui.list ? 'All Movies' : pandora.user.ui.list.replace(':', ': ')).appendTo(that);
$('<div>').css({textAlign: 'left'}).html(Ox.repeat('This is the list info text. ', 10)).appendTo(that); $('<div>').css({textAlign: 'left'}).html(Ox.repeat('This is the list info text. ', 10)).appendTo(that);
function getIconCSS() { function getIconCSS() {
var size = Math.round(pandora.user.ui.sidebarSize / 2); var size = Math.round(pandora.user.ui.sidebarSize / 2);

28
static/js/pandora/ui/infoView.js
View file

@ -1,5 +1,8 @@
pandora.ui.infoView = function(data) { pandora.ui.infoView = function(data) {
// fixme: given that currently, the info view doesn't scroll into view nicely
// when collapsing the movies browser, the info view should become a split panel
var css = { var css = {
marginTop: '4px', marginTop: '4px',
textAlign: 'justify', textAlign: 'justify',
@ -10,7 +13,7 @@ pandora.ui.infoView = function(data) {
margin = 16, margin = 16,
iconSize = pandora.user.ui.infoIconSize, iconSize = pandora.user.ui.infoIconSize,
iconRatio = pandora.user.ui.icons == 'posters' iconRatio = pandora.user.ui.icons == 'posters'
? data.posterRatio : 1, ? (pandora.user.ui.showSitePoster ? 5/8 : data.posterRatio) : 1,
iconWidth = iconRatio > 1 ? iconSize : Math.round(iconSize * iconRatio), iconWidth = iconRatio > 1 ? iconSize : Math.round(iconSize * iconRatio),
iconHeight = iconRatio < 1 ? iconSize : Math.round(iconSize / iconRatio), iconHeight = iconRatio < 1 ? iconSize : Math.round(iconSize / iconRatio),
iconLeft = iconSize == 256 ? Math.floor((iconSize - iconWidth) / 2) : 0, iconLeft = iconSize == 256 ? Math.floor((iconSize - iconWidth) / 2) : 0,
@ -39,7 +42,8 @@ pandora.ui.infoView = function(data) {
$icon = Ox.Element('<img>') $icon = Ox.Element('<img>')
.attr({ .attr({
src: '/' + data.id + '/' + ( src: '/' + data.id + '/' + (
pandora.user.ui.icons == 'posters' ? 'poster' : 'icon' pandora.user.ui.icons == 'posters'
? (pandora.user.ui.showSitePoster ? 'siteposter' : 'poster') : 'icon'
) + '512.jpg?' + uid ) + '512.jpg?' + uid
}) })
.css({ .css({
@ -312,7 +316,7 @@ pandora.ui.infoView = function(data) {
.css(css) .css(css)
.html( .html(
formatKey(key) + data[key].map(function(value) { formatKey(key) + data[key].map(function(value) {
return '<a href="/?url=' + encodeURIComponent(value.url) + '">' + value.source + '</a>' return '<a href="/url=' + encodeURIComponent(value.url) + '">' + value.source + '</a>'
}).join(', ') }).join(', ')
) )
.appendTo($text); .appendTo($text);
@ -353,9 +357,8 @@ pandora.ui.infoView = function(data) {
function formatValue(value, key) { function formatValue(value, key) {
return (Ox.isArray(value) ? value : [value]).map(function(value) { return (Ox.isArray(value) ? value : [value]).map(function(value) {
return key ? return key ?
'<a href="/?find=' + key + ':' + value + '">' + value + '</a>' '<a href="/' + key + '==' + value + '">' + value + '</a>'
: value; : value;
//return key ? '<a href="/?find=' + key + ':' + value + '">' + value + '</a>' : value;
}).join(', '); }).join(', ');
} }
@ -415,7 +418,7 @@ pandora.ui.infoView = function(data) {
if ($browserImages.length == 0) { if ($browserImages.length == 0) {
$browserImages = pandora.$ui.browser.find('img[src*="/' + data.id + '/"]'); $browserImages = pandora.$ui.browser.find('img[src*="/' + data.id + '/"]');
} }
if (pandora.user.ui.icons == 'posters') { if (pandora.user.ui.icons == 'posters' && !pandora.user.ui.showSitePoster) {
$browserImages.each(function() { $browserImages.each(function() {
var $this = $(this), var $this = $(this),
size = Math.max($this.width(), $this.height()); size = Math.max($this.width(), $this.height());
@ -439,7 +442,8 @@ pandora.ui.infoView = function(data) {
}, pandora.user.ui.icons == 'posters' ? { }, pandora.user.ui.icons == 'posters' ? {
source: selectedImage.source source: selectedImage.source
} : { } : {
position: selectedImage.index // fixme: api slightly inconsistent, this shouldn't be "position" // fixme: api slightly inconsistent, this shouldn't be "position"
position: selectedImage.index
}), function() { }), function() {
// fixme: update the info (video preview) frame as well // fixme: update the info (video preview) frame as well
var src; var src;
@ -496,13 +500,14 @@ pandora.ui.infoView = function(data) {
that.reload = function() { that.reload = function() {
var src = src = '/' + data.id + '/' + ( var src = src = '/' + data.id + '/' + (
pandora.user.ui.icons == 'posters' ? 'poster' : 'icon' pandora.user.ui.icons == 'posters'
? (pandora.user.ui.showSitePoster ? 'siteposter' : 'poster') : 'icon'
) + '512.jpg?' + Ox.uid() ) + '512.jpg?' + Ox.uid()
$icon.attr({src: src}); $icon.attr({src: src});
$reflectionIcon.attr({src: src}); $reflectionIcon.attr({src: src});
iconSize = iconSize == 256 ? 512 : 256; iconSize = iconSize == 256 ? 512 : 256;
iconRatio = pandora.user.ui.icons == 'posters' iconRatio = pandora.user.ui.icons == 'posters'
? data.posterRatio : 1; ? (pandora.user.ui.showSitePoster ? 5/8 : data.posterRatio) : 1;
toggleIconSize(); toggleIconSize();
pandora.user.level == 'admin' && $list.replaceWith($list = renderList()); pandora.user.level == 'admin' && $list.replaceWith($list = renderList());
}; };
@ -513,6 +518,11 @@ pandora.ui.infoView = function(data) {
$data.css({height: height + 'px'}); $data.css({height: height + 'px'});
}; };
Ox.Event.bind({
icons: that.reload,
showSitePoster: that.reload
});
return that; return that;
} }

361
static/js/pandora/ui/item.js
View file

@ -10,7 +10,7 @@ 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 - ' + Ox.stripTags(result.data.title);
} }
/*if (result.status.code != 200) { /*if (result.status.code != 200) {
@ -38,58 +38,6 @@ pandora.ui.item = function() {
) )
); );
} else if (pandora.user.ui.itemView == 'calendar') {
pandora.$ui.contentPanel.replaceElement(1, Ox.Element().html('Calendar'));
} else if (pandora.user.ui.itemView == 'clips') {
var ratio = result.data.stream.aspectRatio;
Ox.print('RATIO', ratio)
pandora.$ui.contentPanel.replaceElement(1, pandora.$ui.clips = Ox.IconList({
fixedRatio: ratio,
item: function(data, sort, size) {
size = size || 128;
var width = ratio > 1 ? size : Math.round(size * ratio),
height = ratio > 1 ? Math.round(size / ratio) : size,
url = '/' + pandora.user.ui.item + '/' + height + 'p' + data['in'] + '.jpg';
return {
height: height,
id: data['id'],
info: Ox.formatDuration(data['in'], 'short') + ' - ' + Ox.formatDuration(data['out'], 'short'),
title: data.value,
url: url,
width: width
};
},
items: function(data, callback) {
pandora.api.findAnnotations(Ox.extend(data, {
itemQuery: {
conditions:[{
key: 'id',
value: pandora.user.ui.item,
operator: '='
}]
}
}), callback);
},
keys: ['id', 'value', 'in', 'out'],
size: 128,
sort: pandora.user.ui.lists[pandora.user.ui.list].sort,
unique: 'id'
}).bindEvent({
open: function(data) {
var id = data.ids[0],
item = pandora.user.ui.item,
points = {
'in': pandora.$ui.clips.value(id, 'in'),
out: pandora.$ui.clips.value(id, 'out')
};
pandora.UI.set('videoPoints|' + item, Ox.extend(points, {
position: points['in']
}));
pandora.URL.set(item + '/timeline');
}
}));
} else if (pandora.user.ui.itemView == 'info') { } else if (pandora.user.ui.itemView == 'info') {
//Ox.print('result.data', result.data) //Ox.print('result.data', result.data)
if (pandora.user.level == 'admin' && false) { if (pandora.user.level == 'admin' && false) {
@ -147,100 +95,6 @@ pandora.ui.item = function() {
); );
} }
} else if (pandora.user.ui.itemView == 'map') {
var video = result.data.stream;
pandora.$ui.contentPanel.replaceElement(1, Ox.SplitPanel({
elements: [
{
element: pandora.$ui.map = Ox.Map({
height: window.innerHeight - pandora.user.ui.showGroups * pandora.user.ui.groupsSize - 61,
places: function(data, callback) {
var itemQuery = {conditions: [{
key: 'id',
value: pandora.user.ui.item,
operator: '='
}]},
query = {conditions:[]};
return pandora.api.findPlaces(Ox.extend(data, {
itemQuery: itemQuery,
query: query
}), callback);
},
showTypes: true,
toolbar: true,
width: window.innerWidth - pandora.user.ui.showSidebar * pandora.user.ui.sidebarSize - 2 - 144 - Ox.UI.SCROLLBAR_SIZE
}).bindEvent({
selectplace: function(event, place) {
if(place) {
pandora.$ui.clips.options({
items: function(data, callback) {
return pandora.api.findAnnotations(Ox.extend(data, {
query: {
conditions:[{key: 'place', value: place.id, operator:'='}]
},
itemQuery: {conditions: [{
key: 'id',
value: pandora.user.ui.item,
operator: '='
}]}
}), callback);
}
});
} else {
pandora.$ui.clips.options({
items: []
});
}
}
})
},
{
element: pandora.$ui.clips = Ox.IconList({
fixedRatio: video.aspectRatio,
item: function(data, sort, size) {
size = size || 128;
var ratio = data.aspectRatio,
width = size,
height = Math.round(size / ratio),
url = '/' + data.item + '/' + height + 'p' + data['in'] + '.jpg';
return {
height: height,
id: data['id'],
info: Ox.formatDuration(data['in'], 'short') +' - '+ Ox.formatDuration(data['out'], 'short'),
title: data.value,
url: url,
width: width
};
},
items: [],
keys: ['id', 'value', 'in', 'out', 'aspectRatio', 'item'],
size: 128,
sort: pandora.user.ui.lists[pandora.user.ui.list].sort,
unique: 'id'
}).bindEvent({
open: function(data) {
var id = data.ids[0],
item = pandora.user.ui.item,
points = {
'in': pandora.$ui.clips.value(id, 'in'),
out: pandora.$ui.clips.value(id, 'out')
};
pandora.UI.set('videoPoints|' + item, Ox.extend(points, {
position: points['in']
}));
pandora.URL.set(item + '/timeline');
}
}),
id: 'place',
size: 144 + Ox.UI.SCROLLBAR_SIZE
}
],
orientation: 'horizontal'
})
.bindEvent('resize', function() {
pandora.$ui.map.resizeMap();
}));
} else if (pandora.user.ui.itemView == 'statistics') { } else if (pandora.user.ui.itemView == 'statistics') {
var stats = Ox.Container(); var stats = Ox.Container();
Ox.TreeList({ Ox.TreeList({
@ -250,6 +104,120 @@ pandora.ui.item = function() {
pandora.$ui.contentPanel.replaceElement(1, stats); pandora.$ui.contentPanel.replaceElement(1, stats);
} else if (pandora.user.ui.itemView == 'clips') {
var ratio = result.data.videoRatio;
Ox.print('RATIO', ratio)
pandora.$ui.contentPanel.replaceElement(1, pandora.$ui.clips = Ox.IconList({
fixedRatio: ratio,
item: function(data, sort, size) {
size = size || 128;
var width = ratio > 1 ? size : Math.round(size * ratio),
height = ratio > 1 ? Math.round(size / ratio) : size,
url = '/' + pandora.user.ui.item + '/' + height + 'p' + data['in'] + '.jpg';
return {
height: height,
id: data['id'],
info: Ox.formatDuration(data['in'], 'short') + ' - ' + Ox.formatDuration(data['out'], 'short'),
title: data.value,
url: url,
width: width
};
},
items: function(data, callback) {
Ox.print('DATA', data)
pandora.api.findAnnotations(Ox.extend(data, {
itemQuery: {
conditions:[{
key: 'id',
value: pandora.user.ui.item,
operator: '='
}],
}
}), callback);
},
keys: ['id', 'value', 'in', 'out'],
size: 128,
sort: pandora.user.ui.itemSort,
unique: 'id'
}).bindEvent({
open: function(data) {
var id = data.ids[0],
points = {
'in': pandora.$ui.clips.value(id, 'in'),
out: pandora.$ui.clips.value(id, 'out')
};
pandora.UI.set('videoPoints|' + pandora.user.ui.item, Ox.extend(points, {
position: points['in']
}));
pandora.UI.set({
itemView: pandora.user.ui.videoView
})
},
// fixme: duplicated
openpreview: function(data) {
var $video = $('.OxItem.OxSelected > .OxIcon > .OxVideoPlayer');
if ($video) {
// trigger singleclick
$video.trigger('mousedown');
Ox.UI.$window.trigger('mouseup');
}
that.closePreview();
},
select: function(data) {
if (data.ids.length) {
var id = data.ids[0],
item = id.split('/')[0], width, height,
$img = $('.OxItem.OxSelected > .OxIcon > img'),
$video = $('.OxItem.OxSelected > .OxIcon > .OxVideoPlayer');
if ($img.length) {
var width = ratio > 1 ? 128 : Math.round(128 * ratio),
height = ratio > 1 ? Math.round(128 / ratio) : 128;
pandora.api.get({id: item, keys: ['durations']}, function(result) {
var points = [pandora.$ui.clips.value(id, 'in'), pandora.$ui.clips.value(id, 'out')],
partsAndPoints = pandora.getVideoPartsAndPoints(result.data.durations, points),
$player = Ox.VideoPlayer({
height: height,
'in': partsAndPoints.points[0],
out: partsAndPoints.points[1],
paused: true,
playInToOut: true,
poster: '/' + item + '/' + height + 'p' + points[0] + '.jpg',
width: width,
video: partsAndPoints.parts.map(function(i) {
return '/' + item + '/96p' + (i + 1) + '.' + pandora.user.videoFormat;
})
})
.addClass('OxTarget')
.bindEvent({
// doubleclick opens item
singleclick: function() {
$player.$element.is('.OxSelectedVideo') && $player.togglePaused();
}
});
$img.replaceWith($player.$element);
$('.OxSelectedVideo').removeClass('OxSelectedVideo');
$player.$element.addClass('OxSelectedVideo');
});
} else if ($video.length) {
// item select fires before video click
// so we have to make sure that selecting
// doesn't click through to play
setTimeout(function() {
$('.OxSelectedVideo').removeClass('OxSelectedVideo');
$video.addClass('OxSelectedVideo');
}, 300);
}
} else {
$('.OxSelectedVideo').removeClass('OxSelectedVideo');
}
}
}));
Ox.Event.bind({
itemSort: function(value) {
pandora.$ui.clips.options({sort: value});
}
});
} else if (pandora.user.ui.itemView == 'video') { } else if (pandora.user.ui.itemView == 'video') {
// fixme: duplicated // fixme: duplicated
var layers = [], var layers = [],
@ -416,6 +384,105 @@ pandora.ui.item = function() {
}); });
*/ */
} else if (pandora.user.ui.itemView == 'map') {
var video = result.data.stream;
pandora.$ui.contentPanel.replaceElement(1, Ox.SplitPanel({
elements: [
{
element: pandora.$ui.map = Ox.Map({
height: window.innerHeight - pandora.user.ui.showGroups * pandora.user.ui.groupsSize - 61,
places: function(data, callback) {
var itemQuery = {conditions: [{
key: 'id',
value: pandora.user.ui.item,
operator: '='
}]},
query = {conditions:[]};
return pandora.api.findPlaces(Ox.extend(data, {
itemQuery: itemQuery,
query: query
}), callback);
},
showTypes: true,
toolbar: true,
width: window.innerWidth - pandora.user.ui.showSidebar * pandora.user.ui.sidebarSize - 2 - 144 - Ox.UI.SCROLLBAR_SIZE
}).bindEvent({
selectplace: function(event, place) {
if(place) {
pandora.$ui.clips.options({
items: function(data, callback) {
return pandora.api.findAnnotations(Ox.extend(data, {
query: {
conditions:[{key: 'place', value: place.id, operator:'='}]
},
itemQuery: {conditions: [{
key: 'id',
value: pandora.user.ui.item,
operator: '='
}]}
}), callback);
}
});
} else {
pandora.$ui.clips.options({
items: []
});
}
}
})
},
{
element: pandora.$ui.clips = Ox.IconList({
fixedRatio: video.aspectRatio,
item: function(data, sort, size) {
size = size || 128;
var ratio = data.aspectRatio,
width = size,
height = Math.round(size / ratio),
url = '/' + data.item + '/' + height + 'p' + data['in'] + '.jpg';
return {
height: height,
id: data['id'],
info: Ox.formatDuration(data['in'], 'short') +' - '+ Ox.formatDuration(data['out'], 'short'),
title: data.value,
url: url,
width: width
};
},
items: [],
keys: ['id', 'value', 'in', 'out', 'aspectRatio', 'item'],
size: 128,
sort: pandora.user.ui.lists[pandora.user.ui.list].sort,
unique: 'id'
}).bindEvent({
open: function(data) {
var id = data.ids[0],
item = pandora.user.ui.item,
points = {
'in': pandora.$ui.clips.value(id, 'in'),
out: pandora.$ui.clips.value(id, 'out')
};
pandora.UI.set('videoPoints|' + item, Ox.extend(points, {
position: points['in']
}));
pandora.URL.set(item + '/timeline');
}
}),
id: 'place',
size: 144 + Ox.UI.SCROLLBAR_SIZE
}
],
orientation: 'horizontal'
})
.bindEvent('resize', function() {
pandora.$ui.map.resizeMap();
}));
} else if (pandora.user.ui.itemView == 'calendar') {
pandora.$ui.contentPanel.replaceElement(1, Ox.Element().html('Calendar'));
} else if (pandora.user.ui.itemView == 'files') { } else if (pandora.user.ui.itemView == 'files') {
pandora.$ui.contentPanel.replaceElement(1, pandora.$ui.contentPanel.replaceElement(1,
pandora.$ui.item = Ox.FilesView({ pandora.$ui.item = Ox.FilesView({

97
static/js/pandora/ui/list.js
View file

@ -1,10 +1,10 @@
// vim: et:ts=4:sw=4:sts=4:ft=javascript // vim: et:ts=4:sw=4:sts=4:ft=javascript
pandora.ui.list = function() { // fixme: remove view argument pandora.ui.list = function() {
var that, $map, var that, $map,
view = pandora.user.ui.lists[pandora.user.ui.list].listView, view = pandora.user.ui.listView,
preview = false preview = false
//Ox.print('constructList', view);
if (view == 'list') { if (view == 'list') {
/* /*
keys = Ox.unique(Ox.merge( keys = Ox.unique(Ox.merge(
@ -75,7 +75,7 @@ pandora.ui.list = function() { // fixme: remove view argument
visible: true, visible: true,
width: 16 width: 16
}], */Ox.map(pandora.site.sortKeys, function(key) { }], */Ox.map(pandora.site.sortKeys, function(key) {
var position = pandora.user.ui.lists[pandora.user.ui.list].columns.indexOf(key.id); var position = pandora.user.ui.listColumns.indexOf(key.id);
return { return {
align: ['string', 'text'].indexOf( align: ['string', 'text'].indexOf(
Ox.isArray(key.type) ? key.type[0]: key.type Ox.isArray(key.type) ? key.type[0]: key.type
@ -90,7 +90,7 @@ pandora.ui.list = function() { // fixme: remove view argument
type: key.type, type: key.type,
unique: key.id == 'id', unique: key.id == 'id',
visible: position > -1, visible: position > -1,
width: pandora.user.ui.lists[pandora.user.ui.list].columnWidth[key.id] || key.columnWidth width: pandora.user.ui.listColumnWidth[key.id] || key.columnWidth
}; };
})/*)*/, })/*)*/,
columnsMovable: true, columnsMovable: true,
@ -102,12 +102,12 @@ pandora.ui.list = function() { // fixme: remove view argument
items: function(data, callback) { items: function(data, callback) {
//Ox.print('data, pandora.Query.toObject', data, pandora.Query.toObject()) //Ox.print('data, pandora.Query.toObject', data, pandora.Query.toObject())
pandora.api.find(Ox.extend(data, { pandora.api.find(Ox.extend(data, {
query: pandora.user.ui.query query: pandora.user.ui.find
}), callback); }), callback);
}, },
scrollbarVisible: true, scrollbarVisible: true,
selected: pandora.user.ui.lists[pandora.user.ui.list].selected, selected: pandora.user.ui.listSelection,
sort: pandora.user.ui.lists[pandora.user.ui.list].sort sort: pandora.user.ui.listSort
}) })
.bindEvent({ .bindEvent({
columnchange: function(data) { columnchange: function(data) {
@ -133,8 +133,10 @@ pandora.ui.list = function() { // fixme: remove view argument
pandora.$ui.mainMenu.checkItem('sortMenu_sortmovies_' + data.key); pandora.$ui.mainMenu.checkItem('sortMenu_sortmovies_' + data.key);
pandora.$ui.mainMenu.checkItem('sortMenu_ordermovies_' + (data.operator == '+' ? 'ascending' : 'descending')); pandora.$ui.mainMenu.checkItem('sortMenu_ordermovies_' + (data.operator == '+' ? 'ascending' : 'descending'));
pandora.$ui.sortSelect.selectItem(data.key); pandora.$ui.sortSelect.selectItem(data.key);
pandora.UI.set(['lists', pandora.user.ui.list, 'sort'].join('|'), [{key: data.key, operator: data.operator}]); pandora.UI.set({
pandora.URL.push(pandora.Query.toString()); listSort: [{key: data.key, operator: data.operator}]
});
pandora.URL.push();
} }
}); });
} else if (view == 'grid') { } else if (view == 'grid') {
@ -145,30 +147,32 @@ pandora.ui.list = function() { // fixme: remove view argument
draggable: true, draggable: true,
id: 'list', id: 'list',
item: function(data, sort, size) { item: function(data, sort, size) {
var icons = pandora.user.ui.icons, var ui = pandora.user.ui,
ratio = icons == 'posters' ? data.posterRatio : 1; ratio = ui.icons == 'posters'
? (ui.showSitePoster ? 5/8 : data.posterRatio) : 1,
size = size || 128; size = size || 128;
return { return {
height: Math.round(ratio <= 1 ? size : size / ratio), height: Math.round(ratio <= 1 ? size : size / ratio),
id: data.id, id: data.id,
info: data[['title', 'director'].indexOf(sort[0].key) > -1 ? 'year' : sort[0].key], info: data[['title', 'director'].indexOf(sort[0].key) > -1 ? 'year' : sort[0].key],
title: data.title + (data.director.length ? ' (' + data.director.join(', ') + ')' : ''), title: data.title + (data.director.length ? ' (' + data.director.join(', ') + ')' : ''),
url: icons == 'posters' url: '/' + data.id + '/' + (
? '/' + data.id + '/poster' + size + '.jpg' ui.icons == 'posters'
: '/' + data.id + '/icon' + size + '.jpg', ? (ui.showSitePoster ? 'siteposter' : 'poster') : 'icon'
) + size + '.jpg',
width: Math.round(ratio >= 1 ? size : size * ratio) width: Math.round(ratio >= 1 ? size : size * ratio)
}; };
}, },
items: function(data, callback) { items: function(data, callback) {
//Ox.print('data, pandora.Query.toObject', data, pandora.Query.toObject()) //Ox.print('data, pandora.Query.toObject', data, pandora.Query.toObject())
pandora.api.find(Ox.extend(data, { pandora.api.find(Ox.extend(data, {
query: pandora.user.ui.query query: pandora.user.ui.find
}), callback); }), callback);
}, },
keys: ['director', 'id', 'posterRatio', 'title', 'year'], keys: ['director', 'id', 'posterRatio', 'title', 'year'],
selected: pandora.user.ui.lists[pandora.user.ui.list].selected, selected: pandora.user.ui.listSelection,
size: 128, size: 128,
sort: pandora.user.ui.lists[pandora.user.ui.list].sort, sort: pandora.user.ui.listSort,
unique: 'id' unique: 'id'
}); });
} else if (view == 'info') { } else if (view == 'info') {
@ -210,13 +214,13 @@ pandora.ui.list = function() { // fixme: remove view argument
}, },
items: function(data, callback) { items: function(data, callback) {
pandora.api.find(Ox.extend(data, { pandora.api.find(Ox.extend(data, {
query: pandora.user.ui.query query: pandora.user.ui.find
}), callback); }), callback);
}, },
keys: ['director', 'duration', 'id', 'posterRatio', 'title', 'year'], keys: ['director', 'duration', 'id', 'posterRatio', 'title', 'year'],
selected: pandora.user.ui.lists[pandora.user.ui.list].selected, selected: pandora.user.ui.listSelection,
size: 192, size: 192,
sort: pandora.user.ui.lists[pandora.user.ui.list].sort, sort: pandora.user.ui.listSort,
unique: 'id' unique: 'id'
}); });
} else if (view == 'maps') { } else if (view == 'maps') {
@ -243,7 +247,7 @@ pandora.ui.list = function() { // fixme: remove view argument
}; };
}, },
items: function(data, callback) { items: function(data, callback) {
var itemQuery = pandora.user.ui.query, var itemQuery = pandora.user.ui.find,
query = {conditions:[]}; query = {conditions:[]};
//fixme: can this be in pandora.Query? dont just check for subtitles //fixme: can this be in pandora.Query? dont just check for subtitles
itemQuery.conditions.forEach(function(q) { itemQuery.conditions.forEach(function(q) {
@ -259,7 +263,7 @@ pandora.ui.list = function() { // fixme: remove view argument
keys: ['id', 'value', 'in', 'out', 'videoRatio'], keys: ['id', 'value', 'in', 'out', 'videoRatio'],
max: 1, max: 1,
size: 128, size: 128,
sort: pandora.user.ui.lists[pandora.user.ui.list].sort, sort: pandora.user.ui.listSort,
unique: 'id' unique: 'id'
}).bindEvent({ }).bindEvent({
init: function(data) { init: function(data) {
@ -275,7 +279,11 @@ pandora.ui.list = function() { // fixme: remove view argument
pandora.UI.set('videoPoints|' + item, Ox.extend(points, { pandora.UI.set('videoPoints|' + item, Ox.extend(points, {
position: points['in'] position: points['in']
})); }));
pandora.URL.set(item + '/timeline'); pandora.UI.set({
item: item,
itemView: pandora.user.ui.videoView
});
pandora.URL.push();
}, },
openpreview: function(data) { openpreview: function(data) {
var $video = $('.OxItem.OxSelected > .OxIcon > .OxVideoPlayer'); var $video = $('.OxItem.OxSelected > .OxIcon > .OxVideoPlayer');
@ -292,7 +300,7 @@ pandora.ui.list = function() { // fixme: remove view argument
item = id.split('/')[0], width, height, item = id.split('/')[0], width, height,
$img = $('.OxItem.OxSelected > .OxIcon > img'), $img = $('.OxItem.OxSelected > .OxIcon > img'),
$video = $('.OxItem.OxSelected > .OxIcon > .OxVideoPlayer'); $video = $('.OxItem.OxSelected > .OxIcon > .OxVideoPlayer');
pandora.UI.set('lists|' + pandora.user.ui.list + '|selected', [item]); pandora.UI.set('listSelection', [item]);
pandora.$ui.leftPanel.replaceElement(2, pandora.$ui.info = pandora.ui.info()); pandora.$ui.leftPanel.replaceElement(2, pandora.$ui.info = pandora.ui.info());
if ($img.length) { if ($img.length) {
var width = parseInt($img.css('width')), var width = parseInt($img.css('width')),
@ -333,7 +341,7 @@ pandora.ui.list = function() { // fixme: remove view argument
}, 300); }, 300);
} }
} else { } else {
pandora.UI.set('lists|' + pandora.user.ui.list + '|selected', []); pandora.UI.set('listSelection', []);
pandora.$ui.leftPanel.replaceElement(2, pandora.$ui.info = pandora.ui.info()); pandora.$ui.leftPanel.replaceElement(2, pandora.$ui.info = pandora.ui.info());
$('.OxSelectedVideo').removeClass('OxSelectedVideo'); $('.OxSelectedVideo').removeClass('OxSelectedVideo');
} }
@ -350,7 +358,7 @@ pandora.ui.list = function() { // fixme: remove view argument
video: function(range, callback) { video: function(range, callback) {
var callback = arguments[arguments.length - 1], var callback = arguments[arguments.length - 1],
range = arguments.length == 2 ? arguments[0] : null, range = arguments.length == 2 ? arguments[0] : null,
itemQuery = pandora.user.ui.query, itemQuery = pandora.user.ui.find,
query = {conditions:[]}; query = {conditions:[]};
//fixme: can this be in pandora.Query? dont just check for subtitles //fixme: can this be in pandora.Query? dont just check for subtitles
itemQuery.conditions.forEach(function(q) { itemQuery.conditions.forEach(function(q) {
@ -364,7 +372,7 @@ pandora.ui.list = function() { // fixme: remove view argument
}, range ? { }, range ? {
keys: ['id', 'in', 'out'], keys: ['id', 'in', 'out'],
range: range, range: range,
sort: pandora.user.ui.lists[pandora.user.ui.list].sort sort: pandora.user.ui.listSort
} : {}), function(result) { } : {}), function(result) {
//Ox.print('API findAnnotations range', range, 'result', result.data); //Ox.print('API findAnnotations range', range, 'result', result.data);
if (!range) { if (!range) {
@ -403,7 +411,7 @@ pandora.ui.list = function() { // fixme: remove view argument
element: pandora.$ui.map = Ox.Map({ element: pandora.$ui.map = Ox.Map({
height: window.innerHeight - pandora.user.ui.showGroups * pandora.user.ui.groupsSize - 61, height: window.innerHeight - pandora.user.ui.showGroups * pandora.user.ui.groupsSize - 61,
places: function(data, callback) { places: function(data, callback) {
var itemQuery = pandora.user.ui.query, var itemQuery = pandora.user.ui.find,
query = {conditions:[]}; query = {conditions:[]};
return pandora.api.findPlaces(Ox.extend(data, { return pandora.api.findPlaces(Ox.extend(data, {
itemQuery: itemQuery, itemQuery: itemQuery,
@ -422,7 +430,7 @@ pandora.ui.list = function() { // fixme: remove view argument
query: { query: {
conditions:[{key: 'place', value: place.id, operator:'='}] conditions:[{key: 'place', value: place.id, operator:'='}]
}, },
itemQuery: pandora.user.ui.query itemQuery: pandora.user.ui.find
}), callback); }), callback);
} }
}); });
@ -456,7 +464,7 @@ pandora.ui.list = function() { // fixme: remove view argument
items: [], items: [],
keys: ['id', 'value', 'in', 'out', 'videoRatio', 'item'], keys: ['id', 'value', 'in', 'out', 'videoRatio', 'item'],
size: 128, size: 128,
sort: pandora.user.ui.lists[pandora.user.ui.list].sort, sort: pandora.user.ui.listSort,
unique: 'id' unique: 'id'
}).bindEvent({ }).bindEvent({
open: function(data) { open: function(data) {
@ -500,7 +508,7 @@ pandora.ui.list = function() { // fixme: remove view argument
}); });
pandora.api.findEvents({ pandora.api.findEvents({
query: '', query: '',
itemQuery: pandora.user.ui.query itemQuery: pandora.user.ui.find
}, function(result) { }, function(result) {
Ox.print(">>>>>>>", result); Ox.print(">>>>>>>", result);
that.replaceElement(0, that.replaceElement(0,
@ -556,9 +564,7 @@ pandora.ui.list = function() { // fixme: remove view argument
pandora.$ui.selected.html(pandora.ui.status('selected', data)); pandora.$ui.selected.html(pandora.ui.status('selected', data));
}, },
open: function(data) { open: function(data) {
var id = data.ids[0], pandora.UI.set({item: data.ids[0]});
title = that.value(id, 'title');
pandora.URL.set(title, id);
}, },
openpreview: function(data) { openpreview: function(data) {
pandora.requests.preview && pandora.api.cancel(pandora.requests.preview); pandora.requests.preview && pandora.api.cancel(pandora.requests.preview);
@ -642,7 +648,7 @@ pandora.ui.list = function() { // fixme: remove view argument
}, },
select: function(data) { select: function(data) {
var $still, $timeline; var $still, $timeline;
pandora.UI.set('lists|' + pandora.user.ui.list + '|selected', data.ids); pandora.UI.set('listSelection', data.ids);
if (data.ids.length) { if (data.ids.length) {
pandora.$ui.mainMenu.enableItem('copy'); pandora.$ui.mainMenu.enableItem('copy');
pandora.$ui.mainMenu.enableItem('openmovie'); pandora.$ui.mainMenu.enableItem('openmovie');
@ -674,6 +680,25 @@ pandora.ui.list = function() { // fixme: remove view argument
pandora.$ui.rightPanel.replaceElement(1, pandora.$ui.contentPanel = pandora.ui.contentPanel()); pandora.$ui.rightPanel.replaceElement(1, pandora.$ui.contentPanel = pandora.ui.contentPanel());
}; };
Ox.Event.bind({
listSort: function(value) {
that.options({sort: value});
}
});
if (pandora.user.ui.listView == 'grid') {
Ox.Event.bind({
icons: function(value) {
that.options({
borderRadius: value == 'posters' ? 0 : 16,
defaultRatio: value == 'posters' ? 5/8 : 1
}).reloadList(true);
},
showSitePoster: function() {
that.reloadList(true);
}
});
}
return that; return that;
}; };

9
static/js/pandora/ui/mainPanel.js
View file

@ -16,7 +16,14 @@ pandora.ui.mainPanel = function() {
} }
], ],
orientation: 'horizontal' orientation: 'horizontal'
}) });
Ox.Event.bind({
item: function(value) {
if (!value || !pandora.UI.getPrevious('item')) {
that.replaceElement(1, pandora.$ui.rightPanel = pandora.ui.rightPanel());
}
}
});
return that; return that;
}; };

87
static/js/pandora/ui/menu.js
View file

@ -1,7 +1,7 @@
// vim: et:ts=4:sw=4:sts=4:ft=javascript // vim: et:ts=4:sw=4:sts=4:ft=javascript
pandora.ui.mainMenu = function() { pandora.ui.mainMenu = function() {
var isGuest = pandora.user.level == 'guest', var isGuest = pandora.user.level == 'guest',
list = pandora.user.ui.lists[pandora.user.ui.list], ui = pandora.user.ui,
that = Ox.MainMenu({ that = Ox.MainMenu({
extras: [ extras: [
$('<div>').html('beta').css({marginRight: '8px', color: 'rgb(128, 128, 128)'}), $('<div>').html('beta').css({marginRight: '8px', color: 'rgb(128, 128, 128)'}),
@ -30,7 +30,8 @@ pandora.ui.mainMenu = function() {
{ id: 'archives', title: 'Archives...', disabled: isGuest }, { id: 'archives', title: 'Archives...', disabled: isGuest },
{}, {},
{ id: 'signup', title: 'Sign Up...', disabled: !isGuest }, { id: 'signup', title: 'Sign Up...', disabled: !isGuest },
{ id: 'signinsignout', title: isGuest ? 'Sign In...' : 'Sign Out...' } isGuest ? { id: 'signin', title: 'Sign In...' }
: { id: 'signout', title: 'Sign Out...'}
] }, ] },
pandora.getListMenu(), pandora.getListMenu(),
{ id: 'editMenu', title: 'Edit', items: [ { id: 'editMenu', title: 'Edit', items: [
@ -50,16 +51,16 @@ pandora.ui.mainMenu = function() {
{ id: 'movies', title: 'View ' + pandora.site.itemName.plural, items: [ { id: 'movies', title: 'View ' + pandora.site.itemName.plural, items: [
{ group: 'viewmovies', min: 1, max: 1, items: pandora.site.listViews.map(function(view) { { group: 'viewmovies', min: 1, max: 1, items: pandora.site.listViews.map(function(view) {
return Ox.extend({ return Ox.extend({
checked: list.listView == view.id, checked: ui.listView == view.id,
}, view); }, view);
}) }, }) },
]}, ]},
{ id: 'icons', title: 'Icons', items: [ { id: 'icons', title: 'Icons', items: [
{ group: 'viewicons', min: 1, max: 1, items: ['posters', 'frames'].map(function(icons) { { group: 'viewicons', min: 1, max: 1, items: ['posters', 'frames'].map(function(icons) {
return {id: icons, title: Ox.toTitleCase(icons), checked: pandora.user.ui.icons == icons}; return {id: icons, title: Ox.toTitleCase(icons), checked: ui.icons == icons};
}) }, }) },
{}, {},
{ id: 'usesiteposter', title: 'Always Use ' + pandora.site.site.name + ' Poster' } { id: 'showsiteposter', title: 'Always Show ' + pandora.site.site.name + ' Poster', checked: ui.showSitePoster }
] }, ] },
{ id: 'columns', title: 'Columns', items: [ { id: 'columns', title: 'Columns', items: [
{ id: 'loadcolumns', title: 'Load Layout...' }, { id: 'loadcolumns', title: 'Load Layout...' },
@ -71,20 +72,20 @@ pandora.ui.mainMenu = function() {
{ id: 'openmovie', title: ['Open ' + pandora.site.itemName.singular, 'Open ' + pandora.site.itemName.plural], items: [ { id: 'openmovie', title: ['Open ' + pandora.site.itemName.singular, 'Open ' + pandora.site.itemName.plural], items: [
{ group: 'movieview', min: 1, max: 1, items: pandora.site.itemViews.map(function(view) { { group: 'movieview', min: 1, max: 1, items: pandora.site.itemViews.map(function(view) {
return Ox.extend({ return Ox.extend({
checked: pandora.user.ui.itemView == view.id, checked: ui.itemView == view.id,
}, view); }, view);
}) }, }) },
]}, ]},
{ id: 'openvideo', title: 'Open Video Links', items: [ { id: 'openvideo', title: 'Open Video Links', items: [
{ group: 'videoview', min: 1, max: 1, items: ['player', 'editor'].map(function(view) { { group: 'videoview', min: 1, max: 1, items: ['player', 'editor'].map(function(view) {
return {id: view, title: Ox.toTitleCase(view), checked: pandora.user.ui.videoView == view}; return {id: view, title: Ox.toTitleCase(view), checked: ui.videoView == view};
}) } }) }
] }, ] },
{}, {},
{ id: 'groups', title: 'Groups', items: [ { id: 'groups', title: 'Groups', items: [
{ group: 'groups', min: 5, max: 5, items: pandora.site.groups.map(function(group) { { group: 'groups', min: 5, max: 5, items: pandora.site.groups.map(function(group) {
return Ox.extend({ return Ox.extend({
checked: Ox.getPositionById(pandora.user.ui.groups, group.id) > -1 checked: Ox.getPositionById(ui.groups, group.id) > -1
}, group); }, group);
}) }, }) },
{}, {},
@ -98,8 +99,8 @@ pandora.ui.mainMenu = function() {
{}, {},
{ id: 'theme', title: 'Theme', items: [ { id: 'theme', title: 'Theme', items: [
{ group: 'settheme', min: 1, max: 1, items: [ { group: 'settheme', min: 1, max: 1, items: [
{ id: 'classic', title: 'Classic', checked: pandora.user.ui.theme == 'classic'}, { id: 'classic', title: 'Classic', checked: ui.theme == 'classic'},
{ id: 'modern', title: 'Modern', checked: pandora.user.ui.theme == 'modern' } { id: 'modern', title: 'Modern', checked: ui.theme == 'modern' }
]} ]}
] } ] }
]}, ]},
@ -107,10 +108,10 @@ pandora.ui.mainMenu = function() {
{ id: 'findMenu', title: 'Find', items: [ { id: 'findMenu', title: 'Find', items: [
{ id: 'find', title: 'Find', items: [ { id: 'find', title: 'Find', items: [
{ group: 'find', min: 1, max: 1, items: pandora.site.findKeys.map(function(key, i) { { group: 'find', min: 1, max: 1, items: pandora.site.findKeys.map(function(key, i) {
var index = pandora.user.ui.find.index; var index = ui._findState.index;
return Ox.extend({ return Ox.extend({
checked: index > -1 && pandora.user.ui.query.conditions[index].key checked: index > -1 && ui.find.conditions[index].key
? pandora.user.ui.query.conditions[index].key == key.id ? ui.find.conditions[index].key == key.id
: key.id == 'all' : key.id == 'all'
}, key); }, key);
}) } }) }
@ -169,19 +170,16 @@ pandora.ui.mainMenu = function() {
groups[position].sort[0].operator = operator; groups[position].sort[0].operator = operator;
pandora.UI.set({groups: groups}); pandora.UI.set({groups: groups});
} else if (data.id == 'ordermovies') { } else if (data.id == 'ordermovies') {
var key = pandora.user.ui.lists[pandora.user.ui.list].sort[0].key, var key = pandora.user.ui.listSort[0].key,
operator = value == 'ascending' ? '+' : '-'; operator = value == 'ascending' ? '+' : '-';
pandora.$ui.list.options({ pandora.UI.set({listSort: [{key: key, operator: operator}]});
sort: [{key: key, operator: operator}]
});
pandora.UI.set('lists|' + pandora.user.ui.list + '|sort', [{key: key, operator: operator}]);
//pandora.user.ui.lists[pandora.user.ui.list].sort[0] = {key: key, operator: operator};
pandora.URL.push(pandora.Query.toString());
} else if (data.id == 'settheme') { } else if (data.id == 'settheme') {
Ox.Theme(value); Ox.Theme(value);
pandora.UI.set('theme', value); pandora.UI.set('theme', value);
} else if (data.id == 'showsiteposter') {
pandora.UI.set('showSitePoster', data.checked)
} else if (Ox.startsWith(data.id, 'sortgroup')) { } else if (Ox.startsWith(data.id, 'sortgroup')) {
var groups = Ox.clone(pandora.user.ui.groups), var groups = Ox.clone(ui.groups),
id = data.id.replace('sortgroup', ''), id = data.id.replace('sortgroup', ''),
position = Ox.getPositionById(groups, id), position = Ox.getPositionById(groups, id),
type = Ox.getObjectById(pandora.site.groups, id).type, type = Ox.getObjectById(pandora.site.groups, id).type,
@ -194,52 +192,21 @@ pandora.ui.mainMenu = function() {
groups[position].sort[0].key = key; groups[position].sort[0].key = key;
pandora.UI.set({groups: groups}); pandora.UI.set({groups: groups});
} else if (data.id == 'sortmovies') { } else if (data.id == 'sortmovies') {
pandora.UI.set( pandora.UI.set({listSort: [{key: value, operator: ''}]});
'lists|' + pandora.user.ui.list + '|sort',
[{key: value, operator: ''}]
);
pandora.URL.update();
} else if (data.id == 'viewicons') { } else if (data.id == 'viewicons') {
var $list;
pandora.UI.set({icons: value}); pandora.UI.set({icons: value});
if (pandora.user.ui.item) {
if (pandora.user.ui.itemView == 'info') {
pandora.$ui.item.reload();
}
$list = pandora.$ui.browser;
} else if (pandora.user.ui.lists[pandora.user.ui.list].listView == 'grid') {
$list = pandora.$ui.list;
}
$list && $list.options({
borderRadius: value == 'posters' ? 0 : pandora.user.ui.item ? 8 : 16,
defaultRatio: value == 'posters' ? 5/8 : 1
}).reloadList(true);
} else if (data.id == 'viewmovies') { } else if (data.id == 'viewmovies') {
pandora.UI.set('lists|' + pandora.user.ui.list + '|listView', value); pandora.UI.set('listView', value);
pandora.URL.update();
} else if (['personallists', 'favoritelists', 'featuredlists'].indexOf(value) > -1) { } else if (['personallists', 'favoritelists', 'featuredlists'].indexOf(value) > -1) {
pandora.URL.set( pandora.UI.set({list: value.substr(8)});
data.checked[0] ? '?find=list:' + value.substr(8) : ''
);
} }
}, },
click: function(data) { click: function(data) {
if (data.id == 'home') { if ([
pandora.$ui.home = pandora.ui.home().fadeInScreen(); 'home', 'about', 'news', 'tour', 'faq', 'tos', 'contact', 'software',
pandora.URL.push('home'); 'signup', 'signin', 'signout', 'preferences', 'help'
} else if (['about', 'news', 'tour', 'faq', 'tos', 'contact', 'software'].indexOf(data.id) > -1) { ].indexOf(data.id) > -1) {
pandora.$ui.siteDialog = pandora.ui.siteDialog(data.id).open(); pandora.URL.push('/' + data.id);
pandora.URL.push(data.id);
} else if (data.id == 'preferences') {
pandora.$ui.preferencesDialog = pandora.ui.preferencesDialog().open();
} else if (data.id == 'signup') {
pandora.$ui.accountDialog = pandora.ui.accountDialog('signup').open();
} else if (data.id == 'signinsignout') {
pandora.$ui.accountDialog = (
pandora.user.level == 'guest'
? pandora.ui.accountDialog('signin')
: pandora.ui.accountSignoutDialog()
).open();
} else if (data.id == 'stills') { } else if (data.id == 'stills') {
var id = pandora.user.ui.item || pandora.user.ui.listItem; var id = pandora.user.ui.item || pandora.user.ui.listItem;
pandora.$ui.postersDialog = pandora.ui.framesDialog(id).open(); pandora.$ui.postersDialog = pandora.ui.framesDialog(id).open();

34
static/js/pandora/ui/orderButton.js Normal file
View file

@ -0,0 +1,34 @@
// vim: et:ts=4:sw=4:sts=4:ft=javascript
pandora.ui.orderButton = function() {
var that = Ox.Button({
id: 'orderButton',
title: getTitle(),
// tooltip: 'Change sort order',
type: 'image'
})
.css({
float: 'left',
margin: '4px 0 0 4px'
})
.bindEvent({
click: function(data) {
pandora.UI.set({
listSort: [{
key: pandora.user.ui.listSort[0].key,
operator: pandora.user.ui.listSort[0].operator == '+' ? '-' : '+'
}]
})
that.options({title: getTitle()});
}
});
function getTitle() {
return pandora.user.ui.listSort[0].operator == '+' ? 'up' : 'down';
}
Ox.Event.bind({
listSort: function() {
that.options({title: getTitle()});
}
});
return that;
}

24
static/js/pandora/ui/rightPanel.js
View file

@ -40,24 +40,30 @@ pandora.ui.rightPanel = function() {
pandora.resizeGroups(); pandora.resizeGroups();
pandora.$ui.list.size(); pandora.$ui.list.size();
if (pandora.user.ui.lists[pandora.user.ui.list].listView == 'timelines') { if (pandora.user.ui.lists[pandora.user.ui.list].listView == 'timelines') {
pandora.$ui.list.options({ pandora.$ui.list.options({width: data.size});
width: data.size
});
} else if (pandora.user.ui.lists[pandora.user.ui.list].listView == 'map') { } else if (pandora.user.ui.lists[pandora.user.ui.list].listView == 'map') {
pandora.$ui.map.resizeMap(); pandora.$ui.map.resizeMap();
} else if (pandora.user.ui.lists[pandora.user.ui.list].listView == 'calendar') {
} }
} else { } else {
pandora.$ui.browser.scrollToSelection(); pandora.$ui.browser.scrollToSelection();
pandora.user.ui.itemView == 'player' && pandora.$ui.player.options({ if (pandora.user.ui.itemView == 'video') {
width: data.size pandora.$ui.player.options({width: data.size});
}); } else if (pandora.user.ui.itemView == 'timeline') {
pandora.user.ui.itemView == 'timeline' && pandora.$ui.editor.options({ pandora.$ui.editor.options({width: data.size});
width: data.size }
});
} }
} }
}); });
} }
Ox.Event.bind({
itemView: function(value) {
if (pandora.isClipView() != pandora.isClipView(pandora.UI.getPrevious('itemView'))) {
that.replaceElement(0, pandora.$ui.toolbar = pandora.ui.toolbar());
}
}
})
return that; return that;
}; };

2
static/js/pandora/ui/siteDialog.js
View file

@ -52,7 +52,7 @@ pandora.ui.siteDialog = function(section) {
}).bindEvent({ }).bindEvent({
click: function() { click: function() {
$dialog.close(); $dialog.close();
pandora.URL.pushPrevious(); pandora.URL.push();
} }
}) })
], ],

46
static/js/pandora/ui/sortSelect.js
View file

@ -1,20 +1,24 @@
// vim: et:ts=4:sw=4:sts=4:ft=javascript // vim: et:ts=4:sw=4:sts=4:ft=javascript
pandora.ui.sortSelect = function() { pandora.ui.sortSelect = function() {
var list = pandora.user.ui.lists[pandora.user.ui.list], var items = [],
items = pandora.site.sortKeys.map(function(key) { sortKey = !pandora.user.ui.item ? 'listSort' : 'itemSort',
return Ox.extend(Ox.clone(key), {
checked: list.sort[0].key == key.id,
title: 'Sort by ' + key.title
});
}),
that; that;
if (pandora.isClipView(list.listView)) { if (pandora.isClipView()) {
items = Ox.merge(pandora.site.clipKeys.map(function(key) { items = pandora.site.clipKeys.map(function(key) {
return Ox.extend(Ox.clone(key), { return Ox.extend(Ox.clone(key), {
checked: list.sort[0].key == key.id, checked: key.id == pandora.user.ui[sortKey][0].key,
title: 'Sort by ' + (!pandora.user.ui.item ? 'Clip ' : '') + key.title
});
});
!pandora.user.ui.item && items.push({});
}
if (!pandora.user.ui.item) {
items = Ox.merge(items, pandora.site.sortKeys.map(function(key) {
return Ox.extend(Ox.clone(key), {
checked: key.id == pandora.user.ui[sortKey][0].key,
title: 'Sort by ' + key.title title: 'Sort by ' + key.title
}); });
}), {}, items); }));
} }
that = Ox.Select({ that = Ox.Select({
id: 'sortSelect', id: 'sortSelect',
@ -27,14 +31,18 @@ pandora.ui.sortSelect = function() {
}) })
.bindEvent({ .bindEvent({
change: function(data) { change: function(data) {
//var query = Ox.unserialize(document.location.search); pandora.UI.set(sortKey, [{key: data.selected[0].id, operator: ''}]);
//query.sort = data.selected.id; }
//pandora.URL.set('/' + pandora.user.ui.lists[pandora.user.ui.list].listView + '/?' + Ox.serialize(query)); });
pandora.UI.set( Ox.Event.bind({
'lists|' + pandora.user.ui.list + '|sort', listSort: function(value) {
[{key: data.selected[0].id, operator: ''}] that.selectItem(value[0].key);
); },
pandora.URL.update(); item: function(valye) {
},
itemSort: function(value) {
that.selectItem(value[0].key);
} }
}); });
return that; return that;

12
static/js/pandora/ui/toolbar.js
View file

@ -12,15 +12,19 @@ pandora.ui.toolbar = function() {
that.append( that.append(
pandora.$ui.viewSelect = pandora.ui.viewSelect() pandora.$ui.viewSelect = pandora.ui.viewSelect()
); );
!pandora.user.ui.item && that.append( if (!pandora.user.ui.item || pandora.isClipView()) {
that.append(
pandora.$ui.sortSelect = pandora.ui.sortSelect() pandora.$ui.sortSelect = pandora.ui.sortSelect()
); );
}
if (!pandora.user.ui.item) {
that.append(
pandora.$ui.orderButton = pandora.ui.orderButton()
);
}
that.append( that.append(
pandora.$ui.findElement = pandora.ui.findElement() pandora.$ui.findElement = pandora.ui.findElement()
); );
that.display = function() {
pandora.$ui.rightPanel.replaceElement(0, pandora.$ui.toolbar = pandora.ui.toolbar()); // fixme: remove later
}
return that; return that;
}; };

8
static/js/pandora/ui/videoPreview.js
View file

@ -20,9 +20,9 @@ pandora.ui.videoPreview = function(data) {
}) })
.bindEvent({ .bindEvent({
click: function(event) { click: function(event) {
if (pandora.user.ui.item) { if (pandora.user.ui.item && ['video', 'timeline'].indexOf(pandora.user.ui.itemView) > -1) {
pandora.$ui[ pandora.$ui[
pandora.user.ui.itemView == 'player' ? 'player' : 'editor' pandora.user.ui.itemView == 'video' ? 'player' : 'editor'
].options({ ].options({
position: event.position position: event.position
}); });
@ -31,8 +31,8 @@ pandora.ui.videoPreview = function(data) {
'videoPoints|' + data.id, 'videoPoints|' + data.id,
{'in': 0, out: 0, position: event.position} {'in': 0, out: 0, position: event.position}
); );
pandora.URL.set( pandora.URL.push(
'/' + data.id + '/timeline' //'/' + Ox.formatDuration(event.position, 2) '/' + data.id + '/' + pandora.user.ui.videoView + '/' + Ox.formatDuration(event.position, 2)
); );
} }
} }

33
static/js/pandora/ui/viewSelect.js
View file

@ -1,17 +1,14 @@
// vim: et:ts=4:sw=4:sts=4:ft=javascript // vim: et:ts=4:sw=4:sts=4:ft=javascript
pandora.ui.viewSelect = function() { pandora.ui.viewSelect = function() {
var that = Ox.Select({ var viewKey = !pandora.user.ui.item ? 'listView' : 'itemView',
that = Ox.Select({
id: 'viewSelect', id: 'viewSelect',
items: !pandora.user.ui.item ? pandora.site.listViews.map(function(view) { items: pandora.site[viewKey + 's'].map(function(view) {
return Ox.extend(Ox.extend({}, view), { return Ox.extend(Ox.clone(view), {
checked: pandora.user.ui.lists[pandora.user.ui.list].listView == view.id, checked: view.id == pandora.user.ui[viewKey],
title: 'View ' + view.title title: 'View ' + view.title
}); });
}) : pandora.site.itemViews.map(function(view) {
return Ox.extend(Ox.extend({}, view), {
checked: pandora.user.ui.itemView == view.id,
title: 'View: ' + view.title
});
}), }),
width: !pandora.user.ui.item ? 144 : 128 width: !pandora.user.ui.item ? 144 : 128
}) })
@ -20,14 +17,16 @@ pandora.ui.viewSelect = function() {
margin: '4px 0 0 4px' margin: '4px 0 0 4px'
}) })
.bindEvent({ .bindEvent({
change: !pandora.user.ui.item ? function(data) { change: function(data) {
pandora.UI.set('lists|' + pandora.user.ui.list + '|listView', data.selected[0].id); pandora.UI.set(viewKey, data.selected[0].id);
pandora.URL.update(); }
//pandora.URL.set('/' + data.selected[0].id + '/' + document.location.search); });
} : function(data) { Ox.Event.bind({
pandora.UI.set({itemView: data.selected[0].id}); listView: function(value) {
pandora.URL.update(); that.selectItem(value);
// pandora.$ui.contentPanel.replaceElement(1, pandora.$ui.item = pandora.ui.item()); },
itemView: function(value) {
that.selectItem(value);
} }
}); });
return that; return that;

3
static/json/pandora.json
View file

@ -20,10 +20,11 @@
"js/pandora/ui/sectionbar.js", "js/pandora/ui/sectionbar.js",
"js/pandora/ui/folders.js", "js/pandora/ui/folders.js",
"js/pandora/ui/mainPanel.js", "js/pandora/ui/mainPanel.js",
"js/pandora/ui/viewSelect.js",
"js/pandora/ui/sortSelect.js", "js/pandora/ui/sortSelect.js",
"js/pandora/ui/orderButton.js",
"js/pandora/ui/menu.js", "js/pandora/ui/menu.js",
"js/pandora/ui/Ox.FilesView.js", "js/pandora/ui/Ox.FilesView.js",
"js/pandora/ui/viewSelect.js",
"js/pandora/ui/browser.js", "js/pandora/ui/browser.js",
"js/pandora/ui/list.js", "js/pandora/ui/list.js",
"js/pandora/ui/foldersList.js", "js/pandora/ui/foldersList.js",