atstockland
Joined 3/10/2021
atstockland said about 3 years ago on Working with Time Zones :
My users create daily logs for various industry activities....and, they move around the country from day to day.  They may start the day in one time zone, and end in another.  I've never found a simple reliable solution to a time input that includes a related time zone select.  I have a working solution that I rolled, but I'd rather use a more Rails way with less code.  Any suggestions on how to handle such a scenario?  :)

atstockland said about 3 years ago on Embedding Youtube Videos into Action Text with Stimulus :
Hi Dave!  Is this how you embed these videos?  I'm have a customer who creates custom training video in aviation, and they don't want the videos being downloaded, or YouTube links being passed around.  This seems like the solution.  I see you're html video link points to a blob...so, I'm assuming the technique in this video is what you're actually using.  If so, I'm gonna utilize this in my project.

atstockland said about 3 years ago on Embedding Youtube Videos into Action Text with Stimulus :
I implemented this feature in my project...following along with this video was flawless.  However, my embeded youtube video in ActionText has a src of the actual youtube url, which I need to avoid.  I don't want a savy user to be able to access the video link in the page source.   I see your source is a blob, so I'm assuming maybe you are hosting these videos and are not using youtube.  Is that correct?   I wonder how I could accomplish that without hosting my own videos?

atstockland said about 3 years ago on StimulusJS, Active Storage and DropzoneJS :
Hi David and friends - 

resizeHeight and resizeQuality don't seem to be affecting the uploaded image in any way.  I'm wondering if maybe it has something to do with direct_upload...maybe those options are never triggered.  Did you play with these settings when using DropzoneJS?

My Dropzone_controller looks like this:
import { Controller } from "stimulus"
import Dropzone from "dropzone"
import 'dropzone/dist/min/dropzone.min.css'
import 'dropzone/dist/min/basic.min.css'
import { DirectUpload } from "@rails/activestorage"

export default class extends Controller {
  static targets = ["input"]

  connect() {
    Dropzone.autoDiscover = false

    this.inputTarget.disable = true
    this.inputTarget.style.display = "none"
    const dropzone = new Dropzone(this.element, {
      url: '/',
      maxFiles: 10,
      maxFilesize: 6,
      addRemoveLinks: true,
      resizeHeight: 50,
      resizeQuality: 0.1,
      autoQueue: false
    })

    dropzone.on("addedfile", file => {
      setTimeout(() => {
        if (file.accepted) {
          const upload = new DirectUpload(file, this.url)
          upload.create((error, blob) => {
            this.hiddenInput = document.createElement("input")
            this.hiddenInput.type = "hidden"
            this.hiddenInput.name = this.inputTarget.name
            this.hiddenInput.value = blob.signed_id
            this.inputTarget.parentNode.insertBefore(this.hiddenInput, this.inputTarget.nextSibling)
            dropzone.emit("success", file)
            dropzone.emit("complete", file)
          })
        }
      }, 500)
    })
  }

  get url() {
    return this.inputTarget.getAttribute('data-direct-upload-url')
  }
}

So, if I attach a 1 megabyte 800x800 image...I'm expecting to get back a 50px image that looks pretty bad (due to resizeQuality 0.1).  However, I get back the same image I originally attached.  No compression or size changes at all.

Also, I'm curious if you know...by default will DropzoneJS upsize?  Or, is it smart enough to not upsize?  Also, is it smart enough to skip resize options for non-images?  The docs don't specify.

Perhaps this is better suited for StackOverflow.

Thanks!!!!

atstockland said over 2 years ago on Slim Select with Stimulus :
Hi Dave!  I'm swapping select2 for slim-select.  I followed this video, but have run into a snag I can't seem to solve.

the view

  <%= f.select :location_id,
    [@existing_location&.name],
    { },
    class: "form-control select",
    data: { controller: 'slimselect', 'slimselect-url-value': ajax_locations_url } %>

locations_controller

  def ajax_locations
    if params[:q].present?
      @locations = Location.where('municipality iLIKE :q OR state iLIKE :q OR local_code iLIKE :q OR name iLIKE :q OR country iLIKE :q', q: "%#{ params[:q] }%")
      render json: @locations.map { |loc| { value: loc.id, text: loc.name } }
    else
      render json: []
    end
    skip_authorization
  end

slimselect_controller.js

  connect() {
    let url_val = this.urlValue
    new SlimSelect({
      select: this.element,
        searchingText: "Searching...",
        ajax: function (search, callback) {
          if (search.length < 3) {
            callback('need 3 characters to search')
            return
          }

          let url = new URL(url_val)
          url.search = new URLSearchParams({ q: search })
          console.log(`url: ${ url }`)

          fetch(url)
            .then(response => response.json())
            .then(json => callback(json))
            .catch(error => callback(error))
        }
    })
  }


I'm not getting any console errors, and I can manually render the url in a separate window and see the result.  Example: http://localhost:3000/ajax_locations.json?q=reno
[{"value":22500,"text":"Reno, NV  (US/Pacific)"},{"value":22080,"text":"KRTS - Reno, NV  (US/Pacific) [KRTS]"}]
However, nothing happens in the view...no options are added to the select input.  Can anyone see where I may have gone wrong?

EDIT:  the problem was the initial value being set in the select.  By setting the select f.select [], {} it now works.  So, now I need to figure out how to set/select an initial value (like on edit).

Thanks so much!