Swap out contact form to one that uses mailgun

app/controllers/contacts_controller.rb

@@ -0,0 +1,16 @@
+class ContactsController < ApplicationController
+  def new
+    @contact = Contact.new
+  end
+
+  def create
+    @contact = Contact.new(params[:contact])
+    @contact.request = request
+    if @contact.deliver
+      flash.now[:success] = 'Message sent!'
+    else
+      flash.now[:error] = 'Could not send message'
+      render :new
+    end
+  end
+end

app/controllers/home_controller.rb

@@ -1,2 +1,5 @@
 class HomeController < ApplicationController
+  def index
+    @contact = Contact.new
+  end
 end

app/helpers/contact_helper.rb

@@ -0,0 +1,2 @@
+module ContactHelper
+end

app/helpers/contacts_helper.rb

@@ -0,0 +1,2 @@
+module ContactsHelper
+end

app/models/contact.rb

@@ -0,0 +1,17 @@
+class Contact < MailForm::Base
+  attribute :name,      validate: true
+  attribute :email,     validate: /\A([\w\.%\+\-]+)@([\w\-]+\.)+([\w]{2,})\z/i
+  attribute :organization
+  attribute :message
+  attribute :nickname,  captcha: true
+
+  # Declare the e-mail headers. It accepts anything the mail method
+  # in ActionMailer accepts.
+  def headers
+    {
+      :subject => "Contact Form Inquiry",
+      :to => ENV['CONTACT_FORM_DESTINATION'] || "memoryman51@hotmail.com",
+      :from => %("#{name}" <#{email}>)
+    }
+  end
+end

app/views/contacts/_new.html.erb

@@ -0,0 +1,26 @@
+<div class="container pb-5">
+  <h1>Contact Form</h1>
+  <%= form_for @contact do |f| %>
+    <div class="col-md-6">
+      <%= f.label :name %></br>
+      <%= f.text_field  :name, required: true, class: "contact-form-text-area" %></br>
+
+      <%= f.label :email %></br>
+      <%= f.text_field :email, required: true, class: "contact-form-text-area" %></br>
+
+      <%= f.label :organization %></br>
+      <%= f.text_field :organization, required: true, class: "contact-form-text-area" %></br>
+
+      <%= f.label :message %></br>
+      <%= f.text_area :message, rows: 8, cols: 40, required: true, class: "contact-form-text-area", 
+        placeholder: "Send me a message"%></br>
+
+        <div class= "d-none">
+          <%= f.label :nickname %>
+          <%= f.text_field :nickname, :hint => 'Leave this field blank!' %>
+        </div>
+
+        <%= f.submit 'Send Message', class: 'btn btn-primary' %>
+    </div>
+  <% end %>
+</div>

app/views/contacts/create.html.erb

@@ -0,0 +1,5 @@
+<div class="container">
+  <h1>Contact Form</h1>
+
+  <h3>Thank you for your message!</h3>
+</div>

app/views/contacts/new.html.erb

@@ -0,0 +1 @@
+<%= render(partial: "new") %>

app/views/home/index.html.erb

@@ -13,6 +13,8 @@
   </div>
 </header>
 
+
+
 <!-- Features section-->
 <section class="py-5 border-bottom" id="features">
   <div class="container px-5 my-5">
@@ -33,71 +35,9 @@
   </div>
 </section>
 
-<!-- Contact section-->
-<section class="bg-light py-5">
-  <div class="container px-5 my-5 px-5">
-    <div class="text-center mb-5">
-      <div class="feature bg-primary bg-gradient text-white rounded-3 mb-3"><i class="bi bi-envelope"></i></div>
-      <h2 class="fw-bolder">Get in touch</h2>
-      <p class="lead mb-0">We'd love to hear from you</p>
-    </div>
-    <div class="row gx-5 justify-content-center">
-      <div class="col-lg-6">
-        <!-- * * * * * * * * * * * * * * *-->
-        <!-- * * SB Forms Contact Form * *-->
-        <!-- * * * * * * * * * * * * * * *-->
-        <!-- This form is pre-integrated with SB Forms.-->
-        <!-- To make this form functional, sign up at-->
-        <!-- https://startbootstrap.com/solution/contact-forms-->
-        <!-- to get an API token!-->
-        <form id="contactForm" data-sb-form-api-token="8495ab6d-c9ab-43f4-9e22-4203c4481357">
-          <!-- Name input-->
-          <div class="form-floating mb-3">
-            <input class="form-control" id="name" type="text" placeholder="Enter your name..." data-sb-validations="required" />
-            <label for="name">Full name</label>
-            <div class="invalid-feedback" data-sb-feedback="name:required">A name is required.</div>
-          </div>
-          <!-- Email address input-->
-          <div class="form-floating mb-3">
-            <input class="form-control" id="email" type="email" placeholder="name@example.com" data-sb-validations="required,email" />
-            <label for="email">Email address</label>
-            <div class="invalid-feedback" data-sb-feedback="email:required">An email is required.</div>
-            <div class="invalid-feedback" data-sb-feedback="email:email">Email is not valid.</div>
-          </div>
-          <!-- Phone number input-->
-          <div class="form-floating mb-3">
-            <input class="form-control" id="phone" type="tel" placeholder="(123) 456-7890" data-sb-validations="required" />
-            <label for="phone">Phone number</label>
-            <div class="invalid-feedback" data-sb-feedback="phone:required">A phone number is required.</div>
-          </div>
-          <!-- Message input-->
-          <div class="form-floating mb-3">
-            <textarea class="form-control" id="message" type="text" placeholder="Enter your message here..." style="height: 10rem" data-sb-validations="required"></textarea>
-            <label for="message">Message</label>
-            <div class="invalid-feedback" data-sb-feedback="message:required">A message is required.</div>
-          </div>
-          <!-- Submit success message-->
-          <!---->
-          <!-- This is what your users will see when the form-->
-          <!-- has successfully submitted-->
-          <div class="d-none" id="submitSuccessMessage">
-            <div class="text-center mb-3">
-              <div class="fw-bolder">Form submission successful!</div>
-              To activate this form, sign up at
-              <br />
-              <a href="https://startbootstrap.com/solution/contact-forms">https://startbootstrap.com/solution/contact-forms</a>
-            </div>
-          </div>
-          <!-- Submit error message-->
-          <!---->
-          <!-- This is what your users will see when there is-->
-          <!-- an error submitting the form-->
-          <div class="d-none" id="submitErrorMessage"><div class="text-center text-danger mb-3">Error sending message!</div></div>
-          <!-- Submit Button-->
-          <div class="d-grid"><button class="btn btn-primary btn-lg disabled" id="submitButton" type="submit">Submit</button></div>
-        </form>
-      </div>
-    </div>
-  </div>
-</section>
+<!-- Message confirmation-->
+<%= render partial: 'layouts/message_confirmation' %>
 
+<!-- Contact section-->
+<%# <%= link_to "Contact Form", new_contact_path  %1> %>
+<%= render partial: "contacts/new"  %>

app/views/layouts/_message_confirmation.html.erb

@@ -0,0 +1,6 @@
+<div class="container">
+  <br>
+  <% flash.each do |key, message| %>
+    <p class="alert alert-<%= key %>"><%= message %></p>
+  <% end %>
+</div>

app/views/layouts/application.html.erb

@@ -13,6 +13,7 @@
 
   <body>
     <%= render partial: 'layouts/nav' %>
+
     <%= yield %>
 
     <!-- Footer-->