e47821e37ed4a36e3a3aef33eed658176de8b08e
[fnpeditor.git] / modules / nodeFamilyTree / nodeFamilyTree.js
1 define([
2 'libs/jquery-1.9.1.min',
3 'libs/underscore-min',
4 'libs/text!./template.html'
5 ], function($, _, templateSrc) {
6
7 'use strict';
8
9 return function(sandbox) {
10     
11     var template = _.template(templateSrc);
12     
13     var view = {
14         dom: $('<div>' + template({children: null, parent: null}) + '</div>'),
15         setup: function() {
16             var view = this;
17             this.dom.on('click', 'a', function(e) {
18                 var target = $(e.target);
19                 sandbox.publish('elementClicked', target.data('element'));
20             });
21             
22             this.dom.on('mouseenter', 'a', function(e) {
23                 var target = $(e.target);
24                 sandbox.publish('elementEntered', target.data('element'));
25             });
26             this.dom.on('mouseleave', 'a', function(e) {
27                 var target = $(e.target);
28                 sandbox.publish('elementLeft', target.data('element'));
29             });
30         },
31         setElement: function(element) {
32             console.log('familyTree sets node');
33             var textElement = element.getText ? element : null,
34                 nodeElement = element.getText ? element.parent() : element, // TODO: better type detection
35                 nodeElementParent = nodeElement.parent(),
36                 parent;
37             
38             this.currentNodeElement = nodeElement;
39
40             if(nodeElementParent) {
41                 parent = {
42                     repr: nodeElementParent.getWlxmlTag() + (nodeElementParent.getWlxmlClass() ? ' / ' + nodeElementParent.getWlxmlClass() : '')
43                 };
44             }
45         
46             var nodeChildren = nodeElement.children(),
47                 children = [];
48             nodeChildren.forEach(function(child) {
49                 if(child.getText) {
50                     var text = child.getText();
51                     if(text.length > 13)
52                         text = text.substr(0,13) + '...';
53                     children.push({repr: '"' + text + '"', bold: child.sameNode(textElement)});
54                 } else {
55                     children.push({repr: child.getWlxmlTag() + (child.getWlxmlClass() ? ' / ' + child.getWlxmlClass() : '')});
56                 }
57             });
58             this.dom.empty();
59             this.dom.append($(template({parent: parent, children: children})));
60
61             if(parent) {
62                 this.dom.find('.rng-module-nodeFamilyTree-parent').data('element', nodeElementParent)
63             }
64             this.dom.find('li a').each(function(idx, a) {
65                 $(a).data('element', nodeChildren[idx]);
66             });
67         },
68         highlightNode: function(canvasNode) {
69             this.dom.find('a[data-id="'+canvasNode.getId()+'"]').addClass('rng-common-hoveredNode');
70         },
71         dimNode: function(canvasNode) {
72             this.dom.find('a[data-id="'+canvasNode.getId()+'"]').removeClass('rng-common-hoveredNode');
73         }
74     };
75     
76     view.setup();
77     
78     return {
79         start: function() {
80             sandbox.publish('ready');
81         },
82         setElement: function(element) {
83             if(!(element.sameNode(view.currentNodeElement)))
84                 view.setElement(element);
85         },
86         getView: function() {
87             return view.dom;
88         },
89         highlightNode: function(canvasNode) {
90             view.highlightNode(canvasNode);
91         },
92         dimNode: function(canvasNode) {
93             view.dimNode(canvasNode);
94         }
95     };
96 };
97
98 });