X-Git-Url: https://git.mdrn.pl/fnpeditor.git/blobdiff_plain/8f902359087a5d4d19792c621c5a1b8f5755f2d8..9da83a0cb059fa87e0e443b8518f258241fb0eb6:/src/editor/modules/metadataEditor/metadataEditor.js diff --git a/src/editor/modules/metadataEditor/metadataEditor.js b/src/editor/modules/metadataEditor/metadataEditor.js index ec64455..118571e 100644 --- a/src/editor/modules/metadataEditor/metadataEditor.js +++ b/src/editor/modules/metadataEditor/metadataEditor.js @@ -2,15 +2,36 @@ define([ 'libs/jquery', 'libs/underscore', 'libs/text!./templates/main.html', -'libs/text!./templates/item.html' -], function($, _, mainTemplate, itemTemplate) { +'libs/text!./templates/item.html', +'views/openSelect/openSelect' +], function($, _, mainTemplate, itemTemplate, OpenSelectView) { 'use strict'; return function(sandbox) { var currentNode, - adding = false; + adding = false, + metadataConfig = (sandbox.getConfig().metadata || []).sort(function(configRow1, configRow2) { + if(configRow1.key < configRow2.key) { + return -1; + } + if(configRow1.key > configRow2.key) { + return 1; + } + return 0; + }); + + var getValuesForKey = function(key) { + var toret = []; + metadataConfig.some(function(configRow) { + if(configRow.key === key) { + toret = configRow.values || []; + return true; + } + }); + return toret; + }; var view = { node: $(_.template(mainTemplate)()), @@ -71,6 +92,48 @@ return function(sandbox) { var newRow = $(_.template(itemTemplate)({key: row.getKey() || '', value: row.getValue() || ''})); newRow.appendTo(this.metaTable); newRow.data('row', row); + + var keySelectView = new OpenSelectView({ + value: row.getKey() || '', + inputTemplate: _.template('
<%= value %>
')({value: row.getKey() || '' }), + setInput: function(inputDOM, value) { + if(inputDOM.text() !== value) { + inputDOM.text(value); + row.setKey(value); + } + valueSelectView.clearItems(); + getValuesForKey(value).forEach(function(value) { + valueSelectView.addItem(value); + }); + } + }); + newRow.find('td:first').append(keySelectView.el).data('view', keySelectView); + + + var valueSelectView = new OpenSelectView({ + value: row.getValue(), + inputTemplate: _.template('
<%= value %>
')({value: row.getValue() || '' }), + maxHeight: '300px', + maxWidth: '100px', + setInput: function(inputDOM, value) { + if(inputDOM.text() !== value) { + inputDOM.text(value); + row.setValue(value); + } + } + }); + newRow.find('td:nth-child(2)').append(valueSelectView.el).data('view', valueSelectView); + + + metadataConfig.forEach(function(configRow) { + keySelectView.addItem(configRow.key); + if(row.getKey() === configRow.key) { + (configRow.values || []).forEach(function(value) { + valueSelectView.addItem(value); + }); + } + }); + if(adding) { $(newRow.find('td div')[0]).focus(); adding = false; @@ -79,16 +142,12 @@ return function(sandbox) { }, updateMetadataRow: function(row) { this._getRowTr(row, function(tr) { - var tds = tr.find('td > div'), + var tds = tr.find('td'), keyTd = $(tds[0]), valueTd = $(tds[1]); - if(keyTd.text() !== row.getKey()) { - keyTd.text(row.getKey()); - } - if(valueTd.text() !== row.getValue()) { - valueTd.text(row.getValue()); - } + keyTd.data('view').setInput(row.getKey()); + valueTd.data('view').setInput(row.getValue()); }); }, removeMetadataRow: function(row) {