refactor store
This commit is contained in:
parent
2789cd2a54
commit
e105b8fa07
|
@ -5,7 +5,7 @@
|
||||||
// eslint-disable-next-line no-unused-vars
|
// eslint-disable-next-line no-unused-vars
|
||||||
import fetch from 'isomorphic-fetch'; // TODO put in the beggining with webpack!
|
import fetch from 'isomorphic-fetch'; // TODO put in the beggining with webpack!
|
||||||
|
|
||||||
import onKeyPress from './controls/keypress';
|
import createKeyPressHandler from './controls/keypress';
|
||||||
import {
|
import {
|
||||||
fetchMe,
|
fetchMe,
|
||||||
initTimer,
|
initTimer,
|
||||||
|
@ -22,7 +22,7 @@ import {
|
||||||
receivePixelUpdate,
|
receivePixelUpdate,
|
||||||
receivePixelReturn,
|
receivePixelReturn,
|
||||||
} from './ui/placePixel';
|
} from './ui/placePixel';
|
||||||
import store from './ui/store';
|
import store from './store/configureStore';
|
||||||
|
|
||||||
|
|
||||||
import renderApp from './components/App';
|
import renderApp from './components/App';
|
||||||
|
@ -121,8 +121,9 @@ function init() {
|
||||||
init();
|
init();
|
||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', () => {
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
renderApp(document.getElementById('app'));
|
renderApp(document.getElementById('app'), store);
|
||||||
|
|
||||||
|
const onKeyPress = createKeyPressHandler(store);
|
||||||
document.addEventListener('keydown', onKeyPress, false);
|
document.addEventListener('keydown', onKeyPress, false);
|
||||||
|
|
||||||
// garbage collection
|
// garbage collection
|
||||||
|
|
|
@ -1,6 +1,5 @@
|
||||||
/**
|
/**
|
||||||
*
|
* Main App
|
||||||
* @flow
|
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
@ -8,8 +7,6 @@ import { Provider } from 'react-redux';
|
||||||
import ReactDOM from 'react-dom';
|
import ReactDOM from 'react-dom';
|
||||||
import { IconContext } from 'react-icons';
|
import { IconContext } from 'react-icons';
|
||||||
|
|
||||||
import store from '../ui/store';
|
|
||||||
|
|
||||||
import Style from './Style';
|
import Style from './Style';
|
||||||
import CoordinatesBox from './CoordinatesBox';
|
import CoordinatesBox from './CoordinatesBox';
|
||||||
import CanvasSwitchButton from './buttons/CanvasSwitchButton';
|
import CanvasSwitchButton from './buttons/CanvasSwitchButton';
|
||||||
|
@ -41,7 +38,7 @@ const App = () => (
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
||||||
function renderApp(domParent) {
|
function renderApp(domParent, store) {
|
||||||
ReactDOM.render(
|
ReactDOM.render(
|
||||||
<Provider store={store}>
|
<Provider store={store}>
|
||||||
<App />
|
<App />
|
||||||
|
|
|
@ -2,7 +2,6 @@
|
||||||
* keypress actions
|
* keypress actions
|
||||||
*/
|
*/
|
||||||
import { t } from 'ttag';
|
import { t } from 'ttag';
|
||||||
import store from '../ui/store';
|
|
||||||
import copy from '../utils/clipboard';
|
import copy from '../utils/clipboard';
|
||||||
import {
|
import {
|
||||||
toggleGrid,
|
toggleGrid,
|
||||||
|
@ -16,7 +15,8 @@ import {
|
||||||
|
|
||||||
const usedKeys = ['g', 'h', 'x', 'm', 'r', 'p'];
|
const usedKeys = ['g', 'h', 'x', 'm', 'r', 'p'];
|
||||||
|
|
||||||
function onKeyPress(event) {
|
function createKeyPressHandler(store) {
|
||||||
|
return (event) => {
|
||||||
// ignore key presses if modal is open or chat is used
|
// ignore key presses if modal is open or chat is used
|
||||||
if (event.target.nodeName === 'INPUT'
|
if (event.target.nodeName === 'INPUT'
|
||||||
|| event.target.nodeName === 'TEXTAREA'
|
|| event.target.nodeName === 'TEXTAREA'
|
||||||
|
@ -95,6 +95,7 @@ function onKeyPress(event) {
|
||||||
break;
|
break;
|
||||||
default:
|
default:
|
||||||
}
|
}
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
export default onKeyPress;
|
export default createKeyPressHandler;
|
||||||
|
|
|
@ -1,8 +1,27 @@
|
||||||
import { applyMiddleware, createStore, compose } from 'redux';
|
import { applyMiddleware, createStore, compose } from 'redux';
|
||||||
import thunk from 'redux-thunk';
|
import thunk from 'redux-thunk';
|
||||||
import { persistStore } from 'redux-persist';
|
import { persistStore, persistCombineReducers } from 'redux-persist';
|
||||||
|
import localForage from 'localforage';
|
||||||
|
|
||||||
import audio from './middleware/audio';
|
/*
|
||||||
|
* reducers
|
||||||
|
*/
|
||||||
|
import audio from './reducers/audio';
|
||||||
|
import canvas from './reducers/canvas';
|
||||||
|
import gui from './reducers/gui';
|
||||||
|
import windows from './reducers/windows';
|
||||||
|
import user from './reducers/user';
|
||||||
|
import ranks from './reducers/ranks';
|
||||||
|
import alert from './reducers/alert';
|
||||||
|
import chat from './reducers/chat';
|
||||||
|
import contextMenu from './reducers/contextMenu';
|
||||||
|
import chatRead from './reducers/chatRead';
|
||||||
|
import fetching from './reducers/fetching';
|
||||||
|
|
||||||
|
/*
|
||||||
|
* middleware
|
||||||
|
*/
|
||||||
|
import audiom from './middleware/audio';
|
||||||
import socketClientHook from './middleware/socketClientHook';
|
import socketClientHook from './middleware/socketClientHook';
|
||||||
import rendererHook from './middleware/rendererHook';
|
import rendererHook from './middleware/rendererHook';
|
||||||
// import ads from './ads';
|
// import ads from './ads';
|
||||||
|
@ -12,8 +31,31 @@ import notifications from './middleware/notifications';
|
||||||
import title from './middleware/title';
|
import title from './middleware/title';
|
||||||
import placePixelControl from './middleware/placePixelControl';
|
import placePixelControl from './middleware/placePixelControl';
|
||||||
import extensions from './middleware/extensions';
|
import extensions from './middleware/extensions';
|
||||||
import reducers from './reducers';
|
|
||||||
|
|
||||||
|
const reducers = persistCombineReducers({
|
||||||
|
key: 'primary',
|
||||||
|
storage: localForage,
|
||||||
|
blacklist: [
|
||||||
|
'user',
|
||||||
|
'canvas',
|
||||||
|
'alert',
|
||||||
|
'chat',
|
||||||
|
'contextMenu',
|
||||||
|
'fetching',
|
||||||
|
],
|
||||||
|
}, {
|
||||||
|
audio,
|
||||||
|
canvas,
|
||||||
|
gui,
|
||||||
|
windows,
|
||||||
|
user,
|
||||||
|
ranks,
|
||||||
|
alert,
|
||||||
|
chat,
|
||||||
|
contextMenu,
|
||||||
|
chatRead,
|
||||||
|
fetching,
|
||||||
|
});
|
||||||
|
|
||||||
const store = createStore(
|
const store = createStore(
|
||||||
reducers,
|
reducers,
|
||||||
|
@ -23,7 +65,7 @@ const store = createStore(
|
||||||
thunk,
|
thunk,
|
||||||
promise,
|
promise,
|
||||||
array,
|
array,
|
||||||
audio,
|
audiom,
|
||||||
notifications,
|
notifications,
|
||||||
title,
|
title,
|
||||||
socketClientHook,
|
socketClientHook,
|
||||||
|
@ -35,11 +77,6 @@ const store = createStore(
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
||||||
export default function configureStore(onComplete) {
|
persistStore(store);
|
||||||
persistStore(store, null, () => {
|
|
||||||
if (onComplete) {
|
export default store;
|
||||||
onComplete(store);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
return store;
|
|
||||||
}
|
|
||||||
|
|
|
@ -1,42 +0,0 @@
|
||||||
/* @flow */
|
|
||||||
|
|
||||||
import { persistCombineReducers } from 'redux-persist';
|
|
||||||
import localForage from 'localforage';
|
|
||||||
import audio from './audio';
|
|
||||||
import canvas from './canvas';
|
|
||||||
import gui from './gui';
|
|
||||||
import windows from './windows';
|
|
||||||
import user from './user';
|
|
||||||
import ranks from './ranks';
|
|
||||||
import alert from './alert';
|
|
||||||
import chat from './chat';
|
|
||||||
import contextMenu from './contextMenu';
|
|
||||||
import chatRead from './chatRead';
|
|
||||||
import fetching from './fetching';
|
|
||||||
|
|
||||||
const config = {
|
|
||||||
key: 'primary',
|
|
||||||
storage: localForage,
|
|
||||||
blacklist: [
|
|
||||||
'user',
|
|
||||||
'canvas',
|
|
||||||
'alert',
|
|
||||||
'chat',
|
|
||||||
'contextMenu',
|
|
||||||
'fetching',
|
|
||||||
],
|
|
||||||
};
|
|
||||||
|
|
||||||
export default persistCombineReducers(config, {
|
|
||||||
audio,
|
|
||||||
canvas,
|
|
||||||
gui,
|
|
||||||
windows,
|
|
||||||
user,
|
|
||||||
ranks,
|
|
||||||
alert,
|
|
||||||
chat,
|
|
||||||
contextMenu,
|
|
||||||
chatRead,
|
|
||||||
fetching,
|
|
||||||
});
|
|
|
@ -1,10 +0,0 @@
|
||||||
/**
|
|
||||||
*
|
|
||||||
* @flow
|
|
||||||
*/
|
|
||||||
|
|
||||||
import configureStore from '../store/configureStore';
|
|
||||||
|
|
||||||
const store = configureStore(() => null);
|
|
||||||
|
|
||||||
export default store;
|
|
Loading…
Reference in New Issue
Block a user