How to use phoenix - 10 common examples

To help you get started, we’ve selected a few phoenix examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github flow-typed / flow-typed / definitions / npm / phoenix_v1.4.x / test_phoenix_v1.4.x.js View on Github external
it('sets up presence correctly', () => {
    const socket = new Socket('/socket', { params: { userToken: '456' } });
    socket.connect();
    const channel = socket.channel('room:123', { token: 'xyz' });
    channel.join();
    const presence = new Presence(channel);

    // detect if user has joined for the 1st time or from another tab/device
    presence.onJoin((id, current, newPres) => {
      if (!current) {
        console.log('user has entered for the first time', newPres);
      } else {
        console.log('user additional presence', newPres);
      }
    });

    // detect if user has left from all tabs/devices, or is still present
    presence.onLeave((id, current, leftPres) => {
      if (current && current.metas && current.metas.length === 0) {
        console.log('user has left from all devices', leftPres);
      } else {
        console.log('user left from a device', leftPres);
github embark-framework / subspace / test / apollo-client / src / index.js View on Github external
(async () => {
      let accounts = await web3.eth.getAccounts();
      this.EscrowContract = await deployContract();

      // Generating data each two second
      setInterval(async () => {
        await this.EscrowContract.methods
          .createEscrow(Math.floor(Date.now() / 1000), accounts[0], accounts[1])
          .send({ from: accounts[0] });
      }, 1 * 1000);

      // ======================

      const eventSyncer = new Phoenix(web3.currentProvider);

      await eventSyncer.init();

      const typeDefs = `
          type Escrow {
            buyer: String!
            seller: String!
            escrowId: Int!
          }
          type Query {
            escrows: Escrow!
          }
        `;

      const resolvers = {
        Query: {
github flow-typed / flow-typed / definitions / npm / phoenix_v1.4.x / test_phoenix_v1.4.x.js View on Github external
it('errors on malformed Channel', () => {
    // $ExpectError `Channel` instances must take a `Socket` as the final param
    const channel = new Channel('foo', {});
  })
github grych / drab / web / static / js / drab.js View on Github external
run: function(drab_return) {
    this.drab_return = drab_return
    this.self = this
    this.myid = uuid.v1()
    this.onload_launched = false
    this.already_connected = false
    this.path = location.pathname

    // disable all the Drab-related objects
    // they will be re-enable on connection
    this.disable_drab_objects(true)

    let socket = new Socket("/drab/socket", {params: {token: window.userToken}})
    socket.connect()
    this.channel = socket.channel(
      `drab:${this.path}`, 
      {
        path: this.path, 
        drab_return: this.drab_return
      })
    this.channel.join()
      .receive("error", resp => { console.log("Unable to join", resp) })
      .receive("ok", resp => this.connected(resp, this))
    // socket.onError(function(ev) {console.log("SOCKET ERROR", ev);});
    // socket.onClose(function(ev) {console.log("SOCKET CLOSE", ev);});
    socket.onClose((event) => {
      // on disconnect
      this.disable_drab_objects(true)
    })
github ResiliaDev / Planga / assets / js / socket.js View on Github external
// NOTE: The contents of this file will only be executed if
// you uncomment its entry in "assets/js/app.js".

// To use Phoenix channels, the first step is to import Socket
// and connect at the socket path in "lib/web/endpoint.ex":
import {Socket} from "phoenix";

let socket = new Socket("/socket", {params: {token: window.userToken}});

// When you connect, you'll often need to authenticate the client.
// For example, imagine you have an authentication plug, `MyAuth`,
// which authenticates the session and assigns a `:current_user`.
// If the current user exists you can assign the user's token in
// the connection for use in the layout.
//
// In your "lib/web/router.ex":
//
//     pipeline :browser do
//       ...
//       plug MyAuth
//       plug :put_user_token
//     end
//
//     defp put_user_token(conn, _) do
github mozilla / hubs / src / utils / hub-channel.js View on Github external
// Unbind presence, and then set up bindings after reconnect
    if (this.presence) {
      presenceBindings = {
        onJoin: this.presence.caller.onJoin,
        onLeave: this.presence.caller.onLeave,
        onSync: this.presence.caller.onSync
      };

      this.presence.onJoin(function() {});
      this.presence.onLeave(function() {});
      this.presence.onSync(function() {});
    }

    this.channel = await migrateChannelToSocket(this.channel, socket, params);
    this.presence = new Presence(this.channel);

    if (presenceBindings) {
      this.presence.onJoin(presenceBindings.onJoin);
      this.presence.onLeave(presenceBindings.onLeave);
      this.presence.onSync(presenceBindings.onSync);
    }
  }
github 21-23 / _qd-ui / app / game-master / middleware / server-pipe.js View on Github external
export default function serverPipeMiddleware({ getState, dispatch }) {
    // we can create a pipe immediately
    // phoenix will connect it ASAP
    const phoenix = createPhoenix(WebSocket, {
        uri: buildEndpointUri(config['server-endpoint']['uri']),
        timeout: config['server-endpoint']['timeout']
    });

    //just for messages emulation
    if (process.env.NODE_ENV !== 'production') {
        window.dispatch = dispatch;
        window.handleServerMessage = handleServerMessage;
        window.MESSAGE_NAME = MESSAGE_NAME;
    }


    phoenix
        .on('connected', () => {
            log('server connected');
            dispatch(updateConnectionStatus(true));
github 21-23 / _qd-ui / app / game / middleware / server-pipe.js View on Github external
export default function serverPipeMiddleware({ getState, dispatch }) {
    // we can create a pipe immediately
    // phoenix will connect it ASAP
    const phoenix = createPhoenix(WebSocket, {
        uri: buildEndpointUri(config['server-endpoint']['uri']),
        timeout: config['server-endpoint']['timeout'],
    });

    //just for messages emulation
    if (process.env.NODE_ENV !== 'production') {
        window.dispatch = dispatch;
        window.handleServerMessage = handleServerMessage;
        window.MESSAGE_NAME = MESSAGE_NAME;
    }

    phoenix
        .on('connected', () => {
            log('server connected');
            dispatch(updateConnectionStatus(true));
        })
github DefinitelyTyped / DefinitelyTyped / phoenix / phoenix-tests.ts View on Github external
console.log("user has left from all devices", leftPres)
      } else {
        console.log("user left from a device", leftPres)
      }
    };

    state = Presence.syncState(state, stateFromServer, onJoin, onLeave);

    const listBy = (id: string, {metas: [first, ...rest]} : {metas: any[]}) => {
      first.count = rest.length + 1;
      first.id = id;

      return first;
    };

    const onlineUsers = Presence.list(state, listBy);
}
github DefinitelyTyped / DefinitelyTyped / phoenix / phoenix-tests.ts View on Github external
if(!current){
        console.log("user has entered for the first time", newPres)
      } else {
        console.log("user additional presence", newPres)
      }
    };

    const onLeave = (id: string, current: any, leftPres: any) => {
      if(current.metas.length === 0){
        console.log("user has left from all devices", leftPres)
      } else {
        console.log("user left from a device", leftPres)
      }
    };

    state = Presence.syncState(state, stateFromServer, onJoin, onLeave);

    const listBy = (id: string, {metas: [first, ...rest]} : {metas: any[]}) => {
      first.count = rest.length + 1;
      first.id = id;

      return first;
    };

    const onlineUsers = Presence.list(state, listBy);
}