Contact email form using swift.

backend.php

<?php

require_once '../../swift/lib/swift_required.php';


$success = false;
$senderName = isset( $_POST['senderName'] ) ? preg_replace( "/[^\.\-\' a-zA-Z0-9]/", "", $_POST['senderName'] ) : "";
$senderEmail = isset( $_POST['senderEmail'] ) ? preg_replace( "/[^\.\-\_\@a-zA-Z0-9]/", "", $_POST['senderEmail'] ) : "";
$message = isset( $_POST['message'] ) ? preg_replace( "/(From:|To:|BCC:|CC:|Subject:|Content-Type:)/", "", $_POST['message'] ) : "";

if ( $senderName && $senderEmail && $message ) {



// Ciao Piero, qui sotto trovi una configurazione gmail, ma puoi mettere qualunque smtp.
$transport = Swift_SmtpTransport::newInstance('smtp.gmail.com', 465,'ssl')
  ->setUsername('[email protected]')
  ->setPassword('perquoti');

  $mailer = Swift_Mailer::newInstance($transport);
$message = Swift_Message::newInstance()

  ->setSubject('W2MM: Submit your work')

  ->setFrom(array('[email protected]' => 'Welcome to my Mondo'))

  ->setTo(array($senderEmail => $senderName))

  ->setBody($message)
  ;

  $numSent = $mailer->send($message);
  if ($numSent > 0) {
    echo 'Thanks for sending your message! We\'ll get back to you shortly.';
  }
  else {
    echo 'There was a problem sending your message. Please try again.';
  }
  }
  else {
    echo 'Please complete all the fields in the form before sending.';
  }

?>

contact.coffee

$ ->
  $('#sendingMessage').click ->
    $(this).toggle()
  
  $('#contactForm').submit (e) ->
    e.preventDefault()
    # get some values from elements on the page: 
    $form = $(this)
    senderName = $form.find("input[name=\"senderName\"]").val()
    senderEmail = $form.find("input[name=\"senderEmail\"]").val()
    message = $form.find("textarea[name=\"message\"]").val()
    url = $form.attr("action")
  
    # Send the data using post 
    posting = $.post(url,
      senderName: senderName
      senderEmail: senderEmail
      message: message
    )
  
    # Put the results in a div 
    posting.done (data) ->
      $("#sendingMessage p").text data
      $("#sendingMessage").toggle()
  
  # interruttore per blocco barra TOP
  $("#lock_top_bar").click ->
    if $(this).hasClass("locked")
      $(this).removeClass "locked"
      $(this).parent().parent().removeClass "locked"
    else
      $(this).addClass "locked"
      $(this).parent().parent().addClass "locked"
  
  
  # interruttore per blocco barra BOTTOM
  $("#lock_bottom_bar").click ->
    if $(this).hasClass("locked")
      $(this).removeClass "locked"
      $(this).parent().parent().removeClass "locked"
    else
      $(this).addClass "locked"
      $(this).parent().parent().addClass "locked"

contact.css

#contact_form{
  width: 400px;
  height: 280px;
  background-color: #333;
}

#contact_form label {
  width: 100px;
  display: block;
  font-size: 15px;
  font-style: bold;
  font-size: 13px;
  color: #fcd700;
}

#contact_form input, #contact_form textarea {
  width: 385px;
  font-size: 14px;
  font-weight: normal;
  border: 1px dotted #FFFFFF;
  background: url(none) no-repeat #FFFFFF;
  font-style: normal;
  font-size: 14px;
  color: #454743;
}

#contact_form form {
  padding: 5px;
}

#contact_form button {
  -moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
  -webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
  box-shadow:inset 0px 1px 0px 0px #ffffff;
  background-color:#f9f9f9;
  -moz-border-radius:6px;
  -webkit-border-radius:6px;
  border-radius:6px;
  border:1px solid #dcdcdc;
  display:inline-block;
  color:#666666;
  font-family:arial;
  font-size:15px;
  font-weight:bold;
  padding:6px 76px;
  text-decoration:none;
  text-shadow:1px 1px 0px #ffffff;
  width: 390px;
}
#contact_form button:hover {
  background-color:#e9e9e9;
}
#contact_form button:active {
  position:relative;
  top:1px;
}


 .statusMessage {
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;  
  border-radius: 10px;
  cursor: pointer;
}


/* Style for the contact form and status messages */

.statusMessage {
  color: #666;
  background-color: #ebedf2;
  background: -webkit-gradient( linear, left bottom, left top, color-stop(0,#dfe1e5), color-stop(1, #ebedf2) );
  background: -moz-linear-gradient( center bottom, #dfe1e5 0%, #ebedf2 100% );  
  border: 1px solid #aaa;
  -moz-box-shadow: 0 0 1em rgba(0, 0, 0, .5);
  -webkit-box-shadow: 0 0 1em rgba(0, 0, 0, .5);
  box-shadow: 0 0 1em rgba(0, 0, 0, .5);
  opacity: .95;
}

.statusMessage {
  display: none;
  margin: auto;
  width: 30em;
  height: 2em;
  padding: 1.5em;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.statusMessage p {
  text-align: center;
  margin: 0;
  padding: 0;
}

contact.html

		<div  id="contact_form">
			<form  id="contactForm"  action="<?php echo $pages->find('template=newartist')->first->url ?>" method="post">
				<label for="senderName">Name</label>
				<input type="text" name="senderName"  placeholder="Please type your name" required="required" maxlength="40"/> <br> <br>
				<label for="senderEmail">Email</label>
				<input type="email" name="senderEmail"  placeholder="Please type your email address" required="required" maxlength="50" /> <br> <br>
				<label for="message">Message</label>
				<textarea name="message" rows="5" placeholder="Please type your message" required="required"  maxlength="10000"></textarea> <br> <br>
				<button type="submit">Send</button>
			</form>
			<div id="sendingMessage" class="statusMessage"><p>Sending your message. Please wait...</p></div>
		</div>

contact.js

$(function() {
  $('#sendingMessage').click(function() {
    return $(this).toggle();
  });
  $('#contactForm').submit(function(e) {
    var $form, message, posting, senderEmail, senderName, url;
    e.preventDefault();
    $form = $(this);
    senderName = $form.find("input[name=\"senderName\"]").val();
    senderEmail = $form.find("input[name=\"senderEmail\"]").val();
    message = $form.find("textarea[name=\"message\"]").val();
    url = $form.attr("action");
    posting = $.post(url, {
      senderName: senderName,
      senderEmail: senderEmail,
      message: message
    });
    return posting.done(function(data) {
      $("#sendingMessage p").text(data);
      return $("#sendingMessage").toggle();
    });
  });
  $("#lock_top_bar").click(function() {
    if ($(this).hasClass("locked")) {
      $(this).removeClass("locked");
      return $(this).parent().parent().removeClass("locked");
    } else {
      $(this).addClass("locked");
      return $(this).parent().parent().addClass("locked");
    }
  });
  return $("#lock_bottom_bar").click(function() {
    if ($(this).hasClass("locked")) {
      $(this).removeClass("locked");
      return $(this).parent().parent().removeClass("locked");
    } else {
      $(this).addClass("locked");
      return $(this).parent().parent().addClass("locked");
    }
  });
});