https://dlsaa.com/modules/colorbox_node/colorbox_node.js?t6f94k

1(function ($) {
2    Drupal.behaviors.colorboxNode = {
3        // Lets find our class name and change our URL to
4        // our defined menu path to open in a colorbox modal.
5        attach: function (context, settings) {
6            // Make sure colorbox exists.
7            if (!$.isFunction($.colorbox) || typeof settings.colorbox === 'undefined') {
8                return;
9            }
10
11            // Mobile detection extracted from the colorbox module.
12            // If the mobile setting is turned on, it will turn off the colorbox modal for mobile devices.
13            if (settings.colorbox.mobiledetect && window.matchMedia) {
14                // Disable Colorbox for small screens.
15                var mq = window.matchMedia("(max-device-width: " + settings.colorbox.mobiledevicewidth + ")");
16                if (mq.matches) {
17                    return;
18                }
19            }
20
21            $('.colorbox-node', context).once('init-colorbox-node-processed', function () {
22                $(this).colorboxNode({'launch': false});
23            });
24
25            // When using contextual links and clicking from within the colorbox
26            // we need to close down colorbox when opening the built in overlay.
27            $('ul.contextual-links a', context).once('colorboxNodeContextual').click(function () {
28                $.colorbox.close();
29            });
30        }
31    };
32
33    // Bind our colorbox node functionality to an anchor
34    $.fn.colorboxNode = function (options) {
35        var settings = {
36            'launch': true,
37            'width': Drupal.settings.colorbox_node.width,
38            'height': Drupal.settings.colorbox_node.height
39        };
40
41        $.extend(settings, options);
42
43        var href = $(this).attr('data-href');
44        if (typeof href == 'undefined' || href == false) {
45            href = $(this).attr('href');
46        }
47        // Create an element so we can parse our a URL no matter if its internal or external.
48        var parse = document.createElement('a');
49        parse.href = href;
50
51        if(!href) {
52            alert(Drupal.t('No url found on element'));
53        }
54
55        // Lets add our colorbox link after the base path if necessary.
56        var base_path = Drupal.settings.basePath;
57        var path_prefix = Drupal.settings.pathPrefix;
58        var pathname = parse.pathname;
59
60        // Lets check to see if the pathname has a forward slash.
61        // This problem happens in IE7/IE8
62        if (pathname.charAt(0) != '/') {
63            pathname = '/' + parse.pathname;
64        }
65
66        // If clean URL's are not turned on, lets check for that.
67        var url = $.getParameterByName('q', href);
68        if (base_path != '/') {
69            if (url != '') {
70                var link = pathname.replace(base_path, base_path + parse.search.replace('?q=', '?q=/' + path_prefix + 'colorbox/'));
71            } else {
72                var link = pathname.replace(base_path, base_path + path_prefix + 'colorbox/') + parse.search;
73            }
74        } else {
75            if (url != '') {
76                var link = base_path + parse.search.replace('?q=', '?q=/' + path_prefix + 'colorbox/');
77            } else {
78                var link = base_path + path_prefix + 'colorbox' + pathname + parse.search;
79            }
80        }
81
82        // Bind Ajax behaviors to all items showing the class.
83        var element_settings = {};
84
85        // This removes any loading/progress bar on the clicked link
86        // and displays the colorbox loading screen instead.
87        element_settings.progress = { 'type': 'none' };
88        // For anchor tags, these will go to the target of the anchor rather
89        // than the usual location.
90        if (href) {
91            element_settings.url = link;
92            element_settings.event = 'click';
93        }
94
95        $(this).click(function () {
96            var $this = $(this).clone();
97
98            // Clear out the rel to prevent any confusion if not using the gallery class.
99            if(!$this.hasClass('colorbox-node-gallery')) {
100                $this.attr('rel', '');
101            }
102
103            // Lets extract our width and height giving priority to the data attributes.
104            var innerWidth = $this.data('inner-width');
105            var innerHeight = $this.data('inner-height');
106            if (typeof innerWidth != 'undefined' && typeof innerHeight != 'undefined') {
107                var params = $.urlDataParams(innerWidth, innerHeight);
108            } else {

109                var params = $.urlParams(href);
110            }
111
112            // If we did not find a width or height, lets use the default.
113            if (params.innerHeight == undefined) params.innerHeight = settings.height;
114            if (params.innerWidth == undefined) params.innerWidth = settings.width;
115
116            params.html = '<div id="colorboxNodeLoading"></div>';
117            params.onComplete = function () {
118                $this.colorboxNodeGroup();
119            }
120            params.open = true;
121
122            // Launch our colorbox with the provided settings
123            $this.colorbox($.extend({}, Drupal.settings.colorbox, params));
124        });
125
126        // Log our click handler to our ajax object
127        var base = $(this).attr('id');
128        Drupal.ajax[base] = new Drupal.ajax(base, this, element_settings);
129
130        // Default to auto click for manual call to this function.
131        if (settings.launch) {
132            Drupal.ajax[base].eventResponse(this, 'click');
133            $(this).click();
134        }
135    }
136
137    // Allow for grouping on links to showcase a gallery with left/right arrows.
138    // This function will find the next index of each link on the page b

138y the rel
139    // and manually force a click on the link to call that AJAX and update the
140    // modal window.
141    $.fn.colorboxNodeGroup = function () {
142        // Lets do setup our gallery type of functions.
143        var $this = $(this);
144        var rel = $this.attr('rel');
145        if(rel && $this.hasClass('colorbox-node-gallery')) {
146            if ($('a.colorbox-node-gallery[rel="' + rel + '"]:not("#colorbox a[rel="' + rel + '"]")').length > 1) {
147                $related = $('a.colorbox-node-gallery[rel="' + rel + '"]:not("#colorbox a[rel="' + rel + '"]")');
148
149                // filter $related array by href, to have mutliple colorbox links to the same target
150                // appear as one item in the gallery only
151                var $related_unique = [];
152                $related.each(function() {
153                    $.findHref($related_unique, this.href);
154                    if (!$.findHref($related_unique, this.href).length) {
155                        $related_unique.push(this);
156                    }
157                });
158                // we have to get the actual used element from the filtered list in order to get it's relative index
159                var current = $.findHref($related_unique, $this.get(0).href);
160                $related = $($related_unique);
161                var idx = $related.index($(current));
162                var tot = $related.length;
163
164                // Show our gallery buttons
165                $('#cboxPrevious, #cboxNext').show();
166                $.colorbox.next = function () {
167                    index = getIndex(1);
168                    $related[index].click();
169                };
170                $.colorbox.prev = function () {
171                    index = getIndex(-1);
172                    $related[index].click();
173                };
174
175                // Setup our current HTML
176                $('#cboxCurrent').html(Drupal.settings.colorbox.current.replace('{current}', idx + 1).replace('{total}', tot)).show();
177                $('#cboxNext').html(Drupal.settings.colorbox.next).show();
178                $('#cboxPrevious').html(Drupal.settings.colorbox.previous).show();
179
180                var prefix = 'colorbox';
181                // Remove Bindings and re-add
182                // @TODO: There must be a better way?  If we don't remove it causes a memory to be exhausted.
183                $(document).unbind('keydown.' + prefix);
184
185                // Add Key Bindings
186                $(document).bind('keydown.' + prefix, function (e) {
187                    var key = e.keyCode;
188                    if ($related[1] && !e.altKey) {
189                        if (key === 37) {
190                            e.preventDefault();
191                            $.colorbox.prev();
192                        } else if (key === 39) {
193                            e.preventDefault();
194                            $.colorbox.next();
195                        }
196                    }
197                });
198            }
199
200            function getIndex(increment) {
201                var max = $related.length;
202                var newIndex = (idx + increment) % max;
203                return (newIndex < 0) ? max + newIndex : newIndex;
204            }
205
206        }
207    }
208
209    // Find a colorbox link by href in an array
210    $.findHref = function(items, href) {
211        return $.grep(items, function(n, i){
212            return n.href == href;
213        });
214    };
215
216    // Utility function to parse out our width/height from our url params
217    $.urlParams = function (url) {
218        var p = {},
219            e,
220            a = /\+/g,  // Regex for replacing addition symbol with a space
221            r = /([^&=]+)=?([^&]*)/g,
222            d = function (s) {
223                return decodeURIComponent(s.replace(a, ' '));
224            },
225            q = url.split('?');
226        while (e = r.exec(q[1])) {
227            e[1] = d(e[1]);
228            e[2] = d(e[2]);
229            switch (e[2].toLowerCase()) {
230                case 'true':
231                case 'yes':
232                    e[2] = true;
233                    break;
234                case 'false':
235                case 'no':
236                    e[2] = false;

237                    break;
238            }
239            if (e[1] == 'width') {
240                e[1] = 'innerWidth';
241            }
242            if (e[1] == 'height') {
243                e[1] = 'innerHeight';
244            }
245            p[e[1]] = e[2];
246        }
247        return p;
248    };
249
250    // Utility function to return our data attributes for width/height
251    $.urlDataParams = function (innerWidth, innerHeight) {
252        return {'innerWidth':innerWidth,'innerHeight':innerHeight};
253    };
254
255    $.getParameterByName = function(name, href) {
256        name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
257        var regexString = "[\\?&]" + name + "=([^&#]*)";
258        var regex = new RegExp(regexString);
259        var found = regex.exec(href);
260        if(found == null)
261            return "";
262        else
263            return decodeURIComponent(found[1].replace(/\+/g, " "));
264    }
265
266})(jQuery);