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:
parent
d18b121223
commit
8c470e641c
3 changed files with 182 additions and 15 deletions
|
@ -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>
|
||||
|
|
|
@ -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
137
gui/dialogs/mcduweb.xml
Normal 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>
|
Loading…
Add table
Reference in a new issue