Fixing is-dirty management in rng module
[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     \r
19     dom.find('.btn.compare').click(function(e) {\r
20         var selected = historyItems.getSelected();\r
21         sandbox.publish('compare', selected[0], selected[1]);\r
22     });\r
23         \r
24     var addHistoryItem = function(item, options) {\r
25         historyItems.add(item);\r
26         var view = new itemView(item);\r
27         itemViews.push(view);\r
28         domNodes.itemList.prepend(view.dom);\r
29         if(options.animate) {\r
30             view.dom.hide().slideDown();\r
31         }\r
32     }\r
33     \r
34     var toggleItemViews = function(toggle) {\r
35         itemViews.forEach(function(view) {\r
36             if(!historyItems.isSelected(view.item))\r
37                 view.toggle(toggle);\r
38         });\r
39     }\r
40     \r
41     var toggleButton = function(btn, toggle) {\r
42         dom.find('button.'+btn).toggleClass('disabled', !toggle);\r
43     }\r
44     \r
45     var historyItems = {\r
46         _itemsById: {},\r
47         _selected: [],\r
48         select: function(item) {\r
49             if(this._selected.length < 2) {\r
50                 this._selected.push(item.version);\r
51                 this._updateUI();\r
52                 return true;\r
53             }\r
54             return false;\r
55         },\r
56         unselect: function(item) {\r
57             this._selected = _.without(this._selected, item.version);\r
58             this._updateUI();\r
59         },\r
60         add: function(item) {\r
61             this._itemsById[item.version] = item;\r
62         },\r
63         isSelected: function(item) {\r
64             return _.contains(this._selected, item.version);\r
65         },\r
66         getSelected: function() {\r
67             return this._selected;\r
68         },\r
69         _updateUI: function() {\r
70             var len = this._selected.length;\r
71             if(len === 0) {\r
72                 toggleButton('compare', false);\r
73                 toggleButton('show2', false);\r
74                 toggleButton('restore', false);\r
75             }\r
76             if(len === 1) {\r
77                 toggleButton('compare', false);\r
78                 toggleButton('show2', true);\r
79                 toggleButton('restore', true);\r
80             }\r
81             if(len === 2) {\r
82                 toggleItemViews(false);\r
83                 toggleButton('compare', true);\r
84                 toggleButton('show2', false);\r
85                 toggleButton('restore', false);\r
86             } else {\r
87                 toggleItemViews(true);\r
88             }\r
89         }\r
90     };\r
91     historyItems._updateUI();\r
92     \r
93     var itemView = function(item) {\r
94         this.item = item;\r
95         this.dom = $(this.template(item));\r
96         this.dom.on('click', _.bind(this.onItemClicked, this));\r
97     };\r
98     itemView.prototype.template = _.template(itemTemplateSrc);\r
99     itemView.prototype.onItemClicked = function() {\r
100         if(historyItems.isSelected(this.item)) {\r
101             historyItems.unselect(this.item);\r
102             this.dimItem();\r
103         } else if(historyItems.select(this.item)) {\r
104             this.highlightItem();\r
105         }            \r
106     };\r
107     itemView.prototype.highlightItem = function() {\r
108         this.dom.addClass('highlighted');\r
109     };\r
110     itemView.prototype.dimItem = function() {\r
111         this.dom.removeClass('highlighted');\r
112     };\r
113     itemView.prototype.toggle = function(toggle) {\r
114         this.dom.toggleClass('disabled', !toggle);\r
115     };\r
116 \r
117     \r
118     \r
119     return {\r
120         start: function() { sandbox.publish('ready'); },
121         addHistory: function(history, options) {\r
122             history.forEach(function(historyItem) {\r
123                 addHistoryItem(historyItem, options || {});\r
124             });\r
125         },\r
126         getView: function() {\r
127             return dom;\r
128         }\r
129     }\r
130 }\r
131 \r
132 });