/** * * Components are shortcodes * * */ function shortcode($atts, $content = null) { $defaults = array('icon' => 'dashicons dashicons-edit', 'icon_color' => '', 'color' => '#eeeeee', 'title' => '', 'text' => '', 'image' => '', 'link' => '', 'link_text' => '', 'timestamp' => ''); $atts = shortcode_atts($defaults, $atts); // account for multiple instances of this component static $instance = 0; $instance++; $unique = sprintf('timeline-shortcode-%s-%s', get_the_ID(), $instance); // example of getting an option value //$beta = $atts['beta']; $icon = $atts['icon']; $icon_color = $atts['icon_color']; $color = $atts['color']; $title = $atts['title']; $text = $atts['text']; $image = $atts['image']; $link = $atts['link']; $link_text = $atts['link_text']; $timestamp = $atts['timestamp']; $has_image = '' != $image ? 'has-image' : ''; $no_link = '' == $link ? 'no-link' : ''; // if lasso is active we need to map the sc atts as data-attributes if (class_exists('lasso_autoloader') && (function_exists('lasso_user_can') && lasso_user_can())) { $options = function_exists('aesop_component_data_atts') ? aesop_component_data_atts('timeline', $unique, $atts) : false; } else { $options = false; } $out = sprintf('' . '<div id="%s" class="aesop-component aesop-component-timeline-block" %s>' . '<div class="aesop-component-timeline-icon" style="background-color: %s;">' . '<i class="%s" style="color: %s;"></i>' . '</div>' . '<div class="aesop-component-timeline-content %s %s">' . '<div class="aesop-component-timeline-image" style="background-image: url(\'%s\');"></div>' . '<h2 class="aesop-component-timeline-title">%s</h2>' . '<p class="aesop-component-timeline-text">%s</p>' . '<a class="aesop-component-timeline-link" href="%s">%s</a>' . '<span class="aesop-component-timeline-timestamp">%s</span>' . '</div>' . '</div>', $unique, $options, $color, $icon, $icon_color, $has_image, $no_link, $image, $title, $text, $link, $link_text, $timestamp); return $out; }
function aesop_document_shortcode($atts) { $defaults = array('type' => 'pdf', 'src' => '', 'caption' => ''); $atts = apply_filters('aesop_document_defaults', shortcode_atts($defaults, $atts)); // let this be used multiple times static $instance = 0; $instance++; $unique = sprintf('%s-%s', get_the_ID(), $instance); // actions $actiontop = do_action('aesop_document_before', $atts, $unique); // action $actionbottom = do_action('aesop_document_cafter', $atts, $unique); // action $actioninsidetop = do_action('aesop_document_inside_top', $atts, $unique); // action $actioninsidebottom = do_action('aesop_document_inside_bottom', $atts, $unique); // action // custom classes $classes = function_exists('aesop_component_classes') ? aesop_component_classes('document', '') : null; switch ($atts['type']) { case 'pdf': $source = sprintf('<object class="aesop-pdf" data="%s" type="application/pdf" ></object>', esc_url($atts['src'])); break; case 'image': $source = sprintf('<img src="%s"', esc_url($atts['src'])); break; default: $source = sprintf('<object class="aesop-pdf" data="%s" type="application/pdf" ></object>', esc_url($atts['src'])); break; } $script = sprintf(' <script> jQuery(document).ready(function($){ $(\'.aesop-doc-reveal-%s\').click(function(e){ e.preventDefault; $( "#aesop-doc-collapse-%s" ).slideToggle(); return false; }); }); </script> ', esc_attr($unique), esc_attr($unique)); $slide = $atts['caption'] ? esc_html($atts['caption']) : false; $link = sprintf('<a href="#" class="aesop-doc-reveal-%s"><span class="aesop-document-component--label">document</span><br /> <div class="aesop-document-component--caption">%s</div></a>', esc_attr($unique), $slide); $guts = sprintf('<div id="aesop-doc-collapse-%s" style="display:none;" class="aesop-content">%s</div>', esc_attr($unique), $source); $out = sprintf('%s<aside %s class="aesop-component aesop-document-component aesop-content %s">%s%s%s%s%s</aside>%s', $actiontop, aesop_component_data_atts('document', $unique, $atts), $classes, $script, $actioninsidetop, $link, $guts, $actioninsidebottom, $actionbottom); return apply_filters('aesop_document_output', $out); }
function aesop_timeline_stop_shortcode($atts) { $defaults = array('num' => '2007', 'title' => ''); $atts = apply_filters('aesop_timeline_defaults', shortcode_atts($defaults, $atts)); // let this be used multiple times static $instance = 0; $instance++; $unique = sprintf('%s-%s', get_the_ID(), $instance); $datatitle = $atts['title'] ? sprintf('data-title="%s"', esc_attr($atts['title'])) : null; // actions $actiontop = do_action('aesop_timeline_before', $atts, $unique); // action $actionbottom = do_action('aesop_timeline_after', $atts, $unique); // action $out = sprintf('%s<h2 class="aesop-timeline-stop aesop-component" %s %s>%s</h2>%s', $actiontop, $datatitle, aesop_component_data_atts('timeline_stop', $unique, $atts), esc_html($atts['num']), $actionbottom); return apply_filters('aesop_timeline_output', $out); }
function aesop_parallax_shortcode($atts) { $defaults = array('img' => '', 'height' => 500, 'parallaxbg' => 'on', 'floater' => '', 'floatermedia' => '', 'floaterposition' => 'right', 'floaterdirection' => 'up', 'caption' => '', 'captionposition' => 'bottom-left', 'lightbox' => false); $atts = apply_filters('aesop_parallax_defaults', shortcode_atts($defaults, $atts)); // let this be used multiple times static $instance = 0; $instance++; $unique = sprintf('%s-%s', get_the_ID(), $instance); // add a css class if parallax bg is set to on $laxclass = 'on' == $atts['parallaxbg'] ? 'is-parallax' : false; // add custom css classes through our utility function $classes = aesop_component_classes('parallax', ''); // automatically provide an alt tag for the image based on the name of the image file $auto_alt = $atts['img'] ? basename($atts['img']) : null; $floater_direction = $atts['floaterdirection'] ? $atts['floaterdirection'] : 'up'; ob_start(); do_action('aesop_parallax_before', $atts, $unique); // action ?> <div id="aesop-parallax-component-<?php echo esc_attr($unique); ?> " <?php echo aesop_component_data_atts('parallax', $unique, $atts); ?> class="aesop-component aesop-parallax-component <?php echo sanitize_html_class($classes); ?> "><?php do_action('aesop_parallax_inside_top', $atts, $unique); // action ?> <script> jQuery(document).ready(function($){ var img = $('.aesop-parallax-sc.aesop-parallax-sc-<?php echo esc_attr($unique); ?> .aesop-parallax-sc-img') , setHeight = function() { img.parent().imagesLoaded( function() { var imgHeight = img.height() , imgCont = img.parent() <?php if ('off' == $atts['parallaxbg']) { ?> imgCont.css('height', imgHeight) <?php } else { ?> imgCont.css('height',Math.round(imgHeight * 0.69)) if ( $(window).height < 760 ) { imgCont.css('height',Math.round(imgHeight * 0.65)) } <?php } ?> }); } setHeight(); $(window).resize(function(){ setHeight(); }) <?php if (!wp_is_mobile() && ('on' == $atts['parallaxbg'] || 'on' == $atts['floater'])) { if ('on' == $atts['parallaxbg']) { ?> img.parallax({speed: 0.1}); <?php } //end if if ('on' == $atts['floater']) { ?> var obj = $('.aesop-parallax-sc.aesop-parallax-sc-<?php echo esc_attr($unique); ?> .aesop-parallax-sc-floater'); function scrollParallax(){ var height = obj.height(), offset = obj.offset().top, scrollTop = $(window).scrollTop(), windowHeight = $(window).height(), floater = Math.round( (offset - scrollTop) * 0.1); // only run parallax if in view if (offset >= scrollTop + windowHeight) { return; } <?php if ('left' == $floater_direction || 'right' == $floater_direction) { if ('left' == $floater_direction) { ?> obj.css({'transform':'translate3d(' + floater + 'px, 0px, 0px)'}); <?php } else { ?> obj.css({'transform':'translate3d(-' + floater + 'px, 0px, 0px)'}); <?php } } else { if ('up' == $floater_direction) { ?> obj.css({'transform':'translate3d(0px,' + floater + 'px, 0px)'}); <?php } else { ?> obj.css({'transform':'translate3d(0px,-' + floater + 'px, 0px)'}); <?php } } ?> } // end if on floater scrollParallax(); $(window).scroll(function() { scrollParallax(); }); <?php } //end on floater } //end if is not mobile and parallax is on ?> }); // end jquery doc ready </script> <figure class="aesop-parallax-sc aesop-parallax-sc-<?php echo esc_attr($unique); ?> "> <?php do_action('aesop_parallax_inner_inside_top', $atts, $unique); // action ?> <?php if ('on' == $atts['floater']) { ?> <div class="aesop-parallax-sc-floater floater-<?php echo sanitize_html_class($atts['floaterposition']); ?> " data-speed="10"> <?php echo aesop_component_media_filter($atts['floatermedia']); ?> </div> <?php } ?> <?php if ('on' == $atts['lightbox']) { ?> <a class="aesop-lb-link aesop-lightbox" rel="lightbox" title="<?php echo esc_attr($atts['caption']); ?> " href="<?php echo esc_url($atts['img']); ?> "><i class="aesopicon aesopicon-search-plus"></i></a> <?php } ?> <img class="aesop-parallax-sc-img <?php echo $laxclass; ?> " src="<?php echo esc_url($atts['img']); ?> " alt="<?php echo esc_attr($auto_alt); ?> " > <?php if ($atts['caption']) { ?> <figcaption class="aesop-parallax-sc-caption-wrap <?php echo sanitize_html_class($atts['captionposition']); ?> "> <?php echo aesop_component_media_filter(trim($atts['caption'])); ?> </figcaption> <?php } ?> <?php do_action('aesop_parallax_inner_inside_bottom', $atts, $unique); // action ?> </figure> <?php do_action('aesop_parallax_inside_bottom', $atts, $unique); // action ?> </div> <?php do_action('aesop_parallax_after', $atts, $unique); // action return ob_get_clean(); }
function aesop_collection_shortcode($atts) { $defaults = array('collection' => 1, 'title' => '', 'columns' => 2, 'limit' => -1, 'splash' => ''); $atts = apply_filters('aesop_collection_defaults', shortcode_atts($defaults, $atts)); // let this be used multiple times static $instance = 0; $instance++; $unique = sprintf('%s-%s', get_the_ID(), $instance); ob_start(); $col = $atts['columns'] ? preg_replace('/[^0-9]/', '', $atts['columns']) : null; $splash_class = 'on' == $atts['splash'] ? 'aesop-collection-splash' : null; // custom classes $classes = function_exists('aesop_component_classes') ? aesop_component_classes('collections', '') : null; do_action('aesop_collection_before', $atts, $unique); // action ?> <!-- Collections --> <div <?php echo aesop_component_data_atts('collection', $unique, $atts); ?> class="aesop-story-collection aesop-component <?php echo sanitize_html_class($classes); ?> "> <?php do_action('aesop_collection_inside_top', $atts, $unique); // action ?> <?php if ($atts['title']) { ?> <h4 class="aesop-story-collection-title"><span><?php echo esc_html($atts['title']); ?> </span></h4> <?php } ?> <div id="aesop-collection-<?php echo $unique; ?> " class="aesop-collection-grid clearfix aesop-collection-grid-<?php echo absint($col); ?> col <?php echo sanitize_html_class($splash_class); ?> "> <?php // if collection ID is set if ($atts['collection']) { // if splash mode is set if ('on' == $atts['splash']) { // cat query args $cat_args = array('orderby' => 'name', 'order' => 'ASC'); // get cached query $cats = wp_cache_get('aesop_splash_query_' . $atts['collection']); // if no cached query then cache the query if (false == $cats) { $cats = get_categories(apply_filters('aesop_splash_query', $cat_args)); wp_cache_set('aesop_splash_query_' . $atts['collection'], $cats); } if ($cats) { foreach ($cats as $cat) { ?> <div class="aesop-collection-item aesop-collection-category-<?php echo $cat->slug; ?> "> <?php do_action('aesop_collection_inside_category_item_top', $atts, $unique); // action ?> <a class="aesop-collection-item-link" href="<?php echo get_category_link($cat->term_id); ?> "> <div class="aesop-collection-item-inner"> <h2 class="aesop-collection-entry-title" itemprop="title"><?php echo $cat->name; ?> </h2> <div class="aesop-collection-item-excerpt"><?php echo $cat->category_description; ?> </div> </div> <div class="aesop-collection-item-img"></div> </a> <?php do_action('aesop_collection_inside_category_item_bottom', $atts, $unique); // action ?> </div> <?php } } // else carry onto default mode } else { // query args $args = array('posts_per_page' => $atts['limit'], 'cat' => $atts['collection'], 'ignore_sticky' => true); // get cached query $query = wp_cache_get('aesop_collection_query_' . $atts['collection']); // if no cached query then cache the query if (false == $query) { $query = new wp_query(apply_filters('aesop_collection_query', $args)); wp_cache_set('aesop_collection_query_' . $atts['collection'], $query); } // loop through the stories if ($query->have_posts()) { while ($query->have_posts()) { $query->the_post(); $coverimg = wp_get_attachment_image_src(get_post_thumbnail_id(get_the_ID()), 'large'); ?> <div class="aesop-collection-item"> <?php do_action('aesop_collection_inside_item_top', $atts, $unique); // action ?> <a class="aesop-fader aesop-collection-item-link" href="<?php the_permalink(); ?> "> <div class="aesop-collection-item-inner"> <h2 class="aesop-collection-entry-title" itemprop="title"><?php the_title(); ?> </h2> <p class="aesop-collection-meta">Written by <?php echo get_the_author(); ?> </p> <div class="aesop-collection-item-excerpt"><?php echo wp_trim_words(get_the_excerpt(), 22, '...'); ?> </div> </div> <div class="aesop-collection-item-img" style="background-image:url(<?php echo $coverimg[0]; ?> );background-repeat:no-repeat;background-size:cover;"></div> </a> <?php do_action('aesop_collection_inside_item_bottom', $atts, $unique); // action ?> </div> <?php } } wp_reset_postdata(); } //end if // if collection ID isn't set warn them } else { ?> <div class="aesop-error aesop-content"><?php _e('Specify a category ID to display stories from.', 'aesop-core'); ?> </div><?php } ?> </div> <?php do_action('aesop_collection_inside_bottom', $atts, $unique); // action ?> </div> <?php do_action('aesop_collection_after', $atts, $unique); // action return ob_get_clean(); }
function aesop_content_shortcode($atts, $content = null) { // let this be used multiple times static $instance = 0; $instance++; $unique = sprintf('%s-%s', get_the_ID(), $instance); $defaults = array('height' => '', 'width' => '100%', 'columns' => '', 'position' => 'center', 'innerposition' => '', 'img' => '', 'imgrepeat' => 'no-repeat', 'imgposition' => 'center center', 'imgsize' => 'cover', 'floatermedia' => '', 'floaterdirection' => 'down', 'floaterposition' => 'left', 'color' => '#FFFFFF', 'background' => '#222222'); $atts = apply_filters('aesop_cbox_defaults', shortcode_atts($defaults, $atts)); // set component to content width $contentwidth = 'content' == $atts['width'] ? 'aesop-content' : false; // height $height = $atts['height'] ? sprintf('min-height:%s;', esc_attr($atts['height'])) : false; // inner positioning $getinnerposition = $atts['innerposition'] ? preg_split('/[\\s,]+/', $atts['innerposition']) : false; $positionArray = array('top' => $getinnerposition[0], 'right' => $getinnerposition[1], 'bottom' => $getinnerposition[2], 'left' => $getinnerposition[3]); //$innerposition = is_array( $positionArray ) && $atts['innerposition'] ? sprintf( 'position:absolute;top:%s;right:%s;bottom:%s;left:%s;', $positionArray['top'], $positionArray['right'], $positionArray['bottom'], $positionArray['left'] ) : false; $innerposition = is_array($positionArray) && $atts['innerposition'] ? sprintf('top:%s;right:%s;bottom:%s;left:%s;', $positionArray['top'], $positionArray['right'], $positionArray['bottom'], $positionArray['left']) : false; // are we doing columns or image and do a clas based on it $columns = $atts['columns'] ? sprintf('aesop-content-comp-columns-%s', $atts['columns']) : false; $image = $atts['img'] ? 'aesop-content-img' : false; $typeclass = $columns . ' ' . $image; // image and width inline styles $bgcolor = $atts['background'] ? sprintf('background-color:%s;', esc_url($atts['background'])) : false; $imgstyle = $atts['img'] ? sprintf('%sbackground-image:url(\'%s\');background-size:%s;background-position:%s;background-repeat:%s;', $bgcolor, esc_url($atts['img']), esc_attr($atts['imgsize']), esc_attr($atts['imgposition']), esc_attr($atts['imgrepeat'])) : false; $position = 'left' == $atts['position'] || 'right' == $atts['position'] ? sprintf('float:%s;', esc_attr($atts['position'])) : 'margin-left:auto;margin-right:auto;'; $widthContentStyle = 'content' == $atts['width'] ? false : sprintf('max-width:%s;', esc_attr($atts['width'])); $innerstyle = $atts['width'] || $position || $atts['innerposition'] ? sprintf('style="%s%s%s"', $widthContentStyle, $position, $innerposition) : false; $txtcolor = $atts['color'] ? sprintf('color:%s;', $atts['color']) : false; $itemstyle = $imgstyle !== false || $txtcolor !== false || $height !== false ? sprintf('style="%s%s%s%s"', $imgstyle, $txtcolor, $bgcolor, $height) : false; // custom classes $classes = function_exists('aesop_component_classes') ? aesop_component_classes('content', '') : false; // has image class $has_img = $atts['img'] ? 'aesop-content-has-img' : false; // has floater $has_floater = $atts['floatermedia'] ? 'aesop-content-has-floater' : false; // floater positoin $floaterposition = $atts['floaterposition'] ? sprintf('floater-%s', $atts['floaterposition']) : false; ob_start(); do_action('aesop_cbox_before', $atts, $unique); // action ?> <div <?php echo aesop_component_data_atts('content', $unique, $atts, true); ?> class="aesop-component aesop-content-component <?php echo sanitize_html_class($classes) . ' ' . $has_img . ' ' . $has_floater; ?> " style="<?php echo $height; ?> " > <?php if ($atts['floatermedia'] && !wp_is_mobile()) { ?> <!-- Aesop Content Component --> <script> jQuery(document).ready(function($){ var obj = $('#aesop-content-component-<?php echo esc_attr($unique); ?> .aesop-content-component-floater'); function scrollParallax(){ var height = $(obj).height(), offset = $(obj).offset().top, scrollTop = $(window).scrollTop(), windowHeight = $(window).height(), floater = Math.round( (offset - scrollTop) * 0.1); // only run parallax if in view if (offset + height <= scrollTop || offset >= scrollTop + windowHeight) { return; } <?php if ('up' == $atts['floaterdirection']) { ?> $(obj).css({'transform':'translate3d(0px,' + floater + 'px, 0px)'}); <?php } else { ?> $(obj).css({'transform':'translate3d(0px,-' + floater + 'px, 0px)'}); <?php } ?> } scrollParallax(); $(window).scroll(function() {scrollParallax();}); }); </script> <?php } //end if echo do_action('aesop_cbox_inside_top', $atts, $unique); // action ?> <div id="aesop-content-component-<?php echo $unique; ?> " class="aesop-content-comp-wrap <?php echo $typeclass; ?> " <?php echo $itemstyle; ?> > <?php echo do_action('aesop_cbox_content_inside_top', $atts, $unique); // action if ($atts['floatermedia'] && !wp_is_mobile()) { ?> <div class="aesop-content-component-floater <?php echo $floaterposition; ?> " data-speed="10"><?php echo aesop_component_media_filter($atts['floatermedia']); ?> </div> <?php } ?> <div class="aesop-component-content-data aesop-content-comp-inner <?php echo $contentwidth; ?> " <?php echo $innerstyle; ?> > <?php echo do_action('aesop_cbox_content_inner_inside_top', $atts, $unique); // action ?> <?php echo do_shortcode(wpautop(html_entity_decode($content))); ?> <?php echo do_action('aesop_cbox_content_inner_inside_bottom', $atts, $unique); // action ?> </div> <?php echo do_action('aesop_cbox_content_inside_bottom', $atts, $unique); // action ?> </div> <?php echo do_action('aesop_cbox_inside_bottom', $atts, $unique); // action ?> </div> <?php do_action('aesop_cbox_after', $atts, $unique); // action return ob_get_clean(); }
function aesop_quote_shortcode($atts) { $defaults = array('width' => '100%', 'background' => '#222222', 'img' => '', 'text' => '', 'height' => 'auto', 'align' => 'center', 'size' => '1', 'parallax' => '', 'direction' => '', 'quote' => __('People are made of stories, not atoms.', 'aesop-core'), 'cite' => '', 'type' => 'block'); $atts = apply_filters('aesop_quote_defaults', shortcode_atts($defaults, $atts)); // let this be used multiple times static $instance = 0; $instance++; $unique = sprintf('%s-%s', get_the_ID(), $instance); // set component to content width $contentwidth = 'content' == $atts['width'] ? 'aesop-content' : false; // set size $size_unit = apply_filters('aesop_quote_size_unit', 'em', $unique); $size = $atts['size'] ? sprintf('%s%s', $atts['size'], $size_unit) : false; // bg img $bgimg = $atts['img'] ? sprintf('background-image:url(%s);background-size:cover;background-position:center center;', esc_url($atts['img'])) : false; // bg color only if not block style $bgcolor = 'block' == $atts['type'] ? sprintf('background-color:%s;', $atts['background']) : false; if ('block' == $atts['type']) { if ($atts['text'] == '') { $atts['text'] = '#FFFFFF'; } $fgcolor = sprintf('color:%s;', esc_attr($atts['text'])); } else { // for non-block quote color is ignored unless it has been changed from the default value if ($atts['text'] == '' || !strcasecmp(esc_attr($atts['text']), '#ffffff')) { $fgcolor = null; } else { $fgcolor = sprintf('color:%s;', esc_attr($atts['text'])); } } // set styles $style = $bgcolor || $fgcolor || $atts['height'] || $atts['width'] ? sprintf('style="%s%s%sheight:%s;width:%s;"', esc_attr($bgcolor), $bgimg, $fgcolor, esc_attr($atts['height']), esc_attr($atts['width'])) : false; $isparallax = 'on' == $atts['parallax'] ? 'quote-is-parallax' : false; $lrclass = 'left' == $atts['direction'] || 'right' == $atts['direction'] ? 'quote-left-right' : false; // has img class $imgclass = $atts['img'] ? 'quote-has-image' : false; // type $type = $atts['type'] ? sprintf(' aesop-quote-type-%s', trim($atts['type'])) : false; // align $align = $atts['align'] ? sprintf('aesop-component-align-%s', esc_attr($atts['align'])) : null; // style/consolidated classes $css_class_array = array($align, $type, $contentwidth, $isparallax, $lrclass, $imgclass); $css_classes = ''; if (!empty($css_class_array)) { foreach ($css_class_array as $class) { $css_classes .= ' ' . $class; } } // core/custom classes $core_classes = function_exists('aesop_component_classes') ? aesop_component_classes('quote') : null; // cite $cite = $atts['cite'] ? apply_filters('aesop_quote_component_cite', sprintf('<cite class="aesop-quote-component-cite">%s</cite>', aesop_component_media_filter($atts['cite']))) : null; ob_start(); do_action('aesop_quote_before', $atts, $unique); // action ?> <div id="aesop-quote-component-<?php echo esc_attr($unique); ?> " <?php echo aesop_component_data_atts('quote', $unique, $atts); ?> class="aesop-component aesop-quote-component <?php echo $core_classes . ' ' . $css_classes; ?> " <?php echo $style; ?> > <?php if ('block' == $atts['type']) { ?> <!-- Aesop Core | Quote --> <script> jQuery(document).ready(function($){ var moving = $('#aesop-quote-component-<?php echo esc_attr($unique); ?> blockquote'), component = $('#aesop-quote-component-<?php echo esc_attr($unique); ?> '); // if parallax is on and we're not on mobile <?php if ('on' == $atts['parallax'] && !wp_is_mobile()) { ?> function scrollParallax(){ var height = $(component).height(), offset = $(component).offset().top, scrollTop = $(window).scrollTop(), windowHeight = $(window).height(), position = Math.round( scrollTop * 0.1 ); // only run parallax if in view if (offset + height <= scrollTop || offset >= scrollTop + windowHeight) { return; } moving.css({'transform':'translate3d(0px,-' + position + 'px, 0px)'}); <?php if ('left' == $atts['direction']) { ?> moving.css({'transform':'translate3d(-' + position + 'px, 0px, 0px)'}); <?php } elseif ('right' == $atts['direction']) { ?> moving.css({'transform':'translate3d(' + position + 'px, 0px, 0px)'}); <?php } ?> } component.waypoint({ offset: '100%', handler: function(direction){ $(this).toggleClass('aesop-quote-faded'); // fire parallax scrollParallax(); $(window).scroll(function() {scrollParallax();}); } }); <?php } else { ?> moving.waypoint({ offset: '90%', handler: function(direction){ $(this).toggleClass('aesop-quote-faded'); } }); <?php } //end if ?> }); </script> <?php } do_action('aesop_quote_inside_top', $atts, $unique); // action ?> <blockquote class="<?php echo sanitize_html_class($align); ?> " style="font-size:<?php echo esc_attr($size); ?> ;<?php echo $fgcolor; ?> "> <span><?php echo esc_html($atts['quote']); ?> </span> <?php echo $cite; ?> </blockquote> <?php do_action('aesop_quote_inside_bottom', $atts, $unique); // action ?> </div> <?php do_action('aesop_quote_after', $atts, $unique); // action return ob_get_clean(); }
function aesop_character_shortcode($atts, $content = null) { $defaults = array('img' => '', 'name' => '', 'caption' => '', 'align' => 'left', 'width' => ''); // let this be used multiple times static $instance = 0; $instance++; $unique = sprintf('%s-%s', get_the_ID(), $instance); $atts = apply_filters('aesop_character_defaults', shortcode_atts($defaults, $atts)); // custom classes $classes = function_exists('aesop_component_classes') ? aesop_component_classes('character', '') : null; // width styles $styles = $atts['width'] ? sprintf('style="width:%s;"', esc_attr($atts['width'])) : null; // wrapper float class $float = $atts['align'] ? sprintf('aesop-component-align-%s', esc_attr($atts['align'])) : null; // automatic alt tag $auto_alt = $atts['img'] ? basename($atts['img']) : null; $alt = $auto_alt ? preg_replace('/\\.[^.\\s]{3,4}$/', '', $auto_alt) : null; // character wrap ob_start(); do_action('aesop_character_before', $atts, $unique); // action ?> <aside id="aesop-character-component-<?php echo esc_attr($unique); ?> " <?php echo aesop_component_data_atts('character', $unique, $atts); ?> class="aesop-character-component aesop-component <?php echo sanitize_html_class($classes) . '' . sanitize_html_class($float); ?> "> <?php do_action('aesop_character_inside_top', $atts, $unique); // action ?> <div class="aesop-character-inner aesop-content"> <div class="aesop-character-float aesop-character-<?php echo esc_attr($atts['align']); ?> " <?php echo $styles; ?> > <?php do_action('aesop_character_inner_inside_top', $atts, $unique); // action ?> <?php if ($atts['name']) { ?> <span class="aesop-character-title"><?php echo aesop_component_media_filter($atts['name']); ?> </span> <?php } ?> <?php if ($atts['img']) { ?> <img class="aesop-character-avatar" src="<?php echo esc_url($atts['img']); ?> " alt="<?php echo esc_attr_e($alt); ?> "> <?php } ?> <?php if ($content) { ?> <div class="aesop-character-text"><?php echo do_shortcode($content); ?> </div> <?php } ?> <?php if ($atts['caption']) { ?> <p class="aesop-character-cap"><?php echo aesop_component_media_filter($atts['caption']); ?> </p> <?php } ?> <?php do_action('aesop_character_inner_inside_bottom', $atts, $unique); // action ?> </div> </div> <?php do_action('aesop_character_inside_bottom', $atts, $unique); // action ?> </aside> <?php do_action('aesop_character_after', $atts, $unique); // action return ob_get_clean(); }
function aesop_image_shortcode($atts) { $defaults = array('img' => '', 'imgwidth' => '300px', 'offset' => '', 'alt' => '', 'align' => 'left', 'caption' => '', 'credit' => '', 'captionposition' => 'left', 'lightbox' => 'off'); $atts = apply_filters('aesop_image_defaults', shortcode_atts($defaults, $atts)); // offset styles $offsetstyle = $atts['offset'] && ('left' == $atts['align'] || 'right' == $atts['align']) ? sprintf('style=margin-%s:%s;width:%s;', $atts['align'], $atts['offset'], $atts['imgwidth']) : 'style=max-width:' . $atts['imgwidth'] . ';'; // custom classes $classes = function_exists('aesop_component_classes') ? aesop_component_classes('image', '') : null; // let this be used multiple times static $instance = 0; $instance++; $unique = sprintf('%s-%s', get_the_ID(), $instance); // lazy loader class $lazy_holder = AI_CORE_URL . '/public/assets/img/aesop-lazy-holder.png'; $lazy = class_exists('AesopLazyLoader') && !is_user_logged_in() ? sprintf('src="%s" data-src="%s" class="aesop-lazy-img"', $lazy_holder, esc_url($atts['img'])) : sprintf('src="%s"', esc_url($atts['img'])); // automatic alt tag fallback if none specified $auto_alt = $atts['img'] ? basename($atts['img']) : null; $alt = $atts['alt'] ? $atts['alt'] : preg_replace('/\\.[^.\\s]{3,4}$/', '', $auto_alt); // combine into component shell ob_start(); do_action('aesop_image_before', $atts, $unique); // action ?> <div id="aesop-image-component-<?php echo esc_html($unique); ?> " <?php echo aesop_component_data_atts('image', $unique, $atts); ?> class="aesop-component aesop-image-component <?php echo sanitize_html_class($classes); ?> " > <?php do_action('aesop_image_inside_top', $atts, $unique); // action ?> <div class="aesop-content"> <figure class="aesop-image-component-image aesop-component-align-<?php echo sanitize_html_class($atts['align']); ?> aesop-image-component-caption-<?php echo sanitize_html_class($atts['captionposition']); ?> " <?php echo esc_attr($offsetstyle); ?> > <?php do_action('aesop_image_inner_inside_top', $atts, $unique); // action if ('on' == $atts['lightbox']) { ?> <a class="aesop-lightbox" href="<?php echo $atts['img']; ?> " title="<?php echo $atts['caption']; ?> "> <p class="aesop-img-enlarge"><i class="aesopicon aesopicon-search-plus"></i> <?php _e('Enlarge', 'aesop-core'); ?> </p> <img <?php echo $lazy; ?> alt="<?php echo esc_attr($alt); ?> "> </a> <?php } else { ?> <img <?php echo $lazy; ?> alt="<?php echo esc_attr($alt); ?> "> <?php } if ($atts['caption']) { ?> <figcaption class="aesop-image-component-caption"> <?php echo aesop_component_media_filter($atts['caption']); if ($atts['credit']) { ?> <p class="aesop-cap-cred"><?php echo esc_html($atts['credit']); ?> </p> <?php } ?> </figcaption> <?php } ?> <?php do_action('aesop_image_inner_inside_bottom', $atts, $unique); // action ?> </figure> </div> <?php do_action('aesop_image_inside_bottom', $atts, $unique); // action ?> </div> <?php do_action('aesop_image_after', $atts, $unique); // action return ob_get_clean(); }
function aesop_video_shortcode($atts) { // let this be used multiple times static $instance = 0; $instance++; $unique = sprintf('%s-%s', get_the_ID(), $instance); $defaults = array('width' => '100%', 'align' => 'center', 'src' => 'youtube', 'hosted' => '', 'id' => '', 'disable_for_mobile' => 'on', 'loop' => 'on', 'autoplay' => 'on', 'controls' => 'off', 'viewstart' => 'off', 'viewend' => 'off', 'caption' => '', 'vidwidth' => '', 'vidheight' => '', 'poster_frame' => '', 'force_fullwidth' => 'off'); $atts = apply_filters('aesop_video_defaults', shortcode_atts($defaults, $atts)); $contentwidth = 'content' == $atts['width'] ? 'aesop-content' : false; $widthstyle = $atts['width'] && 'center' !== $atts['align'] ? sprintf('style=width:%s;', $atts['width']) : sprintf('style=max-width:%s;', $atts['width']); // width constraint class if $caption = !empty($atts['caption']) ? sprintf('<div class="aesop-video-component-caption aesop-component-align-%s" %s>%s</div>', $atts['align'], $widthstyle, $atts['caption']) : false; if ('vine' == $atts['src'] || 'instagram' == $atts['src']) { $vineStagramClass = 'aesop-vine-stagram-container'; $vineStagramAlign = $atts['align'] ? sprintf('aesop-vine-stagram-container-%s', $atts['align']) : false; } else { $vineStagramAlign = null; $vineStagramClass = null; } $loopstatus = 'on' == $atts['loop'] ? true : false; $autoplaystatus = 'on' == $atts['autoplay'] ? true : false; $disable_for_mobile = 'on' == $atts['disable_for_mobile'] ? true : false; $controlstatus = 'on' == $atts['controls'] ? 'controls-visible' : 'controls-hidden'; $iframe_height = $atts['vidheight'] ? sprintf('height="%s"', preg_replace('/[^0-9]/', '', $atts['vidheight'])) : sprintf('height=""'); $iframe_width = $atts['vidwidth'] ? sprintf('width="%s"', preg_replace('/[^0-9]/', '', $atts['vidwidth'])) : sprintf('width=""'); $iframe_size = sprintf('%s %s', $iframe_height, $iframe_width); // custom classes $classes = function_exists('aesop_component_classes') ? aesop_component_classes('video', '') : null; // waypoint filter $point = 'bottom-in-view'; $waypoint = apply_filters('aesop_video_component_waypoint', $point, $unique); ob_start(); do_action('aesop_video_before', $atts, $unique); // action ?> <div id="aesop-video-<?php echo esc_attr($unique); ?> " <?php echo aesop_component_data_atts('video', $unique, $atts); ?> class="aesop-component aesop-video-component aesop-component-align-<?php echo sanitize_html_class($atts['align']); ?> <?php echo sanitize_html_class($classes); ?> <?php echo sanitize_html_class($controlstatus); ?> <?php echo sanitize_html_class($contentwidth); ?> <?php echo sanitize_html_class($vineStagramClass); ?> <?php echo sanitize_html_class($vineStagramAlign); ?> "> <?php do_action('aesop_video_inside_top', $atts, $unique); // action ?> <div class="aesop-video-container aesop-video-container-<?php echo esc_attr($unique); ?> aesop-component-align-<?php echo sanitize_html_class($atts['align']); ?> <?php echo sanitize_html_class($atts['src']); ?> " <?php echo $widthstyle; ?> > <?php if ('on' == $atts['viewstart'] && 'self' == $atts['src'] && !wp_is_mobile()) { $autoplaystatus = false; ?> <script> jQuery(document).ready(function($){ $('#aesop-video-<?php echo esc_attr($unique); ?> ').arrive('.mejs-video', function(){ $('#aesop-video-<?php echo esc_attr($unique); ?> ').waypoint({ offset: '<?php echo esc_attr($waypoint); ?> ', handler: function(direction){ $('#aesop-video-<?php echo esc_attr($unique); ?> .mejs-playpause-button button').trigger('click'); } }); <?php if ('on' == $atts['viewend']) { ?> $('#aesop-video-<?php echo esc_attr($unique); ?> ').waypoint({ handler: function(direction){ $('#aesop-video-<?php echo esc_attr($unique); ?> .mejs-playpause-button button').trigger('click'); } }); <?php } ?> }); $('#aesop-video-<?php echo esc_attr($unique); ?> ').click( function(){ $('#aesop-video-<?php echo esc_attr($unique); ?> mejs-poster' ).hide(); }); }); </script> <?php } //end if switch ($atts['src']) { case 'vimeo': printf('<iframe src="//player.vimeo.com/video/%s" %s webkitAllowFullScreen mozallowfullscreen allowFullScreen wmode="transparent" frameborder="0"></iframe>', esc_attr($atts['id']), esc_attr($iframe_size)); break; case 'dailymotion': printf('<iframe src="//www.dailymotion.com/embed/video/%s" %s webkitAllowFullScreen mozallowfullscreen allowFullScreen wmode="transparent" frameborder="0"></iframe>', esc_attr($atts['id']), esc_attr($iframe_size)); break; case 'youtube': printf('<iframe src="//www.youtube.com/embed/%s?rel=0&wmode=transparent" %s webkitAllowFullScreen mozallowfullscreen allowFullScreen wmode="transparent" frameborder="0"></iframe>', esc_attr($atts['id']), esc_attr($iframe_size)); break; case 'kickstarter': printf('<iframe src="%s" %s scrolling="no" wmode="transparent" frameborder="0"> </iframe>', esc_attr($atts['id']), esc_attr($iframe_size)); break; case 'viddler': printf('<iframe id="viddler-%s" src="//www.viddler.com/embed/%s/" %s mozallowfullscreen="true" webkitallowfullscreen="true"></iframe>', esc_attr($atts['id']), esc_attr($atts['id']), esc_attr($iframe_size)); break; case 'vine': printf('<iframe class="vine-embed" src="//vine.co/v/%s/embed/simple" width="480" height="480" frameborder="0"></iframe><script async src="//platform.vine.co/static/scripts/embed.js" charset="utf-8"></script>', esc_attr($atts['id'])); break; case 'wistia': printf(' <div id="wistia_%s" class="wistia_embed" style="width:640px;height:360px;"> </div> <script charset="ISO-8859-1" src="//fast.wistia.com/assets/external/E-v1.js"></script> <script> wistiaEmbed = Wistia.embed("%s",{videoFoam: true }); </script> ', esc_attr($atts['id']), esc_attr($atts['id'])); break; case 'instagram': printf('<iframe class="instagram-embed" src="//instagram.com/p/%s/embed" width="612" height="710" frameborder="0"></iframe>', esc_attr($atts['id'])); break; case 'self': if (!$disable_for_mobile || !wp_is_mobile()) { if ($atts['poster_frame'] !== '') { ?> <script> jQuery(document).ready(function($){ $('#aesop-video-<?php echo esc_attr($unique); ?> ').click( function(){ $('#aesop-video-<?php echo esc_attr($unique); ?> .mejs-poster' ).remove(); $('#aesop-video-<?php echo esc_attr($unique); ?> .mejs-playpause-button button').trigger('click'); $('#aesop-video-<?php echo esc_attr($unique); ?> ').off('click'); //$('#aesop-video-<?php echo esc_attr($unique); ?> ' ).hide(); }); }); </script> <?php echo do_shortcode('[video src="' . $atts['hosted'] . '" loop="' . esc_attr($loopstatus) . '" autoplay="' . esc_attr($autoplaystatus) . '" poster="' . $atts['poster_frame'] . '"]'); } else { echo do_shortcode('[video src="' . $atts['hosted'] . '" loop="' . esc_attr($loopstatus) . '" autoplay="' . esc_attr($autoplaystatus) . '"]'); } } else { // disable video for mobile if ($atts['poster_frame'] !== '') { $lazy = class_exists('AesopLazyLoader') && !is_user_logged_in() ? sprintf('src="%s" data-src="%s" class="aesop-lazy-img"', $lazy_holder, esc_url($atts['poster_frame'])) : sprintf('src="%s"', $atts['poster_frame']); // ?> <div class="aesop-image-component-image aesop-component-align-<?php echo sanitize_html_class($atts['align']); ?> "> <img <?php echo $lazy; ?> > </div> <?php } else { } } } ?> </div> <?php echo $caption; do_action('aesop_video_inside_bottom', $atts, $unique); // action ?> </div> <?php do_action('aesop_video_after', $atts, $unique); // action return ob_get_clean(); }
function aesop_audio_shortcode($atts) { $defaults = array('title' => '', 'src' => '', 'viewstart' => 'off', 'viewend' => 'off', 'loop' => 'off', 'hidden' => ''); $atts = apply_filters('aesop_audio_defaults', shortcode_atts($defaults, $atts)); // let this be used multiple times static $instance = 0; $instance++; $unique = sprintf('%s-%s', get_the_ID(), $instance); // custom classes $classes = function_exists('aesop_component_classes') ? aesop_component_classes('audio', '') : null; // hidden $hidden = 'on' == $atts['hidden'] ? 'style=height:0;z-index:-1;position:absolute;opacity:0;' : null; // optional title $title = $atts['title'] ? apply_filters('aesop_audio_component_title', sprintf('<h5>%s</h5>', $atts['title'])) : null; // loop $loop = 'on' == $atts['loop'] ? 'true' : false; // waypoint filter $point = 'bottom-in-view'; $waypoint = apply_filters('aesop_audio_component_waypoint', $point, $unique); ob_start(); do_action('aesop_audio_before', $atts, $unique); // action ?> <aside id="aesop-audio-<?php echo esc_attr($unique); ?> " <?php echo aesop_component_data_atts('audio', $unique, $atts); ?> class="aesop-component aesop-audio-component <?php echo sanitize_html_class($classes); ?> " <?php echo esc_attr($hidden); ?> > <?php if ('on' == $atts['viewstart']) { ?> <script> jQuery(document).ready(function($){ $('#aesop-audio-<?php echo esc_attr($unique); ?> ').arrive('.mejs-audio', function(){ $('#aesop-audio-<?php echo esc_attr($unique); ?> ').waypoint({ offset: '<?php echo esc_attr($waypoint); ?> ', handler: function(direction){ $('#aesop-audio-<?php echo esc_attr($unique); ?> .mejs-playpause-button button').css({'cursor':'pointer'}).click(); } }); <?php if ('on' == $atts['viewend']) { ?> $('#aesop-audio-<?php echo esc_attr($unique); ?> ').waypoint({ handler: function(direction){ $('#aesop-audio-<?php echo esc_attr($unique); ?> .mejs-playpause-button button').css({'cursor':'pointer'}).click(); } }); <?php } ?> }); }); </script> <?php } //end if do_action('aesop_audio_inside_top', $atts, $unique); // action if ($title) { echo aesop_component_media_filter($title); } echo wp_audio_shortcode(array('src' => $atts['src'], 'loop' => $loop)); do_action('aesop_audio_inside_bottom', $atts, $unique); // action ?> </aside><?php do_action('aesop_audio_after', $atts, $unique); // action return ob_get_clean(); }
/** * Main gallery component * * @since 1.0.0 */ public function aesop_post_gallery($atts) { global $post; // attributes $defaults = array('id' => '', 'a_type' => ''); $atts = shortcode_atts($defaults, $atts); // gallery ID $gallery_id = isset($atts['id']) ? (int) $atts['id'] : false; // alias to new atts type // let this be used multiple times static $instance = 0; $instance++; $unique = sprintf('%s-%s', $gallery_id, $instance); // get gallery images and custom attrs $image_ids = get_post_meta($gallery_id, '_ase_gallery_images', true); $image_ids = array_map('intval', explode(',', $image_ids)); $type = get_post_meta($gallery_id, 'aesop_gallery_type', true); $width = get_post_meta($gallery_id, 'aesop_gallery_width', true); // gallery caption $gallery_caption = get_post_meta($gallery_id, 'aesop_gallery_caption', true); // custom classes $classes = aesop_component_classes('gallery', ''); ob_start(); do_action('aesop_gallery_before', $type, $gallery_id, $atts, $unique); // action ?> <div id="aesop-gallery-<?php echo esc_attr($unique); ?> " <?php echo aesop_component_data_atts('gallery', $gallery_id, $atts); ?> class="aesop-component aesop-gallery-component aesop-<?php echo esc_attr($type); ?> -gallery-wrap <?php echo sanitize_html_class($classes); ?> <?php if (empty($gallery_id)) { echo 'empty-gallery'; } ?> "><?php do_action('aesop_gallery_inside_top', $type, $gallery_id, $atts, $unique); // action if (!empty($image_ids)) { switch ($type) { case 'thumbnail': $this->aesop_thumb_gallery($gallery_id, $image_ids, $width); break; case 'grid': $this->aesop_grid_gallery($gallery_id, $image_ids, $width); break; case 'stacked': $this->aesop_stacked_gallery($image_ids, $unique); break; case 'sequence': $this->aesop_sequence_gallery($image_ids); break; case 'photoset': $this->aesop_photoset_gallery($gallery_id, $image_ids, $width); break; default: $this->aesop_grid_gallery($gallery_id, $image_ids, $width); break; } if ($gallery_caption) { printf('<p class="aesop-component-caption">%s</p>', esc_html($gallery_caption)); } // provide the edit link to the backend edit if Aesop Editor is not active if (!function_exists('lasso_editor_components') && is_user_logged_in() && current_user_can('edit_post', get_the_ID())) { $url = admin_url('post.php?post=' . $gallery_id . '&action=edit'); $edit_gallery = __('edit gallery', 'aesop-core'); printf('<a class="aesop-gallery-edit aesop-content" href="%s" target="_blank" title="%s">(%s)</a>', $url, $edit_gallery, $edit_gallery); } } //end if if (empty($gallery_id) && is_user_logged_in() && current_user_can('edit_post', get_the_ID())) { if (function_exists('lasso_editor_components')) { ?> <div contenteditable="false" class="lasso--empty-component"><?php _e('Setup a gallery by clicking the <span class="lasso-icon-gear"></span> icon above.', 'aesop-core'); ?> </div><?php } else { ?> <div class="aesop-error aesop-content"><?php _e('This gallery is empty! It\'s also possible that you simply have the wrong gallery ID.', 'aesop-core'); ?> </div><?php } } do_action('aesop_gallery_inside_bottom', $type, $gallery_id, $atts, $unique); // action ?> </div><?php do_action('aesop_gallery_after', $type, $gallery_id, $atts, $unique); // action return ob_get_clean(); }
function aesop_chapter_shortcode($atts) { $defaults = array('title' => '', 'subtitle' => '', 'bgtype' => 'img', 'img' => '', 'full' => ''); $atts = apply_filters('aesop_chapter_defaults', shortcode_atts($defaults, $atts)); // let this be used multiple times static $instance = 0; $instance++; $unique = sprintf('%s-%s', get_the_ID(), $instance); ob_start(); $inline_styles = 'background-size:cover;background-position:center center;'; $styles = apply_filters('aesop_chapter_img_styles_' . esc_attr($unique), esc_attr($inline_styles)); $img_style = 'img' == $atts['bgtype'] && $atts['img'] ? sprintf('style="background:url(\'%s\');%s"', esc_url($atts['img']), $styles) : 'style="height:auto;" '; $img_style_class = 'img' == $atts['bgtype'] && $atts['img'] ? 'has-chapter-image' : 'no-chapter-image'; $video_chapter_class = 'video' == $atts['bgtype'] ? 'aesop-video-chapter' : null; $full_class = 'on' == $atts['full'] ? 'aesop-chapter-full' : false; do_action('aesop_chapter_before', $atts, $unique); // action ?> <div id="chapter-unique-<?php echo $unique; ?> " <?php echo aesop_component_data_atts('chapter', $unique, $atts); ?> class="aesop-article-chapter-wrap default-cover <?php echo $video_chapter_class; ?> aesop-component <?php echo $img_style_class; ?> <?php echo $full_class; ?> " > <?php do_action('aesop_chapter_inside_top', $atts, $unique); // action ?> <div class="aesop-article-chapter clearfix" <?php echo $img_style; ?> > <h2 class="aesop-cover-title" itemprop="title" data-title="<?php echo esc_attr($atts['title']); ?> "> <span><?php echo esc_html($atts['title']); ?> </span> <?php if ($atts['subtitle']) { ?> <small><?php echo esc_html($atts['subtitle']); ?> </small> <?php } ?> </h2> <?php if ('video' == $atts['bgtype']) { ?> <div class="video-container"> <?php echo do_shortcode('[video src="' . esc_url($atts['img']) . '" loop="on" autoplay="on"]'); ?> </div> <?php } ?> </div> <?php do_action('aesop_chapter_inside_bottom', $atts, $unique); // action ?> </div> <?php do_action('aesop_chapter_after', $atts, $unique); // action return ob_get_clean(); }
function aesop_map_shortcode($atts) { $defaults = array('height' => 500, 'sticky' => 'off'); wp_enqueue_script('aesop-map-script', AI_CORE_URL . '/public/includes/libs/leaflet/leaflet.js'); wp_enqueue_style('aesop-map-style', AI_CORE_URL . '/public/includes/libs/leaflet/leaflet.css', AI_CORE_VERSION, true); $atts = apply_filters('aesop_map_defaults', shortcode_atts($defaults, $atts)); // sticky maps class $sticky = 'off' !== $atts['sticky'] ? sprintf('aesop-sticky-map-%s', esc_attr($atts['sticky'])) : null; // clean height $get_height = 'off' == $atts['sticky'] ? preg_replace('/[^0-9]/', '', $atts['height']) : null; $height = $get_height ? sprintf('style="height:%spx;"', $get_height) : null; // custom classes $classes = function_exists('aesop_component_classes') ? aesop_component_classes('map', '') : null; // get markers - since 1.3 $markers = get_post_meta(get_the_ID(), 'ase_map_component_locations', false); // filterable map marker waypoint offset - since 1.3 // 50% means when the id hits 50% from the top the waypoint will fire $marker_waypoint_offset = apply_filters('aesop_map_waypoint_offset', '50%'); $default_location = is_single(); $location = apply_filters('aesop_map_component_appears', $default_location); static $instance = 0; $instance++; $unique = sprintf('%s-%s', get_the_ID(), $instance); ob_start(); do_action('aesop_map_before', $atts, $unique); $url = admin_url('post.php?post=' . get_the_ID() . '&action=edit'); $edit_map = __('Add Map Markers', 'aesop-core'); $add_markers = sprintf('<a href="%s" target="_blank" title="%s">(%s)</a>', $url, $edit_map, $edit_map); if (empty($markers) && is_user_logged_in() && current_user_can('edit_post', get_the_ID()) && !function_exists('lasso_editor_components')) { ?> <div class="aesop-error aesop-content"><?php _e('Add some markers ' . $add_markers . ' to activate the map.', 'aesop-core'); ?> </div><?php } ?> <div id="aesop-map-component" <?php echo aesop_component_data_atts('map', $unique, $atts); ?> class="aesop-component aesop-map-component <?php echo sanitize_html_class($classes); ?> " <?php echo $height; ?> > <?php /** * if sticky and we have markers do scroll waypoints * * @since 1.3 */ if ('off' !== $atts['sticky'] && $markers && $location) { ?> <!-- Aesop Sticky Maps --> <script> jQuery(document).ready(function(){ jQuery('body').addClass('aesop-sticky-map <?php echo esc_attr($sticky); ?> '); map.invalidateSize(); <?php $i = 0; foreach ($markers as $key => $marker) { $i++; $loc = sprintf('%s,%s', $marker['lat'], $marker['lng']); ?> jQuery('#aesop-map-marker-<?php echo absint($i); ?> ').waypoint({ offset: '<?php echo esc_attr($marker_waypoint_offset); ?> ', handler: function(direction){ map.panTo(new L.LatLng(<?php echo esc_attr($loc); ?> )); } }); <?php } ?> }); </script><?php } ?> </div><?php do_action('aesop_map_before', $atts, $unique); return ob_get_clean(); }