/**
* Widget front end display
*/
function widget($args, $instance)
{
// Turn $args array into variables.
extract($args);
// $instance Defaults
$instance_defaults = $this->defaults;
// If we have information in this widget, then ignore the defaults
if (!empty($instance)) {
$instance_defaults = array();
}
// Parse $instance
$widget = wp_parse_args($instance, $instance_defaults);
// Enqueue Masonry if need be
if ('list-masonry' == $this->check_and_return($widget, 'design', 'liststyle')) {
$this->enqueue_masonry();
}
// Set the background styling
if (!empty($widget['design']['background'])) {
layers_inline_styles('#' . $widget_id, 'background', array('background' => $widget['design']['background']));
}
if (!empty($widget['design']['fonts']['color'])) {
layers_inline_styles('#' . $widget_id, 'color', array('selectors' => array('.section-title h3.heading', '.section-title div.excerpt'), 'color' => $widget['design']['fonts']['color']));
}
// Apply the advanced widget styling
$this->apply_widget_advanced_styling($widget_id, $widget);
/**
* Generate the widget container class
*/
$widget_container_class = array();
$widget_container_class[] = 'widget';
$widget_container_class[] = 'row';
$widget_container_class[] = 'content-vertical-massive';
$widget_container_class[] = $this->check_and_return($widget, 'design', 'advanced', 'customclass');
$widget_container_class[] = $this->get_widget_spacing_class($widget);
$widget_container_class = implode(' ', apply_filters('layers_content_widget_container_class', $widget_container_class));
?>
<section class="<?php
echo $widget_container_class;
?>
" id="<?php
echo $widget_id;
?>
">
<?php
if ('' != $this->check_and_return($widget, 'title') || '' != $this->check_and_return($widget, 'excerpt')) {
?>
<div class="container clearfix">
<?php
/**
* Generate the Section Title Classes
*/
$section_title_class = array();
$section_title_class[] = 'section-title clearfix';
$section_title_class[] = $this->check_and_return($widget, 'design', 'fonts', 'size');
$section_title_class[] = $this->check_and_return($widget, 'design', 'fonts', 'align');
$section_title_class[] = $this->check_and_return($widget, 'design', 'background', 'color') && 'dark' == layers_is_light_or_dark($this->check_and_return($widget, 'design', 'background', 'color')) ? 'invert' : '';
$section_title_class = implode(' ', $section_title_class);
?>
<div class="<?php
echo $section_title_class;
?>
">
<?php
if ('' != $widget['title']) {
?>
<h3 class="heading"><?php
echo $widget['title'];
?>
</h3>
<?php
}
?>
<?php
if ('' != $widget['excerpt']) {
?>
<div class="excerpt"><?php
echo $widget['excerpt'];
?>
</div>
<?php
}
?>
</div>
</div>
<?php
}
?>
<?php
if (!empty($widget['columns'])) {
?>
<div class="row <?php
echo $this->get_widget_layout_class($widget);
?>
<?php
echo $this->check_and_return($widget, 'design', 'liststyle');
?>
">
<?php
// Set total width so that we can apply .last to the final container
$total_width = 0;
?>
<?php
foreach (explode(',', $widget['column_ids']) as $column_key) {
// Make sure we've got a column going on here
if (!isset($widget['columns'][$column_key])) {
continue;
}
// Setup the relevant slide
$column = $widget['columns'][$column_key];
// Set the background styling
if (!empty($column['design']['background'])) {
layers_inline_styles('#' . $widget_id . '-' . $column_key, 'background', array('background' => $column['design']['background']));
}
if (!empty($column['design']['fonts']['color'])) {
layers_inline_styles('#' . $widget_id . '-' . $column_key, 'color', array('selectors' => array('h5.heading a', 'h5.heading', 'div.excerpt', 'div.excerpt p'), 'color' => $column['design']['fonts']['color']));
}
if (!empty($column['design']['fonts']['shadow'])) {
layers_inline_styles('#' . $widget_id . '-' . $column_key, 'text-shadow', array('selectors' => array('h5.heading a', 'h5.heading', 'div.excerpt', 'div.excerpt p'), 'text-shadow' => $column['design']['fonts']['shadow']));
}
if (!isset($column['width'])) {
$column['width'] = $this->column_defaults['width'];
}
// Add the correct span class
$span_class = 'span-' . $column['width'];
// Add .last to the final column
$total_width += $column['width'];
if (12 == $total_width) {
$span_class .= ' last';
$total_width = 0;
} elseif ($total_width > 12) {
$total_width = 0;
}
// Set Featured Media
$featureimage = $this->check_and_return($column, 'design', 'featuredimage');
$featurevideo = $this->check_and_return($column, 'design', 'featuredvideo');
// Set Image Sizes
if (isset($column['design']['imageratios'])) {
// Translate Image Ratio into something usable
$image_ratio = layers_translate_image_ratios($column['design']['imageratios']);
if (!isset($column['width'])) {
$column['width'] = 6;
}
if (4 > $column['width']) {
$use_image_ratio = $image_ratio . '-medium';
} else {
$use_image_ratio = $image_ratio . '-large';
}
} else {
if (4 > $column['width']) {
$use_image_ratio = 'medium';
} else {
$use_image_ratio = 'full';
}
}
$media = layers_get_feature_media($featureimage, $use_image_ratio, $featurevideo);
// Set the column link
$link = $this->check_and_return($column, 'link');
/**
* Set Individual Column CSS
*/
$column_class = array();
$column_class[] = 'layers-masonry-column';
$column_class[] = $this->id_base . '-' . $column_key;
$column_class[] = $span_class;
$column_class[] = 'list-masonry' == $this->check_and_return($widget, 'design', 'liststyle') ? 'no-gutter' : '';
$column_class[] = 'column' . ('on' != $this->check_and_return($widget, 'design', 'gutter') ? '-flush' : '');
if ('' != $this->check_and_return($column, 'design', 'background', 'image') || '' != $this->check_and_return($column, 'design', 'background', 'color')) {
$column_class[] = 'content';
}
if (false != $media) {
$column_class[] = 'has-image';
}
$column_class = implode(' ', $column_class);
?>
<div id="<?php
echo $widget_id;
?>
-<?php
echo $column_key;
?>
" class="<?php
echo $column_class;
?>
">
<?php
/**
* Set Overlay CSS Classes
*/
$column_inner_class = array();
$column_inner_class[] = 'media';
if (!$this->check_and_return($widget, 'design', 'gutter')) {
$column_inner_class[] = 'no-push-bottom';
}
if ($this->check_and_return($column, 'design', 'background', 'color')) {
if ('dark' == layers_is_light_or_dark($this->check_and_return($column, 'design', 'background', 'color'))) {
$column_inner_class[] = 'invert';
}
} else {
if ($this->check_and_return($widget, 'design', 'background', 'color') && 'dark' == layers_is_light_or_dark($this->check_and_return($widget, 'design', 'background', 'color'))) {
$column_inner_class[] = 'invert';
}
}
$column_inner_class[] = $this->check_and_return($column, 'design', 'imagealign');
$column_inner_class[] = $this->check_and_return($column, 'design', 'fonts', 'size');
$column_inner_class = implode(' ', $column_inner_class);
?>
<div class="<?php
echo $column_inner_class;
?>
">
<?php
if (NULL != $media) {
?>
<div class="media-image <?php
echo isset($column['design']['imageratios']) && 'image-round' == $column['design']['imageratios'] ? 'image-rounded' : '';
?>
">
<?php
if (NULL != $link) {
?>
<a href="<?php
echo $link;
?>
"><?php
}
?>
<?php
echo $media;
?>
<?php
if (NULL != $link) {
?>
</a><?php
}
?>
</div>
<?php
}
?>
<?php
if ($this->check_and_return($column, 'title') || $this->check_and_return($column, 'excerpt') || $this->check_and_return($column, 'link_text')) {
?>
<div class="media-body <?php
echo isset($column['design']['fonts']['align']) ? $column['design']['fonts']['align'] : '';
?>
">
<?php
if ($this->check_and_return($column, 'title')) {
?>
<h5 class="heading">
<?php
if (NULL != $link && !(isset($column['link']) && $this->check_and_return($column, 'link_text'))) {
?>
<a href="<?php
echo $column['link'];
?>
"><?php
}
?>
<?php
echo $column['title'];
?>
<?php
if (NULL != $link && !(isset($column['link']) && $this->check_and_return($column, 'link_text'))) {
?>
</a><?php
}
?>
</h5>
<?php
}
?>
<?php
if ($this->check_and_return($column, 'excerpt')) {
?>
<div class="excerpt"><?php
layers_the_content($column['excerpt']);
?>
</div>
<?php
}
?>
<?php
if (isset($column['link']) && $this->check_and_return($column, 'link_text')) {
?>
<a href="<?php
echo $column['link'];
?>
" class="button btn-<?php
echo $this->check_and_return($column, 'design', 'fonts', 'size');
?>
"><?php
echo $column['link_text'];
?>
</a>
<?php
}
?>
</div>
<?php
}
?>
</div>
</div>
<?php
}
?>
</div>
<?php
}
?>
</section>
<?php
if ('list-masonry' == $this->check_and_return($widget, 'design', 'liststyle')) {
?>
<script>
jQuery(function($){
layers_masonry_settings[ '<?php
echo $widget_id;
?>
' ] = [{
itemSelector: '.layers-masonry-column',
layoutMode: 'masonry',
gutter: <?php
echo isset($widget['design']['gutter']) ? 20 : 0;
?>
}];
$('#<?php
echo $widget_id;
?>
').find('.list-masonry').layers_masonry( layers_masonry_settings[ '<?php
echo $widget_id;
?>
' ][0] );
});
</script>
<?php
}
// masonry trigger
?>
<?php
}
/**
* Widget front end display
*/
function widget($args, $instance)
{
global $wp_customize;
// Turn $args array into variables.
extract($args);
// $instance Defaults
$instance_defaults = $this->defaults;
// If we have information in this widget, then ignore the defaults
if (!empty($instance)) {
$instance_defaults = array();
}
// Parse $instance
$widget = wp_parse_args($instance, $instance_defaults);
// Enqueue Scipts when needed
$this->enqueue_scripts();
// Apply the advanced widget styling
$this->apply_widget_advanced_styling($widget_id, $widget);
// Apply slider arrow color
if ($this->check_and_return($widget, 'slider_arrow_color')) {
layers_inline_styles('#' . $widget_id, 'color', array('selectors' => array('.arrows a'), 'color' => $this->check_and_return($widget, 'slider_arrow_color')));
}
if ($this->check_and_return($widget, 'slider_arrow_color')) {
layers_inline_styles('#' . $widget_id, 'border', array('selectors' => array('span.swiper-pagination-switch'), 'border' => array('color' => $this->check_and_return($widget, 'slider_arrow_color'))));
}
if ($this->check_and_return($widget, 'slider_arrow_color')) {
layers_inline_styles('#' . $widget_id, 'background', array('selectors' => array('span.swiper-pagination-switch'), 'background' => array('color' => $this->check_and_return($widget, 'slider_arrow_color'))));
}
if ($this->check_and_return($widget, 'slider_arrow_color')) {
layers_inline_styles('#' . $widget_id, 'background', array('selectors' => array('span.swiper-pagination-switch.swiper-active-switch'), 'background' => array('color' => 'transparent !important')));
}
// Get slider height css
$slider_height_css = '';
if ('layout-full-screen' != $this->check_and_return($widget, 'design', 'layout') && FALSE == $this->check_and_return($widget, 'autoheight_slides') && $this->check_and_return($widget, 'slide_height')) {
$slider_height_css = 'height: ' . $widget['slide_height'] . 'px; ';
}
/**
* Generate the widget container class
*/
$widget_container_class = array();
$widget_container_class[] = 'widget';
$widget_container_class[] = 'row';
$widget_container_class[] = 'slide';
$widget_container_class[] = 'swiper-container';
$widget_container_class[] = $this->get_widget_layout_class($widget);
$widget_container_class[] = $this->check_and_return($widget, 'design', 'advanced', 'customclass');
$widget_container_class[] = $this->get_widget_spacing_class($widget);
if (isset($widget['design']['layout']) && '' != $widget['design']['layout']) {
// Slider layout eg 'slider-layout-full-screen'
$widget_container_class[] = 'slider-' . $widget['design']['layout'];
}
if (!isset($widget['design']['layout']) || isset($widget['design']['layout']) && 'layout-full-screen' != $widget['design']['layout']) {
// If slider is not full screen
$widget_container_class[] = 'not-full-screen';
}
if (1 == count($widget['slides'])) {
// If only one slide
$widget_container_class[] = 'single-slide';
}
$widget_container_class = implode(' ', apply_filters('layers_slider_widget_container_class', $widget_container_class));
/**
* Slider HTML
*/
?>
<section class="<?php
echo $widget_container_class;
?>
" id="<?php
echo $widget_id;
?>
" style="<?php
echo esc_attr($slider_height_css);
?>
" >
<?php
if (!empty($widget['slides'])) {
?>
<?php
if (1 < count($widget['slides']) && isset($widget['show_slider_arrows'])) {
?>
<div class="arrows">
<a href="" class="l-left-arrow animate"></a>
<a href="" class="l-right-arrow animate"></a>
</div>
<?php
}
?>
<div class="<?php
echo $this->get_field_id('pages');
?>
pages animate">
<?php
for ($i = 0; $i < count($widget['slides']); $i++) {
?>
<a href="" class="page animate <?php
if (0 == $i) {
echo 'active';
}
?>
"></a>
<?php
}
?>
</div>
<div class="swiper-wrapper">
<?php
foreach (wp_parse_id_list($widget['slide_ids']) as $slide_key) {
// Make sure we've got a column going on here
if (!isset($widget['slides'][$slide_key])) {
continue;
}
// Setup the relevant slide
$slide = $widget['slides'][$slide_key];
// Set the background styling
if (!empty($slide['design']['background'])) {
layers_inline_styles('#' . $widget_id . '-' . $slide_key, 'background', array('background' => $slide['design']['background']));
}
if (!empty($slide['design']['fonts']['color'])) {
layers_inline_styles('#' . $widget_id . '-' . $slide_key, 'color', array('selectors' => array('h3.heading', 'h3.heading a', 'div.excerpt'), 'color' => $slide['design']['fonts']['color']));
}
if (!empty($slide['design']['fonts']['shadow'])) {
layers_inline_styles('#' . $widget_id . '-' . $slide_key, 'text-shadow', array('selectors' => array('h3.heading', 'h3.heading a', 'div.excerpt'), 'text-shadow' => $slide['design']['fonts']['shadow']));
}
// Set Featured Media
$featureimage = $this->check_and_return($slide, 'design', 'featuredimage');
$featurevideo = $this->check_and_return($slide, 'design', 'featuredvideo');
// Set Image Sizes
if (isset($slide['design']['imageratios'])) {
// Translate Image Ratio into something usable
$image_ratio = layers_translate_image_ratios($slide['design']['imageratios']);
$use_image_ratio = $image_ratio . '-medium';
} else {
$use_image_ratio = 'large';
}
/**
* Set Individual Slide CSS
*/
$slide_class = array();
$slide_class[] = 'swiper-slide';
if ($this->check_and_return($slide, 'design', 'background', 'color')) {
if ('dark' == layers_is_light_or_dark($this->check_and_return($slide, 'design', 'background', 'color'))) {
$slide_class[] = 'invert';
}
} else {
$slide_class[] = 'invert';
}
if (false != $this->check_and_return($slide, 'image') || 'image-left' == $slide['design']['imagealign'] || 'image-top' == $slide['design']['imagealign']) {
$slide_class[] = 'has-image';
}
if (isset($slide['design']['imagealign']) && '' != $slide['design']['imagealign']) {
$slide_class[] = $slide['design']['imagealign'];
}
if (isset($slide['design']['fonts']['align']) && '' != $slide['design']['fonts']['align']) {
$slide_class[] = $slide['design']['fonts']['align'];
}
$slide_class = implode(' ', $slide_class);
// Set link entire slide or not
$slide_wrapper_tag = 'div';
$slide_wrapper_href = '';
if ($this->check_and_return($slide, 'link') && !$this->check_and_return($slide, 'link_text')) {
$slide_wrapper_tag = 'a';
$slide_wrapper_href = 'href="' . esc_url($slide['link']) . '"';
}
?>
<<?php
echo $slide_wrapper_tag;
?>
<?php
echo $slide_wrapper_href;
?>
class="<?php
echo $slide_class;
?>
" id="<?php
echo $widget_id;
?>
-<?php
echo $slide_key;
?>
" style="float: left; <?php
echo $slider_height_css;
?>
">
<?php
/**
* Set Overlay CSS Classes
*/
$overlay_class = array();
$overlay_class[] = 'overlay';
if (isset($slide['design']['background']['darken'])) {
$overlay_class[] = 'darken';
}
if ('' != $this->check_and_return($slide, 'design', 'background', 'image') || '' != $this->check_and_return($slide, 'design', 'background', 'color')) {
$overlay_class[] = 'content';
}
$overlay_classes = implode(' ', $overlay_class);
?>
<div class="<?php
echo $overlay_classes;
?>
" >
<div class="container clearfix">
<?php
if ('' != $slide['title'] || '' != $slide['excerpt'] || '' != $slide['link']) {
?>
<div class="copy-container">
<div class="section-title <?php
echo isset($slide['design']['fonts']['size']) ? $slide['design']['fonts']['size'] : '';
?>
">
<?php
if ($this->check_and_return($slide, 'title')) {
?>
<h3 class="heading"><?php
echo $slide['title'];
?>
</h3>
<?php
}
?>
<?php
if ($this->check_and_return($slide, 'excerpt')) {
?>
<div class="excerpt"><?php
layers_the_content($slide['excerpt']);
?>
</div>
<?php
}
?>
<?php
if ('div' == $slide_wrapper_tag && $this->check_and_return($slide, 'link') && $this->check_and_return($slide, 'link_text')) {
?>
<a href="<?php
echo $slide['link'];
?>
" class="button btn-<?php
echo $this->check_and_return($slide, 'design', 'fonts', 'size');
?>
"><?php
echo $slide['link_text'];
?>
</a>
<?php
}
?>
</div>
</div>
<?php
}
// if title || excerpt
?>
<?php
if ($featureimage || $featurevideo) {
?>
<div class="image-container <?php
echo 'image-round' == $this->check_and_return($slide, 'design', 'imageratios') ? 'image-rounded' : '';
?>
">
<?php
echo layers_get_feature_media($featureimage, $use_image_ratio, $featurevideo);
?>
</div>
<?php
}
// if $slide image
?>
</div> <!-- .container -->
</div> <!-- .overlay -->
</<?php
echo $slide_wrapper_tag;
?>
>
<?php
}
// foreach slides
?>
</div>
<?php
}
// if !empty( $widget->slides )
?>
</section>
<?php
/**
* Slider javascript initialize
*/
if (1 < count($widget['slides'])) {
?>
<?php
$swiper_js_obj = str_replace('-', '_', $this->get_field_id('slider'));
?>
<script>
jQuery(function($){
var <?php
echo $swiper_js_obj;
?>
= $('#<?php
echo $widget_id;
?>
').swiper({
mode:'horizontal',
<?php
if ('' == $slider_height_css) {
?>
calculateHeight: true,
<?php
}
?>
<?php
if (isset($widget['show_slider_dots']) && (!empty($widget['slides']) && 1 < count($widget['slides']))) {
?>
pagination: '.<?php
echo $this->get_field_id('pages');
?>
',
<?php
}
?>
paginationClickable: true,
watchActiveIndex: true
<?php
if (1 < count($widget['slides'])) {
?>
,loop: true
<?php
}
?>
<?php
if (isset($widget['autoplay_slides']) && isset($widget['slide_time']) && is_numeric($widget['slide_time'])) {
?>
, autoplay: <?php
echo $widget['slide_time'] * 1000;
?>
<?php
}
?>
<?php
if (isset($wp_customize) && $this->check_and_return($widget, 'focus_slide')) {
?>
,initialSlide: <?php
echo $this->check_and_return($widget, 'focus_slide');
?>
<?php
}
?>
});
<?php
if (1 < count($widget['slides'])) {
?>
// Allow keyboard control
<?php
echo $swiper_js_obj;
?>
.enableKeyboardControl();
<?php
}
// if > 1 slide
?>
$('#<?php
echo $widget_id;
?>
').find('.arrows a').on( 'click' , function(e){
e.preventDefault();
// "Hi Mom"
$that = $(this);
if( $that.hasClass( 'swiper-pagination-switch' ) ){ // Anchors
<?php
echo $swiper_js_obj;
?>
.swipeTo( $that.index() );
} else if( $that.hasClass( 'l-left-arrow' ) ){ // Previous
<?php
echo $swiper_js_obj;
?>
.swipePrev();
} else if( $that.hasClass( 'l-right-arrow' ) ){ // Next
<?php
echo $swiper_js_obj;
?>
.swipeNext();
}
return false;
});
<?php
echo $swiper_js_obj;
?>
.init();
})
</script>
<?php
}
?>
<?php
}
/**
* Widget front end display
*/
function widget($args, $instance)
{
global $wp_customize;
$this->backup_inline_css();
// Turn $args array into variables.
extract($args);
// Use defaults if $instance is empty.
if (empty($instance) && !empty($this->defaults)) {
$instance = wp_parse_args($instance, $this->defaults);
}
// Mix in new/unset defaults on every instance load (NEW)
$instance = $this->apply_defaults($instance);
// Check if we have a map present
if (isset($instance['show_google_map']) && ('' != $instance['google_maps_location'] || '' != $instance['google_maps_long_lat'])) {
$hasmap = true;
}
// Set the background styling
if (!empty($instance['design']['background'])) {
$this->inline_css .= layers_inline_styles('#' . $widget_id, 'background', array('background' => $instance['design']['background']));
}
if (!empty($instance['design']['fonts']['color'])) {
$this->inline_css .= layers_inline_styles('#' . $widget_id, 'color', array('selectors' => array('.section-title .heading', '.section-title div.excerpt', '.section-title small', '.form.content', 'form p', 'form label'), 'color' => $instance['design']['fonts']['color']));
}
// Set the map & form widths
if (isset($hasmap)) {
$form_class = 'span-6';
} else {
$form_class = 'span-12';
}
$mapwidth = 'span-12';
// Set Display Variables
$show_address_or_contactform = '' != $instance['address_shown'] && isset($instance['show_address']) || $this->check_and_return($instance, 'contact_form') && $this->check_and_return($instance, 'show_contact_form') ? TRUE : FALSE;
$show_title_or_excerpt = '' != $instance['title'] || '' != $instance['excerpt'] ? TRUE : FALSE;
// Apply the advanced widget styling
$this->apply_widget_advanced_styling($widget_id, $instance);
/**
* Generate the widget container class
*/
$widget_container_class = array();
$widget_container_class[] = 'widget';
$widget_container_class[] = 'layers-contact-widget';
$widget_container_class[] = 'clearfix';
$widget_container_class[] = 'content-vertical-massive';
$widget_container_class[] = 'layers-contact-widget';
$widget_container_class[] = 'on' == $this->check_and_return($instance, 'design', 'background', 'darken') ? 'darken' : '';
$widget_container_class[] = $this->check_and_return($instance, 'design', 'advanced', 'customclass');
// Apply custom class from design-bar's advanced control.
$widget_container_class[] = $this->get_widget_spacing_class($instance);
if (!$show_title_or_excerpt && !$show_address_or_contactform) {
$widget_container_class[] = 'no-inset-top no-inset-bottom';
}
$widget_container_class = apply_filters('layers_contact_widget_container_class', $widget_container_class, $this, $instance);
$widget_container_class = implode(' ', $widget_container_class);
// Custom Anchor
echo $this->custom_anchor($instance);
?>
<div id="<?php
echo esc_attr($widget_id);
?>
" class="<?php
echo esc_attr($widget_container_class);
?>
" <?php
$this->selective_refresh_atts($args);
?>
>
<?php
do_action('layers_before_contact_widget_inner', $this, $instance);
?>
<?php
if ($show_title_or_excerpt) {
?>
<div class="container clearfix">
<?php
/**f
* Generate the Section Title Classes
*/
$section_title_class = array();
$section_title_class[] = 'section-title clearfix';
$section_title_class[] = $this->check_and_return($instance, 'design', 'fonts', 'size');
$section_title_class[] = $this->check_and_return($instance, 'design', 'fonts', 'align');
$section_title_class[] = $this->check_and_return($instance, 'design', 'background', 'color') && 'dark' == layers_is_light_or_dark($this->check_and_return($instance, 'design', 'background', 'color')) ? 'invert' : '';
$section_title_class = implode(' ', $section_title_class);
?>
<div class="<?php
echo $section_title_class;
?>
">
<?php
if ('' != $this->check_and_return($instance, 'title')) {
?>
<<?php
echo $this->check_and_return($instance, 'design', 'fonts', 'heading-type');
?>
class="heading">
<?php
echo $instance['title'];
?>
</<?php
echo $this->check_and_return($instance, 'design', 'fonts', 'heading-type');
?>
>
<?php
}
?>
<?php
if ('' != $this->check_and_return($instance, 'excerpt')) {
?>
<div class="excerpt"><?php
echo layers_the_content($instance['excerpt']);
?>
</div>
<?php
}
?>
</div>
</div>
<?php
}
// if title || excerpt
?>
<?php
/**
* Generate the Widget Body Class
*/
$widget_body_class = array();
$widget_body_class[] = 'row';
$widget_body_class[] = $this->get_widget_layout_class($instance);
$widget_body_class[] = $this->check_and_return($instance, 'design', 'background', 'color') && 'dark' == layers_is_light_or_dark($this->check_and_return($instance, 'design', 'background', 'color')) ? 'invert' : '';
$widget_body_class = implode(' ', $widget_body_class);
?>
<div class="<?php
echo $widget_body_class;
?>
">
<?php
if ($show_address_or_contactform) {
?>
<div class="column <?php
echo $form_class;
?>
form content">
<?php
if ($this->check_and_return($instance, 'show_address')) {
?>
<address class="copy">
<p><?php
echo $instance['address_shown'];
?>
</p>
</address>
<?php
}
?>
<?php
if ($this->check_and_return($instance, 'contact_form')) {
?>
<?php
echo do_shortcode($instance['contact_form']);
?>
<?php
}
?>
</div>
<?php
$mapwidth = 'span-6';
?>
<?php
}
// if show_contact_form || address_shown
?>
<?php
if (isset($hasmap)) {
?>
<div class="column no-push-bottom <?php
echo esc_attr($mapwidth);
?>
">
<?php
if (isset($wp_customize)) {
?>
<?php
if ($this->check_and_return($instance, 'google_maps_location')) {
$map_center = $instance['google_maps_location'];
} else {
if ($this->check_and_return($instance, 'google_maps_long_lat')) {
$map_center = $instance['google_maps_long_lat'];
}
}
?>
<div class="layers-map" style="height: <?php
echo esc_attr($instance['map_height']);
?>
px; overflow: hidden;">
<img src="https://maps.googleapis.com/maps/api/staticmap?center=<?php
echo esc_attr($map_center);
?>
&zoom=<?php
echo isset($instance['google_maps_zoom']) ? $instance['google_maps_zoom'] : 14;
?>
&size=1960x<?php
echo isset($instance['map_height']) && '' != $instance['map_height'] ? $instance['map_height'] : 400;
?>
&scale=2&markers=color:red|<?php
echo esc_attr($map_center);
?>
" class="google-map-img" />
</div>
<?php
} else {
?>
<div class="layers-map" style="height: <?php
echo esc_attr($instance['map_height']);
?>
px;" data-zoom-level="<?php
echo isset($instance['google_maps_zoom']) ? $instance['google_maps_zoom'] : 14;
?>
" <?php
if ('' != $instance['google_maps_location']) {
?>
data-location="<?php
echo $instance['google_maps_location'];
?>
"<?php
}
?>
<?php
if ('' != $instance['google_maps_long_lat']) {
?>
data-longlat="<?php
echo $instance['google_maps_long_lat'];
?>
"<?php
}
?>
></div>
<?php
}
?>
</div>
<?php
}
?>
</div>
<?php
do_action('layers_after_contact_widget_inner', $this, $instance);
// Print the Inline Styles for this Widget
$this->print_inline_css();
?>
</div>
<?php
if (!isset($wp_customize)) {
wp_enqueue_script(LAYERS_THEME_SLUG . "-map-api");
wp_enqueue_script(LAYERS_THEME_SLUG . "-map-trigger");
}
// Enqueue the map js
}
/**
* Widget front end display
*/
function widget($args, $instance)
{
global $wp_customize;
$this->backup_inline_css();
// Turn $args array into variables.
extract($args);
// Use defaults if $instance is empty.
if (empty($instance) && !empty($this->defaults)) {
$instance = wp_parse_args($instance, $this->defaults);
}
// Mix in new/unset defaults on every instance load (NEW)
$instance = $this->apply_defaults($instance);
// Enqueue Scipts when needed
$this->enqueue_scripts();
// Apply slider arrow color
if ($this->check_and_return($instance, 'slider_arrow_color')) {
$this->inline_css .= layers_inline_styles('#' . $widget_id, 'color', array('selectors' => array('.arrows a'), 'color' => $this->check_and_return($instance, 'slider_arrow_color')));
}
if ($this->check_and_return($instance, 'slider_arrow_color')) {
$this->inline_css .= layers_inline_styles('#' . $widget_id, 'border', array('selectors' => array('span.swiper-pagination-switch'), 'border' => array('color' => $this->check_and_return($instance, 'slider_arrow_color'))));
}
if ($this->check_and_return($instance, 'slider_arrow_color')) {
$this->inline_css .= layers_inline_styles('#' . $widget_id, 'background', array('selectors' => array('span.swiper-pagination-switch'), 'background' => array('color' => $this->check_and_return($instance, 'slider_arrow_color'))));
}
if ($this->check_and_return($instance, 'slider_arrow_color')) {
$this->inline_css .= layers_inline_styles('#' . $widget_id, 'background', array('selectors' => array('span.swiper-pagination-switch.swiper-active-switch'), 'background' => array('color' => 'transparent !important')));
}
// Get slider height css
$slider_height_css = '';
if ('layout-full-screen' != $this->check_and_return($instance, 'design', 'layout') && FALSE == $this->check_and_return($instance, 'autoheight_slides') && $this->check_and_return($instance, 'slide_height')) {
$slider_height_css = 'height: ' . $instance['slide_height'] . 'px; ';
}
// Apply the advanced widget styling
$this->apply_widget_advanced_styling($widget_id, $instance);
/**
* Generate the widget container class
*/
$widget_container_class = array();
$widget_container_class[] = 'widget';
$widget_container_class[] = 'layers-slider-widget';
$widget_container_class[] = 'row';
$widget_container_class[] = 'slide';
$widget_container_class[] = 'swiper-container';
$widget_container_class[] = 'loading';
// `loading` will be changed to `loaded` to fade in the slider.
$widget_container_class[] = $this->check_and_return($instance, 'design', 'advanced', 'customclass');
// Apply custom class from design-bar's advanced control.
$widget_container_class[] = $this->get_widget_spacing_class($instance);
$widget_container_class[] = $this->get_widget_layout_class($instance);
if ($this->check_and_return($instance, 'autoheight_slides')) {
if (FALSE !== ($fullwidth = array_search('full-screen', $widget_container_class))) {
unset($widget_container_class[$fullwidth]);
}
$widget_container_class[] = 'auto-height';
}
if ($this->check_and_return($instance, 'design', 'layout')) {
// Slider layout eg 'slider-layout-full-screen'
$widget_container_class[] = 'slider-' . $instance['design']['layout'];
}
if (!isset($instance['design']['layout']) || isset($instance['design']['layout']) && 'layout-full-screen' != $instance['design']['layout']) {
// If slider is not full screen
$widget_container_class[] = 'not-full-screen';
}
if (1 == count($instance['slides'])) {
// If only one slide
$widget_container_class[] = 'single-slide';
}
$widget_container_class = apply_filters('layers_slider_widget_container_class', $widget_container_class, $this, $instance);
$widget_container_class = implode(' ', $widget_container_class);
/**
* Slider HTML
*/
if (!empty($instance['slides'])) {
?>
<?php
// Custom Anchor
echo $this->custom_anchor($instance);
?>
<div id="<?php
echo esc_attr($widget_id);
?>
" class="<?php
echo esc_attr($widget_container_class);
?>
" style="<?php
echo esc_attr($slider_height_css);
?>
" <?php
$this->selective_refresh_atts($args);
?>
>
<?php
do_action('layers_before_slider_widget_inner', $this, $instance);
?>
<?php
if (1 < count($instance['slides']) && isset($instance['show_slider_arrows'])) {
?>
<div class="arrows">
<a href="" class="l-left-arrow animate"></a>
<a href="" class="l-right-arrow animate"></a>
</div>
<?php
}
?>
<div class="<?php
echo $this->get_layers_field_id('pages');
?>
pages animate">
<?php
for ($i = 0; $i < count($instance['slides']); $i++) {
?>
<a href="" class="page animate <?php
if (0 == $i) {
echo 'active';
}
?>
"></a>
<?php
}
?>
</div>
<div class="swiper-wrapper">
<?php
foreach (wp_parse_id_list($instance['slide_ids']) as $slide_key) {
// Make sure we've got a column going on here
if (!isset($instance['slides'][$slide_key])) {
continue;
}
// Setup the relevant slide
$item_instance = $instance['slides'][$slide_key];
// Mix in new/unset defaults on every instance load (NEW)
$item_instance = $this->apply_defaults($item_instance, 'slide');
// Set the background styling
if (!empty($item_instance['design']['background'])) {
$this->inline_css .= layers_inline_styles('#' . $widget_id . '-' . $slide_key, 'background', array('background' => $item_instance['design']['background']));
}
if (!empty($item_instance['design']['fonts']['color'])) {
$this->inline_css .= layers_inline_styles('#' . $widget_id . '-' . $slide_key, 'color', array('selectors' => array('.heading', '.heading a', 'div.excerpt'), 'color' => $item_instance['design']['fonts']['color']));
}
if (!empty($item_instance['design']['fonts']['shadow'])) {
$this->inline_css .= layers_inline_styles('#' . $widget_id . '-' . $slide_key, 'text-shadow', array('selectors' => array('.heading', '.heading a', 'div.excerpt'), 'text-shadow' => $item_instance['design']['fonts']['shadow']));
}
// Set the button styling
$button_size = '';
if (function_exists('layers_pro_apply_widget_button_styling')) {
$button_size = $this->check_and_return($item_instance, 'design', 'buttons-size') ? 'btn-' . $this->check_and_return($item_instance, 'design', 'buttons-size') : '';
$this->inline_css .= layers_pro_apply_widget_button_styling($this, $item_instance, array("#{$widget_id}-{$slide_key} .button"));
}
// Set Featured Media
$featureimage = $this->check_and_return($item_instance, 'design', 'featuredimage');
$featurevideo = $this->check_and_return($item_instance, 'design', 'featuredvideo');
// Set Image Sizes
if (isset($item_instance['design']['imageratios'])) {
// Translate Image Ratio into something usable
$image_ratio = layers_translate_image_ratios($item_instance['design']['imageratios']);
$use_image_ratio = $image_ratio . '-medium';
} else {
$use_image_ratio = 'large';
}
// Get the button array.
$link_array = $this->check_and_return_link($item_instance, 'button');
$link_href_attr = $link_array['link'] ? 'href="' . esc_url($link_array['link']) . '"' : '';
$link_target_attr = '_blank' == $link_array['target'] ? 'target="_blank"' : '';
/**
* Set Individual Slide CSS
*/
$slide_class = array();
$slide_class[] = 'swiper-slide';
if ($this->check_and_return($item_instance, 'design', 'background', 'color')) {
if ('dark' == layers_is_light_or_dark($this->check_and_return($item_instance, 'design', 'background', 'color'))) {
$slide_class[] = 'invert';
}
} else {
$slide_class[] = 'invert';
}
if (false != $this->check_and_return($item_instance, 'image') || 'image-left' == $item_instance['design']['imagealign'] || 'image-top' == $item_instance['design']['imagealign']) {
$slide_class[] = 'has-image';
}
if (isset($item_instance['design']['imagealign']) && '' != $item_instance['design']['imagealign']) {
$slide_class[] = $item_instance['design']['imagealign'];
}
if (isset($item_instance['design']['fonts']['align']) && '' != $item_instance['design']['fonts']['align']) {
$slide_class[] = $item_instance['design']['fonts']['align'];
}
$slide_class[] = $this->check_and_return($item_instance, 'design', 'advanced', 'customclass');
// Apply custom class from design-bar's advanced control.
$slide_class = apply_filters('layers_slider_widget_item_class', $slide_class, $this, $item_instance, $instance);
$slide_class = implode(' ', $slide_class);
// Set link entire slide or not
$slide_wrapper_tag = 'div';
$slide_wrapper_href = '';
if ($link_array['link'] && !$link_array['text']) {
$slide_wrapper_tag = 'a';
$slide_wrapper_href = $link_href_attr;
}
?>
<<?php
echo $slide_wrapper_tag;
?>
<?php
echo $slide_wrapper_href;
?>
class="<?php
echo $slide_class;
?>
" id="<?php
echo $widget_id;
?>
-<?php
echo $slide_key;
?>
" style="float: left; <?php
echo $slider_height_css;
?>
" <?php
echo $link_target_attr;
?>
>
<?php
do_action('layers_before_slider_widget_item_inner', $this, $item_instance, $instance);
?>
<?php
/**
* Set Overlay CSS Classes
*/
$overlay_class = array();
$overlay_class[] = 'overlay';
if (isset($item_instance['design']['background']['darken'])) {
$overlay_class[] = 'darken';
}
if ('' != $this->check_and_return($item_instance, 'design', 'background', 'image') || '' != $this->check_and_return($item_instance, 'design', 'background', 'color')) {
$overlay_class[] = 'content';
}
$overlay_classes = implode(' ', $overlay_class);
?>
<div class="<?php
echo $overlay_classes;
?>
" >
<div class="container clearfix">
<?php
if ('' != $item_instance['title'] || '' != $item_instance['excerpt'] || '' != $link_array['link']) {
?>
<div class="copy-container">
<div class="section-title <?php
echo isset($item_instance['design']['fonts']['size']) ? $item_instance['design']['fonts']['size'] : '';
?>
">
<?php
if ($this->check_and_return($item_instance, 'title')) {
?>
<<?php
echo $this->check_and_return($item_instance, 'design', 'fonts', 'heading-type');
?>
data-swiper-parallax="-100" class="heading">
<?php
echo $item_instance['title'];
?>
</<?php
echo $this->check_and_return($item_instance, 'design', 'fonts', 'heading-type');
?>
>
<?php
}
?>
<?php
if ($this->check_and_return($item_instance, 'excerpt')) {
?>
<div data-swiper-parallax="-300" class="excerpt"><?php
layers_the_content($item_instance['excerpt']);
?>
</div>
<?php
}
?>
<?php
if ('div' == $slide_wrapper_tag && $link_array['link'] && $link_array['text']) {
?>
<a data-swiper-parallax="-200" <?php
echo $link_href_attr;
?>
<?php
echo $link_target_attr;
?>
class="button <?php
echo $button_size;
?>
">
<?php
echo $link_array['text'];
?>
</a>
<?php
}
?>
</div>
</div>
<?php
}
// if title || excerpt
?>
<?php
if ($featureimage || $featurevideo) {
?>
<div class="image-container <?php
echo 'image-round' == $this->check_and_return($item_instance, 'design', 'imageratios') ? 'image-rounded' : '';
?>
">
<?php
echo layers_get_feature_media($featureimage, $use_image_ratio, $featurevideo);
?>
</div>
<?php
}
// if $item image
?>
</div> <!-- .container -->
</div> <!-- .overlay -->
<?php
do_action('layers_after_slider_widget_item_inner', $this, $item_instance, $instance);
?>
</<?php
echo $slide_wrapper_tag;
?>
>
<?php
}
// foreach slides
?>
</div>
<?php
do_action('layers_after_slider_widget_inner', $this, $instance);
// Print the Inline Styles for this Widget
$this->print_inline_css();
/**
* Slider javascript initialize
*/
$swiper_js_obj = str_replace('-', '_', $this->get_layers_field_id('slider'));
?>
<script type='text/javascript'>
jQuery(function($){
var <?php
echo $swiper_js_obj;
?>
= $('#<?php
echo $widget_id;
?>
').swiper({
mode:'horizontal'
,onInit: function(s){
$(document).trigger( 'layers-slider-init', s);
}
,bulletClass: 'swiper-pagination-switch'
,bulletActiveClass: 'swiper-active-switch swiper-visible-switch'
,paginationClickable: true
,watchActiveIndex: true
<?php
if ('fade' == $this->check_and_return($instance, 'animation_type')) {
?>
,effect: '<?php
echo $instance['animation_type'];
?>
'
<?php
} else {
if ('parallax' == $this->check_and_return($instance, 'animation_type')) {
?>
,speed: 700
,parallax: true
<?php
}
}
?>
<?php
if (isset($instance['show_slider_dots']) && (!empty($instance['slides']) && 1 < count($instance['slides']))) {
?>
,pagination: '.<?php
echo $this->get_layers_field_id('pages');
?>
'
<?php
}
?>
<?php
if (1 < count($instance['slides'])) {
?>
,loop: true
<?php
} else {
?>
,loop: false
,noSwiping: true
,allowSwipeToPrev: false
,allowSwipeToNext: false
<?php
}
?>
<?php
if (isset($instance['autoplay_slides']) && isset($instance['slide_time']) && is_numeric($instance['slide_time'])) {
?>
, autoplay: <?php
echo $instance['slide_time'] * 1000;
?>
<?php
}
?>
<?php
if (isset($wp_customize) && $this->check_and_return($instance, 'focus_slide')) {
?>
,initialSlide: <?php
echo $this->check_and_return($instance, 'focus_slide');
?>
<?php
}
?>
});
<?php
if (1 < count($instance['slides'])) {
?>
// Allow keyboard control
<?php
echo $swiper_js_obj;
?>
.enableKeyboardControl();
<?php
}
// if > 1 slide
?>
<?php
if (TRUE == $this->check_and_return($instance, 'autoheight_slides')) {
?>
$( '#<?php
echo esc_attr($widget_id);
?>
' ).imagesLoaded(function(){
layers_swiper_resize( <?php
echo $swiper_js_obj;
?>
);
});
$(window).resize(function(){
layers_swiper_resize( <?php
echo $swiper_js_obj;
?>
);
});
<?php
}
?>
$('#<?php
echo $widget_id;
?>
').find('.arrows a').on( 'click' , function(e){
e.preventDefault();
// "Hi Mom"
$that = $(this);
if( $that.hasClass( 'swiper-pagination-switch' ) ){
// Anchors
<?php
echo $swiper_js_obj;
?>
.slideTo( $that.index() );
} else if( $that.hasClass( 'l-left-arrow' ) ){
// Previous
<?php
echo $swiper_js_obj;
?>
.slidePrev();
} else if( $that.hasClass( 'l-right-arrow' ) ){
// Next
<?php
echo $swiper_js_obj;
?>
.slideNext();
}
return false;
});
<?php
echo $swiper_js_obj;
?>
.init();
// Do stuff if this is the first widget.
if ( ! $('#<?php
echo $widget_id;
?>
').prev('.widget').length ) {
if ( ! $('#<?php
echo $widget_id;
?>
').hasClass( '.full-screen' ) ) {
jQuery('.header-site.header-overlay').css( 'transition', '0s' );
setTimeout( function(){ jQuery('.header-site.header-overlay').css( 'transition', '' ); }, 1000 );
jQuery('body').addClass( 'header-overlay-no-push' );
}
}
// Fade-in slider after it's been initilaized (FOUC).
$( '#<?php
echo $widget_id;
?>
' ).removeClass('loading').addClass('loaded');
});
</script>
</div>
<?php
}
}
/**
* Widget front end display
*/
function widget($args, $instance)
{
global $wp_customize;
$this->backup_inline_css();
// Turn $args array into variables.
extract($args);
// Use defaults if $instance is empty.
if (empty($instance) && !empty($this->defaults)) {
$instance = wp_parse_args($instance, $this->defaults);
}
// Mix in new/unset defaults on every instance load (NEW)
$instance = $this->apply_defaults($instance);
// Enqueue Masonry if need be
if ('list-masonry' == $this->check_and_return($instance, 'design', 'liststyle')) {
wp_enqueue_script(LAYERS_THEME_SLUG . '-layers-masonry-js');
}
// Set the background styling
if (!empty($instance['design']['background'])) {
$this->inline_css .= layers_inline_styles('#' . $widget_id, 'background', array('background' => $instance['design']['background']));
}
if (!empty($instance['design']['fonts']['color'])) {
$this->inline_css .= layers_inline_styles('#' . $widget_id, 'color', array('selectors' => array('.section-title .heading', '.section-title div.excerpt'), 'color' => $instance['design']['fonts']['color']));
}
// Apply the advanced widget styling
$this->apply_widget_advanced_styling($widget_id, $instance);
/**
* Generate the widget container class
*/
$widget_container_class = array();
$widget_container_class[] = 'widget';
$widget_container_class[] = 'layers-content-widget';
$widget_container_class[] = 'content-vertical-massive';
$widget_container_class[] = 'on' == $this->check_and_return($instance, 'design', 'background', 'darken') ? 'darken' : '';
$widget_container_class[] = $this->check_and_return($instance, 'design', 'advanced', 'customclass');
// Apply custom class from design-bar's advanced control.
$widget_container_class[] = $this->get_widget_spacing_class($instance);
$widget_container_class = apply_filters('layers_content_widget_container_class', $widget_container_class, $this, $instance);
$widget_container_class = implode(' ', $widget_container_class);
// Custom Anchor
echo $this->custom_anchor($instance);
?>
<div id="<?php
echo esc_attr($widget_id);
?>
" class="<?php
echo esc_attr($widget_container_class);
?>
" <?php
$this->selective_refresh_atts($args);
?>
>
<?php
do_action('layers_before_content_widget_inner', $this, $instance);
?>
<?php
if (NULL !== $this->check_and_return($instance, 'title') || NULL !== $this->check_and_return($instance, 'excerpt')) {
?>
<div class="container clearfix">
<?php
/**
* Generate the Section Title Classes
*/
$section_title_class = array();
$section_title_class[] = 'section-title clearfix';
$section_title_class[] = $this->check_and_return($instance, 'design', 'fonts', 'size');
$section_title_class[] = $this->check_and_return($instance, 'design', 'fonts', 'align');
$section_title_class[] = $this->check_and_return($instance, 'design', 'background', 'color') && 'dark' == layers_is_light_or_dark($this->check_and_return($instance, 'design', 'background', 'color')) ? 'invert' : '';
$section_title_class = implode(' ', $section_title_class);
?>
<div class="<?php
echo $section_title_class;
?>
">
<?php
if ('' != $this->check_and_return($instance, 'title')) {
?>
<<?php
echo $this->check_and_return($instance, 'design', 'fonts', 'heading-type');
?>
class="heading">
<?php
echo $instance['title'];
?>
</<?php
echo $this->check_and_return($instance, 'design', 'fonts', 'heading-type');
?>
>
<?php
}
?>
<?php
if ('' != $this->check_and_return($instance, 'excerpt')) {
?>
<div class="excerpt"><?php
echo layers_the_content($instance['excerpt']);
?>
</div>
<?php
}
?>
</div>
</div>
<?php
}
?>
<?php
if (!empty($instance['columns'])) {
$column_ids = explode(',', $instance['column_ids']);
// Set total width
$col_no = 0;
$first_last_class = '';
$row_width = 0;
?>
<div class="<?php
echo $this->get_widget_layout_class($instance);
?>
<?php
echo $this->check_and_return($instance, 'design', 'liststyle');
?>
">
<div class="grid">
<?php
foreach ($column_ids as $column_key) {
// Make sure we've got a column going on here
if (!isset($instance['columns'][$column_key])) {
continue;
}
// Setup Internal Vars.
$item_instance = $instance['columns'][$column_key];
$item_id_attr = "{$widget_id}-tabs-{$column_key}";
// Mix in new/unset defaults on every instance load (NEW)
$item_instance = $this->apply_defaults($item_instance, 'column');
// Get the Next Column for use later.
if (isset($column_ids[$col_no + 1]) && isset($instance['columns'][$column_ids[$col_no + 1]])) {
$next_item = $instance['columns'][$column_ids[$col_no + 1]];
}
// Set the background styling
if (!empty($item_instance['design']['background'])) {
$this->inline_css .= layers_inline_styles('#' . $widget_id . '-' . $column_key, 'background', array('background' => $item_instance['design']['background']));
}
if (!empty($item_instance['design']['fonts']['color'])) {
$this->inline_css .= layers_inline_styles('#' . $widget_id . '-' . $column_key, 'color', array('selectors' => array('.heading a', '.heading', 'div.excerpt', 'div.excerpt p'), 'color' => $item_instance['design']['fonts']['color']));
}
if (!empty($item_instance['design']['fonts']['shadow'])) {
$this->inline_css .= layers_inline_styles('#' . $widget_id . '-' . $column_key, 'text-shadow', array('selectors' => array('.heading a', '.heading', 'div.excerpt', 'div.excerpt p'), 'text-shadow' => $item_instance['design']['fonts']['shadow']));
}
// Set column margin & padding
if (!empty($item_instance['design']['advanced']['margin'])) {
$this->inline_css .= layers_inline_styles("#{$widget_id}-{$column_key}", 'margin', array('margin' => $item_instance['design']['advanced']['margin']));
}
if (!empty($item_instance['design']['advanced']['padding'])) {
$this->inline_css .= layers_inline_styles("#{$widget_id}-{$column_key}", 'padding', array('padding' => $item_instance['design']['advanced']['padding']));
}
if (!isset($item_instance['width'])) {
$item_instance['width'] = $this->column_defaults['width'];
}
// Set the button styling
$button_size = '';
if (function_exists('layers_pro_apply_widget_button_styling')) {
$this->inline_css .= layers_pro_apply_widget_button_styling($this, $item_instance, array("#{$widget_id}-{$column_key} .button"));
$button_size = $this->check_and_return($item_instance, 'design', 'buttons-size') ? 'btn-' . $this->check_and_return($item_instance, 'design', 'buttons-size') : '';
}
// Add the correct span class
$span_class = 'span-' . $item_instance['width'];
$col_no++;
$max = 12;
$initial_width = $row_width;
$item_width = $item_instance['width'];
$next_item_width = isset($next_item['width']) ? $next_item['width'] : 0;
$row_width += $item_width;
if ($max == $row_width) {
$first_last_class = 'last';
$row_width = 0;
} elseif ($max < $next_item_width + $row_width) {
$first_last_class = 'last';
$row_width = 0;
} elseif (0 == $initial_width) {
$first_last_class = 'first';
} else {
$first_last_class = '';
}
// Set Featured Media
$featureimage = $this->check_and_return($item_instance, 'design', 'featuredimage');
$featurevideo = $this->check_and_return($item_instance, 'design', 'featuredvideo');
// Calculate which cut based on ratio.
if (isset($item_instance['design']['imageratios'])) {
// Translate Image Ratio into something usable
$image_ratio = layers_translate_image_ratios($item_instance['design']['imageratios']);
if (!isset($item_instance['width'])) {
$item_instance['width'] = 6;
}
if (4 >= $item_instance['width'] && 'layout-fullwidth' != $this->check_and_return($instance, 'design', 'layout')) {
$use_image_ratio = $image_ratio . '-medium';
} else {
$use_image_ratio = $image_ratio . '-large';
}
} else {
if (4 > $item_instance['width']) {
$use_image_ratio = 'medium';
} else {
$use_image_ratio = 'full';
}
}
$media = layers_get_feature_media($featureimage, $use_image_ratio, $featurevideo);
// Set Image Size
if (isset($item_instance['design']['featuredimage-size']) && 0 != $item_instance['design']['featuredimage-size'] && '' != $item_instance['design']['featuredimage-size']) {
$image_width = $item_instance['design']['featuredimage-size'] . 'px';
$this->inline_css .= layers_inline_styles("#{$widget_id}-{$column_key} .media-image img { max-width : {$image_width}; }");
}
// Get the link array.
$link_array = $this->check_and_return_link($item_instance, 'button');
$link_href_attr = $link_array['link'] ? 'href="' . esc_url($link_array['link']) . '"' : '';
$link_target_attr = '_blank' == $link_array['target'] ? 'target="_blank"' : '';
/**
* Set Individual Column CSS
*/
$classes = array();
$classes[] = 'layers-masonry-column';
$classes[] = $this->id_base . '-' . $column_key;
$classes[] = $span_class;
$classes[] = 'on' == $this->check_and_return($item_instance, 'design', 'background', 'darken') ? 'darken' : '';
$classes[] = '' != $first_last_class ? $first_last_class : '';
$classes[] = 'list-masonry' == $this->check_and_return($instance, 'design', 'liststyle') ? '' : '';
$classes[] = 'column' . ('on' != $this->check_and_return($instance, 'design', 'gutter') ? '-flush' : '');
$classes[] = $this->check_and_return($item_instance, 'design', 'advanced', 'customclass');
// Apply custom class from design-bar's advanced control.
if ($this->check_and_return($item_instance, 'design', 'background', 'image') || '' != $this->check_and_return($item_instance, 'design', 'background', 'color')) {
$classes[] = 'content';
}
if (false != $media) {
$classes[] = 'has-image';
}
$classes = apply_filters('layers_content_widget_item_class', $classes, $this, $item_instance);
$classes = implode(' ', $classes);
?>
<div id="<?php
echo $widget_id;
?>
-<?php
echo $column_key;
?>
" class="<?php
echo esc_attr($classes);
?>
">
<?php
/**
* Set Overlay CSS Classes
*/
$column_inner_classes = array();
$column_inner_classes[] = 'media';
if (!$this->check_and_return($instance, 'design', 'gutter')) {
$column_inner_classes[] = 'no-push-bottom';
}
if ($this->check_and_return($item_instance, 'design', 'background', 'color')) {
if ('dark' == layers_is_light_or_dark($this->check_and_return($item_instance, 'design', 'background', 'color'))) {
$column_inner_classes[] = 'invert';
}
} else {
if ($this->check_and_return($instance, 'design', 'background', 'color') && 'dark' == layers_is_light_or_dark($this->check_and_return($instance, 'design', 'background', 'color'))) {
$column_inner_classes[] = 'invert';
}
}
$column_inner_classes[] = $this->check_and_return($item_instance, 'design', 'imagealign');
$column_inner_classes[] = $this->check_and_return($item_instance, 'design', 'fonts', 'size');
$column_inner_classes = implode(' ', $column_inner_classes);
?>
<div class="<?php
echo $column_inner_classes;
?>
">
<?php
if (NULL != $media) {
?>
<div class="media-image <?php
echo isset($item_instance['design']['imageratios']) && 'image-round' == $item_instance['design']['imageratios'] ? 'image-rounded' : '';
?>
">
<?php
if ($link_array['link']) {
?>
<a <?php
echo $link_href_attr;
?>
<?php
echo $link_target_attr;
?>
>
<?php
}
?>
<?php
echo $media;
?>
<?php
if ($link_array['link']) {
?>
</a>
<?php
}
?>
</div>
<?php
}
?>
<?php
if ($this->check_and_return($item_instance, 'title') || $this->check_and_return($item_instance, 'excerpt') || $link_array['link'] && $link_array['text']) {
?>
<div class="media-body <?php
echo isset($item_instance['design']['fonts']['align']) ? $item_instance['design']['fonts']['align'] : '';
?>
">
<?php
if ($this->check_and_return($item_instance, 'title')) {
?>
<<?php
echo $this->check_and_return($item_instance, 'design', 'fonts', 'heading-type');
?>
class="heading">
<?php
if ($link_array['link']) {
?>
<a <?php
echo $link_href_attr;
?>
<?php
echo $link_target_attr;
?>
>
<?php
}
?>
<?php
echo $item_instance['title'];
?>
<?php
if ($link_array['link']) {
?>
</a>
<?php
}
?>
</<?php
echo $this->check_and_return($item_instance, 'design', 'fonts', 'heading-type');
?>
>
<?php
}
?>
<?php
if ($this->check_and_return($item_instance, 'excerpt')) {
?>
<div class="excerpt"><?php
layers_the_content($item_instance['excerpt']);
?>
</div>
<?php
}
?>
<?php
if ($link_array['link'] && $link_array['text']) {
?>
<a <?php
echo $link_href_attr;
?>
class="button <?php
echo $button_size;
?>
" <?php
echo $link_target_attr;
?>
>
<?php
echo $link_array['text'];
?>
</a>
<?php
}
?>
</div>
<?php
}
?>
</div>
</div>
<?php
}
?>
</div><!-- /row -->
</div>
<?php
}
do_action('layers_after_content_widget_inner', $this, $instance);
// Print the Inline Styles for this Widget
$this->print_inline_css();
if ('list-masonry' == $this->check_and_return($instance, 'design', 'liststyle')) {
?>
<script type='text/javascript'>
jQuery(function($){
$('#<?php
echo $widget_id;
?>
').find('.list-masonry .grid').layers_masonry({
itemSelector: '.layers-masonry-column',
layoutMode: 'masonry',
gutter: <?php
echo isset($instance['design']['gutter']) ? 20 : 0;
?>
,
});
});
</script>
<?php
}
// masonry trigger
?>
</div>
<?php
}
/**
* Widget front end display
*/
function widget($args, $instance)
{
global $wp_customize;
$this->backup_inline_css();
// Turn $args array into variables.
extract($args);
// Use defaults if $instance is empty.
if (empty($instance) && !empty($this->defaults)) {
$instance = wp_parse_args($instance, $this->defaults);
}
// Mix in new/unset defaults on every instance load (NEW)
$instance = $this->apply_defaults($instance);
// Enqueue Masonry if need be
if ('list-masonry' == $this->check_and_return($instance, 'design', 'liststyle')) {
wp_enqueue_script(LAYERS_THEME_SLUG . '-layers-masonry-js');
}
// Set the span class for each column
if ('list-list' == $instance['design']['liststyle']) {
$col_count = 1;
$span_class = 'span-12';
} else {
if (isset($instance['design']['columns'])) {
$col_count = str_ireplace('columns-', '', $instance['design']['columns']);
$span_class = 'span-' . 12 / $col_count;
} else {
$col_count = 3;
$span_class = 'span-4';
}
}
// Apply Styling
$this->inline_css .= layers_inline_styles('#' . $widget_id, 'background', array('background' => $instance['design']['background']));
$this->inline_css .= layers_inline_styles('#' . $widget_id, 'color', array('selectors' => array('.section-title .heading', '.section-title div.excerpt'), 'color' => $instance['design']['fonts']['color']));
$this->inline_css .= layers_inline_styles('#' . $widget_id, 'background', array('selectors' => array('.thumbnail-body'), 'background' => array('color' => $this->check_and_return($instance, 'design', 'column-background-color'))));
// Apply Button Styling.
$button_size = '';
if (function_exists('layers_pro_apply_widget_button_styling')) {
// Apply Layers Pro Button Styling.
$this->inline_css .= layers_pro_apply_widget_button_styling($this, $instance, array("#{$widget_id} .thumbnail-body a.button"));
$button_size = $this->check_and_return($instance, 'design', 'buttons-size') ? 'btn-' . $this->check_and_return($instance, 'design', 'buttons-size') : '';
} else {
// Apply Button Styling.
$this->inline_css .= layers_inline_button_styles("#{$widget_id}", 'button', array('selectors' => array('.thumbnail-body a.button'), 'button' => $this->check_and_return($instance, 'design', 'buttons')));
}
// Set Image Sizes
if (isset($instance['design']['imageratios'])) {
// Translate Image Ratio
$image_ratio = layers_translate_image_ratios($instance['design']['imageratios']);
if ('layout-boxed' == $this->check_and_return($instance, 'design', 'layout') && $col_count > 2) {
$use_image_ratio = $image_ratio . '-medium';
} elseif ('layout-boxed' != $this->check_and_return($instance, 'design', 'layout') && $col_count > 3) {
$use_image_ratio = $image_ratio . '-large';
} else {
$use_image_ratio = $image_ratio . '-large';
}
} else {
$use_image_ratio = 'large';
}
// Begin query arguments
$query_args = array();
if (get_query_var('paged')) {
$query_args['paged'] = get_query_var('paged');
} else {
if (get_query_var('page')) {
$query_args['paged'] = get_query_var('page');
} else {
$query_args['paged'] = 1;
}
}
$query_args['post_type'] = $this->post_type;
$query_args['posts_per_page'] = $instance['posts_per_page'];
if (isset($instance['order'])) {
$decode_order = json_decode($instance['order'], true);
if (is_array($decode_order)) {
foreach ($decode_order as $key => $value) {
$query_args[$key] = $value;
}
}
}
// Do the special taxonomy array()
if (isset($instance['category']) && '' != $instance['category'] && 0 != $instance['category']) {
$query_args['tax_query'] = array(array("taxonomy" => $this->taxonomy, "field" => "id", "terms" => $instance['category']));
} elseif (!isset($instance['hide_category_filter'])) {
$terms = get_terms($this->taxonomy);
}
// if we haven't selected which category to show, let's load the $terms for use in the filter
// Do the WP_Query
$post_query = new WP_Query($query_args);
// Set the meta to display
global $layers_post_meta_to_display;
$layers_post_meta_to_display = array();
if (isset($instance['show_dates'])) {
$layers_post_meta_to_display[] = 'date';
}
if (isset($instance['show_author'])) {
$layers_post_meta_to_display[] = 'author';
}
if (isset($instance['show_categories'])) {
$layers_post_meta_to_display[] = 'categories';
}
if (isset($instance['show_tags'])) {
$layers_post_meta_to_display[] = 'tags';
}
// Apply the advanced widget styling
$this->apply_widget_advanced_styling($widget_id, $instance);
/**
* Generate the widget container class
*/
$widget_container_class = array();
$widget_container_class[] = 'widget';
$widget_container_class[] = 'layers-post-widget';
$widget_container_class[] = 'content-vertical-massive';
$widget_container_class[] = 'clearfix';
$widget_container_class[] = 'on' == $this->check_and_return($instance, 'design', 'background', 'darken') ? 'darken' : '';
$widget_container_class[] = $this->check_and_return($instance, 'design', 'advanced', 'customclass');
// Apply custom class from design-bar's advanced control.
$widget_container_class[] = $this->get_widget_spacing_class($instance);
$widget_container_class = apply_filters('layers_post_widget_container_class', $widget_container_class, $this, $instance);
$widget_container_class = implode(' ', $widget_container_class);
// Custom Anchor
echo $this->custom_anchor($instance);
?>
<div id="<?php
echo esc_attr($widget_id);
?>
" class="<?php
echo esc_attr($widget_container_class);
?>
" <?php
$this->selective_refresh_atts($args);
?>
>
<?php
do_action('layers_before_post_widget_inner', $this, $instance);
?>
<?php
if ('' != $this->check_and_return($instance, 'title') || '' != $this->check_and_return($instance, 'excerpt')) {
?>
<div class="container clearfix">
<?php
/**
* Generate the Section Title Classes
*/
$section_title_class = array();
$section_title_class[] = 'section-title clearfix';
$section_title_class[] = $this->check_and_return($instance, 'design', 'fonts', 'size');
$section_title_class[] = $this->check_and_return($instance, 'design', 'fonts', 'align');
$section_title_class[] = $this->check_and_return($instance, 'design', 'background', 'color') && 'dark' == layers_is_light_or_dark($this->check_and_return($instance, 'design', 'background', 'color')) ? 'invert' : '';
$section_title_class = implode(' ', $section_title_class);
?>
<div class="<?php
echo $section_title_class;
?>
">
<?php
if ('' != $this->check_and_return($instance, 'title')) {
?>
<<?php
echo $this->check_and_return($instance, 'design', 'fonts', 'heading-type');
?>
class="heading">
<?php
echo $instance['title'];
?>
</<?php
echo $this->check_and_return($instance, 'design', 'fonts', 'heading-type');
?>
>
<?php
}
?>
<?php
if ('' != $this->check_and_return($instance, 'excerpt')) {
?>
<div class="excerpt"><?php
echo layers_the_content($instance['excerpt']);
?>
</div>
<?php
}
?>
</div>
</div>
<?php
}
?>
<?php
if ($post_query->have_posts()) {
?>
<div class="<?php
echo $this->get_widget_layout_class($instance);
?>
<?php
echo $this->check_and_return($instance, 'design', 'liststyle');
?>
">
<div class="grid">
<?php
while ($post_query->have_posts()) {
$post_query->the_post();
if ('list-list' == $instance['design']['liststyle']) {
?>
<article id="post-<?php
the_ID();
?>
" class="clearfix push-bottom-large">
<?php
if (isset($instance['show_titles'])) {
?>
<header class="section-title large">
<h1 class="heading"><a href="<?php
the_permalink();
?>
"><?php
the_title();
?>
</a></h1>
</header>
<?php
}
?>
<?php
// Layers Featured Media );
if (isset($instance['show_media'])) {
echo layers_post_featured_media(array('postid' => get_the_ID(), 'wrap_class' => 'thumbnail push-bottom span-5 column' . ('image-round' == $this->check_and_return($instance, 'design', 'imageratios') ? ' image-rounded' : ''), 'size' => $use_image_ratio));
}
// if Show Media
?>
<?php
if (isset($instance['show_excerpts']) || $instance['show_call_to_action'] || !empty($layers_post_meta_to_display)) {
?>
<div class="column span-7">
<?php
if (isset($instance['show_excerpts'])) {
if (isset($instance['excerpt_length']) && '' == $instance['excerpt_length']) {
echo '<div class="copy push-bottom">';
the_content();
echo '</div>';
} else {
if (isset($instance['excerpt_length']) && 0 != $instance['excerpt_length'] && strlen(get_the_excerpt()) > $instance['excerpt_length']) {
echo '<div class="copy push-bottom">' . substr(get_the_excerpt(), 0, $instance['excerpt_length']) . '…</div>';
} else {
if ('' != get_the_excerpt()) {
echo '<div class="copy push-bottom">' . get_the_excerpt() . '</div>';
}
}
}
}
?>
<?php
layers_post_meta(get_the_ID(), $layers_post_meta_to_display, 'footer', 'meta-info push-bottom ' . ('' != $this->check_and_return($instance, 'design', 'column-background-color') && 'dark' == layers_is_light_or_dark($this->check_and_return($instance, 'design', 'column-background-color')) ? 'invert' : ''));
?>
<?php
if (isset($instance['show_call_to_action']) && $this->check_and_return($instance, 'call_to_action')) {
?>
<p><a href="<?php
the_permalink();
?>
" class="button <?php
echo $button_size;
?>
"><?php
echo $instance['call_to_action'];
?>
</a></p>
<?php
}
// show call to action
?>
</div>
<?php
}
?>
</article>
<?php
} else {
/**
* Set Individual Column CSS
*/
$post_column_class = array();
$post_column_class[] = 'layers-masonry-column';
$post_column_class[] = 'thumbnail';
$post_column_class[] = 'list-masonry' == $this->check_and_return($instance, 'design', 'liststyle') ? 'no-gutter' : '';
$post_column_class[] = 'column' . ('on' != $this->check_and_return($instance, 'design', 'gutter') ? '-flush' : '');
$post_column_class[] = $span_class;
$post_column_class[] = 'overlay' == $this->check_and_return($instance, 'text_style') ? 'with-overlay' : '';
$post_column_class[] = '' != $this->check_and_return($instance, 'design', 'column-background-color') && 'dark' == layers_is_light_or_dark($this->check_and_return($instance, 'design', 'column-background-color')) ? 'invert' : '';
$post_column_class = implode(' ', $post_column_class);
?>
<article class="<?php
echo $post_column_class;
?>
" data-cols="<?php
echo $col_count;
?>
">
<?php
// Layers Featured Media
if (isset($instance['show_media'])) {
echo layers_post_featured_media(array('postid' => get_the_ID(), 'wrap_class' => 'thumbnail-media' . ('image-round' == $this->check_and_return($instance, 'design', 'imageratios') ? ' image-rounded' : ''), 'size' => $use_image_ratio, 'hide_href' => false));
}
// if Show Media
?>
<?php
if (isset($instance['show_titles']) || isset($instance['show_excerpts'])) {
?>
<div class="thumbnail-body">
<div class="overlay">
<?php
if (isset($instance['show_titles'])) {
?>
<header class="article-title">
<h4 class="heading"><a href="<?php
the_permalink();
?>
"><?php
the_title();
?>
</a></h4>
</header>
<?php
}
?>
<?php
if (isset($instance['show_excerpts'])) {
if (isset($instance['excerpt_length']) && '' == $instance['excerpt_length']) {
echo '<div class="excerpt">';
the_content();
echo '</div>';
} else {
if (isset($instance['excerpt_length']) && 0 != $instance['excerpt_length'] && strlen(get_the_excerpt()) > $instance['excerpt_length']) {
echo '<div class="excerpt">' . substr(get_the_excerpt(), 0, $instance['excerpt_length']) . '…</div>';
} else {
if ('' != get_the_excerpt()) {
echo '<div class="excerpt">' . get_the_excerpt() . '</div>';
}
}
}
}
?>
<?php
if ('overlay' != $this->check_and_return($instance, 'text_style')) {
?>
<?php
layers_post_meta(get_the_ID(), $layers_post_meta_to_display, 'footer', 'meta-info ' . ('' != $this->check_and_return($instance, 'design', 'column-background-color') && 'dark' == layers_is_light_or_dark($this->check_and_return($instance, 'design', 'column-background-color')) ? 'invert' : ''));
?>
<?php
}
// Don't show meta if we have chosen overlay
?>
<?php
if (isset($instance['show_call_to_action']) && $this->check_and_return($instance, 'call_to_action')) {
?>
<a href="<?php
the_permalink();
?>
" class="button <?php
echo $button_size;
?>
"><?php
echo $instance['call_to_action'];
?>
</a>
<?php
}
// show call to action
?>
</div>
</div>
<?php
}
// if show titles || show excerpt
?>
</article>
<?php
}
// if list-list == liststyle
?>
<?php
}
// while have_posts
?>
</div><!-- /row -->
</div>
<?php
}
// if have_posts
?>
<?php
if (isset($instance['show_pagination'])) {
?>
<div class="container">
<?php
layers_pagination(array('query' => $post_query), 'div', 'pagination clearfix');
?>
</div>
<?php
}
?>
<?php
do_action('layers_after_post_widget_inner', $this, $instance);
// Print the Inline Styles for this Widget
$this->print_inline_css();
if ('list-masonry' == $this->check_and_return($instance, 'design', 'liststyle')) {
?>
<script type='text/javascript'>
jQuery(function($){
$('#<?php
echo $widget_id;
?>
').find('.list-masonry .grid').layers_masonry({
itemSelector: '.layers-masonry-column',
gutter: <?php
echo isset($instance['design']['gutter']) ? 20 : 0;
?>
,
});
});
</script>
<?php
}
// masonry trigger
?>
</div>
<?php
// Reset WP_Query
wp_reset_postdata();
}