diff --git a/src/app/actions/code/Submission.ts b/src/app/actions/code/Submission.ts index a539781d..5bfd78b4 100644 --- a/src/app/actions/code/Submission.ts +++ b/src/app/actions/code/Submission.ts @@ -1,4 +1,5 @@ import * as SubmissionInterfaces from 'app/types/code/Submission'; +import * as SubmitBarInterfaces from 'app/types/SubmitBar'; import { action } from 'typesafe-actions'; export namespace SubmissionActions { @@ -12,6 +13,7 @@ export namespace SubmissionActions { HANDLE_EXECUTE_ERROR = 'HANDLE_EXECUTE_ERROR', HANDLE_DEBUG_RUN_SUCCESS = 'HANDLE_DEBUG_RUN_SUCCESS', HANDLE_DEBUG_RUN_ERROR = 'HANDLE_DEBUG_RUN_ERROR', + UPDATE_MAP = 'UPDATE_MAP', UPDATE_MAP_ID = 'UPDATE_MAP_ID', UPDATE_CURRENT_AI_ID = 'UPDATE_CURRENT_AI_ID', UPDATE_DEBUG_RUN_REQUEST = 'UPDATE_DEBUG_RUN_REQUEST', @@ -58,6 +60,8 @@ export namespace SubmissionActions { export const handleDebugRunError = () => action(Type.HANDLE_EXECUTE_ERROR); + export const updateMap = (map: SubmitBarInterfaces.Map) => action(Type.UPDATE_MAP, { map }); + export const updateMapId = (mapId: number) => action(Type.UPDATE_MAP_ID, { mapId }); export const updateCurrentAiId = (aiId: number) => action(Type.UPDATE_CURRENT_AI_ID, { aiId }); diff --git a/src/app/components/SubmitBar/index.tsx b/src/app/components/SubmitBar/index.tsx index 3eb01c1f..700ce3cf 100644 --- a/src/app/components/SubmitBar/index.tsx +++ b/src/app/components/SubmitBar/index.tsx @@ -4,6 +4,7 @@ import { faCodeBranch, faCog, faLock, + faMap, faPlay, faSave, faTrash, @@ -22,15 +23,37 @@ export class SubmitBar extends React.Component< SubmitBarInterfaces.Props, SubmitBarInterfaces.State > { + private faqBodyStyle = { + maxHeight: '0', + }; constructor(props: SubmitBarInterfaces.Props) { super(props); this.state = { commitMessage: '', isCommitMessageBoxOpen: false, + isMapOptionsOpen: false, isRunOptionsOpen: false, }; } + public expandDropDown = () => { + const { isMapOptionsOpen } = this.state; + + if (!isMapOptionsOpen) { + this.faqBodyStyle = { + maxHeight: '168px', + }; + } else { + this.faqBodyStyle = { + maxHeight: '0px', + }; + } + + this.setState({ + isMapOptionsOpen: !isMapOptionsOpen, + }); + }; + public render() { const { saveCode, @@ -42,8 +65,15 @@ export class SubmitBar extends React.Component< aiIds, clearLogs, debugRunAvailable, + map, + updateMap, } = this.props; - const { commitMessage, isCommitMessageBoxOpen, isRunOptionsOpen } = this.state; + const { + commitMessage, + isCommitMessageBoxOpen, + isMapOptionsOpen, + isRunOptionsOpen, + } = this.state; return (
{ + this.setState({ isMapOptionsOpen: !isMapOptionsOpen }); + }} > + +
); } diff --git a/src/app/containers/SubmitBar.ts b/src/app/containers/SubmitBar.ts index 81bea360..04a9885f 100644 --- a/src/app/containers/SubmitBar.ts +++ b/src/app/containers/SubmitBar.ts @@ -10,6 +10,7 @@ const mapStateToProps = (rootState: RootState) => { return { aiIds: rootState.submission.aiIds, debugRunAvailable: rootState.submission.debugRunRequest !== Request.NONE, + map: rootState.submission.selectedMap, maps: rootState.submission.maps, }; }; @@ -29,6 +30,7 @@ const mapDispatchToProps = (dispatch: Dispatch) => { lockCode: () => dispatch(SubmissionActions.lockCode()), saveCode: () => dispatch(CodeActions.save()), selfMatch: (mapId: number) => dispatch(SubmissionActions.selfMatch(mapId)), + updateMap: (map: SubmitBarInterfaces.Map) => dispatch(SubmissionActions.updateMap(map)), }; }; diff --git a/src/app/reducers/code/Submission.ts b/src/app/reducers/code/Submission.ts index 5f565651..27bdee9f 100644 --- a/src/app/reducers/code/Submission.ts +++ b/src/app/reducers/code/Submission.ts @@ -1,5 +1,6 @@ import { SubmissionActions } from 'app/actions'; import * as SubmissionInterfaces from 'app/types/code/Submission'; +import * as SubmitBarInterfaces from 'app/types/SubmitBar'; const submissionStoreState: SubmissionInterfaces.SubmissionStoreState = { aiIds: [], @@ -10,6 +11,7 @@ const submissionStoreState: SubmissionInterfaces.SubmissionStoreState = { mapId: 1, maps: [], request: SubmissionInterfaces.Request.NONE, + selectedMap: SubmitBarInterfaces.Map.MAP1, state: SubmissionInterfaces.RequestState.IDLE, }; @@ -36,6 +38,12 @@ export const submissionReducer = ( mapId: action.payload.mapId, }; } + case SubmissionActions.Type.UPDATE_MAP: { + return { + ...state, + selectedMap: action.payload.map, + }; + } case SubmissionActions.Type.UPDATE_CURRENT_AI_ID: { return { ...state, diff --git a/src/app/styles/SubmitBar.module.css b/src/app/styles/SubmitBar.module.css index 7612f6ff..dc6ac92d 100755 --- a/src/app/styles/SubmitBar.module.css +++ b/src/app/styles/SubmitBar.module.css @@ -6,6 +6,7 @@ position: fixed; box-sizing: border-box; z-index: 1; + transition: 2s ease-in; } .SubmitBar .customBtn { @@ -48,3 +49,34 @@ padding-right: 0px; border-right: 0px; } + +.mapDropdown { + width: 100px; + height: 168px; + background-color: #525252; + color: white; + margin-left: 90px; + margin-top: 5px; + overflow: hidden; + display: flex; + flex-direction: column; + transition: max-height 0.7s ease; +} + +.mapDropdownInactive { + display: none; +} + +.mapItem { + width: 100%; + margin-top: 3px; + text-align: center; + height: 30px; +} + +.mapItem:hover { + background-color: #292929; +} +.mapItemActive { + background-color: #292929; +} diff --git a/src/app/types/SubmitBar.ts b/src/app/types/SubmitBar.ts index 75ad3f66..54707fd5 100644 --- a/src/app/types/SubmitBar.ts +++ b/src/app/types/SubmitBar.ts @@ -2,13 +2,23 @@ import { SubmissionActions } from 'app/actions'; import * as SubmissionInterfaces from 'app/types/code/Submission'; import { SplitPaneState } from 'app/types/Dashboard'; +export enum Map { + MAP1, + MAP2, + MAP3, + MAP4, + MAP5, +} + export interface State { commitMessage: string; isCommitMessageBoxOpen: boolean; isRunOptionsOpen: boolean; + isMapOptionsOpen: boolean; } export interface StateProps { + map: Map; maps: SubmissionInterfaces.Map[]; debugRunAvailable: boolean; aiIds: number[]; @@ -25,6 +35,7 @@ export interface DispatchProps { loadMaps: () => void; getAiIds: () => void; clearLogs: () => void; + updateMap: (map: Map) => void; } export interface RunOptionsOwnState { diff --git a/src/app/types/code/Submission.ts b/src/app/types/code/Submission.ts index 8f62e44a..ec4f331b 100644 --- a/src/app/types/code/Submission.ts +++ b/src/app/types/code/Submission.ts @@ -1,4 +1,5 @@ import { SubmissionActions } from 'app/actions'; +import * as SubmitBarInterfaces from 'app/types/SubmitBar'; import { ActionType } from 'typesafe-actions'; const actions = { @@ -11,6 +12,7 @@ const actions = { updateDebugRunCode: SubmissionActions.updateDebugRunCode, updateDebugRunCommitHash: SubmissionActions.updateDebugRunCommitHash, updateDebugRunRequest: SubmissionActions.updateDebugRunRequest, + updateMap: SubmissionActions.updateMap, updateMapId: SubmissionActions.updateMapId, }; @@ -43,6 +45,7 @@ export interface SubmissionStoreState { debugRunCommitHash: string; mapId: number; maps: Map[]; + selectedMap: SubmitBarInterfaces.Map; } export interface Map {