'use strict'; oml.ui.identifyDialog = function(data) { var ui = oml.user.ui, $form = Ox.Element(), $select = Ox.Select({ items: [ {id: 'title', title: Ox._('Title, Author etc.')}, {id: 'isbn', title: Ox._('ISBN')}, {id: 'id', title: Ox._('ID')} ], overlap: 'right', max: 1, min: 1, style: 'squared', value: [data.isbn ? 'isbn' : 'title'], width: 128 }) .bindEvent({ change: function(data) { $input.options({ value: getValue(data.value) }).focusInput(true); } }), $input = Ox.Input({ style: 'squared', value: getValue($select.value()), width: 480 }) .bindEvent({ change: function(data) { // ... }, submit: findMetadata }), $button = Ox.Button({ overlap: 'left', style: 'squared', title: Ox._('Find'), width: 128 }) .bindEvent({ click: findMetadata }), $formElement = Ox.FormElementGroup({ elements: [ Ox.FormElementGroup({ elements: [ $select, $input ], float: 'left' }), $button ], float: 'right' }) .css({margin: '16px'}) .appendTo($form), $list, $outerPanel = Ox.SplitPanel({ elements: [ {element: $form, size: 48}, {element: renderResults([])} ], orientation: 'vertical' }), $dontUpdateButton = Ox.Button({ id: 'dontupdate', style: 'squared', title: Ox._('No, Don\'t Update') }) .bindEvent({ click: function() { that.close(); } }), $updateButton = Ox.Button({ disabled: true, id: 'update', style: 'squared', title: Ox._('Yes, Update') }) .bindEvent({ click: function() { // FIXME: Wrong if user messes with lookup elements before clicking update button var primaryId; if (selected == 'lookup') { primaryId = [ $lookupSelect.value(), $lookupInput.value() ]; } else { primaryId = $list.value( $list.options('selected')[0], 'primaryid' ); } that.options({content: Ox.LoadingScreen().start()}); that.disableButtons(); oml.api.edit({ id: data.id, primaryid: primaryId }, function(result) { ( $metadataSelect.value() == 'original' ? oml.api.resetMetadata : Ox.noop )({id: ui.item}, function(result) { Ox.Request.clearCache('find'); oml.$ui.info.updateElement(); oml.$ui.browser.reloadList(true); oml.$ui.list.reloadList(true); Ox.Request.clearCache(data.id); oml.$ui.infoView.updateElement(data.id); that.close(); }); }); } }), that = Ox.Dialog({ buttons: [ $dontUpdateButton, $updateButton ], closeButton: true, content: $outerPanel, fixedSize: true, height: 384, removeOnClose: true, title: Ox._('Identify Book'), width: 768 }); function disableButtons() { $select.options('items').forEach(function(item) { $select.disableItem(item.id); }); $input.options({disabled: true}); $button.options({disabled: true}); $updateButton.options({disabled: true}); } function enableButtons() { $select.options('items').forEach(function(item) { $select.enableItem(item.id); }); $input.options({disabled: false}); $button.options({disabled: false}); $updateButton.options({disabled: false}); } function findMetadata() { disableButtons(); $outerPanel.replaceElement(1, Ox.LoadingScreen().start()); oml.api.findMetadata({ key: $select.value(), value: $input.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) { return key == 'title' ? Ox.decodeHTMLEntities( [data.title || ''].concat(data.author || []).join(' ') ) : key == 'isbn' ? (data.isbn || '') : data.id } function renderResults(items) { var $innerPanel; if (items.length) { $list = Ox.TableList({ columns: [{ format: function(value, data) { return '' + data.title + ' ' + data.author }, id: 'index', visible: true, width: 192 - Ox.UI.SCROLLBAR_SIZE }], items: items, keys: [ 'cover', 'title', 'author', 'publisher', 'place', 'date', 'series', 'edition', 'language', 'pages', 'categories', 'isbn', 'description', 'tableofcontents' ], min: 1, max: 1, scrollbarVisible: true, selected: ['0'], sort: [{key: 'index', operator: '+'}], unique: 'index' }) .bindEvent({ select: function(data) { var index = data.ids[0]; $innerPanel.replaceElement(1, oml.ui.infoView($list.value(index))); } }), $innerPanel = Ox.SplitPanel({ elements: [ {element: $list || Ox.Element(), size: 192}, {element: Ox.Element()} ], orientation: 'horizontal' }); setTimeout(function() { $list.triggerEvent('select', {ids: ['0']}); }); } else { $list = null; $innerPanel = Ox.Element(); } return $innerPanel; } return that; };