MineSeeker/src/Mine/SeekerBundle/Resources/public/js/mine-seeker/app.js

import React from 'react';
import GridControl from './grid/grid-control';

class MineSeeker extends React.Component {
    /** after rendering */
    componentDidMount() {
        var websocket = WS.connect("ws://mine.dev:6450");

        /** session is an Autobahn JS WAMP session. */
        websocket.on("socket/connect", function (session) {
            console.info("Successfully Connected!");

            session.subscribe("acme/channel", function(uri, payload){
                console.log("Received message", payload.msg);
            });

            session.call("sample/sum", [2, 5]).then(
                function (result) {
                    console.log("RPC Valid!", result);
                },
                function (error, desc) {
                    console.log("RPC Error", error, desc);
                }
            );

            session.publish("acme/channel", {msg: "This is a message!"});

            // session.publish("acme/channel", {msg: "I'm leaving, I will not see the next message"});
            //
            // session.unsubscribe("acme/channel");
            //
            // session.publish("acme/channel", {msg: "I won't see this"});
            //
            // session.subscribe("acme/channel", function (uri, payload) {
            //     console.log("Received message", payload.msg);
            // });
            //
            // session.publish("acme/channel", {msg: "I'm back!"});
        });

        /** error provides us with some insight into the disconnection: error.reason and error.code */
        websocket.on("socket/disconnect", function (error) {
            console.info("Disconnected for " + error.reason + " with code " + error.code);
        });
    }

    render() {
        return (
            <div></div>
            // <GridControl ref="gridControl"/>
        );
    }
}

export default MineSeeker;