diff --git a/CHANGELOG.md b/CHANGELOG.md index b1195ca..f5ec845 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,6 +3,8 @@ Change Log Recent changes -------------- +* Added JS events for pre-processing of modal content (1.4) +* Improved image and iframe content loading (1.4) * Added support for JS events in modal content (1.3.10) * Fixed IE8 bug that caused the resize event to continuously fire during the show animation (1.3.10) * Fixed IE bug that prevented modal content from showing under certain conditions (1.3.10) diff --git a/README.md b/README.md index 3e84844..77f3fb8 100644 --- a/README.md +++ b/README.md @@ -39,6 +39,37 @@ Example Usage ``` +Events Usage +---------------- +```html + + ... + + + ... + +``` + +```javascript +var modal_links = $('.chaos-modal-link'); + +//Runs on modal link selector before modal is displayed +//Modal variable contains the modal associated with the modal link. +modal_links.on('chaos-modal-preprocess', function( event, modal){ + + $(window).on('chaos-modal-preprocess-interrupt', function( event ){ + //Event fires when modal/loading screen is closed. + }); + + //If you do not want to pre-process every time, set data-preprocess to false + //When done pre-processing + $(this).attr('data-preprocess','false'); + + //Preprocessing function MUST call openModal when preprocessing complete + modal.openModal(); +}); +``` + Features -------- @@ -53,6 +84,7 @@ Features * Inline HTML defined by element id * Iframe lazy loading for iframes in hidden modal content to improve page load. * Internet Explorer support back to version 8. +* Event support for pre-processing the modal content. Wishlist -------- diff --git a/jquery.modal.min.js b/jquery.modal.min.js index e07953e..bbb0fdb 100644 --- a/jquery.modal.min.js +++ b/jquery.modal.min.js @@ -2,14 +2,19 @@ * jQuery Chaos Modal * By Matthew Sigley * Based on concept work by Kevin Liew - http://www.queness.com/post/77/simple-jquery-modal-window-tutorial - * Version 1.3.10 + * Version 1.4 */ -(function(a){function g(c){var b=!1;c.data.alwaysAtTop&&(b=c.data.alwaysAtTop);a.chaosModalCurrent.resizeModal(b)}function h(c){c.preventDefault();a.chaosModalCurrent.closeModal()}function d(c){c.preventDefault();a.chaosModalCurrent.printModal()}function e(c){27==c.which&&(a(this).off("keyup",e),h(c))}a.chaosModalCurrent=null;a.chaosModalMaxWidth=0;a.chaosModalIndex=0;a.chaosModalImagesLoaded=!1;a.chaosModalIframesLoaded=!1;a.fn.openModal=function(c){c=a.extend({},{maskClose:!0,maxWidth:960,closeLink:!0, -printLink:!1,alwaysAtTop:!1},c);this.find('iframe[src=""]').each(function(){var b=a(this),c=b.data("src");c&&b.attr("src",c).attr("data-src","")});var b=this.clone(!0),k=a("body");a("html");var p=a(document),f=a(window),q=c.maskClose,r=c.closeLink,t=c.printLink,n=c.alwaysAtTop;a.chaosModalMaxWidth=c.maxWidth;a.chaosModalCurrent=b;b.attr({id:"chaos-current-modal"});var l=a('
');l.css({position:"absolute","z-index":"9000","background-color":"#000", -display:"none",top:"0",left:"0"});l.prependTo(k);0==b.find(".print-link").length&&t&&(b.prepend('Print'),b.children(".print-link").css({"float":"right",margin:"5px"}));0==b.find(".close-link").length&&r&&(b.prepend('Close'),b.children(".close-link").css({"float":"right",margin:"5px"}));b.css({display:"block",position:"absolute",background:"#fff","z-index":"9001",left:"-10000px",margin:"0",padding:"0"});b.prependTo(k);var m=function(){b.width()>a.chaosModalMaxWidth? -b.width(a.chaosModalMaxWidth):b.width(b.width());b.find("img").css("max-width","100%");b.hide();b.resizeModal(n);l.fadeIn(1E3);l.fadeTo("slow",.8);b.fadeIn(2E3,function(){f.bind("resize",{alwaysAtTop:n},g)});0f&&(f=0);0>d&&(d=0);c?e.scrollTop(0):(f+=e.scrollTop(),c=b.height()-(f+this.height()),0>c&&0<=f+c&&(f+=c));e.scrollLeft(0);this.css({top:f,left:d});return this};a.fn.printModal=function(){window.print()}})(jQuery); -jQuery(document).ready(function(a){function g(){var d=a(this),e=d.attr("src");d.attr("data-src",e).attr("src","")}function h(d){var e=a(this);d.preventDefault();e.off("click",h);var c=e.data("chaos-modal-box-id"),b=d=!1,k=/\.(jpeg|jpg|gif|png|bmp|wbmp)$/i,g=!1;d=c?a("#"+c).first():e.parent().find(".chaos-modal-box").first();d.length?(b=a("
").css({padding:"20px"}),d.clone(!0).css({display:"block"}).appendTo(b),b=a("
").css({background:"#fff"}).append(b)):(k.test(e.attr("href"))? -g=e.attr("href"):(c=e.find("img"),1==c.length&&k.test(c.attr("src"))&&(g=c.attr("src"))),g&&(testRequest=a.ajax(g,{type:"HEAD",async:!1}),200==testRequest.status&&(b=a("
").css({padding:"20px"}),a('').css({display:"block"}).appendTo(b),b=a("
").css({background:"#fff"}).append(b))));b&&(d.remove(),e.attr({href:"#",id:"chaos-modal-link-"+a.chaosModalIndex}),b.attr({id:"chaos-modal-box-"+a.chaosModalIndex}),b.hide(),b.appendTo("body"),e.click(function(){var b=a(this).attr("id").match(/chaos-modal-link-(\d+)/i); -b[1]&&(b=a("#chaos-modal-box-"+b[1]),1==b.length&&b.openModal());return!1}),e.click(),a.chaosModalIndex++);return!1}a(".chaos-modal-link").not("a").each(function(){var d=a(this),e=d.children();d.removeClass("chaos-modal-link");e.not("a").length||1==e.length&&e.addClass("chaos-modal-link")});a("a.chaos-modal-link").one("click",h);a(".chaos-modal-box:hidden iframe").each(g);a(".chaos-modal-link").each(function(){var d=a(this).data("chaos-modal-box-id");d&&a("#"+d+":hidden iframe").each(g)})}); \ No newline at end of file +(function(a){function l(){var a="undefined"!==typeof navigator?navigator.userAgent:"";return/msie|trident/i.test(a)?(a=a.match(/(?:msie |rv:)(\d+(\.\d+)?)/i))&&1Date.now()-a.openTime)return!1;a(document).off(".chaosmodal");null!=a.chaosModalCurrent?a.chaosModalCurrent.closeModal():(a(window).trigger("chaos-modal-preprocess-interrupt"), +a("#chaos-modal-mask").hide().remove(),a.fn.closeLoading());a.modalMask=null}function d(b){b.preventDefault();a.chaosModalCurrent.printModal()}function n(a){27==a.which&&f(a)}function h(){var b=a(document),e=a(window),c=a("html"),b=b.height(),c=c.width(),k=e.height(),e=e.width();a("#chaos-modal-mask").css({width:c,height:b});posx=e/2-parseInt(a("#modal-loading").css("width"))/2;posy=k/2-parseInt(a("#modal-loading").css("height"))/2;a.chaosModalLoading=a("#modal-loading");a.chaosModalLoading.css("top", +posy);a.chaosModalLoading.css("left",posx)}a(window);var m="",m=bowser.msie?bowser.version:l(),q=function(a){if(null===a.offsetParent)return!1;if(11>m){var e="";"undefined"!=typeof getComputedStyle?e=window.getComputedStyle(a).display:"undefined"!=typeof a.currentStyle&&(e=a.currentStyle.display);if("none"==e||"fixed"==e||"absolute"==e)return!1}return!0};a.chaosModalLoading=null;a.modalMask=null;a.chaosModalCurrent=null;a.chaosModalMaxWidth=0;a.chaosModalIndex=0;a.chaosModalImagesLoaded=!1;a.chaosModalIframesLoaded= +!1;a.fn.openModal=function(b){function e(){var b=a(this),c=b.data("src");c&&b.attr("src",c).attr("data-src","")}if(null==a.chaosModalCurrent){b=a.extend({},{maxWidth:960,closeLink:!0,printLink:!1,alwaysAtTop:!1,preprocessing:!1},b);this.find('iframe[src=""]').each(e);var c=this.clone(!0),k=a("body");a("html");a(document);var g=a(window),h=b.closeLink,n=b.printLink,m=b.alwaysAtTop;a.chaosModalMaxWidth=b.maxWidth;a.chaosModalCurrent=c;c.attr({id:"chaos-current-modal"});0==c.find(".print-link").length&& +n&&(c.prepend('Print'),c.children(".print-link").css({"float":"right",margin:"5px"}));0==c.find(".close-link").length&&h&&(c.prepend('Close'),c.children(".close-link").css({"float":"right",margin:"5px"}));c.css({display:"block",position:"absolute",background:"#fff","z-index":"9002",left:"-10000px",margin:"0",padding:"0"});c.prependTo(k);var l=function(){c.width()>a.chaosModalMaxWidth?c.width(a.chaosModalMaxWidth):c.width(c.width());c.find("img").css("max-width", +"100%");c.hide();c.resizeModal(m);a.modalMask.stop();c.fadeIn(2E3,function(){c.resizeModal(m);g.bind("resize",{alwaysAtTop:m},p);a.fn.closeLoading()});0g&&(g=0);0>k&&(k=0);b?c.scrollTop(0):(g+=c.scrollTop(),b=e.height()-(g+this.height()),0>b&&0<=g+b&&(g+=b));c.scrollLeft(0);this.css({top:g,left:k});return this};a.fn.printModal=function(){window.print()};a.fn.showLoading=function(){a.openTime= +Date.now();if(null==a.modalMask){var b=a("body"),e=a(window),c=e.height(),d=e.width();maskClose=!0;a.modalMask=a('
');a.modalMask.css({position:"absolute","z-index":"9000","background-color":"#000",display:"none",top:"0",left:"0"});a.modalMask.prependTo(b);a.modalMask.fadeIn(500);a.modalMask.fadeTo("fast",.8);var b=a(document),e=a(window),g=a("html"),m=b.height(),g=g.width();maskClose&&(a.modalMask.on("click",f),b.on("keyup.chaosmodal",n)); +mLoading');posx=d/2-parseInt(a("#modal-loading").css("width"))/2;posy=c/2-parseInt(a("#modal-loading").css("height"))/2;a.chaosModalLoading=a("#modal-loading");a.chaosModalLoading.css("top",posy);a.chaosModalLoading.css("left",posx);e.bind("resize",{alwaysAtTop:!0},h)}};a.fn.closeLoading=function(){a.chaosModalLoading.remove()}})(jQuery); +jQuery(document).ready(function(a){function l(){var f=a(this),d=f.attr("src");f.attr("data-src",d).attr("src","")}function p(f){var d=a(this);f.preventDefault();d.off("click",p);var n=d.data("chaos-modal-box-id"),h=f=!1,m=/\.(jpeg|jpg|gif|png|bmp|wbmp)$/i,l=!1;f=n?a("#"+n).first():d.parent().find(".chaos-modal-box").first();f.length?(h=a("
").css({padding:"20px"}),f.clone(!0).css({display:"block"}).appendTo(h),h=a("
").css({background:"#fff"}).append(h)):(m.test(d.attr("href"))? +l=d.attr("href"):(n=d.find("img"),1==n.length&&m.test(n.attr("src"))&&(l=n.attr("src"))),l&&(testRequest=a.ajax(l,{type:"HEAD",async:!1}),200==testRequest.status&&(h=a("
").css({padding:"20px"}),a('').css({display:"block"}).appendTo(h),h=a("
").css({background:"#fff"}).append(h))));h&&(f.remove(),d.attr({href:"#",id:"chaos-modal-link-"+a.chaosModalIndex}),h.attr({id:"chaos-modal-box-"+a.chaosModalIndex}),h.hide(),h.appendTo("body"),d.click(function(){a.fn.showLoading(); +preprocess=d.attr("data-preprocess");var b=a(this).attr("id").match(/chaos-modal-link-(\d+)/i);b[1]&&(b=a("#chaos-modal-box-"+b[1]),1==b.length&&"true"!=preprocess?b.openModal():1==b.length&&"true"==preprocess&&d.trigger("chaos-modal-preprocess",b));return!1}),d.click(),a.chaosModalIndex++);return!1}a(".chaos-modal-link").not("a").each(function(){var f=a(this),d=f.children();f.removeClass("chaos-modal-link");d.not("a").length||1==d.length&&d.addClass("chaos-modal-link")});a("a.chaos-modal-link").on("click", +p);a(".chaos-modal-box:hidden iframe").each(l);a(".chaos-modal-link").each(function(){var f=a(this).data("chaos-modal-box-id");f&&a("#"+f+":hidden iframe").each(l)});Date.now||(Date.now=function(){return(new Date).getTime()})}); \ No newline at end of file