@unboared/lib NPM

@unboared/lib

The Unboared library is a JavaScript library for creating applications and games based on the Unboared technology. In addition to the standard vanilla javascript use, a react.js module is provided for a reactive use.

Usage

Vanilla JS

<!doctype html>
<html>

<head>
        <title>My game</title>
        <meta name="description" content="Game description.">
        <link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
        <script type="text/javascript" src="unboared-lib.js"></script>
        <script>
                class MyGame {
                        constructor() {
                                let that = this
                                that.unboared = new Unboared.WebViewApi();
                                that.unboared.init();
                                that.unboared.onReady(() => {
                                        console.log("Game is ready");
                                })

                                that.unboared.onMessageReceived((message, from, data) => {
                                        console.log(`Receive message '${message} from ${from}'`)
                                })
                                that.unboared.start();
                        }

                        pressMainButton() {
                                return this.unboared.emitAction("pressMainButton");
                        }
                }
        </script>
</head>

<body onload="window.app = new MyGame()">
        <div id="game">
                <button onclick="window.app.pressMainButton()">Main Button</button>
        </div>
</body>

</html>

React.js

import { UnboaredGame, usePlayers, useCommunication } from '@unboared/lib';

function App() {  
  return (
    <UnboaredGame>
      <MyGame />
    </UnboaredGame>
  );
}


function MyGame() {
  const { emitAction } = useCommunication();
  const { getDeviceID, getGamepadIDs } = usePlayers();
  
  return (
    <div>
      <p>My device id: {getDeviceID()}</p>
      <p>Nombre de gamepads connectés: {getGamepadIDs().length}</p>
      <button onClick={() => emitAction("pressMainButton")}>
        Main Button
      </button>
    </div>
  );
}