HTTP RPC Server mit vordefinierten Objekten

Dependencies:   EthernetInterface HttpServer Servo mbed-rtos mbed

Fork of RPCHTTPServerVariable by th.iotkit2.ch

Mittels RPCVariable lassen sich lokale Variablen setzen. Diese Variablen können gesetzt write oder gelesen read werden.

Mittels Ticker u.ä. Varianten lassen sich damit auch Objektwerte setzen, welche von RPC nicht unterstützt werden, z.B. Servo's.

Client

Wert setzen: http://<IP-Adresse mbed>/rpc/servo2/write+0.5

Web-APP/index.html

Committer:
stefan1691
Date:
2016-03-20
Revision:
17:752e17b9aab4
Parent:
16:0eadcfedd078

File content as of revision 17:752e17b9aab4:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="author" content="Marcel Bernet, Zuerich">
<title>mbed Web-App</title>
<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css" />
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="https://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
</head>
<body>
    <form>
        <div data-role="page" id="page-index" data-title="mbed App">
 
            <div data-role="header" class="ui-header ui-bar-c">
                <a href="#left-panel" data-icon="bars" data-iconpos="notext" data-shadow="false" data-iconshadow="false">Menu</a>
                <h1>mbed Web-App</h1>
                <img src="./img/logo.png" width="30" class="ui-btn-right" />
            </div>
 
            <div data-role="content">
 
                 <div class="ui-field-contain">
                    <label for="addr">IP-Adresse</label> 
                    <input type="text" name="addr" id="addr" value="http://192.168.178.35/rpc/"></input>
                </div>
 
                <div class="ui-field-contain">
                    <label for="led-1">LED 1</label> 
                    <select name="led1" id="led1" data-role="slider">
                        <option value="Off">Off</option>
                        <option value="On">On</option>
                    </select>
                </div>
                <div class="ui-field-contain">
                    <label for="led-2">LED 2</label> <select name="led2" id="led2" data-role="slider">
                        <option value="Off">Off</option>
                        <option value="On">On</option>
                    </select>
                </div>
                <div class="ui-field-contain" id="servo1f">
                    <label for="servo-1">Servo 1:</label> 
                    <input name="servo1" id="servo1" type="range" min="0" max="100" value="50">
                </div>
            </div>
        </div>
        <script type="text/javascript">
$('select#led1').change(function() 
{
    var server = document.getElementById("addr").value;
    var myswitch = $(this);
    var name     = myswitch[0].name;
    var url      = myswitch[0].selectedIndex == 1 ? server + name + '/write 1' : server + name + '/write 0';
    $.get( url );
}); 
$('select#led2').change(function() 
{
    var server = document.getElementById("addr").value;
    var myswitch = $(this);
    var name     = myswitch[0].name;
    var url      = myswitch[0].selectedIndex == 1 ? server + name + '/write 1' : server + name + '/write 0';
    $.get( url );   
}); 
$("#servo1f").on("slidestop", "#servo1", function(event) 
{
    var server = document.getElementById("addr").value;
    var val = $(this).val() / 100.0;
    $.get( server + 'servo1/write ' + val );
    console.log( server + 'servo1/write ' + val );
});
        </script>
    </form>
</body>
</html>