wirtz
/
esp-link
mirror of https://github.com/jeelabs/esp-link.git
1
0
Fork 0
Code Issues Releases Wiki Activity

Button + text field handling

Browse Source
pull/193/head
Karai Csaba 9 years ago committed by Thorsten von Eicken
parent 1a03bcb5ca
commit cce1d9c04f
4 changed files with 126 additions and 15 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 77
      examples/dummy-web-server.pl
  2. 1
      examples/head-user-
  3. 14
      examples/web-server/LED.html
  4. 49
      html/userpage.js

77
examples/dummy-web-server.pl
Unescape View File

@ -1,10 +1,16 @@
#!/usr/bin/perl #!/usr/bin/perl
use strict; use strict;
use threads;
use threads::shared;
use IO::Socket::INET; use IO::Socket::INET;
use Data::Dumper; use Data::Dumper;
use File::Basename; use File::Basename;
my $ledLabel : shared = "LED is turned off";
# auto-flush on socket # auto-flush on socket
$| = 1; $| = 1;
@ -31,17 +37,7 @@ my $client;
while ($client = $server->accept()) while ($client = $server->accept())
{ {
my $pid ; threads->create( sub {
while (not defined ($pid = fork()))
{
sleep 5;
}
if ($pid)
{
close $client; # Only meaningful in the client
}
else
{
$client->autoflush(1); # Always a good idea $client->autoflush(1); # Always a good idea
close $server; close $server;
@ -72,7 +68,8 @@ while ($client = $server->accept())
# notify client that response has been sent # notify client that response has been sent
#shutdown($client, 1); #shutdown($client, 1);
} }
} } );
close $client; # Only meaningful in the client
} }
exit(0); exit(0);
@ -101,7 +98,13 @@ sub parse_http
$head =~ s/(GET|POST) //; $head =~ s/(GET|POST) //;
if( $head =~ /^([^ ]+) HTTP\/\d\.\d/ ) if( $head =~ /^([^ ]+) HTTP\/\d\.\d/ )
{ {
$resp{url} = $1; my $args = $1;
my $u = $args;
$u =~ s/\?.*$//g;
$args =~ s/^.*\?//g;
my %arg = split /[=\&]/, $args;
$resp{urlArgs} = \%arg;
$resp{url} = $u;
my %fields; my %fields;
while( my $arg = shift @lines ) while( my $arg = shift @lines )
@ -183,6 +186,18 @@ sub process_http
return error_response(400, $httpReq->{error}); return error_response(400, $httpReq->{error});
} }
if( $httpReq->{url} =~ /\.json$/ )
{
my $url = $httpReq->{url};
$url =~ s/\.json$//;
my $pth = dirname $0;
if( -f "$pth/web-server/$url" )
{
return process_user_comm($httpReq);
}
}
if( $httpReq->{method} eq 'GET' ) if( $httpReq->{method} eq 'GET' )
{ {
my $url = $httpReq->{url}; my $url = $httpReq->{url};
@ -320,3 +335,39 @@ sub readUserPages
return $add; return $add;
} }
sub process_user_comm_led
{
my ($http) = @_;
if( $http->{urlArgs}{reason} eq "button" )
{
my $btn = $http->{urlArgs}{id};
if($btn eq "btn_on" )
{
$ledLabel = "LED is turned on";
}
elsif($btn eq "btn_blink" )
{
$ledLabel = "LED is blinking";
}
elsif($btn eq "btn_off" )
{
$ledLabel = "LED is turned off";
}
}
my $r = '{"text": "' . $ledLabel . '"}';
return content_response($r, $http->{url});
}
sub process_user_comm()
{
my ($http) = @_;
if( $http->{url} eq '/LED.html.json' )
{
return process_user_comm_led($http);
}
}

1
examples/head-user-
Unescape View File

@ -5,6 +5,7 @@
<link rel="stylesheet" href="/style.css"> <link rel="stylesheet" href="/style.css">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<script src="/ui.js"></script> <script src="/ui.js"></script>
<script src="/userpage.js"></script>
</head> </head>
<body> <body>
<div id="layout"> <div id="layout">

14
examples/web-server/LED.html
Unescape View File

@ -1,3 +1,13 @@
<div> <div class="header">
<h1>Hello</h1> <h1>LED configuration</h1>
</div> </div>
<div class="content">
<p>
<button id="btn_on" type="button">Turn on</button>
<button id="btn_blink" type="button">Start blinking</button>
<button id="btn_off" type="button">Turn off</button>
</p>
<p id="text"/>
</div>
</body></html>

49
html/userpage.js
Unescape View File

@ -0,0 +1,49 @@
//===== Java script for user pages
function notifyResponse( data )
{
Object.keys(data).forEach(function(v) {
var elem = document.getElementById(v);
if( elem != null )
{
if(elem.tagName == "P" || elem.tagName == "DIV")
{
elem.innerHTML = data[v];
}
}
});
}
function notifyButtonPressed( btnId )
{
ajaxJson("POST", window.location.pathname + ".json?reason=button\&id=" + btnId, notifyResponse);
}
document.addEventListener("DOMContentLoaded", function(){
// collect buttons
var btns = document.getElementsByTagName("button");
var ndx;
for (ndx = 0; ndx < btns.length; ndx++) {
var btn = btns[ndx];
var id = btn.getAttribute("id");
var onclk = btn.getAttribute("onclick");
var type = btn.getAttribute("type");
if( id != null && onclk == null && type == "button" )
{
var fn;
eval( "fn = function() { notifyButtonPressed(\"" + id + "\") }" );
btn.onclick = fn;
}
}
// load variables at first time
var loadVariables = function() {
ajaxJson("GET", window.location.pathname + ".json?reason=load", notifyResponse,
function () { setTimeout(loadVariables, 1000); }
);
};
loadVariables();
});
Write Preview
Loading…
Cancel
Save