tutorial in editor (mechanics only)
[fnpeditor.git] / src / editor / modules / documentHistory / documentHistory.js
1 define([
2 'libs/jquery',
3 'libs/underscore',
4 'libs/text!./templates/main.html',
5 'libs/text!./templates/item.html'
6 ], function($, _, mainTemplateSrc, itemTemplateSrc) {
7
8 'use strict';
9     
10 return function(sandbox) {
11     
12     var dom = $(_.template(mainTemplateSrc)());
13     var domNodes = {
14         itemList: dom.find('.rng-module-documentHistory-itemsList'),
15     };
16     var itemViews = [];
17     
18     
19     dom.find('.btn.compare').click(function() {
20         var selected = historyItems.getSelected();
21         sandbox.publish('compare', selected[0], selected[1]);
22     });
23     
24     dom.find('.btn.restore').click(function() {
25         sandbox.publish('restoreVersion', historyItems.getSelected()[0]);
26     });
27     
28     dom.find('.btn.display').click(function() {
29         sandbox.publish('displayVersion', historyItems.getSelected()[0]);
30     });
31
32     dom.find('.btn.publish').click(function() {
33         sandbox.publish('publishVersion', historyItems.getSelected()[0]);
34     });
35         
36     var addHistoryItem = function(item, options) {
37         historyItems.add(item);
38         var view = new ItemView(item);
39         itemViews.push(view);
40         domNodes.itemList.prepend(view.dom);
41         if(options.animate) {
42             view.dom.hide().slideDown();
43         }
44     };
45     
46     var toggleItemViews = function(toggle) {
47         itemViews.forEach(function(view) {
48             if(!historyItems.isSelected(view.item)) {
49                 view.toggle(toggle);
50             }
51         });
52     };
53     
54     var toggleButton = function(btn, toggle) {
55         dom.find('button.'+btn).toggleClass('disabled', !toggle);
56     };
57     
58     var historyItems = {
59         _itemsById: {},
60         _selected: [],
61         select: function(item) {
62             if(this._selected.length < 2) {
63                 this._selected.push(item.revision);
64                 this._updateUI();
65                 return true;
66             }
67             return false;
68         },
69         unselect: function(item) {
70             this._selected = _.without(this._selected, item.revision);
71             this._updateUI();
72         },
73         add: function(item) {
74             this._itemsById[item.version] = item;
75         },
76         isSelected: function(item) {
77             return _.contains(this._selected, item.revision);
78         },
79         getSelected: function() {
80             return this._selected;
81         },
82         _updateUI: function() {
83             var len = this._selected.length;
84             if(len === 0) {
85                 toggleButton('compare', false);
86                 toggleButton('display', false);
87                 toggleButton('restore', false);
88                 toggleButton('publish', false);
89             }
90             if(len === 1) {
91                 toggleButton('compare', false);
92                 toggleButton('display', true);
93                 toggleButton('restore', true);
94                 toggleButton('publish', true);
95             }
96             if(len === 2) {
97                 toggleItemViews(false);
98                 toggleButton('compare', true);
99                 toggleButton('display', false);
100                 toggleButton('restore', false);
101                 toggleButton('publish', false);
102             } else {
103                 toggleItemViews(true);
104             }
105         }
106     };
107     historyItems._updateUI();
108     
109     var ItemView = function(item) {
110         this.item = item;
111         this.dom = $(this.template(item));
112         this.dom.on('click', _.bind(this.onItemClicked, this));
113     };
114     ItemView.prototype.template = _.template(itemTemplateSrc);
115     ItemView.prototype.onItemClicked = function() {
116         if(historyItems.isSelected(this.item)) {
117             historyItems.unselect(this.item);
118             this.dimItem();
119         } else if(historyItems.select(this.item)) {
120             this.highlightItem();
121         }
122     };
123     ItemView.prototype.highlightItem = function() {
124         this.dom.addClass('highlighted');
125     };
126     ItemView.prototype.dimItem = function() {
127         this.dom.removeClass('highlighted');
128     };
129     ItemView.prototype.toggle = function(toggle) {
130         this.dom.toggleClass('disabled', !toggle);
131     };
132
133     
134     
135     return {
136         start: function() { sandbox.publish('ready'); },
137         addHistory: function(history, options) {
138             history.forEach(function(historyItem) {
139                 addHistoryItem(historyItem, options || {});
140             });
141         },
142         getView: function() {
143             return dom;
144         }
145     };
146 };
147
148 });