HTML Server on Sonic Pi


#1

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”


#2

Hmmm Tried this on my Mac with three different browsers and it doesn’t seem to work.


#3

I did this on Windows 10. Starting the Sonic Pi program and then pressing Stop several times so

that all threads are stopped. Restart then try to access with a browser.

Here is a simpler server that says hello and displays the time

# rbserver.rb
## in browser address line enter localhost:8080/
## https://blog.appsignal.com/2016/11/23/ruby-magic-building-a-30-line-http-server-in-ruby.html
x=0
live_loop :dr2 do
  #sync :two
  puts "two dr2",x
  if (x>0)
    play :C4, amp: 0.5
    x=0
  end
  sleep 0.25
end




require 'socket'
server = TCPServer.new 8080
live_loop :two do
  while session = server.accept
    request = session.gets
    session.print "HTTP/1.1 200\r\n" # 1
    session.print "Content-Type: text/html\r\n" # 2
    session.print "\r\n" # 3
    session.print "Hello world! The time is #{Time.now}" #4
    x=1
    session.close
  end
end

Google search What is my local IP address

Look for Mac methods for local IP addess
Mine is http://192.168.1.2:8080/
at least until my router gets reset

Found a new piece of freeware Muse score 2

Lets you create music, print it as sheet music, export it as pdf or as audio or as midi etc
Has screen piano keyboard, or pulg in a midi keyboard