Skip to content

Instantly share code, notes, and snippets.

View gsmartagence's full-sized avatar

gsmartagence

3 followers · 17 following
  • Smart Agence
  • Paris
  • 15:10 (UTC +01:00)
View GitHub Profile
@gsmartagence
gsmartagence / Video.js
Created May 22, 2024 08:24 — forked from jaredpalmer/Video.js
Better <video> with intersection observer.
import { useRef, useCallback, useEffect } from 'react'
import { useInView } from 'react-intersection-observer'
import 'intersection-observer'
export default ({ src, caption, ratio }) => {
const [inViewRef, inView] = useInView({
threshold: 1,
})
const videoRef = useRef()
@gsmartagence
gsmartagence / install_nodejs_and_yarn_homebrew.md
Created January 22, 2020 07:26 — forked from nijicha/install_nodejs_and_yarn_homebrew.md
Install NVM, Node.js, Yarn via Homebrew
@gsmartagence
gsmartagence / onElementReady.js
Last active December 29, 2019 16:59
/**
* onElementReady.js
* @param {string} element - selector string
*/
const onElementReady = element => (
new Promise((resolve) => {
const waitForElement = () => {
const $element = document.querySelector(element)
if ($element) {
@gsmartagence
gsmartagence / package.json
Last active December 29, 2019 16:58
{
"name": "waitForElement.js",
"version": "0.1.0"
}
@gsmartagence
gsmartagence / bootstrapBreakpointsHelperIIFE.js
Last active July 19, 2019 16:35
/**
* bootstrapBreakpointsHelperIIFE
*/
const bootstrapBreakpointsHelperIIFE = function () {
'use strict'
const bootstrapControlStr = '<div style="display:block;padding:1rem 2rem;position:fixed;bottom:0;right:0;z-index:999999;background-color:#B30000;color:#FFF;"><div class="d-block d-sm-none"> XS</div><div class="d-none d-sm-block d-md-none">SM</div><div class="d-none d-md-block d-lg-none">MD</div><div class="d-none d-lg-block d-xl-none">LG</div><div class="d-none d-xl-block">XL</div></div>'
const bootstrapControl = document.createElement('div')
bootstrapControl.innerHTML = bootstrapControlStr
document.body.appendChild(bootstrapControl)
@gsmartagence
gsmartagence / inlineSvgStore.js
Last active November 18, 2019 13:55
/**
* inline svg store
* https://github.com/w0rm/gulp-svgstore#user-content-using-svg-as-external-file
*/
export const inlineSvgStore = (function (doc) {
'use strict'
const iconPath = doc.getElementById('iconPath').dataset.path
const scripts = doc.getElementsByTagName('script')
const script = scripts[scripts.length - 1]
@gsmartagence
gsmartagence / package.json
Created July 5, 2019 12:45
{
"name": "throttle.js",
"version": "0.1.0"
}
@gsmartagence
gsmartagence / domReady.js
Created July 5, 2019 09:32
export const domReady = function(fn) {
// If we're early to the party
document.addEventListener('DOMContentLoaded', fn)
// If late; I mean on time.
if (document.readyState === 'interactive' || document.readyState === 'complete' ) {
fn()
}
}
@gsmartagence
gsmartagence / bootstrapBreakpointsHelper.js
Last active July 19, 2019 16:35
/**
* bootstrapBreakpointsHelper
*/
export const bootstrapBreakpointsHelper = function () {
'use strict'
const bootstrapControlStr = '<div style="display:block;padding:1rem 2rem;position:fixed;bottom:0;right:0;z-index:999999;background-color:#B30000;color:#FFF;"><div class="d-block d-sm-none"> XS</div><div class="d-none d-sm-block d-md-none">SM</div><div class="d-none d-md-block d-lg-none">MD</div><div class="d-none d-lg-block d-xl-none">LG</div><div class="d-none d-xl-block">XL</div></div>'
const bootstrapControl = document.createElement('div')
bootstrapControl.innerHTML = bootstrapControlStr
document.body.appendChild(bootstrapControl)
@gsmartagence
gsmartagence / elementClosest.js
Last active July 5, 2019 09:07
if (window.Element && !Element.prototype.closest) {
Element.prototype.closest =
function(s) {
const matches = (this.document || this.ownerDocument).querySelectorAll(s)
let i
let el = this;
do {
i = matches.length
while (--i >= 0 && matches.item(i) !== el) {}
} while ((i < 0) && (el = el.parentElement))