Skip to content

Instantly share code, notes, and snippets.

View rijkvanzanten's full-sized avatar
💜
Building Directus

Rijk van Zanten rijkvanzanten

💜
Building Directus
View GitHub Profile
/**
* Validates RGB(a) value
* @param {Number} r
* @param {Number} g
* @param {Number} b
* @param {Number} [a=0]
* @return {Boolean}
*/
function isValidRGB(r, g, b, a) {
a = a || 0;
@rijkvanzanten
rijkvanzanten / hex-to-rgb.js
Created March 26, 2017 10:07
Converts hex value to RGB(a) values
/**
* Converts hex value (without #) to rgb(a) object
* @param {String} hex 3, 6 or 8 digit hex (without #)
* @return {Object} rgba values
*/
function convertHexToRGB(hex) {
var fullHex = hex;
var rgba = {};
if(hex.length === 3) {
@rijkvanzanten
rijkvanzanten / group-objects-by-date.js
Created June 23, 2017 13:01
Convert array of objects w/ timestamp to object by date
/**
* Convert array of objects w/ timestamp to object by date
* @param {Array} messages Messages to convert
* @return {Object} Messages grouped by date YYYY-MM-DD
*/
function groupMessagesByDate(messages = []) {
const groupedMessages = {};
messages.forEach(message => {
const {timestamp: date} = message;
@rijkvanzanten
rijkvanzanten / mysql-date-to-js.js
Created September 12, 2017 19:33
MySQL date to JS
const parseDate = dateString => {
const match = dateString.match(/^(\d+)-(\d+)-(\d+) (\d+)\:(\d+)\:(\d+)$/)
match[2] = match[2] - 1; // Month must be 0...11 instead of 1...12
match.shift();
return new Date(...match);
}
:focus:not(:focus-visible) { outline: none }
@rijkvanzanten
rijkvanzanten / debounce.js
Last active March 2, 2022 03:34
Small debounce function, based on David Walsh's original
function debounce(callback, wait) {
var timeout;
return function() {
var context = this;
var args = arguments;
var later = function() {
timeout = null;
}
@rijkvanzanten
rijkvanzanten / percentage-in-view.js
Last active September 24, 2024 07:59
Get how much percentage an element is in view in plain JavaScript
function getViewPercentage(element) {
const viewport = {
top: window.pageYOffset,
bottom: window.pageYOffset + window.innerHeight
};
const elementBoundingRect = element.getBoundingClientRect();
const elementPos = {
top: elementBoundingRect.y + window.pageYOffset,
bottom: elementBoundingRect.y + elementBoundingRect.height + window.pageYOffset
@rijkvanzanten
rijkvanzanten / axios-cache.js
Created July 20, 2020 14:51
Axios w/ Cache Interceptors
const axios = require('axios');
const cache = require('memory-cache');
require('dotenv').config();
const api = new axios.create({
baseURL: process.env.API_URL,
headers: {
'Authorization': 'Bearer ' + process.env.API_TOKEN
}
@rijkvanzanten
rijkvanzanten / directus-image-validation-hook.js
Created June 7, 2022 17:38
Validates a selected image for a fake "articles" table by mime type
// This example uses a "articles" collection with an "image" field that we only want to allow JPEGs in
module.exports = function registerHook({ filter, action }, { exceptions, services, logger }) {
const { InvalidPayloadException } = exceptions;
const { FilesService } = services;
//===============================================================================================
// Make sure only JPEGs can be associated to the collection
const imageFieldValidator = async (payload, _meta, { database, schema }) => {
// Note how the "database" object is passed in from the filter handler to the service, this
@rijkvanzanten
rijkvanzanten / tsconfig.json
Last active November 19, 2022 21:55
Current preferred ts config 10/17/22
{
"$schema": "https://json.schemastore.org/tsconfig",
"display": "Rijk's Preferred Setup 2022",
"compilerOptions": {
"lib": ["es2022"],
"module": "es2022",
"target": "es2022",
"strict": true,
"esModuleInterop": true,
"skipLibCheck": true,