Skip to content

Commit

Permalink
Fixed unit test issues and fixed joysticks
Browse files Browse the repository at this point in the history
  • Loading branch information
@Dhruv-0-Arora
Dhruv-0-Arora committed Aug 22, 2024
1 parent d10592c commit 609d178
Show file tree
Hide file tree
Showing 7 changed files with 89 additions and 28 deletions.
7 changes: 2 additions & 5 deletions fission/src/systems/input/DefaultInputs.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -332,7 +332,7 @@ class DefaultInputs {
undefined,
undefined,
undefined,
TouchControlsJoystick.LEFT
TouchControlsJoystick.LEFT_Y
),
new AxisInput(
"arcadeTurn",
Expand All @@ -343,11 +343,8 @@ class DefaultInputs {
undefined,
undefined,
undefined,
TouchControlsJoystick.RIGHT
TouchControlsJoystick.RIGHT_X
),

new ButtonInput("intake", "Semicolon"),
new ButtonInput("eject", "KeyL"),
],
}
}
Expand Down
15 changes: 9 additions & 6 deletions fission/src/systems/input/InputSystem.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -183,7 +183,7 @@ class InputSystem extends WorldSystem {
this.gamepadDisconnected = this.gamepadDisconnected.bind(this)
window.addEventListener("gamepaddisconnected", this.gamepadDisconnected)

window.onload = () => {
window.addEventListener("touchcontrolsloaded", () => {
InputSystem.leftJoystick = new Joystick(
document.getElementById("joystick-base-left")!,
document.getElementById("joystick-stick-left")!
Expand All @@ -192,7 +192,7 @@ class InputSystem extends WorldSystem {
document.getElementById("joystick-base-right")!,
document.getElementById("joystick-stick-right")!
)
}
})

// Initialize an event that's triggered when the user exits/enters the page
document.addEventListener("visibilitychange", () => {
Expand Down Expand Up @@ -345,12 +345,15 @@ class InputSystem extends WorldSystem {
}

// Returns a number between -1 and 1 from the touch controls
public static getTouchControlsAxis(axisNumber: TouchControlsJoystick): number {
public static getTouchControlsAxis(axisType: TouchControlsJoystick): number {
let value: number
if (axisNumber === TouchControlsJoystick.LEFT) value = -InputSystem.leftJoystick.y
else value = InputSystem.rightJoystick.x

return value
if (axisType === TouchControlsJoystick.LEFT_Y) value = -InputSystem.leftJoystick.y
else if (axisType === TouchControlsJoystick.RIGHT_X) value = InputSystem.rightJoystick.x
else if (axisType === TouchControlsJoystick.RIGHT_Y) value = -InputSystem.rightJoystick.y
else value = InputSystem.leftJoystick.x

return value!
}
}

Expand Down
2 changes: 1 addition & 1 deletion fission/src/systems/scene/Joystick.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ class Joystick {

private onPointerUp(event: PointerEvent) {
if (this.activePointerId !== event.pointerId) return
this.stickPosition = { x: 0, y: 0 }
this.stickPosition = { x: 0, y: 0 }
this.stickElement.style.transform = `translate(-50%, -50%)`
this.baseRect = null
}
Expand Down
10 changes: 8 additions & 2 deletions fission/src/ui/components/TouchControls.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,10 @@ function TouchControls() {
TouchControlsEvent.Listen(TouchControlsEventKeys.PLACE_BUTTON, handlePlaceButtonEvent)
TouchControlsEvent.Listen(TouchControlsEventKeys.JOYSTICK, handleJoystickEvent)

console.log("TouchControls loaded")
const event = new Event("touchcontrolsloaded")
window.dispatchEvent(event)

return () => {
TouchControlsEvent.RemoveListener(TouchControlsEventKeys.PLACE_BUTTON, handlePlaceButtonEvent)
TouchControlsEvent.RemoveListener(TouchControlsEventKeys.JOYSTICK, handleJoystickEvent)
Expand Down Expand Up @@ -125,7 +129,9 @@ export class TouchControlsEvent extends Event {

/** Notates the left and right joysticks with their x and y axis */
export const enum TouchControlsJoystick {
LEFT,
RIGHT,
LEFT_X,
LEFT_Y,
RIGHT_X,
RIGHT_Y,
NONE,
}
11 changes: 11 additions & 0 deletions .../src/ui/panels/configuring/assembly-config/interfaces/inputs/ConfigureSchemeInterface.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ interface ConfigSchemeProps {
/** Interface to configure a specific input scheme */
const ConfigureSchemeInterface: React.FC<ConfigSchemeProps> = ({ selectedScheme }) => {
const [useGamepad, setUseGamepad] = useState<boolean>(selectedScheme.usesGamepad)
const [useTouchControls, setUseTouchControls] = useState<boolean>(selectedScheme.usesTouchControls)
const scrollRef = useRef<HTMLDivElement>(null)

const saveEvent = useCallback(() => {
Expand Down Expand Up @@ -58,6 +59,15 @@ const ConfigureSchemeInterface: React.FC<ConfigSchemeProps> = ({ selectedScheme
}}
tooltipText="Supported controllers: Xbox one, Xbox 360."
/>
<Checkbox
label="Use Touch Controls"
defaultState={selectedScheme.usesTouchControls}
onClick={val => {
setUseTouchControls(val)
selectedScheme.usesTouchControls = val
}}
tooltipText="Enable on-screen touch controls (only for mobile devices)."
/>
<SectionDivider />

{/* Scroll view for inputs */}
Expand All @@ -68,6 +78,7 @@ const ConfigureSchemeInterface: React.FC<ConfigSchemeProps> = ({ selectedScheme
key={i.inputName}
input={i}
useGamepad={useGamepad}
useTouchControls={useTouchControls}
onInputChanged={() => {
selectedScheme.customized = true
}}
Expand Down
70 changes: 57 additions & 13 deletions fission/src/ui/panels/configuring/assembly-config/interfaces/inputs/EditInputInterface.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -87,10 +87,11 @@ const transformKeyName = (keyCode: string, keyModifiers: ModifierState) => {
interface EditInputProps {
input: Input
useGamepad: boolean
useTouchControls: boolean
onInputChanged: () => void
}

const EditInputInterface: React.FC<EditInputProps> = ({ input, useGamepad, onInputChanged }) => {
const EditInputInterface: React.FC<EditInputProps> = ({ input, useGamepad, useTouchControls, onInputChanged }) => {
const [selectedInput, setSelectedInput] = useState<string>("")
const [chosenGamepadAxis, setChosenGamepadAxis] = useState<number>(-1)
const [chosenKey, setChosenKey] = useState<string>("")
Expand Down Expand Up @@ -305,18 +306,37 @@ const EditInputInterface: React.FC<EditInputProps> = ({ input, useGamepad, onInp
)
}

// const TouchControlsAxisSelection = () => {
// if (!(input instanceof AxisInput)) throw new Error("Input not axis type")

// return (
// <>
// <Box
// display="flex"
// flexDirection={"row"}
// gap="10px"
// alignItems={"center"}
// justifyContent={"space-between"}
// width={"98%"}
// >
// <Label>{toTitleCase(input.inputName)}</Label>
// <Dropdown
// key={input.inputName}
// defaultValue={touchControlsAxes[input.touchControlsAxisNumber + 1]}
// options={touchControlsAxes}
// onSelect={value => {
// setSelectedInput(input.inputName)
// setChosenTouchControlsAxis(touchControlsAxes.indexOf(value))
// }}
// />
// </Box>
// </>
// )
// }

/** Show the correct selection mode based on input type and how it's configured */
const inputConfig = () => {
if (!useGamepad) {
// Keyboard button
if (input instanceof ButtonInput) {
return KeyboardButtonSelection()
}
// Keyboard Axis
else if (input instanceof AxisInput) {
return KeyboardAxisSelection()
}
} else {
if (useGamepad) {
// Joystick Button
if (input instanceof ButtonInput) {
return JoystickButtonSelection()
Expand Down Expand Up @@ -352,6 +372,20 @@ const EditInputInterface: React.FC<EditInputProps> = ({ input, useGamepad, onInp
</div>
)
}
} else if (useTouchControls) {
// here
if (input instanceof AxisInput) {
return <></>
}
} else {
// Keyboard button
if (input instanceof ButtonInput) {
return KeyboardButtonSelection()
}
// Keyboard Axis
else if (input instanceof AxisInput) {
return KeyboardAxisSelection()
}
}
}

Expand All @@ -375,7 +409,7 @@ const EditInputInterface: React.FC<EditInputProps> = ({ input, useGamepad, onInp
/** Input detection for setting inputs */
useEffect(() => {
// // Assign keyboard inputs when a key is pressed
if (!useGamepad && selectedInput && chosenKey) {
if (!useGamepad && !useTouchControls && selectedInput && chosenKey) {
if (selectedInput.startsWith("pos")) {
if (!(input instanceof AxisInput)) return
input.posKeyCode = chosenKey
Expand Down Expand Up @@ -429,7 +463,17 @@ const EditInputInterface: React.FC<EditInputProps> = ({ input, useGamepad, onInp
setChosenGamepadAxis(-1)
setSelectedInput("")
}
}, [chosenKey, chosenButton, chosenGamepadAxis, input, modifierState, onInputChanged, selectedInput, useGamepad])
}, [
chosenKey,
chosenButton,
chosenGamepadAxis,
input,
modifierState,
onInputChanged,
selectedInput,
useGamepad,
useTouchControls,
])

return (
<Box
Expand Down
2 changes: 1 addition & 1 deletion fission/vite.config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { defineConfig } from 'vitest/config'
import * as path from 'path'
import react from '@vitejs/plugin-react-swc'
import basicSsl from '@vitejs/plugin-basic-ssl'
import glsl from 'vite-plugin-glsl';
import glsl from 'vite-plugin-glsl'

const basePath = "/fission/"
const serverPort = 3000
Expand Down

0 comments on commit 609d178

Please sign in to comment.