TRANSFORM 2020 Lightning Talk -- Digikom
created: 2020-06-11 modified: 2020-06-11Abstract
Digikom is a browser based geological compass most probably useful as a teaching aid. It was built using gyronorm, peerjs and a partial js port of auttitude.
Introduction
I started learning a bit of javascript when I started this github personal page, as a way to add some interactivity.
I did a partial port to javascript of auttitude, which is a structural geology data analysis and plotting library I have been working on since undergrad that is currently being used as the engine for openstereo.
On a side note, having some way to easily work with structural data in javascript allows for some fun, as in creating an alexa skill for voice activated "stereonets" and adding a custom plot for google data studio.
As different phone OSs at the time presented orientation data differently, I used gyronorm as a way to normalize the input.
While at first I only plotted the stereonet in response to changes in phone orientation, I eventually got the idea of trying to connect it to a desktop computer somehow.
Enter WebRTC
I originally wanted to offer a connection from the cellphone directly to openstereo, but my first attempt (making the phone POST the data to a server running on the desktop computer) ended up being sluggish and unreliable on some networks.
I eventually found out about the WebRTC api, which allows for direct peer to peer communication between users. Giving up at first on integrating this to openstereo (I couldn't find any library nor understand how at the time to do WebRTC in python/PyQT5), I decided to use the browser as the visualization platform as well. This is the current page of Digikom.
One of the complicated issues in using WebRTC is signalling, that is, exchanging information between the two browsers on how to connect. At the time, as I wanted to build only a simple static page, I used peerjs, which is a nice and really simple to use library for this kind of communication in the browser, supporting everything that WebRTC has, such as data, audio and video streams (which, combined with some other really cool modern browser APIs, allows you to easily do stuff as sharing your desktop).
They offer their own free signalling server, so you really only have import the library and it works.
When it works. As a free of charge service offered to the community, it can be hard to connect and get a peer id sometimes. As an alternative, you could use a simpler library, as simple-peer and build your own signalling server. That consists of exchanging the signal data between the peers and then all subsequent communication is directly between the users.
I will eventually add a link here to a version doing this running on glitch.
Javascript can be really fun!
In conclusion, I have to say that my adventures in learning javascript have been really interesting. Browsers have some really cool APIs nowadays, and with some libraries as presented above, or maybe ones that use WebGL, such as three.js or on another layer of abstraction, webVR as a-frame, you can quickly prototype and build fun projects!