descBox.min.js

/**
 * Created by Stef van den Berg
 * on 09/04/14
 *
 * This plugin is created to show a large preview of an image with html description
 *
 * Settings:
 *
 *  labelNext:  label that is set for the next tag
 *  labelPrevious:  label that is set for the previous tag
 *  labelClose:  label that is set for the close tag
 *  labelNext:  label that is set for the next tag
 *  labelSlideStart:  label that is set for the start slide show tag
 *  labelSlideStop:  label that is set for the stop slide show tag
 *  slideShowRepeat:  Repeat the slide show when true, Stop at last slide when false
 *  slideShowTime:  Pause between the slides in ms
 *  totalAnimationTime: Duration off the show animation in ms
 */

(function(e){e.fn.descBox=function(t){return this.each(function(){function u(){var t=e("body");if(t.find(".desc-mask").length==0){t.append('<div class="desc-mask"><div class="desc-close">'+n.labelClose+"</div></div>");var r=e(".desc-close");r.on("click",function(){var t=e(this);var r=t.parent(".desc-mask");var i=e(".desc-preview");var s=e(".desc-preview-description");var o=e(".desc-preview-background");o.remove();i.remove();r.remove();s.remove();if(n.slideShowInterval!=null){window.clearInterval(n.slideShowInterval)}})}}function a(t,r,i,s,o,u){var a=e("body");if(a.find(".desc-preview").length==0){a.append('<div class="desc-preview"></div>');a.append('<div class="desc-preview-background"></div>');var p=e(".desc-preview");p.append('<img src="'+t+'" alt="'+r+'" class="desc-img-responsive" />');var d=e(".desc-img-responsive");d.css({opacity:0});var v=a.width();var m=a.height();var g=Math.ceil(d.width()/v*100)+5;var y=Math.ceil(d.height()/m*100)+10;var b=e(".desc-preview-background");b.animate({width:g+"%",height:y+"%",left:"10%"},n.totalAnimationTime/100*50,function(){a.append('<div class="desc-preview-description"></div>');var t=e(".desc-preview-description");t.css({opacity:0});t.html("<h2>"+r+"</h2>"+i);if(s){l(o,u);f(o,u);var p=n.slideShowStarted?n.labelSlideStop:n.labelSlideStart;t.append('<div class="desc-preview-slide">'+p+"</div>");var v=e(".desc-preview-slide");if(n.slideShowStarted){v.off("click");v.on("click",function(){h()})}else{var v=e(".desc-preview-slide");v.off("click");v.on("click",function(){c(o,u)})}}t.animate({opacity:1},n.totalAnimationTime/100*25,function(){d.animate({opacity:1},n.totalAnimationTime/100*25)})})}}function f(t,r){var i=r.next("[data-preview="+t+"]");if(i.length!=0){var s=e(".desc-preview-description");s.append('<div class="desc-arrow-next">'+n.labelNext+"</div>");var o=e(".desc-arrow-next");o.on("click",function(){var r=e(".desc-mask");var s=e(".desc-preview");var o=e(".desc-preview-description");var f=e(".desc-preview-background");f.remove();s.remove();r.remove();o.remove();if(n.slideShowInterval!=null){h()}u();a(i.find(".desc-image").attr("src"),i.find(".desc-title").html(),i.find(".desc-description").html(),true,t,i)})}}function l(t,r){var i=r.prev("[data-preview="+t+"]");if(i.length!=0){var s=e(".desc-preview-description");s.append('<div class="desc-arrow-previous">'+n.labelPrevious+"</div>");var f=e(".desc-arrow-previous");f.on("click",function(){var r=e(".desc-mask");var s=e(".desc-preview");var f=e(".desc-preview-description");var l=e(".desc-preview-background");l.remove();s.remove();r.remove();f.remove();if(n.slideShowInterval!=null){h()}u();a(i.find(".desc-image").attr("src"),i.find(".desc-title").html(),i.find(".desc-description").html(),o,t,i)})}}function c(t,r){var i=e(".desc-preview-slide");i.off("click");i.on("click",function(){h()});i.text(n.labelSlideStop);n.slideShowStarted=true;n.slideShowElement=r.get(0);n.slideShowCollectionName=t;n.slideShowInterval=setInterval(function(){var t=null;var r=e(n.slideShowElement).next("[data-preview="+n.slideShowCollectionName+"]");if(r.length!=0){t=r}else{if(n.slideShowRepeat){var i=e("[data-preview="+n.slideShowCollectionName+"]").eq(0);n.slideShowElement=i;t=i}else{h();var s=e(".desc-preview-slide");s.remove()}}if(t!=null){n.slideShowElement=t.get(0);var o=e(".desc-mask");var f=e(".desc-preview");var l=e(".desc-preview-description");var c=e(".desc-preview-background");c.remove();f.remove();o.remove();l.remove();u();a(t.find(".desc-image").attr("src"),t.find(".desc-title").html(),t.find(".desc-description").html(),true,n.slideShowCollectionName,t)}},n.slideShowTime)}function h(){window.clearInterval(n.slideShowInterval);n.slideShowStarted=false;n.slideShowCollectionName="";n.slideShowInterval=null;n.slideShowElement=null;var t=e(".desc-mask");var r=e(".desc-preview");var i=e(".desc-preview-description");var s=e(".desc-preview-background");s.remove();r.remove();t.remove();i.remove()}var n=e.extend({collection:false,labelNext:"Next",labelPrevious:"Previous",labelClose:"Close",labelSlideStart:"Start slideshow",labelSlideStop:"Stop slideshow",slideShowStarted:false,slideShowElement:null,slideShowCollectionName:"",slideShowInterval:null,slideShowRepeat:true,slideShowTime:3500,totalAnimationTime:500},t||{});var r=e(this);var i=r.attr("data-preview");var s=e("[data-preview="+i+"]");var o=s.length>1;r.on("click",function(){var t=e(this);var n=t.find(".desc-description").html();var r=t.find(".desc-title").html();var s=t.find(".desc-image");u();a(s.attr("src"),r,n,o,i,t)})})};e.fn.descBox.defaultSettings={}})(jQuery)