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);
  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 };
  45
  46 var getDisplayStyle = function(tag, klass) {
  47     if(tag === 'metadata') {
  48         return 'none';
  49     }
  50     if(tag === 'span') {
  51         return 'inline';
  52     }
  53     if(klass === 'item') {
  54         return null;
  55     }
  56     return 'block';
  57 };
  58
  59 var GenericManager = function(wlxmlElement) {
  60     this.el = wlxmlElement;
  61 };
  62
  63 $.extend(GenericManager.prototype, {
  64     setup: function() {
  65         this.el.setDisplayStyle(getDisplayStyle(this.el.tag(), this.el.klass()));
  66
  67         this.el.clearWidgets();
  68         this.el.addWidget(widgets.labelWidget(this.el.tag(), this.el.klass()));
  69
  70     },
  71     toggle: function(toggle) {
  72         this.el.toggle(toggle);
  73     }
  74
  75 });
  76
  77 var managers = {
  78     _m: {},
  79     set: function(tag, klass, manager) {
  80         if(!this._m[tag]) {
  81             this._m[tag] = {};
  82         }
  83         this._m[tag][klass] = manager;
  84     },
  85     get: function(tag,klass) {
  86         if(this._m[tag] && this._m[tag][klass]) {
  87             return this._m[tag][klass];
  88         }
  89         return GenericManager;
  90     }
  91 };
  92
  93 var FootnoteManager = function(wlxmlElement) {
  94     this.el = wlxmlElement;
  95 };
  96 $.extend(FootnoteManager.prototype, {
  97     setup: function() {
  98         this.el.clearWidgets();
  99
 100         var clickHandler = function() {
 101             this.toggle(true);
 102         }.bind(this);
 103         this.footnoteHandler = widgets.footnoteHandler(clickHandler);
 104         this.el.addWidget(this.footnoteHandler);
 105
 106         var closeHandler = function() {
 107             this.toggle(false);
 108
 109         }.bind(this);
 110         this.hideButton = widgets.hideButton(closeHandler);
 111         this.el.addWidget(this.hideButton);
 112
 113         this.toggle(false, {silent: true});
 114     },
 115     toggle: function(toggle, options) {
 116         options = options || {};
 117         this.hideButton.toggle(toggle);
 118         this.footnoteHandler.toggle(!toggle);
 119
 120         this.el.setDisplayStyle(toggle ? 'block' : 'inline');
 121         this.el.toggle(toggle);
 122         if(!options.silent) {
 123             this.el.trigger('elementToggled', toggle, this.el.documentElement);
 124         }
 125     }
 126 });
 127 managers.set('aside', 'footnote', FootnoteManager);
 128
 129
 130 var ListItemManager = function(wlxmlElement) {
 131     this.el = wlxmlElement;
 132 };
 133 $.extend(ListItemManager.prototype, {
 134     setup: function() {
 135         this.el.clearWidgets();
 136         this.el.addWidget(widgets.labelWidget(this.el.tag(), this.el.klass()));
 137         this.el.documentElement._container().css({display: 'list-item'});
 138     },
 139     toggleBullet: function(toggle) {
 140         this.el.documentElement._container().css({display : toggle ? 'list-item' : 'block'});
 141     }
 142 });
 143 managers.set('div', 'item', ListItemManager);
 144
 145 return {
 146     getFor: function(documentElement) {
 147         var wlxmlElement = new DocumentElementWrapper(documentElement);
 148         return new (managers.get(wlxmlElement.tag(), wlxmlElement.klass()))(wlxmlElement);
 149
 150     }
 151 };
 152
 153 });