src/editor/modules/documentCanvas/canvas/wlxmlManagers.js

   1 define([
   2 'libs/jquery',
   3 'modules/documentCanvas/canvas/widgets'
   4 ], function($, widgets) {
   5
   6 'use strict';
   7
   8
   9 var DocumentElementWrapper = function(documentElement) {
  10
  11     this.documentElement = documentElement;
  12
  13     this.addWidget = function(widget) {
  14         documentElement.dom().children('.canvas-widgets').append(widget.DOM ? widget.DOM : widget);
  15     };
  16
  17     this.clearWidgets = function() {
  18         documentElement.dom().children('.canvas-widgets').empty();
  19     };
  20
  21     this.setDisplayStyle = function(displayStyle) {
  22         documentElement.dom().css('display', displayStyle || '');
  23         documentElement._container().css('display', displayStyle || '');
  24     };
  25
  26     this.tag = function() {
  27         return documentElement.getWlxmlTag();
  28     };
  29
  30     this.klass = function() {
  31         return documentElement.getWlxmlClass();
  32     };
  33
  34     this.toggle = function(toggle) {
  35         documentElement._container().toggle(toggle);
  36     };
  37
  38     var eventBus = documentElement.canvas ? documentElement.canvas.eventBus :
  39         {trigger: function() {}};
  40     this.trigger = function() {
  41         eventBus.trigger.apply(eventBus, arguments);
  42     };
  43
  44     this.node = documentElement.wlxmlNode;
  45 };
  46
  47 var getDisplayStyle = function(tag, klass) {
  48     if(tag === 'metadata') {
  49         return 'none';
  50     }
  51     if(tag === 'span') {
  52         return 'inline';
  53     }
  54     if(klass && klass.substr(0, 4) === 'item') {
  55         return null;
  56     }
  57     if(klass === 'gap') {
  58         return 'inline';
  59     }
  60     return 'block';
  61 };
  62
  63 var GenericManager = function(wlxmlElement) {
  64     this.el = wlxmlElement;
  65 };
  66
  67 $.extend(GenericManager.prototype, {
  68     setup: function() {
  69         this.el.setDisplayStyle(getDisplayStyle(this.el.tag(), this.el.klass()));
  70
  71         this.el.clearWidgets();
  72         this.el.addWidget(widgets.labelWidget(this.el.tag(), this.el.klass()));
  73
  74     },
  75     toggle: function(toggle) {
  76         this.el.toggle(toggle);
  77     }
  78
  79 });
  80
  81 var managers = {
  82     _m: {},
  83     set: function(tag, klass, manager) {
  84         if(!this._m[tag]) {
  85             this._m[tag] = {};
  86         }
  87         this._m[tag][klass] = manager;
  88     },
  89     get: function(tag,klass) {
  90         if(this._m[tag] && this._m[tag][klass]) {
  91             return this._m[tag][klass];
  92         }
  93         return GenericManager;
  94     }
  95 };
  96
  97 var FootnoteManager = function(wlxmlElement) {
  98     this.el = wlxmlElement;
  99 };
 100 $.extend(FootnoteManager.prototype, {
 101     setup: function() {
 102         this.el.clearWidgets();
 103
 104         var clickHandler = function() {
 105             this.toggle(true);
 106         }.bind(this);
 107         this.footnoteHandler = widgets.footnoteHandler(clickHandler);
 108         this.el.addWidget(this.footnoteHandler);
 109
 110         var closeHandler = function() {
 111             this.toggle(false);
 112
 113         }.bind(this);
 114         this.hideButton = widgets.hideButton(closeHandler);
 115         this.el.addWidget(this.hideButton);
 116
 117         this.toggle(false, {silent: true});
 118     },
 119     toggle: function(toggle, options) {
 120         options = options || {};
 121         this.hideButton.toggle(toggle);
 122         this.footnoteHandler.toggle(!toggle);
 123
 124         this.el.setDisplayStyle(toggle ? 'block' : 'inline');
 125         this.el.toggle(toggle);
 126         if(!options.silent) {
 127             this.el.trigger('elementToggled', toggle, this.el.documentElement);
 128         }
 129     }
 130 });
 131 managers.set('aside', 'footnote', FootnoteManager);
 132
 133
 134 var ListItemManager = function(wlxmlElement) {
 135     this.el = wlxmlElement;
 136 };
 137 $.extend(ListItemManager.prototype, {
 138     setup: function() {
 139         this.el.clearWidgets();
 140         this.el.addWidget(widgets.labelWidget(this.el.tag(), this.el.klass()));
 141         this.el.documentElement._container().css({display: 'list-item'});
 142     },
 143     toggleBullet: function(toggle) {
 144         this.el.documentElement._container().css({display : toggle ? 'list-item' : 'block'});
 145     }
 146 });
 147 managers.set('div', 'item', ListItemManager);
 148
 149
 150 var CommentManager = function(wlxmlElement) {
 151     this.el = wlxmlElement;
 152 };
 153
 154 $.extend(CommentManager.prototype, {
 155     setup: function() {
 156         this.el.clearWidgets();
 157         this.el.addWidget(widgets.labelWidget(this.el.tag(), this.el.klass()));
 158
 159         this.widget = widgets.commentAdnotation(this.el.node);
 160         this.el.addWidget(this.widget);
 161         this.widget.DOM.show();
 162     },
 163     updateMetadata: function() {
 164         // var parts = [];
 165         // this.el.node.getMetadata().forEach(function(row) {
 166         //     parts.push(row.getValue());
 167         // }, 'creator');
 168         // this.widget.text(parts.join(', '));
 169         this.widget.update(this.el.node);
 170     }
 171 });
 172 managers.set('aside', 'comment', CommentManager);
 173
 174 return {
 175     getFor: function(documentElement) {
 176         var wlxmlElement = new DocumentElementWrapper(documentElement);
 177         return new (managers.get(wlxmlElement.tag(), wlxmlElement.klass()))(wlxmlElement);
 178
 179     }
 180 };
 181
 182 });