network settings page

html_orig/_debug_replacements.php

@@ -39,4 +39,15 @@ return [
 	'%vers_httpd%' => '4.5.6',
 	'%vers_sdk%' => '1.52',
 	'%githubrepo%' => 'https://github.com/MightyPork/esp-vt100-firmware',
+
+	'%ap_dhcp_time%' => '120',
+	'%ap_dhcp_start%' => '192.168.4.100',
+	'%ap_dhcp_end%' => '192.168.4.200',
+	'%ap_addr_ip%' => '192.168.4.1',
+	'%ap_addr_mask%' => '255.255.255.0',
+
+	'%sta_dhcp_enable%' => '1',
+	'%sta_addr_ip%' => '192.168.0.33',
+	'%sta_addr_mask%' => '255.255.255.0',
+	'%sta_addr_gw%' => '192.168.0.1',
 ];

html_orig/_pages.php

@@ -2,27 +2,32 @@
 
 $pages = [];
 
-/** Add a page */
+if (! function_exists('pg')) {
-function pg($key, $bc, $path) {
+	/** Add a page */
-	global $pages;
+	function pg($key, $bc, $path, $titleKey = null)
-	$pages[$key] = (object) [
+	{
-		'bodyclass' => $bc,
+		global $pages;
-		'path' => $path,
+		$pages[$key] = (object) [
-		'label' => tr("menu.$key"),
+			'key' => $key,
-	];
+			'bodyclass' => $bc,
+			'path' => $path,
+			'label' => tr("menu.$key"),
+			'title' => $titleKey ? tr($titleKey) : tr("menu.$key"),
+		];
+	}
 }
 
 pg('cfg_wifi', 'cfg', '/cfg/wifi');
 pg('cfg_wifi_conn', '', '/wifi/connecting'); // page without menu that tries to show the connection progress
 pg('cfg_network', 'cfg', '/cfg/network');
-pg('cfg_term', 'cfg', '/cfg/term');
+//pg('cfg_term', 'cfg', '/cfg/term');
-pg('about', 'cfg page-about', '/about');
 pg('help', 'cfg page-help', '/help');
-pg('term', 'term', '/');
+pg('about', 'cfg page-about', '/about');
+pg('term', 'term', '/', 'title.term');
 
 // ajax API
-pg('wifi_set', '', '/wifi/set');//'/cfg/wifi/set');
+pg('wifi_set', 'api', '/wifi/set');//'/cfg/wifi/set');
-pg('wifi_scan', '', '/wifi/scan');//'/cfg/wifi/scan');
+pg('wifi_scan', 'api', '/wifi/scan');//'/cfg/wifi/scan');
-pg('wifi_connstatus', '', '/wifi/connstatus');
+pg('wifi_connstatus', 'api', '/wifi/connstatus');
 
 return $pages;

html_orig/base.php

@@ -0,0 +1,71 @@
+<?php
+
+/**
+ * The common stuff required by both index.php and build_html.php
+ * this must be required_once
+ */
+
+if (defined('BASE_INITED')) return;
+define('BASE_INITED', true);
+
+if (!empty($argv[1])) {
+	parse_str($argv[1], $_GET);
+}
+
+if (!file_exists(__DIR__ . '/_env.php')) {
+	die("Copy <b>_env.php.example</b> to <b>_env.php</b> and check the settings inside!");
+}
+
+require_once __DIR__ . '/_env.php';
+
+$prod = defined('STDIN');
+define('DEBUG', !$prod);
+$root = DEBUG ? json_encode(ESP_IP) : 'window.location.href';
+define('JS_WEB_ROOT', $root);
+
+define('LOCALE', isset($_GET['locale']) ? $_GET['locale'] : 'en');
+
+$_messages = require(__DIR__ . '/lang/' . LOCALE . '.php');
+$_pages = require(__DIR__ . '/_pages.php');
+
+define('APP_NAME', 'ESPTerm');
+
+/** URL (dev or production) */
+function url($name, $relative = false)
+{
+	global $_pages;
+	if ($relative) return $_pages[$name]->path;
+
+	if (DEBUG) return "/index.php?page=$name";
+	else return $_pages[$name]->path;
+}
+
+/** URL label for a button */
+function label($name)
+{
+	global $_pages;
+	return $_pages[$name]->label;
+}
+
+function e($s)
+{
+	return htmlspecialchars($s, ENT_HTML5 | ENT_QUOTES);
+}
+
+function tr($key)
+{
+	global $_messages;
+	return isset($_messages[$key]) ? $_messages[$key] : ('??' . $key . '??');
+}
+
+/** Like eval, but allows <?php and ?> */
+function include_str($code)
+{
+	$tmp = tmpfile();
+	$tmpf = stream_get_meta_data($tmp);
+	$tmpf = $tmpf ['uri'];
+	fwrite($tmp, $code);
+	$ret = include($tmpf);
+	fclose($tmp);
+	return $ret;
+}

html_orig/build_html.php

@@ -0,0 +1,19 @@
+<?php
+
+require_once __DIR__ . '/base.php';
+
+ob_start();
+foreach($_pages as $_k => $p) {
+	if ($p->bodyclass == 'api') continue;
+	echo "Generating: $_k ($p->title)\n";
+	$_GET['page'] = $_k;
+	ob_flush();                                   // print the message
+	ob_clean();                                   // clean up
+	include(__DIR__ . '/index.php');
+	$s = ob_get_contents();                       // grab the output
+	ob_clean();                                   // clean up
+	$of = __DIR__ . '/../html/' . $_k . '.tpl';
+	file_put_contents($of, $s);                   // write to a file
+}
+
+ob_flush();

html_orig/index.php

@@ -1,68 +1,21 @@
 <?php
 
-if (! file_exists('_env.php')) {
+require_once __DIR__ . '/base.php';
-	die("Copy <b>_env.php.example</b> to <b>_env.php</b> and check the settings inside!");
-}
-require '_env.php';
-
-$prod = defined('STDIN');
-define ('DEBUG', !$prod);
-$root = DEBUG ? json_encode(ESP_IP) : 'window.location.href';
-define ('JS_WEB_ROOT', $root);
-
-define('CUR_PAGE', $_GET['page'] ?: 'term');
-define('LOCALE', $_GET['locale'] ?: 'en');
-
-$_messages = require(__DIR__ . '/lang/' . LOCALE . '.php');
-$_pages = require('_pages.php');
 
-define('APP_NAME', 'ESPTerm');
+if (!isset($_GET['page'])) $_GET['page'] = 'term';
-define('PAGE_TITLE', $_pages[CUR_PAGE]->label . ' :: ' . APP_NAME);
-define('BODYCLASS', $_pages[CUR_PAGE]->bodyclass);
 
-/** URL (dev or production) */
+$_GET['PAGE_TITLE'] = $_pages[$_GET['page']]->title . ' :: ' . APP_NAME;
-function url($name, $relative=false) {
+$_GET['BODYCLASS'] = $_pages[$_GET['page']]->bodyclass;
-	global $_pages;
-	if ($relative) return $_pages[$name]->path;
-
-	if (DEBUG) return "/index.php?page=$name";
-	else return $_pages[$name]->path;
-}
-
-/** URL label for a button */
-function label($name) {
-	global $_pages;
-	return $_pages[$name]->label;
-}
 
-function e($s) {
+require __DIR__ . '/pages/_head.php';
-	return htmlspecialchars($s, ENT_HTML5|ENT_QUOTES);
+$_pf = __DIR__ . '/pages/'.$_GET['page'].'.php';
-}
-
-function tr($key) {
-	global $_messages;
-	return $_messages[$key] ?: ('??'.$key.'??');
-}
-
-/** Like eval, but allows <?php and ?> */
-function include_str($code) {
-	$tmp = tmpfile();
-	$tmpf = stream_get_meta_data($tmp);
-	$tmpf = $tmpf ['uri'];
-	fwrite($tmp, $code);
-	$ret = include($tmpf);
-	fclose($tmp);
-	return $ret;
-}
-
-require 'pages/_head.php';
-$_pf = 'pages/'.CUR_PAGE.'.php';
 if (file_exists($_pf)) {
 	$f = file_get_contents($_pf);
-	$reps = require('_debug_replacements.php');
+	$reps = DEBUG ? require(__DIR__ . '/_debug_replacements.php') : [];
 	$str = str_replace(array_keys($reps), array_values($reps), $f);
 	include_str($str);
 } else {
 	echo "404";
 }
-require 'pages/_tail.php';
+
+require __DIR__ . '/pages/_tail.php';

html_orig/lang/en.php

@@ -7,12 +7,39 @@ return [
 	'menu.cfg_network' => 'Network Configuration',
 	'menu.cfg_term' => 'Terminal Settings',
 	'menu.about' => 'About ESPTerm',
-	'menu.help' => 'Terminal Help',
+	'menu.help' => 'Quick Reference',
 	'menu.term' => 'Back to Terminal',
 	'menu.cfg_wifi_conn' => 'Connecting to External Network',
 
-	'box.ap' => 'Built-in Access Point',
+	'title.term' => 'Terminal',
-	'box.sta' => 'Connect to External Network',
+
+	'net.ap' => 'Access Point DHCP Config',
+	'net.sta' => 'Client IP Config',
+
+	'net.explain_sta' => '
+		Those settings affect the built-in DHCP client. Switching it off
+		makes ESPTerm use the configured static IP. Please double-check
+		those settings before submitting, setting them incorrectly may
+		make it hard to access ESPTerm via the external network.',
+
+	'net.explain_ap' => '
+		Those settings affect the built-in DHCP server in AP mode.
+		Please double-check those settings before submitting, setting them
+		incorrectly may render ESPTerm inaccessible via the AP.',
+
+	'net.ap_dhcp_time' => 'Lease time',
+	'net.ap_dhcp_start' => 'Pool start IP',
+	'net.ap_dhcp_end' => 'Pool end IP',
+	'net.ap_addr_ip' => 'Own IP address',
+	'net.ap_addr_mask' => 'Subnet mask',
+
+	'net.sta_dhcp_enable' => 'Enable DHCP',
+	'net.sta_addr_ip' => 'ESPTerm static IP',
+	'net.sta_addr_mask' => 'Subnet mask',
+	'net.sta_addr_gw' => 'Gateway IP',
+
+	'wifi.ap' => 'Built-in Access Point',
+	'wifi.sta' => 'Connect to External Network',
 
 	'wifi.enable' => 'Enabled:',
 	'wifi.tpw' => 'Transmit Power:',
@@ -30,7 +57,6 @@ return [
 	'wifi.sta_active_nopw' => '🔓 Open access',
 	'wifi.connected_ip_is' => 'Connected, IP is ',
 
-	'wifi.submit' => 'Apply!',
 	'wifi.scanning' => 'Scanning',
 	'wifi.scan_now' => 'Start scanning!',
 	'wifi.cant_scan_no_sta' => 'Can\'t scan with Client mode disabled.',
@@ -45,6 +71,7 @@ return [
 	'wifi.conn.working' => "Connecting to selected AP",
 	'wifi.conn.fail' => "Connection failed, check your password and try again.",
 
+	'apply' => 'Apply!',
 	'enabled' => 'Enabled',
 	'disabled' => 'Disabled',
 	'yes' => 'Yes',

html_orig/pages/_cfg_menu.php

@@ -6,7 +6,7 @@
 	foreach($_pages as $k => $page) {
 		if (strpos($page->bodyclass, 'cfg') === false) continue;
 
-		$sel = (CUR_PAGE == $k) ? ' class="selected"' : '';
+		$sel = ($_GET['page'] == $k) ? ' class="selected"' : '';
 		$text = $page->label;
 		$url = e(url($k));
 		echo "<a href=\"$url\"$sel>$text</a>";

html_orig/pages/_head.php

@@ -4,16 +4,16 @@
 	<meta charset="utf-8">
 	<meta http-equiv="X-UA-Compatible" content="IE=edge">
 	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-	<title><?= PAGE_TITLE ?></title>
+	<title><?= $_GET['PAGE_TITLE'] ?></title>
 	<link href="/css/app.css" rel="stylesheet">
 	<script src="/js/app.js"></script>
 	<script>var _root = <?= JS_WEB_ROOT ?>;</script>
 </head>
-<body class="<?= BODYCLASS ?>">
+<body class="<?= $_GET['BODYCLASS'] ?>">
 <div id="outer">
 <?php
 $cfg = false;
-if (strpos($_pages[CUR_PAGE]->bodyclass, 'cfg') !== false) {
+if (strpos($_GET['BODYCLASS'], 'cfg') !== false) {
 	$cfg = true;
 	require __DIR__ . '/_cfg_menu.php';
 }
@@ -22,5 +22,5 @@ if (strpos($_pages[CUR_PAGE]->bodyclass, 'cfg') !== false) {
 <div id="content">
 <img src="/img/loader.gif" alt="Loading…" id="loader">
 <?php if ($cfg): ?>
-<h1><?= tr('menu.' . CUR_PAGE) ?></h1>
+<h1><?= tr('menu.' . $_GET['page']) ?></h1>
 <?php endif; ?>

html_orig/pages/cfg_network.php

@@ -0,0 +1,76 @@
+<?php
+$ipmask='pattern="^([0-9]{1,3}\.){3}[0-9]{1,3}$"';
+?>
+
+<form class="Box str mobcol" action="<?= e(url('wifi_set')) ?>" method="GET">
+	<h2><?= tr('net.ap') ?></h2>
+
+	<div class="Row buttons">
+		<input type="submit" value="<?= tr('apply') ?>">
+	</div>
+
+	<div class="Row mq-phone" style="height: 35px"></div>
+	<div class="Row" style="max-width: 600px; margin-left: 0">
+		<?= tr('net.explain_ap') ?>
+	</div>
+
+	<div class="Row">
+		<label for="ap_dhcp_time"><?= tr('net.ap_dhcp_time') ?><span class="mq-phone">&nbsp;(min)</span></label>
+		<input type="number" step=1 min=1 max=2880 name="ap_dhcp_time" id="ap_dhcp_time" value="%ap_dhcp_time%" required>
+		<span class="mq-no-phone">&nbsp;(min)</span>
+	</div>
+
+	<div class="Row">
+		<label for="ap_dhcp_start"><?= tr('net.ap_dhcp_start') ?></label>
+		<input type="text" name="ap_dhcp_start" id="ap_dhcp_start" value="%ap_dhcp_start%" <?=$ipmask?> required>
+	</div>
+
+	<div class="Row">
+		<label for="ap_dhcp_end"><?= tr('net.ap_dhcp_end') ?></label>
+		<input type="text" name="ap_dhcp_end" id="ap_dhcp_end" value="%ap_dhcp_end%" <?=$ipmask?> required>
+	</div>
+
+	<div class="Row">
+		<label for="ap_addr_ip"><?= tr('net.ap_addr_ip') ?></label>
+		<input type="text" name="ap_addr_ip" id="ap_addr_ip" value="%ap_addr_ip%" <?=$ipmask?> required>
+	</div>
+
+	<div class="Row">
+		<label for="ap_addr_mask"><?= tr('net.ap_addr_mask') ?></label>
+		<input type="text" name="ap_addr_mask" id="ap_addr_mask" value="%ap_addr_mask%" <?=$ipmask?> required>
+	</div>
+</form>
+
+<form class="Box str mobcol" action="<?= e(url('wifi_set')) ?>" method="GET">
+	<h2><?= tr('net.sta') ?></h2>
+
+	<div class="Row buttons">
+		<input type="submit" value="<?= tr('apply') ?>">
+	</div>
+
+	<div class="Row mq-phone" style="height: 35px"></div>
+	<div class="Row" style="max-width: 600px; margin-left: 0">
+		<?= tr('net.explain_sta') ?>
+	</div>
+
+	<div class="Row checkbox">
+		<label><?= tr('net.sta_dhcp_enable') ?></label><!--
+		--><span class="box"></span>
+		<input type="hidden" name="sta_dhcp_enable" value="%sta_dhcp_enable%">
+	</div>
+
+	<div class="Row">
+		<label for="sta_addr_ip"><?= tr('net.sta_addr_ip') ?></label>
+		<input type="text" name="sta_addr_ip" id="sta_addr_ip" value="%sta_addr_ip%" <?=$ipmask?> required>
+	</div>
+
+	<div class="Row">
+		<label for="sta_addr_mask"><?= tr('net.sta_addr_mask') ?></label>
+		<input type="text" name="sta_addr_mask" id="sta_addr_mask" value="%sta_addr_mask%" <?=$ipmask?> required>
+	</div>
+
+	<div class="Row">
+		<label for="sta_addr_gw"><?= tr('net.sta_addr_gw') ?></label>
+		<input type="text" name="sta_addr_gw" id="sta_addr_gw" value="%sta_addr_gw%" <?=$ipmask?> required>
+	</div>
+</form>

html_orig/pages/cfg_wifi.php

@@ -1,12 +1,8 @@
 <form class="Box str mobcol" action="<?= e(url('wifi_set')) ?>" method="GET">
-	<h2><?= tr('box.ap') ?></h2>
+	<h2><?= tr('wifi.ap') ?></h2>
 
-	<div class="Row buttons mq-phone">
+	<div class="Row buttons">
-		<input type="submit" value="<?= tr('wifi.submit') ?>">
+		<input type="submit" value="<?= tr('apply') ?>">
-	</div>
-
-	<div class="Row buttons mq-no-phone">
-		<input type="submit" value="<?= tr('wifi.submit') ?>">
 	</div>
 
 	<div class="Row checkbox">
@@ -47,14 +43,10 @@
 </form>
 
 <form class="Box str mobcol" action="<?= e(url('wifi_set')) ?>" method="GET">
-	<h2><?= tr('box.sta') ?></h2>
+	<h2><?= tr('wifi.sta') ?></h2>
-
-	<div class="Row buttons mq-phone">
-		<input type="submit" value="<?= tr('wifi.submit') ?>">
-	</div>
 
-	<div class="Row buttons mq-no-phone">
+	<div class="Row buttons">
-		<input type="submit" value="<?= tr('wifi.submit') ?>">
+		<input type="submit" value="<?= tr('apply') ?>">
 	</div>
 
 	<div class="Row checkbox">

html_orig/pages/term.php

@@ -7,7 +7,7 @@
 	}, 2000);
 </script>
 
-<h1 onclick="location.href='<?= e(url('cfg_wifi_simple')) ?>'">%term_title%</h1>
+<h1>%term_title%</h1>
 
 <div id="termwrap">
 	<div id="screen"></div>