1.2.30 • Published 6 years ago

@esc_games/esc-controller-sdk v1.2.30

Weekly downloads
24
License
ISC
Repository
-
Last release
6 years ago

ESC Controller SDK

Using the controller SDK:

Pre-requisites

  • homebrew
brew install npm

Creating a controller using esc-create-controller

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

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

And follow the steps described by the script.

Creating a controller manually

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:

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(
    <ESCGameController>
        <MyController/>
    </ESCGameController>,
    document.getElementById('root')
);

Raw User Input

The core user input library from ESC provides access to native User Inputs on the controller device.

  • Accelerometer
  • Screen
  • UserMedia
  • ...

Gestures

The gesture library from ESC provides some concrete implementations of interpreting raw user input into controller events.

  • Shake
  • Flick
  • ...

Here's an example of adding the Shake gesture and the default Shake UI component:

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:");
});

Controls

ESC Controls are easy-to-use drop-in components for common UI Inputs

  • Joystick
  • TattooSelector
  • TattooDisplay
  • ...

Here's how to add a control and subscribe to control events:

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 <div>
            <div style={joystickStyle}>
                <Joystick/>
                <TattooDisplay/>
            </div>

            <div style={tattooStyle}>
                <TattooSelector/>


                <Shake/>
            </div>
        </div>
    }
}

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:

class JoystickComponent extends Component {
    render() {
        const {id, x, y, skinClassName} = this.props;

        return <div id={id} className={"ESCJoystick " + skinClassName}>
            Joystick
            <pre>
                <pre>
                    {JSON.stringify(this.props, null, 2)}
                </pre>
            </pre>
        </div>
    }
}

This component is made to be simple, and used for debugging. That's why only displaying it's props in a fixed width font.

Here's the reducer for it:

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:

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.

1.2.30

6 years ago

1.2.24

6 years ago

1.2.16

6 years ago

1.2.15

6 years ago

1.2.14

6 years ago

1.2.13

6 years ago

1.2.3

6 years ago

1.1.52

6 years ago

1.1.48

6 years ago

1.1.40

6 years ago

1.1.38

6 years ago

1.1.33

6 years ago

1.1.32

6 years ago

1.1.31

6 years ago

1.1.29

6 years ago

1.1.26

6 years ago

1.1.21

6 years ago

1.1.19

6 years ago

1.1.18

6 years ago

1.1.11

6 years ago

1.1.3

6 years ago

1.1.1

6 years ago

1.1.0

6 years ago

1.0.122

6 years ago

1.0.121

6 years ago

1.0.110

6 years ago

1.0.104

6 years ago

1.0.103

6 years ago

1.0.90

6 years ago

1.0.88

6 years ago

1.0.87

6 years ago

1.0.86

6 years ago

1.0.85

6 years ago

1.0.83

6 years ago

1.0.82

6 years ago

1.0.81

6 years ago

1.0.78

6 years ago

1.0.77

6 years ago

1.0.75

6 years ago

1.0.74

6 years ago

1.0.72

6 years ago

1.0.70

6 years ago

1.0.69

6 years ago

1.0.62

6 years ago

1.0.59

6 years ago

1.0.49

6 years ago

1.0.42

6 years ago

1.0.33

6 years ago

1.0.29

6 years ago

1.0.28

6 years ago

1.0.24

6 years ago

1.0.23

6 years ago

1.0.20

6 years ago

1.0.17

6 years ago

1.0.15

6 years ago

1.0.7

6 years ago

1.0.0

6 years ago

0.9.121

6 years ago

0.9.119

6 years ago

0.9.116

6 years ago

0.9.115

6 years ago

0.9.114

6 years ago

0.9.112

6 years ago

0.9.110

6 years ago

0.9.109

6 years ago

0.9.108

6 years ago

0.9.102

6 years ago

0.9.101

6 years ago

0.9.100

6 years ago

0.9.99

6 years ago

0.9.96

6 years ago

0.9.93

6 years ago

0.9.92

6 years ago

0.9.88

6 years ago

0.9.85

6 years ago

0.9.82

6 years ago

0.9.78

6 years ago

0.9.77

6 years ago

0.9.75

6 years ago

0.9.72

6 years ago

0.9.70

6 years ago

0.9.60

6 years ago

0.9.56

6 years ago

0.9.55

6 years ago

0.9.53

6 years ago

0.9.52

6 years ago

0.9.51

6 years ago

0.9.49

6 years ago

0.9.47

6 years ago

0.9.46

6 years ago

0.9.45

6 years ago

0.9.44

6 years ago

0.9.43

6 years ago

0.9.42

6 years ago

0.9.41

6 years ago

0.9.40

6 years ago

0.9.38

6 years ago

0.9.37

6 years ago

0.9.36

6 years ago

0.9.35

6 years ago

0.0.2-test

6 years ago

0.0.1-test

6 years ago

0.9.34

6 years ago

0.9.33-beta3

6 years ago

0.9.33-beta2

6 years ago

0.9.33-beta

6 years ago

0.9.33

6 years ago

0.9.26

6 years ago

0.9.25

6 years ago

0.9.23

6 years ago

0.9.22

6 years ago

0.9.21

6 years ago

0.9.20

6 years ago

0.9.19

6 years ago

0.9.18

6 years ago

0.9.17

6 years ago

0.9.16

6 years ago

0.9.15

6 years ago

0.9.14

6 years ago

0.9.13

6 years ago

0.9.12

6 years ago

0.9.11

6 years ago

0.9.10

6 years ago

0.9.9

6 years ago

0.9.8

6 years ago

0.9.7

6 years ago

0.9.6

6 years ago

0.9.5

6 years ago

0.9.4

6 years ago

0.9.3

6 years ago

0.9.2

6 years ago

0.7.12

6 years ago

0.7.9

6 years ago

0.4.37

6 years ago

0.4.36

6 years ago

0.4.35

6 years ago

0.4.34

6 years ago

0.4.33

6 years ago

0.4.32

6 years ago

0.4.31

6 years ago

0.4.30

6 years ago

0.4.29

6 years ago

0.4.28

6 years ago

0.4.27

6 years ago

0.4.26

6 years ago

0.4.25

6 years ago

0.4.24

6 years ago

0.4.23

6 years ago

0.4.22

6 years ago

0.4.21

6 years ago

0.4.20

6 years ago

0.4.19

6 years ago

0.4.17

6 years ago

0.4.16

6 years ago

0.4.15

6 years ago

0.4.14

6 years ago

0.4.13

6 years ago

0.4.12

6 years ago

0.4.11

6 years ago

0.4.10

6 years ago

0.4.9

6 years ago

0.4.8

6 years ago

0.4.7

6 years ago

0.4.6

6 years ago

0.4.5

6 years ago

0.4.4

6 years ago

0.4.3

6 years ago

0.4.2

6 years ago

0.4.1

6 years ago

0.4.0

6 years ago

0.3.31

6 years ago

0.3.30

6 years ago

0.3.29

6 years ago

0.3.28

6 years ago

0.3.27

6 years ago

0.3.26

6 years ago

0.3.25

6 years ago

0.3.24

6 years ago

0.3.23

6 years ago

0.3.22

6 years ago

0.3.21-x

6 years ago

0.3.21

6 years ago

0.3.20

6 years ago

0.3.19

6 years ago

0.3.18

6 years ago

0.3.17

6 years ago

0.3.16

6 years ago

0.3.15

6 years ago

0.3.14

6 years ago

0.3.13

6 years ago

0.3.12

6 years ago

0.3.11

6 years ago

0.3.10

6 years ago

0.3.9

6 years ago

0.3.8

7 years ago

0.3.7

7 years ago

0.3.6

7 years ago

0.3.5

7 years ago

0.3.4

7 years ago

0.3.3

7 years ago

0.3.2

7 years ago

0.3.1

7 years ago

0.3.0

7 years ago

0.2.36

7 years ago

0.2.35

7 years ago

0.2.34

7 years ago

0.2.33

7 years ago

0.2.32

7 years ago

0.2.31

7 years ago

0.2.30

7 years ago

0.2.29

7 years ago

0.2.28

7 years ago

0.2.27

7 years ago

0.2.26

7 years ago

0.2.25

7 years ago

0.2.24

7 years ago

0.2.23

7 years ago

0.2.22

7 years ago

0.2.21

7 years ago

0.2.20

7 years ago

0.2.19

7 years ago

0.2.18

7 years ago

0.2.17

7 years ago

0.2.16

7 years ago

0.2.15

7 years ago

0.2.14

7 years ago

0.2.13

7 years ago

0.2.12

7 years ago

0.2.11

7 years ago

0.2.10

7 years ago

0.2.9

7 years ago

0.2.8

7 years ago

0.2.7

7 years ago

0.2.6

7 years ago

0.2.5

7 years ago

0.2.4

7 years ago

0.2.3

7 years ago

0.2.2

7 years ago

0.2.1

7 years ago

0.1.11

7 years ago

0.1.10

7 years ago

0.1.9

7 years ago

0.1.8

7 years ago

0.1.7

7 years ago

0.1.6

7 years ago

0.1.5

7 years ago

0.1.4

7 years ago

0.1.3

7 years ago

0.1.2

7 years ago

0.1.1

7 years ago

0.1.0

7 years ago

0.0.39

7 years ago

0.0.38

7 years ago

0.0.37

7 years ago

0.0.36

7 years ago

0.0.35

7 years ago

0.0.34

7 years ago

0.0.33

7 years ago

0.0.32

7 years ago

0.0.30

7 years ago

0.0.29

7 years ago

0.0.28

7 years ago

0.0.27

7 years ago

0.0.26

7 years ago

0.0.25

7 years ago

0.0.24

7 years ago

0.0.23

7 years ago

0.0.22

7 years ago

0.0.21

7 years ago

0.0.20

7 years ago

0.0.19

7 years ago

0.0.18

7 years ago

0.0.17

7 years ago

0.0.16

7 years ago

0.0.15

7 years ago

0.0.14

7 years ago

0.0.13

7 years ago

0.0.12

7 years ago

0.0.11

7 years ago

0.0.10

7 years ago

0.0.9

7 years ago

0.0.8

7 years ago

0.0.6

7 years ago

0.0.5

7 years ago

0.0.4

7 years ago

0.0.3

7 years ago

0.0.2

7 years ago

0.0.1

7 years ago