update identify dialog

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

View File

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