diff --git a/src/redux/layout.js b/src/redux/layout.js new file mode 100644 index 000000000..f39e7667a --- /dev/null +++ b/src/redux/layout.js @@ -0,0 +1,64 @@ +var keyMirror = require('keymirror'); +var pickBy = require('lodash.pickBy'); + +var Types = { + SET_STATE: 'splash/activity/SET_LAYOUT', + SET_ERROR: 'splash/activity/SET_ERROR' +}; + +function reducer (state, action) { + if (typeof state === 'undefined') { + state = reducer.getInitialState(); + } + switch (action.type) { + case Types.SET_STATE: + return action.layout; + case Types.SET_ERROR: + return state; + default: + return state; + } +} + +reducer.Layouts = keyMirror({ + COLS4: null, + COLS6: null, + COLS8: null, + COLS12: null +}); + +reducer.mediaQueries = { + COLS4: window.matchMedia('screen and (max-width: 479px)'), + COLS6: window.matchMedia('screen and (min-width: 480px) and (max-width: 639px)'), + COLS8: window.matchMedia('screen and (min-width: 640px) and (max-width: 941px)'), + COLS12: window.matchMedia('screen and (min-width: 942px)') +}; + +reducer.getInitialState = function () { + return reducer.Layouts.COLS12; +}; + +reducer.setLayout = function (layout) { + return { + type: Types.SET_STATE, + layout: layout + }; +}; + +reducer.setLayoutError = function (error) { + return { + type: Types.SET_ERROR, + error: error + }; +}; + +reducer.getLayout = function () { + return function (dispatch) { + var matched = pickBy(reducer.mediaQueries, function (value, key) { //eslint-disable-line + return value.matches; + }); + dispatch(reducer.setLayout(Object.keys(matched)[0])); + }; +}; + +module.exports = reducer; diff --git a/src/redux/reducer.js b/src/redux/reducer.js index b7dd7b31d..e54baf0dc 100644 --- a/src/redux/reducer.js +++ b/src/redux/reducer.js @@ -5,10 +5,12 @@ var detailsReducer = require('./conference-details.js').detailsReducer; var permissionsReducer = require('./permissions.js').permissionsReducer; var sessionReducer = require('./session.js').sessionReducer; var tokenReducer = require('./token.js').tokenReducer; +var layout = require('./layout.js'); var appReducer = combineReducers({ session: sessionReducer, token: tokenReducer, + layout: layout, permissions: permissionsReducer, conferenceSchedule: scheduleReducer, conferenceDetails: detailsReducer