From 7762861308d9d7ab081cb4c7b1757ceff38f729f Mon Sep 17 00:00:00 2001 From: HTMLGuyLLC Date: Thu, 25 Oct 2018 15:36:20 -0400 Subject: [PATCH] fix for chainability (return this instead of false), added new options 'target' and 'open_now' --- README.md | 5 +++++ index.html | 5 +++++ jConfirm.js | 24 ++++++++++++++++++------ jConfirm.min.js | 8 ++++---- package.json | 2 +- 5 files changed, 33 insertions(+), 11 deletions(-) diff --git a/README.md b/README.md index ea350cc..8fb8cd8 100755 --- a/README.md +++ b/README.md @@ -93,6 +93,11 @@ $(function(){ theme: 'black', //string ('tiny', 'small', 'medium', 'large') size: 'small', + //boolean: show the tooltip immediately on instantiation + show_now: false, + //string|null: tie the handler to a child of the supplier dom element (good for dynamically added elements) + //for example: $('body').jConfirm({'target':'a.confirm'}).on('confirm', function(){ }); + target: null, //string|false ('black', 'white', 'blurred') backdrop: false }).on('confirm', function(e){ diff --git a/index.html b/index.html index d549fb9..264c570 100755 --- a/index.html +++ b/index.html @@ -190,6 +190,11 @@

All options and events with defaults:

theme: 'black', //string ('tiny', 'small', 'medium', 'large') size: 'small', + //boolean: show the tooltip immediately on instantiation + show_now: false, + //string|null: tie the handler to a child of the supplier dom element (good for dynamically added elements) + //for example: $('body').jConfirm({'target':'a.confirm'}).on('confirm', function(){ }); + target: null, //string: class(es) to add to the tooltip 'class': '' }).on('confirm', function(e){ diff --git a/jConfirm.js b/jConfirm.js index cbbb6ea..3b1bab3 100755 --- a/jConfirm.js +++ b/jConfirm.js @@ -20,7 +20,7 @@ //if there's nothing being passed if( typeof this === 'undefined' || this.length !== 1 ) { - return false; + return this; } //get list of options @@ -47,6 +47,8 @@ deny_text: options.deny_text, show_deny_btn: options.show_deny_btn, position: options.position, + show_now: options.show_now, + target: options.target, dataAttr: 'jConfirm', //create tooltip html createTooltipHTML: function(){ @@ -103,8 +105,8 @@ if( typeof existing !== 'undefined' && existing !== null ) { //disable handler - existing.dom_wrapped.off('touchstart mousedown', existing.toggleTooltipHandler); - existing.dom_wrapped.off('click', existing.preventDefaultHandler); + existing.dom_wrapped.off('touchstart mousedown', helper.target, existing.toggleTooltipHandler); + existing.dom_wrapped.off('click', helper.target, existing.preventDefaultHandler); //attach resize handler to reposition tooltip $(window).off('resize', existing.onResize); @@ -121,8 +123,8 @@ //attach on handler to show tooltip //use touchstart and mousedown just like if you click outside the tooltip to close it //this way it blocks the hide if you click the button a second time to close the tooltip - helper.dom_wrapped.on('touchstart mousedown', helper.toggleTooltipHandler); - helper.dom_wrapped.on('click', helper.preventDefaultHandler); + helper.dom_wrapped.on('touchstart mousedown', helper.target, helper.toggleTooltipHandler); + helper.dom_wrapped.on('click', helper.target, helper.preventDefaultHandler); //attach to dom for easy access later helper.dom_wrapped.data(helper.dataAttr, helper); @@ -474,7 +476,15 @@ helper.destroy(); - return helper.initialize(); + var initialized = helper.initialize(); + + //if showing immediately, do it! + if( helper.show_now ) + { + helper.show(); + } + + return initialized; }; $.jConfirm = {}; @@ -496,6 +506,8 @@ theme: 'black', size: 'small', backdrop: false, + show_now: false, + target: null, } })(jQuery); \ No newline at end of file diff --git a/jConfirm.min.js b/jConfirm.min.js index 6ab811f..708d9ad 100755 --- a/jConfirm.min.js +++ b/jConfirm.min.js @@ -5,7 +5,7 @@ https://htmlguy.com MIT Licensed */ -(function(a){a.fn.jConfirm=function(b){if(1 -
`;return c.question&&0'+c.question+''),d+='
',a.each(c.btns,function(f,g){d+=`
- ${g.text} -
`}),d+='
',d},createBackdropHTML:function(){return!!c.backdrop&&`
`},destroy:function(){const d=c.dom_wrapped.data(c.dataAttr);'undefined'!=typeof d&&null!==d&&(d.dom_wrapped.off('touchstart mousedown',d.toggleTooltipHandler),d.dom_wrapped.off('click',d.preventDefaultHandler),a(window).off('resize',d.onResize),d.isVisible()&&d.hide(),d.dom_wrapped.data(d.dataAttr,null))},initialize:function(){return c.dom_wrapped.on('touchstart mousedown',c.toggleTooltipHandler),c.dom_wrapped.on('click',c.preventDefaultHandler),c.dom_wrapped.data(c.dataAttr,c),c.dom},preventDefaultHandler:function(d){return d.preventDefault(),!1},toggleTooltipHandler:function(d){return d.preventDefault(),c.isVisible()?c.hide():c.show(),!1},show:function(d){if(c.isVisible())return!1;null!==a.jConfirm.current&&a.jConfirm.current.hide();const f=a('body');'blurred'===c.backdrop?f.addClass('jc-blurred-body'):c.backdrop&&f.append(c.createBackdropHTML()),f.append(c.createTooltipHTML()),c.tooltip=a('.jc-tooltip'),c.attachTooltipHandlers(),c.positionTooltip(),a(window).on('resize',c.onResize),c.hide_on_click&&a(document).on('touchstart mousedown',c.onClickOutside);const g='jconfirm'+Date.now();c.tooltip.attr('id',g),c.dom.attr('aria-describedby',g),a.jConfirm.current={dom:c.dom,hide:c.hide},('undefined'==typeof d||d)&&c.dom.trigger('jc-show',{tooltip:c.tooltip})},isVisible:function(){return null!==a.jConfirm.current&&c.dom===a.jConfirm.current.dom},hide:function(d){return a(window).off('resize',c.onResize),c.hide_on_click&&a(document).off('touchstart mousedown',c.onClickOutside),c.dom.attr('aria-describedby',null),c.tooltip.remove(),'blurred'===c.backdrop?a('body').removeClass('jc-blurred-body'):c.backdrop&&a('.jc-backdrop').remove(),a.jConfirm.current=null,('undefined'==typeof d||d)&&c.dom.trigger('jc-hide'),c.dom},onResize:function(){c.hide(!1),c.show(!1)},onClickOutside:function(d){const f=a(d.target);f.hasClass('jc-tooltip')||f.parents('.jc-tooltip:first').length||c.hide()},attachTooltipHandlers:function(){c.tooltip.find('.jc-button').on('click',function(d){d.preventDefault();const f=a(this);return c.dom_wrapped.trigger(f.data('event')),c.hide(),'confirm'===f.data('event')&&c.follow_href&&(c.open_new_tab?window.open(c.dom_wrapped.prop('href'),'_blank'):window.location.href=c.dom_wrapped.prop('href')),!1})},positionTooltip:function(){c.positionDebug('-- Start positioning --');let d=c.tooltip.find('.jc-arrow'),[f,g,h,i,j,k]=c.calculateSafePosition(c.position);return('undefined'==typeof j&&(c.positionDebug('Couldn\'t fit preferred position, downsizing and trying again'),c.tooltip.addClass('jc-tight-fit'),[f,k,j,k,j,k]=c.calculateSafePosition(c.position)),'undefined'==typeof j&&'auto'!==c.position&&(c.positionDebug('Couldn\'t fit preferred position'),[f,k,j,k,j,k]=c.calculateSafePosition('auto')),'undefined'==typeof j)?(c.positionDebug('Doesn\'t appear to fit. Displaying centered'),c.tooltip.addClass('jc-centered').css({top:'50%',left:'50%','margin-left':-(h/2),'margin-top':-(i/2)}),d.remove(),void c.positionDebug('-- Done positioning --')):(c.positionDebug({'Setting Position':{Left:j,Top:k}}),c.tooltip.css('left',j),c.tooltip.css('top',k),60>g&&(c.positionDebug('Element is less than '+g+'px. Setting arrow to hug the side tighter'),f+=' jc-arrow-super-hug'),d.addClass('jc-arrow-'+f),c.positionDebug('-- Done positioning --'),c)},calculateSafePosition:function(d){let f=c.tooltip.find('.jc-arrow'),g=c.dom_wrapped.offset(),h=c.dom_wrapped.outerHeight(),i=c.dom_wrapped.outerWidth(),j=parseInt(c.dom_wrapped.css('marginLeft').replace('px','')),k=parseInt(c.dom_wrapped.css('marginTop').replace('px',''));g.left+=j,g.top+=k;let l=c.tooltip.outerWidth(),m=c.tooltip.outerHeight(),n=document.querySelector('body').offsetWidth,o=document.querySelector('body').offsetHeight,p=f.is(':visible')?f.outerHeight():0,q=f.is(':visible')?f.outerWidth():0,r={};r.below=5 +
`;return c.question&&0'+c.question+''),f+='
',a.each(c.btns,function(g,h){f+=`
+ ${h.text} +
`}),f+='
',f},createBackdropHTML:function(){return!!c.backdrop&&`
`},destroy:function(){const f=c.dom_wrapped.data(c.dataAttr);'undefined'!=typeof f&&null!==f&&(f.dom_wrapped.off('touchstart mousedown',c.target,f.toggleTooltipHandler),f.dom_wrapped.off('click',c.target,f.preventDefaultHandler),a(window).off('resize',f.onResize),f.isVisible()&&f.hide(),f.dom_wrapped.data(f.dataAttr,null))},initialize:function(){return c.dom_wrapped.on('touchstart mousedown',c.target,c.toggleTooltipHandler),c.dom_wrapped.on('click',c.target,c.preventDefaultHandler),c.dom_wrapped.data(c.dataAttr,c),c.dom},preventDefaultHandler:function(f){return f.preventDefault(),!1},toggleTooltipHandler:function(f){return f.preventDefault(),c.isVisible()?c.hide():c.show(),!1},show:function(f){if(c.isVisible())return!1;null!==a.jConfirm.current&&a.jConfirm.current.hide();const g=a('body');'blurred'===c.backdrop?g.addClass('jc-blurred-body'):c.backdrop&&g.append(c.createBackdropHTML()),g.append(c.createTooltipHTML()),c.tooltip=a('.jc-tooltip'),c.attachTooltipHandlers(),c.positionTooltip(),a(window).on('resize',c.onResize),c.hide_on_click&&a(document).on('touchstart mousedown',c.onClickOutside);const h='jconfirm'+Date.now();c.tooltip.attr('id',h),c.dom.attr('aria-describedby',h),a.jConfirm.current={dom:c.dom,hide:c.hide},('undefined'==typeof f||f)&&c.dom.trigger('jc-show',{tooltip:c.tooltip})},isVisible:function(){return null!==a.jConfirm.current&&c.dom===a.jConfirm.current.dom},hide:function(f){return a(window).off('resize',c.onResize),c.hide_on_click&&a(document).off('touchstart mousedown',c.onClickOutside),c.dom.attr('aria-describedby',null),c.tooltip.remove(),'blurred'===c.backdrop?a('body').removeClass('jc-blurred-body'):c.backdrop&&a('.jc-backdrop').remove(),a.jConfirm.current=null,('undefined'==typeof f||f)&&c.dom.trigger('jc-hide'),c.dom},onResize:function(){c.hide(!1),c.show(!1)},onClickOutside:function(f){const g=a(f.target);g.hasClass('jc-tooltip')||g.parents('.jc-tooltip:first').length||c.hide()},attachTooltipHandlers:function(){c.tooltip.find('.jc-button').on('click',function(f){f.preventDefault();const g=a(this);return c.dom_wrapped.trigger(g.data('event')),c.hide(),'confirm'===g.data('event')&&c.follow_href&&(c.open_new_tab?window.open(c.dom_wrapped.prop('href'),'_blank'):window.location.href=c.dom_wrapped.prop('href')),!1})},positionTooltip:function(){c.positionDebug('-- Start positioning --');let f=c.tooltip.find('.jc-arrow'),[g,h,i,j,k,l]=c.calculateSafePosition(c.position);return('undefined'==typeof k&&(c.positionDebug('Couldn\'t fit preferred position, downsizing and trying again'),c.tooltip.addClass('jc-tight-fit'),[g,l,k,l,k,l]=c.calculateSafePosition(c.position)),'undefined'==typeof k&&'auto'!==c.position&&(c.positionDebug('Couldn\'t fit preferred position'),[g,l,k,l,k,l]=c.calculateSafePosition('auto')),'undefined'==typeof k)?(c.positionDebug('Doesn\'t appear to fit. Displaying centered'),c.tooltip.addClass('jc-centered').css({top:'50%',left:'50%','margin-left':-(i/2),'margin-top':-(j/2)}),f.remove(),void c.positionDebug('-- Done positioning --')):(c.positionDebug({'Setting Position':{Left:k,Top:l}}),c.tooltip.css('left',k),c.tooltip.css('top',l),60>h&&(c.positionDebug('Element is less than '+h+'px. Setting arrow to hug the side tighter'),g+=' jc-arrow-super-hug'),f.addClass('jc-arrow-'+g),c.positionDebug('-- Done positioning --'),c)},calculateSafePosition:function(f){let g=c.tooltip.find('.jc-arrow'),h=c.dom_wrapped.offset(),i=c.dom_wrapped.outerHeight(),j=c.dom_wrapped.outerWidth(),k=parseInt(c.dom_wrapped.css('marginLeft').replace('px','')),l=parseInt(c.dom_wrapped.css('marginTop').replace('px',''));h.left+=k,h.top+=l;let m=c.tooltip.outerWidth(),n=c.tooltip.outerHeight(),o=document.querySelector('body').offsetWidth,p=document.querySelector('body').offsetHeight,q=g.is(':visible')?g.outerHeight():0,r=g.is(':visible')?g.outerWidth():0,s={};s.below=5