YUI.add('change-history', function(Y) { var Lang = Y.Lang, Widget = Y.Widget, Node = Y.Node; var NS = Y.namespace('mazzle'); NS.ChangeHistory = ChangeHistory; /* ChangeHistory class constructor */ function ChangeHistory(config) { ChangeHistory.superclass.constructor.apply(this, arguments); } /* * Required NAME static field, to identify the Widget class and * used as an event prefix, to generate class names etc. (set to the * class name in camel case). */ ChangeHistory.NAME = "change-history"; /* * The attribute configuration for the ChangeHistory widget. Attributes can be * defined with default values, get/set functions and validator functions * as with any other class extending Base. */ ChangeHistory.ATTRS = { index: { value: 0 } }; /* Static constants used to define the markup templates used to create ChangeHistory DOM elements */ ChangeHistory.LIST_CLASS = 'tag-list'; ChangeHistory.LIST_TEMPLATE = ''; /* ChangeHistory extends the base Widget class */ Y.extend(ChangeHistory, Widget, { initializer: function() { this._listNode = null; this._actions = []; }, destructor : function() { }, renderUI : function() { var content = this.get("contentBox"); this._listNode = content.appendChild(Node.create(ChangeHistory.LIST_TEMPLATE)); }, bindUI : function() { Y.delegate("click", this._itemSelect, this._listNode, "li", this); }, syncUI : function() { this._renderActions(); }, _renderActions : function() { var actions = this._actions; this._listNode.setContent(""); for(var i=0; i < actions.length; i++) { this._listNode.append('
  • ' +''+i+'' +this.formatAction(actions[i]) +'
  • '); } }, formatAction : function(action) { var type = action.type; annotation = action.annotation; var label = annotation.tag ? '"'+annotation.tag.value+'"' : ""; if(action.newvalue) {label += ' to "'+action.newvalue+'"'} if(action.startTime) {label += ' at time '+action.startTime} if(action.endTime) {label += ' - '+action.endTime} var html = ''+type+'' + ' '+label+''; return html; }, addActionHandler : function(e) { var action = e.details[0]; this.addAction(action); }, addAction : function(action) { var actions = this._actions, index = this.get("index"), nodes = this._listNode.all("li"); // First we remove the actions after the current index (the redos). if(index' +''+index+'' +this.formatAction(action) +''); }, getActiveActions : function() { var actions = this._actions, index = this.get("index"); var active = []; for (var i=0; i < index; i++) { var action = actions[i]; active[i] = { type:action.type, annotation:action.annotation }; if(action.newvalue) { active[i].newvalue = action.newvalue; } } return active; }, disableAll : function() { this.set("index", 0); this._actions = []; this._listNode.setContent(""); /* this.set("index", 0); this._listNode.all("li").each(function(node, i) { node.addClass("disabled"); });*/ }, _itemSelect : function(e) { var nodes = e.container.all("li"); index = nodes.indexOf(e.currentTarget), actions = this._actions, undo = []; // We store the current index, so later we know // which actions are undos and redos this.set("index", index); // The redo actions are indicated by CSS class "disabled" // and collected in the history array which is send in the // undo event. for (var i=index; i < nodes.size(); i++) { nodes.item(i).addClass("disabled"); undo.push(actions[i]); }; Y.log("undo "+undo); this.fire("undo", {history:undo}); } }); }, 'gallery-2010.03.02-18' ,{requires:['node','widget']});