forked from 0x2620/pandora
196 lines
6.4 KiB
JavaScript
196 lines
6.4 KiB
JavaScript
// vim: et:ts=4:sw=4:sts=4:ft=javascript
|
|
|
|
'use strict';
|
|
|
|
pandora.ui.documentsView = function(options, self) {
|
|
|
|
var self = self || {},
|
|
that = Ox.Element({}, self)
|
|
.defaults({
|
|
id: ''
|
|
})
|
|
.options(options || {});
|
|
|
|
self.selected = null;
|
|
|
|
self.$toolbar = Ox.Bar({
|
|
size: 24
|
|
});
|
|
|
|
self.$preview = Ox.Element();
|
|
|
|
|
|
self.$documentsList = Ox.TableList({
|
|
columns: [
|
|
{
|
|
align: 'left',
|
|
id: 'index',
|
|
operator: '+',
|
|
title: Ox._('Index'),
|
|
visible: false,
|
|
width: 60
|
|
},
|
|
{
|
|
align: 'left',
|
|
id: 'id',
|
|
operator: '+',
|
|
title: Ox._('ID'),
|
|
visible: false,
|
|
width: 60
|
|
},
|
|
{
|
|
align: 'left',
|
|
id: 'user',
|
|
operator: '+',
|
|
title: Ox._('User'),
|
|
visible: false,
|
|
width: 60
|
|
},
|
|
{
|
|
align: 'left',
|
|
id: 'name',
|
|
operator: '+',
|
|
title: Ox._('Name'),
|
|
visible: true,
|
|
width: 360
|
|
},
|
|
{
|
|
id: 'extension',
|
|
operator: '+',
|
|
title: Ox._('Extension'),
|
|
visible: false,
|
|
width: 60
|
|
},
|
|
{
|
|
editable: true,
|
|
id: 'description',
|
|
operator: '+',
|
|
title: Ox._('Description'),
|
|
visible: true,
|
|
width: 240
|
|
}
|
|
],
|
|
columnsMovable: true,
|
|
columnsRemovable: true,
|
|
columnsResizable: true,
|
|
columnsVisible: true,
|
|
items: options.documents,
|
|
scrollbarVisible: true,
|
|
sort: [{key: 'index', operator: '+'}],
|
|
sortable: true,
|
|
unique: 'id'
|
|
})
|
|
.bindEvent({
|
|
add: function(data) {
|
|
pandora.$ui.documentsDialog = pandora.ui.documentsDialog({
|
|
callback: function(ids) {
|
|
if (ids) {
|
|
pandora.api.addDocument({
|
|
item: pandora.user.ui.item,
|
|
ids: ids
|
|
}, function() {
|
|
Ox.Request.clearCache();
|
|
//fixme just upload list here
|
|
//self.$documentsList.reloadList();
|
|
pandora.$ui.contentPanel.replaceElement(1,
|
|
pandora.$ui.item = pandora.ui.item());
|
|
});
|
|
}
|
|
}
|
|
}).open();
|
|
},
|
|
'delete': function(data) {
|
|
if (data.ids.length > 0 && options.editable) {
|
|
pandora.api.removeDocument({
|
|
ids: data.ids,
|
|
item: pandora.user.ui.item
|
|
}, function(result) {
|
|
Ox.Request.clearCache();
|
|
//fixme just upload list here
|
|
//self.$documentsList.reloadList();
|
|
pandora.$ui.contentPanel.replaceElement(1,
|
|
pandora.$ui.item = pandora.ui.item());
|
|
});
|
|
}
|
|
},
|
|
move: function(data) {
|
|
Ox.Request.clearCache();
|
|
pandora.api.sortDocuments({
|
|
item: pandora.user.ui.item,
|
|
ids: data.ids
|
|
})
|
|
},
|
|
select: selectDocument,
|
|
submit: function(data) {
|
|
var value = self.$documentsList.value(data.id, data.key);
|
|
if (data.value != value && !(data.value === '' && value === null)) {
|
|
self.$documentsList.value(data.id, data.key, data.value || null);
|
|
data.key == 'description' && pandora.api.editDocument({
|
|
description: data.value,
|
|
id: data.id,
|
|
item: pandora.user.ui.item
|
|
}, function(result) {
|
|
//if description is empty, fall back to global description
|
|
self.$documentsList.value(data.id, data.key, result.data.description);
|
|
renderPreview();
|
|
});
|
|
}
|
|
}
|
|
});
|
|
|
|
function renderPreview() {
|
|
var isImage = Ox.contains(['jpg', 'png'],
|
|
self.selected ? self.selected.split('.').pop() : ''),
|
|
size = {width: 256, height: 256},
|
|
src = '/documents/' + self.selected + (isImage ? '' : '.jpg');
|
|
self.$preview.empty();
|
|
self.selected && self.$preview
|
|
.append(Ox.ImageElement({
|
|
height: size.height,
|
|
src: src,
|
|
width: size.width
|
|
}))
|
|
.append(Ox.Element()
|
|
.html(self.$documentsList.value(self.selected, 'description')
|
|
));
|
|
}
|
|
function selectDocument(data) {
|
|
if (data.ids[0] != self.selected) {
|
|
self.selected = data.ids[0];
|
|
renderPreview();
|
|
}
|
|
}
|
|
|
|
that.setElement(Ox.SplitPanel({
|
|
elements: [
|
|
{
|
|
element: Ox.SplitPanel({
|
|
elements: [
|
|
{
|
|
element: self.$toolbar,
|
|
size: 24
|
|
},
|
|
{
|
|
element: self.$documentsList
|
|
},
|
|
],
|
|
orientation: 'vertical'
|
|
})
|
|
},
|
|
{
|
|
collapsible: true,
|
|
element: self.$preview,
|
|
size: 256
|
|
}
|
|
],
|
|
orientation: 'horizontal'
|
|
})
|
|
);
|
|
|
|
|
|
that.reload = function() {
|
|
self.$documentsList.reloadList();
|
|
}
|
|
return that;
|
|
|
|
};
|