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. wsmanager.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

##wsmanager.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=''
    first=''
    args=''

    # does $C have arguments?
    spcs=`echo $C | grep \  | wc -l`
    if [ $spcs -eq 0 ]; then
        first=$C
    else
        # read the first arg to determine what script to run
        IFS=' ' read -a part <<< "$C"

        first=${part[0]}
        #remove the first part of the string, leave all the rest as args to pass to script
        args=${C#${part[0]} }
    fi

    # which script to run?
    if [ "$first" == "echo" ]; then
        script='echo.sh'

    elif [ "$first" == "count" ]; then
        script='count2.sh'
    fi

    if [ ! -z $script ]; then
        #echo $cdir/$script $args
        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://code.jquery.com/jquery-1.11.0.min.js"></script>
    <title>Websocketd With Bash</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 'JoeWalnes 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 Joe</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);
    };


    $(document).ready(function() {

        $('#1').on('click', function(e){
            if (ws) {
                try {
                    ws.send("echo 'JoeWalnes 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 'Joe'");
                } catch (ex) {
                        alert('Cannot send: '+ex);
                }
            }
        });
    }); // end document ready
   </script>

  </body>
</html>

##Start websocketd

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

##HTML

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

Clone this wiki locally