0c8a816ef3e6e3c433ce85a36f3d2e8028320e09
[fnpeditor.git] / src / editor / modules / metadataEditor / metadataEditor.js
1 define([
2 'libs/jquery',
3 'libs/underscore',
4 './transformations',
5 'libs/text!./templates/main.html',
6 'libs/text!./templates/item.html'
7 ], function($, _, transformations, mainTemplate, itemTemplate) {
8
9 'use strict';
10
11 return function(sandbox) {
12
13     
14     var view = {
15         node: $(_.template(mainTemplate)()),
16         setup: function() {
17             var view = this;
18             var metaTable = this.metaTable = this.node.find('table');
19             
20             this.node.find('.rng-module-metadataEditor-addBtn').click(function() {
21                 var newRow = view._addMetaRow('', '');
22                 $(newRow.find('td div')[0]).focus();
23                 sandbox.publish('metadataChanged', view.getMetadata());
24             });
25             
26             this.metaTable.on('click', '.rng-visualEditor-metaRemoveBtn', function(e) {
27                 $(e.target).closest('tr').remove();
28                 sandbox.publish('metadataChanged', view.getMetadata());
29             });
30             
31             this.metaTable.on('keydown', '[contenteditable]', function(e) {
32                 if(e.which === 13) {
33                     if($(document.activeElement).hasClass('rng-module-metadataEditor-metaItemKey')) {
34                         metaTable.find('.rng-module-metadataEditor-metaItemValue').focus();
35                     } else {
36                         var input = $('<input>');
37                         input.appendTo('body').focus();
38                         view.node.find('.rng-module-metadataEditor-addBtn').focus();
39                         input.remove();
40                     }
41                     e.preventDefault();
42                 }
43             });
44             
45             
46             var onKeyUp = function(e) {
47                 if(e.which !== 13) {
48                     sandbox.publish('metadataChanged', view.getMetadata());
49                 }
50             };
51             this.metaTable.on('keyup', '[contenteditable]', _.throttle(onKeyUp, 500));
52         },
53         getMetadata: function() {
54             var toret = {};
55             this.node.find('tr').each(function() {
56                 var inputs = $(this).find('td [contenteditable]');
57                 var key = $(inputs[0]).text();
58                 var value = $(inputs[1]).text();
59                 toret[key] = value;
60             });
61             return toret;
62         },
63         setMetadata: function(metadata) {
64             var view = this;
65             this.metaTable.find('tr').remove();
66             _.each(_.keys(metadata), function(key) {
67                 view._addMetaRow(key, metadata[key]);
68             });
69         },
70         _addMetaRow: function(key, value) {
71             var newRow = $(_.template(itemTemplate)({key: key || '', value: value || ''}));
72             newRow.appendTo(this.metaTable);
73             return newRow;
74         }
75     };
76     
77     view.setup();
78     
79     return {
80         start: function() {
81             sandbox.publish('ready');
82         },
83         setDocument: function(xml) {
84             view.setMetadata(transformations.getMetadata(xml));
85             sandbox.publish('metadataSet');
86         },
87         getMetadata: function() {
88             return transformations.getXML(view.getMetadata());
89         },
90         getView: function() {
91             return view.node;
92         },
93         attachMetadata: function(document) {
94             var toret = $('<div>');
95             toret.append($(document));
96             var meta = $('<metadata></metadata>\n').append(transformations.getXML(view.getMetadata()));
97             
98             var metadata = toret.find('metadata');
99             if(metadata.length === 0) {
100                 var section = toret.find('section');
101                 section = section.length ? $(section[0]) : null;
102                 if(section) {
103                     section.prepend(meta);
104                 }
105             } else {
106                 metadata.replaceWith(meta);
107             }
108             return toret.html();
109         }
110         
111     };
112 };
113
114 });