cleanup
[fnpeditor.git] / src / editor / modules / nodeFamilyTree / nodeFamilyTree.js
1 define([
2 'libs/jquery',
3 'libs/underscore',
4 'utils/wlxml',
5 'libs/text!./template.html'
6 ], function($, _, wlxmlUtils, templateSrc) {
7
8 'use strict';
9
10 return function(sandbox) {
11     
12     var template = _.template(templateSrc),
13         listens = false,
14         items = [];
15
16     var getItemId = function(item) {
17         var idx = -1;
18         var found = _.find(items, function(i) {
19             idx += 1;
20             return item.sameNode(i);
21         });
22         if(found) {
23             return idx;
24         }
25         return -1;
26     };
27     
28     var startListening = function(document) {
29         listens = true;
30         document.on('change', function(event) {
31             if(event.type === 'nodeTextChange' && event.meta.node.parent().sameNode(view.currentNodeElement)) {
32                 view.setElement();
33             }
34         }, this);
35     };
36
37     var view = {
38         dom: $('<div>' + template({contents: null, parent: null}) + '</div>'),
39         setup: function() {
40             this.dom.on('click', 'a', function(e) {
41                 var target = $(e.target);
42                 sandbox.publish('nodeClicked', target.data('element'));
43             });
44             
45             this.dom.on('mouseenter', 'a', function(e) {
46                 var target = $(e.target);
47                 sandbox.publish('nodeEntered', target.data('element'));
48             });
49             this.dom.on('mouseleave', 'a', function(e) {
50                 var target = $(e.target);
51                 sandbox.publish('nodeLeft', target.data('element'));
52             });
53         },
54         setElement: function(element) {
55             element = element || this.currentNodeElement;
56             var textElement = element.getText ? element : null,
57                 nodeElement = element.getText ? element.parent() : element, // TODO: better type detection
58                 nodeElementParent = nodeElement.parent(),
59                 parent;
60             
61             this.currentNodeElement = nodeElement;
62             items = [];
63
64             if(nodeElementParent) {
65                 items.push(nodeElementParent);
66                 parent = {
67                     id: items.length - 1,
68                     repr: wlxmlUtils.wlxmlTagNames[nodeElementParent.getTagName()] + (nodeElementParent.getClass() ? ' / ' + wlxmlUtils.wlxmlClassNames[nodeElementParent.getClass()] : '')
69                 };
70                 
71             }
72         
73             var nodeContents = nodeElement.contents(),
74                 contents = [];
75             nodeContents.forEach(function(child) {
76                 if(child.getText) {
77                     var text = child.getText();
78                     if(!text) {
79                         text = '<pusty tekst>';
80                     }
81                     else {
82                         if(text.length > 13) {
83                             text = text.substr(0,13) + '...';
84                         }
85                         text = '"' + text + '"';
86                     }
87                     contents.push({
88                         id: items.length,
89                         repr: _.escape(text), bold: child.sameNode(textElement)
90                     });
91                 } else {
92                     contents.push({
93                         id: items.length,
94                         repr: wlxmlUtils.wlxmlTagNames[child.getTagName()] + (child.getClass() ? ' / ' + wlxmlUtils.wlxmlClassNames[child.getClass()] : '')
95                     });
96                 }
97                 items.push(child);
98             });
99             this.dom.empty();
100             this.dom.append($(template({parent: parent, contents: contents})));
101
102             if(parent) {
103                 this.dom.find('.rng-module-nodeFamilyTree-parent').data('element', nodeElementParent);
104             }
105             this.dom.find('li a').each(function(idx, a) {
106                 $(a).data('element', nodeContents[idx]);
107             });
108         },
109         highlightNode: function(canvasNode) {
110             var id = getItemId(canvasNode);
111             this.dom.find('a[rng-module-nodeFamilyTree-item-id="'+id+'"]').addClass('rng-common-hoveredNode');
112         },
113         dimNode: function(canvasNode) {
114             var id = getItemId(canvasNode);
115             this.dom.find('a[rng-module-nodeFamilyTree-item-id="'+id+'"]').removeClass('rng-common-hoveredNode');
116         }
117     };
118     
119     view.setup();
120     
121     return {
122         start: function() {
123             sandbox.publish('ready');
124         },
125         setElement: function(element) {
126             if(!listens) {
127                 startListening(element.document);
128             }
129             if(!(element.sameNode(view.currentNodeElement))) {
130                 view.setElement(element);
131             }
132         },
133         getView: function() {
134             return view.dom;
135         },
136         highlightElement: function(canvasNode) {
137             view.highlightNode(canvasNode);
138         },
139         dimElement: function(canvasNode) {
140             view.dimNode(canvasNode);
141         }
142     };
143 };
144
145 });