HTML Server on Sonic Pi
Serves an HTML page to Browser on local network
Buttons on page play tones via Sonic PI
By changing HTML code and parsing can be adapted to control other Sonic Pi variables
Uses Get method to send commands
Sometimes requires that Sonic Pi code be started, then stopped and the restarted
Pull up web browser and enter http://localhost:8080
The Sonic Pi code
# http_server2.rb
# 10 Dec 2018
## start this program then
## in browser address line enter http://localhost:8080
## https://blog.appsignal.com/2016/11/23/ruby-magic-building-a-30-line-http-server-in-ruby.html
xcue=0
request ="null"
live_loop :dr2 do
if (xcue>0)
puts request # GET /?note=71 HTTP/1.1\r\n"
if (request!=nil)
nn=(request.split("note="))[1]
if(nn != nil)
nnn=(nn.split[0]).to_i
puts nnn
play nnn, amp: 0.5
end
end
xcue=0
end
sleep 0.25
end
# use this to compact the html code
# https://www.espruino.com/File+Converter
## compacted HTML page to serve to browser
page="<!DOCTYPE html>\r\n<html>\r\n<body style=\"text-align:center;\">\r\n\r\n<form action=\"\" method=\"get\">\r\n<table style=\"width:50%\">\r\n\r\n<tr>\r\n<th> </th>\r\n <th><button name=\"note\" type=\"submit\" value=\"61\">C#4</button>\r\n</th>\r\n<th><button name=\"note\" type=\"submit\" value=\"63\">D#4</button>\r\n</th> \r\n<th> </th>\r\n<th><button name=\"note\" type=\"submit\" value=\"66\">F#4</button>\r\n</th>\r\n<th><button name=\"note\" type=\"submit\" value=\"68\">G#4</button>\r\n</th>\r\n <th><button name=\"note\" type=\"submit\" value=\"70\">A#4</button>\r\n</th>\r\n</tr>\r\n<tr>\r\n<td><button name=\"note\" type=\"submit\" value=\"60\">C4</button></td>\r\n<td><button name=\"note\" type=\"submit\" value=\"62\">D4</button></td>\r\n<td><button name=\"note\" type=\"submit\" value=\"64\">E4</button></td>\r\n<td><button name=\"note\" type=\"submit\" value=\"65\">F4</button></td>\r\n<td><button name=\"note\" type=\"submit\" value=\"67\">G4</button></td>\r\n<td><button name=\"note\" type=\"submit\" value=\"69\">A4</button></td>\r\n<td><button name=\"note\" type=\"submit\" value=\"71\">B4</button></td>\r\n<td><button name=\"note\" type=\"submit\" value=\"72\">C5</button></td>\r\n </tr>\r\n</table>\r\n</form>\r\n\r\n</body>\r\n</html>\r\n"
require 'socket'
server = TCPServer.new 8080
live_loop :two do
while session = server.accept
request = session.gets
session.print page
xcue=1
session.close
end
end
The HTML code
<!DOCTYPE html>
<html>
<body style="text-align:center;">
<form action="" method="get">
<table style="width:50%">
<tr>
<th> </th>
<th><button name="note" type="submit" value="61">C#4</button>
</th>
<th><button name="note" type="submit" value="63">D#4</button>
</th>
<th> </th>
<th><button name="note" type="submit" value="66">F#4</button>
</th>
<th><button name="note" type="submit" value="68">G#4</button>
</th>
<th><button name="note" type="submit" value="70">A#4</button>
</th>
<th> </th>
</tr>
<tr>
<td><button name="note" type="submit" value="60">C4</button></td>
<td><button name="note" type="submit" value="62">D4</button></td>
<td><button name="note" type="submit" value="64">E4</button></td>
<td><button name="note" type="submit" value="65">F4</button></td>
<td><button name="note" type="submit" value="67">G4</button></td>
<td><button name="note" type="submit" value="69">A4</button></td>
<td><button name="note" type="submit" value="71">B4</button></td>
<td><button name="note" type="submit" value="72">C5</button></td>
</tr>
</table>
</form>
</body>
</html>
The HTML code is processed by https://www.espruino.com/File+Converter
and the results copied and pastred into thesonic pi code as Page=“processed html”