removed pico, play button toggles

2025-04-08 19:11:17 -05:00
parent c66d1820aa
commit a0af1230cb
6 changed files with 36 additions and 39 deletions
@@ -4,7 +4,6 @@
 <head>
    <meta charset="UTF-8" />
    <meta content="width=device-width, initial-scale=1.0" name="viewport" />
-    <link rel="stylesheet" type="text/css" href="/node_modules/@picocss/pico/css/pico.min.css">
    <title>yellowjacket</title>
 </head>
 <script src="/index.ts" type="module"></script>
@@ -5,7 +5,6 @@
 		"preview": "vite preview"
 	},
 	"dependencies": {
-		"@picocss/pico": "^2.1.1",
 		"lit": "^3.2.1"
 	},
 	"devDependencies": {
@@ -8,9 +8,6 @@ importers:

  .:
    dependencies:
-      '@picocss/pico':
-        specifier: ^2.1.1
-        version: 2.1.1
      lit:
        specifier: ^3.2.1
        version: 3.2.1
@@ -205,9 +202,6 @@ packages:
    resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==}
    engines: {node: '>= 8'}

-  '@picocss/pico@2.1.1':
-    resolution: {integrity: sha512-kIDugA7Ps4U+2BHxiNHmvgPIQDWPDU4IeU6TNRdvXQM1uZX+FibqDQT2xUOnnO2yq/LUHcwnGlu1hvf4KfXnMg==}
-
  '@rollup/rollup-android-arm-eabi@4.37.0':
    resolution: {integrity: sha512-l7StVw6WAa8l3vA1ov80jyetOAEo1FtHvZDbzXDO/02Sq/QVvqlHkYoFwDJPIMj0GKiistsBudfx5tGFnwYWDQ==}
    cpu: [arm]
@@ -759,8 +753,6 @@ snapshots:
      '@nodelib/fs.scandir': 2.1.5
      fastq: 1.19.1

-  '@picocss/pico@2.1.1': {}
-
  '@rollup/rollup-android-arm-eabi@4.37.0':
    optional: true

@@ -1,13 +1,18 @@
 import { LitElement, html } from 'lit';
-import { customElement } from 'lit/decorators.js';
-import { Play } from '@go/player/Player';
+import { customElement, property } from 'lit/decorators.js';
+import { Play, Pause } from '@go/player/Player';

@customElement('player-controls')
 export class PlayerControls extends LitElement {

+  @property({ type: Boolean })
+  isPlaying = false
+
  override render() {
+    var imagePath = this.isPlaying ? 
+      "/src/assets/images/icons/music/pause-solid.svg" : "/src/assets/images/icons/music/play-solid.svg"
    return html`
-<div>
+    <div>
      <button>
        <img src="/src/assets/images/icons/music/shuffle.svg"></img>
      </button>
@@ -15,7 +20,7 @@ export class PlayerControls extends LitElement {
        <img src="/src/assets/images/icons/music/skip-prev-solid.svg"></img>
      </button>
      <button @click="${this.onPlayPauseClick}">
-    <img src="/src/assets/images/icons/music/play-solid.svg"></img>
+        <img src="${imagePath}"></img>
      </button>
      <button>
        <img src="/src/assets/images/icons/music/skip-next-solid.svg"></img>
@@ -23,21 +28,23 @@ export class PlayerControls extends LitElement {
      <button>
        <img src="/src/assets/images/icons/music/repeat.svg"></img>
      </button>
-</div>
-`;
+    </div>
+    `;
  }

-  onPlayPauseClick(event: { target: HTMLButtonElement; }) {
-    try {
-      Play().then((result) => {
-        console.log(result)
-        event.target.setAttribute("src", "/src/assets/images/icons/music/pause-solid.svg")
+  onPlayPauseClick() {
+    if (this.isPlaying) {
+      Play().then(() => {
      }).catch((err) => {
        console.error("there is an error with playing " + err);
      });
+    } else {
+      Pause().then(() => {
+      }).catch((err) => {
+        console.error("there is an error with pausing " + err);
+      });
+
    }
-    catch (err) {
-      console.error(err);
-    }
+    this.isPlaying = !this.isPlaying
  }
 }
@@ -1 +1 @@
-import '@components/config/library-picker/library-picker.ts';
+import '@components/config/options/library-picker.ts';