Fixing element highlighting synchronization issue
[fnpeditor.git] / modules / nodePane / nodePane.js
index a9ef9e4..b723e68 100644 (file)
@@ -1,35 +1,44 @@
-define([\r
-'libs/text!./template.html',\r
-'libs/jquery-1.9.1.min',\r
-'libs/underscore-min',\r
-\r
-], function(templateSrc, $, _) {\r
-\r
-'use strict';\r
-\r
-return function(sandbox) {\r
-    \r
-    var view = $(_.template(templateSrc)());\r
-    \r
-    view.on('change', 'select', function(e) {\r
-        var target = $(e.target);\r
-        var attr = target.attr('class').split('-')[3] === 'tagSelect' ? 'tag' : 'class';\r
-        sandbox.publish('nodeChanged', attr, target.val());\r
-    });\r
-    \r
-    return {\r
-        start: function() {\r
-            sandbox.publish('ready');\r
-        },\r
-        getView: function() {\r
-            return view;\r
-        },\r
-        setNode: function(node) {\r
-            view.find('.rng-module-nodePane-tagSelect').val(node.tag);\r
-            view.find('.rng-module-nodePane-classSelect').val(node.klass);\r
-        }\r
-    }\r
-    \r
-}\r
-\r
+define([
+'libs/text!./template.html',
+'libs/jquery-1.9.1.min',
+'libs/underscore-min',
+'modules/nodePane/metaWidget/metaWidget',
+'utils/wlxml'
+], function(templateSrc, $, _, metaWidget, wlxmlUtils) {
+
+'use strict';
+
+return function(sandbox) {
+    
+    var view = $(_.template(templateSrc)({tagNames: wlxmlUtils.wlxmlTagNames, classNames: wlxmlUtils.wlxmlClassNames}));
+    
+    view.on('change', 'select', function(e) {
+        var target = $(e.target);
+        var attr = target.attr('class').split('-')[3] === 'tagSelect' ? 'tag' : 'class';
+        sandbox.publish('nodeElementChange', attr, target.val().replace(/-/g, '.'));
+    });
+    
+    return {
+        start: function() {
+            sandbox.publish('ready');
+        },
+        getView: function() {
+            return view;
+        },
+        setNodeElement: function(nodeElement) {
+            view.find('.rng-module-nodePane-tagSelect').val(nodeElement.getWlxmlTag());
+
+            var escapedClassName = (nodeElement.getWlxmlClass() || '').replace(/\./g, '-')
+            view.find('.rng-module-nodePane-classSelect').val(escapedClassName);
+
+            var widget = metaWidget.create({attrs:nodeElement.getWlxmlMetaAttrs()});
+            widget.on('valueChanged', function(key, value) {
+                sandbox.publish('nodeElementChange', key, value);
+            });
+            view.find('.metaFields').empty().append(widget.el);
+        }
+    };
+    
+};
+
 });
\ No newline at end of file
 });
\ No newline at end of file