Skip to content

Instantly share code, notes, and snippets.

View neodigm's full-sized avatar
💯
Product Designer ⚡ Interactive Storyteller

Scott C. Krause neodigm

💯
Product Designer ⚡ Interactive Storyteller
View GitHub Profile
@neodigm
neodigm / flv_to_mp4.sh
Last active October 1, 2020 03:15
Convert en masse all FLV videos to MP4 format (on Macbook). Credit Yu Arai.
#!/bin/sh
if [ $# -eq 1 ]; then
bitrate=$1
else
bitrate="400k"
fi
mkdir flv
for i in `ls *.flv`
do
ffmpeg -y -i ${i} -vcodec libx264 -b:v ${bitrate} -ac 2 -ar 44100 -ab 128k `basename ${i} .flv`.mp4
@neodigm
neodigm / isWebGL.js
Created October 9, 2020 14:41
Detect WebGL 2 browser support
var isWebGL2Available = function () { // Does this browser support WebGL 2?
try {
var canvas = document.createElement('canvas')
return !!(window.WebGL2RenderingContext && canvas.getContext('webgl2'))
} catch (e) {
return false
}
}
@neodigm
neodigm / hugo.html
Last active August 8, 2022 22:36
Hugo Go Template Short code list logic
<!--
hugo new accelerators/ga4.html
hugo new accelerators/webdev.html
-->
{{ $dir := (.Get "dir") }}
{{ if eq $dir "" }} {{ $dir = "assets" }} {{ end }}
{{/*
get all files that matches the directory name
which is passed as argument dir="" to the shortcode:
*/}}
@neodigm
neodigm / popover_ux_pattern.js
Last active December 8, 2020 02:03
A popover is a transient view that shows on a content screen when a user clicks on a control button or within a defined area.
// A popover is a transient view that shows on a content screen when a user clicks on a control button or within
// a defined area. Declarative implementation.
var oPopOver = (function( _w, _d, _q ){ // Popover UX pattern
let arPops = [], ePos, iOffTop=0, iOffLft=0;
return {
"init": function(){ // wire DOM events
arPops= [].slice.call(_d.querySelectorAll(_q));
_w.addEventListener("resize", oPopOver.closeAll);
_w.addEventListener("scroll", oPopOver.closeAll);
_d.body.addEventListener("click", function( e ){ // Outside Click close
@neodigm
neodigm / zoom.html
Last active December 6, 2020 18:06
var sMU_dt , sMU_mob; // LTDC PDP Exp Col Jan S3
sMU_mob = `
<span class="hero__container"
:class="{'hidden' : isPlayingVideo }">
<aside class="hero-sm__pre--aside">
<section id="js-flick__hero--id" :class="{'vis_hide' : !bFlickHero, 'vis_show' : bFlickHero }">
<div id="js-flickHero--id" class="hero__container--flick">
<article class="flickhero__cell" v-for="(fh, nOrder) in aFlickHero">
<img class="hero__image" :src="fh.img" alt="Hero Image">
// Grab the prefers reduced media query.
const mediaQuery = window.matchMedia("(prefers-reduced-motion: reduce)");
// Check if the media query matches or is not available.
if (!mediaQuery || mediaQuery.matches) {
doSomethingWithoutAnimation();
} else {
doSomethingWithAnimation();
}
@neodigm
neodigm / vue_make_all_parents_relative.js
Created November 28, 2020 15:51
Walk through DOM making all parents position relative - Vue.js method snippet
// Vue.js Method
"doHeroClick": function( ev ){
ev.preventDefault();
if( oTopmenu && !oTopmenu.isMobile() ){
var eTarget = this.$refs["pdp_zoom_reveal"];
eTarget = eTarget.parentNode;
if( eTarget ){
while( eTarget.tagName !== "HTML" ){
eTarget.style.position = "relative";
eTarget = eTarget.parentNode;
let image = document.querySelectorAll("canvas")[0].toDataURL("image/png").replace("image/png", "image/octet-stream");
window.location.href=image;
@neodigm
neodigm / disable_inline_stylesheet_by_selector.js
Last active January 17, 2021 03:31
Remove unwanted inline stylesheets by selector
var doRemoveSS = ( (_d, _q)=>{
let aS = [ ... _d.styleSheets];
aS.forEach( (oS)=>{
if( !oS.href ){
let aCSSR = [ ... oS.cssRules];
aCSSR.forEach( (oR)=>{
if( typeof oR.selectorText != "undefined"){
if( oR.selectorText.indexOf( _q ) != -1){
console.log( oR.selectorText );
oS.disabled = true;
function doScrollToCollections(sQuery, nOffset){
var eColl = document.querySelector( sQuery );
if( eColl && nOffset ){
window.scrollTo(0,0);
if( oTopmenu.isMobile() ) nOffset += 80; // Sticky
if( window.msCrypto ){ // Detect IE11
window.scrollTo(0, ( eColl.offsetTop - nOffset ));
}else{
window.scrollTo({ top: ( eColl.getBoundingClientRect().top - nOffset ), behavior: "smooth" });
}