modules/documentHistory/documentHistory.js

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