canvas api: wrapElements
[fnpeditor.git] / modules / metadataEditor / metadataEditor.js
index 5c3e4fc..63b2404 100644 (file)
-define([\r
-'libs/jquery-1.9.1.min',\r
-'libs/underscore-min',\r
-'./transformations',\r
-'libs/text!./templates/main.html',\r
-'libs/text!./templates/item.html'\r
-], function($, _, transformations, mainTemplate, itemTemplate) {\r
-\r
-'use strict';\r
-\r
-return function(sandbox) {\r
-\r
-    \r
-    var view = {\r
-        node: $(_.template(mainTemplate)()),\r
-        setup: function() {\r
-            var metaTable = this.metaTable = this.node.find('table');\r
-            \r
-            this.node.find('.rng-module-metadataEditor-addBtn').click(function() {\r
-                var newRow = view._addMetaRow('', '');\r
-                $(newRow.find('td div')[0]).focus();\r
-                //isDirty = true;\r
-            });\r
-            \r
-            this.metaTable.on('click', '.rng-visualEditor-metaRemoveBtn', function(e) {\r
-                $(e.target).closest('tr').remove();\r
-                //isDirty = true;\r
-            });\r
-            \r
-            this.metaTable.on('keydown', '[contenteditable]', function(e) {\r
-                console.log(e.which);\r
-                if(e.which === 13) { \r
-                    if($(document.activeElement).hasClass('rng-module-metadataEditor-metaItemKey')) {\r
-                        metaTable.find('.rng-module-metadataEditor-metaItemValue').focus();\r
-                    } else {\r
-                        var input = $('<input>');\r
-                        input.appendTo('body').focus()\r
-                        view.node.find('.rng-module-metadataEditor-addBtn').focus();\r
-                        input.remove();\r
-                    }\r
-                    e.preventDefault();\r
-                }\r
-                \r
-            });\r
-        },\r
-        getMetaData: function() {\r
-            var toret = {};\r
-            this.node.find('tr').each(function() {\r
-                var tr = $(this);\r
-                var inputs = $(this).find('td [contenteditable]');\r
-                var key = $(inputs[0]).text();\r
-                var value = $(inputs[1]).text();\r
-                toret[key] = value;\r
-            });\r
-            return toret;\r
-        },\r
-        setMetadata: function(metadata) {\r
-            var view = this;\r
-            this.metaTable.find('tr').remove();\r
-            _.each(_.keys(metadata), function(key) {    \r
-                view._addMetaRow(key, metadata[key]);\r
-            });\r
-        },\r
-        _addMetaRow: function(key, value) {\r
-            var newRow = $(_.template(itemTemplate)({key: key || '', value: value || ''}));\r
-            newRow.appendTo(this.metaTable);\r
-            return newRow;\r
-        }\r
-    }\r
-    \r
-    view.setup();\r
-    \r
-    return {\r
-        start: function() {\r
-            sandbox.publish('ready');\r
-        },\r
-        setMetadata: function(xml) {\r
-            view.setMetadata(transformations.getMetadata(xml));\r
-        },\r
-        getMetadata: function() {\r
-            return view.getMetadata();\r
-        },\r
-        getView: function() {\r
-            return view.node;\r
-        }\r
-        \r
-    };\r
-}\r
-\r
+define([
+'libs/jquery-1.9.1.min',
+'libs/underscore-min',
+'./transformations',
+'libs/text!./templates/main.html',
+'libs/text!./templates/item.html'
+], function($, _, transformations, mainTemplate, itemTemplate) {
+
+'use strict';
+
+return function(sandbox) {
+
+    
+    var view = {
+        node: $(_.template(mainTemplate)()),
+        setup: function() {
+            var view = this;
+            var metaTable = this.metaTable = this.node.find('table');
+            
+            this.node.find('.rng-module-metadataEditor-addBtn').click(function() {
+                var newRow = view._addMetaRow('', '');
+                $(newRow.find('td div')[0]).focus();
+                sandbox.publish('metadataChanged', view.getMetadata());
+            });
+            
+            this.metaTable.on('click', '.rng-visualEditor-metaRemoveBtn', function(e) {
+                $(e.target).closest('tr').remove();
+                sandbox.publish('metadataChanged', view.getMetadata());
+            });
+            
+            this.metaTable.on('keydown', '[contenteditable]', function(e) {
+                console.log(e.which);
+                if(e.which === 13) { 
+                    if($(document.activeElement).hasClass('rng-module-metadataEditor-metaItemKey')) {
+                        metaTable.find('.rng-module-metadataEditor-metaItemValue').focus();
+                    } else {
+                        var input = $('<input>');
+                        input.appendTo('body').focus();
+                        view.node.find('.rng-module-metadataEditor-addBtn').focus();
+                        input.remove();
+                    }
+                    e.preventDefault();
+                }
+            });
+            
+            
+            var onKeyUp = function(e) {
+                if(e.which !== 13)
+                    sandbox.publish('metadataChanged', view.getMetadata());
+            };
+            this.metaTable.on('keyup', '[contenteditable]', _.throttle(onKeyUp, 500));
+        },
+        getMetadata: function() {
+            var toret = {};
+            this.node.find('tr').each(function() {
+                var tr = $(this);
+                var inputs = $(this).find('td [contenteditable]');
+                var key = $(inputs[0]).text();
+                var value = $(inputs[1]).text();
+                toret[key] = value;
+            });
+            return toret;
+        },
+        setMetadata: function(metadata) {
+            var view = this;
+            this.metaTable.find('tr').remove();
+            _.each(_.keys(metadata), function(key) {    
+                view._addMetaRow(key, metadata[key]);
+            });
+        },
+        _addMetaRow: function(key, value) {
+            var newRow = $(_.template(itemTemplate)({key: key || '', value: value || ''}));
+            newRow.appendTo(this.metaTable);
+            return newRow;
+        }
+    };
+    
+    view.setup();
+    
+    return {
+        start: function() {
+            sandbox.publish('ready');
+        },
+        setDocument: function(xml) {
+            view.setMetadata(transformations.getMetadata(xml));
+            sandbox.publish('metadataSet');
+        },
+        getMetadata: function() {
+            return transformations.getXML(view.getMetadata());
+        },
+        getView: function() {
+            return view.node;
+        },
+        attachMetadata: function(document) {
+            var toret = $('<div>');
+            toret.append($(document));
+            var meta = $('<metadata></metadata>\n').append(transformations.getXML(view.getMetadata()));
+            
+            var metadata = toret.find('metadata');
+            if(metadata.length === 0) {
+                var section = toret.find('section');
+                section = section.length ? $(section[0]) : null;
+                if(section) {
+                    section.prepend(meta);
+                }
+            } else {
+                metadata.replaceWith(meta);
+            }
+            return toret.html();
+        }
+        
+    };
+};
+
 });
\ No newline at end of file