Scott J sc0ttj

## Preferences.sublime-settings
{
    "font_size": 12,
    "highlight_modified_tabs": true,
    "bold_folder_labels": false,
    "color_scheme": "Packages/User/SublimeLinter/Monokai (SL).tmTheme",
    "caret_style": "flash",
    "line_padding_bottom": 0,
    "line_padding_top": 0,
    "fade_fold_buttons": false,

## .bashrc
# ~/.bashrc: executed by bash(1) for non-login shells.
# see /usr/share/doc/bash/examples/startup-files (in the package bash-doc)
# for examples
# We use preexec and precmd hook functions for Bash
# If you have anything that's using the Debug Trap or PROMPT_COMMAND
# change it to use preexec or precmd
# See also https://github.com/rcaloras/bash-preexec

# If not running interactively, don't do anything
case $- in

## .vimrc
" Compatible with ranger 1.4.2 through 1.7.*
"
" Add ranger as a file chooser in vim
"
" If you add this code to the .vimrc, ranger can be started using the command
" ":RangerChooser" or the keybinding "<leader>r".  Once you select one or more
" files, press enter and ranger will quit again and vim will open the selected
" files.

function! RangeChooser()

## 1_phantomErrors.js
var page = require('webpage').create(),
    url = 'http://example.com/';

// Put the event handlers somewhere in the code before the action of
// interest (opening the page in question or clicking something)

// http://phantomjs.org/api/webpage/handler/on-console-message.html
page.onConsoleMessage = function(msg, lineNum, sourceId) {
  console.log('CONSOLE: ' + msg + ' (from line #' + lineNum + ' in "' + sourceId + '")');
};

## vanilla-js-components.js
// Vanilla JS components example
//
// Note:   This is just a demo/experiment
// Goals:  Super easy to setup, small code base, automatic re-renders on state update
//
// Component() features:
//  * a state management thing
//  * a state history
//  * automatic re-rendering on state change (no diffing!)
//  * ability to "time travel" to prev/next states

## vanilla-js-router.js
/* Vanilla JS router
 *
 * An isomorphic router - works client-side (browser), or server-side (NodeJS)
 *
 * It resolves URL paths like '/profile/1' to route patterns such as '/profile/:id',
 * and generates a params object that is passed to each route.
 *
 * Features:
 *
 * - Easy setup, zero dependencies

## custom-elements-pattern.md

      
              1 file
            
          
              0 forks
            
          
              0 comments
            
          
              0 stars
            
          
                sc0ttj
                / custom-elements-pattern.md
            
            
              Created
              April 10, 2020 12:50
                — forked from WebReflection/custom-elements-pattern.md
            
              
                Handy Custom Elements' Patterns
              
          
    Handy Custom Elements' Patterns


^{Photo by Ricardo Gomez Angel on Unsplash}
This gist is a collection of common patterns I've personally used here and there with Custom Elements.
These patterns are all basic suggestions that could be improved, enriched, readapted, accordingly with your needs.

  
## easing.js
/*
 * Easing Functions - inspired from http://gizma.com/easing/
 * only considering the t value for the range [0, 1] => [0, 1]
 */
EasingFunctions = {
  // no easing, no acceleration
  linear: t => t,
  // accelerating from zero velocity
  easeInQuad: t => t*t,
  // decelerating to zero velocity

## css-animations-example.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title><!-- Insert your title here --></title>

<style>

* {
  box-sizing: border-box;

## convert-UNIX-timestamp.js
function convertTimestamp(timestamp) {
  var d = new Date(timestamp * 1000),	// Convert the passed timestamp to milliseconds
		yyyy = d.getFullYear(),
		mm = ('0' + (d.getMonth() + 1)).slice(-2),	// Months are zero based. Add leading 0.
		dd = ('0' + d.getDate()).slice(-2),			// Add leading 0.
		hh = d.getHours(),
		h = hh,
		min = ('0' + d.getMinutes()).slice(-2),		// Add leading 0.
		ampm = 'AM',
		time;
	{
	"font_size": 12,
	"highlight_modified_tabs": true,
	"bold_folder_labels": false,
	"color_scheme": "Packages/User/SublimeLinter/Monokai (SL).tmTheme",
	"caret_style": "flash",
	"line_padding_bottom": 0,
	"line_padding_top": 0,
	"fade_fold_buttons": false,
	# ~/.bashrc: executed by bash(1) for non-login shells.
	# see /usr/share/doc/bash/examples/startup-files (in the package bash-doc)
	# for examples
	# We use preexec and precmd hook functions for Bash
	# If you have anything that's using the Debug Trap or PROMPT_COMMAND
	# change it to use preexec or precmd
	# See also https://github.com/rcaloras/bash-preexec

	# If not running interactively, don't do anything
	case $- in
	" Compatible with ranger 1.4.2 through 1.7.*
	"
	" Add ranger as a file chooser in vim
	"
	" If you add this code to the .vimrc, ranger can be started using the command
	" ":RangerChooser" or the keybinding "<leader>r". Once you select one or more
	" files, press enter and ranger will quit again and vim will open the selected
	" files.

	function! RangeChooser()
	var page = require('webpage').create(),
	url = 'http://example.com/';

	// Put the event handlers somewhere in the code before the action of
	// interest (opening the page in question or clicking something)

	// http://phantomjs.org/api/webpage/handler/on-console-message.html
	page.onConsoleMessage = function(msg, lineNum, sourceId) {
	console.log('CONSOLE: ' + msg + ' (from line #' + lineNum + ' in "' + sourceId + '")');
	};
	// Vanilla JS components example
	//
	// Note: This is just a demo/experiment
	// Goals: Super easy to setup, small code base, automatic re-renders on state update
	//
	// Component() features:
	// * a state management thing
	// * a state history
	// * automatic re-rendering on state change (no diffing!)
	// * ability to "time travel" to prev/next states
	/* Vanilla JS router
	*
	* An isomorphic router - works client-side (browser), or server-side (NodeJS)
	*
	* It resolves URL paths like '/profile/1' to route patterns such as '/profile/:id',
	* and generates a params object that is passed to each route.
	*
	* Features:
	*
	* - Easy setup, zero dependencies
	/*
	* Easing Functions - inspired from http://gizma.com/easing/
	* only considering the t value for the range [0, 1] => [0, 1]
	*/
	EasingFunctions = {
	// no easing, no acceleration
	linear: t => t,
	// accelerating from zero velocity
	easeInQuad: t => t*t,
	// decelerating to zero velocity
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<title><!-- Insert your title here --></title>

	<style>

	* {
	box-sizing: border-box;
	function convertTimestamp(timestamp) {
	var d = new Date(timestamp * 1000), // Convert the passed timestamp to milliseconds
	yyyy = d.getFullYear(),
	mm = ('0' + (d.getMonth() + 1)).slice(-2), // Months are zero based. Add leading 0.
	dd = ('0' + d.getDate()).slice(-2), // Add leading 0.
	hh = d.getHours(),
	h = hh,
	min = ('0' + d.getMinutes()).slice(-2), // Add leading 0.
	ampm = 'AM',
	time;