Skip to content

Instantly share code, notes, and snippets.

View adrienpoly's full-sized avatar
💭
I may be slow to respond.

Adrien Poly adrienpoly

💭
I may be slow to respond.
View GitHub Profile
import { Controller } from "stimulus";
import { get } from "@rails/request.js";
import { PageSnapshot } from "@hotwired/turbo";
export default class extends Controller {
static values = { hoverTime: Number };
connect() {
this.element.addEventListener("mouseover", this.prefetch.bind(this));
this.element.addEventListener("touchstart", this.prefetch.bind(this));
}
@dhh
dhh / pagination_controller.js
Last active August 15, 2025 22:17
HEY's Stimulus Pagination Controller
/*
ERB template chunk from The Feed's display of emails:
<section class="postings postings--feed-style" id="postings"
data-controller="pagination" data-pagination-root-margin-value="40px">
<%= render partial: "postings/snippet", collection: @page.records, as: :posting, cached: true %>
<%= link_to(spinner_tag, url_for(page: @page.next_param),
class: "pagination-link", data: { pagination_target: "nextPageLink", preload: @page.first? }) unless @page.last? %>
</section>
@adrienpoly
adrienpoly / application.html.erb
Last active April 30, 2025 15:45
Capybara / Stimulus test helper to ensure JS is ready when test starts
<!DOCTYPE html>
<html>
<head>
...
</head>
<body data-controller="js">
<%= yield %>
</body>
</html>
// This code is to be used with https://turbo.hotwire.dev. By default Turbo keeps visited pages in its cache
// so that when you visit one of those pages again, Turbo will fetch the copy from cache first and present that to the user, then
// it will fetch the updated page from the server and replace the preview. This makes for a much more responsive navigation
// between pages. We can improve this further with the code in this file. It enables automatic prefetching of a page when you
// hover with the mouse on a link or touch it on a mobile device. There is a delay between the mouseover event and the click
// event, so with this trick the page is already being fetched before the click happens, speeding up also the first
// view of a page not yet in cache. When the page has been prefetched it is then added to Turbo's cache so it's available for
// the next visit during the same session. Turbo's default behavior plus this trick make for much more responsive UIs (non SPA).
@vitobotta
vitobotta / prefetching.js
Created January 14, 2021 22:35
Prefetching
let lastTouchTimestamp
const prefetches = new Set()
const prefetchElement = document.createElement('link')
const isSupported = prefetchElement.relList && prefetchElement.relList.supports && prefetchElement.relList.supports('prefetch')
&& window.IntersectionObserver && 'isIntersecting' in IntersectionObserverEntry.prototype
const allowQueryString = true //'instantAllowQueryString' in document.body.dataset
const allowExternalLinks = false // 'instantAllowExternalLinks' in document.body.dataset
const useWhitelist = false //'instantWhitelist' in document.body.dataset
const mousedownShortcut = false //'instantMousedownShortcut' in document.body.dataset
@kylekeesling
kylekeesling / flatpickr_input.rb
Created January 2, 2021 14:48
A Simple Form custom input using stimulus-flatpickr and Bootstrap
# frozen_string_literal: true
class FlatpickrInput < SimpleForm::Inputs::StringInput
def input(wrapper_options)
template.content_tag(:div, class: "input-group",
data: {controller: "flatpickr", flatpickr_disable_mobile: true}) do
template.concat input_addon(calendar_button, data: {toggle: true})
template.concat @builder.text_field(attribute_name, input_html_options)
template.concat input_addon(close_button, data: {clear: true})
end
// DISCLAIMER : You can now probably use `data-turbo-action="advance"` on your frame to perform what this controller is aiming to do
// https://turbo.hotwired.dev/handbook/frames#promoting-a-frame-navigation-to-a-page-visit
// Note that you probably want to disable turbo cache as well for those page to make popstate work properly
import { navigator } from '@hotwired/turbo'
import { Controller } from '@hotwired/stimulus'
import { useMutation } from 'stimulus-use'
export default class extends Controller {
connect (): void {
@danielwestendorf
danielwestendorf / pre-commit
Last active May 6, 2021 15:38
Enforce codestyle automatically on git commit
#!/bin/sh
# Create this file here: ./.git/hooks/pre-commit
# chmod +x ./.git/hooks/pre-commit
.git/hooks/pre-commit-format-js
.git/hooks/pre-commit-format-ruby
@ireneybean
ireneybean / app.rb
Created August 3, 2019 21:05
Stimulus.js without a build system, but with babel, Sinatra
#...
get '/' do
haml :index, layout: false
end
#...