...
 
Commits (8)
# Lazy-load
[Lazy-load][1] is a simple Drupal module which integrates [bLazy][2]
lazy-loading script via image field *display formatters* and *input-filters* for
inline images and iframes.
This is a simple Drupal module to lazy-load all inline images and/or iframes
defined by content authors in entity content, usually the text-format-enabled
version of textarea fields. i.e. Node and Block body content.
There is another contributed module utilizing its namesake, [Blazy][3]. Make
sure to check it out, especially if you need more advanced features and support
for many features out of the box.
The module currently depends on the [bLazy][1] image script.
This module started to fill-in the only area Blazy module lacks of;
**inline-images** and **inline-iframes**. Now, Lazy-load can also be enabled for
each image field as well.
There is another contributed module utilizing its namesake, [Blazy][2].
Make sure to check it out, especially if you need more advanced features and
support for many features out of the box.
You can use [Lazy-load][1] module tandem with [Blazy][3], though that is not a
requirement.
This module focuses on the only area Blazy module lacks of; **inline-images**
and **inline-iframes**.
## Requirements
You can still use this module tandem with it, though that is not a requirement.
* **[Libraries API][5]** module (Drupal 7 only)
* **bLazy v1.8.2** script as a library item
## Requirements
## Installing Manually
* **[Libraries API][4]** module
* **bLazy v1.8.2** script as a library item:
[Download bLazy][3] from https://github.com/dinbror/blazy
1) Extract the downloaded file,
2) rename *blazy-master* directory to *blazy*,
3) copy the folder into one of the following places that *Libraries API*
- [Download bLazy][4] from https://github.com/dinbror/blazy
- Extract the downloaded file,
- rename *blazy-master* directory to *blazy*,
- copy the folder into one of the following places that *Libraries API*
module supports, `sites/all/libraries` (or site-specific libraries folder):
i.e.: `sites/all/libraries/blazy/blazy.min.js`
i.e.: `sites/all/libraries/blazy/blazy.min.js`
## Installing via Composer
- Run `composer require --prefer-dist composer/installers` to ensure that you
have the `composer/installers` package installed. This package facilitates the
installation of packages into directories other than `/vendor`
(e.g. `/libraries`) using Composer.
- If your `composer.json` doesn’t already have a definition for the libraries
path, define one similar to the one below, depending on your setup:
``` json
"extra": {
"installer-paths": {
"web/sites/all/libraries/{$name}": ["type:drupal-library"]
}
}
```
- Add following to the “repositories” section of `composer.json`:
``` json
"repositories": [
{
"type": "package",
"package": {
"name": "dinbror/blazy",
"version": "1.8.2",
"type": "drupal-library",
"extra": {
"installer-name": "blazy"
},
"source": {
"type": "git",
"url": "https://github.com/dinbror/blazy",
"reference": "1.8.2"
}
}
}
]
```
- Install the required **Blazy** library:
`composer require 'dinbror/blazy:1.8.2'`
- Install this module:
`composer require 'drupal/lazy:^1.0'`
## Installation
## Usage
There are two options to set up for your site to lazy-load images. And both options share the same [settings](/admin/config/content/lazy).
Install the module as usual. More information can be found at
https://www.drupal.org/docs/7/extend/installing-modules
1. Image fields
2. Inline images and Iframes managed in rich-text fields (ckeditor)
## Usage
### Image Fields
1. Go to **Manage display** page of the entity type you want to enable lazy-loading. *i.e. Article*
2. Select the **display** you want the change. *i.e. Teaser*
3. Change the format from `Image` to
`Lazy-load image` to enable lazy-loading for the selected field.
The `Image` formatter settings for
_image style_ and _link image to_ should remain unchanged.
### Inline images and Iframes
1. **Configure** the [text format](/admin/config/content/formats) you want to enable lazy-loading. *i.e. Full HTML*
2. Check **Lazy-load images and IFRAMEs via bLazy** option to enable the filter, and save configuration.
3. Go to [Lazy-load settings](/admin/config/content/lazy).
4. Check the boxes for the inline elements to be lazy-loaded via filter `<img>` `<iframe>`
5. Save configuration
*Repeat steps 1-2 for each text-format you want to enable lazy-loading.*
To disable lazy-loading for specific image or iframes, add **skip-class** to the
class attribute. Default value (no-b-lazy) can be changed in the configuration.
``` html
<img class="no-b-lazy" src="this-image-will-load-normal" alt="">
```
### Blazy plugin can be manupulated in your theme/module javascript:
This modules makes a new text filter available for the text-formats: *Lazy-load*
The options in **Blazy configuration** section of the settings form are the default options of the Blazy library. Refer to [Blazy plugin documentation][5] for each setting.
Enable the *Lazy-load* filter for the desired text-formats. i.e. *Full HTML* or
*Filtered HTML*
#### Get Blazy plugin options.
```js
let opt = Drupal.settings.lazy ? Drupal.settings.lazy : {};
```
Check out the module configuration at `admin/config/content/lazy`. The default
settings should work for most developers. Incase they are not, change the
settings to suit your needs and submit the form.
#### Access Blazy's public functions:
| Function | Description |
|:--|:--|
| `Drupal.lazy.revalidate();` | Revalidates document for visible images. Useful if you add images with scripting or ajax |
| `Drupal.lazy.load(element(s), force);` | Forces the given element(s) to load if not collapsed. If you also want to load a collapsed/hidden elements you can add true as the second parameter. You can pass a single element or a list of elements. Tested with getElementById, getElementsByClassName, querySelectorAll, querySelector and jQuery selector. |
| `Drupal.lazy.destroy();` | Unbind events and resets image array |
This configuration is used globally for all the text-formats having *Lazy-load*
filter enabled.
## Use Case
......@@ -61,7 +140,8 @@ rewrites the `<img>` and/or `<iframe>` tags in already rendered output to have
them compatible for bLazy script to lazy-load. Since the filtered output is
cached, there should not be any changes in performance.
[1]: http://dinbror.dk/blazy/
[2]: https://www.drupal.org/project/blazy
[3]: https://github.com/dinbror/blazy/archive/master.zip
[4]: https://www.drupal.org/project/libraries
[1]: https://www.drupal.org/project/lazy
[2]: http://dinbror.dk/blazy/
[3]: https://www.drupal.org/project/blazy
[4]: https://github.com/dinbror/blazy/archive/master.zip
[5]: https://www.drupal.org/project/libraries
......@@ -11,10 +11,6 @@
function lazy_configuration_form($form, $form_state) {
$defaults = variable_get('lazy_filter_defaults');
$filter_enabled = lazy_is_filter_enabled();
$description = t('The %filter filter must be enabled for at least one <a href="!path">text-format</a>.', array(
'!path' => url('admin/config/content/formats'),
'%filter' => 'Lazy-load',
));
$form['settings'] = array(
'#type' => 'fieldset',
......@@ -30,23 +26,30 @@ function lazy_configuration_form($form, $form_state) {
'iframe' => t('Iframes (%iframe tags)', array('%iframe' => '<iframe>')),
),
'#default_value' => variable_get('lazy_filter_alter_tag', $defaults['lazy_filter_alter_tag']),
'#description' => $filter_enabled ? '' : $description,
'#description' => t('Only selected tags will be lazy-loaded in activated text-formats.'),
'#disabled' => !$filter_enabled,
);
$form['settings']['lazy_filter_image_fields'] = array(
'#type' => 'checkbox',
'#title' => t('Enable on image fields attached to fieldable entities. For example, content-types, blocks.'),
'#description' => t('Default is %val', array('%val' => ($defaults['lazy_filter_loadInvisible']) ? 'checked' : 'unchecked')),
'#default_value' => variable_get('lazy_filter_image_fields', $defaults['lazy_filter_image_fields']),
'#return_value' => TRUE,
);
$form['settings']['lazy_filter_placeholderSrc'] = array(
'#type' => 'textfield',
'#title' => t('Placeholder image URL'),
'#description' => t('Default is %val', array('%val' => $defaults['lazy_filter_placeholderSrc'])),
'#default_value' => variable_get('lazy_filter_placeholderSrc', $defaults['lazy_filter_placeholderSrc']),
'#size' => 100,
);
$form['paths'] = array(
'#type' => 'fieldset',
'#title' => t('Disabled pages'),
'#description' => t('<p>There could be pages Lazy-loading should be disabled; set them here.</p>'),
'#collapsible' => TRUE,
'#collapsed' => TRUE,
);
$form['paths']['lazy_disabled_paths'] = array(
'#type' => 'textarea',
'#title' => t('Lazy-loading is disabled for both <em>image fields</em> and <em>inline images/iframes</em> in content on following pages'),
'#default_value' => variable_get('lazy_disabled_paths', $defaults['lazy_disabled_paths']),
'#description' => t('Specify pages by using their paths. Enter one path per line.'),
);
$form['blazy'] = array(
......@@ -128,6 +131,15 @@ function lazy_configuration_form($form, $form_state) {
'#value' => t('Save configuration'),
);
// Notify the user if the library is not available, and disable the form.
$library_installed = variable_get('lazy_library_installed');
if (!$library_installed) {
drupal_set_message(t('The bLazy library could not be found.'), 'warning');
drupal_set_message(t('Follow the instructions in the README.md file or in the <a href="!url">help</a> page for installing the bLazy library.', array('!url' => url('admin/help/lazy'))), 'status');
$form['submit']['#attributes']['disabled'] = TRUE;
}
return $form;
}
......@@ -151,7 +163,10 @@ function lazy_configuration_form_submit($form, &$form_state) {
$value = intval($value);
}
if (in_array($key, $bool_value)) {
$value = boolval($value);
$value = !!$value;
}
if ('string' === gettype($value)) {
$value = trim($value);
}
variable_set($key, $value);
}
......
name = Lazy-load
description = "This module integrates bLazy script to lazy load inline images and/or iframes via input-filters."
description = "This module integrates bLazy script via image field display formatters and input-filters for inline images and iframes."
core = 7.x
dependencies[] = drupal:filter
dependencies[] = libraries
......
......@@ -21,7 +21,7 @@ function lazy_install() {
'lazy_filter_successClass' => 'b-loaded',
'lazy_filter_validateDelay' => 25,
'lazy_filter_placeholderSrc' => 'data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==',
'lazy_filter_image_fields' => FALSE,
'lazy_disabled_paths' => 'rss.xml',
);
variable_set('lazy_filter_defaults', $defaults);
......@@ -39,7 +39,7 @@ function lazy_enable() {
'%filter' => 'Lazy-load',
'!path' => url('admin/config/content/formats'),
);
$message = t('The <a href="!config">Lazy</a> module was installed. The new %filter filter should be enabled in desired <a href="!path">text-formats</a>.', $options);
$message = t('The <a href="!config">Lazy-load</a> module was installed. The new %filter filter should be enabled in desired <a href="!path">text-formats</a>.', $options);
drupal_set_message($message, 'warning');
}
......@@ -60,6 +60,8 @@ function lazy_uninstall() {
variable_del('lazy_filter_validateDelay');
variable_del('lazy_filter_placeholderSrc');
variable_del('lazy_filter_image_fields');
variable_del('lazy_library_installed');
variable_del('lazy_disabled_paths');
$module = 'lazy';
$name = 'lazy_filter';
......@@ -67,6 +69,42 @@ function lazy_uninstall() {
->condition('module', $module)
->condition('name', $name)
->execute();
// Revert image field formatters back to `image`.
$lazy_enabled_fields = array();
$field_map = field_info_field_map();
$i = 1;
$max_messages = 10;
foreach ($field_map as $field_name => $field) {
if ($field['type'] === 'image') {
foreach ($field['bundles'] as $entity_type => $bundle) {
$field_instance = field_info_instance($entity_type, $field_name, $bundle[0]);
foreach ($field_instance['display'] as $display_name => $display) {
if ($field_instance['display'][$display_name]['module'] === 'lazy') {
$field_instance['display'][$display_name]['type'] = 'image';
$field_instance['display'][$display_name]['module'] = 'image';
field_update_instance($field_instance);
if ($i <= $max_messages) {
drupal_set_message(t('The %label (<code>!field_name</code>) field in %bundle (!entity_type) type is reverted back in the %display display mode.', array(
'%label' => $field_instance['label'],
'!field_name' => $field_instance['field_name'],
'%bundle' => $field_instance['bundle'],
'!entity_type' => $field_instance['entity_type'],
'%display' => $display_name,
)),
'warning',
TRUE
);
}
$i++;
}
}
}
}
}
if ($i > $max_messages) {
drupal_set_message(t('Also reverted back %no other image fields.', array('%no' => $i - $max_messages)));
}
}
/**
......@@ -90,6 +128,8 @@ function lazy_requirements($phase) {
$requirements['blazy']['description'] = $blazy['error message'];
$requirements['blazy']['severity'] = REQUIREMENT_ERROR;
}
variable_set('lazy_library_installed', $blazy['installed']);
}
return $requirements;
......@@ -127,3 +167,46 @@ function lazy_update_7100() {
variable_set('lazy_filter_defaults', $defaults);
variable_set('lazy_filter_image_fields', $defaults['lazy_filter_image_fields']);
}
/**
* Disable module, if bLazy library is not installed yet.
*/
function lazy_update_7101() {
$blazy = libraries_detect('blazy');
variable_set('lazy_library_installed', $blazy['installed']);
}
/**
* New configuration option to set which pages should disable Lazy-loading.
*/
function lazy_update_7102() {
$defaults = variable_get('lazy_filter_defaults');
$defaults['lazy_disabled_paths'] = 'rss.xml';
variable_set('lazy_filter_defaults', $defaults);
variable_set('lazy_disabled_paths', $defaults['lazy_disabled_paths']);
}
/**
* Image fields now use display formatter to enable lazy-loading per field.
*/
function lazy_update_7103() {
$image_fields = variable_get('lazy_filter_image_fields');
if ($image_fields) {
$field_map = field_info_field_map();
foreach ($field_map as $field_name => $field) {
if ($field['type'] === 'image') {
foreach ($field['bundles'] as $entity_type => $bundle) {
$field_instance = field_info_instance($entity_type, $field_name, $bundle[0]);
foreach ($field_instance['display'] as $display_name => $display) {
if ($field_instance['display'][$display_name]['type'] === 'image') {
$field_instance['display'][$display_name]['type'] = 'lazy';
$field_instance['display'][$display_name]['module'] = 'lazy';
field_update_instance($field_instance);
}
}
}
}
}
}
variable_del('lazy_filter_image_fields');
}
......@@ -4,8 +4,8 @@
Drupal.behaviors.lazy = {
attach: function (context, settings) {
var options = settings.lazy.bLazy ? settings.lazy.bLazy : {};
new Blazy(options);
var options = settings.lazy ? settings.lazy : {};
Drupal.lazy = new Blazy(options);
}
};
......
......@@ -21,6 +21,13 @@ function lazy_menu() {
);
}
/**
* Implements hook_init().
*/
function lazy_init() {
$library = lazy_is_library_installed();
}
/**
* Implements hook_help().
*/
......@@ -61,8 +68,7 @@ function lazy_help($path, $arg) {
*/
function lazy_filter_info() {
$filters['lazy_filter'] = array(
'title' => t('Lazy-load'),
'description' => t('Lazy-load inline-images and/or iframes'),
'title' => t('Lazy-load images and IFRAMEs via bLazy'),
'default settings' => _filter_lazy_defaults(),
'process callback' => '_filter_lazy_process',
'cache' => TRUE,
......@@ -89,7 +95,6 @@ function _filter_lazy_defaults() {
'lazy_filter_successClass' => variable_get('lazy_filter_successClass'),
'lazy_filter_validateDelay' => variable_get('lazy_filter_validateDelay'),
'lazy_filter_placeholderSrc' => variable_get('lazy_filter_placeholderSrc'),
'lazy_filter_image_fields' => variable_get('lazy_filter_image_fields'),
);
}
......@@ -102,29 +107,33 @@ function _filter_lazy_process($text, $filter) {
$opt_tags = variable_get('lazy_filter_alter_tag');
$opt_src = (variable_get('lazy_filter_src') !== 'src') ? variable_get('lazy_filter_src') : 'data-filterlazy-src';
$opt_placeholderSrc = variable_get('lazy_filter_placeholderSrc');
$library_installed = variable_get('lazy_library_installed');
$disabled_paths = preg_split("/\s+/", variable_get('lazy_disabled_paths'));
$html_dom = filter_dom_load($text);
if ($library_installed && !in_array(drupal_get_path_alias(), $disabled_paths)) {
$html_dom = filter_dom_load($text);
foreach ($opt_tags as $tag) {
$matches = $html_dom->getElementsByTagName($tag);
foreach ($matches as $element) {
$classes = $element->getAttribute('class');
$classes = (strlen($classes) > 0) ? explode(' ', $classes) : [];
foreach ($opt_tags as $tag) {
$matches = $html_dom->getElementsByTagName($tag);
foreach ($matches as $element) {
$classes = $element->getAttribute('class');
$classes = (strlen($classes) > 0) ? explode(' ', $classes) : [];
if (!in_array($opt_skipClass, $classes)) {
$classes[] = $opt_selector;
$element->setAttribute('class', implode(' ', $classes));
if (!in_array($opt_skipClass, $classes)) {
$classes[] = $opt_selector;
$element->setAttribute('class', implode(' ', $classes));
$src = $element->getAttribute('src');
$element->removeAttribute('src');
$src = $element->getAttribute('src');
$element->removeAttribute('src');
$element->setAttribute($opt_src, $src);
$element->setAttribute('src', $opt_placeholderSrc);
$element->setAttribute($opt_src, $src);
$element->setAttribute('src', $opt_placeholderSrc);
}
}
}
}
$text = filter_dom_serialize($html_dom);
$text = filter_dom_serialize($html_dom);
}
return trim($text);
}
......@@ -163,37 +172,80 @@ function lazy_is_filter_enabled() {
return count($enabled_formats) ? TRUE : FALSE;
}
/**
* Is any of the image fields using the `Lazy-load image` formatter?
*/
function lazy_is_field_enabled() {
$lazy_enabled_fields = array();
$field_map = field_info_field_map();
foreach ($field_map as $field_name => $field) {
if ($field['type'] === 'image') {
foreach ($field['bundles'] as $entity_type => $bundle) {
$field_instance = field_info_instance($entity_type, $field_name, $bundle[0]);
foreach ($field_instance['display'] as $display_name => $display) {
if ($field_instance['display'][$display_name]['type'] === 'lazy') {
$lazy_enabled_fields[] = implode('-', array(
$field_instance['entity_type'],
$field_instance['field_name'],
$display_name,
));
}
}
}
}
}
return !!count($lazy_enabled_fields);
}
/**
* Is Blazy library installed.
*/
function lazy_is_library_installed() {
$blazy = libraries_detect('blazy');
$blazy_installed = variable_get('lazy_library_installed');
if ($blazy['installed'] !== $blazy_installed) {
variable_set('lazy_library_installed', $blazy['installed']);
}
return $blazy['installed'];
}
/**
* Implements hook_page_build().
*/
function lazy_page_build(&$page) {
$filter_enabled = lazy_is_filter_enabled();
$field_enabled = variable_get('lazy_filter_image_fields');
if ($filter_enabled || $field_enabled) {
$path = drupal_get_path('module', 'lazy');
$page['page_bottom']['lazy'] = array(
'#attached' => array(),
);
$attached = &$page['page_bottom']['lazy']['#attached'];
$settings = array(
'errorClass' => variable_get('lazy_filter_errorClass'),
'loadInvisible' => variable_get('lazy_filter_loadInvisible'),
'offset' => intval(variable_get('lazy_filter_offset')),
'saveViewportOffsetDelay' => intval(variable_get('lazy_filter_saveViewportOffsetDelay')),
'selector' => '.' . variable_get('lazy_filter_selector'),
'src' => variable_get('lazy_filter_src'),
'successClass' => variable_get('lazy_filter_successClass'),
'validateDelay' => intval(variable_get('lazy_filter_validateDelay')),
);
$attached['js'][] = array(
'data' => array('lazy' => array('bLazy' => $settings)),
'type' => 'setting',
);
$attached['libraries_load'][] = array('blazy');
$attached['js'][$path . '/lazy.js'] = array('every_page' => TRUE);
$field_enabled = lazy_is_field_enabled();
$library_installed = variable_get('lazy_library_installed');
if ($library_installed) {
if ($filter_enabled || $field_enabled) {
$path = drupal_get_path('module', 'lazy');
$page['page_bottom']['lazy'] = array(
'#attached' => array(),
);
$attached = &$page['page_bottom']['lazy']['#attached'];
$settings = array(
'errorClass' => variable_get('lazy_filter_errorClass'),
'loadInvisible' => variable_get('lazy_filter_loadInvisible'),
'offset' => intval(variable_get('lazy_filter_offset')),
'saveViewportOffsetDelay' => intval(variable_get('lazy_filter_saveViewportOffsetDelay')),
'selector' => '.' . variable_get('lazy_filter_selector'),
'src' => variable_get('lazy_filter_src'),
'successClass' => variable_get('lazy_filter_successClass'),
'validateDelay' => intval(variable_get('lazy_filter_validateDelay')),
);
$attached['js'][] = array(
'data' => array('lazy' => $settings),
'type' => 'setting',
);
$attached['libraries_load'][] = array('blazy');
$attached['js'][$path . '/lazy.js'] = array('every_page' => TRUE);
}
}
}
......@@ -249,25 +301,196 @@ function lazy_library_get_version($library, $options) {
}
/**
* Implements hook_theme_registry_alter().
* Implements hook_field_formatter_info().
*/
function lazy_field_formatter_info() {
$formatters = array(
'lazy' => array(
'label' => t('Lazy-load image'),
'field types' => array(
'image',
),
'settings' => array(
'image_style' => '',
'image_link' => '',
),
),
);
return $formatters;
}
/**
* Implements hook_field_formatter_settings_form().
*/
function lazy_field_formatter_settings_form($field, $instance, $view_mode, $form, &$form_state) {
$display = $instance['display'][$view_mode];
$settings = $display['settings'];
$image_styles = image_style_options(FALSE, PASS_THROUGH);
$element['image_style'] = array(
'#title' => t('Image style'),
'#type' => 'select',
'#default_value' => $settings['image_style'],
'#empty_option' => t('None (original image)'),
'#options' => $image_styles,
);
$link_types = array(
'content' => t('Content'),
'file' => t('File'),
);
$element['image_link'] = array(
'#title' => t('Link image to'),
'#type' => 'select',
'#default_value' => $settings['image_link'],
'#empty_option' => t('Nothing'),
'#options' => $link_types,
);
return $element;
}
/**
* Implements hook_field_formatter_settings_summary().
*/
function lazy_theme_registry_alter(&$theme_registry) {
if (variable_get('lazy_filter_image_fields') && isset($theme_registry['image'])) {
$theme_registry['image']['function'] = 'theme_lazy_image';
function lazy_field_formatter_settings_summary($field, $instance, $view_mode) {
$display = $instance['display'][$view_mode];
$settings = $display['settings'];
$summary = array();
$image_styles = image_style_options(FALSE, PASS_THROUGH);
// Unset possible 'No defined styles' option.
unset($image_styles['']);
// Styles could be lost because of enabled/disabled modules that defines
// their styles in code.
if (isset($image_styles[$settings['image_style']])) {
$summary[] = t('Image style: @style', array(
'@style' => $image_styles[$settings['image_style']],
));
}
else {
$summary[] = t('Original image');
}
$link_types = array(
'content' => t('Linked to content'),
'file' => t('Linked to file'),
);
// Display this setting only if image is linked.
if (isset($link_types[$settings['image_link']])) {
$summary[] = $link_types[$settings['image_link']];
}
return implode('<br />', $summary);
}
/**
* Implements hook_field_formatter_view().
*/
function lazy_field_formatter_view($entity_type, $entity, $field, $instance, $langcode, $items, $display) {
$element = array();
// Check if the formatter involves a link.
if ($display['settings']['image_link'] == 'content') {
$uri = entity_uri($entity_type, $entity);
}
elseif ($display['settings']['image_link'] == 'file') {
$link_file = TRUE;
}
// Check if the formatter is set to lazy-load.
// if ($display['type'] === 'lazy') {}
foreach ($items as $delta => $item) {
if (isset($link_file)) {
$uri = array(
'path' => file_create_url($item['uri']),
'options' => array(),
);
}
$element[$delta] = array(
'#theme' => 'lazy_image_formatter',
'#item' => $item,
'#image_style' => $display['settings']['image_style'],
'#path' => isset($uri) ? $uri : '',
);
}
return $element;
}
/**
* Implements hook_theme().
*/
function lazy_theme() {
return array(
'lazy_image' => array(
'variables' => array(
'style_name' => NULL,
'path' => NULL,
'width' => NULL,
'height' => NULL,
'alt' => '',
'title' => NULL,
'attributes' => array(),
),
),
'lazy_image_formatter' => array(
'variables' => array(
'item' => NULL,
'path' => NULL,
'image_style' => NULL,
),
),
);
}
/**
* Overrides theme_image().
* Returns HTML for an image.
*
* @param $variables
* An associative array containing:
* - path: Either the path of the image file (relative to base_path()) or a
* full URL.
* - width: The width of the image (if known).
* - height: The height of the image (if known).
* - alt: The alternative text for text-based browsers. HTML 4 and XHTML 1.0
* always require an alt attribute. The HTML 5 draft allows the alt
* attribute to be omitted in some cases. Therefore, this variable defaults
* to an empty string, but can be set to NULL for the attribute to be
* omitted. Usually, neither omission nor an empty string satisfies
* accessibility requirements, so it is strongly encouraged for code
* calling theme('image') to pass a meaningful value for this variable.
* - http://www.w3.org/TR/REC-html40/struct/objects.html#h-13.8
* - http://www.w3.org/TR/xhtml1/dtds.html
* - http://dev.w3.org/html5/spec/Overview.html#alt
* - title: The title text is displayed when the image is hovered in some
* popular browsers.
* - attributes: Associative array of attributes to be placed in the img tag.
*/
function theme_lazy_image($variables) {
$opt_skipClass = variable_get('lazy_filter_skipClass');
$opt_selector = ltrim(variable_get('lazy_filter_selector'), '.');
$opt_src = (variable_get('lazy_filter_src') !== 'src') ? variable_get('lazy_filter_src') : 'data-filterlazy-src';
$opt_placeholderSrc = variable_get('lazy_filter_placeholderSrc');
$disabled_paths = preg_split("/\s+/", variable_get('lazy_disabled_paths'));
// Skip Blazy rendering if variables contain `.no-b-lazy` CSS class name.
if (!empty($variables['attributes']['class']) && in_array($opt_skipClass, $variables['attributes']['class'])) {
if ($variables['style_name']) {
// Determine the dimensions of the styled image.
$dimensions = array(
'width' => $variables['width'],
'height' => $variables['height'],
);
image_style_transform_dimensions($variables['style_name'], $dimensions);
$variables['width'] = $dimensions['width'];
$variables['height'] = $dimensions['height'];
// Determine the URL for the styled image.
$variables['path'] = image_style_url($variables['style_name'], $variables['path']);
}
// Skip Blazy rendering if...
//
// library is not available OR
// viewing a page listed in disabled pages
if (
!variable_get('lazy_library_installed') ||
in_array(drupal_get_path_alias(), $disabled_paths)
) {
return theme('image', $variables);
}
else {
......@@ -289,3 +512,54 @@ function theme_lazy_image($variables) {
return '<img' . drupal_attributes($attributes) . ' />';
}
}
/**
* Returns HTML for an image field formatter.
*
* @param $variables
* An associative array containing:
* - item: Associative array of image data, which may include "uri", "alt",
* "width", "height", "title" and "attributes".
* - image_style: An optional image style.
* - path: An array containing the link 'path' and link 'options'.
*
* @ingroup themeable
*/
function theme_lazy_image_formatter($variables) {
$item = $variables['item'];
$image = array(
'path' => $item['uri'],
);
if (array_key_exists('alt', $item)) {
$image['alt'] = $item['alt'];
}
if (isset($item['attributes'])) {
$image['attributes'] = $item['attributes'];
}
if (isset($item['width']) && isset($item['height'])) {
$image['width'] = $item['width'];
$image['height'] = $item['height'];
}
// Do not output an empty 'title' attribute.
if (isset($item['title']) && drupal_strlen($item['title']) > 0) {
$image['title'] = $item['title'];
}
if ($variables['image_style']) {
$image['style_name'] = $variables['image_style'];
}
$output = theme('lazy_image', $image);
// The link path and link options are both optional, but for the options to be
// processed, the link path must at least be an empty string.
if (isset($variables['path']['path'])) {
$path = $variables['path']['path'];
$options = isset($variables['path']['options']) ? $variables['path']['options'] : array();
// When displaying an image inside a link, the html option must be TRUE.
$options['html'] = TRUE;
$output = l($output, $path, $options);
}
return $output;
}