From 5852ce22c9dc74da81e1e2d03f09f45d166fd34f Mon Sep 17 00:00:00 2001 From: Jordan Eldredge Date: Tue, 18 Sep 2018 07:54:34 -0700 Subject: [PATCH] Move reduer state types into reducers --- js/reducers/display.ts | 52 +++++++++++++++++------ js/reducers/equalizer.ts | 8 +++- js/reducers/media.ts | 16 ++++++- js/reducers/network.ts | 6 ++- js/reducers/playlist.ts | 13 +++++- js/reducers/settings.ts | 6 ++- js/reducers/userInput.ts | 9 +++- js/reducers/windows.ts | 8 +++- js/types.ts | 92 +++++++--------------------------------- 9 files changed, 113 insertions(+), 97 deletions(-) diff --git a/js/reducers/display.ts b/js/reducers/display.ts index b8d8cd31..7d3982d5 100644 --- a/js/reducers/display.ts +++ b/js/reducers/display.ts @@ -1,4 +1,11 @@ -import { DisplayState, Action } from "../types"; +import { + Action, + SkinImages, + Cursors, + SkinRegion, + GenLetterWidths, + PlaylistStyle +} from "../types"; import { createSelector } from "reselect"; import { @@ -20,17 +27,26 @@ import { } from "../actionTypes"; import { DEFAULT_SKIN, VISUALIZER_ORDER } from "../constants"; -export const getVisualizationOrder = (state: DisplayState): Array => { - return [...state.additionalVisualizers, ...VISUALIZER_ORDER]; -}; - -export const getVisualizerStyle = createSelector( - getVisualizationOrder, - state => state.visualizerStyle, - (visualizationOrder, visualizationStyle) => { - return visualizationOrder[visualizationStyle]; - } -); +export interface DisplayState { + additionalVisualizers: Array; + visualizerStyle: number; + doubled: boolean; + llama: boolean; + disableMarquee: boolean; + marqueeStep: number; + skinImages: SkinImages; + skinCursors: Cursors | null; + skinRegion: SkinRegion; + skinGenLetterWidths: GenLetterWidths | null; + skinColors: string[]; // Theoretically this could be a tuple of a specific length + skinPlaylistStyle: PlaylistStyle | null; + working: boolean; + closed: boolean; + loading: boolean; + playlistScrollPosition: number; + zIndex: number; + dummyVizData: null; // TODO: Figure out what kind of data this actually is. +} const defaultDisplayState = { doubled: false, @@ -112,3 +128,15 @@ const display = ( } }; export default display; + +export const getVisualizationOrder = (state: DisplayState): Array => { + return [...state.additionalVisualizers, ...VISUALIZER_ORDER]; +}; + +export const getVisualizerStyle = createSelector( + getVisualizationOrder, + state => state.visualizerStyle, + (visualizationOrder, visualizationStyle) => { + return visualizationOrder[visualizationStyle]; + } +); diff --git a/js/reducers/equalizer.ts b/js/reducers/equalizer.ts index 172a7482..561a7a27 100644 --- a/js/reducers/equalizer.ts +++ b/js/reducers/equalizer.ts @@ -1,4 +1,4 @@ -import { EqualizerState, Action } from "./../types"; +import { Slider, Action } from "./../types"; import { BANDS } from "../constants"; import { @@ -8,6 +8,12 @@ import { SET_EQ_OFF } from "../actionTypes"; +export interface EqualizerState { + on: boolean; + auto: boolean; + sliders: Record; +} + const defaultState = { on: true, auto: false, diff --git a/js/reducers/media.ts b/js/reducers/media.ts index 8ff868f3..b9347c81 100644 --- a/js/reducers/media.ts +++ b/js/reducers/media.ts @@ -1,4 +1,4 @@ -import { MediaState, Action } from "../types"; +import { Action } from "../types"; import { PLAY, STOP, @@ -17,6 +17,20 @@ import { } from "../actionTypes"; import { TIME_MODE, MEDIA_STATUS } from "../constants"; +export interface MediaState { + timeMode: string; // TODO: Convert this to an enum + timeElapsed: number; + length: number | null; + kbps: string | null; + khz: string | null; + volume: number; + balance: number; + channels: number | null; // TODO: Convert this to an enum + shuffle: boolean; + repeat: boolean; + status: string | null; // TODO: Convert this to an enum +} + const defaultState = { timeMode: TIME_MODE.ELAPSED, timeElapsed: 0, diff --git a/js/reducers/network.ts b/js/reducers/network.ts index 68e60ed9..1d9e645e 100644 --- a/js/reducers/network.ts +++ b/js/reducers/network.ts @@ -1,6 +1,10 @@ -import { Action, NetworkState } from "../types"; +import { Action } from "../types"; import { NETWORK_CONNECTED, NETWORK_DISCONNECTED } from "../actionTypes"; +export interface NetworkState { + connected: boolean; +} + const network = ( state: NetworkState = { connected: true }, action: Action diff --git a/js/reducers/playlist.ts b/js/reducers/playlist.ts index a56d169d..e45ae7d0 100644 --- a/js/reducers/playlist.ts +++ b/js/reducers/playlist.ts @@ -1,4 +1,4 @@ -import { PlaylistState, PlaylistTrack, Action } from "../types"; +import { PlaylistTrack, Action } from "../types"; import { SET_MEDIA, CLICKED_TRACK, @@ -26,7 +26,16 @@ import { MEDIA_TAG_REQUEST_STATUS } from "../constants"; import { filenameFromUrl } from "../fileUtils"; import { shuffle, moveSelected, objectMap, objectFilter } from "../utils"; -const defaultPlaylistState = { +export interface PlaylistState { + trackOrder: number[]; + // https://github.com/Microsoft/TypeScript/pull/12253#issuecomment-263132208 + // TODO: Using numbers for keys is kinda annoying. Consider retyping as string + tracks: { [id: number]: PlaylistTrack }; + lastSelectedIndex: number | null; + currentTrack: number | null; +} + +const defaultPlaylistState: PlaylistState = { trackOrder: [], currentTrack: null, tracks: {}, diff --git a/js/reducers/settings.ts b/js/reducers/settings.ts index 84cad37c..781b3f77 100644 --- a/js/reducers/settings.ts +++ b/js/reducers/settings.ts @@ -1,6 +1,10 @@ -import { Action, SettingsState } from "../types"; +import { Action, Skin } from "../types"; import { SET_AVAILABLE_SKINS } from "../actionTypes"; +export interface SettingsState { + availableSkins: Array; +} + const defaultSettingsState = { availableSkins: [] }; diff --git a/js/reducers/userInput.ts b/js/reducers/userInput.ts index c9756686..772f8f32 100644 --- a/js/reducers/userInput.ts +++ b/js/reducers/userInput.ts @@ -1,4 +1,4 @@ -import { Action, UserInputState } from "../types"; +import { Action, Band } from "../types"; import { SET_FOCUS, SET_BAND_FOCUS, @@ -8,6 +8,13 @@ import { UNSET_USER_MESSAGE } from "../actionTypes"; +export interface UserInputState { + focus: string | null; // TODO: Convert this to an enum? + bandFocused: Band | null; + scrubPosition: number; + userMessage: string | null; +} + const defaultUserInput = { focus: null, bandFocused: null, diff --git a/js/reducers/windows.ts b/js/reducers/windows.ts index 1cdcf9e6..9a1137f7 100644 --- a/js/reducers/windows.ts +++ b/js/reducers/windows.ts @@ -1,4 +1,4 @@ -import { WindowState, Action } from "../types"; +import { WebampWindow, WindowPositions, Action } from "../types"; import { WINDOWS } from "../constants"; import { SET_FOCUSED_WINDOW, @@ -11,6 +11,12 @@ import { TOGGLE_WINDOW_SHADE_MODE } from "../actionTypes"; +export interface WindowState { + focused: string; + genWindows: { [name: string]: WebampWindow }; + positions: WindowPositions; +} + const defaultWindowsState: WindowState = { focused: WINDOWS.MAIN, genWindows: { diff --git a/js/types.ts b/js/types.ts index 94b95c89..dc9dc3c9 100644 --- a/js/types.ts +++ b/js/types.ts @@ -1,4 +1,13 @@ -type Skin = { +import { PlaylistState } from "./reducers/playlist"; +import { SettingsState } from "./reducers/settings"; +import { UserInputState } from "./reducers/userInput"; +import { MediaState } from "./reducers/media"; +import { DisplayState } from "./reducers/display"; +import { WindowState } from "./reducers/windows"; +import { EqualizerState } from "./reducers/equalizer"; +import { NetworkState } from "./reducers/network"; + +export type Skin = { url: string; name: string; }; @@ -19,18 +28,18 @@ export type Slider = Band | "preamp"; // TODO: Use a type to ensure these keys mirror the CURSORS constant in // skinParser.js -type Cursors = { [cursor: string]: string }; +export type Cursors = { [cursor: string]: string }; -type GenLetterWidths = { [letter: string]: number }; +export type GenLetterWidths = { [letter: string]: number }; // TODO: Use a type to ensure the keys are one of the known values in PLEDIT.txt -type PlaylistStyle = { [state: string]: string }; +export type PlaylistStyle = { [state: string]: string }; // TODO: Type these keys. -type SkinImages = { [sprite: string]: string }; +export type SkinImages = { [sprite: string]: string }; // TODO: type these keys -type SkinRegion = { [windowName: string]: string[] }; +export type SkinRegion = { [windowName: string]: string[] }; export type WindowId = string; @@ -329,62 +338,6 @@ export type Action = type: "MINIMIZE_WINAMP"; }; -export interface SettingsState { - availableSkins: Array; -} - -export interface NetworkState { - connected: boolean; -} - -export interface MediaState { - timeMode: string; // TODO: Convert this to an enum - timeElapsed: number; - length: number | null; - kbps: string | null; - khz: string | null; - volume: number; - balance: number; - channels: number | null; // TODO: Convert this to an enum - shuffle: boolean; - repeat: boolean; - status: string | null; // TODO: Convert this to an enum -} - -export interface UserInputState { - focus: string | null; // TODO: Convert this to an enum? - bandFocused: Band | null; - scrubPosition: number; - userMessage: string | null; -} - -export interface DisplayState { - additionalVisualizers: Array; - visualizerStyle: number; - doubled: boolean; - llama: boolean; - disableMarquee: boolean; - marqueeStep: number; - skinImages: SkinImages; - skinCursors: Cursors | null; - skinRegion: SkinRegion; - skinGenLetterWidths: GenLetterWidths | null; - skinColors: string[]; // Theoretically this could be a tuple of a specific length - skinPlaylistStyle: PlaylistStyle | null; - working: boolean; - closed: boolean; - loading: boolean; - playlistScrollPosition: number; - zIndex: number; - dummyVizData: null; // TODO: Figure out what kind of data this actually is. -} - -export interface EqualizerState { - on: boolean; - auto: boolean; - sliders: Record; -} - export interface WebampWindow { title: string; size: [number, number]; @@ -406,12 +359,6 @@ export interface WindowInfo { y: number; } -export interface WindowState { - focused: string; - genWindows: { [name: string]: WebampWindow }; - positions: WindowPositions; -} - export type MediaTagRequestStatus = | "INITIALIZED" | "FAILED" @@ -490,15 +437,6 @@ export interface PlaylistTrack { duration: number | null; } -export interface PlaylistState { - trackOrder: number[]; - // https://github.com/Microsoft/TypeScript/pull/12253#issuecomment-263132208 - // TODO: Using numbers for keys is kinda annoying. Consider retyping as string - tracks: { [id: number]: PlaylistTrack }; - lastSelectedIndex: number | null; - currentTrack: number | null; -} - export interface AppState { userInput: UserInputState; windows: WindowState;