Skip to content
daddyfix edited this page Feb 28, 2014 · 13 revisions

Before continuing please read the Ten Minute Turtorial

##Setup There are four(4) parts to this working model with websocketd. Let the Manager.sh manage all your bash scripts when you need them.

  1. echo.sh
  2. count2.sh
  3. manager.sh
  4. websocket.html

##echo.sh

#!/bin/bash
#This script just echos a string or hello

if [ $# -gt 0 ]; then
    echo $1
else
    echo "Hello, Who are you?"
fi
exit

##count2.sh

#!/bin/bash
#This is a modified version of the count.sh script in the ten minute tutorial
C=$1
if [ "$C" -eq "$C" ] 2>/dev/null; then
    # $C is a number
    for COUNT in $(seq 1 $C); do
      echo $COUNT
      sleep 1
    done
else
    echo "Sorry, I can't count to $C"
fi
exit

##manager.sh

#!/bin/bash
#This script is a simple manager for all the other bash scripts.
#This way you only need one running websocketd process.
while read C
do
    cdir=`pwd`
    script=''

    # read the first arg to determine what script to run
    IFS=' ' read -a part <<< "$C"
    #remove the first part of the string, leave all the rest as args to pass to script
    args=${C#${part[0]} }

    if [ "${part[0]}" == "echo" ]; then
        script='echo.sh'

    elif [ "${part[0]}" == "count" ]; then
        script='count2.sh'
    fi

    if [ ! -z $script ]; then
        eval $cdir/$script $args
    else
        echo "I don't understand: $C"
    fi
done
exit

##websocket.html

Im using JQuery here cause Firefox can't interpret javascript onmessage replies from websocketd.

<!DOCTYPE html>
<html>
  <head>
    <!-- <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> -->
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <title>websocketd count example</title>
    <style>
      #wsresults {
          font-size: 15px;
          font-family: arial;
          margin: auto;
          padding: 10px;
          text-align: left;
      }
    </style>
  </head>
  <body>

    <div id="wsresults"></div>
    <div><a href="javascript: void(0);" id="1">echo 'Michael Was here'</a></div>
    <div><a href="javascript: void(0);" id="2">echo</a></div>
    <div><a href="javascript: void(0);" id="3">count to 10</a></div>
    <div><a href="javascript: void(0);" id="4">count to Michael</a></div>

    <script>
    //https://github.com/joewalnes/websocketd
    //https://github.com/joewalnes/websocketd/wiki/Websocketd-on-Raspberry-Pi
    var ws = new WebSocket('ws://localhost:8080/');

    ws.onopen = function() {
        document.body.style.backgroundColor = '#cfc';
    };
    ws.onclose = function() {
        document.body.style.backgroundColor = null;
    };
    ws.onerror = function(evt) {
        $('#wsresults').html('Error: '+event.data);
    };
    ws.onmessage = function(event) {
        $('#wsresults').html(event.data);
        //alert(event.data);
        //document.getElementById('count').innerText = event.data;
    };


    $(document).ready(function() {

        $('#1').on('click', function(e){
            if (ws) {
	            try {
		            ws.send("echo 'Michael was here.'");
	            } catch (ex) {
		            alert('Cannot send: '+ex);
	            }
            }
        });
        $('#2').on('click', function(e){
            if (ws) {
                try {
                        ws.send('echo');
                } catch (ex) {
                        alert('Cannot send: '+ex);
                }
            }
        });
        $('#3').on('click', function(e){
            if (ws) {
                try {
                        ws.send("count 10");
                } catch (ex) {
                        alert('Cannot send: '+ex);
                }
            }
        });
        $('#4').on('click', function(e){
            if (ws) {
                try {
                        ws.send("count 'Michael'");
                } catch (ex) {
                        alert('Cannot send: '+ex);
                }
            }
        });
    }); // end document ready
   </script>

  </body>
</html>

##Start websocketd

$ ./websocketd --port=8080 ./manager.sh

##HTML

Url: http://localhost:8080 Click a Link and test!

Clone this wiki locally