0x2620/pandora
2
1
Fork 1
Code Issues 1.3k Pull requests Releases Wiki Activity

use Ox.EditableContent for info in documents item view

Browse source
This commit is contained in:
j 2014-01-16 14:12:51 +00:00
parent fdbd17fdc1
commit f52daaacbd
1 changed files with 160 additions and 105 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

103
static/js/documentsPanel.js
View file

@ -310,7 +310,7 @@ pandora.ui.documentsPanel = function(options) {
$preview,
$form,
$data,
$itemStatusbar = Ox.Bar({size: 16})
.css({textAlign: 'center'}),
@ -492,13 +492,74 @@ pandora.ui.documentsPanel = function(options) {
});
}
function renderForm() {
var item = $list.value($list.options('selected')[0]),
function renderData() {
var $title, $description,
item = $list.value($list.options('selected')[0]),
editable = item.user == pandora.user.username
|| pandora.site.capabilities.canEditDocuments[pandora.user.level],
inputWidth = ui.documentSize - 16 - Ox.UI.SCROLLBAR_SIZE,
labelWidth = 80;
return Ox.Form({
labelWidth = 80,
width = ui.documentSize - 16 - Ox.UI.SCROLLBAR_SIZE;
return isItemView
? Ox.Element()
.append(
Ox.$('<div>').css({height: '16px'})
)
.append(
$title = Ox.EditableContent({
editable: false,
value: item.name,
width: width
})
.css({
margin: '0 4px',
textAlign: 'center',
fontWeight: 'bold'
})
.bindEvent({
edit: function() {
$title.options({
width: that.width()
});
},
submit: function() {
// ...
}
})
)
.append(
Ox.$('<div>').css({height: '8px'})
)
.append(
$description = Ox.EditableContent({
format: function(value) {
return '<div class="OxLight" style="text-align: center">'
+ value + '</div>';
},
height: width,
placeholder: 'No description',
type: 'textarea',
value: item.description || '',
width: width
})
.css({
marginLeft: '8px',
textAlign: 'center'
})
.bindEvent({
submit: function(data) {
pandora.api.editDocument({
description: data.value,
id: item.id,
item: ui.item,
}, function(result) {
$description.options({value: result.data.description});
Ox.Request.clearCache('findDocuments');
$list.reloadList();
});
}
})
)
: Ox.Form({
items: [
Ox.Input({
disabled: !editable,
@ -506,7 +567,7 @@ pandora.ui.documentsPanel = function(options) {
label: Ox._('Name'),
labelWidth: labelWidth,
value: item.name,
width: inputWidth
width: width
}),
Ox.Input({
disabled: true,
@ -514,7 +575,7 @@ pandora.ui.documentsPanel = function(options) {
label: Ox._('Extension'),
labelWidth: labelWidth,
value: item.extension,
width: inputWidth
width: width
}),
Ox.Input({
disabled: true,
@ -524,7 +585,7 @@ pandora.ui.documentsPanel = function(options) {
value: Ox.isArray(item.dimensions)
? Ox.formatDimensions(item.dimensions, 'px')
: Ox.formatCount(item.dimensions, 'page'),
width: inputWidth
width: width
}),
Ox.Input({
disabled: true,
@ -532,7 +593,7 @@ pandora.ui.documentsPanel = function(options) {
label: Ox._('Size'),
labelWidth: labelWidth,
value: Ox.formatValue(item.size, 'B'),
width: inputWidth
width: width
}),
Ox.Input({
disabled: true,
@ -540,7 +601,7 @@ pandora.ui.documentsPanel = function(options) {
label: Ox._('Matches'),
labelWidth: labelWidth,
value: item.matches,
width: inputWidth
width: width
}),
Ox.Input({
disabled: true,
@ -548,7 +609,7 @@ pandora.ui.documentsPanel = function(options) {
label: Ox._('Username'),
labelWidth: labelWidth,
value: item.user,
width: inputWidth
width: width
}),
Ox.Input({
disabled: !editable,
@ -556,7 +617,7 @@ pandora.ui.documentsPanel = function(options) {
label: Ox._('Type'),
labelWidth: labelWidth,
value: item.type,
width: inputWidth
width: width
}),
Ox.Input({
disabled: !editable,
@ -565,7 +626,7 @@ pandora.ui.documentsPanel = function(options) {
placeholder: Ox._('Description'),
type: 'textarea',
value: item.description,
width: inputWidth
width: width
})
],
width: 240
@ -678,14 +739,6 @@ pandora.ui.documentsPanel = function(options) {
})
.on({
click: openDocuments
// FIXME
/*
var item = $list.value(selected);
window.open(
'/documents/' + selected + '/' + item.name + '.' + item.extension,
'_blank'
);
*/
});
}
@ -698,10 +751,12 @@ pandora.ui.documentsPanel = function(options) {
}).css({
margin: size.margin
});
$form && $form.options('items').forEach(function($item) {
if (!isItemView && $data) {
$data.options('items').forEach(function($item) {
$item.options({width: width});
});
}
}
function selectDocuments() {
var selected = ui.documentsSelection[isItemView ? ui.item : ''] || [],
@ -733,7 +788,7 @@ pandora.ui.documentsPanel = function(options) {
$item.empty();
if (selected.length) {
$preview = renderPreview().appendTo($item);
$form = renderForm().appendTo($item);
$data = renderData().appendTo($item);
}
$itemStatus.html(
selected.length