もとに戻す(Ctrl-z) や やり直す(Ctrl-y)って作業してるとよく使いますよね
この機能でよく思うことがもとに戻した後になにか操作をしてしまってやり直しボタンが押せなくなるのをなんとかしたい!
で、とりあえず作ってみました拡張Redo(やり直し)
全てのパターンを保存して分岐を選択できるようにしてます
この機能でよく思うことがもとに戻した後になにか操作をしてしまってやり直しボタンが押せなくなるのをなんとかしたい!
で、とりあえず作ってみました拡張Redo(やり直し)
全てのパターンを保存して分岐を選択できるようにしてます
とりあえず使える形にしたの↑
言葉だけだとわかりにくそうなので図も作ってみました
↓これがイヤ
なので~、こう!↓
作ってみた例はボタン押すタイプだからUndoとかの操作の後にテキストエリアにカーソル合わせ直すのがめんどうかな
あと、差分の説明出来る機能いれてるけど文字の差分を見つけるのが大変なのでRedo操作後の文字数っていうわかりにくい選択肢になってたり。。。
↓Undo、Redo部分のプログラム↓
function Cell(obj,msg,prev){ this.data = obj; this.prev = prev; this.next = []; this.msg = msg; } function List(){ this.state = null; } List.prototype = { "do" : function(data,title){ if(this.state === null){ var cell = new Cell(data,title,null); this.state = cell; }else{ var cell = new Cell(data,title,this.state); this.state.next.push(cell); this.state = cell; } }, "undo" : function(){ if(this.state.prev === null){ return null; }else{ this.state = this.state.prev; return this.state.data; } }, "redo" : function(num){ if(this.state.next.length === 0){ return null; }else if(this.state.next.length > 1){ if(num === undefined){ var array = []; this.state.next.forEach(function(e){array.push(e.msg);}); return {_select : array}; }else if(num > 0 && num <= this.state.next.length){ this.state = this.state.next[num-1]; return this.state.data; }else if(num === 0){ this.state = this.state.next[this.state.next.length-1]; return this.state.data; }else{ return null; } }else{ this.state = this.state.next[0]; return this.state.data; } } }; ///// var states = new List(); // まず最初に states.do(data,title); // 開始時と何か操作するごとに呼ぶ dataにその操作での変化とかを titleに操作がどんなのかわかるような説明を入れる var data = states.undo(); // もとに戻すときに呼ぶ doで入れたdataが返ってくるので返り値使ってUndo操作をする var data = states.redo(); // やり直すときに呼ぶ redo先が複数ある場合は引数を入れないと選択肢が返ってくる 返り値のオブジェクト内に_selectが存在する(undefinedでない)場合は複数選択あり
コメントする