From 32bef04cedccef353269504ed4d23668c8853a14 Mon Sep 17 00:00:00 2001 From: Kevin MacMartin Date: Tue, 26 Sep 2017 15:35:30 -0400 Subject: [PATCH] Move the subscription form to its own blade so it can be imported, remove the address/location as that's not standard, get things working correctly, add errors, and use name instead of id for the form fields so it can be used on any page --- .../Controllers/SubscriptionController.php | 8 ++---- ...15_12_17_232249_add_subscription_table.php | 1 - resources/assets/js/subscription.js | 26 ++++++++++--------- .../assets/sass/elements/_subscription.scss | 7 +++++ .../elements/subscription-form.blade.php | 7 +++++ resources/views/website/index.blade.php | 11 +------- 6 files changed, 31 insertions(+), 29 deletions(-) create mode 100644 resources/views/elements/subscription-form.blade.php diff --git a/app/Http/Controllers/SubscriptionController.php b/app/Http/Controllers/SubscriptionController.php index 5a91616..7ad0aff 100644 --- a/app/Http/Controllers/SubscriptionController.php +++ b/app/Http/Controllers/SubscriptionController.php @@ -10,22 +10,19 @@ class SubscriptionController extends Controller { { $this->validate($request, [ 'name' => 'required', - 'email' => 'required|email', - 'address' => array('required', 'regex:/^([A-Za-z][0-9][A-Za-z] *[0-9][A-Za-z][0-9]|[0-9][0-9][0-9][0-9][0-9])$/') + 'email' => 'required|email' ]); $name = $request['name']; $fname = preg_replace('/ .*$/', '', $name); $lname = preg_match('/. ./', $name) === 1 ? preg_replace('/^[^ ][^ ]* /', '', $name) : ''; $email = $request['email']; - $address = $request['address']; if (env('MAILCHIMP_APIKEY', '') != '' && env('MAILCHIMP_LISTID', '') != '') { // Submit the subscription request Newsletter::subscribe($email, [ 'FNAME' => $fname, - 'LNAME' => $lname, - 'ADDRESS' => $address + 'LNAME' => $lname ]); } @@ -33,7 +30,6 @@ class SubscriptionController extends Controller { $subscriptions = new Subscriptions; $subscriptions->name = $name; $subscriptions->email = $email; - $subscriptions->location = $address; $subscriptions->save(); return 'success'; diff --git a/database/migrations/2015_12_17_232249_add_subscription_table.php b/database/migrations/2015_12_17_232249_add_subscription_table.php index 2e48357..7e901d0 100644 --- a/database/migrations/2015_12_17_232249_add_subscription_table.php +++ b/database/migrations/2015_12_17_232249_add_subscription_table.php @@ -17,7 +17,6 @@ class AddSubscriptionTable extends Migration $table->increments('id'); $table->string('name'); $table->string('email'); - $table->string('location'); $table->timestamps(); }); } diff --git a/resources/assets/js/subscription.js b/resources/assets/js/subscription.js index a30577e..0ca0f6a 100644 --- a/resources/assets/js/subscription.js +++ b/resources/assets/js/subscription.js @@ -2,21 +2,24 @@ function subscriptionFormInit() { const $form = $("#subscription-form"), $input = $form.find(":input"), - $notify = $("#notification"); + $name = $form.find("[name='name']"), + $email = $form.find("[name='email']"), + $token = $form.find("[name='_token']"), + $submit = $form.find("[name='submit']"), + $notify = $form.find(".notification"); let subscribe = {}, submitting = false; const getSubscribeData = function() { subscribe = { - name: $("#name").val(), - email: $("#email").val(), - address: $("#address").val(), - _token: $("#token").val() + name: $name.val(), + email: $email.val(), + _token: $token.val() }; }; - $("#submit").on("click", function(e) { + $submit.on("click", function(e) { e.preventDefault(); if (!submitting) { @@ -25,10 +28,10 @@ function subscriptionFormInit() { $.ajax({ type: "POST", - url: "/subscription-submit", + url: "/api/subscription-submit", data: subscribe }).always(function(response) { - let responseJSON, errors, prop; + let errors; $form.find(".error").removeClass("error"); $notify.removeClass("visible").removeClass("error"); @@ -41,13 +44,12 @@ function subscriptionFormInit() { $input.fadeOut(150); }, 1000); } else { - responseJSON = response.responseJSON; errors = 0; // add the error class to fields that haven't been filled out - for (prop in responseJSON) { - if (responseJSON.hasOwnProperty(prop)) { - $("#" + prop).addClass("error"); + for (let errorName in response.responseJSON.errors) { + if ($form.find(`[name='${errorName}']`).length) { + $form.find(`[name='${errorName}']`).addClass("error"); errors++; } } diff --git a/resources/assets/sass/elements/_subscription.scss b/resources/assets/sass/elements/_subscription.scss index f737d25..230deae 100644 --- a/resources/assets/sass/elements/_subscription.scss +++ b/resources/assets/sass/elements/_subscription.scss @@ -1,4 +1,5 @@ #subscription-form { + $trans-speed: 100ms; position: absolute; top: 50%; right: 0px; @@ -12,5 +13,11 @@ margin: 5px; width: calc(100% - 10px); padding: 3px; + border: 1px solid lighten($c-accent, 50%); + transition: border-color $trans-speed; + + &.error { + border-color: $c-error; + } } } diff --git a/resources/views/elements/subscription-form.blade.php b/resources/views/elements/subscription-form.blade.php new file mode 100644 index 0000000..147c489 --- /dev/null +++ b/resources/views/elements/subscription-form.blade.php @@ -0,0 +1,7 @@ +
+
+ + + + +
diff --git a/resources/views/website/index.blade.php b/resources/views/website/index.blade.php index 3f040af..16fcaea 100644 --- a/resources/views/website/index.blade.php +++ b/resources/views/website/index.blade.php @@ -1,14 +1,5 @@ @extends('layouts.public', [ 'title' => 'Home' ]) @section('content') -
-
- - - - -
- -
-
+ @include('elements.subscription-form') @endsection