1

这里是：

function StateMaker(initialStateObj){
  var o = initialStateObj;
  if(o){
    if(typeof o === 'object' && o instanceof Array || typeof o !== 'object'){
      throw new Error('initialStateObj must be an Object');
      return false;
    }
    this.initialState = o; this.states = [o]; this.savedStates = [o];
  }
  else{
    this.states = []; this.savedStates = [];
  }
  this.canUndo = this.canRedo = false; this.undoneStates = [];
  this.addState = function(stateObj){
    var o = stateObj;
    if(typeof o === 'object' && o instanceof Array || typeof o !== 'object'){
      throw new Error('stateObj must be an Object');
      return false;
    }
    this.states.push(o); this.undoneStates = []; this.canUndo = this.canRedo = false;
    return this;
  }
  this.undo = function(){
    var sl = this.states.length;
    if(this.initialState){
      if(sl > 1){
        this.undoneStates.push(this.states.pop()); this.canRedo = true;
        if(this.states.length < 2){
          this.canUndo = false;
        }
      }
      else{
        this.canUndo = false;
      }
    }
    else if(sl > 0){
      this.undoneStates.push(this.states.pop()); this.canRedo = true;
    }
    else{
      this.canUndo = false;
    }
    return this;
  }
  this.redo = function(){
    if(this.undoneStates.length > 0){
      this.states.push(this.undoneStates.pop()); this.canUndo = true;
      if(this.undoneStates.length < 1){
        this.canRedo = false;
      }
    }
    else{
      this.canRedo = false;
    }
    return this;
  }
  this.save = function(){
    this.savedStates = this.states.slice();
    return this;
  }
  this.isSavedState = function(){
    var st = this.states, l = st.length; sv = this.savedStates;
    if(l !== sv.length){
      return false;
    }
    for(var i=0; i<l; i++){
      var o = st[i], c = sv[i];
      for(var p in o){
        if(!c[p] || c[p] !== o[p]){
          return false;
        }
      }
    }
    return true;
  }
}

以下是我尝试的一些测试：

var sm = new StateMaker({x:10, y:10, rgb:[255,0,0], a:255});
sm.addState({more:'data', here:1}).save(); console.log(sm.states, sm.isSavedState()); sm.undo().addState({see:'it works'});
console.log(sm.states); sm.undo(); sm.redo(); console.log(sm.states, sm.canUndo, sm.canRedo, sm.savedStates, sm.isSavedState()); sm.save().undo().redo().save(); console.log('test', sm.savedStates);
while(sm.canUndo){
  sm.undo();
}
while(sm.canRedo){
  sm.redo();
}
console.log(sm.states, sm.canUndo);  console.log(sm.isSavedState());

注意：StateMakerIntstance.isSavedState()告诉你保存按钮是否应该变亮，因为StateMakerInstance.states和StateMakerInstance.savedStates是一样的。

这个想法是为了与 Canvas 一起工作。我基本上试图模仿 Komodo Edit 撤消、重做、保存行为（没有看到他们的代码），但它最终只会基于用户的画布操作。我的逻辑有什么问题吗？如果没有，不客气。

4

0 回答 0