history wip: little animation on adding new item
[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             view.toggle(toggle);\r
31         });\r
32     }\r
33     \r
34     var historyItems = {\r
35         _itemsById: {},\r
36         _selected: [],\r
37         select: function(id) {\r
38             if(this._selected.length < 2) {\r
39                 this._selected.push(id);\r
40                 if(this._selected.length === 2)\r
41                     toggleItemViews(false);\r
42                 return true;\r
43             }\r
44             return false;\r
45         },\r
46         unselect: function(item) {\r
47             this._selected = _.without(this._selected, id);\r
48             if(this._selected.length < 2)\r
49                 toggleItemViews(true);\r
50         },\r
51         add: function(item) {\r
52             this._itemsById[item.id] = item;\r
53         },\r
54         selected: function(item) {\r
55             return _.contains(_selected, item.id);\r
56         }\r
57     };\r
58     \r
59     var itemView = function(item) {\r
60         this.item = item;\r
61         this.dom = $(this.template(item));\r
62         this.dom.on('click', this.onItemClicked);\r
63     };\r
64     itemView.prototype.template = _.template(itemTemplateSrc);\r
65     itemView.prototype.onItemClicked = function() {\r
66         if(historyItems.selected(item)) {\r
67             historyItems.unselect(item);\r
68             this.dimItem();\r
69         } else if(historyItems.select(item)) {\r
70             this.highlightItem();\r
71         }            \r
72     };\r
73     itemView.prototype.highlightItem = function() {\r
74         \r
75     };\r
76     itemView.prototype.dimItem = function() {\r
77     \r
78     };\r
79     itemView.prototype.toggle = function(toggle) {\r
80     \r
81     };\r
82 \r
83     \r
84     \r
85     return {\r
86         start: function() { sandbox.publish('ready'); },
87         addHistory: function(history, options) {\r
88             history.forEach(function(historyItem) {\r
89                 addHistoryItem(historyItem, options || {});\r
90             });\r
91         },\r
92         getView: function() {\r
93             return dom;\r
94         }\r
95     }\r
96 }\r
97 \r
98 });