sudara/alonetone

View on GitHub
app/javascript/controllers/playlist_update_controller.js

Summary

Maintainability
A
0 mins
Test Coverage
import { Controller } from '@hotwired/stimulus'
import Rails from '@rails/ujs'
import PlaylistSortController from './playlist_sort_controller'
import { flashController } from './flash_controller'

export default class extends Controller {
  static targets = ['add', 'remove']

  initialize() {
    this.addUrl = document.querySelector('.add_url').getAttribute('href')
    this.removeUrl = document.querySelector('.remove_url').getAttribute('href')
  }

  setPlaylistSort() {
    this.playlistSort = this.application.getControllerForElementAndIdentifier(document.querySelector('#columns'), 'playlist-sort')
  }

  add(e) {
    e.preventDefault()
    this.setPlaylistSort()
    Rails.ajax({
      url: this.addUrl,
      type: 'POST',
      data: `asset_id=${this.element.id}`,
      before: this.spin.bind(this),
      success: (response, status, xhr) => this.added(response, status, xhr),
      error: this.errored.bind(this),
    })
  }

  remove(e) {
    e.preventDefault()
    this.setPlaylistSort()
    Rails.ajax({
      url: this.removeUrl,
      type: 'GET',
      data: `track_id=${this.element.getAttribute('data-id')}`,
      before: this.spin.bind(this),
      success: this.removed.bind(this),
      error: this.errored.bind(this),
    })
  }

  spin() {
    this.playlistSort.spinnerTarget.style.display = 'block'
  }

  stopSpin() {
    this.playlistSort.spinnerTarget.style.display = 'none'
  }

  errored() {
    setTimeout(this.stopSpin.bind(this), 500)
    flashController.alertFailed()
  }

  removed() {
    setTimeout(this.stopSpin.bind(this), 500)
    flashController.alertSaved('Removed')
    this.element.parentNode.removeChild(this.element)
    this.updatePlaylistMetadata()
  }

  added(response, status, xhr) {
    setTimeout(this.stopSpin.bind(this), 500)
    flashController.alertSaved('Added!')
    const clonedTrack = this.element.cloneNode(true)
    clonedTrack.setAttribute('data-id', `${response}`) // give it a track id before assigning it to the sortable
    this.playlistSort.sortableTarget.appendChild(clonedTrack)
    this.updatePlaylistMetadata()
  }

  updatePlaylistMetadata() {
    this.playlistSort.updatePlaylistMetadata()
  }
}