[merge] dev and cfpMain

src/store/index.ts

@@ -0,0 +1,17 @@
+import Vue from 'vue';
+import Vuex from 'vuex';
+
+import { app } from './modules/app';
+import { menu } from './modules/menu';
+
+Vue.use(Vuex);
+
+export default new Vuex.Store({
+  state: {
+    version: ''
+  },
+  modules: {
+    app,
+    menu
+  }
+});

src/store/modules/app.ts

@@ -0,0 +1,106 @@
+import { ActionTree, GetterTree, MutationTree, Module } from 'vuex';
+
+import { AppState, ThemeType, DeviceType, AppMode } from '../types/app';
+import { RootState } from '../types/root';
+import * as mutationTypes from '../mutation-types';
+
+const namespaced: boolean = true;
+
+const state: AppState = {
+  mode: AppMode.WEB,
+  device: DeviceType.DESKTOP,
+  sight: {
+    offset: 0,
+    containerWidth: 0,
+    containerHeight: 0,
+    width: 0,
+    height: 0,
+    cols: 0,
+    rows: 0,
+    gap: 0
+  },
+  theme: ThemeType.LIGHT,
+  isPopup: false,
+  popupContent: '',
+  popupOffsetTop: 0,
+  validPopupTypes: ['SUBMIT_INFO', 'OPEN_SUBMIT', 'LOUDLY']
+};
+
+const getters: GetterTree<AppState, RootState> = {
+  mode: (state): AppState['mode'] => state.mode,
+  device: (state): AppState['device'] => state.device,
+  sight: (state): AppState['sight'] => state.sight,
+  theme: (state): AppState['theme'] => state.theme,
+  isPopup: (state): AppState['isPopup'] => state.isPopup,
+  popupContent: (state): AppState['popupContent'] => state.popupContent,
+  popupOffsetTop: (state): AppState['popupOffsetTop'] => state.popupOffsetTop,
+  validPopupTypes: (state): AppState['validPopupTypes'] => state.validPopupTypes
+};
+
+const actions: ActionTree<AppState, RootState> = {
+  toggleMode ({ commit }, mode: AppState['mode']): void {
+    commit(mutationTypes.APP_MODE, mode);
+  },
+
+  toggleDevice ({ commit }, device: AppState['device']): void {
+    commit(mutationTypes.APP_DEVICE, device);
+  },
+
+  toggleTheme ({ commit }, theme: AppState['theme']): void {
+    commit(mutationTypes.APP_THEME, theme);
+  },
+
+  togglePopup ({ commit }, status: AppState['isPopup']): void {
+    commit(mutationTypes.APP_POPUP, status);
+  },
+
+  togglePopupContent ({ commit }, data: AppState['popupContent']): void {
+    commit(mutationTypes.APP_POPUP_CONTENT, data);
+  },
+
+  setPopupOffsetTop ({ commit }, offset: AppState['popupOffsetTop']): void {
+    commit(mutationTypes.APP_POPUP_OFFSET_TOP, offset);
+  },
+
+  setSightMeasure ({ commit }, sight: AppState['sight']): void {
+    commit(mutationTypes.APP_SIGHT, sight);
+  }
+};
+
+const mutations: MutationTree<AppState> = {
+  [mutationTypes.APP_MODE] (state, mode: AppState['mode']) {
+    state.mode = mode;
+  },
+
+  [mutationTypes.APP_DEVICE] (state, device: AppState['device']) {
+    state.device = device;
+  },
+
+  [mutationTypes.APP_THEME] (state, theme: AppState['theme']) {
+    state.theme = theme;
+  },
+
+  [mutationTypes.APP_POPUP] (state, status: AppState['isPopup']) {
+    state.isPopup = status;
+  },
+
+  [mutationTypes.APP_POPUP_CONTENT] (state, data: AppState['popupContent']) {
+    state.popupContent = data;
+  },
+
+  [mutationTypes.APP_POPUP_OFFSET_TOP] (state, offset: AppState['popupOffsetTop']) {
+    state.popupOffsetTop = offset;
+  },
+
+  [mutationTypes.APP_SIGHT] (state, sight: AppState['sight']) {
+    state.sight = sight;
+  }
+};
+
+export const app: Module<AppState, RootState> = {
+  namespaced,
+  state,
+  getters,
+  actions,
+  mutations
+};

src/store/modules/menu.ts

@@ -0,0 +1,39 @@
+import { ActionTree, GetterTree, MutationTree, Module } from 'vuex';
+
+import { MenuState, MenuItem } from '../types/menu';
+import { RootState } from '../types/root';
+import * as mutationTypes from '../mutation-types';
+
+import { routes } from '../../router';
+
+const namespaced: boolean = true;
+
+const state: MenuState = {
+  menu: routes.filter((route) => route.meta.menuItem === true) as any,
+  toggle: false
+};
+
+const getters: GetterTree<MenuState, RootState> = {
+  menu: (state): MenuItem[] => state.menu,
+  toggle: (state): boolean => state.toggle
+};
+
+const actions: ActionTree<MenuState, RootState> = {
+  toggleMenu ({ commit }, status): void {
+    commit(mutationTypes.TOGGLE_MENU, status);
+  }
+};
+
+const mutations: MutationTree<MenuState> = {
+  [mutationTypes.TOGGLE_MENU] (state, status: boolean) {
+    state.toggle = status;
+  }
+};
+
+export const menu: Module<MenuState, RootState> = {
+  namespaced,
+  state,
+  getters,
+  actions,
+  mutations
+};

src/store/mutation-types.ts

@@ -0,0 +1,17 @@
+export const APP_MODE = 'APP_MODE';
+
+export const APP_DEVICE = 'APP_DEVICE';
+
+export const APP_THEME = 'APP_THEME';
+
+export const APP_SIGHT = 'APP_SIGHT';
+
+export const APP_POPUP = 'APP_POPUP';
+
+export const APP_POPUP_CONTENT = 'APP_POPUP_CONTENT';
+
+export const APP_POPUP_OFFSET_TOP = 'APP_POPUP_OFFSET_TOP';
+
+export const SUNRISE_SUNSET = 'SUNRISE_SUNSET';
+
+export const TOGGLE_MENU = 'TOGGLE_MENU';

src/store/types/app.ts

@@ -0,0 +1,36 @@
+import { SightState } from './sight';
+
+export interface AppState {
+  mode: AppMode;
+  device: DeviceType;
+  sight: SightState;
+  theme: ThemeType;
+  isPopup: boolean;
+  popupContent: string;
+  popupOffsetTop: number;
+  validPopupTypes: Array<keyof typeof PopupType>;
+}
+
+export enum AppMode {
+  WEB = 'web',
+  APP = 'app'
+}
+
+export enum DeviceType {
+  DESKTOP = 'desktop',
+  MOBILE = 'mobile'
+}
+
+export enum ThemeType {
+  LIGHT = 'light',
+  DARK = 'dark',
+  RAINBOW_LIGHT = 'rainbow-light',
+  RAINBOW_DARK = 'rainbow-dark'
+}
+
+export enum PopupType {
+  ANNOUNCEMENT = 'announcement',
+  SUBMIT_INFO = 'submitInfo',
+  OPEN_SUBMIT = 'openSubmit',
+  LOUDLY = 'loudly'
+}

src/store/types/menu.ts

@@ -0,0 +1,19 @@
+import Vue, { VueConstructor } from 'vue';
+
+export interface MenuState {
+  menu: MenuItem[];
+  toggle: boolean;
+}
+
+export interface MenuItem {
+  name: string;
+  path: string;
+  redirect?: string;
+  component?: VueConstructor<Vue>;
+  children?: MenuItem[];
+  meta: {
+    index?: number;
+    label?: string;
+    menuItem: boolean;
+  };
+}

src/store/types/root.ts

@@ -0,0 +1,3 @@
+export interface RootState {
+  version: string;
+}

src/store/types/sight.ts

@@ -0,0 +1,10 @@
+export interface SightState {
+  offset: number;
+  containerWidth: number;
+  containerHeight: number;
+  width: number;
+  height: number;
+  cols: number;
+  rows: number;
+  gap: number;
+}

src/store/types/sunRiseSunSet.ts

@@ -0,0 +1,20 @@
+export interface SunRiseSunSetState {
+  sunrise: Date;
+  sunset: Date;
+}
+
+export interface SunRiseSunSetAPIResponsePayload {
+  results: {
+    sunrise: Date;
+    sunset: Date;
+    solar_noon: Date;
+    day_length: number;
+    civil_twilight_begin: Date;
+    civil_twilight_end: Date;
+    nautical_twilight_begin: Date;
+    nautical_twilight_end: Date;
+    astronomical_twilight_begin: Date;
+    astronomical_twilight_end: Date;
+  };
+  status: string;
+}

src/store/types/template.ts

@@ -0,0 +1,6 @@
+export interface TemplateState {
+  announcement: string;
+  submitInfo: string;
+  openSubmit: string;
+  loudly: string;
+}