cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 
Choose Language Hide Translation Bar
Craige_Hales
Super User
WebSocket

Several weeks ago I started a spring-force node-diagram project using data from Twitter. It got complicated, and I decided a video was the best way to showcase it. But, the video was long and boring. Here's an early snapshot.

Half-baked ideaHalf-baked idea

On Waffle Sunday, I asked several family members to review and suggest how to make it better. They all made good comments, but Daniel really wanted to show me something. I kept putting him off, until I began to realize my video wasn't that amazing after all.

 

"OK Daniel. What have you got?"
"Go to google and ask for Listen to Wikipedia."

 

That will take you to http://listen.hatnote.com/ . I watched (and listened) for several minutes wondering how it worked...I made some bad guesses. Then I clicked the about link and followed my way to hatnote's JavaScript code around line 123 where I started learning about WebSockets.They let a browser keep a bidirectional port open to a web server, and in 2022 most browsers support them. When you looked at the Listen to Wikipedia page, the JavaScript running in your browser was listening to the wikipedia WebSocket and getting immediate notifications about the wikipedia updates. Documentation you don't need.

Twitter has its own API and doesn't use WebSockets. The video I was making was just polling every five minutes, historical, not interactive like the wikipedia updates. I want to use a WebSocket, so I need something else.

After poking around I discovered the stackexchange group of sites (including stackoverflow) has a WebSocket that is bidirectional. The WebSocket can subscribe for all new posts, and then subscribe and unsubscribe to updates on those posts. (Approximately. I used a stackexchange post for my information and it is pretty clear that posts show up that might not be new.)

What can I do with JSL? WebSockets are browser things. After searching for a bit, I found a Python WebSocket package. The Python code is a shim between JSL and the WebSocket. I'm pretty sure it could all be done in JSL, but there are some ugly bits I don't want to deal with...so Python.

There is a small amount of generic WebSocket code in the following JSL and a lot of stackexchange-specific code. If you build a similar solution, not for stackexchange, you'll probably keep the Python bit and just use the remainder as a rough guide. There are comments in the code, and since it is packaged as an add-in you can find the code from View->add-ins, pick WebSocket, click the directory.

After launching the add-in it might take a while before things start happening. Generally something happens every 10 seconds or so, especially after the add-in has run long enough to have a bunch of subscriptions. If you've seen and heard nothing after five minutes, it is probably not working...keep an eye on the log window. I settled on needing a 1920 wide by 1080 tall display for this project because of the amount of data it needs to show. It will be hard to scale it down; the 9X9 grid of questions needs to show a description and icon and indicators. They are all hand tweaked to look OK. The font might need tweaking too. Here's a short video of what it looks like after running for a bit, but running the add-in will be more fun. The add-in is for windows and JMP 16. It might work on a Mac but is untested.

 

If you don't try the add-in, here's a brief snip of video.

 

 

If you are running the add-in, you can click on the items and your web browser will take you to the article.

 

Add-in WebSocket demo using Stackexchange 

Last Modified: Aug 10, 2022 6:50 AM