0x2620/openmedialibrary
1
0
Fork 0
Code Issues 131 Pull requests Releases Wiki Activity

update identify dialog

Browse source
This commit is contained in:
rlx 2016-01-12 11:54:48 +05:30
parent d472d778cb
commit bc3aac80fa
1 changed files with 85 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

119
static/js/identifyDialog.js
View file

@ -8,7 +8,7 @@ oml.ui.identifyDialog = function(data) {
$findSelect = Ox.Select({ $findSelect = Ox.Select({
items: [ items: [
{id: 'title', title: Ox._('Title, Author etc.')}, {id: 'title', title: Ox._('Title')},
{id: 'isbn', title: Ox._('ISBN')}, {id: 'isbn', title: Ox._('ISBN')},
{id: 'id', title: Ox._('ID')} {id: 'id', title: Ox._('ID')}
], ],
@ -17,47 +17,90 @@ oml.ui.identifyDialog = function(data) {
min: 1, min: 1,
style: 'squared', style: 'squared',
value: [data.isbn ? 'isbn' : 'title'], value: [data.isbn ? 'isbn' : 'title'],
width: 128 width: 96
}) })
.bindEvent({ .bindEvent({
change: function(data) { change: function(data) {
$findInput.options({ $innerElement.replaceElement(1, $findInput[data.value]);
value: getValue(data.value) (
}).focusInput(true); data.value == 'title' ? $titleInput : $findInput[data.value]
).focusInput(true);
} }
}), }),
$findInput = Ox.Input({ $titleInput = Ox.Input({
style: 'squared', style: 'squared',
value: getValue($findSelect.value()), value: Ox.decodeHTMLEntities(data.title || ''),
width: 480 width: 224
}) })
.bindEvent({ .bindEvent({
change: function(data) {
// ...
},
submit: findMetadata submit: findMetadata
}), }),
$authorInput = Ox.Input({
style: 'squared',
value: Ox.decodeHTMLEntities((data.author || []).join('; ')),
width: 224
})
.bindEvent({
submit: findMetadata
}),
$findInput = {
title: Ox.InputGroup({
inputs: [$titleInput, $authorInput],
separators: [{
title: Ox._('Author'),
width: 96
}],
style: 'squared',
width: 544
}),
isbn: Ox.Input({
style: 'squared',
value: data.isbn,
width: 544
})
.bindEvent({
change: function(data) {
// ...
},
submit: findMetadata
}),
id: Ox.Input({
style: 'squared',
value: data.id,
width: 544
})
.bindEvent({
change: function(data) {
// ...
},
submit: findMetadata
})
},
$findButton = Ox.Button({ $findButton = Ox.Button({
overlap: 'left', overlap: 'left',
style: 'squared', style: 'squared',
title: Ox._('Find'), title: Ox._('Find'),
width: 128 width: 96
}) })
.bindEvent({ .bindEvent({
click: findMetadata click: findMetadata
}), }),
$formElement = Ox.FormElementGroup({ $innerElement = Ox.FormElementGroup({
elements: [ elements: [
Ox.FormElementGroup({ $findSelect,
elements: [ $findInput[$findSelect.value()]
$findSelect, ],
$findInput float: 'left'
], }),
float: 'left'
}), $outerElement = Ox.FormElementGroup({
elements: [
$innerElement,
$findButton $findButton
], ],
float: 'right' float: 'right'
@ -158,7 +201,7 @@ oml.ui.identifyDialog = function(data) {
$findSelect.options('items').forEach(function(item) { $findSelect.options('items').forEach(function(item) {
$findSelect.disableItem(item.id); $findSelect.disableItem(item.id);
}); });
$findInput.options({disabled: true}); $findInput[$findSelect.value()].options({disabled: true});
$findButton.options({disabled: true}); $findButton.options({disabled: true});
$updateSelect.options('items').forEach(function(item) { $updateSelect.options('items').forEach(function(item) {
$updateSelect.disableItem(item.id); $updateSelect.disableItem(item.id);
@ -170,7 +213,7 @@ oml.ui.identifyDialog = function(data) {
$findSelect.options('items').forEach(function(item) { $findSelect.options('items').forEach(function(item) {
$findSelect.enableItem(item.id); $findSelect.enableItem(item.id);
}); });
$findInput.options({disabled: false}); $findInput[$findSelect.value()].options({disabled: false});
$findButton.options({disabled: false}); $findButton.options({disabled: false});
$updateSelect.options('items').forEach(function(item) { $updateSelect.options('items').forEach(function(item) {
$updateSelect.enableItem(item.id); $updateSelect.enableItem(item.id);
@ -179,19 +222,27 @@ oml.ui.identifyDialog = function(data) {
} }
function findMetadata() { function findMetadata() {
var key = $findSelect.value();
disableButtons(); disableButtons();
$outerPanel.replaceElement(1, Ox.LoadingScreen().start()); $outerPanel.replaceElement(1, Ox.LoadingScreen().start());
oml.api.findMetadata({ oml.api.findMetadata(
key: $findSelect.value(), key == 'title' ? {
value: $findInput.value() title: $titleInput.value(),
}, function(result) { author: $authorInput.value()
var items = result.data.items.map(function(item, index) { } : key == 'isbn' ? {
return Ox.extend({index: index.toString()}, item); isbn: $findInput.isbn.value()
}); } : {
enableButtons(); id: $findInput.id.value()
$updateButton.options({disabled: !items.length}); },
$outerPanel.replaceElement(1, renderResults(items)); function(result) {
}); var items = result.data.items.map(function(item, index) {
return Ox.extend({index: index.toString()}, item);
});
enableButtons();
$updateButton.options({disabled: !items.length});
$outerPanel.replaceElement(1, renderResults(items));
}
);
} }
function getValue(key) { function getValue(key) {
@ -199,7 +250,7 @@ oml.ui.identifyDialog = function(data) {
[data.title || ''].concat(data.author || []).join(' ') [data.title || ''].concat(data.author || []).join(' ')
) )
: key == 'isbn' ? (data.isbn || '') : key == 'isbn' ? (data.isbn || '')
: data.id : data.id;
} }
function renderResult() { function renderResult() {