A ReactJS / Crystal / Kemal web application that communicates with Periscope chat servers via websockets to receive messages and uses the ResponsiveVoice javascript text-to-speech library to speak those messages. The Yandex translation web service is also used to translate messages to English.
This is essentially a web app version of the ScopeSpeaker Android app found at https://play.google.com/store/apps/details?id=com.ferasinfotech.scopespeaker and https://github.com/jferas/ScopeSpeaker/ and has been a learning experience to dig into Crystal and its Kemal web framework, as well as ReactJS.
The Crystal/Kemal server acts a proxy between a simple web client in a browser and the Periscope chat server, maintaining a separate browser-to-chat-server mapping for each web client.
For the server side, you'll need to install:
- The Crystal programming language environment (Easy like ruby, fast like C)
- The Crystal-base web framework, Kemal.
For the web client side, you'll need to install React and its various components:
- The 'react' UI library
- The 'react-dom' library
- The 'react-burger-menu' library
- The 'react-toggle-button' library
- The 'react-select' library
- The 'babel' JSX compiler
- The 'webpack' utility
git clone https://github.com/jferas/WebScopeSpeaker
cd WebScopeSpeaker && shards install
./run_it
Go to http://localhost:3000/
to see it in action locally on your development machine.
The app is currently installed on Heroku and can be accessed at https://scopespeaker.herokuapp.com
Enter the name of a Periscope user who is currently broadcasting live, wait for the app to connect to the chat servers, and then listen to the incoming chat messages from the broadcast.
- Figure out the Crystal testing framework and write some tests
- Add a feature that is in the Android app to detect user's language and translate incoming messages into that language
- Fork it ( https://github.com/jferas/WebScopeSpeaker/fork )
- Create your feature branch (git checkout -b my-new-feature)
- Commit your changes (git commit -am 'Add some feature')
- Push to the branch (git push origin my-new-feature)
- Create a new Pull Request
- [jferas] John Feras - creator, maintainer