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