/** * Enqueue scripts and styles */ function photonfill_enqueue_assets() { if (photonfill_use_lazyload()) { wp_enqueue_script('lazysizesjs', photonfill_get_baseurl() . '/js/lazysizes.min.js', array('jquery'), '1.2.3rc1'); } wp_enqueue_script('picturefilljs', photonfill_get_baseurl() . '/js/picturefill.min.js', array('jquery'), '2.3.1'); }
/** * Enqueue scripts and styles */ function photonfill_enqueue_assets() { wp_enqueue_script('picturefilljs', photonfill_get_baseurl() . 'js/picturefill.min.js', array('jquery'), '2.3.1', true); if (photonfill_use_lazyload()) { wp_enqueue_script('lazysizesjs', photonfill_get_baseurl() . 'js/lazysizes.min.js', array('jquery'), '1.2.3rc1', true); if (is_admin()) { add_filter('mce_external_plugins', 'photonfill_admin_tinymce_js'); } } //Fieldmanager Media Metabox Fixes if (is_admin()) { wp_enqueue_script('photonfill-admin', photonfill_get_baseurl() . 'js/photonfill-admin.js', array('jquery')); wp_localize_script('photonfill-admin', 'photonfill_wp_vars', array('wp_ajax_url' => admin_url('admin-ajax.php'), 'photonfill_get_img_object_nonce' => wp_create_nonce('photonfill_get_img_object'), 'photonfill_i18n' => array('remove' => __('remove', 'photonfill')))); } }
/** * Generate a picture element for any attachment id. */ public function get_attachment_picture($attachment_id, $size = 'full', $attr) { if (!empty($attachment_id) && wp_attachment_is_image($attachment_id)) { // This means post thumbnail was called w/o a size arg. if ('post-thumbnail' == $size) { $size = 'full'; } $html = ''; if (photonfill_use_lazyload()) { $html = $this->get_lazyload_image($attachment_id, $size, $attr); } else { $featured_image = $this->create_image_object($attachment_id, $size); $default_breakpoint = $size; $default_srcset = ''; if (!empty($featured_image['id'])) { $classes = $this->get_image_classes(empty($attr['class']) ? array() : $attr['class'], $attachment_id, $size); $alt = !empty($attr['alt']) ? ' alt=' . esc_attr($attr['alt']) : ''; $html = '<picture id="picture-' . esc_attr($attachment_id) . '" class="' . esc_attr($classes) . ' " data-id=' . esc_attr($featured_image['id']) . '">'; // Here we set our source elements foreach ($featured_image['sizes'] as $breakpoint => $breakpoint_data) { // If specified as default img fallback. if (!empty($breakpoint_data['src']['default'])) { $default_breakpoint = array($breakpoint_data['src']['width'], $breakpoint_data['src']['height']); $default_srcset = $breakpoint_data['src']['url']; } // Set our source element $srcset_url = esc_url($breakpoint_data['src']['url']); $use_pixel_density = !empty($breakpoint_data['size']['pixel-density']) ? true : false; if ($use_pixel_density && $breakpoint_data['size']['pixel-density'] > 1) { // Need to grab scaled up photon args here $srcset_url .= ', ' . esc_url($breakpoint_data['src']['url2x']) . ' 2x'; } // Set Source media Attribute $srcset_media = ''; $unit = !empty($breakpoint_data['size']['unit']) && in_array($breakpoint_data['size']['unit'], $this->valid_units) ? $breakpoint_data['size']['unit'] : 'px'; if (!empty($breakpoint_data['size']['min'])) { $srcset_media .= '(min-width: ' . esc_attr($breakpoint_data['size']['min'] . $unit) . ')'; } if (!empty($breakpoint_data['size']['max'])) { $srcset_media .= !empty($breakpoint_data['size']['min']) ? ' and ' : ''; $srcset_media .= '(max-width: ' . esc_attr($breakpoint_data['size']['max'] . $unit) . ')'; } if (empty($srcset_media)) { $srcset_media = 'all'; } // Write source element $html .= "<source srcset=\"{$srcset_url}\" media=\"{$srcset_media}\" />"; } // No fallback default has been set. if (empty($default_srcset) && is_array($default_breakpoint) || is_string($default_breakpoint)) { $default_src = wp_get_attachment_image_src($attachment_id, $default_breakpoint); $default_srcset = $default_src[0]; } // Set our default img element $html .= '<img srcset="' . esc_url($default_srcset) . '"' . $alt . '>'; $html .= '</picture>'; } } return $html; } return; }