update identify dialog
This commit is contained in:
parent
d472d778cb
commit
bc3aac80fa
1 changed files with 85 additions and 34 deletions
|
@ -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() {
|
||||
|
|
Loading…
Reference in a new issue