236 lines
No EOL
5.5 KiB
HTML
236 lines
No EOL
5.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" translate="no">
|
|
<head>
|
|
<title>A320 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" />
|
|
<style>
|
|
body {
|
|
font-size: 5rem;
|
|
margin: 0;
|
|
padding: 0;
|
|
background-color: black;
|
|
color: white;
|
|
font-family: sans-serif;
|
|
}
|
|
|
|
table {
|
|
margin: 0;
|
|
padding: 0;
|
|
word-wrap: normal;
|
|
overflow-wrap: normal;
|
|
}
|
|
|
|
tr {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
td {
|
|
margin: 0;
|
|
padding: 0;
|
|
text-align: center;
|
|
outline: 1px solid gray;
|
|
|
|
-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;
|
|
}
|
|
|
|
.enter {
|
|
font-size: 60%;
|
|
}
|
|
|
|
.enter tr:first-child {
|
|
font-size: 70%;
|
|
}
|
|
|
|
.enter tr:last-child {
|
|
font-size: 50%;
|
|
}
|
|
|
|
.enter td:first-child,
|
|
.enter td:last-child {
|
|
padding: 0 0.55em;
|
|
}
|
|
|
|
.menu,
|
|
.arrows .airport {
|
|
font-size: 40%;
|
|
line-height: 1em;
|
|
}
|
|
|
|
.menu td {
|
|
height: 2.5em;
|
|
}
|
|
|
|
.arrows td {
|
|
width: 50%;
|
|
padding: 0;
|
|
font-size: 60%;
|
|
}
|
|
|
|
img {
|
|
display: block;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<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 data-element="lcdimage" src="" style="width: 100%" /></td>
|
|
<td><br></td>
|
|
</tr>
|
|
<tr>
|
|
<td data-button="lskbutton:1">—</td>
|
|
<td data-button="rskbutton:1">—</td>
|
|
</tr>
|
|
<tr>
|
|
<td data-button="lskbutton:2">—</td>
|
|
<td data-button="rskbutton:2">—</td>
|
|
</tr>
|
|
<tr>
|
|
<td data-button="lskbutton:3">—</td>
|
|
<td data-button="rskbutton:3">—</td>
|
|
</tr>
|
|
<tr>
|
|
<td data-button="lskbutton:4">—</td>
|
|
<td data-button="rskbutton:4">—</td>
|
|
</tr>
|
|
<tr>
|
|
<td data-button="lskbutton:5">—</td>
|
|
<td data-button="rskbutton:5">—</td>
|
|
</tr>
|
|
<tr>
|
|
<td data-button="lskbutton:6">—</td>
|
|
<td data-button="rskbutton:6">—</td>
|
|
</tr>
|
|
<tr>
|
|
<td><br></td>
|
|
<td><br></td>
|
|
</tr>
|
|
</table>
|
|
<table class="menu" style="width: 100%">
|
|
<tr>
|
|
<td data-button="pagebutton:dirto" class="dirto">DIR</td>
|
|
<td data-button="pagebutton:prog" class="prog">PROG</td>
|
|
<td data-button="pagebutton:perf" class="perf">PERF</td>
|
|
<td data-button="pagebutton:init" class="init">INIT</td>
|
|
<td data-button="pagebutton:data" class="data">DATA</td>
|
|
<td></td>
|
|
<td>BRT</td>
|
|
</tr>
|
|
<tr>
|
|
<td data-button="pagebutton:f-pln" class="f-pln">F-PLN</td>
|
|
<td data-button="pagebutton:radnav" class="radnav">RAD<br>NAV</td>
|
|
<td data-button="pagebutton:fuel-pred" class="fuel-pred">FUEL<br>PRED</td>
|
|
<td data-button="" >SEC<br>F-PLN</td>
|
|
<td data-button="pagebutton:atc" class="atc">ATC<br>COMM</td>
|
|
<td data-button="pagebutton:mcdu" class="mcdu">MCDU<br>MENU</td>
|
|
<td>DIM</td>
|
|
</tr>
|
|
</table>
|
|
<table class="input" style="float: right; width: 62.5%">
|
|
<tr>
|
|
<td data-button="button:A">A</td>
|
|
<td data-button="button:B">B</td>
|
|
<td data-button="button:C">C</td>
|
|
<td data-button="button:D">D</td>
|
|
<td data-button="button:E">E</td>
|
|
</tr>
|
|
<tr>
|
|
<td data-button="button:F">F</td>
|
|
<td data-button="button:G">G</td>
|
|
<td data-button="button:H">H</td>
|
|
<td data-button="button:I">I</td>
|
|
<td data-button="button:J">J</td>
|
|
</tr>
|
|
<tr>
|
|
<td data-button="button:K">K</td>
|
|
<td data-button="button:L">L</td>
|
|
<td data-button="button:M">M</td>
|
|
<td data-button="button:N">N</td>
|
|
<td data-button="button:O">O</td>
|
|
</tr>
|
|
<tr>
|
|
<td data-button="button:P">P</td>
|
|
<td data-button="button:Q">Q</td>
|
|
<td data-button="button:R">R</td>
|
|
<td data-button="button:S">S</td>
|
|
<td data-button="button:T">T</td>
|
|
</tr>
|
|
<tr>
|
|
<td data-button="button:U">U</td>
|
|
<td data-button="button:V">V</td>
|
|
<td data-button="button:W">W</td>
|
|
<td data-button="button:X">X</td>
|
|
<td data-button="button:Y">Y</td>
|
|
</tr>
|
|
<tr>
|
|
<td data-button="button:Z">Z</td>
|
|
<td data-button="button:SLASH">/</td>
|
|
<td style="font-size: 50%" data-button="button:SP">SP</td>
|
|
<td style="font-size: 33%" data-button="button:OVFY">OVFY<br>△</td>
|
|
<td style="font-size: 33%" data-button="button:CLR">CLR</td>
|
|
</tr>
|
|
</table>
|
|
<table class="arrows" style="width: 29.5%">
|
|
<tr>
|
|
<td data-button="pagebutton:airport" class="airport">AIR<br>PORT</td>
|
|
<td></td>
|
|
</tr>
|
|
<tr>
|
|
<td data-button="arrowbutton:left" class="left">←</td>
|
|
<td data-button="arrowbutton:up" class="up">↑</td>
|
|
</tr>
|
|
<tr>
|
|
<td data-button="arrowbutton:right" class="right">→</td>
|
|
<td data-button="arrowbutton:down" class="down">↓</td>
|
|
</tr>
|
|
</table>
|
|
<table class="input" style="width: 30%">
|
|
<tr>
|
|
<td data-button="button:1">1</td>
|
|
<td data-button="button:2">2</td>
|
|
<td data-button="button:3">3</td>
|
|
</tr>
|
|
<tr>
|
|
<td data-button="button:4">4</td>
|
|
<td data-button="button:5">5</td>
|
|
<td data-button="button:6">6</td>
|
|
</tr>
|
|
<tr>
|
|
<td data-button="button:7">7</td>
|
|
<td data-button="button:8">8</td>
|
|
<td data-button="button:9">9</td>
|
|
</tr>
|
|
<tr>
|
|
<td data-button="button:DOT">.</td>
|
|
<td data-button="button:0">0</td>
|
|
<td
|
|
style="font-size: 3vw; width: 33.34%;" data-button="button:PLUSMINUS">
|
|
+/-
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
|
|
<script src="../js/mcdu.js"></script>
|
|
|
|
</body>
|
|
|
|
</html> |