- use getPage for site dialog
- add events and users dialog and backend - add some values to preferences/settings dialog - more migration of backend to new query api
This commit is contained in:
parent
a6a285367b
commit
52df791560
20 changed files with 604 additions and 131 deletions
65
static/js/pandora/ui/eventsDialog.js
Normal file
65
static/js/pandora/ui/eventsDialog.js
Normal file
|
|
@ -0,0 +1,65 @@
|
|||
// vim: et:ts=4:sw=4:sts=4:ft=javascript
|
||||
pandora.ui.eventsDialog = function() {
|
||||
var height = Math.round((window.innerHeight - 48) * 0.9),
|
||||
width = Math.round(window.innerWidth * 0.9),
|
||||
that = Ox.Dialog({
|
||||
buttons: [
|
||||
Ox.Button({
|
||||
id: 'done',
|
||||
title: 'Done'
|
||||
}).bindEvent({
|
||||
click: function() {
|
||||
that.close();
|
||||
}
|
||||
})
|
||||
],
|
||||
closeButton: true,
|
||||
content: pandora.$ui.eventsElement = Ox.TextList({
|
||||
columns: [
|
||||
{
|
||||
id: 'id',
|
||||
title: 'ID',
|
||||
operator: '+',
|
||||
unique: true,
|
||||
visible: false,
|
||||
width: 16
|
||||
},
|
||||
{
|
||||
id: 'name',
|
||||
title: 'Name',
|
||||
operator: '+',
|
||||
visible: true,
|
||||
width: 256
|
||||
},
|
||||
{
|
||||
id: 'start',
|
||||
operator: '+',
|
||||
visible: true,
|
||||
width: 256
|
||||
},
|
||||
{
|
||||
id: 'end',
|
||||
operator: '+',
|
||||
visible: true,
|
||||
width: 256
|
||||
}
|
||||
],
|
||||
items: function(data, callback) {
|
||||
pandora.api.findEvents(data, callback);
|
||||
},
|
||||
keys: ['name', 'start', 'end'],
|
||||
sort: [
|
||||
{key: 'name', operator: '+'}
|
||||
]
|
||||
}),
|
||||
height: height,
|
||||
maximizeButton: true,
|
||||
minHeight: 256,
|
||||
minWidth: 512,
|
||||
padding: 0,
|
||||
title: 'Manage Events',
|
||||
width: width
|
||||
});
|
||||
return that;
|
||||
};
|
||||
|
||||
|
|
@ -39,11 +39,49 @@ pandora.ui.item = function() {
|
|||
);
|
||||
|
||||
} else if (pandora.user.ui.itemView == 'calendar') {
|
||||
pandora.$ui.contentPanel.replaceElement(1, Ox.Element().html('Calendar'));
|
||||
pandora.api.findEvents({
|
||||
itemQuery: {conditions: [{key: 'id', value: pandora.user.ui.item, operator:'='}]},
|
||||
keys: ['id', 'name', 'start', 'end'],
|
||||
query: {}
|
||||
}, function(r) {
|
||||
if (r.data.items.length>0) {
|
||||
pandora.$ui.contentPanel.replaceElement(1, Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: pandora.$ui.calendar = Ox.Calendar({
|
||||
date: new Date(0),
|
||||
events: r.data.items,
|
||||
height: window.innerHeight - pandora.user.ui.showGroups * pandora.user.ui.groupsSize - 61,
|
||||
range: [-5000, 5000],
|
||||
width: window.innerWidth - pandora.user.ui.showSidebar * pandora.user.ui.sidebarSize - 2 - 144 - Ox.UI.SCROLLBAR_SIZE,
|
||||
zoom: 4
|
||||
})
|
||||
},
|
||||
{
|
||||
element: Ox.Element(),
|
||||
id: 'place',
|
||||
size: 144 + Ox.UI.SCROLLBAR_SIZE
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
})
|
||||
.bindEvent('resize', function(data) {
|
||||
|
||||
}));
|
||||
} else {
|
||||
pandora.$ui.contentPanel.replaceElement(1,
|
||||
Ox.Element()
|
||||
.css({marginTop: '32px', fontSize: '12px', textAlign: 'center'})
|
||||
.html(
|
||||
'Sorry, <i>' + result.data.title
|
||||
+ '</i> currently doesn\'t have a '
|
||||
+ pandora.user.ui.itemView + ' view.'
|
||||
));
|
||||
}
|
||||
});
|
||||
|
||||
} 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) {
|
||||
|
|
|
|||
|
|
@ -499,18 +499,17 @@ pandora.ui.list = function() { // fixme: remove view argument
|
|||
|
||||
});
|
||||
pandora.api.findEvents({
|
||||
query: '',
|
||||
itemQuery: pandora.user.ui.query
|
||||
itemQuery: pandora.user.ui.query,
|
||||
keys: ['id', 'name', 'start', 'end'],
|
||||
query: {}
|
||||
}, function(result) {
|
||||
Ox.print(">>>>>>>", result);
|
||||
that.replaceElement(0,
|
||||
pandora.$ui.calendar = Ox.Calendar({
|
||||
date: new Date(0),
|
||||
events: result.data.events,
|
||||
height: window.innerHeight - pandora.user.ui.showGroups * pandora.user.ui.groupsSize - 61,
|
||||
range: [-5000, 5000],
|
||||
width: window.innerWidth - pandora.user.ui.showSidebar * pandora.user.ui.sidebarSize - 2 - 144 - Ox.UI.SCROLLBAR_SIZE,
|
||||
zoom: 4
|
||||
that.replaceElement(0, pandora.$ui.calendar = Ox.Calendar({
|
||||
date: new Date(0),
|
||||
events: result.data.items,
|
||||
height: window.innerHeight - pandora.user.ui.showGroups * pandora.user.ui.groupsSize - 61,
|
||||
range: [-5000, 5000],
|
||||
width: window.innerWidth - pandora.user.ui.showSidebar * pandora.user.ui.sidebarSize - 2 - 144 - Ox.UI.SCROLLBAR_SIZE,
|
||||
zoom: 4
|
||||
}));
|
||||
});
|
||||
} else {
|
||||
|
|
|
|||
|
|
@ -521,6 +521,12 @@ pandora.ui.mainMenu = function() {
|
|||
overflow: 'hidden'
|
||||
}).append($manage).open();
|
||||
*/
|
||||
} else if (data.id == 'events') {
|
||||
pandora.$ui.eventsDialog = pandora.ui.eventsDialog().open();
|
||||
} else if (data.id == 'users') {
|
||||
pandora.$ui.eventsDialog = pandora.ui.usersDialog().open();
|
||||
} else if (data.id == 'lists') {
|
||||
pandora.$ui.eventsDialog = pandora.ui.listsDialog().open();
|
||||
} else if (data.id == 'query') {
|
||||
var $dialog = Ox.Dialog({
|
||||
buttons: [
|
||||
|
|
|
|||
|
|
@ -6,6 +6,36 @@ pandora.ui.preferencesDialog = function() {
|
|||
];
|
||||
var $tabPanel = Ox.TabPanel({
|
||||
content: function(id) {
|
||||
var content = Ox.Element().css({padding: '16px', overflowY: 'auto'});
|
||||
if (id == 'account') {
|
||||
content.append(Ox.FormElementGroup({
|
||||
elements: Ox.values(Ox.map(pandora.user.preferences, function(v, k) {
|
||||
return Ox.Input({
|
||||
id: k,
|
||||
width: 400,
|
||||
label: Ox.toTitleCase(k),
|
||||
value: v
|
||||
});
|
||||
}))
|
||||
}));
|
||||
} else {
|
||||
content.append(Ox.FormElementGroup({
|
||||
elements: [
|
||||
Ox.Checkbox({
|
||||
checked: true ,
|
||||
id: 'showEpisodes',
|
||||
title: 'Show Episodes',
|
||||
width: 400
|
||||
}),
|
||||
Ox.Checkbox({
|
||||
checked: true ,
|
||||
id: 'newsletter',
|
||||
title: 'Receive Newsletter',
|
||||
width: 400
|
||||
})
|
||||
]
|
||||
}));
|
||||
}
|
||||
return Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
|
|
@ -19,9 +49,7 @@ pandora.ui.preferencesDialog = function() {
|
|||
size: 144
|
||||
},
|
||||
{
|
||||
element: Ox.Element()
|
||||
.css({padding: '16px', overflowY: 'auto'})
|
||||
.html(Ox.repeat(Ox.getObjectById(tabs, id).title + ' ', 200))
|
||||
element: content
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
|
|
@ -52,4 +80,4 @@ pandora.ui.preferencesDialog = function() {
|
|||
|
||||
return $dialog;
|
||||
|
||||
};
|
||||
};
|
||||
|
|
|
|||
|
|
@ -12,6 +12,10 @@ pandora.ui.siteDialog = function(section) {
|
|||
Ox.getObjectById(tabs, section).selected = true;
|
||||
var $tabPanel = Ox.TabPanel({
|
||||
content: function(id) {
|
||||
var content = Ox.Element().css({padding: '16px', overflowY: 'auto'});
|
||||
pandora.api.getPage({name:id}, function(result) {
|
||||
content.html(result.data.body);
|
||||
});
|
||||
return Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
|
|
@ -27,9 +31,7 @@ pandora.ui.siteDialog = function(section) {
|
|||
size: 272
|
||||
},
|
||||
{
|
||||
element: Ox.Element()
|
||||
.css({padding: '16px', overflowY: 'auto'})
|
||||
.html(Ox.repeat(Ox.getObjectById(tabs, id).title + ' ', 200))
|
||||
element: content
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
|
|
@ -68,4 +70,4 @@ pandora.ui.siteDialog = function(section) {
|
|||
|
||||
return $dialog;
|
||||
|
||||
};
|
||||
};
|
||||
|
|
|
|||
52
static/js/pandora/ui/usersDialog.js
Normal file
52
static/js/pandora/ui/usersDialog.js
Normal file
|
|
@ -0,0 +1,52 @@
|
|||
// vim: et:ts=4:sw=4:sts=4:ft=javascript
|
||||
pandora.ui.usersDialog = function() {
|
||||
var height = Math.round((window.innerHeight - 48) * 0.9),
|
||||
width = Math.round(window.innerWidth * 0.9),
|
||||
that = Ox.Dialog({
|
||||
buttons: [
|
||||
Ox.Button({
|
||||
id: 'done',
|
||||
title: 'Done'
|
||||
}).bindEvent({
|
||||
click: function() {
|
||||
that.close();
|
||||
}
|
||||
})
|
||||
],
|
||||
closeButton: true,
|
||||
content: pandora.$ui.usersElement = Ox.TextList({
|
||||
columns: [
|
||||
{
|
||||
id: 'username',
|
||||
title: 'Name',
|
||||
operator: '+',
|
||||
visible: true,
|
||||
unique: true,
|
||||
width: 256
|
||||
},
|
||||
{
|
||||
id: 'level',
|
||||
operator: '+',
|
||||
visible: true,
|
||||
width: 256
|
||||
}
|
||||
],
|
||||
items: function(data, callback) {
|
||||
pandora.api.findUsers(data, callback);
|
||||
},
|
||||
keys: [],
|
||||
sort: [
|
||||
{key: 'username', operator: '+'}
|
||||
]
|
||||
}),
|
||||
height: height,
|
||||
maximizeButton: true,
|
||||
minHeight: 256,
|
||||
minWidth: 512,
|
||||
padding: 0,
|
||||
title: 'Manage Users',
|
||||
width: width
|
||||
});
|
||||
return that;
|
||||
};
|
||||
|
||||
Loading…
Add table
Add a link
Reference in a new issue