ESC Controller SDK

Using the controller SDK:

$3

- homebrew
``
brew install npm
`

$3

In your Unity game project directory (e.g. ~/ToyBox/myGame/), run this command

`bash
npx @esc_games/esc-create-controller MyGame
cd controllers
`

And follow the steps described by the script.

$3

If you are creating a controller manually, start by installing the SDK:

`
npm install @esc_games/esc-controller-sdk --save
`

ESC Controller SDK is a React/Redux dependent SDK.
You can use the SDK to make ESC Game controllers,
interfacing directly with the ESC API, as well as plugging
in a dope controller and user input components made by ESC
and our developer community.

Example index.js:
`javascript
import React, {Component} from 'react';
import ReactDOM from 'react-dom';
import { ESCGameController } from '@esc_games/esc-controller-sdk/';
import './my.css';
import { MyController } from './MyGame';

ReactDOM.render(


,
document.getElementById('root')
);
`


$3

Here's an example of adding the Shake gesture and the default Shake UI component:
`javascript
import { ESCManager } from '@esc_games/esc-controller-sdk'
import { Shake, ShakeManager, CONTROLLER_SHAKE } from '@esc_games/esc-controller-sdk/gestures'

ShakeManager.registerEventHandler(CONTROLLER_SHAKE, "A", (message) => {
ESCManager.networking.sendEventMessage("Shake:");
});
`

$3

Here's how to add a control and subscribe to control events:
`javascript
import React, {Component} from 'react';
import {Joystick, JoystickManager, CONTROLLER_JOYSTICK_MOTION} from "../esc/controls/joystick";

JoystickManager.registerEventHandler(CONTROLLER_JOYSTICK_MOTION, SEA_OF_FOLKS, (message) => {
console.log("SENDING ", message);
ESCManager.networking.sendEventMessage("Joystick:" + message);
});

class MyControllerComponent extends Component {
render() {
const joystickStyle = {
float: "right",
};

const tattooStyle = {
float: "left",
};


return

`

Creating Reusable Controls

Let's use Joystick as an example - here's a simplified component
that we want to change redux state IFF it's showing
on the screen:
`javascript
class JoystickComponent extends Component {
render() {
const {id, x, y, skinClassName} = this.props;

return

                

                    {JSON.stringify(this.props, null, 2)}
                

            

Here's the reducer for it:
`javascript
const defaultState = {
id: "Joystick " + Math.random(),
x: 0.0,
y: 0.0,
skinClassName: "x86-classic"
};

const reducerManager = new ReducerManager({
[UI_JOYSTICK_MOTION]: (state, action) => {
return {
...state.joystick,
x: action.value.x,
y: action.value.y,
};
},
[UI_JOYSTICK_SKIN]: (state, action) => {
return {
...state.joystick,
skinClassName: action.value
};
}
}, defaultState);

`

Here's how we connect the GameUI, our props displaying
React component to ESC's reducer registry:
`javascript
export const Joystick = JoystickManager.connect(JoystickComponent, [UI_JOYSTICK_MOTION, UI_JOYSTICK_SKIN]);
`

This connect` function should be used instead of redux's
connect. The redux actions that should affect state should
be listed to ensure that only when/if joystick(s) are
showing/in-use do we affect Redux/UI state.