A je to! / Mbed OS J_HTTP_Client

Dependencies:   DS1820

Fork of J_HTTP_Client by Jan Kamidra

Revision:
0:d90e1f7bda1f
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/ForServer/control.php	Sun May 13 16:31:13 2018 +0000
@@ -0,0 +1,300 @@
+<?php
+    session_start();
+    if($_SESSION["uname"] != true) {header("Location: index.php");;exit();}
+
+	$server = "sql.someweb.com";	// Here you place your MySQL server address
+	$user = "johnybravo";			// Here you place your user name of your MySQL
+	$pass = "bravo";				// Here you place your password of your MySQL
+	$db = "dtb";					// Here you place your name of your DTB
+
+	$mysql = mysql_connect($server, $user, $pass);  // Connect to MySQL
+	mysql_select_db($db);							// Select DTB of MySQL
+	
+	if(!$mysql)	
+	{
+		die("Unable connect to server!")
+	}
+	
+	if(isset( $_POST["submit"]))
+	{
+		If(isset($_POST["GPIO1"])){$gpio1 = 1;}else{$gpio1 = 0;}
+		If(isset($_POST["GPIO2"])){$gpio2 = 1;}else{$gpio2 = 0;}
+		If(isset($_POST["GPIO3"])){$gpio3 = 1;}else{$gpio3 = 0;}
+		
+		$myfile = fopen("gpio.txt", "w") or die("Unable to open file!");
+		$txt = 'gpio:'.$gpio1.' '.$gpio2.' '.$gpio3.'';
+		fwrite($myfile, $txt);
+		fclose($myfile); 
+	}
+
+	$doSql = mysql_query('SELECT * FROM nucleo_data WHERE id=1');
+	$row = mysql_fetch_array($doSql);
+	$temp = $row['temp'];
+	$time = $row['time'];
+	$date = $row['date'];
+	
+    if(!file_exists("gpio.txt"))
+    {
+    	$myfile = fopen("gpio.txt", "w");
+        $txt = 'gpio: 0 0 0';
+        fwrite($myfile, $txt);
+	    fclose($myfile); 
+    }
+    $myfile = fopen("gpio.txt", "r");
+	$gpio = fread($myfile,filesize("gpio.txt"));
+	fclose($myfile);
+?>
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset= "utf-8">
+		<title>Input/Output</title>
+		<style>
+			body
+			{
+				margin: 0;
+				padding: 0;
+				font-family: sans-serif;
+				/*background: white url("nucleo.jpg") no-repeat fixed center;*/
+			}
+			.box
+			{
+				position: absolute;
+				top: 50%;
+				left: 50%;
+				transform: translate(-50%,-50%);
+				width: 500px;
+				padding: 40px;
+				background: rgba(0,0,0,.8);
+				box-sizing:border-box;
+				box-shadow: 0 15px 25px rgba(0,0,0,.5);
+				border-radius: 10px;
+			}
+			.box h2
+			{
+				margin: 0 50px 30px;
+				padding: 0;
+				color: #fff;
+				text-align: center;
+			}
+
+
+			.box input[type="submit"]
+			{
+				background: transparent;
+				border: none;
+				outline: none;
+				color: #fff;
+				background: #03a9f4;
+				padding: 10px 30px;
+				cursor: pointer;
+				border-radius: 5px;
+			}
+			.box input[type="submit"]:hover
+			{
+				cursor: pointer;
+				background: #92b6d5;
+				color: #fff;
+			}
+
+			.box input[type=checkbox]
+			{
+				display: none;
+			}
+
+			.box label[id="other"]
+			{
+				position: relative;
+				padding: 0 10px;
+				font-size:16px;
+				color: #fff;
+				vertical-align: middle;
+				bottom: 10px;
+			}
+
+			.box input[type="checkbox"] + label[id="check"]
+			{
+				margin: 12px 0 0 0;
+				display: inline-block;
+				width: 60px;
+				height: 30px;
+				appearance: none;
+				background: #c6c6c6;
+				outline: 0;
+				border-radius: 20px;
+				box-shadow: inset 0 0 5px;
+				transition: .5;
+				position: relative;
+			}
+			.box input:checked[type="checkbox"] + label[id="check"]
+			{
+				background: #03a9f4
+			}
+			.box input[type="checkbox"] + label[id="check"]:before
+			{
+				content: '';
+				position: absolute;
+				width: 30px;
+				height: 30px;
+				border-radius:20px;
+				top: 0;
+				left: 0;
+				background-color: white;
+				transform: scale(0.9);
+				box-shadow: 0 2px 5px rgba(0,0,0,.2);
+				transition: .5s;
+			}
+			.box input:checked[type="checkbox"]+ label[id="check"]:before
+			{
+				left: 30px;
+			}
+			.box .loader
+			{
+				position: absolute;
+				top: 57%;
+				left: 68%;
+				transform: translate(-50%, -50%);
+				width: 200px;
+				height: 200px;
+				box-sizing: border-box;
+			}
+			.box .loader .face
+			{
+				position: absolute;
+				border: 2px solid #121212;
+			}
+			.box .loader .face.face1
+			{
+				top: 0;
+				left: 0;
+				right: 0;
+				bottom: 0;
+				background: transparent;
+				box-shadow: 0 0 10px rgba(0,0,0,1);
+				border-radius:50%;
+				border-left: 2px solid #ffff00;
+				border-top: 2px solid #ffff00;
+				animation: animate 10s linear infinite;
+			}
+			.box .loader .face.face2
+			{
+				top: 20px;
+				left: 20px;
+				right: 20px;
+				bottom: 20px;
+				background: transparent;
+				box-shadow: 0 0 10px rgba(0,0,0,1);
+				border-radius:50%;
+				border-right: 2px solid #03a9f4;
+				border-bottom: 2px solid #03a9f4;
+				animation: animate 30s linear reverse infinite;
+			}
+			.box .loader .face .circle
+			{
+				position: absolute;
+				top: calc(50% - 1px);
+				left: 50%;
+				width: 50%;
+				height: 2px;
+				transform-origin: left;
+			}
+			.box .loader .face.face1 .circle
+			{
+				transform: rotate(-45deg);
+			}
+			.box .loader .face.face2 .circle
+			{
+				transform: rotate(-45deg);
+			}
+			.box .loader .face .circle:before
+			{
+				content: '';
+				position: absolute;
+				width: 10px;
+				height: 10px;
+				border-radius: 50%;
+				background: #fff;
+				top: -4px;
+				right: -6px;
+			}
+			.box .loader .face.face1 .circle:before
+			{
+				background: #ffff00;
+				box-shadow: 0 0 20px #ff0,
+							0 0	40px #ff0,
+							0 0 60px #ff0,
+							0 0 80px #ff0,
+							0 0 100px #ff0,
+							0 0 0 5px rgba(255,255,0,.1);
+			}
+			.box .loader .face.face2 .circle:before
+			{
+				background: #03a9f4;
+				box-shadow: 0 0 20px #03a9f4,
+							0 0	40px #03a9f4,
+							0 0 60px #03a9f4,
+							0 0 80px #03a9f4,
+							0 0 100px #03a9f4,
+							0 0 0 5px rgba(3,169,244,.1);
+			}
+			@keyframes animateCircle
+			{
+				0%
+				{
+					transform: rotate(0deg);
+				}
+				100%
+				{
+					transform: rotate(360deg);
+				}
+			}
+			@keyframes animate
+			{
+				0%
+				{
+					transform: rotate(45deg);
+				}
+				100%
+				{
+					transform: rotate(405deg);
+				}
+			}
+			.loader .text
+			{
+				color: #fff;
+				top: 35%;
+				position: relative;
+				text-align: center;
+				font-size: 16px;
+			}
+		</style>
+	</head>
+	<body>
+		<div class="box">
+			<h2>Control panel</h2>
+			<form method="POST" action="#">
+				<div>
+					<input type="checkbox" name="GPIO1" id="checkbox_1" value="" <?php echo ($gpio[5]==1 ? 'checked' : '');?>><label id="check" for ="checkbox_1"></label>
+					<label id="other" for ="checkbox_1">LED1</label>
+					</br>
+					<input type="checkbox" name="GPIO2" id="checkbox_2" value="1" <?php echo ($gpio[7]==1 ? 'checked' : '');?>><label id="check" for ="checkbox_2"></label>
+					<label id="other" for ="checkbox_1">LED2</label>
+					</br>
+					<input type="checkbox" name="GPIO3" id="checkbox_3" value="1" <?php echo ($gpio[9]==1 ? 'checked' : '');?>><label id="check" for ="checkbox_3"></label>
+					<label id="other" for ="checkbox_1">LED3</label>
+				</div>
+				</br>
+				<div class="loader">
+					<div class="text">Temperature: <?php if(isset($temp)) { echo $temp; } ?>&#8451;</br> Date: <?php if(isset($date)) { echo $date; } ?></br>Time: <?php if(isset($time)) { echo $time; } ?></div>
+					<div class="face face1">
+						<div class="circle"></div>
+					</div>
+					<div class="face face2">
+						<div class="circle"></div>
+					</div>
+				</div>
+				<input type="submit" name="submit" value="submit">
+			</form>
+		</div>
+	</body>
+</html>
\ No newline at end of file