610901aed0784c1efe73ee3d175fb16b2e1ad933
[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     
15     var startListening = function(document) {
16         listens = true;
17         document.on('change', function(event) {
18             if(event.type === 'nodeTextChange' && event.meta.node.parent().sameNode(view.currentNodeElement)) {
19                 view.setElement();
20             }
21         }, this);
22     }
23
24     var view = {
25         dom: $('<div>' + template({contents: null, parent: null}) + '</div>'),
26         setup: function() {
27             var view = this;
28             this.dom.on('click', 'a', function(e) {
29                 var target = $(e.target);
30                 sandbox.publish('nodeClicked', target.data('element'));
31             });
32             
33             this.dom.on('mouseenter', 'a', function(e) {
34                 var target = $(e.target);
35                 sandbox.publish('nodeEntered', target.data('element'));
36             });
37             this.dom.on('mouseleave', 'a', function(e) {
38                 var target = $(e.target);
39                 sandbox.publish('nodeLeft', target.data('element'));
40             });
41         },
42         setElement: function(element) {
43             element = element || this.currentNodeElement;
44             console.log('familyTree sets node');
45             var textElement = element.getText ? element : null,
46                 nodeElement = element.getText ? element.parent() : element, // TODO: better type detection
47                 nodeElementParent = nodeElement.parent(),
48                 parent;
49             
50             this.currentNodeElement = nodeElement;
51
52             if(nodeElementParent) {
53                 parent = {
54                     repr: wlxmlUtils.wlxmlTagNames[nodeElementParent.getTagName()] + (nodeElementParent.getClass() ? ' / ' + wlxmlUtils.wlxmlClassNames[nodeElementParent.getClass()] : '')
55                 };
56             }
57         
58             var nodeContents = nodeElement.contents(),
59                 contents = [];
60             nodeContents.forEach(function(child) {
61                 if(child.getText) {
62                     var text = child.getText();
63                     if(!text)
64                         text = '<pusty tekst>';
65                     else {
66                         if(text.length > 13) {
67                             text = text.substr(0,13) + '...';
68                         }
69                         text = '"' + text + '"';
70                     }
71                     contents.push({repr: _.escape(text), bold: child.sameNode(textElement)});
72                 } else {
73                     contents.push({repr: wlxmlUtils.wlxmlTagNames[child.getTagName()] + (child.getClass() ? ' / ' + wlxmlUtils.wlxmlClassNames[child.getClass()] : '')});
74                 }
75             });
76             this.dom.empty();
77             this.dom.append($(template({parent: parent, contents: contents})));
78
79             if(parent) {
80                 this.dom.find('.rng-module-nodeFamilyTree-parent').data('element', nodeElementParent)
81             }
82             this.dom.find('li a').each(function(idx, a) {
83                 $(a).data('element', nodeContents[idx]);
84             });
85         },
86         highlightNode: function(canvasNode) {
87             this.dom.find('a[data-id="'+canvasNode.getId()+'"]').addClass('rng-common-hoveredNode');
88         },
89         dimNode: function(canvasNode) {
90             this.dom.find('a[data-id="'+canvasNode.getId()+'"]').removeClass('rng-common-hoveredNode');
91         }
92     };
93     
94     view.setup();
95     
96     return {
97         start: function() {
98             sandbox.publish('ready');
99         },
100         setElement: function(element) {
101             if(!listens) {
102                 startListening(element.document);
103             }
104             if(!(element.sameNode(view.currentNodeElement)))
105                 view.setElement(element);
106         },
107         getView: function() {
108             return view.dom;
109         },
110         highlightNode: function(canvasNode) {
111             view.highlightNode(canvasNode);
112         },
113         dimNode: function(canvasNode) {
114             view.dimNode(canvasNode);
115         }
116     };
117 };
118
119 });