4 'libs/text!./templates/main.html',
5 'libs/text!./templates/item.html',
6 'views/openSelect/openSelect',
7 'views/attachments/attachments'
8 ], function($, _, mainTemplate, itemTemplate, OpenSelectView, attachments) {
14 var View = function(node, metadataConfig) {
16 this.metadataConfig = metadataConfig;
17 this.dom = $(_.template(mainTemplate)());
20 var metaTable = this.metaTable = this.dom.find('table');
22 this.dom.find('.rng-module-metadataEditor-addBtn').click(function() {
24 this.node.document.transaction(function() {
25 this.node.getMetadata().add('','');
28 description: gettext('Add metadata row')
33 this.metaTable.on('click', '.rng-visualEditor-metaRemoveBtn', function(e) {
34 this.node.document.transaction(function() {
35 $(e.target).closest('tr').data('row').remove();
38 description: gettext('Remove metadata row')
43 this.metaTable.on('keydown', '[contenteditable]', function(e) {
44 /* globals document */
46 if($(document.activeElement).hasClass('rng-module-metadataEditor-metaItemKey')) {
47 metaTable.find('.rng-module-metadataEditor-metaItemValue').focus();
49 var input = $('<input>');
50 input.appendTo('body').focus();
51 this.dom.find('.rng-module-metadataEditor-addBtn').focus();
58 this.metaTable.on('keyup', '[contenteditable]', _.throttle(function(e) {
60 var editable = $(e.target),
61 toSet = editable.text(),
62 row = editable.parents('tr').data('row'),
63 isKey = _.last(editable.attr('class').split('-')) === 'metaItemKey',
64 method = isKey ? 'setKey' : 'setValue';
65 row.metadata.node.document.transaction(function() {
69 description: gettext('Metadata edit')
75 this.setMetadata(this.node); //
77 this.node.document.on('change', this.handleEvent, this);
80 _.extend(View.prototype, {
82 this.node.document.off('change', this.handleEvent);
84 handleEvent: function(event) {
85 if(event.type === 'metadataAdded' && event.meta.node.sameNode(this.node)) {
86 this.addMetadataRow(event.meta.row);
88 if(event.type === 'metadataChanged' && event.meta.node.sameNode(this.node)) {
89 this.updateMetadataRow(event.meta.row);
91 if(event.type === 'metadataRemoved' && event.meta.node.sameNode(this.node)) {
92 this.removeMetadataRow(event.meta.row);
94 if(event.type === 'nodeDetached' && event.meta.node.containsNode(this.node)) {
95 this.setMetadata(null);
98 getValuesForKey: function(key) {
100 this.metadataConfig.some(function(configRow) {
101 if(configRow.key === key) {
102 toret = configRow.values || [];
108 getIsFileForKey: function(key) {
110 this.metadataConfig.some(function(configRow) {
111 if (configRow.key == key) {
112 toret = configRow.isFile || false;
118 setMetadata: function(node) {
119 this.dom.find('.rng-module-metadataEditor-addBtn').attr('disabled', !node);
121 this.metaTable.html('');
125 metadata = node.getMetadata();
126 this.metaTable.find('tr').remove();
127 metadata.forEach(function(row) {
128 view.addMetadataRow(row);
131 getMetadataByKey: function (key) {
133 this.node.getMetadata().some(function (row) {
134 if (row.key == 'relation.coverimage.url') {
141 addMetadataRow: function(row) {
143 var newRow = $(_.template(itemTemplate)({key: row.getKey() || '', value: row.getValue() || ''}));
144 newRow.appendTo(this.metaTable);
145 newRow.data('row', row);
147 var keySelectView = new OpenSelectView({
148 value: row.getKey() || '',
149 inputTemplate: _.template('<div class="openInput rng-module-metadataEditor-metaItemKey" contentEditable="true"><%= value %></div>')({value: row.getKey() || '' }),
150 setInput: function(inputDOM, value) {
151 if(inputDOM.text() !== value) {
152 inputDOM.text(value);
155 valueSelectView.clearItems();
156 this.getValuesForKey(value).forEach(function(value) {
157 valueSelectView.addItem(value);
162 newRow.find('td:first').append(keySelectView.el).data('view', keySelectView);
165 var valueSelectView = new OpenSelectView({
166 value: row.getValue(),
167 inputTemplate: _.template('<div class="openInput rng-module-metadataEditor-metaItemValue" contentEditable="true"><%= value %></div>')({value: row.getValue() || '' }),
170 setInput: function(inputDOM, value) {
171 if(inputDOM.text() !== value) {
172 inputDOM.text(value);
177 newRow.find('td:nth-child(2)').append(valueSelectView.el).data('view', valueSelectView);
179 if (this.getIsFileForKey(row.getKey())) {
180 var el = $("<a href='#-' class='attachment-library' style='float: right'>" + gettext('attachments') + "</a>");
181 el.on('click', function() {
182 attachments.select(function(v) {
183 valueSelectView.setInput(v);
187 newRow.find('td:nth-child(2)').append(el);
191 this.metadataConfig.forEach(function(configRow) {
192 keySelectView.addItem(configRow.key);
193 if(row.getKey() === configRow.key) {
194 (configRow.values || []).forEach(function(value) {
195 valueSelectView.addItem(value);
201 $(newRow.find('td div')[0]).focus();
206 updateMetadataRow: function(row) {
207 this._getRowTr(row, function(tr) {
208 var tds = tr.find('td'),
212 keyTd.data('view').setInput(row.getKey());
213 valueTd.data('view').setInput(row.getValue());
216 removeMetadataRow: function(row) {
217 this._getRowTr(row, function(tr) {
221 _getRowTr: function(row, callback) {
222 this.metaTable.find('tr').each(function() {
224 if(tr.data('row') === row) {