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 / recursive_object_squash.js
Created February 25, 2021 19:52
Recursive Object Squash
function squash(object) { // Deep JavaScript Object Squash
return Object
.entries(object)
.map(([key, value]) => Object.assign({ key }, value && typeof value === "object"
? { value: '', children: squash(value) }
: { value, children: [] }
));
}
"use strict";
// Advanced eCom UX Patterns
// Show email promo image (branded) reveal once, every 7 days
// Open drawer to email panel when clicked
var fElmRevPromo = function( _d, _aIds ){
var _eRev = _d.getElementById( _aIds[0] ), _sBrand="LTD";
var _eRevI = _d.getElementsByClassName( _aIds[1] )[0];
return {
init: function( sBrand ){
// Scott C. Krause 👁️ neodigm | 2021
// Wait for Vue.js to mount and make VUEX auth token available to the chrome extension.
var _d = document, eScr = _d.createElement("script");
eScr.innerHTML = `
setInterval(() => {
var _d = document;
if( !_d.querySelector("[data-ext-auth]")){
var eV = _d.querySelector( 'DIV#app' );
if( eV?.__vue__?.$store?.state?.auth?.token ){
<!DOCTYPE=HTML>
<html>
<head>
<title>Scotts Awesome Sauce Checkbox!</title>
<meta name="generator" content="Hugo 0.76.4">
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=2, minimum-scale=1, width=device-width, height=device-height">
</head>
<body>
<section role="main">
var doTwoTouch = (function( _d, _q){ // Capture Pinch attempt on carousel
var eCntr, aEv=[];
setTimeout(function(){
if( oTopmenu && oTopmenu.isMobile() ) doTwoTouch.init();
}, 2800);
return {
"init": function(){
eCntr = _d.querySelector( _q[0] );
if( eCntr ){
eCntr.addEventListener("pointerdown", doTwoTouch.twoTouchDown );
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" });
}
@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;
let image = document.querySelectorAll("canvas")[0].toDataURL("image/png").replace("image/png", "image/octet-stream");
window.location.href=image;
@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;
// 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();
}