From 30fc35507f3062b575528070e6fddb5192de3bc6 Mon Sep 17 00:00:00 2001 From: Jordan Eldredge Date: Fri, 7 Sep 2018 22:00:20 -0700 Subject: [PATCH] More type progress --- js/actionCreators/files.js | 14 ++--- js/reducers/{display.js => display.ts} | 18 ++++--- js/reducers/userInput.ts | 40 ++++++++++++++ js/types.ts | 72 +++++++++++++++++++++++++- 4 files changed, 129 insertions(+), 15 deletions(-) rename js/reducers/{display.js => display.ts} (84%) create mode 100644 js/reducers/userInput.ts diff --git a/js/actionCreators/files.js b/js/actionCreators/files.js index f5c0fdca..ddc9103e 100644 --- a/js/actionCreators/files.js +++ b/js/actionCreators/files.js @@ -99,12 +99,14 @@ export function setSkinFromArrayBuffer(arrayBuffer) { const skinData = await skinParser(arrayBuffer, JSZip); dispatch({ type: SET_SKIN_DATA, - skinImages: skinData.images, - skinColors: skinData.colors, - skinPlaylistStyle: skinData.playlistStyle, - skinCursors: skinData.cursors, - skinRegion: skinData.region, - skinGenLetterWidths: skinData.genLetterWidths + data: { + skinImages: skinData.images, + skinColors: skinData.colors, + skinPlaylistStyle: skinData.playlistStyle, + skinCursors: skinData.cursors, + skinRegion: skinData.region, + skinGenLetterWidths: skinData.genLetterWidths + } }); } catch (e) { console.error(e); diff --git a/js/reducers/display.js b/js/reducers/display.ts similarity index 84% rename from js/reducers/display.js rename to js/reducers/display.ts index 7f54574c..126bbd0a 100644 --- a/js/reducers/display.js +++ b/js/reducers/display.ts @@ -1,3 +1,4 @@ +import {DisplayState, Action } from "../types"; import { createSelector } from "reselect"; import { @@ -19,7 +20,7 @@ import { } from "../actionTypes"; import { DEFAULT_SKIN, VISUALIZER_ORDER } from "../constants"; -export const getVisualizationOrder = state => { +export const getVisualizationOrder = (state: DisplayState): Array => { return [...state.additionalVisualizers, ...VISUALIZER_ORDER]; }; @@ -52,7 +53,7 @@ const defaultDisplayState = { zIndex: 0 }; -const display = (state = defaultDisplayState, action) => { +const display = (state: DisplayState = defaultDisplayState, action: Action): DisplayState => { switch (action.type) { case TOGGLE_DOUBLESIZE_MODE: return { ...state, doubled: !state.doubled }; @@ -75,15 +76,16 @@ const display = (state = defaultDisplayState, action) => { case LOADED: return { ...state, loading: false }; case SET_SKIN_DATA: + const {data} = action; return { ...state, loading: false, - skinImages: action.skinImages, - skinColors: action.skinColors, - skinPlaylistStyle: action.skinPlaylistStyle, - skinCursors: action.skinCursors, - skinRegion: action.skinRegion, - skinGenLetterWidths: action.skinGenLetterWidths + skinImages: data.skinImages, + skinColors: data.skinColors, + skinPlaylistStyle: data.skinPlaylistStyle, + skinCursors: data.skinCursors, + skinRegion: data.skinRegion, + skinGenLetterWidths: data.skinGenLetterWidths }; case TOGGLE_VISUALIZER_STYLE: return { diff --git a/js/reducers/userInput.ts b/js/reducers/userInput.ts new file mode 100644 index 00000000..c9756686 --- /dev/null +++ b/js/reducers/userInput.ts @@ -0,0 +1,40 @@ +import { Action, UserInputState } from "../types"; +import { + SET_FOCUS, + SET_BAND_FOCUS, + SET_SCRUB_POSITION, + UNSET_FOCUS, + SET_USER_MESSAGE, + UNSET_USER_MESSAGE +} from "../actionTypes"; + +const defaultUserInput = { + focus: null, + bandFocused: null, + scrubPosition: 0, + userMessage: null +}; + +export const userInput = ( + state: UserInputState = defaultUserInput, + action: Action +): UserInputState => { + switch (action.type) { + case SET_FOCUS: + return { ...state, focus: action.input, bandFocused: null }; + case SET_BAND_FOCUS: + return { ...state, focus: action.input, bandFocused: action.bandFocused }; + case UNSET_FOCUS: + return { ...state, focus: null, bandFocused: null }; + case SET_SCRUB_POSITION: + return { ...state, scrubPosition: action.position }; + case SET_USER_MESSAGE: + return { ...state, userMessage: action.message }; + case UNSET_USER_MESSAGE: + return { ...state, userMessage: null }; + default: + return state; + } +}; + +export default userInput; diff --git a/js/types.ts b/js/types.ts index df85286e..7ff0838e 100644 --- a/js/types.ts +++ b/js/types.ts @@ -3,6 +3,22 @@ type Skin = { name: string; }; +type SkinImages = { + +} + +type Band = null; // TODO: Use a real type here. + +// TODO: Fill these out once we actually use them. +type SkinData = { + skinImages: SkinImages; + skinColors: null; + skinPlaylistStyle: null; + skinCursors: null; + skinRegion: null; + skinGenLetterWidths: null; + } + export type Action = | { type: "NETWORK_CONNECTED"; @@ -61,6 +77,7 @@ export type Action = } | { type: "SET_BAND_FOCUS"; input: string; + bandFocused: Band; } | { type: "UNSET_FOCUS"; } | { @@ -71,6 +88,41 @@ export type Action = message: string; } | { type: "UNSET_USER_MESSAGE"; + } | { + type: "TOGGLE_DOUBLESIZE_MODE"; + } | { + type: "TOGGLE_LLAMA_MODE"; + } | { + type: "STEP_MARQUEE"; + } | { + type: "DISABLE_MARQUEE"; + } | { + type: "STOP_WORKING"; + } | { + type: "START_WORKING"; + } | { + type: "CLOSE_WINAMP"; + } | { + type: "LOADING"; + } | { + type: "LOADED"; + } | { + type: "SET_SKIN_DATA"; + data: SkinData; + } | { + type: "TOGGLE_VISUALIZER_STYLE"; + } | { + type: "REGISTER_VISUALIZER"; + id: string; + } | { + type: "SET_PLAYLIST_SCROLL_POSITION"; + position: number; + } | { + type: "SET_Z_INDEX"; + zIndex: number; + } | { + type: "SET_DUMMY_VIZ_DATA"; + data: null; }; export interface SettingsState { @@ -97,7 +149,25 @@ export interface MediaState { export interface UserInputState { focus: string | null; // TODO: Convert this to an enum? - bandFocused: null; + bandFocused: Band; scrubPosition: number; userMessage: string | null; +} + +export interface DisplayState { + additionalVisualizers: Array; + visualizerStyle: number; + doubled: boolean; + llama: boolean; + disableMarquee: boolean; + marqueeStep: number; + skinImages: SkinImages; + skinColors: null; + skinPlaylistStyle: null; + working: boolean; + closed: boolean; + loading: boolean; + playlistScrollPosition: number; + zIndex: number + dummyVizData:null; // TODO: Figure out what kind of data this actually is. } \ No newline at end of file