<!doctype html>
<html lang="en">
 
<head>
     <!-- Required meta tags -->
    <?php include('includes/meta.php');?>
    <title>Pillarstone | Contact Us</title>
    <?php include('includes/css.php');?>
</head>

<body>
    <!--::header part start::-->
    <?php include('layouts/header.php'); ?>
    <!-- Header part end-->

    <!-- breadcrumb start-->
    <section class="breadcrumb breadcrumb_bg">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="breadcrumb_iner">
                        <div class="breadcrumb_iner_item">
                            <h2>contact us</h2>
                            <p> <a href="index">Home</a> <span>-</span>contact us</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- breadcrumb start-->

    <!-- ================ contact section start ================= -->
    <section class="contact-section">
        <div class="container">
            <div class="d-none d-sm-block mb-5 pb-4">
                <div id="map" style="height: 480px;"></div>
                <script>
                    function initMap() {
                        var uluru = {
                            lat: -25.363,
                            lng: 131.044
                        };
                        var grayStyles = [{
                                featureType: "all",
                                stylers: [{
                                        saturation: -90
                                    },
                                    {
                                        lightness: 50
                                    }
                                ]
                            },
                            {
                                elementType: 'labels.text.fill',
                                stylers: [{
                                    color: '#ccdee9'
                                }]
                            }
                        ];
                        var map = new google.maps.Map(document.getElementById('map'), {
                            center: {
                                lat: -17.824858,
                                lng: 31.053028
                            },
                            zoom: 9,
                            styles: grayStyles,
                            scrollwheel: false
                        });
                    }
                </script>
                <script
                    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDpfS1oRGreGSBU5HHjMmQ3o5NLw7VdJ6I&callback=initMap">
                </script>

            </div>


            <div class="row">
                <div class="col-12">
                    <h2 class="contact-title">Get in Touch</h2>
                </div>
                <div class="col-lg-8">
                    <?php
                    // function __autoload($class){
                    // 	require_once "classes/$class.php";
                    // }
                    spl_autoload_register(function($class) {
                        include 'classes/' . $class . '.php';
                    });
                    
                    $emails = new Emailpro();


                    if(isset($_POST['send'])){

                        $details = [
                            "names"      => $_POST['name'],
                            "email"      => $_POST['email'],
                            "subject"    => $_POST['subject'],
                            "message"    => $_POST['message'],
                        ];

                        $res = $emails->sendemail($details);
                        
                        if($res){
                            ?>
                            <script>
                                Swal.fire(
                                    'Email Sent!',
                                    'Thank you for emailing us , we will respond soon!',
                                    'success'
                                    )
                            </script>
                            <?php
                        }else{
                            ?>
                            <script>
                                Swal.fire(
                                    'Failed to send email!',
                                    'Sorry we could not send you email , please try again!',
                                    'error'
                                    )
                            </script>
                            <?php
                        }

                    }
                ?>
                    <form class="form-contact " action="contact" method="post" id=""
                        novalidate="novalidate">
                        <div class="row">
                            <div class="col-12">
                                <div class="form-group">

                                    <textarea class="form-control w-100" name="message" id="message" cols="30" rows="9"
                                        onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter Message'"
                                        placeholder='Enter Message'></textarea>
                                </div>
                            </div>
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <input class="form-control" name="name" id="name" type="text"
                                        onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter your name'"
                                        placeholder='Enter your name'>
                                </div>
                            </div>
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <input class="form-control" name="email" id="email" type="email"
                                        onfocus="this.placeholder = ''"
                                        onblur="this.placeholder = 'Enter email address'"
                                        placeholder='Enter email address'>
                                </div>
                            </div>
                            <div class="col-12">
                                <div class="form-group">
                                    <input class="form-control" name="subject" id="subject" type="text"
                                        onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter Subject'"
                                        placeholder='Enter Subject'>
                                </div>
                            </div>
                        </div>
                        <div class="form-group mt-3">
                            <button type="submit" class="button btn_2" name="send">Send Message</button>
                        </div>
                    </form>
                </div>
                <div class="col-lg-4">
                    <div class="media contact-info">
                        <span class="contact-info__icon"><i class="ti-home"></i></span>
                        <div class="media-body">
                            <h3>2882 Lorraine Drive </h3>
                            <p>New Blufhill , Harare</p>
                        </div>
                    </div>
                    <div class="media contact-info">
                        <span class="contact-info__icon"><i class="ti-tablet"></i></span>
                        <div class="media-body">
                            <h3>+263 777 639 914</h3>
                            <p>Mon to Fri 8am to 4pm</p>
                        </div>
                    </div>
                    <div class="media contact-info">
                        <span class="contact-info__icon"><i class="ti-email"></i></span>
                        <div class="media-body">
                            <h3>info@pillarstone.co.zw</h3>
                            <p>Send us your query anytime!</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- ================ contact section end ================= -->

   

    <!-- footer part start-->
    <?php include('layouts/footer.php'); ?>
    <!-- footer part end-->

    <!-- jquery plugins here-->
    <?php include('includes/js.php');?>
</body>

</html>