add disable scroll

This commit is contained in:
Casper Lamboo 2018-05-09 11:29:00 +02:00
parent ca4b886c93
commit b0c0063039
5 changed files with 39 additions and 15 deletions

View File

@ -85,6 +85,7 @@ export const MENU_OPEN = 'MENU_OPEN';
export const MENU_CLOSE = 'MENU_CLOSE'; export const MENU_CLOSE = 'MENU_CLOSE';
export const OPEN_SKETCH = 'OPEN_SKETCH'; export const OPEN_SKETCH = 'OPEN_SKETCH';
export const SET_PREVENT_SCROLL = 'SET_PREVENT_SCROLL'; export const SET_PREVENT_SCROLL = 'SET_PREVENT_SCROLL';
export const SET_DISABLE_SCROLL = 'SET_DISABLE_SCROLL';
// CATEGORIES // CATEGORIES
// actions that influence selected objects // actions that influence selected objects
@ -501,3 +502,7 @@ export function openSketch(data) {
export function setPreventScroll(preventScroll) { export function setPreventScroll(preventScroll) {
return { type: SET_PREVENT_SCROLL, preventScroll }; return { type: SET_PREVENT_SCROLL, preventScroll };
} }
export function setDisableScroll(disableScroll) {
return { type: SET_DISABLE_SCROLL, disableScroll };
}

View File

@ -5,7 +5,9 @@ import { MAX_ZOOM } from '../../constants/d2Constants.js';
export default function d2WheelZoomReducer(state, action) { export default function d2WheelZoomReducer(state, action) {
const { position, wheelDelta, screenMatrixContainer } = action; const { position, wheelDelta, screenMatrixContainer } = action;
const { canvasMatrix } = state.d2; const { d2: { canvasMatrix }, disableScroll } = state;
if (disableScroll) return state;
const targetScale = 1 + wheelDelta / -500; const targetScale = 1 + wheelDelta / -500;

View File

@ -20,9 +20,7 @@ const reducers = {
export default function toolReducer(state, action) { export default function toolReducer(state, action) {
// if (action.log !== false) debug(action.type); // if (action.log !== false) debug(action.type);
state = update(state, { state = cameraReducer(state, action);
d3: { camera: { $set: cameraReducer(state.d3.camera, action) } }
});
if (action.type === actions.D3_CHANGE_TOOL && action.tool !== state.d3.tool) { if (action.type === actions.D3_CHANGE_TOOL && action.tool !== state.d3.tool) {
state = update(state, { state = update(state, {

View File

@ -24,19 +24,22 @@ export function cameraReducer(state, action) {
switch (action.type) { switch (action.type) {
case actions.D3_MOUSE_WHEEL: { case actions.D3_MOUSE_WHEEL: {
if (state.disableScroll) return state;
const delta = new THREE.Vector3(0, 0, action.wheelDelta); const delta = new THREE.Vector3(0, 0, action.wheelDelta);
return zoom(state, delta); return update(state, {
d3: { camera: { $set: zoom(state.d3.camera, delta) } }
});
} }
case actions.D3_DRAG_START: { case actions.D3_DRAG_START: {
return update(state, { return update(state, {
state: { $set: CAMERA_STATES.ROTATE } d3: { camera: { state: { $set: CAMERA_STATES.ROTATE } } }
}); });
} }
case actions.D3_SECOND_DRAG_START: { case actions.D3_SECOND_DRAG_START: {
return update(state, { return update(state, {
state: { $set: CAMERA_STATES.PAN } d3: { camera: { state: { $set: CAMERA_STATES.PAN } } }
}); });
} }
@ -44,18 +47,24 @@ export function cameraReducer(state, action) {
case actions.D3_SECOND_DRAG: { case actions.D3_SECOND_DRAG: {
const movement = action.position.subtract(action.previousPosition); const movement = action.position.subtract(action.previousPosition);
switch (state.state) { switch (state.d3.camera.state) {
case CAMERA_STATES.ROTATE: { case CAMERA_STATES.ROTATE: {
const delta = new THREE.Vector3(-movement.x * ROTATION_SPEED, -movement.y * ROTATION_SPEED, 0); const delta = new THREE.Vector3(-movement.x * ROTATION_SPEED, -movement.y * ROTATION_SPEED, 0);
return rotate(state, delta); return update(state, {
d3: { camera: { $set: rotate(state.d3.camera, delta) } }
});
} }
case CAMERA_STATES.PAN: { case CAMERA_STATES.PAN: {
const delta = new THREE.Vector3(-movement.x, movement.y, 0); const delta = new THREE.Vector3(-movement.x, movement.y, 0);
return pan(state, delta); return update(state, {
d3: { camera: { $set: pan(state.d3.camera, delta) } }
});
} }
case CAMERA_STATES.ZOOM: { case CAMERA_STATES.ZOOM: {
const delta = new THREE.Vector3(0, 0, movement.y); const delta = new THREE.Vector3(0, 0, movement.y);
return zoom(state, delta); return update(state, {
d3: { camera: { $set: zoom(state.d3.camera, delta) } }
});
} }
default: default:
return state; return state;
@ -66,7 +75,7 @@ export function cameraReducer(state, action) {
case actions.D3_DRAG_END: case actions.D3_DRAG_END:
case actions.D3_SECOND_DRAG_END: case actions.D3_SECOND_DRAG_END:
return update(state, { return update(state, {
state: { $set: CAMERA_STATES.NONE } d3: { camera: { state: { $set: CAMERA_STATES.NONE } } }
}); });
case actions.D3_MULTITOUCH: { case actions.D3_MULTITOUCH: {
@ -74,7 +83,9 @@ export function cameraReducer(state, action) {
const prevDistance = action.previousPositions[0].distanceTo(action.previousPositions[1]); const prevDistance = action.previousPositions[0].distanceTo(action.previousPositions[1]);
const zoomDelta = new THREE.Vector3(0, 0, prevDistance - distance); const zoomDelta = new THREE.Vector3(0, 0, prevDistance - distance);
state = zoom(state, zoomDelta); state = update(state, {
d3: { camera: { $set: zoom(state.d3.camera, zoomDelta) } }
});
const offset0 = new THREE.Vector3( const offset0 = new THREE.Vector3(
-(action.positions[0].x - action.previousPositions[0].x), -(action.positions[0].x - action.previousPositions[0].x),
@ -88,7 +99,9 @@ export function cameraReducer(state, action) {
); );
const panDelta = offset0.add(offset1).multiplyScalar(0.5); const panDelta = offset0.add(offset1).multiplyScalar(0.5);
return pan(state, panDelta); return update(state, {
d3: { camera: { $set: pan(state.d3.camera, panDelta) } }
});
} }
default: default:

View File

@ -96,7 +96,8 @@ const initialState = {
camera: defaultCamera camera: defaultCamera
}, },
menus: menusReducer(undefined, {}), menus: menusReducer(undefined, {}),
preventScroll: true preventScroll: true,
disableScroll: false
}; };
function sketcherReducer(state = initialState, action) { function sketcherReducer(state = initialState, action) {
@ -252,6 +253,11 @@ function sketcherReducer(state = initialState, action) {
preventScroll: { $set: action.preventScroll } preventScroll: { $set: action.preventScroll }
}); });
case actions.SET_DISABLE_SCROLL:
return update(state, {
disableScroll: { $set: action.disableScroll }
});
default: default:
return state; return state;
} }