jsonberry

// TODO
// Add Promise.race example
// Add Promise.all example
// Refactor async simulations to better reflect real-world scenarios
// Refactor so that if the evenOrOdd async work is not wrapped in a Promise that it could cause unexpected behavior sometimes depending on JS Type/Reference errors
function getRandomData() {
    return {
        number: Math.floor(Math.random() * 10),
        timeout: Math.floor(Math.random() * 10000)
    }

jsonberry

/* 
    Sometimes I pass data into a transformation layer
    I always expect the data to be a JSON object
    None of the properties of the object should be undefined, null, empty objects, or empty arrays
    If any of them are, then eject out of the transformation so the app doesn't have a chance to explode
*/


// How to implement
function transformData(data) {

jsonberry

You can effectively "override" a const if the subsequent declaration is in a nested function scope.

You can also override a const in a block with let, as that will keep the declaration lexically scoped to that block

Example: The JS engine will not allow an override of the const, even though the var is in a nested block scope

function myScopedConst() {
    const myScopedConst = 42;
    console.log('myScopedConst:: before the block ->', myScopedConst);

jsonberry

/*
*   Have only your active Atom tab have a different style
*
*       In Atom sometimes I open four panes...
*       Top LR might correspond to an HTML template for a component, 
*       Bottom LR would correspond to similar style sheet for those components... 
*       and each pane might have multiple components.
*
*       It can be helpful if Atom styles your active tab differently. 
*       Here's one way to do that:

jsonberry

// jQuery 1.12+
// Bind to window scrolling and setup debouncer
$(window).scroll(function() {
    clearTimeout(this.id);
    this.id = setTimeout(doneScrolling, 130); // 130ms was the shortest time that allowed execution of only once, any slower and it would fire multiple times
});

// Execute any functions here when scrolling stops
// Put all the things here!
function doneScrolling(){

jsonberry

// These styles only affect IE 10 + 11
@media all and 
    (-ms-high-contrast: none), 
    (-ms-high-contrast: active) {

    .selector {
        display: none;
    }

}

jsonberry

<?php 

// When migrating a site the siteurl and home url need to be adjusted
// Add these two update functions to functions.php...
// ..Load the site up...
// ..Verify that everything is working correctly..
// ..Then remove these functions from functions.php

update_option( 'siteurl', 'http://localhost:8888' ); // Be sure Replace the parameter with the correct url
update_option( 'home', 'http://localhost:8888' );

jsonberry

/* 
  Styling that correctly nests a WordPress menu generated with wp_nav_menu, with the container flag set to false (up to you how you implement)
  
  --> Not yet mobile friendly <--
  --> No additional classes need to be added to the menu the wp_nav_menu function <--
  --> Be sure to call the function inside a container element with the appropriate class of navbar <--
  --> Create and manage the menu via WP Appearance > Menu <--
  
  I left my initial styling here just as an example, so styles like font sizes and colors can be ignored
  What's important to note is when display changes for ul/li on hovers

jsonberry

.modal {
  min-height: 100%;
  position: fixed;
  background-color: $darkslategray-opaque;
  transform: translateY(-150%);
  transition: transform 750ms ease-in-out;
  display: flex;
  justify-content: center;
  align-items: center;
}

jsonberry

// Dark text on light backgrounds
$md-dol-primary: rgba(0,0,0,.87);
$md-dol-secondary: rgba(0,0,0,.54);
$md-dol-hint: rgba(0,0,0,.38);
$md-dol-divider: rgba(0,0,0,.12);

// White text on dark backgrounds
$md-lod-primary: rgba(255,255,255,1);
$md-lod-secondary: rgba(255,255,255,.70);
$md-lod-hint: rgba(255,255,255,.50);