<?php 
	/*template name: Contact page */
	get_header();
?>
<?php if(have_posts()) : while(have_posts()) : the_post(); ?>
		
	<?php 
    $style1 = (string) NULL;
    $style2 = (string) NULL;
    $style3 = (string) NULL;
    global $maskitto_light;

    global $wp_query;
    $post_obj = $wp_query->get_queried_object();
    $page = get_post( get_the_ID() );

        $subtitle = esc_attr( get_post_meta( get_the_ID(), 'wpcf-subtitle', true ));
        $titlebar = esc_attr( get_post_meta( get_the_ID(), 'wpcf-title-layout', true ));
        $title_color = esc_attr( get_post_meta( get_the_ID(), 'wpcf-title-color', true ));
        $background_color = esc_attr( get_post_meta( get_the_ID(), 'wpcf-background-color', true ));
        $background_image = esc_url( get_post_meta( get_the_ID(), 'wpcf-background-image', true ));
        $padding = esc_attr( get_post_meta( get_the_ID(), 'wpcf-page-padding', true ));
        $readmore = esc_attr( get_post_meta( get_the_ID(), 'wpcf-read-more', true ));

        $button_name = esc_attr( get_post_meta( get_the_ID(), 'wpcf-button-name', true ));
        $button_url = esc_url ( get_post_meta( get_the_ID(), 'wpcf-button-url', true ));
        if( !$button_url ) $button_url = '#';
        $button_icon = esc_attr( get_post_meta( get_the_ID(), 'wpcf-button-icon', true ));
        $button_type = esc_attr( get_post_meta( get_the_ID(), 'wpcf-button-tone', true ));

        $googlemaps_image = esc_url ( get_post_meta( get_the_ID(), 'wpcf-google-maps-image', true ));
        $googlemaps_url = esc_url ( get_post_meta( get_the_ID(), 'wpcf-google-maps-url', true ));
        $googlemaps_height = esc_attr( get_post_meta( get_the_ID(), 'wpcf-google-maps-height', true ));
        $sociallinks = esc_attr( get_post_meta( get_the_ID(), 'wpcf-social-links', true ));

        if( $padding == 'small' ) {
            $style1.= "padding: 35px 0;";
        } else if( $padding == 'large' ) {
            $style1.= "padding: 150px 0;";
        }

        if( $background_color ) {
            $style1.= "background-color: $background_color;";
        }

        if( $background_image ) {
            $style1.= "background-image: url($background_image);";
        }

        if( $title_color ) {
            $style2.= "color: $title_color;";
        }

        if( $googlemaps_height == 'extrasmall' ) {
            $style3.= "height: 200px;";
        } else if( $googlemaps_height == 'small' ) {
            $style3.= "height: 325px;";
        } else if( $googlemaps_height == 'large' ) {
            $style3.= "height: 550px;";
        } else if( $googlemaps_height == 'extralarge' ) {
            $style3.= "height: 750px;";
        } else {
            $style3.= "height: 450px;";
        }

    ?>
        <div class="page-section" style="<?php echo $style1; ?>">
            <div class="container page-list">
            
                <?php if( $titlebar == 'small' ) { ?>
                    <h4 class="text-center" style="<?php echo $style2; ?>"><?php echo $page->post_title; ?><?php echo maskitto_light_admin_edit( get_the_ID( )); ?></h4>
                <?php } else if( $titlebar == 'large' ) { ?>
                    <div class="section-title-large text-center">
                        <div class="title" style="<?php echo $style2; ?>"><?php echo $page->post_title; ?><?php echo maskitto_light_admin_edit( get_the_ID() ); ?></div>
                    </div>
                    <?php if( $page->post_content ) { ?>
                        <div class="section-content-large" style="<?php echo $style2; ?>"><?php echo apply_filters( 'the_content', $page->post_content ); ?></div>
                    <?php } ?>
                <?php } else { ?>
                    <div class="section-title text-center">
                        <h3 style="<?php echo $style2; ?>"><?php echo $page->post_title; ?><?php echo maskitto_light_admin_edit( get_the_ID() ); ?></h3>
                        <?php if( $subtitle ){ ?>
                            <div class="subtitle"><p><?php echo $subtitle; ?></p></div>
                        <?php } ?>
                        <div class="section-title-line"></div>
                    </div>
                    <?php if( $page->post_content && !$googlemaps_height ) { ?>
                        <div class="section-content" style="<?php echo $style2; ?>"><?php echo apply_filters( 'the_content', $page->post_content ); ?></div>
                    <?php } ?>
                <?php } ?>
                
                <?php if( $googlemaps_height ) { ?>
                    <div class="contact-section">
                        <div class="contact-subtitle"><?php _e( 'Information', 'maskitto-light' ); ?></div>
                        <div><?php echo apply_filters( 'the_content', $page->post_content ); ?></div>

                        <?php if( isset( $sociallinks ) && $sociallinks == '1' ) { ?>
                            <div class="contact-social-icons">  
                                <?php echo maskitto_light_social_icons(); ?>
                            </div>
                        <?php } ?>
                    </div>
                <?php } ?>          

                <?php if( $button_name ) { ?>
                    <a href="<?php echo $button_url; ?>" class="btn btn-default section-button section-button-<?php echo $button_type; ?>">
                        <?php if( $button_icon ) { ?>
                            <i class="fa <?php echo $button_icon; ?>"></i>
                        <?php } ?>
                        <?php echo $button_name; ?>
                    </a>
                <?php } ?>

            </div>
        </div>
        <?php if( $googlemaps_url ) { ?>
        <div class="page-section googlemap" style="<?php echo $style3; ?>">
            <a href="<?php echo $googlemaps_url; ?>" target="_blank" class="google-maps-image" style="background-image: url(<?php echo $googlemaps_image; ?>);"></a>
            <div class="googlemap-loading"><i class="fa fa-circle-o-notch fa-spin"></i></div>
        </div>
        <?php } ?>

<?php endwhile; endif; ?>
<?php get_footer(); ?>