Added PHP and javascript control for the contact form, moved javascript from template page to a dedicated script file

CHANGELOG

@@ -4,4 +4,5 @@
 20190117/02 - Edited templates location, removed unnecessary CSS and JS files, moved the onePageApp style and scripts into respective files, modified variable names for better comprehension. TODO next: add comments to the code. | I seriously didn't think to work so much, PS: comments are still to come.
 20190119/01 - Moved the entire title from the javascript to the PHP section, finished almost all templates, moved the footer on the main "template holder" page, extended the session to three days instead of just one for no technical reasons, added CHANGELOG, added three background images. | Did you seriously thought that this changelog was to keep track of any sort of change? OF COURSE NOT: it's for myself, when I commit only once after three days of work, to remember what the hell I did in the three days before, like sidenotes, but inside the own repository I will commit to...
 20190120/01 - Completed the templates, added a cool javascript effect on textarea (added jquery.ns-autogrow plugin), modified the click functions from .on to .click for improved performance | All tho the commit of "yesterday" was of "this morning" at 4 minutes passed midnight... my life is a *****, guess why...
-20190120/02 - Modified template title | My descriptions says everything
+20190120/02 - Modified template title | My descriptions says everything
+20190121/01 - Added PHP and javascript control for the contact form, moved javascript from template page to a dedicated script file | What to say, my description says everything again, strangely... How much I hate to commit 10 minutes after midnight by the way...

contactme/webform.php

@@ -0,0 +1,32 @@
+<?php
+    function check_email ( $email ) {
+        return filter_var ( $email, FILTER_VALIDATE_EMAIL );
+    }
+    
+    function post_call ( $url, $data ) {
+        $options = [
+            'http' => [
+                'header'  => "Content-type: application/x-www-form-urlencoded\r\n",
+                'method'  => 'POST',
+                'content' => http_build_query ( $data )
+            ]
+        ];
+        $context  = stream_context_create ( $options );
+        $result = file_get_contents ( $url, false, $context );
+        if ( $result === FALSE ) { /* Handle error */ } // TODO: next thing to do
+    }
+
+    if ( isset ( $_POST [ 'name' ] ) && isset ( $_POST [ 'email' ] ) && isset ( $_POST [ 'message' ] ) && check_email ( $_POST [ 'email' ] ) === false ) {
+        $message = [
+            'name' => $_POST [ 'name' ],
+            'email' => $_POST [ 'email' ],
+            'message' => $_POST [ 'email' ]
+        ];
+        $message_json = json_encode ( $message );
+        post_call ( 'https://telegram.bryanpedini.it/bots/personal-website-contactform.php', $message_json );
+        /*
+            if you need anything specific about telegram bots or you want to request me a custom made telegram bot,
+            please contact me at info@telegram.bryanpedini.it
+        */
+    }
+?>

js/onePageApp-contactForm.js

@@ -0,0 +1,22 @@
+(function ($) {
+    $(function () {
+        $('#contact-form-send').click(function () {
+            $.ajax({
+                url: 'contactme/webform.php',
+                method: 'POST',
+                datatype: 'JSON',
+                data: {
+                    name: $('#contact-form-name'),
+                    email: $('#contact-form-email'),
+                    message: $('#contact-form-message')
+                }
+            });
+        });
+        $("#scrolldown-button").click(function() {
+            $('html,body').animate({
+                scrollTop: $("#contact-form").offset().top
+            }, 'slow');
+        });
+        $("#contact-form-message").css('overflow', 'hidden').autogrow({vertical: true, horizontal: false, flickering: false});
+    });
+})(jQuery);

templates/contact-form.phtml

@@ -35,19 +35,10 @@
                     <label for="contact-form-message">Your Message:</label>
                     <textarea class="form-control" id="contact-form-message" rows="3"></textarea> 
                 </div>
-                <button type="submit" class="btn btn-default btn-outline-secondary">Get in touch with me</button>
+                <button type="submit" class="btn btn-default btn-outline-secondary" id="contact-form-send">Get in touch with me</button>
             </form>
         </div>
     </div>
 </div>
 <script src="vendor/jquery.ns-autogrow/jquery.ns-autogrow.min.js"></script>
-<script>
+<script src="js/onePageApp-contactForm.js"></script>
-    $(function () {
-        $("#scrolldown-button").click(function() {
-            $('html,body').animate({
-                scrollTop: $("#contact-form").offset().top},
-                'slow');
-        });
-        $("#contact-form-message").css('overflow', 'hidden').autogrow({vertical: true, horizontal: false, flickering: false});
-    });
-</script>