Home

Awesome

Signalbroker web client

This project contains two things

Prerequisites

Signal Broker

Before starting, the signalbroker must be running.

mix deps.get
iex -S mix

if your signalbroker server is running on another machine do:

mix deps.get
SIGNAL_SERVER_HOST_NAME=10.251.177.205 iex -S mix

Envoy

Envoy must be running and should be connected to the Signal Broker Server. Check readme on how to get started.

Alternatively; start using docker

docker build -t signalbroker-web-client:v1 -f ./docker/Dockerfile .

just start it using the correct ip. Remember don't use 127.0.0.1, instead use the real signalbroker machine ip

docker run -e SIGNAL_SERVER_HOST_NAME='192.168.1.169' --rm -it -p 8080:8080 signalbroker-web-client:v1

note 1: you should be able to do above on intel or arm. However ARM is not testad at this point.

quick test, the mini web sample should now work if you follow the instructions Websocket Web Client found below

Docker compose

If you built the container described above and the additional container here you can conveniently start the container from this folder by doing

SIGNAL_SERVER_HOST_NAME=192.168.1.169 docker-compose up

make sure to use your host ip instead of 192.168.1.169

Run the gRPC front-end web client

Point your browser to http://you_envoy_machine_ip:8080/. You will be notified that the Signal Broker Envoy is offline. This is because you need to specify the correct IP according to your configurations. Click the red field in the status bar at the bottom which reads "Signal Broker Envoy". Configure it by setting your Envoy IP, http://[your_envoy_server]:8081

gRPC front-end web client configuration

If you want to customize the gRPC web client, follow these instructions.

  1. See readme libraryCompiler to take the GRPC generated files and bundle them into a javascript library. You will need to run this again anytime you make changes to the GRPC files. Changes in the front-end (clientSource) might be needed as well if functions are added, removed, or renamed. DO NOT modify the generated files or the api.js file generated by webpack.
  2. Then see readme clientSource to configure the front-end web client built with VueJS which is preconfigured to use the library from step 1. The resulting production build can be hosted on a web server of your choice or you may prefer to use the development server by running yarn serve. If you intend to host the production version on Cowboy, then copy the generated /dist folder to signalbroker-web-client/priv/ after running yarn build. Remember to point the web client to the correct Envoy IP.
  3. You should now be able to point your browser to the webserver, select some frames and/or signals and see some charted traffic!

Help us improve!

The gRPC front-end web client for the Signal Broker is in active development and would appreciate your feature suggestions or bug reports. File them as issues in this repository :)

Websocket Web Client

Easier to get started, but less capable option and predecesor to the gRPC client.

To access the Websocket client UI point your web browser to http://localhost:8080/websocket_demo/web_car.html

Websocket API

The API is simply the same as the telnet API but sent over websocket.

For a working sample of how to use the code go to priv/websocket_demo/js/web_car.js.

TODO - help appreciated