AqualinkD/web/simulator.html

120 lines
4.1 KiB
HTML

<!DOCTYPE html>
<html lang='en'>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1252'>
<title>AqualinkD Simulator</title>
<meta name='viewport' content='width=device-width'>
<meta name='apple-mobile-web-app-capable' content='yes'>
<meta name='apple-mobile-web-app-status-bar-style' content='black'>
<meta name='apple-mobile-web-app-status-bar-style' content='black'>
<link href="aqualinkd.png" rel="apple-touch-icon">
<link href="aqualinkd.png" rel="icon">
<style>
/* Style the tab */
.tab {
overflow: hidden;
border: 1px solid #ccc;
background-color: #f1f1f1;
}
/* Style the buttons that are used to open the tab content */
.tab button {
background-color: inherit;
float: left;
border: none;
outline: none;
cursor: pointer;
padding: 14px 16px;
transition: 0.3s;
}
/* Change background color of buttons on hover */
.tab button:hover {
background-color: #ddd;
}
/* Create an active/current tablink class */
.tab button.active {
background-color: #ccc;
}
/* Style the tab content */
.tabcontent {
display: none;
/*padding: 6px 12px;*/
border: 1px solid #ccc;
border-top: none;
}
.tabiframe {
width: 100%;
height: 500px;
}
</style>
<script type='text/javascript'>
function openPage(evt, pageName) {
// Declare all variables
var i, tabcontent, tablinks;
// Get all elements with class="tabcontent" and hide them
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
// Get all elements with class="tablinks" and remove the class "active"
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
// Show the current tab, and add an "active" class to the button that opened the tab
document.getElementById(pageName).style.display = "block";
if (evt != null) {
evt.currentTarget.className += " active";
} else {
document.getElementById('opentab').className += " active";
}
}
</script>
<body onload="openPage(null, 'aqualinka_iframe');">
<div class="wrapper">
<div class="tab">
<button id="opentab" class="tablinks" onclick="openPage(event, 'aqualinka_iframe')">AqualinkD</button>
<button class="tablinks" onclick="openPage(event, 'allbutton_iframe')">Allbutton Simulator</button>
<button class="tablinks" onclick="openPage(event, 'onetouch_iframe')">One Touch Simulator</button>
<!--<button class="tablinks" onclick="openPage(event, 'iaqtouch')">iAqualink Touch Simulator</button>-->
<button class="tablinks" onclick="openPage(event, 'aquapda_iframe')">PDA Simulator</button>
</div>
<!-- Tab content -->
<div id="aqualinka_iframe" class="tabcontent">
<iframe id="aqd" src="/" class="tabiframe"></iframe>
</div>
<div id="allbutton_iframe" class="tabcontent">
<iframe id="aqd" src="/allbutton_sim.html" class="tabiframe"></iframe>
</div>
<div id="onetouch_iframe" class="tabcontent">
<iframe id="aqd" src="/onetouch_sim.html" class="tabiframe"></iframe>
</div>
<div id="aquapda_iframe" class="tabcontent">
<iframe id="aqd" src="/aquapda_sim.html" class="tabiframe"></iframe>
</div>
<div id="iaqtouch_iframe" class="tabcontent">
<iframe id="aqd" src="/iaqtouch_sim.html" class="tabiframe"></iframe>
</div>
</div>
</body>
</html>