split persistent reducers
This commit is contained in:
parent
856b1288be
commit
df44445720
|
@ -21,7 +21,7 @@ import {
|
||||||
receivePixelUpdate,
|
receivePixelUpdate,
|
||||||
receivePixelReturn,
|
receivePixelReturn,
|
||||||
} from './ui/placePixel';
|
} from './ui/placePixel';
|
||||||
import store from './store/configureStore';
|
import store from './store/store';
|
||||||
|
|
||||||
|
|
||||||
import renderApp from './components/App';
|
import renderApp from './components/App';
|
||||||
|
|
|
@ -224,7 +224,10 @@ const Chat = ({
|
||||||
<div
|
<div
|
||||||
className="modallink"
|
className="modallink"
|
||||||
key="nlipt"
|
key="nlipt"
|
||||||
onClick={() => dispatch(showUserAreaModal())}
|
onClick={(evt) => {
|
||||||
|
evt.stopPropagation();
|
||||||
|
dispatch(showUserAreaModal());
|
||||||
|
}}
|
||||||
style={{
|
style={{
|
||||||
textAlign: 'center',
|
textAlign: 'center',
|
||||||
fontSize: 13,
|
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
|
* resort the zIndex, remove gaps
|
||||||
*/
|
*/
|
||||||
|
@ -446,90 +494,53 @@ export default function windows(
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
case 'persist/REHYDRATE':
|
case 'persist/REHYDRATE': {
|
||||||
case 'WIN_RESIZE': {
|
const { showWindows } = state;
|
||||||
const {
|
if (!showWindows) {
|
||||||
innerWidth: width,
|
// don't persist on small screens
|
||||||
innerHeight: height,
|
return state;
|
||||||
} = window;
|
|
||||||
|
|
||||||
let { windows: newWindows, args, positions } = state;
|
|
||||||
const showWindows = width > SCREEN_WIDTH_THRESHOLD;
|
|
||||||
|
|
||||||
if (action.type === 'persist/REHYDRATE') {
|
|
||||||
console.log('persist', state, action.payload);
|
|
||||||
if (!showWindows) {
|
|
||||||
// reset on phones on every refresh
|
|
||||||
return initialState;
|
|
||||||
}
|
|
||||||
|
|
||||||
args = { ...args };
|
|
||||||
positions = { ...positions };
|
|
||||||
|
|
||||||
newWindows = newWindows.filter((win) => {
|
|
||||||
if (win.open && (win.fullscreen || showWindows)) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
// eslint-disable-next-line no-console
|
|
||||||
console.log(
|
|
||||||
`Cleaning up window from previous session: ${win.windowId}`,
|
|
||||||
);
|
|
||||||
delete args[win.windowId];
|
|
||||||
delete positions[win.windowId];
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const loadedState = {
|
||||||
|
...state,
|
||||||
|
...action.payload.windows,
|
||||||
|
};
|
||||||
|
const args = { ...loadedState.args };
|
||||||
|
const positions = { ...loadedState.positions };
|
||||||
|
|
||||||
|
const newWindows = loadedState.windows.filter((win) => {
|
||||||
|
if (win.open && (win.fullscreen || showWindows)) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
console.log(
|
||||||
|
`Cleaning up window from previous session: ${win.windowId}`,
|
||||||
|
);
|
||||||
|
delete args[win.windowId];
|
||||||
|
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) {
|
if (!showWindows) {
|
||||||
return {
|
return {
|
||||||
...state,
|
...state,
|
||||||
windows: newWindows,
|
|
||||||
showWindows,
|
showWindows,
|
||||||
args,
|
|
||||||
positions,
|
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
return correctPositions(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) {
|
|
||||||
positions = newPositions;
|
|
||||||
}
|
|
||||||
|
|
||||||
return {
|
|
||||||
...state,
|
|
||||||
windows: newWindows,
|
|
||||||
showWindows: true,
|
|
||||||
args,
|
|
||||||
positions,
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
case 'SET_WIN_TITLE': {
|
case 'SET_WIN_TITLE': {
|
||||||
const {
|
const {
|
||||||
windowId,
|
windowId,
|
||||||
|
|
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
|
* redux store
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/* eslint-disable no-console */
|
|
||||||
|
|
||||||
import {
|
import {
|
||||||
applyMiddleware, createStore, compose, combineReducers,
|
applyMiddleware, createStore, compose, combineReducers,
|
||||||
} from 'redux';
|
} from 'redux';
|
||||||
|
@ -11,17 +9,19 @@ import thunk from 'redux-thunk';
|
||||||
import { persistStore, persistReducer } from 'redux-persist';
|
import { persistStore, persistReducer } from 'redux-persist';
|
||||||
import storage from 'redux-persist/lib/storage';
|
import storage from 'redux-persist/lib/storage';
|
||||||
|
|
||||||
|
import sharedReducers, {
|
||||||
|
CURRENT_VERSION,
|
||||||
|
migrate,
|
||||||
|
} from './sharedReducers';
|
||||||
|
|
||||||
/*
|
/*
|
||||||
* reducers
|
* reducers
|
||||||
*/
|
*/
|
||||||
import canvas from './reducers/canvas';
|
|
||||||
import gui from './reducers/gui';
|
|
||||||
import windows from './reducers/windows';
|
import windows from './reducers/windows';
|
||||||
|
import canvas from './reducers/canvas';
|
||||||
import user from './reducers/user';
|
import user from './reducers/user';
|
||||||
import ranks from './reducers/ranks';
|
|
||||||
import alert from './reducers/alert';
|
import alert from './reducers/alert';
|
||||||
import chat from './reducers/chat';
|
import chat from './reducers/chat';
|
||||||
import chatRead from './reducers/chatRead';
|
|
||||||
import fetching from './reducers/fetching';
|
import fetching from './reducers/fetching';
|
||||||
|
|
||||||
/*
|
/*
|
||||||
|
@ -36,39 +36,22 @@ import notifications from './middleware/notifications';
|
||||||
import title from './middleware/title';
|
import title from './middleware/title';
|
||||||
import extensions from './middleware/extensions';
|
import extensions from './middleware/extensions';
|
||||||
|
|
||||||
const CURRENT_VERSION = 5;
|
const windowsPersist = persistReducer({
|
||||||
|
key: 'wind',
|
||||||
const reducers = persistReducer({
|
|
||||||
key: 'primary',
|
|
||||||
storage,
|
storage,
|
||||||
version: CURRENT_VERSION,
|
version: CURRENT_VERSION,
|
||||||
migrate: (state, version) => {
|
migrate,
|
||||||
console.log(state);
|
}, windows);
|
||||||
if (version !== CURRENT_VERSION) {
|
|
||||||
console.log('Newer version run, resetting store.');
|
const reducers = combineReducers({
|
||||||
return Promise.resolve({});
|
...sharedReducers,
|
||||||
}
|
windows: windowsPersist,
|
||||||
console.log(`Store version: ${version}`);
|
|
||||||
return Promise.resolve(state);
|
|
||||||
},
|
|
||||||
blacklist: [
|
|
||||||
'user',
|
|
||||||
'canvas',
|
|
||||||
'alert',
|
|
||||||
'chat',
|
|
||||||
'fetching',
|
|
||||||
],
|
|
||||||
}, combineReducers({
|
|
||||||
canvas,
|
canvas,
|
||||||
gui,
|
|
||||||
windows,
|
|
||||||
user,
|
user,
|
||||||
ranks,
|
|
||||||
alert,
|
alert,
|
||||||
chat,
|
chat,
|
||||||
chatRead,
|
|
||||||
fetching,
|
fetching,
|
||||||
}));
|
});
|
||||||
|
|
||||||
const store = createStore(
|
const store = createStore(
|
||||||
reducers,
|
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)
|
* Main Script for windows (pop-ups and stuff)
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import store from './store/configureStoreWin';
|
import store from './store/storeWin';
|
||||||
|
|
||||||
import renderAppWin from './components/AppWin';
|
import renderAppWin from './components/AppWin';
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue
Block a user