1
0
Fork 0

MCDU web moved as webpanel

- MCDU as webpanel (not visible on PHI)
- New menu to access MCDU web
- Open via browser or QRCode
- Fixed MCDU web text selection #230
This commit is contained in:
Inuyaksa 2021-06-11 19:34:00 +02:00
parent d18b121223
commit 8c470e641c
3 changed files with 182 additions and 15 deletions

View file

@ -457,6 +457,16 @@
]]></script>
</binding>
</item>
<item>
<label>MCDU (web)</label>
<binding>
<command>nasal</command>
<script>
var mcduweb_dlg = gui.Dialog.new("sim/gui/dialogs/mcduweb/dialog", "Aircraft/A320-family/gui/dialogs/mcduweb.xml");
mcduweb_dlg.open();
</script>
</binding>
</item>
</menu>
<menu n="105">
<label>Utilities</label>

View file

@ -1,12 +1,18 @@
<!DOCTYPE html>
<html>
<html lang="en" translate="no">
<head>
<title>MCDU</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<link rel="manifest" href="mcdu_manifest.json" />
<meta name="apple-mobile-web-app-status-bar" content="#db4938" />
<meta name="theme-color" content="#db4938" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<script>
let screen;
let screen_src;
let blank_src;
let loading = 0;
let scheduled_load = 0;
function refresh_screen() {
@ -44,6 +50,7 @@
let tds = document.querySelectorAll('.input td');
for (const td of tds) {
td.addEventListener('click', function () {
if (td.className == "disabled") return;
press_button("button", td.textContent);
}, true);
}
@ -55,7 +62,7 @@
}
tds = document.querySelectorAll('.menu td');
for (const td of tds) {
td.addEventListener('click', function () {
td.addEventListener('click', function () {
press_button("pagebutton", td.className);
}, true);
}
@ -73,8 +80,9 @@
refresh_screen();
}
});
screen_src = screen.src;
window.setInterval(refresh_screen, 1000);
blank_src = screen_src;
screen_src = "/screenshot?canvasindex=10&type=png";
setInterval(refresh_screen, 1000);
}, true);
</script>
<style>
@ -89,12 +97,15 @@
table {
margin: 0;
padding: 0
padding: 0;
touch-action: none;
word-wrap: normal;
overflow-wrap: normal;
}
tr {
margin: 0;
padding: 0
padding: 0;
}
td {
@ -102,23 +113,32 @@
padding: 0;
text-align: center;
outline: 1px solid gray;
touch-action: manipulation;
-ms-user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none;
-khtml-user-select: none;
user-select: none;
overflow: hidden;
text-overflow: clip;
}
td:active {
background-color: white;
color: black
color: black;
}
.enter {
font-size: 60%
font-size: 60%;
}
.enter tr:first-child {
font-size: 70%
font-size: 70%;
}
.enter tr:last-child {
font-size: 50%
font-size: 50%;
}
.enter td:first-child,
@ -148,11 +168,11 @@
</style>
</head>
<body style="width: 100%">
<body style="width: 100%" oncontextmenu="return false;">
<table class="enter" style="width: 100%">
<tr>
<td><br></td>
<td rowspan="8" style="vertical-align: top"><img src="/screenshot?canvasindex=10&type=png"
<td rowspan="8" style="vertical-align: top"><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABAAAAANgAQMAAACIgIgUAAAAA1BMVEUAAACnej3aAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAgklEQVR42u3BAQEAAACCIP+vbkhAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA7wazbwABRxu5owAAAABJRU5ErkJggg=="
style="width: 100%" /></td>
<td><br></td>
</tr>
@ -245,7 +265,7 @@
<td>Z</td>
<td>/</td>
<td style="font-size: 50%">SP</td>
<td style="font-size: 33%">OVFY<br></td>
<td style="font-size: 33%" class="disabled">OVFY<br></td>
<td style="font-size: 33%">CLR</td>
</tr>
</table>
@ -283,11 +303,11 @@
<td>.</td>
<td>0</td>
<td
style="font-size: 3vw; width: 33.333333333333333333333333333333333333333333333333333333333333333333333%; /* :) */">
style="font-size: 3vw; width: 33.333333333333333333333333333333333333333333333333333333333333333333333%; /* :) */" class="disabled">
+/-
</td>
</tr>
</table>
</body>
</html>
</html>

137
gui/dialogs/mcduweb.xml Normal file
View file

@ -0,0 +1,137 @@
<?xml version="1.0" encoding="UTF-8" ?>
<!-- Copyright (c) 2020 Josh Davidson (Octal450) -->
<!-- A3XX MCDU web launcher Dialog -->
<PropertyList>
<name>mcdu-web</name>
<layout>vbox</layout>
<pref-width>480</pref-width>
<group>
<layout>hbox</layout>
<text>
<halign>left</halign>
<label>MCDU web on browser/tablet/smartphone</label>
</text>
<button>
<halign>right</halign>
<pref-width>20</pref-width>
<pref-height>20</pref-height>
<legend>X</legend>
<key>Esc</key>
<binding>
<command>dialog-close</command>
</binding>
</button>
</group>
<hrule/>
<group>
<layout>vbox</layout>
<text>
<halign>left</halign>
<label>Please check: HTTP service running is required.</label>
<visible>
<equals>
<property>/sim/http/running</property>
<value>0</value>
</equals>
</visible>
</text>
<text>
<halign>left</halign>
<label>Start FlightGear with -httpd=8080</label>
<visible>
<equals>
<property>/sim/http/running</property>
<value>0</value>
</equals>
</visible>
</text>
</group>
<group>
<layout>vbox</layout>
<text>
<halign>center</halign>
<label>Open MCDU on browser</label>
</text>
<button>
<halign>center</halign>
<legend>launch browser</legend>
<binding>
<command>nasal</command>
<script>
var n = getprop("/sim/http/running",0);
if( n != 1 ) {
gui.popupTip("Internal webserver not running. Restart FlightGear with -httpd=8080", 5.0);
} else {
var _url = "http://localhost:" ~ getprop("/sim/http/options/listening-port") ~ "/aircraft-dir/WebPanel/mcdu.html";
fgcommand("open-browser", props.Node.new({ "url": _url }));
}
</script>
</binding>
</button>
</group>
<group>
<layout>vbox</layout>
<text>
<halign>center</halign>
<label></label>
</text>
<text>
<halign>center</halign>
<label>Scan QR code with your smartphone or tablet</label>
</text>
</group>
<canvas>
<name>mcduwebqr</name>
<valign>center</valign>
<halign>center</halign>
<stretch>false</stretch>
<pref-width>320</pref-width>
<pref-height>320</pref-height>
<nasal>
<load>
<![CDATA[
var n = props.globals.getNode("/sim/http/running");
var mcdu_canvas_dlg = canvas.get(cmdarg());
var root = mcdu_canvas_dlg.createGroup();
mcdu_canvas_dlg.setColorBackground(1, 1, 1, 1);
var _url = "";
if( getprop("sim/http/running",0) == 1 ) _url = "http://localhost:" ~ getprop("/sim/http/options/listening-port") ~ "/aircraft-dir/WebPanel/mcdu.html";
root.createChild("image").set("src", "https://qr.eletto.dev/" ~ _url).setSize(300,300).setTranslation(10,10);
]]>
</load>
<unload>
<![CDATA[
mcdu_canvas_dlg.del();
mcdu_canvas_dlg = nil;
root = nil;
]]>
</unload>
</nasal>
</canvas>
<group>
<layout>vbox</layout>
<text>
<halign>center</halign>
<label>* QRCode provided by https://qr.eletto.dev/</label>
</text>
</group>
</PropertyList>