import * as React from 'react' ; import { InteractionEvent } from 'shared/multiplayer/Events' ; import MultiplayerAffectorContainer from '../multiplayer/MultiplayerAffectorContainer' ; import TouchIndicator from './TouchIndicator' ; interface Props extends React . Props < any > { id ? : string ; onTouchChange : ( touches : any ) => any ; } interface State { clientInputs : { [ client ] : { [ id ] : number [ ] ; } ; } ; lastTouchSum : number ; mouseDown : boolean ; } export default class MultiTouchTrigger extends React . Component < Props , State > { constructor ( props ) { super ( props ) ; this . state = { clientInputs : { } , lastTouchSum : 0 , mouseDown : false } ; } public remoteEvent ( client , e ) { switch ( e . event ) { case 'touchstart' : case 'touchend' : case 'touchmove' : return this . processInput ( e . positions , client ) ; default : return ; } } private processInput ( xyArray , client ) { let touchSum = 0 ; const newInputs = { ... this . state . clientInputs } ; newInputs [ client ] = xyArray ; for ( const k of Object . keys ( newInputs ) ) { touchSum += Object . keys ( newInputs [ k ] ) . length ; } if ( touchSum !== this . state . lastTouchSum ) { this . props . onTouchChange ( Object . keys ( newInputs . local || { } ) . length ) ; } this . setState ( { lastTouchSum : touchSum , clientInputs : newInputs } ) ; } public render ( ) { return ( < MultiplayerAffectorContainer id = { this . props . id } className = "base_multi_touch_remote_affector" includeLocalInteractions = { true } onInteraction = { ( c , i ) => { this . remoteEvent ( c , i ) ; } } > < TouchIndicator clientInputs = { this . state . clientInputs } /> < /MultiplayerAffectorContainer>); } }