1/* 2* 3* A Gallery and Imageviewer library 4* Author: Marcel Bohland Copyright 2021 5* Version: 0.1.1 6* url: https://github.com/marcelbohland 7* License: Apache License 2.0: 8* 9* 10* Copyright 2021 Marcel Bohland 11* 12* Licensed under the Apache License, Version 2.0 (the "License"); 13* you may not use this file except in compliance with the License. 14* You may obtain a copy of the License at 15* 16* http://www.apache.org/licenses/LICENSE-2.0 17* 18* Unless required by applicable law or agreed to in writing, software 19* distributed under the License is distributed on an "AS IS" BASIS, 20* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 21* See the License for the specific language governing permissions and 22* limitations under the License. 23* 24*/ 25 26//Variablen 27added = 0; 28ImageIndex = 0; 29viewerPosition = 0; 30transition = "opacity"; 31enableViewOriginalPictureVal = 0; 32zoomVal = 0; 33share= 0; 34monoImageView = 0; 35monoImageViewURL=""; 36eachID=0; 37backgroundcolor = "#000000e8"; 38galleryStyle = "normal"; 39AutoWidth = 0; 40//Masaic 41topVar = 0; 42leftVar = 0; 43array = [30]; 44className=""; 45 46$(document).ready(function(){ 47 48 for(i=0;i<=30;i++){ 49 array[i] = 0; 50} 51 52 53 54 $(".ViewerImage").dblclick(function(){ 55 zoom(); 56 }); 57 58 $('.addToGallery').each(function() { 59 $( this ).attr('id', ImageIndex); 60 ImageIndex++; 61 }); 62 63 $(".galleryJS").click(function(){ 64 url = $(this).attr('src'); 65 addImageViewer(); 66 $(".ViewerImage").attr("src",url); 67 $('.GalleryViewer').show(); 68 $('.Arrowright').hide(); 69 $('.ArrowLeft').hide(); 70 monoImageView = 1; 71 monoImageViewURL=url; 72 }); 73 }); 74 75 function enableDoubleClick(){ 76 $(".ViewerImage").dblclick(function(){ 77 zoom(); 78 }); 79 } 80 81function backgroundColor(color){ 82 backgroundcolor = color; 83} 84 85function enableAutoWidth(){ 86 AutoWidth = 1; 87} 88 89function mosaic(){ 90 row = 0; 91 column = 0; 92 x = 5; 93 y = 3; 94 xminus = 4; 95 yminus = 4; 96 97 98 valeCounter = 0; 99 100 GalleryWidth = $( ".Gallery" ).width(); 101 for(i=0;i<ImageIndex;i++){ 102 103 if(GalleryWidth>1500){ 104 x = 6; 105 y = 4; 106 } 107 108 109 if(GalleryWidth>2000){ 110 x = 7; 111 y = 5; 112 } 113 114 if(GalleryWidth<700){ 115 x = 4; 116 y = 2; 117 } 118 if(GalleryWidth<500){ 119 x = 2; 120 y = 1; 121 } 122 123 124 if(row%2==0){ 125 126 imageWidth = GalleryWidth/x-xminus; 127 $("#"+i).css("max-width",imageWidth+"px"); 128 $("#"+i).css("min-width",imageWidth+"px"); 129 $("#"+i).css("width",imageWidth+"px"); 130 $("#"+i).css("max-height","175px"); 131 $("#"+i).css("min-height","175px"); 132 if(column==x-1){ 133 row++; 134 column=-1; 135 } 136 column++; 137 138 }else{ 139 imageWidth = GalleryWidth/y-yminus; 140 $("#"+i).css("max-width",imageWidth+"px"); 141 $("#"+i).css("min-width",imageWidth+"px"); 142 $("#"+i).css("width",imageWidth+"px"); 143 $("#"+i).css("max-height","200px"); 144 $("#"+i).css("min-height","200px"); 145 if(column==y-1){ 146 row++; 147 column=-1; 148 } 149 column++; 150 } 151 152 153 $('.Gallery').show(); 154 } 155} 156 157$(window).on('resize', function(){ 158 if(AutoWidth == 1){ 159 galleryWidth = $(".Gallery").width(); 160 161 162 if(galleryWidth>1920){ 163 galleryWidth4 = 300; 164 } 165 if(galleryWidth<1920){ 166 galleryWidth4 = galleryWidth/5-20; 167 } 168 if(galleryWidth<1400){ 169 galleryWidth4 = galleryWidth/4-20; 170 } 171 if(galleryWidth<1024){ 172 galleryWidth4 = galleryWidth/3-20; 173 } 174 if(galleryWidth<786){ 175 galleryWidth4 = galleryWidth/2-20; 176 }if(galleryWidth<450){ 177 galleryWidth4 = galleryWidth/1-20; 178 } 179 180 $(".Gallery img").width(galleryWidth4); 181 } 182 183 if(className=="mosaic"){ 184 mosaic(); 185 } 186 187}); 188 189$(document).ready(function() { 190 191 if(AutoWidth == 1){ 192 galleryWidth = $(".Gallery").width(); 193 194 if(galleryWidth>1920){ 195 galleryWidth4 = 300; 196 } 197 if(galleryWidth<1920){ 198 galleryWidth4 = galleryWidth/5-20; 199 } 200 if(galleryWidth<1400){ 201 galleryWidth4 = galleryWidth/4-20; 202 } 203 if(galleryWidth<1024){ 204 galleryWidth4 = galleryWidth/3-20; 205 } 206 if(galleryWidth<786){ 207 galleryWidth4 = galleryWidth/2-20; 208 }if(galleryWidth<450){ 209 galleryWidth4 = galleryWidth/1-20; 210 } 211 212 $(".Gallery img").width(galleryWidth4); 213 } 214 215 if(className=="mosaic"){ 216 mosaic(); 217 } 218 219}); 220 221 function addGallery(Data){ 222 223 // Adds images and a headline to the Gallery 224 225 var obj = jQuery.parseJSON(Data); 226 $.each(obj, function(i, item) { 227 228 if(galleryStyle=="tiles"){ 229 className="tiles"; 230 } 231 if(galleryStyle=="full"){ 232 className="full"; 233 } 234 if(galleryStyle=="center"){
235 className="center"; 236 } 237 if(galleryStyle=="Circles"){ 238 className="Circles"; 239 } 240 if(galleryStyle=="mosaic"){ 241 className="mosaic"; 242 } 243 244 if(className!="mosaic"){ 245 $('.Gallery').append('<p>'+obj.Entry.Title+'</p>'); 246 }else{ 247 $('.Gallery').hide(); 248 } 249 length = Object.keys(obj.Entry.Image).length; 250 251 252 for(i=0;i<length;i++){ 253 254 // Check if preview Image exsits 255 x = AjaxCall(obj,i); 256 if(x==1){ 257 $('.Gallery').append('<img loading="lazy" class="'+className+'" alt="Image'+ImageIndex+'" width="300px" height="169px" class="fadein" id="'+ImageIndex+'" onClick="openViewer(this.id)" src="'+obj.Entry.Image[i]+'"/>'); 258 ImageIndex++; 259 }else{ 260 if(obj.Entry.Image[i].includes(".jpeg")){ 261 split = obj.Entry.Image[i].split(".jpeg"); 262 newURL = split[0]+'-preview.jpeg#preview'; 263 }else if(obj.Entry.Image[i].includes(".jpg")){ 264 split = obj.Entry.Image[i].split(".jpg"); 265 newURL = split[0]+'-preview.jpg#preview'; 266 }else if(obj.Entry.Image[i].includes(".png")){ 267 split = obj.Entry.Image[i].split(".png"); 268 newURL = split[0]+'-preview.png#preview'; 269 }else if(obj.Entry.Image[i].includes(".webp")){ 270 split = obj.Entry.Image[i].split(".webp"); 271 newURL = split[0]+'-preview.webp#preview'; 272 } 273 $('.Gallery').append('<img loading="lazy" class="'+className+'" alt="Image'+ImageIndex+'" width="300px" height="169px" class="fadein" id="'+ImageIndex+'" onClick="openViewer(this.id)" src="'+newURL+'"/>'); 274 ImageIndex++; 275 } 276 } 277}); 278addPlayer(); 279} 280 281//Check if preview Image Exsists 282 function AjaxCall(obj,i){ 283 if(obj.Entry.Image[i].includes(".jpeg#preview")){ 284 return 2; 285 286 }else if(obj.Entry.Image[i].includes(".jpg#preview")){ 287 return 2; 288 289 }else if(obj.Entry.Image[i].includes(".png#preview")){ 290 return 2; 291 292 }else if(obj.Entry.Image[i].includes(".webp#preview")){ 293 294 return 2; 295 }else{ 296 return 1; 297 } 298} 299 300//Check if a Image is only a Preview 301function checkPreviewState(url){ 302 newURL=url; 303 if(url.includes("-preview.jpeg#preview")){ 304 split = url.split("-preview.jpeg#preview"); 305 newURL = split[0]+".jpeg"; 306 }else if(url.includes("-preview.jpg#preview")){ 307 split = url.split("-preview.jpg#preview"); 308 newURL = split[0]+".jpg"; 309 }else if(url.includes("-preview.png#preview")){ 310 split = url.split("-preview.png#preview"); 311 newURL = split[0]+".png"; 312 }else if(url.includes("-preview.webp#preview")){ 313 split = url.split("-preview.webp#preview"); 314 newURL = split[0]+".webp"; 315 } 316 return newURL; 317} 318 319 320function addImageViewer(){ 321 // Adds player HTML code to GalleryViewer Div container 322 323 if(added==0){ 324 $('body').append('<div style="background-color:'+backgroundcolor+';" class="GalleryViewer"></div>'); 325 $('.GalleryViewer').append('<img class="ViewerImage" id="ViewerImage" src="" />'); 326 $('.GalleryViewer').append('<svg onClick="left()" class="ArrowLeft" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="48px" height="48px"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M15.41 16.59L10.83 12l4.58-4.59L14 6l-6 6 6 6 1.41-1.41z"/></svg>'); 327 $('.GalleryViewer').append('<svg onClick="right()" class="Arrowright" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="48px" height="48px"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z"/></svg>'); 328 // $('.GalleryViewer').append('<img onClick="closeViewer()" class="GalleryViewerClose" src="https://static.thenounproject.com/png/2341854-200.png" />'); 329 $('.GalleryViewer').append('<svg onClick="closeViewer()" class="GalleryViewerClose" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="48px" height="48px"><path d="M0 0h24v24H0z" fill="none"/><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></svg>'); 330 if(enableViewOriginalPictureVal==1){ 331 $('.GalleryViewer').append('<svg onClick="openImage()" class="GalleryViewerOpen" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="48px" height="48px"><path d="M0 0h24v24H0z" fill="none"/><path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"/></svg>'); 332 $('.GalleryViewer').append('<svg onClick="zoom()" class="GalleryViewerZoom" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="48px" height="48px"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/><path d="M12 10h-2v2H9v-2H7V9h2V7h1v2h2v1z"/></svg>'); 333 } 334 if(share==1){ 335 $('.GalleryViewer').append('<svg onClick="Share()" class="GalleryViewerShare" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="48px" height="48px"><path d="M0 0h24v24H0z" fill="none"/><path d="M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3
335-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92 1.61 0 2.92-1.31 2.92-2.92s-1.31-2.92-2.92-2.92z"/></svg>'); 336 $('.GalleryViewer').append('<div class="sharebuttons"></div>'); 337 $('.sharebuttons').append('<p onClick="shareFacebook()">Facebook</p>'); 338 $('.sharebuttons').append('<p onClick="shareTwitter()">Twitter</p>'); 339 $('.sharebuttons').append('<p onClick="shareGertLink()">Get the Link</p>'); 340 } 341 added=1; 342 $('.GalleryViewer').hide(); 343 enableDoubleClick(); 344 } 345} 346function addPlayer(){ 347 348 // Adds player HTML code to GalleryViewer Div container 349 350 if(added==0){ 351 $('body').append('<div class="GalleryViewer"></div>'); 352 $('.GalleryViewer').append('<img class="ViewerImage" id="ViewerImage" src="" />'); 353 $('.GalleryViewer').append('<svg onClick="left()" class="ArrowLeft" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="48px" height="48px"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M15.41 16.59L10.83 12l4.58-4.59L14 6l-6 6 6 6 1.41-1.41z"/></svg>'); 354 $('.GalleryViewer').append('<svg onClick="right()" class="Arrowright" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="48px" height="48px"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z"/></svg>'); 355 // $('.GalleryViewer').append('<img onClick="closeViewer()" class="GalleryViewerClose" src="https://static.thenounproject.com/png/2341854-200.png" />'); 356 $('.GalleryViewer').append('<svg onClick="closeViewer()" class="GalleryViewerClose" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="48px" height="48px"><path d="M0 0h24v24H0z" fill="none"/><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></svg>'); 357 if(enableViewOriginalPictureVal==1){ 358 $('.GalleryViewer').append('<svg onClick="openImage()" class="GalleryViewerOpen" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="48px" height="48px"><path d="M0 0h24v24H0z" fill="none"/><path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"/></svg>'); 359 $('.GalleryViewer').append('<svg onClick="zoom()" class="GalleryViewerZoom" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="48px" height="48px"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/><path d="M12 10h-2v2H9v-2H7V9h2V7h1v2h2v1z"/></svg>'); 360 } 361 if(share==1){ 362 $('.GalleryViewer').append('<svg onClick="Share()" class="GalleryViewerShare" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="48px" height="48px"><path d="M0 0h24v24H0z" fill="none"/><path d="M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92 1.61 0 2.92-1.31 2.92-2.92s-1.31-2.92-2.92-2.92z"/></svg>'); 363 $('.GalleryViewer').append('<div class="sharebuttons"></div>'); 364 $('.sharebuttons').append('<p onClick="shareFacebook()">Facebook</p>'); 365 $('.sharebuttons').append('<p onClick="shareTwitter()">Twitter</p>'); 366 $('.sharebuttons').append('<p onClick="shareGertLink()">Get the Link</p>'); 367 368 } 369 added=1; 370 $('.GalleryViewer').hide(); 371 enableDoubleClick(); 372 } 373} 374function closeViewer(){ 375 $("body").css("overflow","unset"); 376 $('.GalleryViewer').hide(); 377 $('.Arrowright').show(); 378 $('.ArrowLeft').show(); 379 $(".sharebuttons").hide(); 380 $(".ViewerImage").css("object-fit","contain"); 381 $(".ViewerImage").animate({"height":"55%","max-height":"80%"}, 0); 382 $(".ViewerImage").css("height","unset"); 383 $(".ViewerImage").css({"width":"80%","max-height":"80%","top":"0","right":"0","left":"0"}); 384 $( ".ViewerImage" ).draggable( { disabled: true });
385 zoomVal=0; 386 monoImageView = 0; 387 monoImageViewURL=""; 388} 389 390function checkPreviewState(url){ 391 newURL=url; 392 if(url.includes("-preview.jpeg#preview")){ 393 split = url.split("-preview.jpeg#preview"); 394 newURL = split[0]+".jpeg"; 395 }else if(url.includes("-preview.jpg#preview")){ 396 split = url.split("-preview.jpg#preview"); 397 newURL = split[0]+".jpg"; 398 } 399 return newURL; 400} 401 402function openViewer(clicked_id){ 403 $("body").css("overflow","hidden"); 404 viewerPosition=parseInt(clicked_id); 405 var url = document.getElementById(clicked_id).src; 406 407 url = checkPreviewState(url); 408 409 $(".ViewerImage").attr("src",url); 410 const img = new Image(); 411 img.onload = function() { 412 widthValue = this.width; 413 heightValue = this.height; 414 calc = widthValue/heightValue; 415 if(calc<1.25){ 416 417 }else{ 418 $(".ViewerImage").css("object-fit","contain"); 419 } 420 } 421 var url = $(".ViewerImage").attr('src'); 422 img.src = url; 423 img.onload = function() { 424 $('.GalleryViewer').show(); 425 } 426} 427function left(){ 428 $(".ViewerImage").css({"width":"80%","max-height":"80%","top":"0","right":"0","left":"0"}); 429 $( ".ViewerImage" ).draggable( { disabled: true }); 430 $(".ViewerImage").css("object-fit","contain"); 431 $(".ViewerImage").animate({"height":"55%","max-height":"80%"}, 1); 432 $(".ViewerImage").css("height","unset"); 433 zoomVal=0; 434 viewerPosition=viewerPosition-1; 435 if(viewerPosition>=0){ 436 var url = document.getElementById(viewerPosition).src; 437 438 url = checkPreviewState(url); 439 440 $(".ViewerImage").attr("src",url); 441 442 const img = new Image(); 443 img.onload = function() { 444 widthValue = this.width; 445 heightValue = this.height; 446 calc = widthValue/heightValue; 447 if(calc<1.25){ 448 449 }else{ 450 $(".ViewerImage").css("object-fit","contain"); 451 } 452 } 453 var url = $(".ViewerImage").attr('src'); 454 img.src = url; 455 456 img.onload = function() { 457 if(transition=="opacity"){ 458 $(".ViewerImage").css("opacity","0.4"); 459 $(".ViewerImage").animate({"opacity":"1"}, 200) 460 } 461 if(transition=="zoomin"){ 462 $(".ViewerImage").css("width","40%"); 463 $(".ViewerImage").animate({width: "80%"}, 'slow'); 464 } 465 if(transition=="slide"){
466 $(".ViewerImage").css("left","-500px"); 467 $(".ViewerImage").animate({left: '0'}, 200); 468 } 469 if(transition=="slideAndZoom"){ 470 $(".ViewerImage").css("left","-500px"); 471 $(".ViewerImage").animate({left: '0'}, 200); 472 $(".ViewerImage").css("left","500px"); 473 $(".ViewerImage").css("opacity","0.4"); 474 $(".ViewerImage").css("width","150px"); 475 $(".ViewerImage").animate({ 476 left: '0', 477 opacity: '1', 478 width: '80%' 479 }); 480 } 481 if(transition=="slideZoom"){ 482 $(".ViewerImage").css("left","-500px"); 483 $(".ViewerImage").css("opacity","0.4"); 484 $(".ViewerImage").css("width","150px"); 485 $(".ViewerImage").animate({ 486 left: '0', 487 opacity: '1', 488 width: '80%' 489 }); 490 } 491 if(transition=="ZoominFast"){ 492 $(".ViewerImage").css("width","0"); 493 $(".ViewerImage").animate({ 494 width: '100%' 495 }); 496 } 497 if(transition=="bounce"){ 498 $(".ViewerImage").css("top","-100"); 499 $(".ViewerImage").animate({top: '100'}, 150); 500 $(".ViewerImage").animate({top: '-100'}, 150); 501 $(".ViewerImage").animate({top: '100'}, 150); 502 $(".ViewerImage").animate({top: '0'}, 150); 503 } 504 if(transition=="puffzoom"){ 505 $(".ViewerImage").css("width","10%"); 506 $(".ViewerImage").css("opacity","0.2"); 507 $(".ViewerImage").animate({width: '80%'}, 300); 508 $(".ViewerImage").animate({opacity: '1'}, 100); 509 } 510 } 511 }else{ 512 viewerPosition=viewerPosition+1; 513} 514} 515 516function right(){ 517 $(".ViewerImage").css({"width":"80%","max-height":"80%","top":"0","right":"0","left":"0"}); 518 $( ".ViewerImage" ).draggable( { disabled: true }); 519 $(".ViewerImage").css("object-fit","contain"); 520 $(".ViewerImage").animate({"height":"55%","max-height":"80%"}, 1); 521 $(".ViewerImage").css("height","unset"); 522 zoomVal=0; 523 viewerPosition=viewerPosition+1; 524 if(viewerPosition<ImageIndex){ 525 var url = document.getElementById(viewerPosition).src; 526 527 url = checkPreviewState(url); 528 529 $(".ViewerImage").attr("src",url); 530 531 const img = new Image(); 532 img.onload = function() { 533 widthValue = this.width; 534 heightValue = this.height; 535 calc = widthValue/heightValue; 536 if(calc<1.25){ 537 538 }else{ 539 $(".ViewerImage").css("object-fit","contain"); 540 } 541 } 542 var url = $(".ViewerImage").attr('src'); 543 img.src = url; 544 img.onload = function() { 545 if(transition=="opacity"){ 546 $(".ViewerImage").css("opacity","0.4"); 547 $(".ViewerImage").animate({"opacity":"1"}, 200) 548 } 549 if(transition=="zoomin"){ 550 $(".ViewerImage").css("width","40%"); 551 $(".ViewerImage").animate({width: "80%"}, 'slow'); 552 } 553 if(transition=="slide"){
554 $(".ViewerImage").css("left","500px"); 555 $(".ViewerImage").animate({left: '0'}, 200); 556 } 557 if(transition=="slideAndZoom"){ 558 $(".ViewerImage").css("left","500px"); 559 $(".ViewerImage").animate({left: '0'}, 200); 560 $(".ViewerImage").css("left","500px"); 561 $(".ViewerImage").css("opacity","0.4"); 562 $(".ViewerImage").css("width","150px"); 563 $(".ViewerImage").animate({ 564 left: '0', 565 opacity: '1', 566 width: '80%' 567 }); 568 } 569 if(transition=="slideZoom"){ 570 $(".ViewerImage").css("left","500px"); 571 $(".ViewerImage").css("opacity","0.4"); 572 $(".ViewerImage").css("width","150px"); 573 $(".ViewerImage").animate({ 574 left: '0', 575 opacity: '1', 576 width: '80%' 577 }); 578 } 579 if(transition=="ZoominFast"){ 580 $(".ViewerImage").css("width","0"); 581 $(".ViewerImage").animate({ 582 width: '100%' 583 }); 584 } 585 if(transition=="bounce"){ 586 $(".ViewerImage").css("top","-100"); 587 $(".ViewerImage").animate({top: '100'}, 150); 588 $(".ViewerImage").animate({top: '-100'}, 150); 589 $(".ViewerImage").animate({top: '100'}, 150); 590 $(".ViewerImage").animate({top: '0'}, 150); 591 } 592 if(transition=="puffzoom"){ 593 $(".ViewerImage").css("width","10%"); 594 $(".ViewerImage").css("opacity","0.2"); 595 $(".ViewerImage").animate({width: '80%'}, 300); 596 $(".ViewerImage").animate({opacity: '1'}, 100); 597 } 598 } 599 600 }else{ 601 viewerPosition=viewerPosition-1; 602 } 603} 604 605function setGalleryTransition(getTransition){ 606 transition = getTransition; 607} 608function openImage(){ 609 if(monoImageView==1){ 610 window.location = monoImageViewURL; 611 }else{ 612 var url = document.getElementById(viewerPosition).src; 613 window.location = url; 614 } 615 616} 617function zoom(){ 618 619 if(zoomVal==0){ 620 $(".ViewerImage").css({"width":"80%","max-height":"80%","top":"0","right":"0","left":"0"}); 621 $(".ViewerImage").css("height","unset"); 622 } 623 624if(zoomVal==1){ 625 const img = new Image(); 626 img.onload = function() { 627 widthValue = this.width; 628 heightValue = this.height; 629 calc = widthValue/heightValue; 630 $( ".ViewerImage" ).draggable( { disabled: true }); 631 if(calc<1.25){ 632 $(".ViewerImage").animate({"max-height":"80%","top":"0","left":"0"}, 'slow'); 633 zoomVal=0; 634 }else{ 635 $(".ViewerImage").animate({"width":"80%","max-height":"80%","top":"0","right":"0","left":"0"}, 250); 636 $(".ViewerImage").css("height","unset"); 637 638 zoomVal=0; 639 } 640 } 641 var url = $(".ViewerImage").attr('src'); 642 img.src = url; 643}else{ 644 const img = new Image(); 645 img.onload = function() { 646 widthValue = this.width; 647 heightValue = this.height; 648 calc = widthValue/heightValue; 649 $( ".ViewerImage" ).draggable( { disabled: false, scroll: false }); 650 $( ".ViewerImage" ).draggable({ cursor: "pointer" }); 651 if(calc<1.25){ 652 $(".ViewerImage").animate({height: "130%"}, 'slow'); 653 $(".ViewerImage").css("max-height","130%"); 654 zoomVal=1; 655 }else{ 656 $(".ViewerImage").animate({width: "130%","right": "-15%","left":"-15%"}, 250); 657 $(".ViewerImage").css("max-height","130%"); 658 $(".ViewerImage").css("height","unset"); 659 $(".ViewerImage").css("max-width","unset"); 660 zoomVal=1; 661 } 662 } 663 var url = $(".ViewerImage").attr('src'); 664 img.src = url; 665} 666} 667function enableExtraButtons(){ 668share=1; 669enableViewOriginalPictureVal = 1; 670} 671function Share(){ 672 $(".sharebuttons").toggle(); 673 $(".sharebuttons").css("height","0px"); 674 $(".sharebuttons").animate({height: "60px"}, 'slow'); 675} 676function shareFacebook(){ 677 if(monoImageView==1){ 678 var url = document.getElementById(viewerPosition).src; 679 window.open("https://www.facebook.com/sharer/sharer.php?u="+monoImageViewURL, '_blank'); 680 }else{ 681 var url = document.getElementById(viewerPosition).src; 682 window.open("https://www.facebook.com/sharer/sharer.php?u="+url, '_blank'); 683 } 684} 685function shareTwitter(){ 686 if(monoImageView==1){ 687 var url = document.getElementById(viewerPosition).src; 688 window.open("https://twitter.com/intent/tweet?text="+monoImageViewURL, '_blank'); 689 }else{ 690 var url = document.getElementById(viewerPosition).src; 691 window.open("https://twitter.com/intent/tweet?text="+url, '_blank'); 692 } 693} 694function shareGertLink(){ 695 if(monoImageView==1){ 696 const el = document.createElement("textarea"); 697 el.value = monoImageViewURL; 698 document.body.appendChild(el); 699 el.select(); 700 document.execCommand("copy"); 701 document.body.removeChild(el); 702 }else{ 703 var url = document.getElementById(viewerPosition).src; 704 const el = document.createElement("textarea"); 705 el.value = url; 706 document.body.appendChild(el); 707 el.select(); 708 document.execCommand("copy"); 709 document.body.removeChild(el); 710 } 711} 712function setGalleryStyle(style){ 713 galleryStyle=style; 714}
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.