editor: inline style for aside.gap
[fnpeditor.git] / 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.data('wlxmlNode');
45
46 };
47
48 var getDisplayStyle = function(tag, klass) {
49     if(tag === 'metadata') {
50         return 'none';
51     }
52     if(tag === 'span') {
53         return 'inline';
54     }
55     if(klass && klass.substr(0, 4) === 'item') {
56         return null;
57     }
58     if(klass === 'gap') {
59         return 'inline';
60     }
61     return 'block';
62 };
63
64 var GenericManager = function(wlxmlElement) {
65     this.el = wlxmlElement;
66 };
67
68 $.extend(GenericManager.prototype, {
69     setup: function() {
70         this.el.setDisplayStyle(getDisplayStyle(this.el.tag(), this.el.klass()));
71
72         this.el.clearWidgets();
73         this.el.addWidget(widgets.labelWidget(this.el.tag(), this.el.klass()));
74
75     },
76     toggle: function(toggle) {
77         this.el.toggle(toggle);
78     }
79
80 });
81
82 var managers = {
83     _m: {},
84     set: function(tag, klass, manager) {
85         if(!this._m[tag]) {
86             this._m[tag] = {};
87         }
88         this._m[tag][klass] = manager;
89     },
90     get: function(tag,klass) {
91         if(this._m[tag] && this._m[tag][klass]) {
92             return this._m[tag][klass];
93         }
94         return GenericManager;
95     }
96 };
97
98 var FootnoteManager = function(wlxmlElement) {
99     this.el = wlxmlElement;
100 };
101 $.extend(FootnoteManager.prototype, {
102     setup: function() {
103         this.el.clearWidgets();
104
105         var clickHandler = function() {
106             this.toggle(true);
107         }.bind(this);
108         this.footnoteHandler = widgets.footnoteHandler(clickHandler);
109         this.el.addWidget(this.footnoteHandler);
110
111         var closeHandler = function() {
112             this.toggle(false);
113
114         }.bind(this);
115         this.hideButton = widgets.hideButton(closeHandler);
116         this.el.addWidget(this.hideButton);
117
118         this.toggle(false, {silent: true});
119     },
120     toggle: function(toggle, options) {
121         options = options || {};
122         this.hideButton.toggle(toggle);
123         this.footnoteHandler.toggle(!toggle);
124         
125         this.el.setDisplayStyle(toggle ? 'block' : 'inline');
126         this.el.toggle(toggle);
127         if(!options.silent) {
128             this.el.trigger('elementToggled', toggle, this.el.documentElement);
129         }
130     }
131 });
132 managers.set('aside', 'footnote', FootnoteManager);
133
134
135 var ListItemManager = function(wlxmlElement) {
136     this.el = wlxmlElement;
137 };
138 $.extend(ListItemManager.prototype, {
139     setup: function() {
140         this.el.clearWidgets();
141         this.el.addWidget(widgets.labelWidget(this.el.tag(), this.el.klass()));
142         this.el.documentElement._container().css({display: 'list-item'});
143     },
144     toggleBullet: function(toggle) {
145         this.el.documentElement._container().css({display : toggle ? 'list-item' : 'block'});
146     }
147 });
148 managers.set('div', 'item', ListItemManager);
149
150
151 var CommentManager = function(wlxmlElement) {
152     this.el = wlxmlElement;
153 };
154
155 $.extend(CommentManager.prototype, {
156     setup: function() {
157         this.el.clearWidgets();
158         this.el.addWidget(widgets.labelWidget(this.el.tag(), this.el.klass()));
159
160         this.widget = widgets.commentAdnotation(this.el.node);
161         this.el.addWidget(this.widget);
162         this.widget.DOM.show();
163     },
164     updateMetadata: function() {
165         // var parts = [];
166         // this.el.node.getMetadata().forEach(function(row) {
167         //     parts.push(row.getValue());
168         // }, 'creator');
169         // this.widget.text(parts.join(', '));
170         this.widget.update(this.el.node);
171     }
172 });
173 managers.set('aside', 'comment', CommentManager);
174
175 return {
176     getFor: function(documentElement) {
177         var wlxmlElement = new DocumentElementWrapper(documentElement);
178         return new (managers.get(wlxmlElement.tag(), wlxmlElement.klass()))(wlxmlElement);
179
180     }
181 };
182
183 });