Merge pull request #418 from Asymtode712/AudioPlayerExt

added audio player extension
Sulagna-Dutta-Roy · May 23, 2024 · 8ce834f · 8ce834f
2 parents d0d5e8d + 5a57b6e
commit 8ce834f
Show file tree

Hide file tree

Showing 5 changed files with 61 additions and 0 deletions.
diff --git a/Audio Player/images.jpg b/Audio Player/images.jpg
diff --git a/Audio Player/index.html b/Audio Player/index.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>Music Player</title>
+  <link rel="stylesheet" href="src/style.css">
+</head>
+<body>
+  <h1>Audio Player</h1>
+  <input type="file" id="fileInput" accept="audio/*">
+  <audio id="audioPlayer" controls></audio>
+
+  <script src="scripts/script.js"></script>
+</body>
+</html>
diff --git a/Audio Player/manifest.json b/Audio Player/manifest.json
@@ -0,0 +1,26 @@
+{
+    "manifest_version": 3,
+    "name": "Audio Player",
+    "version": "1.0",
+    "description": "A simple music player for playing uploaded audio files.",
+    "action": {
+      "default_popup": "index.html"
+    },
+    "icons": {
+        "48": "images.jpg",
+        "128": "images.jpg"
+    },
+    "permissions": [
+      "storage"
+    ],
+    "web_accessible_resources": [
+        {
+            "resources": [
+                "index.html"
+            ],
+            "matches": [
+                "<all_urls>"
+            ]
+        }
+    ]
+}
diff --git a/Audio Player/scripts/script.js b/Audio Player/scripts/script.js
@@ -0,0 +1,9 @@
+document.getElementById('fileInput').addEventListener('change', function(event) {
+    const file = event.target.files[0];
+    if (file) {
+      const audioPlayer = document.getElementById('audioPlayer');
+      const objectUrl = URL.createObjectURL(file);
+      audioPlayer.src = objectUrl;
+      audioPlayer.play();
+    }
+  });
diff --git a/Audio Player/src/style.css b/Audio Player/src/style.css
@@ -0,0 +1,12 @@
+body {
+    font-family: Arial, sans-serif;
+    padding: 20px;
+    text-align: center;
+  }
+  input[type="file"] {
+    margin: 10px 0;
+  }
+  audio {
+    margin-top: 20px;
+    width: 100%;
+  }