Web page control from gpio or piface?

klintkrossa · Sat Apr 07, 2018 1:34 am

Hello,
It has been a while sense I have been on.
All the Google searches have just been able to confuse me.
Like the titles said was I would like to use an input to control a web page. I have a bunch of code to use for this in Python3. I have installed and got cgi working in apache2.

Is there a way that when there is an input from a gpio or piface to cause the web-page to change?

Some more information:
The raspberry pi is being used a web-page kiosk It will not have internet for some if not all the time so I can not use google!!

Klint

DougieLawson · Sat Apr 07, 2018 7:24 am

Here's an example: https://blog.3d-logic.com/2016/05/22/ho ... rage-door/

It's a bit old, so the stuff about installing pigpiod and getting it started at boot time is redundant. pigpiod is already installed in Raspbian. You just have to enable it with sudo raspi-config then 5 Interfacing Options then P8 Remote GPIO from the menu.

klintkrossa · Sun Apr 08, 2018 4:09 am

@DougieLawson

Hello,
There is a lot of infomation on how to control the gpio's from a web page. I am trying to go the other way around.
I hope to have 4 or more web pages, I would like to press a botton and have the only page that you can view is page 2 not page one.

table:

s1 s2 s3 s4 web page
0 0 0 0 default.html
1 0 0 0 add_product.html
0 1 0 0 add_to_locker.html
0 0 1 0 display_inventory.html
0 0 0 1 extra.html

I hope that this helps explain better what I want.

Klint

DougieLawson · Sun Apr 08, 2018 1:27 pm

Sorry, I've not tried it. I was only pointing you at someone else's project where they'd done something similar.

When I did it, as an example, (some years ago) I build a web page that generated MQTT messages (using a web CGI program). The MQTT messages were subscribed by a simple server that would switch GPIOs on and off. If I were starting again today it would be very different. [It was in the days when GPIO access needed sudo.]

klintkrossa · Sun Apr 08, 2018 6:22 pm

uggg,
LOL

I think i may have a way. i am going to have the main page update ever second or enter. Then the CGI/python3 is going to redirect to the page according to the botton.

DougieLawson · Sun Apr 08, 2018 7:43 pm

I'd use AJAX firing a CGI request (POST) for the controls from the buttons, so that you never re-direct away from the home page.

Code: Select all

<head>
<link rel="stylesheet" href="styles/XSwitch.css" />
<script src="lib/x-tag-components.js"></script>
<script src="lib/jquery-3.3.1.min.js"></script>
<link rel="import" href="classes/XSwitch.html" />
</head>
<body>
<table>
<tr><td>GPIO#01</td><td style="align:right;"><acidjs-xswitch id="GPIOAS1"></acidjs-xswitch></td></tr>
</table>
<script>
$.ajax({
	'url' : 'http://pi-home-control.local/cgi-bin/getCurrentStatus.cgi',
	'type' : 'GET',
	'data' : { 'q': 'str' },
	success: function(data) {
		var obj = $.parseJSON(data);
		var newHTML = '<script> $(document).ready(function() { ';
		$.each(obj, function(key, value) {
			if (value.status == 'on') {
				newHTML += ' $(\''+value.topic+'\').attr({mode:\"'+value.status+'\"});'}
	       	});
		newHTML += ' }); <\/script>';
		$('body').append(newHTML);
	},
	error: function(request, error) {
	}
});
</script>
<script>
$("#GPIOAS1").on("acidjs-xswitch-mode-change", function(e, data) {
 $.post("http://pi-home-control.local/cgi-bin/gpioactivate.cgi", { switch: "GPIOAS1:"+data.selected}) 
});
</script>
</body>

Using http://experiments.wemakesites.net/x-sw ... onent.html to drive the switches and make them look pretty.

The first CGI program reads current status to set the switch based on last time it was activated or deactivated. The second CGI program sets current status depending on user action on the HTML page.

klintkrossa · Wed Apr 11, 2018 12:53 am

Now that I have the button working.

I'd use AJAX firing a CGI request (POST) for the controls from the buttons, so that you never re-direct away from the home page.

Code: Select all

#!/usr/bin/python3
# -*- coding: utf-8 -*-

#imports
import cgi
import cgitb
cgitb.enable()
input_code = formdata.getfirst('input_code', '')
GPIOAS1 = formdata.getfirst('GPIOAS1', '')

How is the information returned to the buttons?

Web page control from gpio or piface?

Web page control from gpio or piface?

Re: Web page control from gpio or piface?

Re: Web page control from gpio or piface?

Re: Web page control from gpio or piface?

Re: Web page control from gpio or piface?

Re: Web page control from gpio or piface?

Re: Web page control from gpio or piface?