2021-02-02 16:31:50 +00:00
|
|
|
import { findNodeFromWord } from "../../utils/media-utils";
|
|
|
|
|
2021-02-01 20:59:06 +00:00
|
|
|
const handleMediaKeyPress = (mediaSceneContext: any) => {
|
2021-02-01 18:13:32 +00:00
|
|
|
const {
|
|
|
|
keyPress,
|
|
|
|
activeMediaComponent,
|
|
|
|
wordPosStateIdx,
|
|
|
|
rightSideComponentIdx,
|
2021-02-02 16:31:50 +00:00
|
|
|
activeNode,
|
|
|
|
activeSite,
|
2021-02-01 18:13:32 +00:00
|
|
|
} = mediaSceneContext;
|
2020-12-21 16:56:06 +00:00
|
|
|
|
|
|
|
const calculateNewRightSide = (
|
|
|
|
direction: string,
|
|
|
|
wordPosStateIdx: number,
|
|
|
|
rightSideComponentIdx: number
|
|
|
|
) => {
|
|
|
|
if (direction === "UP") {
|
|
|
|
wordPosStateIdx--;
|
|
|
|
if (wordPosStateIdx < 1) {
|
|
|
|
wordPosStateIdx = 6;
|
|
|
|
}
|
|
|
|
rightSideComponentIdx--;
|
|
|
|
if (rightSideComponentIdx < 0) {
|
|
|
|
rightSideComponentIdx = 2;
|
|
|
|
}
|
|
|
|
} else if (direction === "DOWN") {
|
|
|
|
wordPosStateIdx++;
|
|
|
|
if (wordPosStateIdx > 6) {
|
|
|
|
wordPosStateIdx = 1;
|
|
|
|
}
|
|
|
|
rightSideComponentIdx++;
|
|
|
|
if (rightSideComponentIdx > 2) {
|
|
|
|
rightSideComponentIdx = 0;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
return {
|
2020-12-28 17:30:01 +00:00
|
|
|
wordPosStateIdx: wordPosStateIdx,
|
|
|
|
rightSideComponentIdx: rightSideComponentIdx,
|
2020-12-21 16:56:06 +00:00
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
switch (keyPress) {
|
|
|
|
case "UP":
|
|
|
|
case "DOWN":
|
|
|
|
case "RIGHT":
|
|
|
|
case "LEFT":
|
2021-02-01 18:13:32 +00:00
|
|
|
if (["fstWord", "sndWord", "thirdWord"].includes(activeMediaComponent)) {
|
2020-12-28 17:30:01 +00:00
|
|
|
const rightSide = calculateNewRightSide(
|
2020-12-21 16:56:06 +00:00
|
|
|
keyPress,
|
|
|
|
wordPosStateIdx,
|
|
|
|
rightSideComponentIdx
|
|
|
|
);
|
2020-12-07 16:23:57 +00:00
|
|
|
return {
|
2020-12-21 16:56:06 +00:00
|
|
|
event: `media_rightside_${keyPress.toLowerCase()}`,
|
2020-12-28 17:30:01 +00:00
|
|
|
rightSideComponentIdx: rightSide.rightSideComponentIdx,
|
|
|
|
wordPosStateIdx: rightSide.wordPosStateIdx,
|
2020-12-07 16:23:57 +00:00
|
|
|
};
|
2020-12-21 16:56:06 +00:00
|
|
|
} else {
|
2020-12-28 17:30:01 +00:00
|
|
|
const leftSideComponentIdx = keyPress === "UP" ? 0 : 1;
|
2020-12-07 16:23:57 +00:00
|
|
|
return {
|
2020-12-21 16:56:06 +00:00
|
|
|
event: `media_leftside_${keyPress.toLowerCase()}`,
|
2020-12-28 17:30:01 +00:00
|
|
|
leftSideComponentIdx: leftSideComponentIdx,
|
2020-12-07 16:23:57 +00:00
|
|
|
};
|
2020-12-21 16:56:06 +00:00
|
|
|
}
|
|
|
|
case "CIRCLE":
|
2021-02-02 16:31:50 +00:00
|
|
|
switch (activeMediaComponent) {
|
|
|
|
case "fstWord":
|
|
|
|
case "sndWord":
|
|
|
|
case "thirdWord":
|
|
|
|
const data = findNodeFromWord(
|
|
|
|
activeMediaComponent,
|
|
|
|
activeNode,
|
|
|
|
activeSite
|
|
|
|
);
|
|
|
|
|
|
|
|
if (data) {
|
|
|
|
return { event: `media_${activeMediaComponent}_select`, ...data };
|
|
|
|
} else {
|
|
|
|
// todo in case node isnt unlocked yet
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
default:
|
2021-02-04 19:01:50 +00:00
|
|
|
if (activeMediaComponent === "play") {
|
|
|
|
return {
|
|
|
|
event: `media_${activeMediaComponent}_select`,
|
|
|
|
node: activeNode,
|
|
|
|
};
|
|
|
|
} else {
|
|
|
|
return { event: `media_${activeMediaComponent}_select` };
|
|
|
|
}
|
2021-02-02 16:31:50 +00:00
|
|
|
}
|
2020-11-25 15:14:23 +00:00
|
|
|
}
|
2020-11-01 15:40:46 +00:00
|
|
|
};
|
|
|
|
|
2021-02-01 20:59:06 +00:00
|
|
|
export default handleMediaKeyPress;
|