109 lines
3.9 KiB
HTML
109 lines
3.9 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="UTF-8"/>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
|
<title>🕷️ SpiderADB</title>
|
|
<link rel="stylesheet" href="./holo-web/holo-base-elements.css"/>
|
|
<link rel="stylesheet" href="./holo-web/holo-base-widgets.css"/>
|
|
<link rel="stylesheet" href="./holo-web/holo-ics-dark-elements.css"/>
|
|
<link rel="stylesheet" href="./holo-web/holo-ics-dark-widgets.css"/>
|
|
<link rel="stylesheet" href="./holo-web/holo-extra-octt.css"/>
|
|
<script src="./util.js"></script>
|
|
<script src="./holo-web/holo-extra-octt.js"></script>
|
|
<script src="./holo-web/holo-touch.js"></script>
|
|
<script src="../../shared/OctoHub-Global.js"></script>
|
|
<style>
|
|
body { overflow-x: hidden; }
|
|
.floatRight { float: right; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<header class="holo-actionBar">
|
|
<button class="holo-title holo-menu" data-action-sidebar="sidebar">
|
|
🕷️ SpiderADB <small>(WIP)</small>
|
|
</button>
|
|
<!-- <button class="floatRight" data-display-sections="terminal">
|
|
Tabs
|
|
</button> -->
|
|
</header>
|
|
<section class="holo-sideBar" data-sidebar="sidebar">
|
|
<ul class="holo-list">
|
|
<li><button data-action-section="devices">
|
|
📱️ Devices
|
|
</button></li>
|
|
<li><button data-action-section="terminal">
|
|
⌨️ Terminal
|
|
</button></li>
|
|
<!-- <li><button data-action-section="files">
|
|
📄 Files
|
|
</button></li> -->
|
|
<!-- <li><button data-action-section="packages">
|
|
📦 Packages
|
|
</button></li> -->
|
|
<li><button data-action-section="about">
|
|
❓️ About
|
|
</button></li>
|
|
<li>
|
|
<i>More features coming soon!</i>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<section class="holo-body">
|
|
<p name="connectReminder" data-display-sections="terminal packages">
|
|
You must <a data-action-section="devices">connect and authorize a device</a> first.
|
|
</p>
|
|
<section class="holo-section" data-section="about">
|
|
<p>SpiderADB is an user-friendly webapp for connecting to devices via the Android Debug Bridge, straight from a browser. More infos coming soon.</p>
|
|
<h3>Changelog</h3>
|
|
<h4>2024-04-16</h4><ul>
|
|
<li>Introduced the basic Terminal.</li>
|
|
<li>Slight improvements to the user experience with better error handling.</li>
|
|
</ul>
|
|
<h4>2024-04-14</h4><ul>
|
|
<li>First WIP version, with Android ICS Holo UI, allows simply connecting to devices and shows basic info.</li>
|
|
<li>Introduced sections: Devices, About.</li>
|
|
</ul>
|
|
</section>
|
|
<section class="holo-section" data-section="devices" data-open="open">
|
|
<div name="browserWarning"><p></p></div>
|
|
<p name="deviceStatus"></p>
|
|
<select name="deviceSelect" disabled="true"></select>
|
|
<button name="deviceConnect" disabled="true">
|
|
Connect New Device
|
|
</button>
|
|
<!-- <button>Connect via Network</button> -->
|
|
<section name="deviceInfo" hidden="true">
|
|
<ul>
|
|
<li name="deviceOem"></li>
|
|
<li name="deviceModel"></li>
|
|
<li name="deviceSerial"></li>
|
|
<div name="androidInfo" hidden="true">
|
|
<li name="androidVersion"></li>
|
|
<li name="androidApi"></li>
|
|
</div>
|
|
</ul>
|
|
<!-- <details>
|
|
<summary><code>getprop</code> Info dump</summary>
|
|
<ul name="devicePropDump"></ul>
|
|
</details> -->
|
|
</section>
|
|
</section>
|
|
<section class="holo-section" data-section="terminal">
|
|
<textarea name="terminalOutput" readonly="true" disabled="true" placeholder="Terminal output will be displayed here." style="width: 100%; margin-left: 0; margin-right: 0;"></textarea>
|
|
<input name="terminalInput" type="text" disabled="true" placeholder="> Input any command..." style="width: 100%; margin-left: 0; margin-right: 0;"/>
|
|
</section>
|
|
<section class="holo-section" data-section="packages">
|
|
<!-- TODO buttons -->
|
|
<ul class="holo-list" name="packageList">
|
|
<li>Test <input type="checkbox"/></li>
|
|
</ul>
|
|
<section class="holo-subsection" name="packageInfo">
|
|
|
|
</section>
|
|
</section>
|
|
</section>
|
|
<script src="./bundle.js"></script>
|
|
</body>
|
|
</html>
|