Renames
This commit is contained in:
parent
bfb8b622cc
commit
af2fdf75a2
|
@ -4,13 +4,13 @@ import _ from 'lodash';
|
|||
|
||||
import { Point } from './viewport';
|
||||
|
||||
interface TouchZoomHandlerProps {
|
||||
interface SingleTouchHandlerProps {
|
||||
updateZoom: (zoomFactor: number) => void;
|
||||
children: any;
|
||||
}
|
||||
|
||||
const TouchZoomHandler: react.FC<TouchZoomHandlerProps> = (
|
||||
props: TouchZoomHandlerProps
|
||||
const DoubleTouchHandler: react.FC<SingleTouchHandlerProps> = (
|
||||
props: SingleTouchHandlerProps
|
||||
) => {
|
||||
const initialTouchState = {
|
||||
state: 'up',
|
||||
|
@ -100,7 +100,7 @@ const TouchZoomHandler: react.FC<TouchZoomHandlerProps> = (
|
|||
|
||||
return (
|
||||
<div
|
||||
className='viewport'
|
||||
className='viewport single-touch-handler'
|
||||
onTouchStart={touchStartHandler}
|
||||
onTouchMove={throtteledTouchMoveHandler}
|
||||
onTouchEnd={touchEndHandler}
|
||||
|
@ -111,4 +111,4 @@ const TouchZoomHandler: react.FC<TouchZoomHandlerProps> = (
|
|||
);
|
||||
};
|
||||
|
||||
export default TouchZoomHandler;
|
||||
export default DoubleTouchHandler;
|
|
@ -4,13 +4,13 @@ import _ from 'lodash';
|
|||
|
||||
import { Point } from './viewport';
|
||||
|
||||
interface MouseShiftHandlerProps {
|
||||
interface MouseHandlerProps {
|
||||
updateShift: (shiftDelta: Point) => void;
|
||||
children: any;
|
||||
}
|
||||
|
||||
const MouseShiftHandler: react.FC<MouseShiftHandlerProps> = (
|
||||
props: MouseShiftHandlerProps
|
||||
const MouseHandler: react.FC<MouseHandlerProps> = (
|
||||
props: MouseHandlerProps
|
||||
) => {
|
||||
|
||||
const initialMouseState = {
|
||||
|
@ -88,4 +88,4 @@ const MouseShiftHandler: react.FC<MouseShiftHandlerProps> = (
|
|||
);
|
||||
};
|
||||
|
||||
export default MouseShiftHandler;
|
||||
export default MouseHandler;
|
|
@ -9,7 +9,7 @@ interface TouchShiftHandlerProps {
|
|||
children: any;
|
||||
}
|
||||
|
||||
const TouchShiftHandler: react.FC<TouchShiftHandlerProps> = (
|
||||
const SingleTouchHandler: react.FC<TouchShiftHandlerProps> = (
|
||||
props: TouchShiftHandlerProps
|
||||
) => {
|
||||
const initialTouchState = {
|
||||
|
@ -96,4 +96,4 @@ const TouchShiftHandler: react.FC<TouchShiftHandlerProps> = (
|
|||
);
|
||||
};
|
||||
|
||||
export default TouchShiftHandler;
|
||||
export default SingleTouchHandler;
|
|
@ -2,12 +2,12 @@ import react, { useCallback, useState } from 'react';
|
|||
|
||||
import _ from 'lodash';
|
||||
|
||||
import MouseShiftHandler from './mouse-shift-handler';
|
||||
import MouseHandler from './mouse-handler';
|
||||
import Layer from './layer';
|
||||
|
||||
import '../theme/viewport.css';
|
||||
import TouchShiftHandler from './touch-shift-handler';
|
||||
import TouchZoomHandler from './touch-zoom-handler';
|
||||
import SingleTouchHandler from './single-touch-handler';
|
||||
import DoubleTouchHandler from './double-touch-handler';
|
||||
|
||||
export interface Point {
|
||||
x: number;
|
||||
|
@ -41,15 +41,15 @@ const Viewport: react.FC<{}> = (props: {}) => {
|
|||
|
||||
return (
|
||||
<div className='viewport'>
|
||||
<MouseShiftHandler updateShift={updateShift}>
|
||||
<TouchShiftHandler updateShift={updateShift}>
|
||||
<TouchZoomHandler updateZoom={updateZoom}>
|
||||
<MouseHandler updateShift={updateShift}>
|
||||
<SingleTouchHandler updateShift={updateShift}>
|
||||
<DoubleTouchHandler updateZoom={updateZoom}>
|
||||
<Layer shift={shift} zoom={zoom}>
|
||||
<img src='/assets/background.jpg' alt='' />
|
||||
</Layer>
|
||||
</TouchZoomHandler>
|
||||
</TouchShiftHandler>
|
||||
</MouseShiftHandler>
|
||||
</DoubleTouchHandler>
|
||||
</SingleTouchHandler>
|
||||
</MouseHandler>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue