PluginProbe
Photonic Gallery & Lightbox for Flickr, SmugMug & Others / 2.21
Photonic Gallery & Lightbox for Flickr, SmugMug & Others v2.21
3.36 3.35 3.34 3.33 2.19 2.20 2.21 2.22 2.23 2.24 2.25 2.26 2.27 2.28 2.29 2.30 2.31 2.32 2.33 2.34 2.40 2.41 2.42 2.43 2.44 All 141 releases
photonic / include / scripts / front-end / src / lightboxes / Lightbox.js

Lightbox.js in Photonic Gallery & Lightbox for Flickr, SmugMug & Others 2.21, at include/scripts/front-end/src/lightboxes/Lightbox.js

249 lines 8.1 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 function Photonic_Lightbox() {
2 this.socialIcons = "<div id='photonic-social'>" +
3 "<a class='photonic-share-fb' href='https://www.facebook.com/sharer/sharer.php?u={photonic_share_link}&amp;title={photonic_share_title}&amp;picture={photonic_share_image}' target='_blank' title='Share on Facebook'><div class='icon-facebook'></div></a>" +
4 "<a class='photonic-share-twitter' href='https://twitter.com/share?url={photonic_share_link}&amp;text={photonic_share_title}' target='_blank' title='Share on Twitter'><div class='icon-twitter'></div></a>" +
5 "<a class='photonic-share-pinterest' data-pin-do='buttonPin' href='https://www.pinterest.com/pin/create/button/?url={photonic_share_link}&media={photonic_share_image}&description={photonic_share_title}' data-pin-custom='true' target='_blank' title='Share on Pinterest'><div class='icon-pinterest'></div></a>" +
6 "</div>";
7 var lastDeep;
8 this.videoIndex = 1;
9 }
10
11 Photonic_Lightbox.prototype.getVideoSize = function(url, baseline){
12 return new Promise(function(resolve){
13 // create the video element
14 var video = document.createElement('video');
15
16 // place a listener on it
17 video.addEventListener( "loadedmetadata", function () {
18 // retrieve dimensions
19 var height = this.videoHeight;
20 var width = this.videoWidth;
21
22 var videoAspectRatio = this.videoWidth / this.videoHeight;
23 var baseAspectRatio = baseline.width / baseline.height;
24
25 var newWidth, newHeight;
26 if (baseAspectRatio > videoAspectRatio) {
27 // Window is wider than it needs to be ... constrain by window height
28 newHeight = baseline.height;
29 newWidth = width * newHeight / height;
30 }
31 else {
32 // Window is narrower than it needs to be ... constrain by window width
33 newWidth = baseline.width;
34 newHeight = height * newWidth / width;
35 }
36
37 // send back result
38 resolve({
39 height : height,
40 width : width,
41 newHeight: newHeight,
42 newWidth: newWidth
43 });
44 }, false );
45
46 // start download meta-datas
47 video.src = url;
48 });
49 };
50
51 Photonic_Lightbox.prototype.getImageSize = function(url, baseline){
52 return new Promise(function(resolve){
53 var image = document.createElement('img');
54
55 // place a listener on it
56 image.addEventListener( "load", function () {
57 // retrieve dimensions
58 var height = this.height;
59 var width = this.width;
60
61 var imageAspectRatio = this.width / this.height;
62 var baseAspectRatio = baseline.width / baseline.height;
63
64 var newWidth, newHeight;
65 if (baseAspectRatio > imageAspectRatio) {
66 // Window is wider than it needs to be ... constrain by window height
67 newHeight = baseline.height;
68 newWidth = width * newHeight / height;
69 }
70 else {
71 // Window is narrower than it needs to be ... constrain by window width
72 newWidth = baseline.width;
73 newHeight = height * newWidth / width;
74 }
75
76 // send back result
77 resolve({
78 height : height,
79 width : width,
80 newHeight: newHeight,
81 newWidth: newWidth
82 });
83 }, false );
84
85 // start download meta-datas
86 image.src = url;
87 });
88 };
89
90 Photonic_Lightbox.prototype.addSocial = function(selector, shareable) {
91 if ((Photonic_JS.social_media === undefined || Photonic_JS.social_media === '') && shareable['buy'] === undefined) {
92 return;
93 }
94 $('#photonic-social').remove();
95 if (location.hash !== '') {
96 var social = this.socialIcons.replace(/{photonic_share_link}/g, encodeURIComponent(shareable['url'])).
97 replace(/{photonic_share_title}/g, encodeURIComponent(shareable['title'])).
98 replace(/{photonic_share_image}/g, encodeURIComponent(shareable['image']));
99
100 $(selector).append(social);
101 if (Photonic_JS.social_media === undefined || Photonic_JS.social_media === '') {
102 $('.photonic-share-fb').remove();
103 $('.photonic-share-twitter').remove();
104 $('.photonic-share-pinterest').remove();
105 }
106
107 if (!supportsSVG) {
108 var icon = $('#photonic-social div');
109 var bg = icon.css('background-image');
110 bg = bg.replace( 'svg', 'png' );
111 icon.css({'background-image': bg});
112 }
113 }
114 };
115
116 Photonic_Lightbox.prototype.setHash = function(a) {
117 if (Photonic_JS.deep_linking === undefined || Photonic_JS.deep_linking === 'none') {
118 return;
119 }
120
121 var hash = $.type(a) === 'string' ? a : $(a).data('photonicDeep');
122 if (hash === undefined) {
123 return;
124 }
125
126 if (typeof(window.history.pushState) === 'function' && Photonic_JS.deep_linking === 'yes-history') {
127 window.history.pushState({}, document.title, '#' + hash);
128 }
129 else if (typeof(window.history.replaceState) === 'function' && Photonic_JS.deep_linking === 'no-history') {
130 window.history.replaceState({}, document.title, '#' + hash);
131 }
132 else {
133 document.location.hash = hash;
134 }
135 };
136
137 Photonic_Lightbox.prototype.unsetHash = function() {
138 lastDeep = (lastDeep === undefined || deep !== '') ? location.hash : lastDeep;
139 if (window.history && 'replaceState' in window.history) {
140 history.replaceState({}, document.title, location.href.substr(0, location.href.length-location.hash.length));
141 }
142 else {
143 window.location.hash = '';
144 }
145 };
146
147 Photonic_Lightbox.prototype.changeHash = function() {
148 var node = deep;
149
150 if (node != null) {
151 if (node.length > 1 && photonicLightbox !== null && photonicLightbox !== undefined) {
152 if (window.location.hash && node.indexOf('#access_token=') !== -1) {
153 photonicLightbox.unsetHash();
154 }
155 else {
156 node = node.substr(1);
157 var allMatches = $('[data-photonic-deep="' + node + '"]');
158 if (allMatches.length > 0) {
159 var thumbToClick = allMatches[0];
160 $(thumbToClick).click();
161 photonicLightbox.setHash(node);
162 }
163 }
164 }
165 }
166 };
167
168 Photonic_Lightbox.prototype.catchYouTubeURL = function(url) {
169 var regExp = /^.*(youtu\.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/;
170 var match = url.match(regExp);
171 if (match && match[2].length === 11) {
172 return match[2];
173 }
174 };
175
176 Photonic_Lightbox.prototype.catchVimeoURL = function(url) {
177 var regExp = /(?:www\.|player\.)?vimeo.com\/(?:channels\/(?:\w+\/)?|groups\/(?:[^\/]*)\/videos\/|album\/(?:\d+)\/video\/|video\/|)(\d+)(?:[a-zA-Z0-9_\-]+)?/;
178 var match = url.match(regExp);
179 if (match) {
180 return match[1];
181 }
182 };
183
184 Photonic_Lightbox.prototype.soloImages = function() {
185 $('a[href]').filter(function() {
186 return /(\.jpg|\.jpeg|\.bmp|\.gif|\.png)/i.test( $(this).attr('href'));
187 }).addClass("launch-gallery-" + Photonic_JS.slideshow_library).addClass(Photonic_JS.slideshow_library);
188 };
189
190 Photonic_Lightbox.prototype.changeVideoURL = function(element, regular, embed) {
191 // Implemented in individual lightboxes. Empty for unsupported lightboxes
192 };
193
194 Photonic_Lightbox.prototype.hostedVideo = function(a) {
195 // Implemented in individual lightboxes. Empty for unsupported lightboxes
196 };
197
198 Photonic_Lightbox.prototype.soloVideos = function() {
199 var self = this;
200 if (Photonic_JS.lightbox_for_videos) {
201 $('a[href]').each(function() {
202 var regular, embed;
203 var youTube = self.catchYouTubeURL($(this).attr('href'));
204 var vimeo = self.catchVimeoURL($(this).attr('href'));
205 if ((youTube) !== undefined) {
206 regular = 'https://youtube.com/watch?v=' + youTube;
207 embed = 'https://youtube.com/embed/' + youTube;
208 }
209 else if (vimeo !== undefined) {
210 regular = 'https://vimeo.com/' + vimeo;
211 embed = 'https://player.vimeo.com/video/' + vimeo;
212 }
213
214 if (regular !== undefined) {
215 $(this).addClass(Photonic_JS.slideshow_library + "-video");
216 self.changeVideoURL(this, regular, embed);
217 }
218 self.hostedVideo(this);
219 });
220 }
221 };
222
223 Photonic_Lightbox.prototype.handleSolos = function() {
224 if (Photonic_JS.lightbox_for_all) {
225 this.soloImages();
226 }
227 this.soloVideos();
228
229 $(window).on('load', this.changeHash);
230 $(window).on('hashchange', this.changeHash);
231 };
232
233 Photonic_Lightbox.prototype.initialize = function() {
234 this.handleSolos();
235 // Implemented by child classes
236 };
237
238 Photonic_Lightbox.prototype.initializeForNewContainer = function(containerId) {
239 // Implemented by individual lightboxes. Empty for cases where not required
240 };
241
242 Photonic_Lightbox.prototype.initializeForExisting = function() {
243 // Implemented by child classes
244 };
245
246 Photonic_Lightbox.prototype.initializeForSlideshow = function(selector, slider) {
247 // Implemented by child classes
248 };
249