spina 2.0.1 → 2.2.0

data/app/assets/javascripts/spina/admin/confirm_delete.coffee.erb

@@ -1,24 +0,0 @@
-$.rails.allowAction = (element) ->
-
-  message = element.data('confirm')
-  return true unless message
-
-  $link = element.clone().removeAttr('data-confirm').removeAttr('data-icon').removeAttr('class')
-  $link.addClass('primary')
-  $link.html("<i class='icon icon-check'></i> <%= I18n.t('spina.modal.agree') %>")
-
-  modal_html = """
-              <div id="modal" class="modal"><header class="big-header">
-                <a href="#" class="close_modal" data-dismiss="modal"><i class="icon icon-cross"></i></a>
-                <h3>#{message}</h3>
-              </header>
-
-              <footer>
-                <a href="#" data-dismiss="modal"><%= I18n.t('spina.modal.cancel') %></a>
-              </footer></div>
-               """
-
-  $(modal_html).modal()
-  $('#modal footer').append($link)
-
-  return false

data/app/assets/javascripts/spina/admin/controllers/attachment_picker_controller.js

@@ -1,15 +0,0 @@
-(() => {
-  const application = Stimulus.Application.start()
-
-  application.register("attachment-picker", class extends Stimulus.Controller {
-    static get targets() {
-      return ["signedBlobId", "filename"]
-    }
-
-    chooseAttachment(event) {
-      let option = event.currentTarget.options[event.currentTarget.selectedIndex]
-      this.signedBlobIdTarget.value = option.dataset.signedBlobId || ""
-      this.filenameTarget.value = option.dataset.filename || ""
-    }
-  })
-})()

data/app/assets/javascripts/spina/admin/controllers/gallery_select_controller.js

@@ -1,52 +0,0 @@
-(() => {
-  const application = Stimulus.Application.start()
-
-  application.register("gallery-select", class extends Stimulus.Controller {
-    static get targets() {
-      return ["singleImage", "multipleImages", "multiple", "counter"]
-    }
-
-    select(event) {
-      let item = event.currentTarget
-      let imageId = item.dataset.imageId
-      if (this.multipleTarget.checked) {
-        item.classList.toggle('selected')
-        if (item.classList.contains('selected')) {
-          this.addToMultipleImages(imageId)  
-        } else {
-          this.removeFromMultipleImages(imageId)
-        }
-        this.counterTarget.innerText = `(${this.imageCount})`
-      } else {
-        item.parentElement.querySelectorAll('.item').forEach(function(item) {
-          item.classList.remove('selected')
-        })
-        item.classList.add('selected')
-        this.singleImageTarget.value = imageId
-      }
-    }
-
-    addToMultipleImages(imageId) {
-      let imageIds = this.multipleImages
-      imageIds.push(imageId)
-      this.multipleImagesTarget.value = [...new Set(imageIds)].join("-")
-    }
-
-    removeFromMultipleImages(imageId) {
-      let imageIds = this.multipleImages
-      let newImageIds = imageIds.filter(function(id) {
-        return id != imageId
-      })
-      this.multipleImagesTarget.value = newImageIds.join("-")
-    }
-
-    get multipleImages() {
-      return this.multipleImagesTarget.value.split("-")
-    }
-
-    get imageCount() {
-      return this.multipleImages.length
-    }
-    
-  })
-})()

data/app/assets/javascripts/spina/admin/controllers/image_form_controller.js

@@ -1,22 +0,0 @@
-(() => {
-  const application = Stimulus.Application.start()
-
-  application.register("image-form", class extends Stimulus.Controller {
-    static get targets() {
-      return ["image", "imageId", "signedBlobId", "filename"]
-    }
-
-    remove(e) {
-      // Prevent link
-      e.preventDefault()
-      e.stopPropagation()
-
-      // Remove image and reset field
-      this.imageTarget.querySelectorAll('img').forEach(image => image.remove())
-      this.imageIdTarget.value = null
-      this.signedBlobIdTarget.value = null
-      this.filenameTarget.value = null
-    }
-    
-  })
-})()

data/app/assets/javascripts/spina/admin/controllers/infinite_scroll_controller.js

@@ -1,38 +0,0 @@
-(() => {
-  const application = Stimulus.Application.start()
-
-  application.register("infinite-scroll", class extends Stimulus.Controller {
-    static get targets() {
-      return ["link", "scrollContainer"]
-    }
-
-    connect() {
-      this.element["infiniteScroll"] = this
-      this.scrollElement.addEventListener("scroll", this.loadNextPage.bind(this))
-      this.loadNextPage()
-    }
-
-    disconnect() {
-      this.scrollElement.removeEventListener("scroll", this.loadNextPage.bind(this))
-    }
-
-    get scrollElement() {
-      if (this.hasScrollContainerTarget) {
-        return this.scrollContainerTarget
-      } else {
-        return window
-      }
-    }
-
-    loadNextPage() {
-      if (this.hasLinkTarget) {
-        let top = this.linkTarget.getBoundingClientRect().top
-        if (top < window.innerHeight + 500) {
-          this.linkTarget.dataset.disableWith = "..."
-          this.linkTarget.click()
-        }
-      }
-    }
-
-  })
-})()

data/app/assets/javascripts/spina/admin/controllers/media_picker_controller.js

@@ -1,171 +0,0 @@
-(() => {
-  const application = Stimulus.Application.start()
-
-  application.register("media-picker", class extends Stimulus.Controller {
-    static get targets() {
-      return ["input", "image", "grid", "selectedImage", "selectedImages", "selectedCount", "alt", "linkToUrl", "trixImage"]
-    }
-
-    connect() {
-      this.toggleActive()
-
-      if (this.hasSelectedImagesTarget) {
-        this.sortable = Sortable.create(this.selectedImagesTarget)
-      }
-    }
-
-    choose(event) {
-      switch(this.element.dataset.mode) {
-        case "single":
-          this.imageTargets.forEach((image) => image.querySelector('input').checked = false)
-          event.currentTarget.checked = true
-          this.imageIdInput.value = event.currentTarget.value
-          this.signedBlobIdInput.value = event.currentTarget.dataset.signedBlobId
-          this.filenameInput.value = event.currentTarget.dataset.filename
-          this.placeholder.innerHTML = `<img src="${event.currentTarget.dataset.thumbnailUrl}" width="200" height="150" />`
-          this.element.modal.close()
-          break
-        case "multiple":
-          if(event.currentTarget.checked) {
-            this.addImage(event.currentTarget.dataset.imageId, event.currentTarget.dataset.signedBlobId, event.currentTarget.dataset.filename, event.currentTarget.dataset.thumbnailUrl)
-          } else {
-            this.removeImage(event.currentTarget.dataset.imageId)
-          }
-          this.setCount()
-          break
-        case "trix":
-          this.imageTargets.forEach((image) => image.querySelector('input').checked = false)
-          event.currentTarget.checked = true
-          this.trixImage = event.currentTarget
-          break
-      }
-    }
-
-    choose_multiple(event) {
-      // Set image id's
-      let fields = this.imageCollectionPlaceholder.dataset.fields
-      let id = this.imageCollectionPlaceholder.dataset.id
-
-      let timeIndex = 0
-
-      // Set image thumbnails
-      this.imageCollectionPlaceholder.innerHTML = ""
-      this.selectedImageTargets.forEach(function(image) {
-        // this.imageCollectionPlaceholder.insertAdjacentHTML("beforeend", `<img src="${image.src}" />`)
-
-        // Time
-        let time = new Date().getTime() + timeIndex
-        timeIndex += 1
-
-        // Regexp
-        let regexp = new RegExp(`${id}|new_association`, 'g')
-
-        // Document generation
-        let doc = document.createRange().createContextualFragment(fields.replace(regexp, time))
-        doc.querySelector(".image-id").value = image.dataset.imageId
-        doc.querySelector(".signed-blob-id").value = image.dataset.signedBlobId
-        doc.querySelector(".filename").value = image.dataset.filename
-        doc.querySelector("img").src = image.src
-
-        this.imageCollectionPlaceholder.appendChild(doc)
-      }.bind(this))
-
-      // Close modal
-      this.element.modal.close()
-    }
-
-    insert_trix(event) {
-      let customEvent = new CustomEvent("image-insert", {bubbles: true, cancelable: true, detail: {
-        url: this.trixImage.dataset.imageUrl, 
-        alt: this.altTarget.value, 
-        link_to_url: this.linkToUrlTarget.value
-      }})
-      this.trixEditor.dispatchEvent(customEvent)
-
-      // Close modal
-      this.element.modal.close()
-    }
-
-    startUpload(event) {
-      event.currentTarget.querySelector('.media-picker-uploader').classList.add("uploading")
-    }
-
-    refresh(event) {
-      fetch(event.currentTarget.dataset.mediaPickerUrl)
-        .then(response => response.text())
-        .then(function(html) {
-          this.gridTarget.innerHTML = html
-          this.toggleActive()
-        }.bind(this))
-    }
-
-    toggleActive() {
-      this.imageTargets.forEach(function(image) {
-        let input = image.querySelector('input')
-        if (this.selectedIds.includes(input.value)) input.checked = true
-      }.bind(this))
-    }
-
-    openFolder(event) {
-      event.preventDefault()
-      fetch(event.currentTarget.href)
-        .then(response => response.text())
-        .then(function(html) {
-          this.gridTarget.innerHTML = html
-          this.toggleActive()
-        }.bind(this))
-    }
-
-    setCount() {
-      this.selectedCountTarget.innerHTML = `(${this.selectedIds.length})`
-    }
-
-    addImage(id, signed_blob_id, filename, url) {
-      this.selectedImagesTarget.insertAdjacentHTML("beforeend", `<img src="${url}" data-image-id="${id}" data-signed-blob-id="${signed_blob_id}" data-filename="${filename}" data-target="media-picker.selectedImage" />`)
-    }
-
-    removeImage(id) {
-      let image = this.selectedImagesTarget.querySelector(`img[data-image-id="${id}"]`)
-      this.selectedImagesTarget.removeChild(image)
-    }
-
-    get trixEditor() {
-      return document.querySelector(`trix-editor[toolbar="${this.inputTarget.value}"]`)
-    }
-
-    get selectedIds() {
-      return this.selectedImageTargets.map(function(image) {
-        return image.dataset.imageId
-      })
-    }
-
-    get imageCollectionPlaceholder() {
-      return document.querySelector(`#${this.inputTarget.value}`)
-    }
-    
-    get hiddenInputs() {
-      return document.querySelector(`#${this.inputTarget.value}`)
-    }
-    
-    get imageIdInput() {
-      return this.hiddenInputs.querySelector("input[data-target='image-form.imageId']")
-    }
-
-    get signedBlobIdInput() {
-      return this.hiddenInputs.querySelector("input[data-target='image-form.signedBlobId']")
-    }
-
-    get filenameInput() {
-      return this.hiddenInputs.querySelector("input[data-target='image-form.filename']")
-    }
-
-    get placeholder() {
-      return this.hiddenInputs.nextElementSibling
-    }
-
-    get token() {
-      return document.querySelector('meta[name="csrf-token"]').content
-    }
-
-  })
-})()

data/app/assets/javascripts/spina/admin/controllers/modal_controller.js

@@ -1,18 +0,0 @@
-(() => {
-  const application = Stimulus.Application.start()
-
-  application.register("modal", class extends Stimulus.Controller {
-    static get targets() {
-      return []
-    }
-
-    connect() {
-      this.element[this.identifier] = this
-    }
-
-    close() {
-      document.querySelector('body').removeChild(this.element)
-    }
-
-  })
-})()

data/app/assets/javascripts/spina/admin/controllers/page_collapse_controller.js

@@ -1,35 +0,0 @@
-(() => {
-  const application = Stimulus.Application.start()
-
-  application.register("page-collapse", class extends Stimulus.Controller {
-    static get targets() {
-      return [ "list", "collapseLink", "expandLink" ]
-    }
-
-    expand() {
-      this.toggleLinks(true)
-      
-      // Fetch children HTML
-      fetch(this.element.dataset.url)
-        .then(response => response.text())
-        .then(function(html) {
-          // Render the list
-          this.listTarget.innerHTML = html
-        }.bind(this))
-    }
-
-    collapse() {
-      this.toggleLinks(false)
-
-      // Clear the list
-      this.listTarget.innerHTML = ""
-    }
-
-    // Toggle plus/minus links
-    toggleLinks(expanded) {
-      this.expandLinkTarget.style.display = expanded ? "none" : "inline-block"
-      this.collapseLinkTarget.style.display = expanded ? "inline-block" : "none"
-    }
-    
-  })
-})()

data/app/assets/javascripts/spina/admin/controllers/repeater_form_controller.js

@@ -1,38 +0,0 @@
-(() => {
-  const application = Stimulus.Application.start()
-
-  application.register("repeater-form", class extends Stimulus.Controller {
-    static get targets() {
-      return ["list", "listItem", "content", "pane"]
-    }
-
-    connect() {
-      Sortable.create(this.listTarget, {
-        handle: '.sortable-handle',
-        onUpdate: function(event) {
-          let order_of_ids = [...this.listTarget.children].map(function(item) {
-            return parseInt(item.dataset.partId)
-          })
-
-          // Sort the DOM elements containing the repeater fields
-          let array = [...this.contentTarget.children]
-          array.sort(function(a, b) {
-            return order_of_ids.indexOf(parseInt(a.dataset.partId)) - order_of_ids.indexOf(parseInt(b.dataset.partId))
-          }).map(node => this.contentTarget.appendChild(node))
-        }.bind(this)
-      })
-    }
-
-    delete(event) {
-      event.preventDefault()
-      let part_id = event.currentTarget.dataset.partId
-
-      let pane = this.element.querySelector(`.structure-form-pane[data-part-id="${part_id}"]`)
-      let listItem = this.element.querySelector(`.structure-form-menu li[data-part-id="${part_id}"]`)
-
-      pane.parentElement.removeChild(pane)
-      listItem.parentElement.removeChild(listItem)
-    }
-    
-  })
-})()

data/app/assets/javascripts/spina/admin/dropdown.coffee

@@ -1,75 +0,0 @@
-$(document).on 'click', 'body.dropdown', ->
-  closeDropdown()
-
-$(document).on 'click', '[data-trigger="dropdown"]', ->
-  trigger = $(this)
-  dropdown = $(trigger.attr('data-target'))
-  body = $('body')
-
-  if body.hasClass('dropdown')
-    trigger.removeClass('button-active')
-    body.removeClass('dropdown')
-    dropdown.removeClass('animated fadeInDown')
-  else
-    dropdown.removeClass('no-animation')
-    trigger.addClass('button-active')
-    body.addClass('dropdown')
-    dropdown.addClass('animated fadeInDown')
-
-  return false
-
-$(document).on 'click', '[data-dropdown] ul, [data-dropdown] .sliding-dropdown', (e) ->
-  e.stopPropagation()
-
-$(document).on 'click', '.slide-controls .previous, .slide-controls .next', (e) ->
-  e.preventDefault()
-
-  # Get sliding dropdown
-  sliding_dropdown = $(this).parents('.sliding-dropdown')
-
-  # Get active title
-  active_title = sliding_dropdown.find('.slide-title.active')
-
-  # Get previous and next titles
-  previous = active_title.prev('.slide-title')
-  next = active_title.next('.slide-title')
-
-  if $(this).hasClass('previous') and previous.length > 0
-    sliding_dropdown.find('.slide-title').removeClass('active')
-    previous.addClass('active')
-    target = previous.data('target')
-    sliding_dropdown.find('.slide').removeClass('active')
-    $(target).addClass('active')
-
-  else if $(this).hasClass('next') and next.length > 0
-    sliding_dropdown.find('.slide-title').removeClass('active')
-    next.addClass('active')
-    target = next.data('target')
-    sliding_dropdown.find('.slide').removeClass('active')
-    $(target).addClass('active')
-
-  if sliding_dropdown.find('.slide-title.active').next('.slide-title').length > 0
-    sliding_dropdown.find('.next').removeClass('muted')
-  else
-    sliding_dropdown.find('.next').addClass('muted')
-
-  if sliding_dropdown.find('.slide-title.active').prev('.slide-title').length > 0
-    sliding_dropdown.find('.previous').removeClass('muted')
-  else
-    sliding_dropdown.find('.previous').addClass('muted')
-
-  # Force redraw dropdown
-  sliding_dropdown.addClass('no-animation')
-  forceRedraw(sliding_dropdown[0])
-
-closeDropdown = ->
-  $('body').removeClass('dropdown')
-  $('[data-dropdown] ul, [data-dropdown] .sliding-dropdown').removeClass('animated fadeInDown')
-  $('[data-trigger="dropdown"]').removeClass('button-active')
-  return false
-
-forceRedraw = (element) ->
-  disp = element.style.display
-  element.style.display = 'none'
-  trick = element.offsetHeight
-  element.style.display = disp