fnpjs: datetime

[fnpeditor.git] / src / editor / modules / metadataEditor / metadataEditor.js

diff --git a/src/editor/modules/metadataEditor/metadataEditor.js b/src/editor/modules/metadataEditor/metadataEditor.js
index 48b10eb..502c16a 100644 (file)
--- a/src/editor/modules/metadataEditor/metadataEditor.js
+++ b/src/editor/modules/metadataEditor/metadataEditor.js
@@ -2,15 +2,19 @@ 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,
+        metadataKeys = (sandbox.getConfig().metadataKeys || [
+            'author', 'creator', 'date'
+        ]).sort();
     
     var view = {
         node: $(_.template(mainTemplate)()),
@@ -42,28 +46,24 @@ return function(sandbox) {
                 }
             });
             
-            
-            var onKeyUp = function(e) {
+            this.metaTable.on('keyup', '[contenteditable]', _.throttle(function(e) {
                 if(e.which !== 13) {
                     var editable = $(e.target),
-                        //myIndex = metaTable.find('.'+editable.attr('class')).index(editable),
-                        isKey = _.last(editable.attr('class').split('-')) === 'metaItemKey';
-                    //toSet[isKey ? 'key' : 'value'] = editable.text();
-                    //currentNode.setMetadataRow(myIndex, toSet);
-
-                    var row = editable.parents('tr').data('row'),
-                        toSet = editable.text();
-                    if(isKey) {
-                        row.setKey(toSet);
-                    } else {
-                        row.setValue(toSet);
-                    }
-
+                        toSet = editable.text(),
+                        row = editable.parents('tr').data('row'),
+                        isKey = _.last(editable.attr('class').split('-')) === 'metaItemKey',
+                        method = isKey ? 'setKey' : 'setValue';
+                    row[method](toSet);
                 }
-            };
-            this.metaTable.on('keyup', '[contenteditable]', _.throttle(onKeyUp, 500));
+            }, 500));
+        },
+        clear: function() {
         },
         setMetadata: function(node) {
+            if(!node) {
+                this.metaTable.html('');
+                return;
+            }
             var view = this,
                 metadata = node.getMetadata();
             this.metaTable.find('tr').remove();
@@ -75,6 +75,20 @@ return function(sandbox) {
             var newRow = $(_.template(itemTemplate)({key: row.getKey() || '', value: row.getValue() || ''}));
             newRow.appendTo(this.metaTable);
             newRow.data('row', row);
+
+            var selectView = new OpenSelectView({
+                value: row.getKey() || '',
+                inputTemplate: _.template('<div class="openInput rng-module-metadataEditor-metaItemKey" contentEditable="true"><%= value %></div>')({value: row.getKey() || '' }),
+                setInput: function(inputDOM, value) {
+                    inputDOM.text(value);
+                    row.setKey(value);
+                }
+            });
+            newRow.find('td:first').append(selectView.el);
+            metadataKeys.forEach(function(key) {
+                selectView.addItem(key);
+            });
+
             if(adding) {
                 $(newRow.find('td div')[0]).focus();
                 adding = false;
@@ -82,28 +96,30 @@ return function(sandbox) {
             return newRow;
         },
         updateMetadataRow: function(row) {
-            this.metaTable.find('tr').each(function() {
-                var tr = $(this),
-                    tds, keyTd, valueTd;
-                if(tr.data('row') === row) {
-                    tds = tr.find('td');
-                    keyTd = $(tds[0]);
+            this._getRowTr(row, function(tr) {
+                var tds = tr.find('td [contenteditable]'),
+                    keyTd = $(tds[0]),
                     valueTd = $(tds[1]);
 
-                    if(keyTd.text() !== row.getKey()) {
-                        keyTd.text(row.getKey());
-                    }
-                    if(valueTd.text() !== row.getValue()) {
-                        valueTd.text(row.getValue());
-                    }
+                if(keyTd.text() !== row.getKey()) {
+                    keyTd.text(row.getKey());
+                }
+                if(valueTd.text() !== row.getValue()) {
+                    valueTd.text(row.getValue());
                 }
             });
         },
         removeMetadataRow: function(row) {
+            this._getRowTr(row, function(tr) {
+                tr.remove();
+            });
+        },
+        _getRowTr: function(row, callback) {
             this.metaTable.find('tr').each(function() {
                 var tr = $(this);
                 if(tr.data('row') === row) {
-                    tr.remove();
+                    callback(tr);
+                    return false;
                 }
             });
         }
@@ -126,6 +142,9 @@ return function(sandbox) {
                 if(event.type === 'metadataRemoved' && event.meta.node.sameNode(currentNode)) {
                     view.removeMetadataRow(event.meta.row);
                 }
+                if(event.type === 'nodeDetached' && event.meta.node.sameNode(currentNode)) {
+                    view.setMetadata(null);
+                }
             });
         },
         setNodeElement: function(node) {