Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
zebra_dialog
Advanced tools
zebra_dialog - npm Package Compare versions
Comparing version 1.6.0 to 2.0.0
@@ -0,1 +1,9 @@ | ||
| ## version 2.0.0 (August 01, 2018) | ||
| - added a new "auto_focus_button" property for indicating the button to place the focus on when a dialog box is first shown | ||
| - simplified dialogs' HTML markup and all the classes indicating various states/setups of the dialog box are now added to the main container | ||
| - some of the alignments done previously from JavaScript are now done from CSS - but still working in IE6 :) | ||
| - completely rewritten the CSS for the themes and we're now using [clean-css](https://github.com/jakubpawlowicz/clean-css#how-to-use-clean-css-api) to optimize CSS output, resulting in a reduction of 0.5KB for the flat theme and 1.8KB for the classic theme | ||
| - added a new *materialize* theme, inspired by Google Material Design | ||
| ## version 1.6.0 (July 10, 2018) | ||
@@ -2,0 +10,0 @@ |
@@ -1,1 +0,1 @@ | ||
| !function(t){"use strict";t.Zebra_Dialog=function(){this.version="1.6.0";var e,s={animation_speed_hide:250,animation_speed_show:0,auto_close:!1,buttons:!0,center_buttons:!1,custom_class:!1,keyboard:!0,max_height:0,message:"",modal:!0,overlay_close:!0,overlay_opacity:".9",position:"center",reposition_speed:500,show_close_button:!0,source:!1,title:"",type:"information",vcenter_short_message:!0,width:0,onClose:null},i=this,o={},a=function(){var s,o,a,r=t(window).width(),g=t(window).height(),c=i.dialog.width(),d=i.dialog.height(),p={left:0,top:0,right:r-c,bottom:g-d,center:(r-c)/2,middle:(g-d)/2};i.dialog_left=void 0,i.dialog_top=void 0,t.isArray(i.settings.position)&&2===i.settings.position.length&&"string"==typeof i.settings.position[0]&&i.settings.position[0].match(/^(left|right|center)[\s0-9\+\-]*$/)&&"string"==typeof i.settings.position[1]&&i.settings.position[1].match(/^(top|bottom|middle)[\s0-9\+\-]*$/)&&(i.settings.position[0]=i.settings.position[0].toLowerCase(),i.settings.position[1]=i.settings.position[1].toLowerCase(),t.each(p,function(t,e){var s,o;for(s=0;s<2;s++)(o=i.settings.position[s].replace(t,e))!==i.settings.position[s]&&(0===s?i.dialog_left=l(o):i.dialog_top=l(o))})),void 0!==i.dialog_left&&void 0!==i.dialog_top||(i.dialog_left=p.center,i.dialog_top=p.middle),i.dialog_top<0&&(i.dialog_top=0),d>g&&i.message.css("height",g-(t(".ZebraDialog_Title",i.dialog)?t(".ZebraDialog_Title",i.dialog).outerHeight():0)-(t(".ZebraDialog_ButtonsOuter",i.dialog)?t(".ZebraDialog_ButtonsOuter",i.dialog).outerHeight():0)-(parseFloat(i.message.css("paddingTop"))||0)-(parseFloat(i.message.css("paddingBottom"))||0)-(parseFloat(i.message.css("borderTopWidth"))||0)-(parseFloat(i.message.css("borderBottomWidth"))||0)),i.settings.vcenter_short_message&&(o=(s=i.message.find("div:first")).height())<(a=i.message.height())&&s.css({"padding-top":(a-o)/2}),"boolean"==typeof arguments[0]&&!1===arguments[0]||0===i.settings.reposition_speed?i.dialog.css({left:i.dialog_left,top:i.dialog_top,visibility:"visible",opacity:0}).animate({opacity:"1"},i.settings.animation_speed_show):(i.dialog.stop(!0),i.dialog.css("visibility","visible").animate({left:i.dialog_left,top:i.dialog_top},i.settings.reposition_speed)),void 0===e&&i.dialog.find("a[class^=ZebraDialog_Button]:first").focus(),i.isIE6&&setTimeout(n,500)},n=function(){var e=t(window).scrollTop(),s=t(window).scrollLeft();i.settings.modal&&i.overlay.css({top:e,left:s}),i.dialog.css({left:i.dialog_left+s,top:i.dialog_top+e})},r=function(){if(!0!==i.settings.buttons&&!t.isArray(i.settings.buttons))return!1;if(!0===i.settings.buttons)switch(i.settings.type){case"question":case"warning":i.settings.buttons=["Ok","Cancel"];break;default:i.settings.buttons=["Ok"]}return i.settings.buttons},g=function(){switch(i.settings.type){case"confirmation":case"error":case"information":case"question":case"warning":return i.settings.type.charAt(0).toUpperCase()+i.settings.type.slice(1).toLowerCase();default:return!1}},l=function(t){var e=0;for(t=t.replace(/\s/g,"").match(/[+\-]?([0-9\.\s]+)/g)||[];t.length;)e+=parseFloat(t.shift());return e},c={init:function(){this.name=this.searchString(this.dataBrowser)||"",this.version=this.searchVersion(navigator.userAgent)||this.searchVersion(navigator.appVersion)||""},searchString:function(t){var e,s,i;for(e=0;e<t.length;e++)if(s=t[e].string,i=t[e].prop,this.versionSearchString=t[e].versionSearch||t[e].identity,s){if(-1!==s.indexOf(t[e].subString))return t[e].identity}else if(i)return t[e].identity},searchVersion:function(t){var e=t.indexOf(this.versionSearchString);if(-1!==e)return parseFloat(t.substring(e+this.versionSearchString.length+1))},dataBrowser:[{string:navigator.userAgent,subString:"MSIE",identity:"explorer",versionSearch:"MSIE"}]};return i.settings={},"string"==typeof arguments[0]&&(o.message=arguments[0]),"object"!=typeof arguments[0]&&"object"!=typeof arguments[1]||(o=t.extend(o,"object"==typeof arguments[0]?arguments[0]:arguments[1])),i.init=function(){var l,d,p,u,h,f,m,_,v,b,y,w;if(i.settings=t.extend({},s,o),i.isIE6="explorer"===c.name&&6===c.version||!1,i.settings.modal&&(i.overlay=t("<div>",{class:"ZebraDialogOverlay"}).css({position:i.isIE6?"absolute":"fixed",left:0,top:0,opacity:i.settings.overlay_opacity}),i.settings.overlay_close&&i.overlay.on("click",function(){i.close()}),i.overlay.appendTo("body")),i.dialog=t("<div>",{class:"ZebraDialog"+(i.settings.custom_class?" "+i.settings.custom_class:"")}).css({position:i.isIE6?"absolute":"fixed",left:0,top:0,visibility:"hidden"}),!i.settings.buttons&&i.settings.auto_close&&i.dialog.attr("id","ZebraDialog_"+Math.floor(9999999*Math.random())),y=parseInt(i.settings.width,10),!isNaN(y)&&y===i.settings.width&&y.toString()===i.settings.width.toString()&&y>0&&i.dialog.css({width:i.settings.width}),i.settings.title&&(b=t("<h3>",{class:"ZebraDialog_Title"}).html(i.settings.title).appendTo(i.dialog)),u=r(),d=t("<div>",{class:"ZebraDialog_BodyOuter"+(i.settings.title?"":" ZebraDialog_NoTitle")+(u?"":" ZebraDialog_NoButtons")}).appendTo(i.dialog),i.message=t("<div>",{class:"ZebraDialog_Body"+(!1!==g()?" ZebraDialog_Icon ZebraDialog_"+g():"")}),i.settings.max_height>0&&(i.message.css("max-height",i.settings.max_height),i.isIE6&&i.message.attr("style","height: expression(this.scrollHeight > "+i.settings.max_height+' ? "'+i.settings.max_height+'px" : "85px")')),i.settings.vcenter_short_message?t("<div>").html(i.settings.message).appendTo(i.message):i.message.html(i.settings.message),i.settings.source&&"object"==typeof i.settings.source){h=i.settings.vcenter_short_message?t("div:first",i.message):i.message;for(w in i.settings.source)switch(w){case"ajax":l="string"==typeof i.settings.source[w]?{url:i.settings.source[w]}:i.settings.source[w],v=t("<div>").attr("class","ZebraDialog_Preloader").appendTo(h),l.success=function(t){v.remove(),h.append(t),a(!1)},t.ajax(l);break;case"iframe":m={width:"100%",height:"100%",marginheight:"0",marginwidth:"0",frameborder:"0"},_=t.extend(m,"string"==typeof i.settings.source[w]?{src:i.settings.source[w]}:i.settings.source[w]),h.append(t("<iframe>").attr(_));break;case"inline":h.append(i.settings.source[w])}}return i.message.appendTo(d),u&&(u.reverse(),p=t("<div>",{class:"ZebraDialog_Buttons"}).appendTo(i.dialog),t.each(u,function(e,s){var o=t("<a>",{href:"javascript:void(0)",class:"ZebraDialog_Button_"+e+(void 0!==s.custom_class&&""!==s.custom_class.toString().trim()?" "+s.custom_class:"")});void 0!==s.caption?o.html(s.caption):o.html(s),o.on("click",function(){var t=!0;void 0!==s.callback&&(t=s.callback(i.dialog)),!1!==t&&i.close(void 0!==s.caption?s.caption:s)}),o.appendTo(p)}),p.wrap(t("<div>").addClass("ZebraDialog_ButtonsOuter"+(i.settings.center_buttons?" ZebraDialog_Buttons_Centered":"")))),i.dialog.appendTo("body"),i.settings.show_close_button&&(f=t('<a href="javascript:void(0)" class="ZebraDialog_Close">×</a>').on("click",function(t){t.preventDefault(),i.close()}).appendTo(b||i.message),b&&f.css({right:parseInt(b.css("paddingRight"),10),top:(parseInt(b.css("height"),10)+parseInt(b.css("paddingTop"),10)+parseInt(b.css("paddingBottom"),10)-f.height())/2})),t(window).on("resize.Zebra_Dialog",function(){clearTimeout(e),e=setTimeout(function(){a()},100)}),i.settings.keyboard&&t(document).on("keyup.Zebra_Dialog",function(t){return 27===t.which&&i.close(),!0}),i.isIE6&&t(window).on("scroll.Zebra_Dialog",function(){n()}),!1!==i.settings.auto_close&&(i.dialog.on("click",function(){clearTimeout(i.timeout),i.close()}),i.timeout=setTimeout(i.close,i.settings.auto_close)),a(!1),i},i.close=function(e){t(document).off(".Zebra_Dialog"),t(window).off(".Zebra_Dialog"),i.overlay&&i.overlay.animate({opacity:"0"},i.settings.animation_speed_hide,function(){i.overlay.remove()}),i.dialog.animate({top:"0",opacity:"0"},i.settings.animation_speed_hide,function(){i.dialog.remove(),i.settings.onClose&&"function"==typeof i.settings.onClose&&i.settings.onClose(void 0!==e?e:"")})},c.init(),i.init()}}(jQuery); | ||
| !function(m){"use strict";m.Zebra_Dialog=function(){var c,d={animation_speed_hide:250,animation_speed_show:0,auto_close:!(this.version="2.0.0"),auto_focus_button:!0,buttons:!0,center_buttons:!1,custom_class:!1,keyboard:!0,max_height:0,message:"",modal:!0,overlay_close:!0,overlay_opacity:".9",position:"center",reposition_speed:500,show_close_button:!0,source:!1,title:"",type:"information",vcenter_short_message:!0,width:0,onClose:null},p=this,u={},h=function(){var t,e,i,s=m(window).width(),o=m(window).height(),n=p.dialog.width(),a=p.dialog.height(),r={left:0,top:0,right:s-n,bottom:o-a,center:(s-n)/2,middle:(o-a)/2};p.dialog_left=void 0,p.dialog_top=void 0,m.isArray(p.settings.position)&&2===p.settings.position.length&&"string"==typeof p.settings.position[0]&&p.settings.position[0].match(/^(left|right|center)[\s0-9\+\-]*$/)&&"string"==typeof p.settings.position[1]&&p.settings.position[1].match(/^(top|bottom|middle)[\s0-9\+\-]*$/)&&(p.settings.position[0]=p.settings.position[0].toLowerCase(),p.settings.position[1]=p.settings.position[1].toLowerCase(),m.each(r,function(t,e){var i,s;for(i=0;i<2;i++)(s=p.settings.position[i].replace(t,e))!==p.settings.position[i]&&(0===i?p.dialog_left=l(s):p.dialog_top=l(s))})),void 0!==p.dialog_left&&void 0!==p.dialog_top||(p.dialog_left=r.center,p.dialog_top=r.middle),p.dialog_top<0&&(p.dialog_top=0),o<a&&p.body.css("height",o-(m(".ZebraDialog_Title",p.dialog)?m(".ZebraDialog_Title",p.dialog).outerHeight():0)-(m(".ZebraDialog_Buttons",p.dialog)?m(".ZebraDialog_Buttons",p.dialog).outerHeight():0)-(parseFloat(p.body.css("paddingTop"))||0)-(parseFloat(p.body.css("paddingBottom"))||0)-(parseFloat(p.body.css("borderTopWidth"))||0)-(parseFloat(p.body.css("borderBottomWidth"))||0)),p.settings.vcenter_short_message&&(e=(t=p.body.find("div:first")).height())<(i=p.body.height())&&t.css("padding-top",(i-e)/2),"boolean"==typeof arguments[0]&&!1===arguments[0]||0===p.settings.reposition_speed?p.dialog.css({left:p.dialog_left,top:p.dialog_top,visibility:"visible",opacity:0}).animate({opacity:"1"},p.settings.animation_speed_show):(p.dialog.stop(!0),p.dialog.css("visibility","visible").animate({left:p.dialog_left,top:p.dialog_top},p.settings.reposition_speed)),void 0===c&&(!1!==p.settings.auto_focus_button?p.dialog.find("a[class^=ZebraDialog_Button]").eq(!0===p.settings.auto_focus_button?0:p.settings.auto_focus_button).focus():p.body.attr("tabindex",1).focus().removeAttr("tabindex")),p.isIE6&&setTimeout(_,500)},_=function(){var t=m(window).scrollTop(),e=m(window).scrollLeft();p.settings.modal&&p.overlay.css({top:t,left:e}),p.dialog.css({left:p.dialog_left+e,top:p.dialog_top+t})},f=function(){switch(p.settings.type){case"confirmation":case"error":case"information":case"question":case"warning":return p.settings.type.charAt(0).toUpperCase()+p.settings.type.slice(1).toLowerCase();default:return!1}},l=function(t){var e=0;for(t=t.replace(/\s/g,"").match(/[+\-]?([0-9\.\s]+)/g)||[];t.length;)e+=parseFloat(t.shift());return e},b={init:function(){this.name=this.searchString(this.dataBrowser)||"",this.version=this.searchVersion(navigator.userAgent)||this.searchVersion(navigator.appVersion)||""},searchString:function(t){var e,i,s;for(e=0;e<t.length;e++)if(i=t[e].string,s=t[e].prop,this.versionSearchString=t[e].versionSearch||t[e].identity,i){if(-1!==i.indexOf(t[e].subString))return t[e].identity}else if(s)return t[e].identity},searchVersion:function(t){var e=t.indexOf(this.versionSearchString);if(-1!==e)return parseFloat(t.substring(e+this.versionSearchString.length+1))},dataBrowser:[{string:navigator.userAgent,subString:"MSIE",identity:"explorer",versionSearch:"MSIE"}]};return p.settings={},"string"==typeof arguments[0]&&(u.message=arguments[0]),"object"!=typeof arguments[0]&&"object"!=typeof arguments[1]||(u=m.extend(u,"object"==typeof arguments[0]?arguments[0]:arguments[1])),p.init=function(){var t,s,e,i,o,n,a,r,l,g;if(p.settings=m.extend({},d,u),p.isIE6="explorer"===b.name&&6===b.version||!1,p.settings.modal&&(p.overlay=m("<div>",{"class":"ZebraDialogOverlay"}).css({position:p.isIE6?"absolute":"fixed",left:0,top:0,opacity:p.settings.overlay_opacity+""}),p.settings.overlay_close&&p.overlay.on("click",function(){p.close()}),p.overlay.appendTo("body")),p.dialog=m("<div>",{"class":"ZebraDialog"+(p.settings.custom_class?" "+p.settings.custom_class:"")+(!1!==f()?" ZebraDialog_Icon ZebraDialog_"+f():"")}).css({position:p.isIE6?"absolute":"fixed",left:0,top:0,visibility:"hidden"}),!p.settings.buttons&&p.settings.auto_close&&p.dialog.attr("id","ZebraDialog_"+Math.floor(9999999*Math.random())),l=parseInt(p.settings.width,10),!isNaN(l)&&l===p.settings.width&&l.toString()===p.settings.width.toString()&&0<l&&p.dialog.css("width",p.settings.width),p.settings.title?r=m("<h3>",{"class":"ZebraDialog_Title"}).html(p.settings.title).appendTo(p.dialog):p.dialog.addClass("ZebraDialog_NoTitle"),e=function(){if(!0!==p.settings.buttons&&!m.isArray(p.settings.buttons))return!1;if(!0===p.settings.buttons)switch(p.settings.type){case"question":case"warning":p.settings.buttons=["Ok","Cancel"];break;default:p.settings.buttons=["Ok"]}return p.settings.buttons}(),p.body=m("<div>",{"class":"ZebraDialog_Body"}),0<p.settings.max_height&&(p.body.css("max-height",p.settings.max_height),p.isIE6&&p.body.attr("style","height: expression(this.scrollHeight > "+p.settings.max_height+' ? "'+p.settings.max_height+'px" : "85px")')),p.settings.vcenter_short_message?m("<div>").html(p.settings.message).appendTo(p.body):p.body.html(p.settings.message),p.settings.source&&"object"==typeof p.settings.source)for(g in i=p.settings.vcenter_short_message?m("div:first",p.body):p.body,p.settings.source)switch(g){case"ajax":t="string"==typeof p.settings.source[g]?{url:p.settings.source[g]}:p.settings.source[g],a=m("<div>").attr("class","ZebraDialog_Preloader").appendTo(i),t.success=function(t){a.remove(),i.append(t),h(!1)},m.ajax(t);break;case"iframe":o={width:"100%",height:"100%",marginheight:"0",marginwidth:"0",frameborder:"0"},n=m.extend(o,"string"==typeof p.settings.source[g]?{src:p.settings.source[g]}:p.settings.source[g]),i.append(m("<iframe>").attr(n));break;case"inline":i.append(p.settings.source[g])}return p.body.appendTo(p.dialog),e?(e.reverse(),s=m("<div>",{"class":"ZebraDialog_Buttons"}).appendTo(p.dialog),m.each(e,function(t,e){var i=m("<a>",{href:"javascript:void(0)","class":"ZebraDialog_Button_"+t+(void 0!==e.custom_class&&""!==e.custom_class.toString().trim()?" "+e.custom_class:"")});void 0!==e.caption?i.html(e.caption):i.html(e),i.on("click",function(){var t=!0;void 0!==e.callback&&(t=e.callback(p.dialog)),!1!==t&&p.close(void 0!==e.caption?e.caption:e)}),i.appendTo(s)}),p.settings.center_buttons&&s.addClass("ZebraDialog_Buttons_Centered")):p.dialog.addClass("ZebraDialog_NoButtons"),p.dialog.appendTo("body"),p.settings.show_close_button?m('<a href="javascript:void(0)" class="ZebraDialog_Close">×</a>').on("click",function(t){t.preventDefault(),p.close()}).appendTo(r||p.body):p.dialog.addClass("ZebraDialog_NoCloseButton"),m(window).on("resize.Zebra_Dialog",function(){clearTimeout(c),c=setTimeout(function(){h()},100)}),p.settings.keyboard&&m(document).on("keyup.Zebra_Dialog",function(t){return 27===t.which&&p.close(),!0}),p.isIE6&&m(window).on("scroll.Zebra_Dialog",function(){_()}),!1!==p.settings.auto_close&&(p.dialog.on("click",function(){clearTimeout(p.timeout),p.close()}),p.timeout=setTimeout(p.close,p.settings.auto_close)),h(!1),p},p.close=function(t){m(document).off(".Zebra_Dialog"),m(window).off(".Zebra_Dialog"),p.overlay&&p.overlay.animate({opacity:"0"},p.settings.animation_speed_hide,function(){p.overlay.remove()}),p.dialog.animate({top:"0",opacity:"0"},p.settings.animation_speed_hide,function(){p.dialog.remove(),p.settings.onClose&&"function"==typeof p.settings.onClose&&p.settings.onClose(void 0!==t?t:"")})},b.init(),p.init()}}(jQuery); |
@@ -12,3 +12,3 @@ /** | ||
| * | ||
| * - great looks out of the box, with 2 themes included | ||
| * - great looks out of the box, with 3 themes included | ||
| * - 5 types of dialog boxes available: confirmation, information, warning, error and question | ||
@@ -25,3 +25,3 @@ * - content can also be added through AJAX calls, iFrames, or from inline elements (together with attached events) | ||
| * @author Stefan Gabos <contact@stefangabos.ro> | ||
| * @version 1.6.0 (last revision: July 09, 2018) | ||
| * @version 2.0.0 (last revision: August 01, 2018) | ||
| * @copyright (c) 2011 - 2018 Stefan Gabos | ||
@@ -38,3 +38,3 @@ * @license http://www.gnu.org/licenses/lgpl-3.0.txt GNU LESSER GENERAL PUBLIC LICENSE | ||
| // so you can tell the version number even if all you have is the minified source | ||
| this.version = '1.6.0'; | ||
| this.version = '2.0.0'; | ||
@@ -60,2 +60,14 @@ // default options | ||
| auto_focus_button: true, // The index (0-based) of the button (from left to right) to | ||
| // place the focus on when a dialog box is first shown. | ||
| // | ||
| // Set to FALSE to disable. When set to FALSE the focus will | ||
| // be placed on the dialog box's content so that when the | ||
| // users presses TAB, the focus will be set on the first | ||
| // button. | ||
| // | ||
| // Setting this to TRUE is equivalent to setting it to 0. | ||
| // | ||
| // Default is TRUE | ||
| buttons: true, // Use this for localization and for adding custom buttons. | ||
@@ -165,3 +177,3 @@ // | ||
| // "vertical_position" can be "top", "bottom" or "middle", and | ||
| // "offset" represents an optional number of pixels to add/substract | ||
| // "offset" represents an optional number of pixels to add/subtract | ||
| // from the respective horizontal or vertical position. | ||
@@ -421,3 +433,10 @@ // | ||
| // adjust the dialog box's height so that it fits | ||
| plugin.message.css('height', viewport_height - ($('.ZebraDialog_Title', plugin.dialog) ? $('.ZebraDialog_Title', plugin.dialog).outerHeight() : 0) - ($('.ZebraDialog_ButtonsOuter', plugin.dialog) ? $('.ZebraDialog_ButtonsOuter', plugin.dialog).outerHeight() : 0) - (parseFloat(plugin.message.css('paddingTop')) || 0) - (parseFloat(plugin.message.css('paddingBottom')) || 0) - (parseFloat(plugin.message.css('borderTopWidth')) || 0) - (parseFloat(plugin.message.css('borderBottomWidth')) || 0)); | ||
| plugin.body.css('height', viewport_height - | ||
| ($('.ZebraDialog_Title', plugin.dialog) ? $('.ZebraDialog_Title', plugin.dialog).outerHeight() : 0) - | ||
| ($('.ZebraDialog_Buttons', plugin.dialog) ? $('.ZebraDialog_Buttons', plugin.dialog).outerHeight() : 0) - | ||
| (parseFloat(plugin.body.css('paddingTop')) || 0) - | ||
| (parseFloat(plugin.body.css('paddingBottom')) || 0) - | ||
| (parseFloat(plugin.body.css('borderTopWidth')) || 0) - | ||
| (parseFloat(plugin.body.css('borderBottomWidth')) || 0) | ||
| ); | ||
@@ -428,3 +447,3 @@ // if short messages are to be centered vertically | ||
| // the secondary container - the one that contains the message | ||
| message = plugin.message.find('div:first'); | ||
| message = plugin.body.find('div:first'); | ||
@@ -435,3 +454,3 @@ // the height of the secondary container | ||
| // the main container's height | ||
| container_height = plugin.message.height(); | ||
| container_height = plugin.body.height(); | ||
@@ -442,8 +461,4 @@ // if we need to center the message vertically | ||
| // center the message vertically | ||
| message.css({ | ||
| message.css('padding-top', (container_height - message_height) / 2); | ||
| 'padding-top': (container_height - message_height) / 2 | ||
| }); | ||
| } | ||
@@ -480,3 +495,2 @@ | ||
| // move the focus to the first of the dialog box's buttons | ||
| // only do it when we initialize the dialog and not also on resizing because otherwise, if there is an | ||
@@ -486,4 +500,15 @@ // input in the dialog and the input receives focus on mobile, the virtual keyboard will show up and will | ||
| // it impossible to give focus to the input element | ||
| if (undefined === timeout) plugin.dialog.find('a[class^=ZebraDialog_Button]:first').focus(); | ||
| if (undefined === timeout) | ||
| // if we have to set focus to one of the buttons | ||
| if (plugin.settings.auto_focus_button !== false) | ||
| // move the focus to the first of the dialog box's buttons | ||
| plugin.dialog.find('a[class^=ZebraDialog_Button]').eq(plugin.settings.auto_focus_button === true ? 0 : plugin.settings.auto_focus_button).focus(); | ||
| // if we do not want to set focus to one of the buttons | ||
| // do this kind of a trick to set the focus to the content | ||
| // (so that pressing tab gets you to the first button) | ||
| else plugin.body.attr('tabindex', 1).focus().removeAttr('tabindex'); | ||
| // if the browser is Internet Explorer 6, call the "_emulate_fixed_position" method | ||
@@ -687,4 +712,3 @@ // (if we do not apply a short delay, it sometimes does not work as expected) | ||
| var ajax_options, body_container, button_bar, buttons, canvas, $close, default_options, iframe_options, | ||
| preloader, $title, tmp, type; | ||
| var ajax_options, button_bar, buttons, canvas, default_options, iframe_options, preloader, $title, tmp, type; | ||
@@ -709,6 +733,7 @@ // the plugin's final properties are the merged default and user-provided options (if any) | ||
| 'position': (plugin.isIE6 ? 'absolute' : 'fixed'), // for IE6 we emulate the "position:fixed" behaviour | ||
| 'position': (plugin.isIE6 ? 'absolute' : 'fixed'), // for IE6 we emulate the "position:fixed" behavior | ||
| 'left': 0, // the overlay starts at the top-left corner of the | ||
| 'top': 0, // browser window (later on we'll stretch it) | ||
| 'opacity': plugin.settings.overlay_opacity // set the overlay's opacity | ||
| 'opacity': plugin.settings.overlay_opacity + '' // set the overlay's opacity (also we need to specify it | ||
| // as a string) | ||
@@ -732,8 +757,14 @@ }); | ||
| 'class': 'ZebraDialog' + (plugin.settings.custom_class ? ' ' + plugin.settings.custom_class : '') | ||
| 'class': 'ZebraDialog' + | ||
| // any custom classes | ||
| (plugin.settings.custom_class ? ' ' + plugin.settings.custom_class : '') + | ||
| // the type, if required | ||
| (_get_type() !== false ? ' ZebraDialog_Icon ZebraDialog_' + _get_type() : '') | ||
| // set some css properties of the dialog box | ||
| }).css({ | ||
| 'position': (plugin.isIE6 ? 'absolute' : 'fixed'), // for IE6 we emulate the "position:fixed" behaviour | ||
| 'position': (plugin.isIE6 ? 'absolute' : 'fixed'), // for IE6 we emulate the "position:fixed" behavior | ||
| 'left': 0, // by default, place it in the top-left corner of the | ||
@@ -759,3 +790,3 @@ 'top': 0, // browser window (we'll position it later) | ||
| // set the dialog box's width | ||
| plugin.dialog.css({'width': plugin.settings.width}); | ||
| plugin.dialog.css('width', plugin.settings.width); | ||
@@ -774,19 +805,15 @@ // if dialog box has a title | ||
| // if dialog box doesn't have a title | ||
| else plugin.dialog.addClass('ZebraDialog_NoTitle'); | ||
| // get the buttons that are to be added to the dialog box | ||
| buttons = _get_buttons(); | ||
| // we create an outer container to apply borders to | ||
| body_container = $('<div>', { | ||
| 'class': 'ZebraDialog_BodyOuter' + (!plugin.settings.title ? ' ZebraDialog_NoTitle' : '') + (!buttons ? ' ZebraDialog_NoButtons' : '') | ||
| }).appendTo(plugin.dialog); | ||
| // create the container of the actual message | ||
| // we save it as a reference because we'll use it later in the "draw" method | ||
| // if the "vcenter_short_message" property is TRUE | ||
| plugin.message = $('<div>', { | ||
| plugin.body = $('<div>', { | ||
| // if a known dialog box type is specified, also show the appropriate icon | ||
| 'class': 'ZebraDialog_Body' + (_get_type() !== false ? ' ZebraDialog_Icon ZebraDialog_' + _get_type() : '') | ||
| 'class': 'ZebraDialog_Body' | ||
@@ -799,6 +826,6 @@ }); | ||
| // set it like this for browsers supporting the "max-height" attribute | ||
| plugin.message.css('max-height', plugin.settings.max_height); | ||
| plugin.body.css('max-height', plugin.settings.max_height); | ||
| // for IE6, go this way... | ||
| if (plugin.isIE6) plugin.message.attr('style', 'height: expression(this.scrollHeight > ' + plugin.settings.max_height + ' ? "' + plugin.settings.max_height + 'px" : "85px")'); | ||
| if (plugin.isIE6) plugin.body.attr('style', 'height: expression(this.scrollHeight > ' + plugin.settings.max_height + ' ? "' + plugin.settings.max_height + 'px" : "85px")'); | ||
@@ -812,3 +839,3 @@ } | ||
| // (we'll later align the container vertically) | ||
| $('<div>').html(plugin.settings.message).appendTo(plugin.message); | ||
| $('<div>').html(plugin.settings.message).appendTo(plugin.body); | ||
@@ -819,3 +846,3 @@ // if short messages are not to be centered vertically | ||
| // add the message to the message container | ||
| plugin.message.html(plugin.settings.message); | ||
| plugin.body.html(plugin.settings.message); | ||
@@ -826,3 +853,3 @@ // if dialog box content is to be fetched from an external source | ||
| // the object where the content will be injected into | ||
| canvas = (plugin.settings.vcenter_short_message ? $('div:first', plugin.message) : plugin.message); | ||
| canvas = (plugin.settings.vcenter_short_message ? $('div:first', plugin.body) : plugin.body); | ||
@@ -894,3 +921,3 @@ // let's see what type of content we need | ||
| // add the message container to the dialog box | ||
| plugin.message.appendTo(body_container); | ||
| plugin.body.appendTo(plugin.dialog); | ||
@@ -952,7 +979,7 @@ // if there are any buttons to be added to the dialog box | ||
| // wrap everything in another wrapper | ||
| // and center buttons if needed | ||
| button_bar.wrap($('<div>').addClass('ZebraDialog_ButtonsOuter' + (plugin.settings.center_buttons ? ' ZebraDialog_Buttons_Centered' : ''))); | ||
| // center buttons if needed | ||
| if (plugin.settings.center_buttons) button_bar.addClass('ZebraDialog_Buttons_Centered'); | ||
| } | ||
| // if the dialog box has no button | ||
| } else plugin.dialog.addClass('ZebraDialog_NoButtons') | ||
@@ -963,6 +990,6 @@ // insert the dialog box in the DOM | ||
| // if we need to show the little "x" for closing the dialog box, in the top-right corner | ||
| if (plugin.settings.show_close_button) { | ||
| if (plugin.settings.show_close_button) | ||
| // create the button now and append it to the dialog box's title, or to the dialog box's body if there's no title | ||
| $close = $('<a href="javascript:void(0)" class="ZebraDialog_Close">×</a>').on('click', function(e) { | ||
| $('<a href="javascript:void(0)" class="ZebraDialog_Close">×</a>').on('click', function(e) { | ||
@@ -972,15 +999,7 @@ e.preventDefault(); | ||
| }).appendTo($title || plugin.message); | ||
| }).appendTo($title || plugin.body); | ||
| // if the close button was added to the title bar | ||
| if ($title) | ||
| // if the dialog has no "x" button | ||
| else plugin.dialog.addClass('ZebraDialog_NoCloseButton'); | ||
| // center it vertically | ||
| $close.css({ | ||
| 'right': parseInt($title.css('paddingRight'), 10), | ||
| 'top': (parseInt($title.css('height'), 10) + parseInt($title.css('paddingTop'), 10) + parseInt($title.css('paddingBottom'), 10) - $close.height()) / 2 | ||
| }); | ||
| } | ||
| // if the browser window is resized | ||
@@ -987,0 +1006,0 @@ $(window).on('resize.Zebra_Dialog', function() { |
| $(document).ready(function() { | ||
| $('#example1').on('click', function(e) { | ||
| e.preventDefault(); | ||
| new $.Zebra_Dialog('<strong>Zebra_Dialog</strong>, a small, compact and highly configurable dialog box plugin for jQuery'); | ||
| }); | ||
| $('#example2_1').on('click', function(e) { | ||
| e.preventDefault(); | ||
| $('#example1_1').on('click', function() { | ||
| new $.Zebra_Dialog('Use error messages to let the user know that an action has not completed successfully and show the reason why that happened.', { | ||
| type: 'error', | ||
| title: 'Error' | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| title: 'Error', | ||
| type: 'error' | ||
| }); | ||
| }); | ||
| $('#example2_2').on('click', function(e) { | ||
| e.preventDefault(); | ||
| $('#example1_2').on('click', function() { | ||
| new $.Zebra_Dialog('Show warning messages like this when you are about to perform a sensitive operation and you want to make sure that the user understands the implications.', { | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| title: 'Warning', | ||
| type: 'warning', | ||
| title: 'Warning' | ||
| }); | ||
| }); | ||
| $('#example2_3').on('click', function(e) { | ||
| e.preventDefault(); | ||
| $('#example1_3').on('click', function() { | ||
| new $.Zebra_Dialog('Show confirmation dialogs like this when you want the user\'s accept for non-critical actions.', { | ||
| type: 'question', | ||
| title: 'Question' | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| title: 'Question', | ||
| type: 'question' | ||
| }); | ||
| }); | ||
| $('#example2_4').on('click', function(e) { | ||
| e.preventDefault(); | ||
| $('#example1_4').on('click', function() { | ||
| new $.Zebra_Dialog('Use information boxes to show information or help messages that the user requested.', { | ||
| type: 'information', | ||
| title: 'Information' | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| title: 'Information', | ||
| type: 'information' | ||
| }); | ||
| }); | ||
| $('#example2_5').on('click', function(e) { | ||
| e.preventDefault(); | ||
| $('#example1_5').on('click', function() { | ||
| new $.Zebra_Dialog('Use confirmation messages to let the user know that an action has completed successfully.', { | ||
| type: 'confirmation', | ||
| title: 'Confirmation' | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| title: 'Confirmation', | ||
| type: 'confirmation' | ||
| }); | ||
| }); | ||
| $('#example3').on('click', function(e) { | ||
| e.preventDefault(); | ||
| $('#example2').on('click', function() { | ||
| new $.Zebra_Dialog('We can set as many buttons as we want and we handle the user\'s choice though the callback function attached to the <strong>onClose</strong> event.<br><br>See the next example to handle user\'s choice in a different way.', { | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| title: 'Custom buttons', | ||
| type: 'question', | ||
| title: 'Custom buttons', | ||
| buttons: ['Yes', 'No', 'Help'], | ||
@@ -60,7 +55,7 @@ onClose: function(caption) { | ||
| $('#example4').on('click', function(e) { | ||
| e.preventDefault(); | ||
| $('#example3').on('click', function() { | ||
| new $.Zebra_Dialog('We can set as many buttons as we want and we can handle the user\'s choice though the callback functions attached to the buttons.', { | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| title: 'Custom buttons', | ||
| type: 'question', | ||
| title: 'Custom buttons', | ||
| buttons: [ | ||
@@ -74,5 +69,5 @@ {caption: 'Yes', callback: function() { alert('"Yes" was clicked')}}, | ||
| $('#example5_1').on('click', function(e) { | ||
| e.preventDefault(); | ||
| $('#example4_1').on('click', function() { | ||
| new $.Zebra_Dialog('I am positioned in the <strong>top-left</strong> corner, 20 pixels from the edges. Here\'s how it\'s done:<br><code>position: [\'left + 20\', \'top + 20\']</code>', { | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| title: 'Custom positioning', | ||
@@ -84,5 +79,5 @@ width: 460, | ||
| $('#example5_2').on('click', function(e) { | ||
| e.preventDefault(); | ||
| $('#example4_2').on('click', function() { | ||
| new $.Zebra_Dialog('I am positioned in the <strong>top-right</strong> corner, 20 pixels from the edges. Here\'s how it\'s done:<br><code>position: [\'right - 20\', \'top + 20\']</code>', { | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| title: 'Custom positioning', | ||
@@ -94,5 +89,5 @@ width: 460, | ||
| $('#example5_3').on('click', function(e) { | ||
| e.preventDefault(); | ||
| $('#example4_3').on('click', function() { | ||
| new $.Zebra_Dialog('I am positioned in the <strong>bottom-right</strong> corner, 20 pixels from the edges. Here\'s how it\'s done:<br><code>position: [\'right - 20\', \'bottom - 20\']</code>', { | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| title: 'Custom positioning', | ||
@@ -104,5 +99,5 @@ width: 460, | ||
| $('#example5_4').on('click', function(e) { | ||
| e.preventDefault(); | ||
| $('#example4_4').on('click', function() { | ||
| new $.Zebra_Dialog('I am positioned in the <strong>bottom-left</strong> corner, 20 pixels from the edges. Here\'s how it\'s done:<br><code>position: [\'left + 20\', \'bottom - 20\']</code>', { | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| title: 'Custom positioning', | ||
@@ -114,5 +109,5 @@ width: 460, | ||
| $('#example5_5').on('click', function(e) { | ||
| e.preventDefault(); | ||
| $('#example4_5').on('click', function() { | ||
| new $.Zebra_Dialog('I am positioned in the <strong>center</strong> of the screen. Here\'s how it\'s done:<br><code>position: [\'center\', \'center\']</code>', { | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| title: 'Custom positioning', | ||
@@ -124,5 +119,5 @@ width: 460, | ||
| $('#example5_6').on('click', function(e) { | ||
| e.preventDefault(); | ||
| $('#example4_6').on('click', function() { | ||
| new $.Zebra_Dialog('I am centered horizontally and 50 pixels from the top edge. Here\'s how it\'s done:<br><code>position: [\'center\', \'top + 50\']</code>', { | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| title: 'Custom positioning', | ||
@@ -134,5 +129,11 @@ width: 460, | ||
| $('#example6').on('click', function(e) { | ||
| e.preventDefault(); | ||
| $('#example5').on('click', function() { | ||
| new $.Zebra_Dialog('<strong>Zebra_Dialog</strong>, a small, compact and highly configurable dialog box plugin for jQuery', { | ||
| auto_focus_button: $('body.materialize').length ? false : true | ||
| }); | ||
| }); | ||
| $('#example6').on('click', function() { | ||
| new $.Zebra_Dialog('I am a notification widget. No buttons, no overlay, I am positioned in the top-right corner and I stay on screen for 2 seconds.', { | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| buttons: false, | ||
@@ -145,5 +146,5 @@ modal: false, | ||
| $('#example7').on('click', function(e) { | ||
| e.preventDefault(); | ||
| $('#example7').on('click', function() { | ||
| new $.Zebra_Dialog({ | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| source: { | ||
@@ -157,5 +158,5 @@ inline: $('#boxcontent').html() | ||
| $('#example8').on('click', function(e) { | ||
| e.preventDefault(); | ||
| $('#example8').on('click', function() { | ||
| new $.Zebra_Dialog({ | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| source: { | ||
@@ -169,8 +170,8 @@ ajax: 'ajax.html' | ||
| $('#example9').on('click', function(e) { | ||
| e.preventDefault(); | ||
| $('#example9').on('click', function() { | ||
| new $.Zebra_Dialog({ | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| source: { | ||
| iframe: { | ||
| src: 'http://en.m.wikipedia.org/wiki/Dialog_box', | ||
| src: 'https://en.m.wikipedia.org/wiki/Dialog_box', | ||
| height: 500 | ||
@@ -184,10 +185,15 @@ } | ||
| $('#example10').on('click', function(e) { | ||
| e.preventDefault(); | ||
| new $.Zebra_Dialog('Buy me a coffee if you like this plugin!', { | ||
| $('#example10').on('click', function() { | ||
| new $.Zebra_Dialog('I love coffee!', { | ||
| auto_focus_button: $('body.materialize').length ? false : true, | ||
| custom_class: 'myclass', | ||
| title: 'Customizing the appearance' | ||
| title: 'Customizing the appearance', | ||
| width: 300 | ||
| }); | ||
| }); | ||
| setTimeout(function() { | ||
| $.Zebra_Pin($('blockquote.bg-warning')); | ||
| }, 500); | ||
| }); |
@@ -15,3 +15,3 @@ { | ||
| "license": "LGPL-3.0", | ||
| "version": "1.6.0", | ||
| "version": "2.0.0", | ||
| "keywords": [ | ||
@@ -35,4 +35,5 @@ "jquery-plugin", | ||
| "grunt-contrib-copy": "*", | ||
| "grunt-contrib-cssmin": "^2.2.1", | ||
| "grunt-contrib-jshint": "*", | ||
| "grunt-contrib-uglify": "*", | ||
| "grunt-contrib-uglify": "^3.4.0", | ||
| "grunt-contrib-watch": "*", | ||
@@ -43,4 +44,5 @@ "grunt-eslint": "*", | ||
| "grunt-sass": "*", | ||
| "node-sass": "^4.9.2", | ||
| "time-grunt": "*" | ||
| } | ||
| } |
@@ -15,9 +15,9 @@ <img src="https://raw.githubusercontent.com/stefangabos/zebrajs/master/docs/images/logo.png" alt="zebrajs" align="right"> | ||
| [](https://stefangabos.github.io/Zebra_Dialog/flat.html) | ||
| [](https://stefangabos.github.io/Zebra_Dialog/materialize.html) | ||
| [](https://stefangabos.github.io/Zebra_Dialog/index.html) | ||
| | ||
| [](https://stefangabos.github.io/Zebra_Dialog/flat.html) | ||
| ## Features | ||
| - great looking dialog boxes, out of the box, with 2 themes included | ||
| - great looking dialog boxes, out of the box, with 3 beautiful themes included | ||
| - 5 types of dialog boxes available: *confirmation*, *information*, *warning*, *error* and *question* | ||
@@ -33,6 +33,8 @@ - content can also be added through AJAX calls, iFrames or from inline elements (together with attached events) | ||
| For the default theme the icons used for *confirmation*, *information*, *error* and *question* dialog boxes are made by [DryIcon](http://dryicons.com/free-icons/preview/aesthetica/) while the *warning* icon is made by [Function Design & Development Studio](http://wefunction.com/2008/07/function-free-icon-set/). | ||
| For the [classic theme](https://stefangabos.github.io/Zebra_Dialog/index.html), the icons used for *confirmation*, *information*, *error* and *question* dialog boxes are made by [DryIcon](http://dryicons.com/free-icons/preview/aesthetica/) while the *warning* icon is made by [Function Design & Development Studio](http://wefunction.com/2008/07/function-free-icon-set/). | ||
| For the *flat* theme, the icons used are made by [Elegant Themes](http://www.elegantthemes.com/blog/freebie-of-the-week/beautiful-flat-icons-for-free) | ||
| For the [flat theme](https://stefangabos.github.io/Zebra_Dialog/flat.html), the icons used are made by [Elegant Themes](http://www.elegantthemes.com/blog/freebie-of-the-week/beautiful-flat-icons-for-free) | ||
| For the [materialize theme](https://stefangabos.github.io/Zebra_Dialog/flat.html) theme, the icons used are taken from [Google's Material Design](https://material.io/tools/icons/?style=baseline) *"design language"*. | ||
| ## Demo | ||
@@ -156,8 +158,20 @@ | ||
| <td valign="top"><em>mixed</em></td> | ||
| <td valign="top">FALSE</td> | ||
| <td valign="top">false</td> | ||
| <td valign="top"> | ||
| The number of milliseconds after which to automatically close the dialog box or <code>FALSE</code> to not automatically close the dialog box. | ||
| The number of milliseconds after which to automatically close the dialog box or <code>false</code> to not automatically close the dialog box. | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td valign="top"><code>auto_focus_button</code></td> | ||
| <td valign="top"><em>mixed</em></td> | ||
| <td valign="top">true</td> | ||
| <td valign="top"> | ||
| The index (0-based) of the button (from left to right) to place the focus on when a dialog box is first shown.<br><br> | ||
| Set to <code>false</code> to disable.<br><br> | ||
| <blockquote>When set to <code>false</code> the focus will be placed on the dialog box's content so that when the users presses <code>TAB</code>, the focus will be set on the first button.</blockquote> | ||
| Setting this to <code>true</code> is equivalent to setting it to <code>0</code>.<br><br> | ||
| Default is TRUE | ||
| </td> | ||
| </tr> | ||
| <tr> | ||
| <td valign="top"><code>buttons</code></td> | ||
@@ -168,5 +182,5 @@ <td valign="top"><em>mixed</em></td> | ||
| Use this for localization and for adding custom buttons.<br><br> | ||
| If set to <code>TRUE</code>, the default buttons will be used, depending on the type of the dialog box: <code>['Ok', 'Cancel']</code> for <em>warning</em> and <em>question</em> and types, and <code>['Ok']</code> for the other types of dialog boxes.<br><br> | ||
| If set to <code>true</code>, the default buttons will be used, depending on the type of the dialog box: <code>['Ok', 'Cancel']</code> for <em>warning</em> and <em>question</em> and types, and <code>['Ok']</code> for the other types of dialog boxes.<br><br> | ||
| For custom buttons, use an array containing the captions of the buttons to display: <code>['My button 1', 'My button 2']</code>.<br><br> | ||
| Set to <code>FALSE</code> if you want no buttons.<br><br> | ||
| Set to <code>false</code> if you want no buttons.<br><br> | ||
| You can also add custom CSS classes and/or attach callback functions to individual buttons by providing an array of objects like:<br><br> | ||
@@ -189,5 +203,5 @@ <code>[{</code><br> | ||
| <td valign="top"><em>boolean</em></td> | ||
| <td valign="top">FALSE</td> | ||
| <td valign="top">false</td> | ||
| <td valign="top"> | ||
| Setting this property to <code>TRUE</code> will instruct the plugin to center any available buttons instead of floating them to the right | ||
| Setting this property to <code>true</code> will instruct the plugin to center any available buttons instead of floating them to the right | ||
| </td> | ||
@@ -198,3 +212,3 @@ </tr> | ||
| <td valign="top"><em>mixed</em></td> | ||
| <td valign="top">FALSE</td> | ||
| <td valign="top">false</td> | ||
| <td valign="top"> | ||
@@ -211,5 +225,5 @@ An extra class to add to the dialog box's container, useful for further customizing dialog boxes<br><br> | ||
| <td valign="top"><em>boolean</em></td> | ||
| <td valign="top">TRUE</td> | ||
| <td valign="top">true</td> | ||
| <td valign="top"> | ||
| When set to <code>TRUE</code>, pressing the <code>ESC</code> key will close the dialog box. | ||
| When set to <code>true</code>, pressing the <code>ESC</code> key will close the dialog box. | ||
| </td> | ||
@@ -237,5 +251,5 @@ </tr> | ||
| <td valign="top"><em>boolean</em></td> | ||
| <td valign="top">TRUE</td> | ||
| <td valign="top">true</td> | ||
| <td valign="top"> | ||
| When set to <code>TRUE</code> there will be a semitransparent overlay behind the dialog box, preventing users from clicking the page's content. | ||
| When set to <code>true</code> there will be a semitransparent overlay behind the dialog box, preventing users from clicking the page's content. | ||
| </td> | ||
@@ -246,3 +260,3 @@ </tr> | ||
| <td valign="top"><em>boolean</em></td> | ||
| <td valign="top">TRUE</td> | ||
| <td valign="top">true</td> | ||
| <td valign="top"> | ||
@@ -299,5 +313,5 @@ Should the dialog box close when the overlay is clicked? | ||
| <td valign="top"><em>boolean</em></td> | ||
| <td valign="top">TRUE</td> | ||
| <td valign="top">true</td> | ||
| <td valign="top"> | ||
| When set to <code>TRUE</code>, a <em>close</em> button (the little "x") will be shown in the upper right corner of the dialog box.<br><br> | ||
| When set to <code>true</code>, a <em>close</em> button (the little "x") will be shown in the upper right corner of the dialog box.<br><br> | ||
| If the dialog box has a title bar then the <em>close</em> button will be shown in the title bar, vertically centered and respecting the right padding.<br><br> | ||
@@ -310,3 +324,3 @@ If the dialog box does not have a title bar then the <em>close</em> button will be shown in the upper right corner of the body of the dialog box, respecting the position related properties set in the stylesheet. | ||
| <td valign="top"><em>mixed</em></td> | ||
| <td valign="top">FALSE</td> | ||
| <td valign="top">false</td> | ||
| <td valign="top"> | ||
@@ -369,3 +383,3 @@ Add content via AJAX, iFrames or from inline elements (together with the already applied events).<br><br> | ||
| </ul> | ||
| If you don't want an icon, set the <code>type</code> property to <code>FALSE</code>.<br><br> | ||
| If you don't want an icon, set the <code>type</code> property to <code>false</code>.<br><br> | ||
| By default, the <code>warning</code> and <code>question</code> types have two buttons with the captions <em>Ok</em> and <em>Cancel</em> respectively, while the other types have a single button with the caption <em>Ok</em>. | ||
@@ -377,3 +391,3 @@ </td> | ||
| <td valign="top"><em>boolean</em></td> | ||
| <td valign="top">TRUE</td> | ||
| <td valign="top"f/td> | ||
| <td valign="top"> | ||
@@ -411,3 +425,3 @@ Should short messages be vertically centered? | ||
| For executing functions <em>before</em> the closing of the dialog box, see the <strong>buttons</strong> option.<br> | ||
| The callback function takes as argument the caption of the clicked button, or <code>FALSE</code> if the dialog box was closed by pressing the ESC key or by clicking on the overlay. | ||
| The callback function takes as argument the caption of the clicked button, or <code>false</code> if the dialog box was closed by pressing the ESC key or by clicking on the overlay. | ||
| </td> | ||
@@ -414,0 +428,0 @@ </tr> |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by66.35%
386604
- Number of package files
- increased by37.5%
44
- Lines of code
- increased by30.55%
1859
- Number of lines in readme file
- increased by3.29%
439
Worsened metrics
- Dev dependency count
- increased by18.18%
13
No dependency changes