Skip to content

Instantly share code, notes, and snippets.

View vincentorback's full-sized avatar
🌻

Vincent Orback vincentorback

🌻
48 followers · 38 following
View GitHub Profile
@vincentorback
vincentorback / focusable-selectors.js
Created November 10, 2023 14:54
Focusable selectors
const not = {
inert: ':not([inert]):not([inert] *)',
negTabIndex: ':not([tabindex^="-"])',
disabled: ':not(:disabled)',
}
export const FOCUSABLE_SELECTORS = [
`a[href]${not.inert}${not.negTabIndex}`,
`area[href]${not.inert}${not.negTabIndex}`,
`input:not([type="hidden"]):not([type="radio"])${not.inert}${not.negTabIndex}${not.disabled}`,
@vincentorback
vincentorback / getTextLines.js
Created January 11, 2023 19:36
Check if textNode has text on multiple lines
// console.log(getTextLines(querySelector('span')))
// returns number of lines
function collapseWhiteSpace(value) {
return value.trim().replace(/\s+/g, ' ')
}
function getTextLines(textNode) {
if (textNode.nodeType !== 3) {
return false // Only text nodes allowed
@vincentorback
vincentorback / wp-block-expiration-date.js
Created December 29, 2022 14:42
Add setting to wordpress gutenberg block to hide if after
const ThemeNamespace = 'my-theme'
wp.hooks.addFilter('blocks.registerBlockType', ThemeNamespace, function (settings) {
if (settings.name === 'core/paragraph') {
settings.attributes = Object.assign(settings.attributes, {
expirationDate: {
type: 'string',
default: null,
},
})
@vincentorback
vincentorback / wp-notify-if-using-simple-quotes.js
Last active December 29, 2022 16:56
Show warning notifications when user, in WordPress gutenberg editor, uses words or phrases in content. For example ' and " when they should be using ` or ”.
const warnAbout = [
{
id: 'single_quote_notice',
needle: '"',
haystack: 'text',
message: "Content includes simple quotation marks: '. Did you mean ’ ?",
dispatched: false,
},
{
id: 'double_quote_notice',
@vincentorback
vincentorback / wp-limit-image-sizes.php
Last active December 29, 2022 14:44
Limit wordpress image sizes based on save data header
<?php
/**
* Limit image srcset width
* @link https://developer.wordpress.org/reference/hooks/max_srcset_image_width/
*/
function limit_image_srcset_width( $max_width = 2048, $size_array = [] ) {
$saveData = (isset($_SERVER["HTTP_SAVE_DATA"]) && stristr($_SERVER["HTTP_SAVE_DATA"], "on") !== false) ? true : false;
return $saveData ? 652 : $max_width;
}
@vincentorback
vincentorback / react-native-transparent-image.js
Last active December 29, 2022 14:43
React native transparent image using canvas
import React from 'react'
import { Animated } from 'react-native'
import Canvas, { Image as CanvasImage } from 'react-native-canvas'
const TransparentImage = ({ source, width, height, backgroundColor }) => {
const fadeAnim = React.useRef(new Animated.Value(0)).current
return (
<Animated.View
style={{
@vincentorback
vincentorback / regex-background-position.md
Last active December 29, 2022 14:44
Common regex patterns

Background position (50% 50%)

/(\d{1,2}\% \d{1,2}\%)/g

@vincentorback
vincentorback / snipcart.js
Last active August 27, 2021 20:47
Product stock with Snipcart Javascript API
const API_KEY = 'XXXXXXXXXXXXXXXXX'
export const fetchStock = async (productId = '') => {
try {
const response = await fetch(`https://app.snipcart.com/api/products/${productId}`, {
headers: {
'Authorization': 'Basic ' + Buffer.from(API_KEY + ':').toString('base64'),
'Accept': 'application/json',
},
}).then(res => res.json())
@vincentorback
vincentorback / acf-yoast-og.php
Last active April 23, 2021 10:14
Use ACF images combined with Yoast SEO default image
<?php
/**
* Remove default output of og:image from yoast
*/
add_filter('wpseo_frontend_presenter_classes', function ($filter) {
$presenter_to_remove = [
'Yoast\WP\SEO\Presenters\Open_Graph\Image_Presenter'
];
@vincentorback
vincentorback / get_attachment_id_from_url.php
Last active February 25, 2022 09:15
Get the attachment ID for a given file url in WordPress
<?php
if ( ! function_exists( 'get_attachment_id_from_url' ) ) {
/**
* Get the attachment ID for a given file url
*
* @link http://wordpress.stackexchange.com/a/7094
* @param string $url
* @return boolean|integer
*/