diff --git a/src/components/options-panel/tool-options-mirror/tool-options-mirror.vue b/src/components/options-panel/tool-options-mirror/tool-options-mirror.vue index 293f6ca..9636d08 100644 --- a/src/components/options-panel/tool-options-mirror/tool-options-mirror.vue +++ b/src/components/options-panel/tool-options-mirror/tool-options-mirror.vue @@ -71,7 +71,7 @@ export default { const store = this.$store; const commit = () => store.commit( "updateLayerEffects", { index, effects: newEffects }); commit(); - enqueueState( propName, { + enqueueState( `${propName}_${index}`, { undo() { store.commit( "updateLayerEffects", { index, effects: { mirrorX, mirrorY } }); }, diff --git a/src/components/options-panel/tool-options-rotate/tool-options-rotate.vue b/src/components/options-panel/tool-options-rotate/tool-options-rotate.vue index 96ce262..83d1fe3 100644 --- a/src/components/options-panel/tool-options-rotate/tool-options-rotate.vue +++ b/src/components/options-panel/tool-options-rotate/tool-options-rotate.vue @@ -36,6 +36,7 @@ import { mapGetters, mapMutations } from "vuex"; import ToolTypes, { MIN_ZOOM, MAX_ZOOM } from "@/definitions/tool-types"; import Slider from "@/components/ui/slider/slider"; +import { enqueueState } from "@/factories/history-state-factory"; import messages from "./messages.json"; import { degreesToRadians, radiansToDegrees } from "@/math/image-math"; @@ -59,10 +60,7 @@ export default { return radiansToDegrees( this.activeLayerEffects.rotation ); }, set( value ) { - this.updateLayerEffects({ - index: this.activeLayerIndex, - effects: { rotation: degreesToRadians( value % 360 ) } - }); + this.update( degreesToRadians( value % 360 )); } } }, @@ -70,6 +68,21 @@ export default { ...mapMutations([ "updateLayerEffects", ]), + update( rotation ) { + const oldRotation = this.activeLayerEffects.rotation; + const index = this.activeLayerIndex; + const store = this.$store; + const commit = () => store.commit( "updateLayerEffects", { index, effects: { rotation } }); + commit(); + enqueueState( `rotation_${index}`, { + undo() { + store.commit( "updateLayerEffects", { index, effects: { rotation: oldRotation } }); + }, + redo() { + commit(); + }, + }); + } }, }; diff --git a/src/factories/history-state-factory.js b/src/factories/history-state-factory.js index c54dbd8..b3d4380 100644 --- a/src/factories/history-state-factory.js +++ b/src/factories/history-state-factory.js @@ -37,6 +37,10 @@ export const flushQueue = () => { stateQueue.clear(); }; +// should only be called by history-module when performing undo +// this ensures that an enqueued state that is reverted within the ENQUEUE_TIMEOUT is restored +export const forceProcess = processQueue; + export const enqueueState = ( key, undoRedoState ) => { // new state is for the same property as the previously enqueued state // we can discard the previously enqueued states.redo in favour of this more actual one diff --git a/src/store/modules/history-module.js b/src/store/modules/history-module.js index b6fa8ec..405ef8d 100644 --- a/src/store/modules/history-module.js +++ b/src/store/modules/history-module.js @@ -21,6 +21,7 @@ * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ import UndoManager from "undo-manager"; +import { forceProcess } from "@/factories/history-state-factory"; const STATES_TO_SAVE = 99; @@ -76,6 +77,7 @@ const module = { * apply the previously stored state */ undo({ state, getters, commit }) { + forceProcess(); return new Promise( resolve => { if ( getters.canUndo ) { state.undoManager.undo();