src/editor/modules/nodePane/nodePane.js

   1 define([
   2 'libs/text!./template.html',
   3 'libs/jquery',
   4 'libs/underscore',
   5 'modules/nodePane/metaWidget/metaWidget',
   6 'utils/wlxml'
   7 ], function(templateSrc, $, _, metaWidget, wlxmlUtils) {
   8
   9 'use strict';
  10
  11 return function(sandbox) {
  12
  13     var view = $(_.template(templateSrc)({utils: wlxmlUtils})),
  14         listens = false,
  15         currentNode,
  16         msgs = {
  17             Tag: gettext('Tag editing'),
  18             Class: gettext('Class editing')
  19         };
  20
  21     view.on('change', 'select', function(e) {
  22         var target = $(e.target);
  23         var attr = target.attr('class').split('-')[3] === 'tagSelect' ? 'Tag' : 'Class',
  24             value = target.val().replace(/-/g, '.'),
  25             oldValue = attr === 'Tag' ? currentNode.getTagName() : currentNode.getClass();
  26         currentNode.document.transaction(function() {
  27             currentNode['set' + attr](value);
  28         }, this, msgs[attr] + ': ' + oldValue + ' -> ' + value);
  29     });
  30
  31
  32
  33     return {
  34         start: function() {
  35             sandbox.publish('ready');
  36         },
  37         getView: function() {
  38             return view;
  39         },
  40         setNodeElement: function(wlxmlNodeElement) {
  41             if(wlxmlNodeElement) {
  42                 var module = this;
  43                 if(!listens) {
  44                     wlxmlNodeElement.document.on('change', function(event) {
  45                         if(currentNode && !currentNode.isInDocument()) {
  46                             module.setNodeElement(null);
  47                         }
  48                         if(event.type === 'nodeAttrChange' && event.meta.node.sameNode(currentNode)) {
  49                             module.setNodeElement(currentNode);
  50                         }
  51                     });
  52                     listens = true;
  53                 }
  54
  55                 view.find('.rng-module-nodePane-tagSelect').attr('disabled', false).val(wlxmlNodeElement.getTagName());
  56
  57                 var escapedClassName = (wlxmlNodeElement.getClass() || '').replace(/\./g, '-');
  58                 view.find('.rng-module-nodePane-classSelect').attr('disabled', false).val(escapedClassName);
  59
  60                 var attrs = _.extend(wlxmlNodeElement.getMetaAttributes(), wlxmlNodeElement.getOtherAttributes());
  61                 var widget = metaWidget.create({attrs:attrs});
  62                 widget.on('valueChanged', function(key, value) {
  63                     wlxmlNodeElement.setMetaAttribute(key, value);
  64                     //wlxmlNodeElement.setMetaAttribute(key, value);
  65                 });
  66                 view.find('.metaFields').empty().append(widget.el);
  67             } else {
  68                 view.find('.rng-module-nodePane-tagSelect').attr('disabled', true).val('');
  69                 view.find('.rng-module-nodePane-classSelect').attr('disabled', true).val('');
  70                 view.find('.metaFields').empty();
  71             }
  72             currentNode = wlxmlNodeElement;
  73         }
  74     };
  75
  76 };
  77
  78 });