e9fc1079ce12c12894fad9e8dfdd23dd91af10e6
[fnpeditor.git] / modules / nodeBreadCrumbs / nodeBreadCrumbs.js
1 define([
2 'libs/jquery-1.9.1.min',
3 'libs/underscore-min',
4 'libs/text!./template.html'], function($, _, templateSrc) {
5
6 'use strict';
7
8 return function(sandbox) {
9     
10     var template = _.template(templateSrc);
11     
12     var view = {
13         dom: $('<div>' + template({node:null, parents: null}) + '</div>'),
14         setup: function() {
15             var view = this;
16             this.dom.on('mouseenter', 'a', function(e) {
17                 var target = $(e.target);
18                 sandbox.publish('nodeHighlighted', view.nodes[target.attr('data-id')]);
19             });
20             this.dom.on('mouseleave', 'a', function(e) {
21                 var target = $(e.target);
22                 sandbox.publish('nodeDimmed', view.nodes[target.attr('data-id')]);
23             });
24             this.dom.on('click', 'a', function(e) {
25                 e.preventDefault();
26                 var target = $(e.target);
27                 sandbox.publish('nodeSelected', view.nodes[target.attr('data-id')]);
28             });
29         },
30         
31         setNode: function(node) {
32             this.dom.empty();
33             var nodes = this.nodes = {};
34             this.currentNode = node;
35             this.nodes[node.getId()] = node;
36             var parents = node.parents();
37             parents.each(function() {
38                 var parent = this;
39                 nodes[parent.getId()] = parent;
40             });
41             this.dom.html(template({node: node, parents: parents}));
42         },
43         
44         highlightNode: function(node) {
45             this.dom.find('a[data-id="'+node.id+'"]').addClass('rng-common-hoveredNode');
46         },
47         dimNode: function(node) {
48             this.dom.find('a[data-id="'+node.id+'"]').removeClass('rng-common-hoveredNode');
49         }
50     };
51     
52     view.setup();
53     
54     return {
55         start: function() { sandbox.publish('ready'); },
56         getView: function() { return view.dom; },
57         setNode: function(canvasNode) {
58             if(!canvasNode.isSame(view.currentNode)) {
59                 view.setNode(canvasNode);
60             }
61         },
62         highlightNode: function(id) { view.highlightNode(id); },
63         dimNode: function(id) { view.dimNode(id); }
64     };
65 };
66
67 });