Added:

- toogle chapter visibility - delete chapter cbz - preferred ContentSource.php and modal - minor fixes
2024-07-21 22:21:04 +02:00
parent fafff5014c
commit c56f72b813
17 changed files with 474 additions and 82 deletions
--- a/assets/controllers/preferred_sources_controller.js
+++ b/assets/controllers/preferred_sources_controller.js
@@ -0,0 +1,101 @@
+// assets/controllers/preferred-sources_controller.js
+
+import {Controller} from "@hotwired/stimulus"
+import Sortable from 'sortablejs'
+
+export default class extends Controller {
+  static targets = ["preferredList", "availableList"]
+  static values = {
+    mangaId: Number,
+    preferredSources: Array,
+    allSources: Array
+  }
+
+  connect() {
+    this.initSortable()
+  }
+
+  initSortable() {
+    new Sortable(this.preferredListTarget, {
+      animation: 150,
+      ghostClass: 'bg-gray-300',
+      onEnd: this.handleDragEnd.bind(this)
+    })
+  }
+
+  handleDragEnd() {
+    this.updatePreferredSources()
+  }
+
+  addSource(event) {
+    const sourceId = parseInt(event.currentTarget.dataset.sourceId)
+    if (!this.preferredSourcesValue.includes(sourceId)) {
+      this.preferredSourcesValue = [...this.preferredSourcesValue, sourceId]
+      this.updateLists()
+      this.save()
+    }
+  }
+
+  removeSource(event) {
+    const sourceId = parseInt(event.currentTarget.dataset.sourceId)
+    this.preferredSourcesValue = this.preferredSourcesValue.filter(id => id !== sourceId)
+    this.updateLists()
+    this.save()
+  }
+
+  updatePreferredSources() {
+    this.preferredSourcesValue = Array.from(this.preferredListTarget.children).map(li => parseInt(li.dataset.id))
+    this.save()
+  }
+
+  updateLists() {
+    this.preferredListTarget.innerHTML = this.preferredSourcesValue
+      .map(id => this.allSourcesValue.find(s => s.id === id))
+      .map(source => this.sourceTemplate(source, true))
+      .join('')
+
+    this.availableListTarget.innerHTML = this.allSourcesValue
+      .filter(source => !this.preferredSourcesValue.includes(source.id))
+      .map(source => this.sourceTemplate(source, false))
+      .join('')
+
+    this.initSortable()
+  }
+
+  sourceTemplate(source, isPreferred) {
+    return `
+      <li data-id="${source.id}" draggable="true" class="flex items-center justify-between p-2 bg-gray-100 rounded ${isPreferred ? 'cursor-move' : ''}">
+        <span>${source.name}</span>
+        <button type="button" data-action="preferred-sources#${isPreferred ? 'removeSource' : 'addSource'}" data-source-id="${source.id}" class="text-${isPreferred ? 'red' : 'green'}-500 hover:text-${isPreferred ? 'red' : 'green'}-700">
+          <i class="fas fa-${isPreferred ? 'times' : 'plus'}"></i>
+        </button>
+      </li>
+    `
+  }
+
+  async save() {
+    try {
+      const response = await fetch(`/manga/${this.mangaIdValue}/preferred-sources`, {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+          'X-Requested-With': 'XMLHttpRequest'
+        },
+        body: JSON.stringify({
+          preferredSources: this.preferredSourcesValue
+        })
+      })
+
+      if (response.ok) {
+        console.log('Preferred sources saved successfully')
+        // Optionally show a success message
+      } else {
+        console.error('Error saving preferred sources')
+        // Optionally show an error message
+      }
+    } catch (error) {
+      console.error('Error:', error)
+      // Optionally show an error message
+    }
+  }
+}