total_gallery_formatter.module in Total Gallery Formatter 7
A gallery formatter that gives you the Total control.
File
total_gallery_formatter.moduleView source
<?php
/**
* @file
* A gallery formatter that gives you the Total control.
*/
/**
* Implements hook_field_formatter_info().
*/
function total_gallery_formatter_field_formatter_info() {
return array(
'total_gallery_formatter' => array(
'label' => t('TGF: Gallery with carousel'),
'field types' => array(
'image',
),
'description' => t('Display multiple images as a Gallery with carousel'),
'settings' => array(
'slides_options' => array(
'slide_style' => 'large',
'scroll_fx' => 'fade',
'direction' => 'left',
'slide_duration' => 500,
'slide_controls' => 1,
'autoplay' => 0,
'style' => 'nostyle',
'responsive' => 0,
),
'pagination_options' => array(
'thumb_style' => 'thumbnail',
'items_carousel' => 3,
'circular' => 1,
'infinite' => 1,
'pag_duration' => 500,
'easing' => 'linear',
),
'colorbox_options' => array(
'colorbox' => 0,
'big_style' => 0,
),
),
),
'tgf_carousel' => array(
'label' => t('TGF: Carousel'),
'field types' => array(
'image',
),
'description' => t('Display multiple images as a carousel'),
'settings' => array(
'general_options' => array(
'items_style' => 'thumbnail',
'scroll_fx' => 'scroll',
'direction' => 'left',
'easing' => 'linear',
'slide_duration' => 500,
'items_carousel' => 4,
'autoplay' => 0,
'circular' => 1,
'infinite' => 1,
'style' => 'nostyle',
'responsive' => 0,
),
'colorbox_options' => array(
'colorbox' => 0,
'big_style' => 0,
),
),
),
);
}
/**
* Implements hook_field_formatter_settings_form().
*/
function total_gallery_formatter_field_formatter_settings_form($field, $instance, $view_mode, $form, &$form_state) {
$display = $instance['display'][$view_mode];
$settings = $display['settings'];
$element = array();
if ($display['type'] == 'total_gallery_formatter') {
$image_styles = array();
foreach (image_styles() as $key => $style) {
$image_styles[$key] = $key;
}
$element['slides_options'] = array(
'#title' => t('Slides Options'),
'#type' => 'fieldset',
'#collapsible' => TRUE,
'#collapsed' => TRUE,
);
$element['slides_options']['slide_style'] = array(
'#title' => t('Slide Image Style'),
'#type' => 'select',
'#default_value' => $settings['slides_options']['slide_style'],
'#options' => $image_styles,
'#description' => t('Select the image style for currently selected image'),
);
$element['slides_options']['scroll_fx'] = array(
'#title' => t('Scroll Effect'),
'#type' => 'select',
'#default_value' => $settings['slides_options']['scroll_fx'],
'#options' => array(
'none' => t('None'),
'scroll' => t('Scroll'),
'directscroll' => t('Direct Scroll'),
'fade' => t('Fade'),
'crossfade' => t('CrossFade'),
'cover' => t('Cover'),
'cover-fade' => t('CoverFade'),
'uncover' => t('Uncover'),
'uncover-fade' => t('UncoverFade'),
),
'#description' => t('Select effect to use when carousel slides'),
);
$element['slides_options']['direction'] = array(
'#title' => t('Direction'),
'#type' => 'select',
'#default_value' => $settings['slides_options']['direction'],
'#options' => array(
'left' => t('Left'),
'right' => t('Right'),
'up' => t('Up'),
'down' => t('Down'),
),
'#description' => t('Select direction to use when carousel slides'),
);
$element['slides_options']['slide_duration'] = array(
'#title' => t('Slide scroll duration'),
'#type' => 'textfield',
'#description' => t('Determines the duration of the slide transition in milliseconds.'),
'#default_value' => $settings['slides_options']['slide_duration'],
'#size' => 5,
'#maxlength' => 5,
'#required' => TRUE,
);
$element['slides_options']['responsive'] = array(
'#title' => t('Responsive'),
'#type' => 'checkbox',
'#default_value' => $settings['slides_options']['responsive'],
'#description' => t('Select if the gallery will be responsive.'),
);
$element['slides_options']['slide_controls'] = array(
'#title' => t('Slide controls'),
'#type' => 'checkbox',
'#default_value' => $settings['slides_options']['slide_controls'],
'#description' => t('Select if the slide will have prev and next buttons'),
);
$element['slides_options']['autoplay'] = array(
'#title' => t('Autoplay'),
'#type' => 'checkbox',
'#default_value' => $settings['slides_options']['autoplay'],
'#description' => t('Select if the carousel will have automatic scrolling'),
);
$element['slides_options']['style'] = array(
'#title' => t('Style'),
'#type' => 'select',
'#default_value' => $settings['slides_options']['style'],
'#options' => array(
'nostyle' => t('No style'),
'elegant' => t('Elegant'),
),
'#description' => t('Select the style for the gallery.'),
);
$element['pagination_options'] = array(
'#title' => t('Pagination Options'),
'#type' => 'fieldset',
'#collapsible' => TRUE,
'#collapsed' => TRUE,
);
$element['pagination_options']['thumb_style'] = array(
'#title' => t('Thumbnail Image Style'),
'#type' => 'select',
'#default_value' => $settings['pagination_options']['thumb_style'],
'#options' => $image_styles,
'#description' => t('Select the image style for pagination thumbnail images'),
);
$element['pagination_options']['items_carousel'] = array(
'#title' => t('Carousel Items'),
'#type' => 'textfield',
'#description' => t('Select the number of visible items in the pagination carousel'),
'#default_value' => $settings['pagination_options']['items_carousel'],
'#size' => 2,
'#maxlength' => 3,
'#required' => TRUE,
);
$element['pagination_options']['circular'] = array(
'#title' => t('Circular'),
'#type' => 'checkbox',
'#default_value' => $settings['pagination_options']['circular'],
'#description' => t('Select if the carousel should be circular.'),
);
$element['pagination_options']['infinite'] = array(
'#title' => t('Infinite'),
'#type' => 'checkbox',
'#default_value' => $settings['pagination_options']['infinite'],
'#description' => t('Select if the carousel will come back to start when finishes.'),
);
$element['pagination_options']['pag_duration'] = array(
'#title' => t('Pagination scroll duration'),
'#type' => 'textfield',
'#description' => t('Determines the duration of the pagination transition in milliseconds.'),
'#default_value' => $settings['pagination_options']['pag_duration'],
'#size' => 5,
'#maxlength' => 5,
'#required' => TRUE,
);
$element['pagination_options']['easing'] = array(
'#title' => t('Pagination easing'),
'#type' => 'select',
'#default_value' => $settings['pagination_options']['easing'],
'#options' => array(
'linear' => t('Linear'),
'quadratic' => t('Quadratic'),
'cubic' => t('Cubic'),
'elastic' => t('Elastic'),
),
'#description' => t('Select the pagination easing.'),
);
if (module_exists('colorbox')) {
$element['colorbox_options'] = array(
'#title' => t('Colorbox Options'),
'#type' => 'fieldset',
'#collapsible' => TRUE,
'#collapsed' => TRUE,
);
$element['colorbox_options']['colorbox'] = array(
'#title' => t('Open in Colorbox'),
'#type' => 'checkbox',
'#default_value' => $settings['colorbox_options']['colorbox'],
'#description' => t('Select if the slides will be opened in Colorbox, when user click on it.'),
);
$image_styles[0] = t('None (original image)');
$element['colorbox_options']['big_style'] = array(
'#title' => t('Colorbox Image Style'),
'#type' => 'select',
'#default_value' => $settings['colorbox_options']['big_style'],
'#options' => $image_styles,
'#description' => t('Select the image style for colorbox image'),
);
}
}
// Only Carousel.
if ($display['type'] == 'tgf_carousel') {
$image_styles = array();
foreach (image_styles() as $key => $style) {
$image_styles[$key] = $key;
}
$element['general_options'] = array(
'#title' => t('General Options'),
'#type' => 'fieldset',
'#collapsible' => TRUE,
'#collapsed' => TRUE,
);
$element['general_options']['items_style'] = array(
'#title' => t('Items Image Style'),
'#type' => 'select',
'#default_value' => $settings['general_options']['items_style'],
'#options' => $image_styles,
'#description' => t('Select the image style for items'),
);
$element['general_options']['scroll_fx'] = array(
'#title' => t('Scroll Effect'),
'#type' => 'select',
'#default_value' => $settings['general_options']['scroll_fx'],
'#options' => array(
'none' => t('None'),
'scroll' => t('Scroll'),
'directscroll' => t('Direct Scroll'),
'fade' => t('Fade'),
'crossfade' => t('CrossFade'),
'cover' => t('Cover'),
'cover-fade' => t('CoverFade'),
'uncover' => t('Uncover'),
'uncover-fade' => t('UncoverFade'),
),
'#description' => t('Select effect to use when carousel items'),
);
$element['general_options']['direction'] = array(
'#title' => t('Direction'),
'#type' => 'select',
'#default_value' => $settings['general_options']['direction'],
'#options' => array(
'left' => t('Left'),
'right' => t('Right'),
'up' => t('Up'),
'down' => t('Down'),
),
'#description' => t('Select direction to use when carousel items'),
);
$element['general_options']['slide_duration'] = array(
'#title' => t('Slide scroll duration'),
'#type' => 'textfield',
'#description' => t('Determines the duration of the slide transition in milliseconds.'),
'#default_value' => $settings['general_options']['slide_duration'],
'#size' => 5,
'#maxlength' => 5,
'#required' => TRUE,
);
$element['general_options']['easing'] = array(
'#title' => t('Pagination easing'),
'#type' => 'select',
'#default_value' => $settings['general_options']['easing'],
'#options' => array(
'linear' => t('Linear'),
'quadratic' => t('Quadratic'),
'cubic' => t('Cubic'),
'elastic' => t('Elastic'),
),
'#description' => t('Select the pagination easing.'),
);
$element['general_options']['style'] = array(
'#title' => t('Style'),
'#type' => 'select',
'#default_value' => $settings['general_options']['style'],
'#options' => array(
'nostyle' => t('No style'),
'elegant' => t('Elegant'),
),
'#description' => t('Select the style for the gallery.'),
);
$element['general_options']['items_carousel'] = array(
'#title' => t('Carousel Items'),
'#type' => 'textfield',
'#description' => t('Select the number of visible items in the pagination carousel'),
'#default_value' => $settings['general_options']['items_carousel'],
'#size' => 2,
'#maxlength' => 3,
'#required' => TRUE,
);
$element['general_options']['responsive'] = array(
'#title' => t('Responsive'),
'#type' => 'checkbox',
'#default_value' => $settings['slides_options']['responsive'],
'#description' => t('Select if the gallery will be responsive.'),
);
$element['general_options']['autoplay'] = array(
'#title' => t('Autoplay'),
'#type' => 'checkbox',
'#default_value' => $settings['general_options']['autoplay'],
'#description' => t('Select if the carousel will have automatic scrolling'),
);
$element['general_options']['circular'] = array(
'#title' => t('Circular'),
'#type' => 'checkbox',
'#default_value' => $settings['general_options']['circular'],
'#description' => t('Select if the carousel should be circular.'),
);
$element['general_options']['infinite'] = array(
'#title' => t('Infinite'),
'#type' => 'checkbox',
'#default_value' => $settings['general_options']['infinite'],
'#description' => t('Select if the carousel will come back to start when finishes.'),
);
if (module_exists('colorbox')) {
$element['colorbox_options'] = array(
'#title' => t('Colorbox Options'),
'#type' => 'fieldset',
'#collapsible' => TRUE,
'#collapsed' => TRUE,
);
$element['colorbox_options']['colorbox'] = array(
'#title' => t('Open in Colorbox'),
'#type' => 'checkbox',
'#default_value' => $settings['colorbox_options']['colorbox'],
'#description' => t('Select if the slides will be opened in Colorbox, when user click on it.'),
);
$image_styles[0] = t('None (original image)');
$element['colorbox_options']['big_style'] = array(
'#title' => t('Colorbox Image Style'),
'#type' => 'select',
'#default_value' => $settings['colorbox_options']['big_style'],
'#options' => $image_styles,
'#description' => t('Select the image style for colorbox image'),
);
}
}
return $element;
}
/**
* Implements hook_field_formatter_settings_summary().
*/
function total_gallery_formatter_field_formatter_settings_summary($field, $instance, $view_mode) {
$display = $instance['display'][$view_mode];
$settings = $display['settings'];
$summary = '';
if ($display['type'] == 'total_gallery_formatter') {
$summary .= '<strong>' . t('-» SLIDES «-') . '</strong><br />';
$summary .= '<strong>' . t('Image style for currently selected image') . ':</strong> ' . $settings['slides_options']['slide_style'] . '<br />';
$summary .= '<strong>' . t('Scroll FX') . ':</strong> ' . $settings['slides_options']['scroll_fx'] . ' | ';
$summary .= '<strong>' . t('Direction') . ':</strong> ' . $settings['slides_options']['direction'] . '<br />';
$summary .= '<strong>' . t('AutoPlay') . ':</strong> ' . ($settings['slides_options']['autoplay'] == 1 ? 'Yes' : 'No') . ' | ';
$summary .= '<strong>' . t('Duration') . ':</strong> ' . $settings['slides_options']['slide_duration'] . '<br />';
$summary .= '<strong>' . t('Is responsive') . ':</strong> ' . ($settings['slides_options']['responsive'] == 1 ? 'Yes' : 'No') . ' | ';
$summary .= '<strong>' . t('Controls') . ':</strong> ' . ($settings['slides_options']['slide_controls'] == 1 ? 'Yes' : 'No') . ' | ';
$summary .= '<strong>' . t('Style') . ':</strong> ' . $settings['slides_options']['style'] . '<br /><br />';
$summary .= '<strong>' . t('-» PAGINATION «-') . '</strong><br />';
$summary .= '<strong>' . t('Image style for small images') . ':</strong> ' . $settings['pagination_options']['thumb_style'] . '<br />';
$summary .= '<strong>' . t('Carousel Items') . ':</strong> ' . $settings['pagination_options']['items_carousel'] . ' | ';
$summary .= '<strong>' . t('Circular') . ':</strong> ' . ($settings['pagination_options']['circular'] == 1 ? 'Yes' : 'No') . ' | ';
$summary .= '<strong>' . t('Infinite') . ':</strong> ' . ($settings['pagination_options']['infinite'] == 1 ? 'Yes' : 'No') . '<br />';
$summary .= '<strong>' . t('Duration') . ':</strong> ' . $settings['pagination_options']['pag_duration'] . ' | ';
$summary .= '<strong>' . t('Easing') . ':</strong> ' . $settings['pagination_options']['easing'] . '<br /><br />';
if (module_exists('colorbox')) {
$summary .= '<strong>' . t('-» COLORBOX «-') . '</strong><br />';
$summary .= '<strong>' . t('Open in Colorbox') . ':</strong> ' . ($settings['colorbox_options']['colorbox'] == 1 ? 'Yes' : 'No') . '<br />';
$summary .= '<strong>' . t('Image style for colorbox image') . ':</strong> ' . ($settings['colorbox_options']['big_style'] ? $settings['colorbox_options']['big_style'] : 'Original Image');
}
}
// Only Carousel.
if ($display['type'] == 'tgf_carousel') {
$summary .= '<strong>' . t('-» SLIDES «-') . '</strong><br />';
$summary .= '<strong>' . t('Image style for items') . ':</strong> ' . $settings['general_options']['items_style'] . '<br />';
$summary .= '<strong>' . t('Scroll FX') . ':</strong> ' . $settings['general_options']['scroll_fx'] . ' | ';
$summary .= '<strong>' . t('Easing') . ':</strong> ' . $settings['general_options']['easing'] . ' | ';
$summary .= '<strong>' . t('Direction') . ':</strong> ' . $settings['general_options']['direction'] . '<br />';
$summary .= '<strong>' . t('Responsive') . ':</strong> ' . ($settings['general_options']['responsive'] == 1 ? 'Yes' : 'No') . ' | ';
$summary .= '<strong>' . t('AutoPlay') . ':</strong> ' . ($settings['general_options']['autoplay'] == 1 ? 'Yes' : 'No') . ' | ';
$summary .= '<strong>' . t('Duration') . ':</strong> ' . $settings['general_options']['slide_duration'] . '<br />';
$summary .= '<strong>' . t('Style') . ':</strong> ' . $settings['general_options']['style'] . '<br />';
$summary .= '<strong>' . t('Carousel Items') . ':</strong> ' . $settings['general_options']['items_carousel'] . ' | ';
$summary .= '<strong>' . t('Circular') . ':</strong> ' . ($settings['general_options']['circular'] == 1 ? 'Yes' : 'No') . ' | ';
$summary .= '<strong>' . t('Infinite') . ':</strong> ' . ($settings['general_options']['infinite'] == 1 ? 'Yes' : 'No') . '<br /><br />';
if (module_exists('colorbox')) {
$summary .= '<strong>' . t('-» COLORBOX «-') . '</strong><br />';
$summary .= '<strong>' . t('Open in Colorbox') . ':</strong> ' . ($settings['colorbox_options']['colorbox'] == 1 ? 'Yes' : 'No') . '<br />';
$summary .= '<strong>' . t('Image style for colorbox image') . ':</strong> ' . ($settings['colorbox_options']['big_style'] ? $settings['colorbox_options']['big_style'] : 'Original Image');
}
}
return $summary;
}
/**
* Implements hook_field_formatter_view().
*/
function total_gallery_formatter_field_formatter_view($entity_type, $entity, $field, $instance, $langcode, $items, $display) {
$settings = $display['settings'];
$element = array();
switch ($display['type']) {
case 'total_gallery_formatter':
if (empty($items)) {
return $element;
}
// Get the unique entity id for grouping in Colorbox.
$ids = entity_extract_ids($entity_type, $entity);
$entity_id = $ids[0];
// Get the dimension of image styles.
$thumb_image_style = image_style_load($settings['pagination_options']['thumb_style']);
$slide_image_style = image_style_load($settings['slides_options']['slide_style']);
$thumb_image_width = 0;
$thumb_image_height = 0;
$slide_image_width = 0;
$slide_image_height = 0;
foreach ($thumb_image_style['effects'] as $effect) {
if ($effect['name'] == 'image_scale_and_crop' || $effect['name'] == 'image_scale') {
$thumb_image_width = $effect['data']['width'];
$thumb_image_height = $effect['data']['height'];
break;
}
}
foreach ($slide_image_style['effects'] as $effect) {
if ($effect['name'] == 'image_scale_and_crop') {
$slide_image_width = $effect['data']['width'];
$slide_image_height = $effect['data']['height'];
break;
}
}
// Buildind Carrousel structure.
$element[0] = array(
'#type' => 'container',
'#attributes' => array(
'class' => array(
drupal_html_class('tgf-container'),
),
'id' => 'tgf-container-' . $entity_id,
),
);
if ($settings['slides_options']['responsive']) {
$element[0]['#attributes']['class'][] = 'tgf-responsive';
}
if ($settings['slides_options']['slide_controls']) {
$element[0]['prev_button'] = array(
'#type' => 'html_tag',
'#tag' => 'a',
'#value' => '<',
'#attributes' => array(
'class' => array(
drupal_html_class('tgf-prev-button'),
),
'href' => '#',
),
);
$element[0]['next-button'] = array(
'#type' => 'html_tag',
'#tag' => 'a',
'#value' => '>',
'#attributes' => array(
'class' => array(
drupal_html_class('tgf-next-button'),
),
'href' => '#',
),
);
}
$element[0]['main-image-container'] = array(
'#type' => 'container',
'#attributes' => array(
'class' => array(
drupal_html_class('tgf-slides'),
),
),
);
foreach ($items as $delta => $item) {
// Finding the size for effects different to scale and crop.
if (!$slide_image_width) {
$image_style_path = image_style_path($settings['slides_options']['slide_style'], $item['uri']);
$image_style_info = image_get_info($image_style_path);
if (!empty($image_style_info)) {
$slide_image_width = $image_style_info['width'];
$slide_image_height = $image_style_info['height'];
}
}
$image = array(
'#theme' => 'image_style',
'#style_name' => $settings['slides_options']['slide_style'],
'#path' => $item['uri'],
'#width' => $slide_image_width,
'#height' => $slide_image_height,
);
// Add title if is setted.
if ($item['title']) {
$image['#title'] = $item['title'];
}
// Add alt if is setted.
if ($item['alt']) {
$image['#alt'] = $item['alt'];
}
// Defining the Big Style URL, for colorbox use purpose.
if ($settings['colorbox_options']['big_style']) {
$big_style_url = image_style_url($settings['colorbox_options']['big_style'], $item['uri']);
}
else {
$big_style_url = file_create_url($item['uri']);
}
// If "Open in colorbox" option is enabled an <a/> will wrap the image.
if ($settings['colorbox_options']['colorbox']) {
$link_attributes = array(
'class' => array(
drupal_html_class('tgf-slide-item'),
),
'rel' => 'group' . $entity_id,
'data-slide-id' => $delta,
);
// Add title if is setted.
if ($item['alt']) {
$link_attributes['title'] = $item['alt'];
}
elseif ($item['title']) {
$link_attributes['title'] = $item['title'];
}
$element[0]['main-image-container']['image'][$delta] = array(
'#markup' => l(render($image), $big_style_url, array(
'attributes' => $link_attributes,
'html' => TRUE,
)),
);
}
else {
$element[0]['main-image-container']['image'][$delta] = array(
'#type' => 'html_tag',
'#tag' => 'div',
'#value' => render($image),
'#attributes' => array(
'class' => array(
drupal_html_class('tgf-slide-item'),
),
'data-slide-id' => $delta,
),
);
}
}
if (count($items) > 1) {
$element[0]['controls-container'] = array(
'#type' => 'container',
'#attributes' => array(
'class' => array(
drupal_html_class('tgf-controls-container'),
),
),
);
$element[0]['controls-container']['prev-button'] = array(
'#type' => 'html_tag',
'#tag' => 'a',
'#value' => '<',
'#attributes' => array(
'class' => array(
drupal_html_class('tgf-pag-prev-button'),
),
'href' => '#',
),
);
$element[0]['controls-container']['thumb-images-container'] = array(
'#type' => 'container',
'#attributes' => array(
'class' => array(
drupal_html_class('tgf-pagination'),
),
),
);
$element[0]['controls-container']['next-button'] = array(
'#type' => 'html_tag',
'#tag' => 'a',
'#value' => '>',
'#attributes' => array(
'class' => array(
drupal_html_class('tgf-pag-next-button'),
),
'href' => '#',
),
);
foreach ($items as $delta => $item) {
$selected = $delta == 0 ? 'selected' : '';
$image = array(
'#theme' => 'image_style',
'#style_name' => $settings['pagination_options']['thumb_style'],
'#path' => $item['uri'],
'#width' => $thumb_image_width,
'#height' => $thumb_image_height,
'#attributes' => array(
'class' => array(
drupal_html_class('tgf-pag-item'),
drupal_html_class($selected),
),
'data-slide-id' => $delta,
),
);
// Add title if is setted.
if ($item['title']) {
$image['#title'] = $item['title'];
}
// Add alt if is setted.
if ($item['alt']) {
$image['#alt'] = $item['alt'];
}
$element[0]['controls-container']['thumb-images-container']['image'][$delta] = array(
'#markup' => render($image),
);
}
}
// Prepare data to send to js.
$carousel_configuration = array(
'responsive' => $settings['slides_options']['responsive'],
'scrollFx' => $settings['slides_options']['scroll_fx'],
'direction' => $settings['slides_options']['direction'],
'slideDuration' => $settings['slides_options']['slide_duration'],
'autoplay' => $settings['slides_options']['autoplay'],
'itemsVisible' => $settings['pagination_options']['items_carousel'],
'circular' => $settings['pagination_options']['circular'],
'infinite' => $settings['pagination_options']['infinite'],
'easing' => $settings['pagination_options']['easing'],
'pagDuration' => $settings['pagination_options']['pag_duration'],
'colorbox' => $settings['colorbox_options']['colorbox'],
);
// Sending data to js.
$element[0]['#attached']['js'][] = array(
'data' => array(
'totalGalleryFormatter' => array(
'galleryCarouselConfiguration' => $carousel_configuration,
),
),
'type' => 'setting',
);
libraries_load('imagesloaded');
libraries_load('carouFredSel');
$element[0]['#attached']['library'][] = array(
'total_gallery_formatter',
'caroufredsel',
);
$element[0]['#attached']['library'][] = array(
'total_gallery_formatter',
'imagesloaded',
);
$element[0]['#attached']['js'][] = drupal_get_path('module', 'total_gallery_formatter') . '/js/tgf-gallery-with-carousel.js';
$element[0]['#attached']['css'][] = drupal_get_path('module', 'total_gallery_formatter') . '/css/total-gallery-formatter.css';
// Preparing css to use.
switch ($settings['slides_options']['style']) {
case 'elegant':
$element[0]['#attached']['css'][] = drupal_get_path('module', 'total_gallery_formatter') . '/styles/elegant/tgf-elegant.css';
break;
}
break;
case 'tgf_carousel':
if (empty($items)) {
return $element;
}
// Get the unique entity id for grouping in Colorbox.
$ids = entity_extract_ids($entity_type, $entity);
$entity_id = $ids[0];
// Get the dimension of image styles.
$slide_image_style = image_style_load($settings['general_options']['items_style']);
$slide_image_width = 0;
$slide_image_height = 0;
foreach ($slide_image_style['effects'] as $effect) {
if ($effect['name'] == 'image_scale_and_crop' || $effect['name'] == 'image_scale') {
$slide_image_width = $effect['data']['width'];
$slide_image_height = $effect['data']['height'];
break;
}
}
// Buildind Carrousel structure.
$element[0] = array(
'#type' => 'container',
'#attributes' => array(
'class' => array(
drupal_html_class('tgf-carousel-container'),
),
'id' => 'tgf-carousel-container-' . $entity_id,
),
);
if ($settings['general_options']['responsive']) {
$element[0]['#attributes']['class'][] = 'tgf-responsive';
}
$element[0]['prev_button'] = array(
'#type' => 'html_tag',
'#tag' => 'a',
'#value' => '<',
'#attributes' => array(
'class' => array(
drupal_html_class('tgf-prev-button'),
),
'href' => '#',
),
);
$element[0]['next-button'] = array(
'#type' => 'html_tag',
'#tag' => 'a',
'#value' => '>',
'#attributes' => array(
'class' => array(
drupal_html_class('tgf-next-button'),
),
'href' => '#',
),
);
$element[0]['main-image-container'] = array(
'#type' => 'container',
'#attributes' => array(
'class' => array(
drupal_html_class('tgf-slides'),
),
),
);
foreach ($items as $delta => $item) {
$image = array(
'#theme' => 'image_style',
'#style_name' => $settings['general_options']['items_style'],
'#path' => $item['uri'],
'#width' => $slide_image_width,
'#height' => $slide_image_height,
);
// Add title if is setted.
if ($item['title']) {
$image['#title'] = $item['title'];
}
// Add alt if is setted.
if ($item['alt']) {
$image['#alt'] = $item['alt'];
}
// Defining the Big Style URL, for colorbox use purpose.
if ($settings['colorbox_options']['big_style']) {
$big_style_url = image_style_url($settings['colorbox_options']['big_style'], $item['uri']);
}
else {
$big_style_url = file_create_url($item['uri']);
}
// If "Open in colorbox" option is enabled an <a/> will wrap the image.
if ($settings['colorbox_options']['colorbox']) {
$element[0]['main-image-container']['image'][$delta] = array(
'#markup' => l(render($image), $big_style_url, array(
'attributes' => array(
'class' => array(
drupal_html_class('tgf-slide-item'),
),
'rel' => 'group' . $entity_id,
'data-slide-id' => $delta,
),
'html' => TRUE,
)),
);
}
else {
$element[0]['main-image-container']['image'][$delta] = array(
'#type' => 'html_tag',
'#tag' => 'div',
'#value' => render($image),
'#attributes' => array(
'class' => array(
drupal_html_class('tgf-slide-item'),
),
'data-slide-id' => $delta,
),
);
}
}
// Prepare data to send to js.
$carousel_configuration = array(
'responsive' => $settings['general_options']['responsive'],
'scrollFx' => $settings['general_options']['scroll_fx'],
'direction' => $settings['general_options']['direction'],
'slideDuration' => $settings['general_options']['slide_duration'],
'autoplay' => $settings['general_options']['autoplay'],
'itemsVisible' => $settings['general_options']['items_carousel'],
'circular' => $settings['general_options']['circular'],
'infinite' => $settings['general_options']['infinite'],
'easing' => $settings['general_options']['easing'],
'colorbox' => $settings['colorbox_options']['colorbox'],
);
// Sending data to js.
$element[0]['#attached']['js'][] = array(
'data' => array(
'totalGalleryFormatter' => array(
'carouselConfiguration' => $carousel_configuration,
),
),
'type' => 'setting',
);
libraries_load('imagesloaded');
libraries_load('carouFredSel');
$element[0]['#attached']['library'][] = array(
'total_gallery_formatter',
'caroufredsel',
);
$element[0]['#attached']['library'][] = array(
'total_gallery_formatter',
'imagesloaded',
);
$element[0]['#attached']['js'][] = drupal_get_path('module', 'total_gallery_formatter') . '/js/tgf-carousel.js';
$element[0]['#attached']['css'][] = drupal_get_path('module', 'total_gallery_formatter') . '/css/total-gallery-formatter.css';
// Preparing css to use.
switch ($settings['general_options']['style']) {
case 'elegant':
$element[0]['#attached']['css'][] = drupal_get_path('module', 'total_gallery_formatter') . '/styles/elegant/tgf-elegant.css';
break;
}
break;
}
return $element;
}
/**
* Implements hook_libraries_info().
*/
function total_gallery_formatter_libraries_info() {
return array(
'carouFredSel' => array(
'name' => 'CarouFredSel',
'vendor url' => 'https://github.com/gilbitron/carouFredSel',
'download url' => 'https://github.com/gilbitron/carouFredSel',
'version arguments' => array(
'file' => 'jquery.carouFredSel-6.2.1-packed.js',
'pattern' => '/(?i:carouFredSel)\\s(\\d.+)/',
'lines' => 5,
),
'files' => array(
'js' => array(
'jquery.carouFredSel-6.2.1-packed.js',
),
),
),
'imagesloaded' => array(
'name' => 'ImagesLoaded',
'vendor url' => 'http://imagesloaded.desandro.com/',
'download url' => 'https://github.com/desandro/imagesloaded',
'version arguments' => array(
'file' => 'imagesloaded.pkgd.min.js',
'pattern' => '/(?i:packaged)\\sv(\\d.+)/',
'lines' => 5,
),
'files' => array(
'js' => array(
'imagesloaded.pkgd.min.js',
),
),
),
);
}