Browse Source

add wheel

pull/6/head
Casper Lamboo 4 years ago
parent
commit
ca4b886c93
  1. 5
      src/actions/index.js
  2. 18
      src/components/App.js
  3. 8
      src/reducer/index.js

5
src/actions/index.js

@ -84,6 +84,7 @@ export const TRACE_FLOOD_FILL = 'TRACE_FLOOD_FILL';
export const MENU_OPEN = 'MENU_OPEN';
export const MENU_CLOSE = 'MENU_CLOSE';
export const OPEN_SKETCH = 'OPEN_SKETCH';
export const SET_PREVENT_SCROLL = 'SET_PREVENT_SCROLL';
// CATEGORIES
// actions that influence selected objects
@ -496,3 +497,7 @@ export function menuClose(menuValue) {
export function openSketch(data) {
return { type: OPEN_SKETCH, data };
}
export function setPreventScroll(preventScroll) {
return { type: SET_PREVENT_SCROLL, preventScroll };
}

18
src/components/App.js

@ -75,7 +75,8 @@ class App extends React.Component {
selectAll: PropTypes.func.isRequired,
d2ChangeTool: PropTypes.func.isRequired,
moveSelection: PropTypes.func.isRequired,
selectedPen: PropTypes.string.isRequired
selectedPen: PropTypes.string.isRequired,
preventScroll: PropTypes.bool.isRequired
};
state = {
@ -87,14 +88,17 @@ class App extends React.Component {
if (!this.state.loaded) load.then(() => this.setState({ loaded: true }));
container.addEventListener('dragover', event => event.preventDefault());
container.addEventListener('dragover', this.dragOver);
container.addEventListener('drop', this.onDrop);
container.addEventListener('wheel', this.onWheel);
window.addEventListener('keydown', this.onKeyDown);
}
componentWillUnmount() {
const { container } = this.refs;
container.addEventListener('dragover', this.dragOver);
container.removeEventListener('drop', this.onDrop);
container.addEventListener('wheel', this.onWheel);
window.removeEventListener('keydown', this.onKeyDown);
}
@ -209,6 +213,15 @@ class App extends React.Component {
}
}
onWheel = (event) => {
const { preventScroll } = this.props;
if (preventScroll) event.preventDefault();
};
dragover = (event) => {
event.preventDefault();
};
render() {
const { classes, undo, redo } = this.props;
const { loaded } = this.state;
@ -233,6 +246,7 @@ class App extends React.Component {
}
export default injectSheet(styles)(connect(state => ({
preventScroll: state.sketcher.present.preventScroll,
selectedPen: state.sketcher.present.menus['pen-tools'].selected
}), {
undo: actions.undo.undo,

8
src/reducer/index.js

@ -95,7 +95,8 @@ const initialState = {
},
camera: defaultCamera
},
menus: menusReducer(undefined, {})
menus: menusReducer(undefined, {}),
preventScroll: true
};
function sketcherReducer(state = initialState, action) {
@ -246,6 +247,11 @@ function sketcherReducer(state = initialState, action) {
objectsById: { [action.id]: { transform: { $set: action.transform } } }
});
case actions.SET_PREVENT_SCROLL:
return update(state, {
preventScroll: { $set: action.preventScroll }
});
default:
return state;
}

Loading…
Cancel
Save