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