forked from 0x2620/pandora
manage home dialog
This commit is contained in:
parent
3a9c269b5e
commit
85c63d228f
3 changed files with 191 additions and 0 deletions
|
|
@ -44,6 +44,7 @@ class Item(models.Model):
|
||||||
changed = True
|
changed = True
|
||||||
if 'active' in data:
|
if 'active' in data:
|
||||||
self.active = data['active'] is True
|
self.active = data['active'] is True
|
||||||
|
changed = True
|
||||||
if changed:
|
if changed:
|
||||||
self.save()
|
self.save()
|
||||||
return True
|
return True
|
||||||
|
|
|
||||||
187
static/js/homeDialog.js
Normal file
187
static/js/homeDialog.js
Normal file
|
|
@ -0,0 +1,187 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
pandora.ui.homeDialog = function() {
|
||||||
|
|
||||||
|
var $lists = Ox.Element();
|
||||||
|
|
||||||
|
var $item = $('<div>');
|
||||||
|
|
||||||
|
var $dialogPanel = Ox.SplitPanel({
|
||||||
|
elements: [
|
||||||
|
{element: $lists, size: 256},
|
||||||
|
{element: $item}
|
||||||
|
],
|
||||||
|
orientation: 'horizontal'
|
||||||
|
})
|
||||||
|
|
||||||
|
var that = Ox.Dialog({
|
||||||
|
buttons: [
|
||||||
|
Ox.Button({
|
||||||
|
id: 'done',
|
||||||
|
title: Ox._('Done')
|
||||||
|
}).bindEvent({
|
||||||
|
click: function() {
|
||||||
|
that.close();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
],
|
||||||
|
closeButton: true,
|
||||||
|
content: $dialogPanel,
|
||||||
|
height: 576,
|
||||||
|
removeOnClose: true,
|
||||||
|
title: Ox._('Manage Home Screen'),
|
||||||
|
width: 768
|
||||||
|
});
|
||||||
|
|
||||||
|
pandora.api.getHomeItems({}, function(result) {
|
||||||
|
var $activeList = renderList(result.data.items.filter(function(item) {
|
||||||
|
return item.active;
|
||||||
|
})).appendTo($lists);
|
||||||
|
var $inactiveList = renderList(result.data.items.filter(function(item) {
|
||||||
|
return !item.active;
|
||||||
|
}))//.appendTo($lists);
|
||||||
|
});
|
||||||
|
|
||||||
|
function renderItem(data) {
|
||||||
|
var $item = $('<div>');
|
||||||
|
if (!data) {
|
||||||
|
return $item;
|
||||||
|
}
|
||||||
|
var $form = $('<div>').appendTo($item);
|
||||||
|
var $typeSelect = Ox.Select({
|
||||||
|
items: [
|
||||||
|
{id: 'custom', title: Ox._('Custom')},
|
||||||
|
{id: 'list', title: Ox._('List')},
|
||||||
|
{id: 'edit', title: Ox._('Edit')},
|
||||||
|
{id: 'collection', title: Ox._('Collection')}
|
||||||
|
],
|
||||||
|
label: Ox._('Type'),
|
||||||
|
labelWidth: 128,
|
||||||
|
width: 512
|
||||||
|
}).css({
|
||||||
|
margin: '4px'
|
||||||
|
}).bindEvent({
|
||||||
|
change: function(data) {
|
||||||
|
renderItem({type: data.value})
|
||||||
|
}
|
||||||
|
}).appendTo($form);
|
||||||
|
if (data.type == 'custom') {
|
||||||
|
var $imageInput = Ox.Input({
|
||||||
|
label: Ox._('Image URL'),
|
||||||
|
labelWidth: 128,
|
||||||
|
width: 512
|
||||||
|
}).css({
|
||||||
|
margin: '4px'
|
||||||
|
}).appendTo($form);
|
||||||
|
var $linkInput = Ox.Input({
|
||||||
|
label: Ox._('Link URL'),
|
||||||
|
labelWidth: 128,
|
||||||
|
width: 512
|
||||||
|
}).css({
|
||||||
|
margin: '4px'
|
||||||
|
}).appendTo($form);
|
||||||
|
} else {
|
||||||
|
var $nameInput = Ox.Input({
|
||||||
|
label: Ox._('List Name'),
|
||||||
|
labelWidth: 128,
|
||||||
|
width: 512
|
||||||
|
}).css({
|
||||||
|
margin: '4px'
|
||||||
|
}).appendTo($form);
|
||||||
|
}
|
||||||
|
var $preview = $('<div>').appendTo($item);
|
||||||
|
var $imageContainer = $('<div>').css({
|
||||||
|
background: 'rgb(0, 0, 0)', // FIXME: make themes
|
||||||
|
borderRadius: '32px',
|
||||||
|
height: '128px',
|
||||||
|
width: '128px'
|
||||||
|
}).appendTo($preview);
|
||||||
|
if (data.image) {
|
||||||
|
$image = $('<img>').attr({
|
||||||
|
src: data.image
|
||||||
|
}).css({
|
||||||
|
borderRadius: '32px',
|
||||||
|
height: '128px',
|
||||||
|
width: '128px'
|
||||||
|
}).appendTo($imageContainer)
|
||||||
|
}
|
||||||
|
Ox.EditableContent({
|
||||||
|
placeholder: '<span class="OxLight">' + Ox._('Title') + '</span>',
|
||||||
|
value: data.title
|
||||||
|
})
|
||||||
|
.bindEvent({
|
||||||
|
submit: function(data) {
|
||||||
|
editItem('title', data.value);
|
||||||
|
}
|
||||||
|
}).appendTo($preview);
|
||||||
|
Ox.EditableContent({
|
||||||
|
placeholder: '<span class="OxLight">' + Ox._('Text') + '</span>',
|
||||||
|
value: data.text
|
||||||
|
})
|
||||||
|
.bindEvent({
|
||||||
|
submit: function(data) {
|
||||||
|
editItem('text', data.value);
|
||||||
|
}
|
||||||
|
}).appendTo($preview);
|
||||||
|
return $item;
|
||||||
|
}
|
||||||
|
|
||||||
|
function renderList(items) {
|
||||||
|
console.log('LIST', items)
|
||||||
|
var $list = Ox.TableList({
|
||||||
|
columns: [
|
||||||
|
{
|
||||||
|
id: 'image',
|
||||||
|
format: function(value) {
|
||||||
|
return $('<img>').attr({
|
||||||
|
src: value
|
||||||
|
}).css({
|
||||||
|
borderRadius: '4px',
|
||||||
|
height: '14px',
|
||||||
|
margin: '0 0 0 -2px',
|
||||||
|
width: '14px',
|
||||||
|
})
|
||||||
|
},
|
||||||
|
visible: true,
|
||||||
|
width: 16,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'title',
|
||||||
|
visible: true,
|
||||||
|
width: 224
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'active',
|
||||||
|
format: function(value) {
|
||||||
|
return value ? $('<img>').attr({
|
||||||
|
src: Ox.UI.getImageURL('symbolCheck')
|
||||||
|
}).css({
|
||||||
|
width: '10px',
|
||||||
|
height: '10px',
|
||||||
|
padding: '3px'
|
||||||
|
}) : ''
|
||||||
|
},
|
||||||
|
visible: true,
|
||||||
|
width: 16
|
||||||
|
}
|
||||||
|
],
|
||||||
|
items: items,
|
||||||
|
max: 1,
|
||||||
|
sort: [{key: 'index', operator: '+'}],
|
||||||
|
sortable: true,
|
||||||
|
unique: 'id'
|
||||||
|
})
|
||||||
|
.bindEvent({
|
||||||
|
select: function() {
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.css({
|
||||||
|
width: '256px'
|
||||||
|
});
|
||||||
|
return $list;
|
||||||
|
}
|
||||||
|
|
||||||
|
return that;
|
||||||
|
|
||||||
|
};
|
||||||
|
|
@ -230,6 +230,7 @@ pandora.ui.mainMenu = function() {
|
||||||
{ id: 'places', title: Ox._('Manage Places...'), disabled: !pandora.site.capabilities.canManagePlacesAndEvents[pandora.user.level] },
|
{ id: 'places', title: Ox._('Manage Places...'), disabled: !pandora.site.capabilities.canManagePlacesAndEvents[pandora.user.level] },
|
||||||
{ id: 'events', title: Ox._('Manage Events...'), disabled: !pandora.site.capabilities.canManagePlacesAndEvents[pandora.user.level] },
|
{ id: 'events', title: Ox._('Manage Events...'), disabled: !pandora.site.capabilities.canManagePlacesAndEvents[pandora.user.level] },
|
||||||
{},
|
{},
|
||||||
|
{ id: 'managehome', title: Ox._('Manage Home...'), disabled: !pandora.site.capabilities.canManageHome[pandora.user.level] },
|
||||||
{ id: 'users', title: Ox._('Manage Users...'), disabled: !pandora.site.capabilities.canManageUsers[pandora.user.level] },
|
{ id: 'users', title: Ox._('Manage Users...'), disabled: !pandora.site.capabilities.canManageUsers[pandora.user.level] },
|
||||||
{ id: 'statistics', title: Ox._('Statistics...'), disabled: !pandora.site.capabilities.canManageUsers[pandora.user.level] },
|
{ id: 'statistics', title: Ox._('Statistics...'), disabled: !pandora.site.capabilities.canManageUsers[pandora.user.level] },
|
||||||
{},
|
{},
|
||||||
|
|
@ -626,6 +627,8 @@ pandora.ui.mainMenu = function() {
|
||||||
(pandora.$ui.eventsDialog || (
|
(pandora.$ui.eventsDialog || (
|
||||||
pandora.$ui.eventsDialog = pandora.ui.eventsDialog()
|
pandora.$ui.eventsDialog = pandora.ui.eventsDialog()
|
||||||
)).open();
|
)).open();
|
||||||
|
} else if (data.id == 'managehome') {
|
||||||
|
pandora.$ui.homeDialog = pandora.ui.homeDialog().open();
|
||||||
} else if (data.id == 'users') {
|
} else if (data.id == 'users') {
|
||||||
pandora.$ui.usersDialog = pandora.ui.usersDialog().open();
|
pandora.$ui.usersDialog = pandora.ui.usersDialog().open();
|
||||||
} else if (data.id == 'statistics') {
|
} else if (data.id == 'statistics') {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue