103 lines
3.6 KiB
PHP
103 lines
3.6 KiB
PHP
<?php
|
|
/**
|
|
* Block Name: Contact Info
|
|
*
|
|
* Two-column contact page layout: contact info, address/email/phone,
|
|
* and a Gravity Forms contact form on the left; Leaflet map on the right.
|
|
* Contact details read from global `contact_info`; map coordinates/zoom are
|
|
* block-level ACF fields.
|
|
*
|
|
* @package CWC
|
|
*/
|
|
|
|
namespace CWC;
|
|
|
|
$info = get_field( 'contact_info', 'option' );
|
|
$address = $info['address'] ?? '';
|
|
$email = $info['email'] ?? '';
|
|
$phone = $info['phone'] ?? '';
|
|
|
|
$heading = get_field( 'heading' );
|
|
|
|
$map_lat_value = get_field( 'map_latitude' );
|
|
$map_lng_value = get_field( 'map_longitude' );
|
|
$map_zoom_value = get_field( 'map_zoom' );
|
|
|
|
$map_lat = is_numeric( $map_lat_value ) ? (float) $map_lat_value : 49.8951;
|
|
$map_lng = is_numeric( $map_lng_value ) ? (float) $map_lng_value : -97.1384;
|
|
$map_zoom = is_numeric( $map_zoom_value ) ? (int) $map_zoom_value : 14;
|
|
$map_zoom = max( 1, min( 19, $map_zoom ) );
|
|
|
|
$map_popup = $address ? wp_strip_all_tags( $address ) : 'Our office';
|
|
|
|
$marker_svg_path = get_theme_file_path( '/views/blocks/contact-info/map-marker.svg' );
|
|
$map_marker_svg = '';
|
|
|
|
if ( file_exists( $marker_svg_path ) ) {
|
|
$map_marker_svg = file_get_contents( $marker_svg_path ); // phpcs:ignore
|
|
}
|
|
|
|
$map_marker = get_theme_file_uri( '/views/blocks/contact-info/map-marker.svg' );
|
|
|
|
$classes = 'contact-info mx-break-out';
|
|
$wrapper = blockWrapperAttributes( $classes, $is_preview );
|
|
?>
|
|
|
|
<section <?php echo wp_kses_post( $wrapper ); ?>>
|
|
<div class="contact-info__grid">
|
|
<div class="container contact-info__details">
|
|
<?php if ( $heading ) : ?>
|
|
<h1 class="contact-info__heading"><?php echo wp_kses_post( $heading ); ?></h1>
|
|
<?php endif; ?>
|
|
|
|
<ul class="contact-info__items">
|
|
<?php if ( $address ) : ?>
|
|
<li class="contact-info__item contact-info__item--address">
|
|
<span class="contact-info__icon" aria-hidden="true">
|
|
<img src="<?php echo esc_url( get_theme_file_uri( '/static/img/contact/icon-address.svg' ) ); ?>" alt="" width="24" height="24" loading="lazy" />
|
|
</span>
|
|
<span class="contact-info__value"><?php echo wp_kses_post( $address ); ?></span>
|
|
</li>
|
|
<?php endif; ?>
|
|
|
|
<?php if ( $email ) : ?>
|
|
<li class="contact-info__item contact-info__item--email">
|
|
<span class="contact-info__icon" aria-hidden="true">
|
|
<img src="<?php echo esc_url( get_theme_file_uri( '/static/img/contact/icon-email.svg' ) ); ?>" alt="" width="24" height="24" loading="lazy" />
|
|
</span>
|
|
<a class="contact-info__value" href="mailto:<?php echo esc_attr( $email ); ?>"><?php echo esc_html( $email ); ?></a>
|
|
</li>
|
|
<?php endif; ?>
|
|
|
|
<?php if ( $phone ) : ?>
|
|
<li class="contact-info__item contact-info__item--phone">
|
|
<span class="contact-info__icon" aria-hidden="true">
|
|
<img src="<?php echo esc_url( get_theme_file_uri( '/static/img/contact/icon-phone.svg' ) ); ?>" alt="" width="24" height="24" loading="lazy" />
|
|
</span>
|
|
<a class="contact-info__value" href="tel:<?php echo esc_attr( $phone ); ?>"><?php echo esc_html( $phone ); ?></a>
|
|
</li>
|
|
<?php endif; ?>
|
|
</ul>
|
|
|
|
<div class="contact-info__form">
|
|
<InnerBlocks />
|
|
</div>
|
|
</div>
|
|
|
|
<div
|
|
class="contact-info__map"
|
|
id="contact-map"
|
|
aria-label="Map of downtown Winnipeg"
|
|
role="region"
|
|
data-lat="<?php echo esc_attr( $map_lat ); ?>"
|
|
data-lng="<?php echo esc_attr( $map_lng ); ?>"
|
|
data-zoom="<?php echo esc_attr( $map_zoom ); ?>"
|
|
data-popup="<?php echo esc_attr( $map_popup ); ?>"
|
|
data-marker="<?php echo esc_url( $map_marker ); ?>"
|
|
data-marker-svg="<?php echo esc_attr( $map_marker_svg ); ?>"
|
|
>
|
|
<!-- Leaflet map mounts in this container. -->
|
|
</div>
|
|
</div>
|
|
</section>
|