make Nesletter subscription work, closes #12

_config.yml

@@ -19,7 +19,7 @@ login:
 # Form actions
 forms:
     contact: '#'
-    newsletter: '#'
+    newsletter: "//foundation.us15.list-manage.com/subscribe/post?u=036bac2d4e3a3ea3de876a8dd&id=8a21e3e9ca"
 
 # Urls
 # --------------------

_src/_assets/js/_newsletter.js

@@ -0,0 +1,36 @@
+/* global jQuery */
+
+/* eslint-disable spaced-comment */
+//=include ajaxchimp/jquery.ajaxchimp.js
+/* eslint-enable spaced-comment */
+
+jQuery(($) => {
+    const form = $('.form--newsletter')
+    const formInput = form.find('.form__control')
+    const formLabel = form.find('.form__label')
+
+    form.ajaxChimp({
+        callback: formCallback
+    })
+
+    function formCallback(resp) {
+        if (resp.result === 'success') {
+            form.find('.input-group').css('display', 'none')
+            form.find('.form__help').css('display', 'none')
+        }
+        if (resp.result === 'error') {
+            form.find('.button')
+                .removeClass('disabled')
+                .text('Subscribe')
+        }
+    }
+
+    form.on('change', formInput, () => {
+        if (formInput.hasClass('error')) {
+            formInput.keypress(() => {
+                $(this).removeClass('error')
+                formLabel.removeClass('error').text('Your Email')
+            })
+        }
+    })
+}); // eslint-disable-line semi

_src/_assets/js/ipdb.js

@@ -1,9 +1,12 @@
 /* global SmoothScroll */
 /* global Autogrow */
 
-// =include _dnt.js
+/* eslint-disable spaced-comment */
-// =include smooth-scroll/dist/js/smooth-scroll.js
+//=include _dnt.js
-// =include textarea-autogrow/textarea-autogrow.js
+//=include _newsletter.js
+//=include smooth-scroll/dist/js/smooth-scroll.js
+//=include textarea-autogrow/textarea-autogrow.js
+/* eslint-enable spaced-comment */
 
 document.addEventListener('DOMContentLoaded', () => {
     //

_src/_assets/scss/_forms.scss

@@ -35,6 +35,22 @@
             padding-right: .1rem;
         }
     }
+
+    &.valid {
+        color: $brand-success;
+
+        &:after { display: none; }
+    }
+
+    &.error {
+        color: $brand-failure;
+
+        &:after { display: none; }
+
+        a {
+            text-decoration: underline;
+        }
+    }
 }
 
 .form__control {

_src/_includes/form-newsletter.html

@@ -1,9 +1,9 @@
-<form class="form" action="{{ config.site.forms.newsletter }}">
+<form class="form form--newsletter" action="//foundation.us15.list-manage.com/subscribe/post?u=036bac2d4e3a3ea3de876a8dd&amp;id=8a21e3e9ca" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" target="_blank">
     <div class="form__group required">
-        <label class="form__label" for="email">Your Email</label>
+        <label class="form__label" for="mce-EMAIL">Your Email</label>
 
         <div class="input-group">
-            <input class="form__control" type="email" id="email" name="email" required placeholder=" ">
+            <input class="form__control" type="email" id="mce-EMAIL" name="EMAIL" required placeholder=" ">
             <input class="button button-primary button--small" type="submit" value="Subscribe">
         </div>
 

_src/_includes/scripts.html

@@ -4,6 +4,7 @@
 // Site scripts
 //
 -->
+<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
 <script src="/assets/js/ipdb.min.js"></script>
 
 {% if page.js %}

package.json

@@ -27,19 +27,21 @@
     "ie >= 10"
   ],
   "dependencies": {
+    "ajaxchimp": "^1.3.0",
+    "jquery": "^3.2.1",
     "smooth-scroll": "^12.1.4",
     "textarea-autogrow": "^1.0.0"
   },
   "devDependencies": {
-    "babel-core": "^6.25.0",
+    "babel-core": "^6.26.0",
     "babel-eslint": "^7.2.3",
     "babel-preset-es2015": "^6.24.1",
     "browser-sync": ">=2.10.0",
     "concurrent-transform": "^1.0.0",
-    "critical": "^0.9.0",
+    "critical": "^0.9.1",
     "cross-spawn": "^5.1.0",
     "del": "^3.0.0",
-    "eslint": "^4.4.1",
+    "eslint": "^4.6.1",
     "eslint-config-ascribe": "^3.0.4",
     "eslint-plugin-import": "^2.7.0",
     "gulp": "github:gulpjs/gulp#4.0",
@@ -60,7 +62,7 @@
     "gulp-rev": "^8.0.0",
     "gulp-rev-replace": "^0.4.2",
     "gulp-sass": "^3.1.0",
-    "gulp-sourcemaps": "^2.4.1",
+    "gulp-sourcemaps": "^2.6.1",
     "gulp-svg-sprite": "^1.3.7",
     "gulp-uglify": "^3.0.0",
     "gulp-util": "^3.0.6",
@@ -69,7 +71,7 @@
     "stylelint": "^8.0.0",
     "stylelint-config-bigchaindb": "^1.0.0",
     "stylelint-config-standard": "^17.0.0",
-    "uglify-es": "^3.0.25"
+    "uglify-es": "^3.0.28"
   },
   "engines": {
     "node": ">=7.0.0"