audio-player: initial commit

2019-07-18 13:11:52 +09:30 · 2019-07-18 13:11:52 +09:30 · f7e877eb0c
parent 05f79ddbe3
commit f7e877eb0c
2 changed files with 44 additions and 0 deletions
--- a/cmd/audio-player/index.html
+++ b/cmd/audio-player/index.html
@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8">
+        <title>Audio Player</title>
+        <script type="text/javascript" src="main.js"></script>
+        <script type="text/javascript" src="pcm-player.min.js"></script>
+        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
+        <link rel="stylesheet" type="text/css" href="style.css">
+    </head>
+    <body>
+        <div class="jumbotron">
+            <div class="container-fluid">
+                    <input type="file" id="input">
+                    <textarea id="content"></textarea>
+            </div>
+        </div>
+    </body>
+</html>
--- a/cmd/audio-player/main.js
+++ b/cmd/audio-player/main.js
@ -0,0 +1,25 @@
+window.onload = function () {
+    document.getElementById('input').addEventListener('change', getFile)
+}
+
+function getFile(){
+    const input = event.target
+    if ('files' in input && input.files.length > 0) {
+        placeFileContent(document.getElementById('content'), input.files[0])
+    }
+}
+
+function placeFileContent(target, file) {
+	readFileContent(file).then(content => {
+        target.value = content
+    }).catch(error => console.log(error))
+}
+
+function readFileContent(file) {
+	const reader = new FileReader()
+    return new Promise((resolve, reject) => {
+        reader.onload = event => resolve(event.target.result)
+        reader.onerror = error => reject(error)
+        reader.readAsText(file)
+    })
+}