Google Maps in Max

Draw points in Max by sending latitude and longitude to a Web client via Osc and web sockets.

Uses Ruby, WebSockets, Chrome, Google Maps API, Osc, Max, Jquery, and Node.js… But the Max patch is actually quite simple.

Based on this geocoding tutorial:  http://www.sitepoint.com/google-maps-api-jquery/

download

https://github.com/tkzic/internet-sensors

folder: google-maps

files

main Max patch
  • googlemaptest.maxpat
html and javascript for Google API
  • js/ (folder containing javascript code for map client)
  • markers.html (web client)
ruby
  • mapserver.rb (Osc and Websockets server)
node.js (optional)
  • nodeserver.js (local node.js webserver)

running node.js local web server (optional)

To run the project locally, you will either need to install node.js or have a local web server. The instructions assume that you have installed node, as well as the http package.

If you don’t want to bother with node, there is also an online version of the web client running at  http://zerokidz.com/gmap/markers/markers.html

intalling ruby gems

Running Ruby 2.0 as well as the following gems:

  • osc-ruby
  • em-websocket
  • json

instructions

1. If you are using the online Web client, go to this URL in a Google Chrome browser: http://zerokidz.com/gmap/markers/markers.html then skip to step 4.

2. In a terminal window start the node webserver

node nodeserver

3. Launch a Google Chrome web browser and type in this URL

127.0.0.1:8081/markers.html

4. In another terminal window start the ruby server for Osc and websockets

ruby mapserver.rb

5. Now in the Web Client (Chrome) press the “OSC” button underneath the map – to open the web sockets connection with the ruby server.

6. Open the Max patch:

googlemaptest.maxpat

7. Now you should be able to click on the message boxes for Bethel and Rumford in the Max patch to add location markers to the map in the browser.

 

hardware control of webaudio API

programming

This is a tweak of a demo program by Boris Smus from http://webaudioapi.com

The audio is generated in the web browser using the webaudio API. Oscillator frequency is being controlled by an iPod touch running touchOSC.

A ruby program is running in the background. It starts 2 servers, one to handle Osc messages from the iPod. and a websockets server which passes Osc messages to the web client in the browser, which parses the data and sets oscillator frequency.

local source files in tkzic/web-audio-api/webaudioapi/content/posts/oscillator-ws

instructions

(these are for my local files – source has not been published yet) Please contact me directly for more information about this code. Or have a look at a very similar example at: https://github.com/tkzic/WebAudio

1. run the node webserver in tkzic/

node nodeserver.js

(it will run on localhost port 8081 – for example http://127.0.0.1:8081)

2. In Chrome web browser, run: http://192.168.1.104:8081/web-audio-api/webaudioapi/content/posts/oscillator-ws/index.html

The following screen will appear:

3. From a terminal prompt run this ruby script (in tkzic/web-audio-api/webaudioapi/content/posts/oscillator-ws)

./wapOSCserver.rb

4. In webpage in Chrome, click the sockets button – the ruby server should open a socket connection, also click the play/pause button to start the oscillator

5. In touchOSC point the host to the ip address of the laptop (ie., 192.168.1.104) running on default ports, (out 8000, in 9000)

6. In touchOSC run the ‘simple’ layout and move fader1 to change the pitch of the oscillator

Note: You will probably also want to open the developer javascript console in Chrome to see what is going on.

next step

Need to clean up the ruby server code to handle error conditions, ie., network interruptions, missing files, browser incompatibility, etc.,

 

html5 websockets and ruby

Update 6/2014 – Working examples at Internet sensors projects: https://reactivemusic.net/?p=5859

original post

notes

http://www.html5rocks.com/en/tutorials/websockets/basics/

http://www.websocket.org/echo.html

http://html5demos.com/web-socket

Got some examples running in web sockets (finally). Like with node.js, you can’t access servers from outside, which specify their ip address as localhost – you need to actually set a real ip, even if its a private ip like 192.168.1.20

Anyway I was able to get a ruby websocket server running using em-websocket and also another version using eventmachine.

Local files are in tkzic/websockets

the examples are running a public server at http://zerokidz.com/websockets/index.html

(need to start the server – also in that directory: ./server.rb

There’s also a simple node.js webserver in that folder – but after solving the problem above – apache works just fine.

How do I talk to a client from within a loop using EventMachine?