diff --git a/.env.example b/.env.example index 22e6c03..9c9a013 100644 --- a/.env.example +++ b/.env.example @@ -4,7 +4,7 @@ SITE_DESC=A website template APP_ENV=local APP_DEBUG=true APP_KEY=random_string -APP_URL=http://localhost +APP_URL=http://template.hypothetic.al DB_HOST=localhost DB_DATABASE=hypothetical @@ -17,9 +17,12 @@ CACHE_DRIVER=file SESSION_DRIVER=file QUEUE_DRIVER=sync +MAIL_SENDTO=null + MAIL_DRIVER=smtp MAIL_HOST=null MAIL_PORT=587 +MAIL_ADDRESS=null MAIL_USERNAME=null MAIL_PASSWORD=null -MAIL_ENCRYPTION=null +MAIL_ENCRYPTION=tls diff --git a/.gitignore b/.gitignore index f10fe05..e833bd3 100644 --- a/.gitignore +++ b/.gitignore @@ -3,6 +3,5 @@ /bower_components /public/build /public/css -/public/fonts /public/js .env diff --git a/app/Http/Controllers/ContactController.php b/app/Http/Controllers/ContactController.php new file mode 100644 index 0000000..7a53e80 --- /dev/null +++ b/app/Http/Controllers/ContactController.php @@ -0,0 +1,39 @@ +validate($request, [ + 'name' => 'required', + 'email' => 'required|email', + 'message' => 'required' + ]); + + $contact = new Contact; + + $name = $request['name']; + $email = $request['email']; + $message = $request['message']; + + $contact->name = $name; + $contact->email = $email; + $contact->message = $message; + $contact->save(); + + // Send the email if this is the production environment + if (env('MAIL_SENDTO') != null) { + Mail::send('email.contact', [ 'contact' => $contact ], function ($mail) use ($contact) { + $mail->from(env('MAIL_ADDRESS'), env('SITE_NAME')) + ->to(env('MAIL_SENDTO')) + ->subject('Contact form submission'); + }); + } + + return 'success'; + } +} diff --git a/app/Http/routes.php b/app/Http/routes.php index d2beebe..3ba109d 100644 --- a/app/Http/routes.php +++ b/app/Http/routes.php @@ -10,6 +10,12 @@ Route::get('/', function () { return view('website.home'); }); +Route::get('/contact', function() { + return view('website.contact'); +}); + +Route::post('/contact-submit', 'ContactController@postContactSubmit'); + /* |-------------------------------------------------------------------------- | Content Management Routes diff --git a/app/Models/Contact.php b/app/Models/Contact.php new file mode 100644 index 0000000..308c273 --- /dev/null +++ b/app/Models/Contact.php @@ -0,0 +1,11 @@ +increments('id'); + $table->string('name'); + $table->string('email'); + $table->text('message'); + $table->timestamps(); + }); + } + + /** + * Reverse the migrations. + * + * @return void + */ + public function down() + { + Schema::drop('contact'); + } +} diff --git a/gulpfile.js b/gulpfile.js index a05511c..8bc7630 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -18,6 +18,7 @@ elixir.config.autoprefix = { // javascript files in resources/assets/js/ var jsLocal = [ 'site-vars.js', + 'contact.js', 'app.js' ]; diff --git a/resources/assets/js/app.js b/resources/assets/js/app.js index 05d3a77..aca44a6 100644 --- a/resources/assets/js/app.js +++ b/resources/assets/js/app.js @@ -1 +1,6 @@ -console.log('app.js has been run'); +// run once the document is ready +$(document).ready(function() { + // initialize the contact form + if ($('#contact-form').length) + contactFormInit(); +}); diff --git a/resources/assets/js/contact.js b/resources/assets/js/contact.js new file mode 100644 index 0000000..d31b8b5 --- /dev/null +++ b/resources/assets/js/contact.js @@ -0,0 +1,57 @@ +// contact page functionality +function contactFormInit() { + var $form = $('#contact-form'), + $notify = $('#notification'), + contact = {}, + submitting = false; + + var getContactData = function() { + contact = { + name: $('#name').val(), + email: $('#email').val(), + message: $('#message').val(), + _token: $('#token').val() + }; + }; + + $('#submit').on('click', function(e) { + e.preventDefault(); + + if (!submitting) { + submitting = true; + getContactData(); + + $.ajax({ + type: 'POST', + url: '/contact-submit', + data: contact + }).always(function(response) { + $form.find('.error').removeClass('error'); + $notify.removeClass('visible'); + + if (response === 'success') { + $notify.text('Thanks for your message!').addClass('success').addClass('visible'); + } else { + var responseJSON = response.responseJSON, + errors = 0; + + // add the error class to fields that haven't been filled out + for (var prop in responseJSON) { + if (responseJSON.hasOwnProperty(prop)) { + $('#' + prop).addClass('error'); + errors++; + } + } + + if (errors > 0) { + $notify.find('span').text(errors); + $notify.addClass('visible'); + } + + // re-enable submitting + submitting = false; + } + }); + } + }); +} diff --git a/resources/assets/less/app.less b/resources/assets/less/app.less index f947785..a75ac82 100644 --- a/resources/assets/less/app.less +++ b/resources/assets/less/app.less @@ -7,6 +7,7 @@ // Supplementary @import "elements/**"; +@import "pages/**"; /* | diff --git a/resources/assets/less/var.less b/resources/assets/less/var.less index 6a410d4..73bca33 100644 --- a/resources/assets/less/var.less +++ b/resources/assets/less/var.less @@ -5,7 +5,8 @@ */ // Colours -@c_text: #111; // text -@c_text_light: #fff; // light text +@c_text: #111; // text +@c_text_light: #fff; // light text @c_base: #0088cc; // base @c_accent: #f5f5f5; // accent +@c_error: #ff0000; // error diff --git a/resources/assets/less/website/contact.less b/resources/assets/less/website/contact.less new file mode 100644 index 0000000..acf3f9b --- /dev/null +++ b/resources/assets/less/website/contact.less @@ -0,0 +1,49 @@ +#contact-form { + margin-top: 35px; + margin-bottom: 20px; + + input, textarea { + width: 100%; + margin-bottom: 20px; + padding: 5px 10px; + font-size: 14px; + background-color: rgba(255, 255, 255, 0.8); + border: 2px solid fade(@c_text, 25%); + transition: border 100ms; + &:focus { border: 2px solid fade(@c_base, 60%); } + &.error { border: 2px solid @c_error; } + } + + textarea { + resize: none; + height: 150px; + } + + #submit { + text-align: center; + font-weight: bold; + color: @c_text_light; + background-color: lighten(@c_base, 5%); + transition: background-color 100ms; + &:hover { background-color: @c_base; } + } + + #notification { + margin: 0px auto 15px auto; + padding: 5px 10px; + color: @c_text_light; + text-align: center; + font-size: 14px; + opacity: 0; + background-color: lighten(@c_error, 15%); + transition: opacity 100ms; + &.visible { opacity: 1; } + span { font-weight: bold; } + + &.success { + background-color: transparent; + color: @c_text; + font-weight: bold; + } + } +} diff --git a/resources/views/auth.blade.php b/resources/views/auth.blade.php index b10de38..c4ba305 100644 --- a/resources/views/auth.blade.php +++ b/resources/views/auth.blade.php @@ -1,11 +1,11 @@ @extends('base') @section('page-content') -
-
-
- @yield('auth-form') +
+
+
+ @yield('auth-form') +
-
@endsection diff --git a/resources/views/auth/login.blade.php b/resources/views/auth/login.blade.php index b2353e3..ddc8c03 100644 --- a/resources/views/auth/login.blade.php +++ b/resources/views/auth/login.blade.php @@ -1,24 +1,24 @@ @extends('auth') @section('auth-form') -
- {!! csrf_field() !!} + + {!! csrf_field() !!} -
- -
-
+
+ +
+
-
- -
-
+
+ +
+
-
- - -
+
+ + +
- -
+ + @endsection diff --git a/resources/views/auth/register.blade.php b/resources/views/auth/register.blade.php index d9fbb6d..8e3e94b 100644 --- a/resources/views/auth/register.blade.php +++ b/resources/views/auth/register.blade.php @@ -1,29 +1,29 @@ @extends('auth') @section('auth-form') -
- {!! csrf_field() !!} + + {!! csrf_field() !!} -
- -
-
+
+ +
+
-
- -
-
+
+ +
+
-
- -
-
+
+ +
+
-
- -
-
+
+ +
+
- -
+ + @endsection diff --git a/resources/views/contact.blade.php b/resources/views/contact.blade.php new file mode 100644 index 0000000..8d80d8c --- /dev/null +++ b/resources/views/contact.blade.php @@ -0,0 +1,11 @@ + + + + + + +

Name: {{ $contact['name'] }}

+

Email: {{ $contact['email'] }}

+

{{ $contact['message'] }}

+ + diff --git a/resources/views/email/contact.blade.php b/resources/views/email/contact.blade.php new file mode 100644 index 0000000..948600c --- /dev/null +++ b/resources/views/email/contact.blade.php @@ -0,0 +1,11 @@ + + + + + + +

Name: {{ $contact['name'] }}

+

Email: {{ $contact['email'] }}

+

{{ $contact['message'] }}

+ + diff --git a/resources/views/website/contact.blade.php b/resources/views/website/contact.blade.php new file mode 100644 index 0000000..599ebef --- /dev/null +++ b/resources/views/website/contact.blade.php @@ -0,0 +1,30 @@ +@extends('public') + +@section('page-content') + +
+
+
+

Contact

+
+
+ +
+
+
+
+ +
+
+ + + +
+ +
Error: There were problems with the 0 fields highlighted above
+
+
+
+
+ +@endsection