wlxml: metadata wip - part of a new api approach
[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);
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 && klass.substr(0, 4) === '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 });