/* * venobox - jquery plugin * version: 1.6.0 * @requires jquery * * examples at http://lab.veno.it/venobox/ * license: mit license * license uri: https://github.com/nicolafranchini/venobox/blob/master/license * copyright 2013-2015 nicola franchini - @nicolafranchini * */ (function($){ var autoplay, bgcolor, blocknum, blocktitle, border, core, container, content, dest, evitacontent, evitanext, evitaprev, extracss, figliall, framewidth, frameheight, infinigall, items, keynavigationdisabled, margine, numeratio, overlaycolor, overlay, prima, title, thisgall, thenext, theprev, type, finh, sonh, nextok, prevok; $.fn.extend({ //plugin name - venobox venobox: function(options) { // default option var defaults = { framewidth: '', frameheight: '', border: '0', bgcolor: '#fff', titleattr: 'title', // specific attribute to get a title (e.g. [data-title]) - thanx @mendezcode numeratio: false, infinigall: false, overlayclose: true // disable overlay click-close - thanx @martybalandis }; var option = $.extend(defaults, options); return this.each(function() { var obj = $(this); // prevent double initialization - thanx @matthistuff if(obj.data('venobox')) { return true; } obj.addclass('vbox-item'); obj.data('framewidth', option.framewidth); obj.data('frameheight', option.frameheight); obj.data('border', option.border); obj.data('bgcolor', option.bgcolor); obj.data('numeratio', option.numeratio); obj.data('infinigall', option.infinigall); obj.data('overlayclose', option.overlayclose); obj.data('venobox', true); obj.click(function(e){ e.stoppropagation(); e.preventdefault(); obj = $(this); overlaycolor = obj.data('overlay'); framewidth = obj.data('framewidth'); frameheight = obj.data('frameheight'); // set data-autoplay="true" for vimeo and youtube videos - thanx @zehfernandes autoplay = obj.data('autoplay') || false; border = obj.data('border'); bgcolor = obj.data('bgcolor'); nextok = false; prevok = false; keynavigationdisabled = false; // set a different url to be loaded via ajax using data-href="" - thanx @pixeline dest = obj.data('href') || obj.attr('href'); extracss = obj.data( 'css' ) || ""; $('body').addclass('vbox-open'); core = '
loading...
0/0
x
next
prev
'; $('body').append(core); overlay = $('.vbox-overlay'); container = $('.vbox-container'); content = $('.vbox-content'); blocknum = $('.vbox-num'); blocktitle = $('.vbox-title'); content.html(''); content.css('opacity', '0'); checknav(); overlay.css('min-height', $(window).outerheight()); // fade in overlay overlay.animate({opacity:1}, 250, function(){ if(obj.data('type') == 'iframe'){ loadiframe(); }else if (obj.data('type') == 'inline'){ loadinline(); }else if (obj.data('type') == 'ajax'){ loadajax(); }else if (obj.data('type') == 'vimeo'){ loadvimeo(autoplay); }else if (obj.data('type') == 'youtube'){ loadyoutube(autoplay); } else { content.html(''); preloadfirst(); } }); /* -------- check next / prev -------- */ function checknav(){ thisgall = obj.data('gall'); numeratio = obj.data('numeratio'); infinigall = obj.data('infinigall'); items = $('.vbox-item[data-gall="' + thisgall + '"]'); if(items.length > 1 && numeratio === true){ blocknum.html(items.index(obj)+1 + ' / ' + items.length); blocknum.show(); }else{ blocknum.hide(); } thenext = items.eq( items.index(obj) + 1 ); theprev = items.eq( items.index(obj) - 1 ); if(obj.attr(option.titleattr)){ title = obj.attr(option.titleattr); blocktitle.show(); }else{ title = ''; blocktitle.hide(); } if (items.length > 1 && infinigall === true) { nextok = true; prevok = true; if(thenext.length < 1 ){ thenext = items.eq(0); } if(items.index(obj) < 1 ){ theprev = items.eq( items.index(items.length) ); } } else { if(thenext.length > 0 ){ $('.vbox-next').css('display', 'block'); nextok = true; }else{ $('.vbox-next').css('display', 'none'); nextok = false; } if(items.index(obj) > 0 ){ $('.vbox-prev').css('display', 'block'); prevok = true; }else{ $('.vbox-prev').css('display', 'none'); prevok = false; } } } /* -------- navigation code -------- */ var gallnav = { prev: function() { if (keynavigationdisabled) { return; } else { keynavigationdisabled = true; } overlaycolor = theprev.data('overlay'); framewidth = theprev.data('framewidth'); frameheight = theprev.data('frameheight'); border = theprev.data('border'); bgcolor = theprev.data('bgcolor'); dest = theprev.data('href') || theprev.attr('href'); autoplay = theprev.data('autoplay'); if(theprev.attr(option.titleattr)){ title = theprev.attr(option.titleattr); }else{ title = ''; } if (overlaycolor === undefined ) { overlaycolor = ""; } content.animate({ opacity:0}, 500, function(){ overlay.css('background',overlaycolor); if (theprev.data('type') == 'iframe') { loadiframe(); } else if (theprev.data('type') == 'inline'){ loadinline(); } else if (theprev.data('type') == 'ajax'){ loadajax(); } else if (theprev.data('type') == 'youtube'){ loadyoutube(autoplay); } else if (theprev.data('type') == 'vimeo'){ loadvimeo(autoplay); }else{ content.html(''); preloadfirst(); } obj = theprev; checknav(); keynavigationdisabled = false; }); }, next: function() { if (keynavigationdisabled) { return; } else { keynavigationdisabled = true; } overlaycolor = thenext.data('overlay'); framewidth = thenext.data('framewidth'); frameheight = thenext.data('frameheight'); border = thenext.data('border'); bgcolor = thenext.data('bgcolor'); dest = thenext.data('href') || thenext.attr('href'); autoplay = thenext.data('autoplay'); if(thenext.attr(option.titleattr)){ title = thenext.attr(option.titleattr); }else{ title = ''; } if (overlaycolor === undefined ) { overlaycolor = ""; } content.animate({ opacity:0}, 500, function(){ overlay.css('background',overlaycolor); if (thenext.data('type') == 'iframe') { loadiframe(); } else if (thenext.data('type') == 'inline'){ loadinline(); } else if (thenext.data('type') == 'ajax'){ loadajax(); } else if (thenext.data('type') == 'youtube'){ loadyoutube(autoplay); } else if (thenext.data('type') == 'vimeo'){ loadvimeo(autoplay); }else{ content.html(''); preloadfirst(); } obj = thenext; checknav(); keynavigationdisabled = false; }); } }; /* -------- navigate with arrow keys -------- */ $('body').keydown(function(e) { if(e.keycode == 37 && prevok == true) { // left gallnav.prev(); } if(e.keycode == 39 && nextok == true) { // right gallnav.next(); } }); /* -------- prevgall -------- */ $('.vbox-prev').click(function(){ gallnav.prev(); }); /* -------- nextgall -------- */ $('.vbox-next').click(function(){ gallnav.next(); }); /* -------- escape handler -------- */ function escapehandler(e) { if(e.keycode === 27) { closevbox(); } } /* -------- close vbox -------- */ function closevbox(){ $('body').removeclass('vbox-open'); $('body').unbind('keydown', escapehandler); overlay.animate({opacity:0}, 500, function(){ overlay.remove(); keynavigationdisabled = false; obj.focus(); }); } /* -------- close click -------- */ var closeclickclass = '.vbox-close, .vbox-overlay'; if(!obj.data('overlayclose')){ closeclickclass = '.vbox-close'; // close only on x } $(closeclickclass).click(function(e){ evitacontent = '.figlio'; evitaprev = '.vbox-prev'; evitanext = '.vbox-next'; figliall = '.figlio *'; if(!$(e.target).is(evitacontent) && !$(e.target).is(evitanext) && !$(e.target).is(evitaprev)&& !$(e.target).is(figliall)){ closevbox(); } }); $('body').keydown(escapehandler); return false; }); }); } }); /* -------- load ajax -------- */ function loadajax(){ $.ajax({ url: dest, cache: false }).done(function( msg ) { content.html('
'+ msg +'
'); updateoverlay(true); }).fail(function() { content.html('

error retrieving contents, please retry

'); updateoverlay(true); }) } /* -------- load iframe -------- */ function loadiframe(){ content.html(''); // $('.venoframe').load(function(){ // valid only for iframes in same domain updateoverlay(); // }); } /* -------- load vimeo -------- */ function loadvimeo(autoplay){ var pezzi = dest.split('/'); var videoid = pezzi[pezzi.length-1]; var stringautoplay = autoplay ? "?autoplay=1" : ""; content.html(''); updateoverlay(); } /* -------- load youtube -------- */ function loadyoutube(autoplay){ var pezzi = dest.split('/'); var videoid = pezzi[pezzi.length-1]; var stringautoplay = autoplay ? "?autoplay=1" : ""; content.html(''); updateoverlay(); } /* -------- load inline -------- */ function loadinline(){ content.html('
'+$(dest).html()+'
'); updateoverlay(); } /* -------- preload image -------- */ function preloadfirst(){ prima = $('.vbox-content').find('img'); prima.one('load', function() { updateoverlay(); }).each(function() { if(this.complete) $(this).load(); }); } /* -------- center on load -------- */ function updateoverlay(){ blocktitle.html(title); content.find(">:first-child").addclass('figlio'); $('.figlio').css('width', framewidth).css('height', frameheight).css('padding', border).css('background', bgcolor); sonh = content.outerheight(); finh = $(window).height(); if(sonh+80 < finh){ margine = (finh - sonh)/2; content.css('margin-top', margine); content.css('margin-bottom', margine); }else{ content.css('margin-top', '40px'); content.css('margin-bottom', '40px'); } content.animate({ 'opacity': '1' },'slow'); } /* -------- center on resize -------- */ function updateoverlayresize(){ if($('.vbox-content').length){ sonh = content.height(); finh = $(window).height(); if(sonh+80 < finh){ margine = (finh - sonh)/2; content.css('margin-top', margine); content.css('margin-bottom', margine); }else{ content.css('margin-top', '40px'); content.css('margin-bottom', '40px'); } } } $(window).resize(function(){ updateoverlayresize(); }); })(jquery);