split persistent reducers
This commit is contained in:
parent
856b1288be
commit
df44445720
|
@ -21,7 +21,7 @@ import {
|
|||
receivePixelUpdate,
|
||||
receivePixelReturn,
|
||||
} from './ui/placePixel';
|
||||
import store from './store/configureStore';
|
||||
import store from './store/store';
|
||||
|
||||
|
||||
import renderApp from './components/App';
|
||||
|
|
|
@ -224,7 +224,10 @@ const Chat = ({
|
|||
<div
|
||||
className="modallink"
|
||||
key="nlipt"
|
||||
onClick={() => dispatch(showUserAreaModal())}
|
||||
onClick={(evt) => {
|
||||
evt.stopPropagation();
|
||||
dispatch(showUserAreaModal());
|
||||
}}
|
||||
style={{
|
||||
textAlign: 'center',
|
||||
fontSize: 13,
|
||||
|
|
|
@ -1,68 +0,0 @@
|
|||
/*
|
||||
* redux store for windows / popups
|
||||
*/
|
||||
|
||||
/* eslint-disable no-console */
|
||||
|
||||
import {
|
||||
applyMiddleware, createStore, compose, combineReducers,
|
||||
} from 'redux';
|
||||
import thunk from 'redux-thunk';
|
||||
import { persistStore, persistReducer } from 'redux-persist';
|
||||
import storage from 'redux-persist/lib/storage';
|
||||
|
||||
/*
|
||||
* reducers
|
||||
*/
|
||||
import canvas from './reducers/canvas';
|
||||
import gui from './reducers/gui';
|
||||
import win from './reducers/win';
|
||||
|
||||
/*
|
||||
* middleware
|
||||
*/
|
||||
import promise from './middleware/promise';
|
||||
|
||||
const CURRENT_VERSION = 3;
|
||||
|
||||
const reducers = persistReducer({
|
||||
key: 'primary',
|
||||
storage,
|
||||
version: CURRENT_VERSION,
|
||||
migrate: (state, version) => {
|
||||
console.log(state);
|
||||
if (version !== CURRENT_VERSION) {
|
||||
console.log('Newer version run, resetting store.');
|
||||
return Promise.resolve({});
|
||||
}
|
||||
console.log(`Store version: ${version}`);
|
||||
return Promise.resolve(state);
|
||||
},
|
||||
blacklist: [
|
||||
'canvas',
|
||||
'win',
|
||||
],
|
||||
}, combineReducers({
|
||||
canvas,
|
||||
gui,
|
||||
win,
|
||||
}));
|
||||
|
||||
const store = createStore(
|
||||
reducers,
|
||||
undefined,
|
||||
compose(
|
||||
applyMiddleware(
|
||||
thunk,
|
||||
promise,
|
||||
),
|
||||
),
|
||||
);
|
||||
|
||||
|
||||
export const persistor = persistStore(store);
|
||||
|
||||
export default store;
|
||||
|
||||
|
||||
// persistent stores: gui, windows, ranks, chatRead;
|
|
@ -68,6 +68,54 @@ function clampPos(prefXPos, prefYPos, width, height) {
|
|||
];
|
||||
}
|
||||
|
||||
/*
|
||||
* correct window positions according to screensize
|
||||
* to make sure that none if off-screen
|
||||
*/
|
||||
function correctPositions(state) {
|
||||
const {
|
||||
innerWidth: width,
|
||||
innerHeight: height,
|
||||
} = window;
|
||||
|
||||
const { windows: newWindows, positions } = state;
|
||||
const xMax = width - SCREEN_MARGIN_EW;
|
||||
const yMax = height - SCREEN_MARGIN_S;
|
||||
|
||||
let modified = false;
|
||||
const newPositions = {};
|
||||
for (let i = 0; i < newWindows.length; i += 1) {
|
||||
const id = newWindows[i].windowId;
|
||||
const {
|
||||
xPos,
|
||||
yPos,
|
||||
width: winWidth,
|
||||
height: winHeight,
|
||||
} = positions[id];
|
||||
if (xPos > xMax || yPos > yMax
|
||||
|| width > winWidth || height > winHeight) {
|
||||
modified = true;
|
||||
newPositions[id] = {
|
||||
xPos: Math.min(xMax, xPos),
|
||||
yPos: Math.min(yMax, yPos),
|
||||
width: Math.min(winWidth, width - SCREEN_MARGIN_S),
|
||||
height: Math.min(winHeight, height - SCREEN_MARGIN_S),
|
||||
z: positions[id].z,
|
||||
};
|
||||
} else {
|
||||
newPositions[id] = positions[id];
|
||||
}
|
||||
}
|
||||
|
||||
if (!modified) {
|
||||
return state;
|
||||
}
|
||||
return {
|
||||
...state,
|
||||
positions: newPositions,
|
||||
};
|
||||
}
|
||||
|
||||
/*
|
||||
* resort the zIndex, remove gaps
|
||||
*/
|
||||
|
@ -446,27 +494,21 @@ export default function windows(
|
|||
};
|
||||
}
|
||||
|
||||
case 'persist/REHYDRATE':
|
||||
case 'WIN_RESIZE': {
|
||||
const {
|
||||
innerWidth: width,
|
||||
innerHeight: height,
|
||||
} = window;
|
||||
|
||||
let { windows: newWindows, args, positions } = state;
|
||||
const showWindows = width > SCREEN_WIDTH_THRESHOLD;
|
||||
|
||||
if (action.type === 'persist/REHYDRATE') {
|
||||
console.log('persist', state, action.payload);
|
||||
case 'persist/REHYDRATE': {
|
||||
const { showWindows } = state;
|
||||
if (!showWindows) {
|
||||
// reset on phones on every refresh
|
||||
return initialState;
|
||||
// don't persist on small screens
|
||||
return state;
|
||||
}
|
||||
|
||||
args = { ...args };
|
||||
positions = { ...positions };
|
||||
const loadedState = {
|
||||
...state,
|
||||
...action.payload.windows,
|
||||
};
|
||||
const args = { ...loadedState.args };
|
||||
const positions = { ...loadedState.positions };
|
||||
|
||||
newWindows = newWindows.filter((win) => {
|
||||
const newWindows = loadedState.windows.filter((win) => {
|
||||
if (win.open && (win.fullscreen || showWindows)) {
|
||||
return true;
|
||||
}
|
||||
|
@ -478,57 +520,26 @@ export default function windows(
|
|||
delete positions[win.windowId];
|
||||
return false;
|
||||
});
|
||||
|
||||
return sortWindows(correctPositions({
|
||||
...loadedState,
|
||||
windows: newWindows,
|
||||
args,
|
||||
positions,
|
||||
}));
|
||||
}
|
||||
|
||||
case 'WIN_RESIZE': {
|
||||
const showWindows = window.innerWidth > SCREEN_WIDTH_THRESHOLD;
|
||||
if (!showWindows) {
|
||||
return {
|
||||
...state,
|
||||
windows: newWindows,
|
||||
showWindows,
|
||||
args,
|
||||
positions,
|
||||
};
|
||||
}
|
||||
|
||||
const xMax = width - SCREEN_MARGIN_EW;
|
||||
const yMax = height - SCREEN_MARGIN_S;
|
||||
let modified = false;
|
||||
const newPositions = {};
|
||||
|
||||
for (let i = 0; i < newWindows.length; i += 1) {
|
||||
const id = newWindows[i].windowId;
|
||||
const {
|
||||
xPos,
|
||||
yPos,
|
||||
width: winWidth,
|
||||
height: winHeight,
|
||||
} = positions[id];
|
||||
if (xPos > xMax || yPos > yMax
|
||||
|| width > winWidth || height > winHeight) {
|
||||
modified = true;
|
||||
newPositions[id] = {
|
||||
xPos: Math.min(xMax, xPos),
|
||||
yPos: Math.min(yMax, yPos),
|
||||
width: Math.min(winWidth, width - SCREEN_MARGIN_S),
|
||||
height: Math.min(winHeight, height - SCREEN_MARGIN_S),
|
||||
z: positions[id].z,
|
||||
};
|
||||
} else {
|
||||
newPositions[id] = positions[id];
|
||||
}
|
||||
}
|
||||
if (modified) {
|
||||
positions = newPositions;
|
||||
return correctPositions(state);
|
||||
}
|
||||
|
||||
return {
|
||||
...state,
|
||||
windows: newWindows,
|
||||
showWindows: true,
|
||||
args,
|
||||
positions,
|
||||
};
|
||||
}
|
||||
|
||||
case 'SET_WIN_TITLE': {
|
||||
const {
|
||||
|
|
51
src/store/sharedReducers.js
Normal file
51
src/store/sharedReducers.js
Normal file
|
@ -0,0 +1,51 @@
|
|||
/*
|
||||
* reducers that are shared between pages
|
||||
*/
|
||||
|
||||
/* eslint-disable no-console */
|
||||
|
||||
import { persistReducer } from 'redux-persist';
|
||||
import storage from 'redux-persist/lib/storage';
|
||||
|
||||
import gui from './reducers/gui';
|
||||
import ranks from './reducers/ranks';
|
||||
import chatRead from './reducers/chatRead';
|
||||
|
||||
export const CURRENT_VERSION = 8;
|
||||
|
||||
export const migrate = (state, version) => {
|
||||
if (!state || version !== CURRENT_VERSION) {
|
||||
console.log('Newer version run, resetting store.');
|
||||
return Promise.resolve({});
|
||||
}
|
||||
console.log(`Store version: ${version}`);
|
||||
return Promise.resolve(state);
|
||||
};
|
||||
|
||||
const guiPersist = persistReducer({
|
||||
key: 'gui',
|
||||
storage,
|
||||
version: CURRENT_VERSION,
|
||||
migrate,
|
||||
blacklist: ['hover'],
|
||||
}, gui);
|
||||
|
||||
const ranksPersist = persistReducer({
|
||||
key: 'ranks',
|
||||
storage,
|
||||
version: CURRENT_VERSION,
|
||||
migrate,
|
||||
}, ranks);
|
||||
|
||||
const chatReadPersist = persistReducer({
|
||||
key: 'cr',
|
||||
storage,
|
||||
version: CURRENT_VERSION,
|
||||
migrate,
|
||||
}, chatRead);
|
||||
|
||||
export default {
|
||||
gui: guiPersist,
|
||||
ranks: ranksPersist,
|
||||
chatRead: chatReadPersist,
|
||||
};
|
|
@ -2,8 +2,6 @@
|
|||
* redux store
|
||||
*/
|
||||
|
||||
/* eslint-disable no-console */
|
||||
|
||||
import {
|
||||
applyMiddleware, createStore, compose, combineReducers,
|
||||
} from 'redux';
|
||||
|
@ -11,17 +9,19 @@ import thunk from 'redux-thunk';
|
|||
import { persistStore, persistReducer } from 'redux-persist';
|
||||
import storage from 'redux-persist/lib/storage';
|
||||
|
||||
import sharedReducers, {
|
||||
CURRENT_VERSION,
|
||||
migrate,
|
||||
} from './sharedReducers';
|
||||
|
||||
/*
|
||||
* reducers
|
||||
*/
|
||||
import canvas from './reducers/canvas';
|
||||
import gui from './reducers/gui';
|
||||
import windows from './reducers/windows';
|
||||
import canvas from './reducers/canvas';
|
||||
import user from './reducers/user';
|
||||
import ranks from './reducers/ranks';
|
||||
import alert from './reducers/alert';
|
||||
import chat from './reducers/chat';
|
||||
import chatRead from './reducers/chatRead';
|
||||
import fetching from './reducers/fetching';
|
||||
|
||||
/*
|
||||
|
@ -36,39 +36,22 @@ import notifications from './middleware/notifications';
|
|||
import title from './middleware/title';
|
||||
import extensions from './middleware/extensions';
|
||||
|
||||
const CURRENT_VERSION = 5;
|
||||
|
||||
const reducers = persistReducer({
|
||||
key: 'primary',
|
||||
const windowsPersist = persistReducer({
|
||||
key: 'wind',
|
||||
storage,
|
||||
version: CURRENT_VERSION,
|
||||
migrate: (state, version) => {
|
||||
console.log(state);
|
||||
if (version !== CURRENT_VERSION) {
|
||||
console.log('Newer version run, resetting store.');
|
||||
return Promise.resolve({});
|
||||
}
|
||||
console.log(`Store version: ${version}`);
|
||||
return Promise.resolve(state);
|
||||
},
|
||||
blacklist: [
|
||||
'user',
|
||||
'canvas',
|
||||
'alert',
|
||||
'chat',
|
||||
'fetching',
|
||||
],
|
||||
}, combineReducers({
|
||||
migrate,
|
||||
}, windows);
|
||||
|
||||
const reducers = combineReducers({
|
||||
...sharedReducers,
|
||||
windows: windowsPersist,
|
||||
canvas,
|
||||
gui,
|
||||
windows,
|
||||
user,
|
||||
ranks,
|
||||
alert,
|
||||
chat,
|
||||
chatRead,
|
||||
fetching,
|
||||
}));
|
||||
});
|
||||
|
||||
const store = createStore(
|
||||
reducers,
|
45
src/store/storeWin.js
Normal file
45
src/store/storeWin.js
Normal file
|
@ -0,0 +1,45 @@
|
|||
/*
|
||||
* redux store for windows / popups
|
||||
*/
|
||||
|
||||
/* eslint-disable no-console */
|
||||
|
||||
import {
|
||||
applyMiddleware, createStore, compose, combineReducers,
|
||||
} from 'redux';
|
||||
import thunk from 'redux-thunk';
|
||||
import { persistStore } from 'redux-persist';
|
||||
|
||||
/*
|
||||
* reducers
|
||||
*/
|
||||
import sharedReducers from './sharedReducers';
|
||||
import canvas from './reducers/canvas';
|
||||
import win from './reducers/win';
|
||||
|
||||
/*
|
||||
* middleware
|
||||
*/
|
||||
import promise from './middleware/promise';
|
||||
|
||||
const reducers = combineReducers({
|
||||
...sharedReducers,
|
||||
canvas,
|
||||
win,
|
||||
});
|
||||
|
||||
const store = createStore(
|
||||
reducers,
|
||||
undefined,
|
||||
compose(
|
||||
applyMiddleware(
|
||||
thunk,
|
||||
promise,
|
||||
),
|
||||
),
|
||||
);
|
||||
|
||||
|
||||
export const persistor = persistStore(store);
|
||||
|
||||
export default store;
|
|
@ -2,7 +2,7 @@
|
|||
* Main Script for windows (pop-ups and stuff)
|
||||
*/
|
||||
|
||||
import store from './store/configureStoreWin';
|
||||
import store from './store/storeWin';
|
||||
|
||||
import renderAppWin from './components/AppWin';
|
||||
|
||||
|
|
Loading…
Reference in New Issue
Block a user