history wip: Selecting versions in history view
[fnpeditor.git] / modules / documentHistory / documentHistory.js
1 define([\r
2 'libs/jquery-1.9.1.min',\r
3 'libs/underscore-min',\r
4 'libs/text!./templates/main.html',\r
5 'libs/text!./templates/item.html'\r
6 ], function($, _, mainTemplateSrc, itemTemplateSrc) {\r
7 \r
8 'use strict';\r
9     \r
10 return function(sandbox) {\r
11     \r
12     var dom = $(_.template(mainTemplateSrc)());\r
13     var domNodes = {\r
14         itemList: dom.find('.rng-module-documentHistory-itemsList'),\r
15     }\r
16     var itemViews = [];\r
17         \r
18     var addHistoryItem = function(item, options) {\r
19         historyItems.add(item);\r
20         var view = new itemView(item);\r
21         itemViews.push(view);\r
22         domNodes.itemList.prepend(view.dom);\r
23         if(options.animate) {\r
24             view.dom.hide().slideDown();\r
25         }\r
26     }\r
27     \r
28     var toggleItemViews = function(toggle) {\r
29         itemViews.forEach(function(view) {\r
30             if(!historyItems.selected(view.item))\r
31                 view.toggle(toggle);\r
32         });\r
33     }\r
34     \r
35     var historyItems = {\r
36         _itemsById: {},\r
37         _selected: [],\r
38         select: function(item) {\r
39             if(this._selected.length < 2) {\r
40                 this._selected.push(item.version);\r
41                 if(this._selected.length === 2)\r
42                     toggleItemViews(false);\r
43                 return true;\r
44             }\r
45             return false;\r
46         },\r
47         unselect: function(item) {\r
48             this._selected = _.without(this._selected, item.version);\r
49             if(this._selected.length < 2)\r
50                 toggleItemViews(true);\r
51         },\r
52         add: function(item) {\r
53             this._itemsById[item.version] = item;\r
54         },\r
55         selected: function(item) {\r
56             return _.contains(this._selected, item.version);\r
57         }\r
58     };\r
59     \r
60     var itemView = function(item) {\r
61         this.item = item;\r
62         this.dom = $(this.template(item));\r
63         this.dom.on('click', _.bind(this.onItemClicked, this));\r
64     };\r
65     itemView.prototype.template = _.template(itemTemplateSrc);\r
66     itemView.prototype.onItemClicked = function() {\r
67         if(historyItems.selected(this.item)) {\r
68             historyItems.unselect(this.item);\r
69             this.dimItem();\r
70         } else if(historyItems.select(this.item)) {\r
71             this.highlightItem();\r
72         }            \r
73     };\r
74     itemView.prototype.highlightItem = function() {\r
75         this.dom.addClass('highlighted');\r
76     };\r
77     itemView.prototype.dimItem = function() {\r
78         this.dom.removeClass('highlighted');\r
79     };\r
80     itemView.prototype.toggle = function(toggle) {\r
81         this.dom.toggleClass('disabled', !toggle);\r
82     };\r
83 \r
84     \r
85     \r
86     return {\r
87         start: function() { sandbox.publish('ready'); },
88         addHistory: function(history, options) {\r
89             history.forEach(function(historyItem) {\r
90                 addHistoryItem(historyItem, options || {});\r
91             });\r
92         },\r
93         getView: function() {\r
94             return dom;\r
95         }\r
96     }\r
97 }\r
98 \r
99 });