Skip to content

Instantly share code, notes, and snippets.

View ShMcK's full-sized avatar

Shawn McKay ShMcK

358 followers · 71 following
View GitHub Profile
@ShMcK
ShMcK / Angular1.3--Forms.html
Created September 30, 2014 10:26
Using Angular 1.3 Forms with $validators, ngMessages, $pending, $touched Src: http://www.htmlxprs.com/post/11/angularjs-1.3-form-validation-tutorial
<html ng-app="demoApp">
<script type="text/javascript">
angular.module('demoApp', ['ngMessages']); // include ngMessages module
angular
.module('htmlxprs', [])
.directive('usernameValidator', function () {
return {
restrict: 'AE',
require: 'ngModel',
link: function ($scope, elem, attrs, ngModel) {
@ShMcK
ShMcK / JavascriptModulePatterns
Created September 30, 2014 10:32
Javascript (ES5) Module Patterns
'use strict';
// 1. Revealing Module Pattern
var revModule = function (param) {
return {
// public
funk: funk
};
// private
@ShMcK
ShMcK / unselectable
Created September 30, 2014 10:50
HTML content unselectable
<!-- prevents copying -->
<body ondragstart="return false;" onselectstart="return false;" oncontextmenu="return false;" onload="clearData();"
onblur="clearData();">
<script type="text/javascript">
// IE fix for unselectable
var elem = document.getElementById("resume");
elem.unselectable = "on"; // For IE and Opera
</script>
@ShMcK
ShMcK / PictureElement
Last active August 29, 2015 14:07
<picture> element
<!-- Angular picture-fill: https://github.com/tinacious/angular-picturefill -->
<!-- ng.pictureFill -->
<span picture-fill data-alt="Image Description">
<span pf-src="images/image.png" data-media="(min-width: 1px)"></span>
<span pf-src="images/image-600.png" data-media="(min-width: 645px)"></span>
<span pf-src="images/image-1024.png" data-media="(min-width: 960px)"></span>
</span>
<span picture-fill data-alt="{{post.thumbnail.description}}" ng-if="post.thumbnail">
@ShMcK
ShMcK / Atom-Stylesheet.less
Last active June 14, 2016 21:04
Atom Stylesheet with background whitespace grid & styled html properties
// Atom Styles
// theme: one-dark
// syntax: apm install oceanic-next
atom-text-editor,
atom-workspace {
font-family: "Fira Code"; // https://github.com/tonsky/FiraCode
font-size: 14px;
line-height: 1.7;
}
@ShMcK
ShMcK / Live Reload from NPM scripts
Created July 25, 2016 05:50
Concurrent Live reload using NPM scripts
{
"name": "live-reload-npm-scripts",
"version": "1.0.0",
"description": "Run 'npm start' to begin developing",
"main": "src/index.js",
"scripts": {
"browserify": "browserify src/index.js -o dist/bundle.js -t [ babelify --presets [ es2015 ] ]",
"browsersync:start": "browser-sync start --server --files 'index.html dist/bundle.js'",
"browsersync:reload": "browser-sync reload",
"reload": "npm run browserify && npm run browsersync:reload",
@ShMcK
ShMcK / yarnOrNpmInstall.sh
Last active October 18, 2016 04:36
Run `yarn` if it exists, otherwise run `npm install`
if which yarn > /dev/null; then
yarn
else
npm install
fi
@ShMcK
ShMcK / npm-unfuck.sh
Last active November 9, 2016 00:31
Quick fix for npm dependency issues. Run "bash npm-unfuck.sh"
# NPM Unfuck
# Brought to you by:
# Mackenzie Kieran & Shawn McKay
# remove deps
rm -rf node_modules
npm cache clean
# lock dependencies
@ShMcK
ShMcK / mapToProps.md
Created September 14, 2017 04:46

Button.js

import { connect, actions } from 'mirrorx'

const Button = ({value, handleClick}) => (
  <button onClick={handleClick}>
 {value}
@ShMcK
ShMcK / Redux
Created January 16, 2018 17:52
class Store {
constructor(reducers = {}, initialState = {}, middleware = []) {
this.state = initialState
this.reducers = reducers
this.subscriptions = []
this.middlewares = middlewares
}
getState() {
return this.state
}