new home
This commit is contained in:
parent
a5dfc438d3
commit
2b0f2d7b99
7 changed files with 309 additions and 343 deletions
|
|
@ -121,10 +121,6 @@ pandora.ui.home = function() {
|
|||
var folder = pandora.getListData().folder,
|
||||
value = $findInput.value();
|
||||
folder && pandora.$ui.folderList[folder].options({selected: []});
|
||||
if (pandora.user.ui.section == 'items') {
|
||||
pandora.$ui.findSelect.value('*');
|
||||
pandora.$ui.findInput.value(value);
|
||||
}
|
||||
that.fadeOutScreen();
|
||||
pandora.UI.set({
|
||||
page: '',
|
||||
|
|
@ -136,6 +132,8 @@ pandora.ui.home = function() {
|
|||
},
|
||||
section: 'items'
|
||||
});
|
||||
pandora.$ui.findSelect && pandora.$ui.findSelect.value('*');
|
||||
pandora.$ui.findInput && pandora.$ui.findInput.value(value);
|
||||
}
|
||||
})
|
||||
.appendTo(that),
|
||||
|
|
|
|||
|
|
@ -160,10 +160,6 @@ pandora.ui.home = function() {
|
|||
var folder = pandora.getListData().folder,
|
||||
value = $findInput.value();
|
||||
folder && pandora.$ui.folderList[folder].options({selected: []});
|
||||
if (pandora.user.ui.section == 'items') {
|
||||
pandora.$ui.findSelect.value('*');
|
||||
pandora.$ui.findInput.value(value);
|
||||
}
|
||||
that.fadeOutScreen();
|
||||
pandora.UI.set({
|
||||
page: '',
|
||||
|
|
@ -175,6 +171,8 @@ pandora.ui.home = function() {
|
|||
},
|
||||
section: 'items'
|
||||
});
|
||||
pandora.$ui.findSelect && pandora.$ui.findSelect.value('*');
|
||||
pandora.$ui.findInput && pandora.$ui.findInput.value(value);
|
||||
}
|
||||
})
|
||||
.appendTo($box),
|
||||
|
|
|
|||
|
|
@ -112,10 +112,6 @@ pandora.ui.home = function() {
|
|||
var folder = pandora.getListData().folder,
|
||||
value = $findInput.value();
|
||||
folder && pandora.$ui.folderList[folder].options({selected: []});
|
||||
if (pandora.user.ui.section == 'items') {
|
||||
pandora.$ui.findSelect.value('*');
|
||||
pandora.$ui.findInput.value(value);
|
||||
}
|
||||
that.fadeOutScreen();
|
||||
pandora.UI.set({
|
||||
page: '',
|
||||
|
|
@ -127,6 +123,8 @@ pandora.ui.home = function() {
|
|||
},
|
||||
section: 'items'
|
||||
});
|
||||
pandora.$ui.findSelect && pandora.$ui.findSelect.value('*');
|
||||
pandora.$ui.findInput && pandora.$ui.findInput.value(value);
|
||||
}
|
||||
})
|
||||
.appendTo(that),
|
||||
|
|
@ -153,6 +151,7 @@ pandora.ui.home = function() {
|
|||
}
|
||||
})
|
||||
.appendTo(that),
|
||||
|
||||
$signupButton = Ox.Button({
|
||||
title: Ox._('Sign Up'),
|
||||
width: 74
|
||||
|
|
|
|||
|
|
@ -132,10 +132,6 @@ pandora.ui.home = function() {
|
|||
var folder = pandora.getListData().folder,
|
||||
value = $findInput.value();
|
||||
folder && pandora.$ui.folderList[folder].options({selected: []});
|
||||
if (pandora.user.ui.section == 'items') {
|
||||
pandora.$ui.findSelect.value('*');
|
||||
pandora.$ui.findInput.value(value);
|
||||
}
|
||||
that.fadeOutScreen();
|
||||
pandora.UI.set({
|
||||
page: '',
|
||||
|
|
@ -147,6 +143,8 @@ pandora.ui.home = function() {
|
|||
},
|
||||
section: 'items'
|
||||
});
|
||||
pandora.$ui.findSelect && pandora.$ui.findSelect.value('*');
|
||||
pandora.$ui.findInput && pandora.$ui.findInput.value(value);
|
||||
}
|
||||
})
|
||||
.appendTo($box),
|
||||
|
|
@ -175,18 +173,17 @@ pandora.ui.home = function() {
|
|||
})
|
||||
.appendTo($box),
|
||||
|
||||
$footer = Ox.Element().css({
|
||||
clear: 'both',
|
||||
height: '64px',
|
||||
paddingTop: '12px'
|
||||
}),
|
||||
|
||||
$signupButton = Ox.Button({
|
||||
title: Ox._('Sign Up'),
|
||||
width: 122
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: 0,
|
||||
top: '144px',
|
||||
right: '390px',
|
||||
bottom: 0,
|
||||
margin: '0 auto 0 auto',
|
||||
opacity: 0
|
||||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
|
|
@ -200,13 +197,7 @@ pandora.ui.home = function() {
|
|||
width: 122
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: 0,
|
||||
top: '144px',
|
||||
right: '130px',
|
||||
bottom: 0,
|
||||
margin: '0 auto 0 auto',
|
||||
opacity: 0
|
||||
marginLeft: '8px',
|
||||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
|
|
@ -220,13 +211,6 @@ pandora.ui.home = function() {
|
|||
width: 252
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: 0,
|
||||
top: '144px',
|
||||
right: '260px',
|
||||
bottom: 0,
|
||||
margin: '0 auto 0 auto',
|
||||
opacity: 0
|
||||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
|
|
@ -240,205 +224,57 @@ pandora.ui.home = function() {
|
|||
width: 252
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: '260px',
|
||||
top: '144px',
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
margin: '0 auto 0 auto',
|
||||
opacity: 0
|
||||
marginLeft: '8px'
|
||||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
pandora.UI.set({page: 'about'});
|
||||
that.fadeOutScreen();
|
||||
}
|
||||
})
|
||||
.appendTo($box),
|
||||
}),
|
||||
|
||||
$features = $('<div>')
|
||||
.attr({id: 'lists'})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: 0,
|
||||
top: '184px',
|
||||
top: '152px',
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
width: '560px',
|
||||
width: '512px',
|
||||
margin: '0 auto 0 auto',
|
||||
opacity: 0
|
||||
})
|
||||
.appendTo($box);
|
||||
|
||||
if (pandora.user.level == 'guest') {
|
||||
$signupButton.appendTo($box);
|
||||
$signinButton.appendTo($box);
|
||||
$signupButton.appendTo($footer);
|
||||
$signinButton.appendTo($footer);
|
||||
} else {
|
||||
$preferencesButton.appendTo($box);
|
||||
$preferencesButton.appendTo($footer);
|
||||
}
|
||||
$aboutButton.appendTo($footer);
|
||||
|
||||
function showFeatures() {
|
||||
var $space,
|
||||
featured = {},
|
||||
find = {
|
||||
query: {
|
||||
conditions: [{key: 'status', value: 'featured', operator: '=='}],
|
||||
operator: '&'
|
||||
},
|
||||
keys: ['description', 'modified', 'name', 'user'],
|
||||
sort: [{key: 'position', operator: '+'}]
|
||||
},
|
||||
items, lists, edits, texts;
|
||||
pandora.api.getHomeItems({active: true}, function(result) {
|
||||
items = result.data.items;
|
||||
lists = 1;
|
||||
edits = 1;
|
||||
texts = 1;
|
||||
show();
|
||||
});
|
||||
function show() {
|
||||
var counter = 0, max = 8, mouse = false, position = 0, selected = 0,
|
||||
color = Ox.Theme() == 'oxlight' ? 'rgb(0, 0, 0)'
|
||||
: Ox.Theme() == 'oxmedium' ? 'rgb(0, 0, 0)'
|
||||
: 'rgb(255, 255, 255)',
|
||||
$label, $texts,
|
||||
$featuresBox, $featuresContainer, $featuresContent,
|
||||
$featureBox = [], $featureIcon = [],
|
||||
$previousButton, $nextButton;
|
||||
var items = result.data.items.filter(pandora.isCompleteHomeItem),
|
||||
$texts;
|
||||
$features.empty();
|
||||
if (items.length) {
|
||||
$features.empty();
|
||||
$texts = Ox.Element().appendTo($features);
|
||||
var top = 24;
|
||||
items.forEach(function(item) {
|
||||
var $text, $icon;
|
||||
$icon = Ox.Element({
|
||||
element: '<img>',
|
||||
tooltip: getTooltip(item)
|
||||
})
|
||||
.attr({
|
||||
src: item.image
|
||||
})
|
||||
.css({
|
||||
left: 0,
|
||||
right: '390px',
|
||||
width: '122px',
|
||||
height: '122px',
|
||||
borderRadius: '32px',
|
||||
marginRight: '8px',
|
||||
cursor: 'pointer',
|
||||
float: 'left'
|
||||
})
|
||||
.bindEvent({
|
||||
anyclick: function() {
|
||||
openItem(item);
|
||||
}
|
||||
});
|
||||
$text = Ox.Label({
|
||||
//width: 386 + 122
|
||||
})
|
||||
.addClass('OxSelectable')
|
||||
.css({
|
||||
//position: 'absolute',
|
||||
left: '24px',
|
||||
//top: top + 'px',
|
||||
right: 0,
|
||||
height: 'auto',
|
||||
padding: '8px 8px 8px 8px',
|
||||
borderRadius: '32px',
|
||||
marginBottom: '16px',
|
||||
overflowY: 'auto',
|
||||
lineHeight: '14px',
|
||||
textOverflow: 'ellipsis',
|
||||
whiteSpace: 'normal'
|
||||
})
|
||||
.append($icon)
|
||||
.append(
|
||||
Ox.Element().css({
|
||||
//padding: '8px',
|
||||
}).html(getHTML(item))
|
||||
|
||||
)
|
||||
.appendTo($texts);
|
||||
pandora.createLinks($text);
|
||||
top += 130;
|
||||
var $item = pandora.renderHomeItem({
|
||||
data: item
|
||||
}).appendTo($texts);
|
||||
});
|
||||
} else {
|
||||
$features.css({
|
||||
top: '132px'
|
||||
});
|
||||
$features.animate({opacity: 1}, 250);
|
||||
}
|
||||
|
||||
function getHTML(item) {
|
||||
return '<b>' + Ox.encodeHTMLEntities(item.title) + '</b><br><br>' + item.text;
|
||||
}
|
||||
|
||||
function getTooltip(item) {
|
||||
return Ox._('View {0}', [Ox._(Ox.toTitleCase(item.title))])
|
||||
}
|
||||
|
||||
function openItem(item) {
|
||||
that.fadeOutScreen();
|
||||
if (item.type == 'custom') {
|
||||
pandora.URL.push(item.link);
|
||||
} else {
|
||||
pandora.UI.set(Ox.extend({
|
||||
|
||||
section: item.type == 'list' ? 'items' : item.type + 's',
|
||||
page: ''
|
||||
}, item.type == 'list' ? {
|
||||
find: {
|
||||
conditions: [{
|
||||
key: 'list',
|
||||
value: item.contentid,
|
||||
operator: '=='
|
||||
}],
|
||||
operator: '&'
|
||||
}
|
||||
} : item.type == 'collection' ? {
|
||||
findDocuments: {
|
||||
conditions: [{
|
||||
key: 'collection',
|
||||
value: item.contentid,
|
||||
operator: '=='
|
||||
}],
|
||||
operator: '&'
|
||||
}
|
||||
} : item.type == 'edit' ? {
|
||||
edit: item.contentid
|
||||
} : {
|
||||
}));
|
||||
}
|
||||
}
|
||||
|
||||
function scrollToPosition(i, animate) {
|
||||
if (i >= 0 && i <= items.length - max && i != position) {
|
||||
position = i;
|
||||
$featuresContent.stop().animate({
|
||||
left: (position * -65) + 'px'
|
||||
}, animate ? 250 : 0, function() {
|
||||
if (position == 0) {
|
||||
$previousButton.removeClass('visible').stop().animate({
|
||||
opacity: 0
|
||||
}, 250, function() {
|
||||
$previousButton.hide();
|
||||
});
|
||||
} else {
|
||||
$previousButton.addClass('visible');
|
||||
}
|
||||
if (position == items.length - max) {
|
||||
$nextButton.removeClass('visible').stop().animate({
|
||||
opacity: 0
|
||||
}, 250, function() {
|
||||
$nextButton.hide();
|
||||
});
|
||||
} else {
|
||||
$nextButton.addClass('visible');
|
||||
}
|
||||
if (mouse) {
|
||||
$featuresBox.trigger('mouseenter');
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
$features.append($footer);
|
||||
$features.animate({opacity: 1}, 250);
|
||||
});
|
||||
}
|
||||
|
||||
that.fadeInScreen = function() {
|
||||
|
|
|
|||
|
|
@ -8,11 +8,13 @@ pandora.ui.homeDialog = function() {
|
|||
|
||||
var $folders = $('<div>').css({overflowX: 'hidden', overflowY: 'auto'});
|
||||
|
||||
var $item = $('<div>').addClass('OxTextPage');
|
||||
var $activeList, $inactiveList, $activeMenu, $inactiveMenu;
|
||||
|
||||
var $item = $('<div>').addClass('OxTextPage').css({overflow: 'auto'});
|
||||
|
||||
var $form = $('<div>');
|
||||
|
||||
var $title, $text, $typeSelect, $imageInput, $linkInput, $nameInput;
|
||||
var $statusSelect, $typeSelect, $imageInput, $linkInput, $nameInput;
|
||||
|
||||
var $dialogPanel = Ox.SplitPanel({
|
||||
elements: [
|
||||
|
|
@ -36,10 +38,10 @@ pandora.ui.homeDialog = function() {
|
|||
],
|
||||
closeButton: true,
|
||||
content: $dialogPanel,
|
||||
height: 256, //576,
|
||||
height: Math.round((window.innerHeight - 48) * 0.9),
|
||||
removeOnClose: true,
|
||||
title: Ox._('Manage Home Screen'),
|
||||
width: 1050 // 256 + 17 + 512 + 17 + 256
|
||||
width: 1058 // 256 + 17 + 512 + 17 + 256
|
||||
});
|
||||
|
||||
pandora.api.getHomeItems({}, function(result) {
|
||||
|
|
@ -55,46 +57,63 @@ pandora.ui.homeDialog = function() {
|
|||
});
|
||||
});
|
||||
|
||||
function editItem(id, key, value) {
|
||||
var title = $title.value();
|
||||
var text = $text.value();
|
||||
var type = $typeSelect.value();
|
||||
if (type == 'custom') {
|
||||
var image = $imageInput.value();
|
||||
var link = $linkInput.value();
|
||||
} else {
|
||||
var name = $nameInput.value();
|
||||
title = true;
|
||||
text = true;
|
||||
function addItem(active, callback) {
|
||||
pandora.api.addHomeItem({
|
||||
active: active,
|
||||
}, function(response) {
|
||||
items.push(response.data);
|
||||
var selected = response.data.id;
|
||||
renderFolders(items, selected);
|
||||
var item = Ox.getObjectById(items, selected);
|
||||
renderItem(item);
|
||||
renderForm(item);
|
||||
callback && callback();
|
||||
});
|
||||
}
|
||||
function deleteItem(id, callback) {
|
||||
pandora.api.removeHomeItem({
|
||||
id: id
|
||||
}, function() {
|
||||
items = items.filter(function(item) {
|
||||
return item.id != id;
|
||||
});
|
||||
var selected = items[0].id;
|
||||
renderFolders(items, selected);
|
||||
var item = Ox.getObjectById(items, selected);
|
||||
renderItem(item);
|
||||
renderForm(item);
|
||||
callback && callback();
|
||||
});
|
||||
}
|
||||
|
||||
function editItem(id, key, value, callback) {
|
||||
if (key == 'name') {
|
||||
key = 'contentid';
|
||||
}
|
||||
if (
|
||||
!title || !text
|
||||
|| (type == 'custom' && (!image || !link))
|
||||
|| (type != 'custom' && !name)
|
||||
) {
|
||||
return;
|
||||
}
|
||||
Ox.print('id', id, 'k', key, 'v', value);
|
||||
var data = {id: id};
|
||||
data[key] = value;
|
||||
if (key == 'contentid') {
|
||||
data.type = type;
|
||||
var data = Ox.extend({id: id}, key, value);
|
||||
if (key == 'type') {
|
||||
Ox.extend(data, {'contentid': ''});
|
||||
}
|
||||
pandora.api.editHomeItem(data, function(result) {
|
||||
Ox.Request.clearCache(); // FIXME: too much?
|
||||
items.some(function(item) {
|
||||
if (item.id == id) {
|
||||
item[key] = value;
|
||||
if (key == 'contentid') {
|
||||
item.image = result.data.image;
|
||||
item.text = result.data.text;
|
||||
item.title = result.data.title;
|
||||
renderItem(item);
|
||||
}
|
||||
return true;
|
||||
};
|
||||
Ox.Request.clearCache('Home');
|
||||
var item = Ox.getObjectById(items, id);
|
||||
Ox.unique(Object.keys(item).concat(Object.keys(result.data))).forEach(function(key) {
|
||||
item[key] = result.data[key] || '';
|
||||
});
|
||||
renderFolders(items, item.id);
|
||||
/*
|
||||
console.log('1', item)
|
||||
console.log('2', (item.status == 'active' ? $activeList : $inactiveList).value(id));
|
||||
(item.status == 'active' ? $activeList : $inactiveList).value(id, {
|
||||
image: item.image,
|
||||
title: item.title,
|
||||
text: item.text,
|
||||
link: item.link
|
||||
});
|
||||
*/
|
||||
renderItem(item);
|
||||
renderForm(item);
|
||||
callback && callback();
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -112,9 +131,9 @@ pandora.ui.homeDialog = function() {
|
|||
},
|
||||
range: [0, 1000]
|
||||
}, function(result) {
|
||||
autocompleteData[value] = result.data.items.map(function(item) {
|
||||
autocompleteData[value] = [''].concat(result.data.items.map(function(item) {
|
||||
return item.id;
|
||||
});
|
||||
}));
|
||||
callback();
|
||||
});
|
||||
},
|
||||
|
|
@ -122,14 +141,14 @@ pandora.ui.homeDialog = function() {
|
|||
);
|
||||
}
|
||||
|
||||
function renderFolder(type, items, selected) {
|
||||
function renderFolder(status, items, selected) {
|
||||
var extras = [
|
||||
Ox.MenuButton({
|
||||
items: [
|
||||
{id: 'newitem', title: Ox._(
|
||||
'New ' + (type == 'active' ? 'Active' : 'Inactive') + ' Item'
|
||||
'New ' + (status == 'active' ? 'Active' : 'Inactive') + ' Item'
|
||||
)},
|
||||
{id: 'deleteitem', title: Ox._('Delete Selected Item')}
|
||||
{id: 'deleteitem', title: Ox._('Delete Selected Item'), disabled: !selected}
|
||||
],
|
||||
title: 'edit',
|
||||
tooltip: Ox._('Manage Items'),
|
||||
|
|
@ -137,18 +156,26 @@ pandora.ui.homeDialog = function() {
|
|||
}).bindEvent({
|
||||
click: function(data) {
|
||||
if (data.id == 'newitem') {
|
||||
// ...
|
||||
addItem(status == 'active');
|
||||
} else if (data.id == 'deleteitem') {
|
||||
// ...
|
||||
var id = (
|
||||
status == 'active' ? $activeList : $inactiveList
|
||||
).options('selected')[0];
|
||||
id && deleteItem(id);
|
||||
}
|
||||
}
|
||||
},
|
||||
})
|
||||
];
|
||||
if (status == 'active') {
|
||||
$activeMenu = extras[0];
|
||||
} else {
|
||||
$inactiveMenu = extras[0];
|
||||
}
|
||||
var $folder = Ox.CollapsePanel({
|
||||
collapsed: false,
|
||||
extras: extras,
|
||||
size: 16,
|
||||
title: Ox._((type == 'active' ? 'Active' : 'Inactive') + ' Items')
|
||||
title: Ox._((status == 'active' ? 'Active' : 'Inactive') + ' Items')
|
||||
}).bindEvent({
|
||||
toggle: function(data) {
|
||||
data.collapsed && $list.loseFocus();
|
||||
|
|
@ -159,31 +186,63 @@ pandora.ui.homeDialog = function() {
|
|||
padding: '1px 4px',
|
||||
}).html(Ox._('No items')).hide().appendTo($folder.$content)
|
||||
var $list = renderList(items.filter(function(item) {
|
||||
return item.active == (type == 'active');
|
||||
return item.active == (status == 'active');
|
||||
}), selected).bindEventOnce({
|
||||
init: function(data) {
|
||||
updateMenu(status, $list.options('selected').length);
|
||||
$placeholder[data.items ? 'hide' : 'show']();
|
||||
$folder.$content.css({
|
||||
height: (data.items || 1) * 16 + 'px'
|
||||
});
|
||||
}
|
||||
}).bindEvent({
|
||||
add: function(event) {
|
||||
addItem(status == 'active');
|
||||
},
|
||||
'delete': function(data) {
|
||||
data.ids.length && deleteItem(data.ids[0]);
|
||||
}
|
||||
}).appendTo($folder.$content);
|
||||
|
||||
if (status == 'active') {
|
||||
$activeList = $list;
|
||||
} else {
|
||||
$inactiveList = $list;
|
||||
}
|
||||
return $folder;
|
||||
}
|
||||
|
||||
function renderFolders(items, selected) {
|
||||
$folders.empty();
|
||||
['active', 'inactive'].forEach(function(type) {
|
||||
var $folder = renderFolder(type, items, selected).appendTo($folders);
|
||||
['active', 'inactive'].forEach(function(status) {
|
||||
var $folder = renderFolder(status, items, selected).appendTo($folders);
|
||||
});
|
||||
}
|
||||
|
||||
function renderForm(data, focus) {
|
||||
$form.empty();
|
||||
if (!data) {
|
||||
return;
|
||||
}
|
||||
$statusSelect = Ox.Select({
|
||||
items: [
|
||||
{id: 'active', title: Ox._('Active')},
|
||||
{id: 'inactive', title: Ox._('Inactive')}
|
||||
],
|
||||
label: Ox._('Status'),
|
||||
labelWidth: 80,
|
||||
value: data.active ? 'active' : 'inactive',
|
||||
width: 240
|
||||
}).css({
|
||||
margin: '8px'
|
||||
}).bindEvent({
|
||||
change: function(data_) {
|
||||
editItem(data.id, 'active', data_.value == 'active');
|
||||
}
|
||||
}).appendTo($form);
|
||||
$typeSelect = Ox.Select({
|
||||
items: [
|
||||
{id: 'custom', title: Ox._('Custom')},
|
||||
{},
|
||||
{id: 'list', title: Ox._('List')},
|
||||
{id: 'edit', title: Ox._('Edit')},
|
||||
{id: 'collection', title: Ox._('Collection')}
|
||||
|
|
@ -196,9 +255,9 @@ pandora.ui.homeDialog = function() {
|
|||
margin: '8px'
|
||||
}).bindEvent({
|
||||
change: function(data_) {
|
||||
var item = {id: data.id, type: data_.value};
|
||||
renderItem(item);
|
||||
renderForm(item, true);
|
||||
editItem(data.id, 'type', data_.value, function() {
|
||||
(data.type == 'custom' ? $imageInput : $nameInput).focusInput();
|
||||
});
|
||||
}
|
||||
}).appendTo($form);
|
||||
if (data.type == 'custom') {
|
||||
|
|
@ -229,6 +288,8 @@ pandora.ui.homeDialog = function() {
|
|||
} else {
|
||||
$nameInput = Ox.Input({
|
||||
autocomplete: autocompleteData[data.type],
|
||||
autocompleteReplace: true,
|
||||
autocompleteReplaceCorrect: true,
|
||||
autocompleteSelect: true,
|
||||
autocompleteSelectMaxWidth: 256,
|
||||
label: Ox._('Name'),
|
||||
|
|
@ -243,66 +304,17 @@ pandora.ui.homeDialog = function() {
|
|||
}
|
||||
}).appendTo($form);
|
||||
}
|
||||
if (focus) {
|
||||
(data.type == 'custom' ? $imageInput : $nameInput).focusInput();
|
||||
}
|
||||
}
|
||||
|
||||
function renderItem(data) {
|
||||
$item.empty();
|
||||
if (data.image) {
|
||||
var $image = $('<img>').attr({
|
||||
src: data.image
|
||||
$item.empty().append(
|
||||
pandora.renderHomeItem({
|
||||
data: data,
|
||||
editItem: editItem
|
||||
}).css({
|
||||
borderRadius: '32px',
|
||||
float: 'left',
|
||||
height: '128px',
|
||||
margin: '12px',
|
||||
width: '128px'
|
||||
}).appendTo($item)
|
||||
} else {
|
||||
var $placeholder = $('<div>').css({
|
||||
border: 'dotted 1px rgb(0, 0, 0)', // FIXME: make themes
|
||||
borderRadius: '32px',
|
||||
height: '128px',
|
||||
margin: '8px',
|
||||
width: '128px'
|
||||
}).appendTo($item);
|
||||
}
|
||||
var $container = $('<div>').css({
|
||||
margin: '10px 12px 8px 0'
|
||||
}).appendTo($item);
|
||||
var title = data.title ? (
|
||||
(
|
||||
data.type == 'custom' ? ''
|
||||
: Ox._('Featured ' + Ox.toTitleCase(data.type) + ': ')
|
||||
) + data.title
|
||||
) : '';
|
||||
$title = Ox.EditableContent({
|
||||
editable: data.type == 'custom',
|
||||
placeholder: '<span class="OxLight">' + Ox._('Title') + '</span>',
|
||||
value: title
|
||||
}).css({
|
||||
fontSize: '13px',
|
||||
fontWeight: 'bold'
|
||||
}).bindEvent({
|
||||
submit: function(data_) {
|
||||
editItem(data.id, 'title', data_.value);
|
||||
//fixme: update list
|
||||
}
|
||||
}).appendTo($container);
|
||||
$text = Ox.EditableContent({
|
||||
editable: data.type == 'custom',
|
||||
placeholder: '<span class="OxLight">' + Ox._('Text') + '</span>',
|
||||
type: 'textarea',
|
||||
value: data.text || ''
|
||||
}).css({
|
||||
margin: '0 12px 0 0'
|
||||
}).bindEvent({
|
||||
submit: function(data_) {
|
||||
editItem(data.id, 'text', data_.value);
|
||||
}
|
||||
}).appendTo($item);
|
||||
margin: '16px'
|
||||
})
|
||||
);
|
||||
}
|
||||
|
||||
function renderList(items, selected) {
|
||||
|
|
@ -329,9 +341,20 @@ pandora.ui.homeDialog = function() {
|
|||
width: 224
|
||||
},
|
||||
{
|
||||
id: 'active',
|
||||
format: function(value) {
|
||||
return value ? $('<img>').attr({
|
||||
id: 'text',
|
||||
visible: false,
|
||||
width: 0
|
||||
},
|
||||
{
|
||||
id: 'link',
|
||||
visible: false,
|
||||
width: 0
|
||||
},
|
||||
{
|
||||
id: 'complete',
|
||||
format: function(value, data) {
|
||||
console.log('##', data);
|
||||
return pandora.isCompleteHomeItem(data) ? $('<img>').attr({
|
||||
src: Ox.UI.getImageURL('symbolCheck')
|
||||
}).css({
|
||||
width: '10px',
|
||||
|
|
@ -352,8 +375,16 @@ pandora.ui.homeDialog = function() {
|
|||
})
|
||||
.bindEvent({
|
||||
select: function(data) {
|
||||
var item = Ox.getObjectById($list.options('items'), data.ids[0]),
|
||||
status = $list == $activeList ? 'active' : 'inactive';
|
||||
|
||||
if (data.ids.length) {
|
||||
var item = Ox.getObjectById(items, data.ids[0])
|
||||
(
|
||||
status == 'active' ? $inactiveList : $activeList
|
||||
).options({selected: []});
|
||||
}
|
||||
updateMenu(status, data.ids.length);
|
||||
if (item || $activeList.options('selected').length + $inactiveList.options('selected').length == 0) {
|
||||
renderItem(item);
|
||||
renderForm(item);
|
||||
}
|
||||
|
|
@ -378,6 +409,12 @@ pandora.ui.homeDialog = function() {
|
|||
return $list;
|
||||
}
|
||||
|
||||
function updateMenu(status, value) {
|
||||
(
|
||||
status == 'active' ? $activeMenu : $inactiveMenu
|
||||
)[value ? 'enableItem' : 'disableItem']('deleteitem');
|
||||
}
|
||||
|
||||
return that;
|
||||
|
||||
};
|
||||
|
|
|
|||
|
|
@ -221,18 +221,18 @@ pandora.ui.mainMenu = function() {
|
|||
getSortMenu(),
|
||||
getFindMenu(),
|
||||
{ id: 'dataMenu', title: Ox._('Data'), items: [
|
||||
{ id: 'documents', title: Ox._('Manage Documents...'), disabled: !pandora.site.capabilities.canManageDocuments[pandora.user.level] },
|
||||
{ id: 'entities', title: Ox._('Manage Entities...'), disabled: !pandora.site.entities.length || !pandora.site.capabilities.canManageEntities[pandora.user.level] },
|
||||
{},
|
||||
!Ox.isEmpty(pandora.site.capabilities.canManageHome)
|
||||
? [{ id: 'managehome', title: Ox._('Manage Home...'), disabled: !pandora.site.capabilities.canManageHome[pandora.user.level] }] : [],
|
||||
pandora.site.entities.length
|
||||
? [{ id: 'entities', title: Ox._('Manage Entities...'), disabled: !pandora.site.entities.length || !pandora.site.capabilities.canManageEntities[pandora.user.level] }] : [],
|
||||
(!Ox.isEmpty(pandora.site.capabilities.canManageHome) || pandora.site.entities.length)
|
||||
? [{}] : [],
|
||||
{ id: 'titles', title: Ox._('Manage Titles...'), disabled: !pandora.site.capabilities.canManageTitlesAndNames[pandora.user.level] },
|
||||
{ id: 'names', title: Ox._('Manage Names...'), disabled: !pandora.site.capabilities.canManageTitlesAndNames[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] },
|
||||
{},
|
||||
Ox.isEmpty(pandora.site.capabilities.canManageHome) ? [] : [
|
||||
{ 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: 'statistics', title: Ox._('Statistics...'), disabled: !pandora.site.capabilities.canManageUsers[pandora.user.level] },
|
||||
{},
|
||||
|
|
@ -609,8 +609,6 @@ pandora.ui.mainMenu = function() {
|
|||
pandora.$ui.filters.clearFilters();
|
||||
} else if (data.id == 'findsimilar') {
|
||||
pandora.$ui.similarClipsDialog = pandora.ui.similarClipsDialog().open();
|
||||
} else if (data.id == 'documents') {
|
||||
pandora.$ui.documentsDialog = pandora.ui.documentsDialog().open();
|
||||
} else if (data.id == 'entities') {
|
||||
pandora.$ui.entitiesDialog = pandora.ui.entitiesDialog().open();
|
||||
} else if (data.id == 'titles') {
|
||||
|
|
|
|||
|
|
@ -357,7 +357,10 @@ pandora.changeFolderItemStatus = function(id, status, callback) {
|
|||
pandora.api['edit' + folderItem]({
|
||||
id: id,
|
||||
status: status
|
||||
}, callback);
|
||||
}, function(result) {
|
||||
Ox.Request.clearCache('find' + folderItem);
|
||||
callback(result);
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -365,20 +368,8 @@ pandora.clickLink = function(e, selectEmbed) {
|
|||
var match = e.target.id.match(/^embed(\d+)$/);
|
||||
if (match) {
|
||||
(selectEmbed || pandora.$ui.textPanel.selectEmbed)(parseInt(match[1]));
|
||||
} else if (
|
||||
e.target.hostname == document.location.hostname
|
||||
&& !Ox.startsWith(e.target.pathname, '/static')
|
||||
&& (
|
||||
window.self == window.top
|
||||
|| pandora.isEmbeddableView(e.target.href)
|
||||
)
|
||||
) {
|
||||
if (pandora.$ui.home && e.target.pathname != '/home') {
|
||||
pandora.$ui.home.fadeOutScreen();
|
||||
}
|
||||
pandora.URL.push(e.target.pathname, true);
|
||||
} else {
|
||||
pandora.openLink(e.target.href);
|
||||
pandora.openURL(e.target.href);
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -2390,6 +2381,7 @@ pandora.hasPlacesLayer = function() {
|
|||
});
|
||||
};
|
||||
|
||||
|
||||
pandora.isClipView = function(view, item) {
|
||||
if (pandora.user.ui.section == 'items') {
|
||||
if (arguments.length == 0) {
|
||||
|
|
@ -2404,6 +2396,10 @@ pandora.isClipView = function(view, item) {
|
|||
).indexOf(view) > -1;
|
||||
};
|
||||
|
||||
pandora.isCompleteHomeItem = function(data) {
|
||||
return data.image && data.title && data.text && data.link;
|
||||
};
|
||||
|
||||
pandora.isEmbeddableView = function(url) {
|
||||
// FIXME: actually return true for embeddable views
|
||||
return false;
|
||||
|
|
@ -2504,6 +2500,26 @@ pandora.openLink = function(url) {
|
|||
}
|
||||
};
|
||||
|
||||
pandora.openURL = function(url) {
|
||||
var a = document.createElement('a');
|
||||
a.href = url;
|
||||
if (
|
||||
a.hostname == document.location.hostname
|
||||
&& !Ox.startsWith(a.pathname, '/static')
|
||||
&& (
|
||||
window.self == window.top
|
||||
|| pandora.isEmbeddableView(a.href)
|
||||
)
|
||||
) {
|
||||
pandora.URL.push(a.pathname, true);
|
||||
if (pandora.$ui.home && a.pathname != '/home') {
|
||||
pandora.$ui.home.fadeOutScreen();
|
||||
}
|
||||
} else {
|
||||
pandora.openLink(a.href);
|
||||
}
|
||||
};
|
||||
|
||||
pandora.signin = function(data) {
|
||||
// fixme: this is still voodoo
|
||||
pandora.user = Ox.extend(data.user, {
|
||||
|
|
@ -2622,6 +2638,90 @@ pandora.renameList = function(oldId, newId, newName, folder) {
|
|||
}
|
||||
};
|
||||
|
||||
pandora.renderHomeItem = function(options) {
|
||||
var data = options.data,
|
||||
editItem = options.editItem,
|
||||
isEditable = editItem && data.type == 'custom';
|
||||
|
||||
var $item = Ox.Element().addClass('OxTextPage').css({
|
||||
clear: 'both'
|
||||
});
|
||||
var $title, $text;
|
||||
if (!data) {
|
||||
return $item;
|
||||
}
|
||||
if (data.image && data.image.length) {
|
||||
var $image = Ox.Element({
|
||||
element: '<img>',
|
||||
tooltip: Ox._('View {0}', [data.title]),
|
||||
}).attr({
|
||||
src: data.image
|
||||
}).css({
|
||||
borderRadius: '32px',
|
||||
float: 'left',
|
||||
height: '128px',
|
||||
marginBottom: '16px',
|
||||
width: '128px',
|
||||
cursor: 'pointer'
|
||||
}).on({
|
||||
click: function() {
|
||||
pandora.openURL(data.link);
|
||||
}
|
||||
}).appendTo($item)
|
||||
} else {
|
||||
var $placeholder = $('<div>').css({
|
||||
border: 'dotted 1px rgb(0, 0, 0)', // FIXME: make themes
|
||||
borderRadius: '32px',
|
||||
float: 'left',
|
||||
height: '128px',
|
||||
marginBottom: '16px',
|
||||
width: '128px',
|
||||
}).appendTo($item);
|
||||
}
|
||||
var $container = $('<div>').css({
|
||||
marginLeft: '144px'
|
||||
}).appendTo($item);
|
||||
var title = data.title ? (
|
||||
(
|
||||
data.type == 'custom' ? '' : Ox._(Ox.toTitleCase(data.type) + ': ')
|
||||
) + data.title
|
||||
) : '';
|
||||
$title = Ox.EditableContent({
|
||||
editable: isEditable,
|
||||
placeholder: '<span class="OxLight">' + Ox._('Title') + '</span>',
|
||||
value: title
|
||||
}).css({
|
||||
cursor: 'pointer',
|
||||
fontSize: '13px',
|
||||
fontWeight: 'bold'
|
||||
}).bindEvent({
|
||||
anyclick: function() {
|
||||
if (!isEditable) {
|
||||
pandora.openURL(data.link);
|
||||
}
|
||||
},
|
||||
submit: function(data_) {
|
||||
editItem(data.id, 'title', data_.value);
|
||||
}
|
||||
}).appendTo($container);
|
||||
$text = Ox.EditableContent({
|
||||
clickLink: pandora.clickLink,
|
||||
editable: isEditable,
|
||||
placeholder: '<span class="OxLight">' + Ox._('Text') + '</span>',
|
||||
type: 'textarea',
|
||||
value: data.text || ''
|
||||
}).css({
|
||||
marginTop: '6px',
|
||||
paddingBottom: '16px',
|
||||
textAlign: 'justify'
|
||||
}).bindEvent({
|
||||
submit: function(data_) {
|
||||
editItem(data.id, 'text', data_.value);
|
||||
}
|
||||
}).appendTo($container);
|
||||
return $item;
|
||||
};
|
||||
|
||||
pandora.resizeFilters = function(width) {
|
||||
pandora.user.ui.filterSizes = pandora.getFilterSizes();
|
||||
pandora.$ui.browser && pandora.$ui.browser
|
||||
|
|
|
|||
Loading…
Reference in a new issue