Updated from js-template

.gitignore

@@ -1,3 +1,5 @@
+tmp
+dist
 vendor.js
 specs.js
 *bundle.js

.jshintrc

@@ -13,5 +13,6 @@
   "nonew": true,
   "strict": "global",
   "undef": true,
-  "unused": true
+  "unused": true,
+  "varstmt": true
 }

assets/scripts/example.js

@@ -0,0 +1,3 @@
+'use strict';
+
+module.exports = true;

assets/scripts/index.js

@@ -1,8 +1,7 @@
 'use strict';
 
-// const libraryApi = require('./library-api');
-// const ui = require('./ui');
+// user require with a reference to bundle the file and use it in this file
+// var example = require('./example');
 
-// On document ready
-$(() => {
-});
+// use require without a reference to ensure a file is bundled
+require('./example');

forms.md

@@ -0,0 +1,65 @@
+# Forms
+
+Developers should use `getFormFields` to retrieve data from html forms for API
+ requests.
+
+`getFormFields` only retrieves data from form elements with a name attribute.
+
+The object returned can be used to validate the form data.
+
+**in `api.js`**
+
+```js
+'use strict';
+
+const ajaxDefaults = {
+  url: 'http://localhost:3000',
+};
+
+const myRequest = (data, success, fail) => {
+  $.ajax(Object.assign({ method: 'POST', data }, ajaxDefaults))
+  .done(success)
+  .fail(fail);
+};
+
+module.exports = {
+  myRequest,
+};
+```
+
+**in `ui.js`**
+
+```js
+'use strict';
+
+const success = (data) => {
+  // handle success
+};
+
+const failure = (err) => {
+  // handle failure
+};
+
+module.exports = {
+  success,
+  failure,
+}
+```
+
+**in `index.js`**
+
+```js
+'use strict';
+
+const getFormFields = require('../../lib/get-form-fields');
+const api = require('./api');
+const ui = require('./ui');
+
+$(() => {
+  $('#my-form').on('submit', function (e) {
+    let data = getFormFields(this);
+    e.preventDefault();
+    api.myRequest(data, ui.success, ui.failure);
+  });
+});
+```

grunt/jscs.json

@@ -1,8 +1,6 @@
 {
   "options": {
-    "config": ".jscsrc",
-    "esnext": true,
-    "verbose": true
+    "config": ".jscsrc"
   },
 
   "status": {

grunt/webpack-dev-server.js

@@ -1,6 +1,7 @@
 'use strict';
 
 let clone = require('clone');
+
 // clone the webpack config to separate configuration of webpack and dev server
 let webpackConfig = clone(require('./webpack').options);
 
@@ -9,14 +10,14 @@ webpackConfig.entry.vendor.unshift('webpack-dev-server/client?http://localhost:8
 
 module.exports = {
   options: {
-    webpack: webpackConfig
+    webpack: webpackConfig,
   },
 
   start: {
     keepAlive: true,
     webpack: {
       devtool: 'source-map',
-      debug: 'true'
-    }
-  }
+      debug: 'true',
+    },
+  },
 };

grunt/webpack.js

@@ -13,16 +13,16 @@ module.exports = {
 
     output: {
       path: './',
-      filename: '[name].js'
+      filename: '[name].js',
     },
 
     plugins: [
       new webpack.optimize.CommonsChunkPlugin('vendor', 'vendor.bundle.js'),
       new webpack.ProvidePlugin({
-        $: "jquery",
-        jQuery: "jquery",
-        "window.jQuery": "jquery"
-      })
+        $: 'jquery',
+        jQuery: 'jquery',
+        'window.jQuery': 'jquery',
+      }),
     ],
 
     module: {
@@ -32,48 +32,48 @@ module.exports = {
           exclude: /(node_modules|bower_components)/,
           loader: 'babel',
           query: {
-            presets: ['es2015']
-          }
+            presets: ['es2015'],
+          },
         },
         {
           test: /\.css/,
           loader: 'style!css',
-          includePaths: [path.resolve(__dirname, "./node_modules")]
+          includePaths: [path.resolve(__dirname, './node_modules')],
         },
         {
           test: /\.scss/,
           loader: 'style!css!sass',
-          includePaths: [path.resolve(__dirname, "./node_modules")]
+          includePaths: [path.resolve(__dirname, './node_modules')],
         },
         {
           test: /\.woff[\d]?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
-          loader: "url-loader?limit=10000&mimetype=application/font-woff"
+          loader: 'url-loader?limit=10000&mimetype=application/font-woff',
         },
         {
-          test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
-          loader: "file-loader"
+          test: /\.(ttf|eot|svg|png|jpg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
+          loader: 'file-loader',
         },
         {
           test: /\.(hbs|handlebars)$/,
-          loader: 'handlebars-loader'
+          loader: 'handlebars-loader',
         },
         {
           test: /\.html\.(hbs|handlebars)$/,
-          loader: 'handlebars-loader!html'
-        }
-      ]
+          loader: 'handlebars-loader!html',
+        },
+      ],
     },
 
     stats: {
       colors: true,
       modules: true,
-      reasons: true
-    }
+      reasons: true,
+    },
   },
 
   build: {
     failOnError: true,
     watch: false,
-    keepalive: false
-  }
+    keepalive: false,
+  },
 };

index.js

@@ -13,3 +13,7 @@ require('./assets/styles/index.scss');
 // attach jQuery globally
 require('expose?$!jquery');
 require('expose?jQuery!jquery');
+
+// attach getFormFields globally
+
+require('expose?getFormFields!./lib/get-form-fields.js');

lib/get-form-fields.js

@@ -0,0 +1,56 @@
+'use strict';
+
+const addFormField = function addFormField(target, names, value) {
+  let name = names.shift();
+  let next = names[0];
+  if (next === '') { // name is an array
+    target[name] = target[name] || [];
+    target[name].push(value);
+  } else if (next) { // name is a parent key
+    target[name] = target[name] || {};
+    addFormField(target[name], names, value);
+  } else { // name is the key for value
+    target[name] = value;
+  }
+
+  return target;
+};
+
+const getFormFields = (form) => {
+  let target = {};
+
+  let elements = form.elements || [];
+  for (let i = 0; i < elements.length; i++) {
+    let e = elements[i];
+    if (!e.hasAttribute('name')) {
+      continue;
+    }
+
+    let type = 'TEXT';
+    switch (e.nodeName.toUpperCase()) {
+      case 'SELECT':
+        type = e.hasAttribute('multiple') ? 'MULTIPLE' : type;
+        break;
+      case 'INPUT':
+        type = e.getAttribute('type').toUpperCase();
+        break;
+    }
+
+    let names = e.getAttribute('name').split('[')
+      .map((k) => k.replace(/]$/, ''));
+
+    if (type === 'MULTIPLE') {
+      for (let i = 0; i < e.length; i++) {
+        if (e[i].selected) {
+          addFormField(target, names.slice(), e[i].value);
+        }
+      }
+    } else if ((type !== 'RADIO' && type !== 'CHECKBOX') || e.checked) {
+      addFormField(target, names, e.value);
+    }
+  }
+
+  return target;
+};
+
+module.exports = getFormFields;

package.json

@@ -1,40 +1,40 @@
 {
-  "name": "ga-wdi-boston.jquery-ajax-get",
+  "name": "ga-wdi-boston-js-template",
   "version": "0.0.2",
   "private": true,
   "license": "MIT",
   "dependencies": {
-    "jquery": "^2.2.2"
+    "jquery": "^2.2.0"
   },
   "devDependencies": {
-    "babel-core": "^6.7.4",
+    "babel-core": "^6.10.4",
     "babel-loader": "^6.2.4",
-    "babel-preset-es2015": "^6.6.0",
+    "babel-preset-es2015": "^6.9.0",
     "bootstrap-sass": "^3.3.6",
     "clone": "^1.0.2",
     "css-loader": "^0.23.1",
     "expose-loader": "^0.7.1",
-    "file-loader": "^0.8.5",
-    "grunt": "^0.4.5",
-    "grunt-concurrent": "^2.2.1",
-    "grunt-contrib-jasmine": "^1.0.0",
+    "file-loader": "^0.9.0",
+    "grunt": "^1.0.1",
+    "grunt-concurrent": "^2.3.0",
+    "grunt-contrib-jasmine": "^1.0.3",
     "grunt-contrib-jshint": "^1.0.0",
-    "grunt-jscs": "^2.8.0",
-    "grunt-jsonlint": "^1.0.7",
-    "grunt-nodemon": "^0.4.1",
+    "grunt-jscs": "^3.0.1",
+    "grunt-jsonlint": "^1.1.0",
+    "grunt-nodemon": "^0.4.2",
     "grunt-open": "^0.2.3",
     "grunt-webpack": "^1.0.11",
     "handlebars": "^4.0.5",
-    "handlebars-loader": "^1.2.0",
+    "handlebars-loader": "^1.3.0",
     "html-loader": "^0.4.3",
-    "load-grunt-config": "^0.19.1",
+    "load-grunt-config": "^0.19.2",
     "node-libs-browser": "^1.0.0",
-    "node-sass": "^3.4.2",
-    "sass-loader": "^3.2.0",
+    "node-sass": "^3.8.0",
+    "sass-loader": "^4.0.0",
     "style-loader": "^0.13.1",
     "time-grunt": "^1.3.0",
     "url-loader": "^0.5.7",
-    "webpack": "^1.12.14",
+    "webpack": "^1.13.1",
     "webpack-dev-server": "^1.14.1"
   }
 }

spec/example.spec.js

@@ -0,0 +1,9 @@
+'use strict';
+
+const example = require('../assets/scripts/example');
+
+describe('Example', function () {
+  it('is true', function () {
+    expect(example).toBe(true);
+  });
+});