prototype
This commit is contained in:
72
index.html
Normal file
72
index.html
Normal file
@@ -0,0 +1,72 @@
|
||||
<head>
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<script src="node_modules/jsmediatags/dist/jsmediatags.min.js"></script>
|
||||
<script type="module">
|
||||
import * as IDBStore from './node_modules/idb-keyval/dist/index.js'
|
||||
|
||||
window.IDBStore = IDBStore
|
||||
</script>
|
||||
<script src="index.js"></script>
|
||||
<link rel="stylesheet" href="style.css"></link>
|
||||
|
||||
</head>
|
||||
<body onload="main(this)">
|
||||
|
||||
<main>
|
||||
|
||||
<section class="controls">
|
||||
|
||||
<header>
|
||||
|
||||
<h3 id="track-title">Bocce</h3>
|
||||
<p id="track-artist">Patricia Taxxon</p>
|
||||
|
||||
</header>
|
||||
<nav>
|
||||
|
||||
<button id="prev">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" baseProfile="full" version="1.1" viewbox="0 0 120 120" preserveAspectRatio="xMidYMid meet">
|
||||
<path d="M15,60 L15,60 L60,105 L60,15 L15,60 M60,60 L60,60 L105,15 L105,105 L60,60 "/>
|
||||
</svg>
|
||||
|
||||
</button>
|
||||
<button id="playpause">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" baseProfile="full" version="1.1" viewbox="0 0 105 120" preserveAspectRatio="xMidYMid meet">
|
||||
<path id="pause-icon" d="M15,15 L15,15 L15,105 L45,105 L45,15 L15,15 M60,15 L60,15 L60,105 L90,105 L90,15 L60,15 "/>
|
||||
<path id="play-icon" d="M30,15 L30,15 L30,105 L90,60 L30,15 "/>
|
||||
</svg>
|
||||
|
||||
</button>
|
||||
<button id="next">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" baseProfile="full" version="1.1" viewbox="0 0 120 120" preserveAspectRatio="xMidYMid meet">
|
||||
<path d="M60,60 L60,60 L15,105 L15,15 L60,60 M105,60 L105,60 L60,15 L60,105 L105,60 " />
|
||||
</svg>
|
||||
|
||||
</button>
|
||||
|
||||
</nav>
|
||||
<code id="timestamp">00:00</code>
|
||||
<code id="track-length">00:00</code>
|
||||
|
||||
</section>
|
||||
<progress id="playback-progress" value="0" max="100"></progress>
|
||||
<section class="content">
|
||||
|
||||
<ul id="list"></ul>
|
||||
|
||||
</section>
|
||||
<footer>
|
||||
|
||||
<div id="left-action">Back</div>
|
||||
|
||||
<div id="right-action" onclick="onAddFiles()">Add Files</div>
|
||||
|
||||
</footer>
|
||||
|
||||
</main>
|
||||
|
||||
</body>
|
||||
Reference in New Issue
Block a user