import { HistoryNodeEvent , HistoryEventLevel , HistoryNodeOptionEvent , nodeEvent , nodeOptionEvent , } from '@/store/history/types' ; import { Node } from '@/components/node' ; import { RootStore } from '@/store/types' ; import { getNode } from '@/store/dataflow/helper' ; import { areBoxesEqual } from '@/common/util' ; export enum HistoryNodeEventType { MOVE = 'move' , RESIZE = 'resize' , TOGGLE_ICONIZED = 'setIconized' , TOGGLE_IN_VIS_MODE = 'setInVisMode' , TOGGLE_LABEL_VISIBLE = 'setLabelVisible' } export const moveNodeEvent = ( node , movedNodes , to , from ) : HistoryNodeEvent => { return { level : HistoryEventLevel . NODE , type : HistoryNodeEventType . MOVE , message : 'move ' + ( movedNodes . length > 1 ? 'nodes' : 'node' ) , nodeId : node . id , data : { movedNodeIds : movedNodes . map ( movedNode => movedNode . id ) , from , to } , icon : { value : 'fas fa-arrows-alt' } } ; } ; export const resizeNodeEvent = ( node , newView , prevView ) : HistoryNodeEvent => { return nodeEvent ( HistoryNodeEventType . RESIZE , 'resize node' , node , { prevView , newView } , { value : 'fas fa-expand-arrows-alt' } ) ; } ; export const toggleIconizedEvent = ( node , value ) : HistoryNodeOptionEvent => { return nodeOptionEvent ( HistoryNodeEventType . TOGGLE_ICONIZED , 'toggle iconizing' , node , node . setIconized , value , ! value , { value : 'fas fa-expand' } ) ; } ; export const toggleInVisModeEvent = ( node , value ) : HistoryNodeOptionEvent => { return nodeOptionEvent ( HistoryNodeEventType . TOGGLE_IN_VIS_MODE , 'toggle node in VisMode' , node , node . setInVisMode , value , ! value , { value : 'fas fa-tv' } ) ; } ; export const toggleLabelVisibleEvent = ( node , value ) : HistoryNodeOptionEvent => { return nodeOptionEvent ( HistoryNodeEventType . TOGGLE_LABEL_VISIBLE , 'toggle node label' , node , node . setLabelVisible , value , ! value , { value : 'fas fa-tag' } ) ; } ; export const moveNode = ( store , node , movedNodes , to , from ) => { if ( to . x === from . x && to . y === from . y ) { return ; } store . commit ( 'history/commit' , moveNodeEvent ( node , movedNodes , to , from ) ) ; } ; export const resizeNode = ( store , node , view , prevView ) => { if ( areBoxesEqual ( view , prevView ) ) { return ; } store . commit ( 'history/commit' , resizeNodeEvent ( node , view , prevView ) ) ; } ; const undoMoveNode = ( store , evt ) => { const from = evt . data . from ; const to = evt . data . to ; const nodes = store . state . dataflow . nodes . filter ( node => evt . data . movedNodeIds . indexOf ( node . id ) !== - 1 ) ; nodes . forEach ( node => node . moveBy ( from . x - to . x , from . y - to . y ) ) ; } ; const redoMoveNode = ( store , evt ) => { const from = evt . data . from ; const to = evt . data . to ; const nodes = store . state . dataflow . nodes . filter ( node => evt . data . movedNodeIds . indexOf ( node . id ) !== - 1 ) ; nodes . forEach ( node => node . moveBy ( to . x - from . x , to . y - from . y ) ) ; } ; const undoResizeNode = ( store , evt ) => { const from = evt . data . prevView ; const to = evt . data . newView ; const node = getNode ( evt . nodeId ) ; node . moveBy ( from . x - to . x , from . y - to . y ) ; node . setSize ( from . width , from . height ) ; } ; const redoResizeNode = ( store , evt ) => { const from = evt . data . prevView ; const to = evt . data . newView ; const node = getNode ( evt . nodeId ) ; node . moveBy ( to . x - from . x , to . y - from . y ) ; node . setSize ( to . width , to . height ) ; } ; export const undo = ( store , evt ) => { switch ( evt . type ) { case HistoryNodeEventType . MOVE : undoMoveNode ( store , evt ) ; break ; case HistoryNodeEventType . RESIZE : undoResizeNode ( store , evt ) ; break ; } const optionEvt = evt as HistoryNodeOptionEvent ; if ( optionEvt . setter || optionEvt . setterName ) { if ( optionEvt . setter ) { optionEvt . setter ( optionEvt . data . prevValue ) ; } else { const setter = ( getNode ( evt . nodeId ) as any ) [ optionEvt . setterName ] ; setter ( optionEvt . data . prevValue ) ; } } } ; export const redo = ( store , evt ) => { switch ( evt . type ) { case HistoryNodeEventType . MOVE : redoMoveNode ( store , evt ) ; break ; case HistoryNodeEventType . RESIZE : redoResizeNode ( store , evt ) ; break ; } const optionEvt = evt as HistoryNodeOptionEvent ; if ( optionEvt . setter || optionEvt . setterName ) { if ( optionEvt . setter ) { optionEvt . setter ( optionEvt . data . value ) ; } else { const setter = ( getNode ( evt . nodeId ) as any ) [ optionEvt . setterName ] ; setter ( optionEvt . data . value ) ; } } } ;