correction && add form && add slide && add masonry && css

node_modules/get-size/README.md

@@ -0,0 +1,45 @@
+# getSize
+
+Get the size of elements. Used in [Masonry](https://masonry.desandro.com), [Isotope](https://isotope.metafizzy.co), &  [Flickity](https://flickity.metafizzy.co). 
+
+``` js
+var size = getSize( elem );
+// elem can be an element
+var size = getSize( document.querySelector('.selector') )
+// elem can be a selector string
+var size = getSize('.selector')
+```
+
+Returns an object with: 
+
++ width, height
++ innerWidth, innerHeight
++ outerWidth, outerHeight
++ paddingLeft, paddingTop, paddingRight, paddingBottom
++ marginLeft, marginTop, marginRight, marginBottom
++ borderLeftWidth, borderTopWidth, borderRightWidth, borderBottomWidth
++ isBorderBox
+
+Browser support: IE10+, Android 4.0+, iOS 5+, and modern browsers
+
+## Install
+
+Install with npm: `npm install get-size`
+
+Install with [Bower](https://bower.io): `bower install get-size`
+
+## Firefox hidden iframe bug
+
+[Firefox has an old bug](https://bugzilla.mozilla.org/show_bug.cgi?id=548397) that occurs within iframes that are hidden with `display: none`. To resolve this, you can use alternate CSS to hide the iframe off-screen, with out `display: none`.
+
+``` css
+.hide-iframe {
+  visibility: hidden;
+  position: absolute;
+  left: -999em;
+}
+```
+
+## MIT License
+
+getSize is released under the [MIT License](https://desandro.mit-license.org/).

node_modules/get-size/bower.json

@@ -0,0 +1,23 @@
+{
+  "name": "get-size",
+  "description": "measures element size",
+  "main": "get-size.js",
+  "authors": [
+    "David DeSandro"
+  ],
+  "license": "MIT",
+  "keywords": [
+    "size",
+    "DOM"
+  ],
+  "homepage": "https://github.com/desandro/get-size",
+  "ignore": [
+    "**/.*",
+    "package.json",
+    "node_modules",
+    "bower_components",
+    "test",
+    "tests",
+    "sandbox.html"
+  ]
+}

node_modules/get-size/get-size.js

@@ -0,0 +1,207 @@
+/*!
+ * getSize v2.0.3
+ * measure size of elements
+ * MIT license
+ */
+
+/* jshint browser: true, strict: true, undef: true, unused: true */
+/* globals console: false */
+
+( function( window, factory ) {
+  /* jshint strict: false */ /* globals define, module */
+  if ( typeof define == 'function' && define.amd ) {
+    // AMD
+    define( factory );
+  } else if ( typeof module == 'object' && module.exports ) {
+    // CommonJS
+    module.exports = factory();
+  } else {
+    // browser global
+    window.getSize = factory();
+  }
+
+})( window, function factory() {
+'use strict';
+
+// -------------------------- helpers -------------------------- //
+
+// get a number from a string, not a percentage
+function getStyleSize( value ) {
+  var num = parseFloat( value );
+  // not a percent like '100%', and a number
+  var isValid = value.indexOf('%') == -1 && !isNaN( num );
+  return isValid && num;
+}
+
+function noop() {}
+
+var logError = typeof console == 'undefined' ? noop :
+  function( message ) {
+    console.error( message );
+  };
+
+// -------------------------- measurements -------------------------- //
+
+var measurements = [
+  'paddingLeft',
+  'paddingRight',
+  'paddingTop',
+  'paddingBottom',
+  'marginLeft',
+  'marginRight',
+  'marginTop',
+  'marginBottom',
+  'borderLeftWidth',
+  'borderRightWidth',
+  'borderTopWidth',
+  'borderBottomWidth'
+];
+
+var measurementsLength = measurements.length;
+
+function getZeroSize() {
+  var size = {
+    width: 0,
+    height: 0,
+    innerWidth: 0,
+    innerHeight: 0,
+    outerWidth: 0,
+    outerHeight: 0
+  };
+  for ( var i=0; i < measurementsLength; i++ ) {
+    var measurement = measurements[i];
+    size[ measurement ] = 0;
+  }
+  return size;
+}
+
+// -------------------------- getStyle -------------------------- //
+
+/**
+ * getStyle, get style of element, check for Firefox bug
+ * https://bugzilla.mozilla.org/show_bug.cgi?id=548397
+ */
+function getStyle( elem ) {
+  var style = getComputedStyle( elem );
+  if ( !style ) {
+    logError( 'Style returned ' + style +
+      '. Are you running this code in a hidden iframe on Firefox? ' +
+      'See https://bit.ly/getsizebug1' );
+  }
+  return style;
+}
+
+// -------------------------- setup -------------------------- //
+
+var isSetup = false;
+
+var isBoxSizeOuter;
+
+/**
+ * setup
+ * check isBoxSizerOuter
+ * do on first getSize() rather than on page load for Firefox bug
+ */
+function setup() {
+  // setup once
+  if ( isSetup ) {
+    return;
+  }
+  isSetup = true;
+
+  // -------------------------- box sizing -------------------------- //
+
+  /**
+   * Chrome & Safari measure the outer-width on style.width on border-box elems
+   * IE11 & Firefox<29 measures the inner-width
+   */
+  var div = document.createElement('div');
+  div.style.width = '200px';
+  div.style.padding = '1px 2px 3px 4px';
+  div.style.borderStyle = 'solid';
+  div.style.borderWidth = '1px 2px 3px 4px';
+  div.style.boxSizing = 'border-box';
+
+  var body = document.body || document.documentElement;
+  body.appendChild( div );
+  var style = getStyle( div );
+  // round value for browser zoom. desandro/masonry#928
+  isBoxSizeOuter = Math.round( getStyleSize( style.width ) ) == 200;
+  getSize.isBoxSizeOuter = isBoxSizeOuter;
+
+  body.removeChild( div );
+}
+
+// -------------------------- getSize -------------------------- //
+
+function getSize( elem ) {
+  setup();
+
+  // use querySeletor if elem is string
+  if ( typeof elem == 'string' ) {
+    elem = document.querySelector( elem );
+  }
+
+  // do not proceed on non-objects
+  if ( !elem || typeof elem != 'object' || !elem.nodeType ) {
+    return;
+  }
+
+  var style = getStyle( elem );
+
+  // if hidden, everything is 0
+  if ( style.display == 'none' ) {
+    return getZeroSize();
+  }
+
+  var size = {};
+  size.width = elem.offsetWidth;
+  size.height = elem.offsetHeight;
+
+  var isBorderBox = size.isBorderBox = style.boxSizing == 'border-box';
+
+  // get all measurements
+  for ( var i=0; i < measurementsLength; i++ ) {
+    var measurement = measurements[i];
+    var value = style[ measurement ];
+    var num = parseFloat( value );
+    // any 'auto', 'medium' value will be 0
+    size[ measurement ] = !isNaN( num ) ? num : 0;
+  }
+
+  var paddingWidth = size.paddingLeft + size.paddingRight;
+  var paddingHeight = size.paddingTop + size.paddingBottom;
+  var marginWidth = size.marginLeft + size.marginRight;
+  var marginHeight = size.marginTop + size.marginBottom;
+  var borderWidth = size.borderLeftWidth + size.borderRightWidth;
+  var borderHeight = size.borderTopWidth + size.borderBottomWidth;
+
+  var isBorderBoxSizeOuter = isBorderBox && isBoxSizeOuter;
+
+  // overwrite width and height if we can get it from style
+  var styleWidth = getStyleSize( style.width );
+  if ( styleWidth !== false ) {
+    size.width = styleWidth +
+      // add padding and border unless it's already including it
+      ( isBorderBoxSizeOuter ? 0 : paddingWidth + borderWidth );
+  }
+
+  var styleHeight = getStyleSize( style.height );
+  if ( styleHeight !== false ) {
+    size.height = styleHeight +
+      // add padding and border unless it's already including it
+      ( isBorderBoxSizeOuter ? 0 : paddingHeight + borderHeight );
+  }
+
+  size.innerWidth = size.width - ( paddingWidth + borderWidth );
+  size.innerHeight = size.height - ( paddingHeight + borderHeight );
+
+  size.outerWidth = size.width + marginWidth;
+  size.outerHeight = size.height + marginHeight;
+
+  return size;
+}
+
+return getSize;
+
+});

node_modules/get-size/package.json

@@ -0,0 +1,54 @@
+{
+  "_from": "get-size@^2.0.3",
+  "_id": "get-size@2.0.3",
+  "_inBundle": false,
+  "_integrity": "sha512-lXNzT/h/dTjTxRbm9BXb+SGxxzkm97h/PCIKtlN/CBCxxmkkIVV21udumMS93MuVTDX583gqc94v3RjuHmI+2Q==",
+  "_location": "/get-size",
+  "_phantomChildren": {},
+  "_requested": {
+    "type": "range",
+    "registry": true,
+    "raw": "get-size@^2.0.3",
+    "name": "get-size",
+    "escapedName": "get-size",
+    "rawSpec": "^2.0.3",
+    "saveSpec": null,
+    "fetchSpec": "^2.0.3"
+  },
+  "_requiredBy": [
+    "/flickity"
+  ],
+  "_resolved": "https://registry.npmjs.org/get-size/-/get-size-2.0.3.tgz",
+  "_shasum": "54a1d0256b20ea7ac646516756202769941ad2ef",
+  "_spec": "get-size@^2.0.3",
+  "_where": "/var/www/html/node_modules/flickity",
+  "author": {
+    "name": "David DeSandro"
+  },
+  "bugs": {
+    "url": "https://github.com/desandro/get-size/issues"
+  },
+  "bundleDependencies": false,
+  "dependencies": {},
+  "deprecated": false,
+  "description": "measures element size",
+  "directories": {
+    "test": "test"
+  },
+  "homepage": "https://github.com/desandro/get-size",
+  "keywords": [
+    "size",
+    "DOM"
+  ],
+  "license": "MIT",
+  "main": "get-size.js",
+  "name": "get-size",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/desandro/get-size.git"
+  },
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "version": "2.0.3"
+}

node_modules/get-size/sandbox.html

@@ -0,0 +1,85 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+
+  <title>getSize</title>
+
+  <style>
+    .container {
+      width: 300px;
+      height: 200px;
+      margin-bottom: 10px;
+      border: 1px solid;
+      position: relative;
+    }
+
+    .box {
+      color: blue;
+      background: pink;
+    }
+
+    .border-box {
+      -webkit-box-sizing: border-box;
+         -moz-box-sizing: border-box;
+              box-sizing: border-box;
+    }
+
+    #box1, #box2 {
+      width: 50%;
+      height: 50%;
+      border: 10px solid;
+      padding: 10px;
+    }
+
+    #box3, #box4 {
+       width: 50%;
+       height: 50%;
+       border: 0px solid;
+       margin: 10%;
+       padding: 10px;
+     }
+
+    #box5, #box6 {
+       width: 100px;
+       height: 100px;
+       border: 10px solid;
+       margin: 10%;
+       padding: 5%;
+     }
+
+    </style>
+
+</head>
+<body>
+
+  <h1>getSize</h1>
+
+  <div class="container">
+    <div id="box1" class="box">box1</div>
+  </div>
+
+  <div class="container">
+    <div id="box2" class="box border-box">box2</div>
+  </div>
+
+  <div class="container">
+    <div id="box3" class="box">box3</div>
+  </div>
+
+  <div class="container">
+    <div id="box4" class="box border-box">box4</div>
+  </div>
+
+  <div class="container">
+    <div id="box5" class="box">box5</div>
+  </div>
+
+  <div class="container">
+    <div id="box6" class="box border-box">box6</div>
+  </div>
+
+  <script src="get-size.js"></script>
+
+</body>
+</html>

node_modules/get-size/test/iframe.html

@@ -0,0 +1,16 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+
+  <title>iframe</title>
+  
+</head>
+<body>
+
+  <h1>iframe</h1>
+
+  <iframe src="iframe3.html" width="800" height="500" style="display: none;"></iframe>
+
+</body>
+</html>

node_modules/get-size/test/iframe3.html

@@ -0,0 +1,22 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+
+  <title>iframe3</title>
+
+
+</head>
+<body>
+
+  <h1>iframe3</h1>
+
+    <script src="../get-size.js"></script>
+    <script>
+      window.onload = function() {
+        getSize( document.querySelector('h1') );
+      };
+    </script>
+
+</body>
+</html>

node_modules/get-size/test/iframe4.html

@@ -0,0 +1,20 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+
+  <title>iframe4</title>
+
+
+</head>
+<body>
+
+  <h1>iframe4</h1>
+
+    <script>
+    var p = document.createElement('p');
+    alert( getComputedStyle( p, null ) );
+    </script>
+
+</body>
+</html>

node_modules/get-size/test/index.html

@@ -0,0 +1,69 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+
+  <title>Get Size Tests</title>
+
+  <link rel="stylesheet" href="../bower_components/qunit/qunit/qunit.css" />
+  <link rel="stylesheet" href="tests.css" />
+
+  <script src="../bower_components/qunit/qunit/qunit.js"></script>
+  <script src="../get-size.js"></script>
+  <script src="tests.js"></script>
+
+
+</head>
+<body>
+
+<h1>Get Size Tests</h1>
+
+<div id="ex1" class="container">
+  <div class="box"></div>
+</div>
+
+<div id="ex2" class="container">
+  <div class="box"></div>
+</div>
+
+<div id="ex3" class="container">
+  <div class="box"></div>
+</div>
+
+<div id="ex4" class="container">
+  <div class="box"></div>
+</div>
+
+<div id="ex5" class="container">
+  <div class="box"></div>
+</div>
+
+<div id="ex6" class="container">
+  <div class="box"></div>
+</div>
+
+<div id="ex7" class="container">
+  <div class="box"></div>
+</div>
+
+<div id="ex8" class="container">
+  <div class="box"></div>
+</div>
+
+<div id="ex9" class="container">
+  <div class="box"></div>
+</div>
+
+<div id="hidden" class="container">
+  <div class="box box1"></div>
+  <div class="box box2"></div>
+</div>
+
+<div id="percent" class="container">
+  <div class="box"></div>
+</div>
+
+<div id="qunit"></div>
+
+</body>
+</html>

node_modules/get-size/test/tests.css

@@ -0,0 +1,95 @@
+body {
+  font-family: sans-serif;
+  width: 400px;
+  padding: 20px;
+}
+
+.container {
+  width: 400px;
+  height: 200px;
+  background: #333;
+  margin-bottom: 20px;
+}
+
+.box {
+  background: #0AE;
+  color: #F90;
+  border-color: #F90;
+}
+
+/* align to right side */
+#qunit {
+  position: absolute;
+  left: 0;
+  top: 20px;
+  margin-left: 440px;
+  margin-right: 10px;
+}
+
+
+/* Boxes
+------------------------- */
+
+#ex2 .box {
+  height: 100%;
+}
+
+#ex3 .box {
+  width: 50%;
+  height: 50%;
+}
+
+#ex4 .box,
+#ex5 .box {
+  width: 200px;
+  height: 100px;
+  border: 10px solid;
+}
+
+
+#ex5 .box {
+  margin: 10px 20px 30px 40px;
+}
+
+#ex6 .box {
+  width: 200px;
+  height: 100px;
+  padding: 10px 20px 30px 40px;
+}
+
+#ex7 .box {
+  height: 100px;
+  padding: 10px 20px 30px 40px;
+}
+
+#ex8 .box {
+  position: relative;
+  width: 66.6666%;
+  height: 66.666%;
+}
+
+/* border box */
+#ex9 .box {
+  -webkit-box-sizing: border-box;
+     -moz-box-sizing: border-box;
+          box-sizing: border-box;
+  height: 100%;
+  border-style: solid;
+  border-width: 10px 20px 30px 40px;
+  padding: 10px 20px 30px 40px;
+}
+
+#hidden .box {
+  display: none;
+  width: 200px;
+  height: 100px;
+  padding: 10px 20px 30px 40px;
+  margin: 10px 20px 30px 40px;
+}
+
+#percent .box {
+  width: 200px;
+  height: 100px;
+  margin-top: 20%;
+  margin-left: 10%;
+}

node_modules/get-size/test/tests.js

@@ -0,0 +1,156 @@
+/**
+ * getSize tests
+ * with QUnit
+**/
+
+/*jshint browser: true, devel: true, strict: true, undef: true */
+/*global equal: false, getSize: false, ok: false, test: false, strictEqual: false */
+
+( function( window ) {
+
+'use strict';
+
+function getBoxSize( num ) {
+  var box = document.querySelector( '#ex' + num + ' .box' );
+  return getSize( box );
+}
+
+test( 'arguments', function() {
+  ok( !getSize( 0 ), 'Number returns falsey' );
+  ok( !getSize( document.querySelector('#foobabbles') ), 'bad querySelector returns falsey' );
+  ok( getSize('#ex1'), 'query selector string works' );
+});
+
+test( 'ex1: no styling', function() {
+  var size = getBoxSize(1);
+  equal( size.width, 400, 'Inherit container width' );
+  equal( size.height, 0, 'No height' );
+  equal( size.isBorderBox, false, 'isBorderBox' );
+});
+
+test( 'ex2: height: 100%', function() {
+  var size = getBoxSize(2);
+  equal( size.height, 200, 'Inherit height' );
+});
+
+test( 'ex3: width: 50%; height: 50%', function() {
+  var size = getBoxSize(3);
+  equal( size.width, 200, 'half width' );
+  equal( size.height, 100, 'half height' );
+});
+
+test( 'ex4: border: 10px solid', function() {
+  var size = getBoxSize(4);
+  // console.log( size );
+  equal( size.width, 220, 'width = 220 width' );
+  equal( size.height, 120, 'height = 120 height' );
+  equal( size.innerWidth, 200, 'innerWidth = 200 width' );
+  equal( size.innerHeight, 100, 'innerHeight = 200 width' );
+  equal( size.outerWidth, 220, 'outerWidth = 200 width + 10 border + 10 border' );
+  equal( size.outerHeight, 120, 'outerHeight = 100 height + 10 border + 10 border' );
+});
+
+test( 'ex5: border: 10px solid; margin: 15px', function() {
+  // margin: 10px 20px 30px 40px;
+  var size = getBoxSize(5);
+  // console.log( size );
+  equal( size.width, 220, 'width = 220 width' );
+  equal( size.height, 120, 'height = 120 height' );
+  equal( size.marginTop, 10, 'marginTop' );
+  equal( size.marginRight, 20, 'marginRight' );
+  equal( size.marginBottom, 30, 'marginBottom' );
+  equal( size.marginLeft, 40, 'marginLeft ' );
+  equal( size.innerWidth, 200, 'innerWidth = 200 width' );
+  equal( size.innerHeight, 100, 'innerHeight = 200 width' );
+  equal( size.outerWidth, 280, 'outerWidth = 200 width + 20 border + 60 margin' );
+  equal( size.outerHeight, 160, 'outerHeight = 100 height + 20 border + 40 margin' );
+});
+
+test( 'ex6: padding, set width/height', function() {
+  var size = getBoxSize(6);
+  // console.log( size );
+  equal( size.width, 260, 'width' );
+  equal( size.height, 140, 'height' );
+  equal( size.innerWidth, 200, 'innerWidth = 200 width - 20 padding - 40 padding' );
+  equal( size.innerHeight, 100, 'innerHeight = 200 height - 10 padding - 30 padding' );
+  equal( size.outerWidth, 260, 'outerWidth' );
+  equal( size.outerHeight, 140, 'outerHeight' );
+
+});
+
+test( 'ex7: padding, inherit width', function() {
+  // padding: 10px 20px 30px 40px;
+  var size = getBoxSize(7);
+  // console.log( size );
+  equal( size.width, 400, 'width' );
+  equal( size.height, 140, 'height' );
+  equal( size.paddingTop, 10, 'paddingTop' );
+  equal( size.paddingRight, 20, 'paddingRight' );
+  equal( size.paddingBottom, 30, 'paddingBottom' );
+  equal( size.paddingLeft, 40, 'paddingLeft ' );
+  equal( size.innerWidth, 340, 'innerWidth = 400 width - 20 padding - 40 padding' );
+  equal( size.innerHeight, 100, 'innerHeight = 200 height - 10 padding - 30 padding' );
+  equal( size.outerWidth, 400, 'outerWidth' );
+  equal( size.outerHeight, 140, 'outerHeight' );
+
+});
+
+test( 'ex8: 66.666% values', function() {
+  var size = getBoxSize(8);
+
+  if ( size.width % 1 ) {
+    ok( size.width > 266.6 && size.width < 266.7, 'width is between 266.6 and 266.7' );
+  } else {
+    // IE8 and Safari
+    equal( size.width, 267, 'width is 267' );
+  }
+
+  if ( size.height % 1 ) {
+    ok( size.height > 133.3 && size.height < 133.4, 'height is between 133.3 and 133.4' );
+  } else {
+    // IE8
+    equal( size.height, 133, 'width is 133' );
+  }
+});
+
+test( 'ex9: border-box', function() {
+  var size = getBoxSize(9);
+  equal( size.isBorderBox, true, 'isBorderBox' );
+  equal( size.width, 400, 'width' );
+  equal( size.height, 200, 'height' );
+  equal( size.innerWidth, 280, 'innerWidth' );
+  equal( size.innerHeight, 120, 'innerHeight' );
+  equal( size.outerWidth, 400, 'outerWidth' );
+  equal( size.outerHeight, 200, 'outerHeight' );
+});
+
+test( 'display: none', function() {
+  var size = getSize( document.querySelector('#hidden .box1') );
+  strictEqual( size.width, 0, 'width' );
+  strictEqual( size.height, 0, 'height' );
+  strictEqual( size.innerWidth, 0, 'innerWidth' );
+  strictEqual( size.innerHeight, 0, 'innerHeight' );
+  strictEqual( size.outerWidth, 0, 'outerWidth' );
+  strictEqual( size.outerHeight, 0, 'outerHeight' );
+
+  size.width = 300;
+
+  size = getSize( document.querySelector('#hidden .box2') );
+  strictEqual( size.width, 0, 'cannot over write zeroSize' );
+
+});
+
+test( 'percent values', function() {
+  var size = getSize( document.querySelector('#percent .box') );
+  strictEqual( size.marginLeft, 40, 'marginLeft' );
+  strictEqual( size.marginTop, 80, 'marginTop' );
+  strictEqual( size.width, 200, 'width' );
+  strictEqual( size.height, 100, 'height' );
+  strictEqual( size.innerWidth, 200, 'innerWidth' );
+  strictEqual( size.innerHeight, 100, 'innerHeight' );
+  strictEqual( size.outerWidth, 240, 'outerWidth' );
+  strictEqual( size.outerHeight, 180, 'outerHeight' );
+});
+
+
+})( window );