Elgg  Version 3.0
lightbox.js
Go to the documentation of this file.
1 
26 define(function (require) {
27 
28  var elgg = require('elgg');
29  var $ = require('jquery');
30  require('elgg/init');
31  require('jquery.colorbox');
32 
33  var lightbox = {
34 
41  getOptions: function (opts) {
42  if (!$.isPlainObject(opts)) {
43  opts = {};
44  }
45 
46  // data set server side using elgg.data,site hook
47  var defaults = elgg.data.lightbox;
48 
49  if (!defaults.reposition) {
50  // don't move colorbox on small viewports https://github.com/Elgg/Elgg/issues/5312
51  defaults.reposition = $(window).height() > 600;
52  }
53 
54  elgg.provide('elgg.ui.lightbox');
55 
56  var settings = $.extend({}, defaults, opts);
57 
58  return elgg.trigger_hook('getOptions', 'ui.lightbox', null, settings);
59  },
60 
69  bind: function (selector, opts, use_element_data) {
70  if (!$.isPlainObject(opts)) {
71  opts = {};
72  }
73 
74  // Allow direct binding to allow grouping by rel attribute
75  if (use_element_data === false) {
76  $(selector).colorbox(lightbox.getOptions(opts));
77  return;
78  }
79 
80  $(document)
81  .off('click.lightbox', selector)
82  .on('click.lightbox', selector, function (e) {
83  // trigger a click event on document to close open menus / dropdowns like the entity menu #11748
84  $(document).click();
85 
86  // remove system messages when opening a lightbox
87  $('.elgg-system-messages .elgg-message').remove();
88 
89  e.preventDefault();
90  var $this = $(this),
91  href = $this.prop('href') || $this.prop('src'),
92  // Note: data-colorbox was reserved https://github.com/jackmoore/colorbox/issues/435
93  dataOpts = $this.data('colorboxOpts'),
94  currentOpts = {};
95 
96  if (!$.isPlainObject(dataOpts)) {
97  dataOpts = {};
98  }
99 
100  if (!dataOpts.href && href) {
101  dataOpts.href = href;
102  }
103 
104  // merge data- options into opts
105  $.extend(currentOpts, opts, dataOpts);
106  if (currentOpts.inline && currentOpts.href) {
107  currentOpts.href = elgg.getSelectorFromUrlFragment(currentOpts.href);
108  }
109 
110  if (currentOpts.photo || currentOpts.inline || currentOpts.iframe || currentOpts.html) {
111  lightbox.open(currentOpts);
112  return;
113  }
114 
115  href = currentOpts.href;
116  currentOpts.href = false;
117  var data = currentOpts.data;
118  currentOpts.data = undefined;
119 
120  // open lightbox without a href so we get a loader
121  lightbox.open(currentOpts);
122 
123  require(['elgg/Ajax'], function(Ajax) {
124  var ajax = new Ajax(false);
125  ajax.path(href, {data: data}).done(function(output) {
126  currentOpts.html = output;
127  lightbox.open(currentOpts);
128 
129  // clear data so next fetch will refresh contents
130  currentOpts.html = undefined;
131  });
132  });
133  });
134 
135  $(window)
136  .off('resize.lightbox')
137  .on('resize.lightbox', function() {
138  elgg.data.lightbox.reposition = $(window).height() > 600;
139  lightbox.resize();
140  });
141  },
142 
149  open: function (opts) {
150  $.colorbox(lightbox.getOptions(opts));
151  },
152 
157  close: $.colorbox.close,
158 
163  resize: $.colorbox.resize
164  };
165 
166  lightbox.bind(".elgg-lightbox");
167  lightbox.bind(".elgg-lightbox-photo", {photo: true});
168  lightbox.bind(".elgg-lightbox-inline", {inline: true});
169  lightbox.bind(".elgg-lightbox-iframe", {iframe: true});
170 
171  return lightbox;
172 });
elgg isPlainObject
Check if the value is a "plain" object (i.e., created by {} or new Object())
Definition: elgglib.js:75
elgg ajax
Wrapper function for jQuery.ajax which ensures that the url being called is relative to the elgg site...
Definition: ajax.js:19
elgg require
Throw an error if the required package isn't present.
Definition: elgglib.js:164
function elgg combo checkbox click(function(){if($(this).is(':checked')){$(this).prev().attr('disabled', true);$(this).prev().val('');}else{$(this).prev().attr('disabled', false);}})
var elgg
Definition: elgglib.js:4