5 (function ($, Drupal, drupalSettings, window) {
10 var $body = $('body');
13 * Blazy Colorbox utility functions.
16 * The index of the current element.
17 * @param {HTMLElement} box
18 * The colorbox HTML element.
20 function blazyColorbox(i, box) {
22 var media = $box.data('media') || {};
23 var isMedia = media.type !== 'image' ? true : false;
24 var runtimeOptions = {
25 rel: media.rel || null,
28 var $caption = $box.next('.litebox-caption');
29 return $caption.length ? $caption.html() : '';
31 onComplete: function () {
33 $body.addClass('colorbox-on colorbox-on--' + media.type);
37 $body.addClass('colorbox-on--media');
40 onClosed: function () {
46 * Remove the custom colorbox classes.
48 function removeClasses() {
49 $body.removeClass(function (index, css) {
50 return (css.match(/(^|\s)colorbox-\S+/g) || []).join(' ');
55 * Resize the colorbox.
57 function resizeBox() {
58 window.clearTimeout(cboxTimer);
61 width: media.width || drupalSettings.colorbox.maxWidth,
62 height: media.height || drupalSettings.colorbox.maxHeight
65 cboxTimer = window.setTimeout(function () {
66 if ($('#cboxOverlay').is(':visible')) {
67 var $container = $('#cboxLoadedContent');
68 var $iframe = $('.cboxIframe', $container);
71 $container.addClass('media media--ratio');
72 $iframe.attr('width', o.width).attr('height', o.height).addClass('media__element');
73 $container.css({paddingBottom: (o.height / o.width) * 100 + '%', height: 0});
81 $container.removeClass('media media--ratio');
82 $container.css({paddingBottom: '', height: o.height}).removeClass('media__element');
88 $box.colorbox($.extend({}, drupalSettings.colorbox, runtimeOptions));
92 * Attaches blazy colorbox behavior to HTML element.
94 * @type {Drupal~behavior}
96 Drupal.behaviors.blazyColorbox = {
97 attach: function (context) {
98 if (drupalSettings.colorbox.mobiledetect && window.matchMedia) {
99 // Disable Colorbox for small screens.
100 var mq = window.matchMedia('(max-device-width: ' + drupalSettings.colorbox.mobiledevicewidth + ')');
106 $('[data-colorbox-trigger]', context).once('blazy-colorbox').each(blazyColorbox);
110 })(jQuery, Drupal, drupalSettings, this);