1// jQuery Alert Dialogs Plugin 2// 3// Version 1.1 4// 5// Cory S.N. LaViska 6// A Beautiful Site (http://abeautifulsite.net/) 7// 14 May 2009 8// 9// Visit http://abeautifulsite.net/notebook/87 for more information 10// 11// Usage: 12// jAlert( message, [title, callback] ) 13// jConfirm( message, [title, callback] ) 14// jPrompt( message, [value, title, callback] ) 15// 16// History: 17// 18// 1.00 - Released (29 December 2008) 19// 20// 1.01 - Fixed bug where unbinding would destroy all resize events 21// 22// License: 23// 24// This plugin is dual-licensed under the GNU General Public License and the MIT License and 25// is copyright 2008 A Beautiful Site, LLC. 26// 27(function($) { 28 29 $.alerts = { 30 31 // These properties can be read/written by accessing $.alerts.propertyName from your scripts at any time 32 33 verticalOffset: -75, // vertical offset of the dialog from center screen, in pixels 34 horizontalOffset: 0, // horizontal offset of the dialog from center screen, in pixels/ 35 repositionOnResize: true, // re-centers the dialog on window resize 36 overlayOpacity: .01, // transparency level of overlay 37 overlayColor: '#FFF', // base color of overlay 38 draggable: true, // make the dialogs draggable (requires UI Draggables plugin) 39 okButton: ' Yes ', // text for the OK button 40 cancelButton: ' No ', // text for the Cancel button 41 dialogClass: null, // if specified, this class will be applied to all dialogs 42 43 // Public methods 44 45 alert: function(message, title, callback) { 46 if( title == null ) title = 'Alert'; 47 $.alerts._show(title, message, null, 'alert', function(result) { 48 if( callback ) callback(result); 49 }); 50 }, 51 52 confirm: function(message, title, callback) { 53 if( title == null ) title = 'Confirm'; 54 $.alerts._show(title, message, null, 'confirm', function(result) { 55 if( callback ) callback(result); 56 }); 57 }, 58 59 prompt: function(message, value, title, callback) { 60 if( title == null ) title = 'Prompt'; 61 $.alerts._show(title, message, value, 'prompt', function(result) { 62 if( callback ) callback(result); 63 }); 64 }, 65 66 // Private methods 67 68 _show: function(title, msg, value, type, callback) { 69 70 $.alerts._hide(); 71 $.alerts._overlay('show'); 72 73 $("BODY").append( 74 '<div id="popup_container">' + 75 '<h1 id="popup_title"></h1>' + 76 '<div id="popup_content">' + 77 '<div id="popup_message"></div>' + 78 '</div>' + 79 '</div>'); 80 81 if( $.alerts.dialogClass ) $("#popup_container").addClass($.alerts.dialogClass); 82 83 // IE6 Fix 84 var pos = ($.browser.msie && parseInt($.browser.version) <= 6 ) ? 'absolute' : 'fixed'; 85 86 $("#popup_container").css({ 87 position: pos, 88 zIndex: 99999, 89 padding: 0, 90 margin: 0 91 }); 92 93 $("#popup_title").text(title); 94 $("#popup_content").addClass(type); 95 $("#popup_message").text(msg); 96 $("#popup_message").html( $("#popup_message").text().replace(/\n/g, '<br />') ); 97 98 $("#popup_container").css({ 99 minWidth: $("#popup_container").outerWidth(), 100 maxWidth: $("#popup_container").outerWidth() 101 }); 102 103 $.alerts._reposition(); 104 $.alerts._maintainPosition(true); 105 106 switch( type ) { 107 case 'alert': 108 $("#popup_message").after('<div id="popup_panel"><input type="button" value="' + $.alerts.okButton + '" id="popup_ok" /></div>'); 109 $("#popup_ok").click( function() { 110 $.alerts._hide(); 111 callback(true); 112 }); 113 $("#popup_ok").focus().keypress( function(e) { 114 if( e.keyCode == 13 || e.keyCode == 27 ) $("#popup_ok").trigger('click'); 115 }); 116 break; 117 case 'confirm': 118 $("#popup_message").after('<div id="popup_panel"><input type="button" value="' + $.alerts.okButton + '" id="popup_ok" /> <input type="button" value="' + $.alerts.cancelButton + '" id="popup_cancel" /></div>'); 119 $("#popup_ok").click( function() { 120 $.alerts._hide(); 121 if( callback ) callback(true); 122 }); 123 $("#popup_cancel").click( function() { 124 $.alerts._hide(); 125 if( callback ) callback(false); 126 }); 127 $("#popup_ok").focus(); 128 $("#popup_ok, #popup_cancel").keypress( function(e) { 129 if( e.keyCode == 13 ) $("#popup_ok").trigger('click'); 130 if( e.keyCode == 27 ) $("#popup_cancel").trigger('click'); 131 }); 132 break; 133 case 'prompt': 134 $("#popup_message").append('<br /><input type="text" size="30" id="popup_prompt" />').after('<div id="popup_panel"><input type="button" value="' + $.alerts.okButton + '" id="popup_ok" /> <input type="button" value="' + $.alerts.cancelButton + '" id="popup_cancel" /></div>'); 135 $("#popup_prompt").width( $("#popup_message").width() ); 136 $("#popup_ok").click( function() { 137 var val = $("#popup_prompt").val(); 138 $.alerts._hide(); 139 if( callback ) callback( val ); 140 }); 141 $("#popup_cancel").click( function() { 142 $.alerts._hide(); 143 if( callback ) callback( null ); 144 }); 145 $("#popup_prompt, #popup_ok, #popup_cancel").keypress( function(e) { 146 if( e.keyCode == 13 ) $("#popup_ok").trigger('click'); 147 if( e.keyCode == 27 ) $("#popup_cancel").trigger('click'); 148 }); 149 if( value ) $("#popup_prompt").val(value); 150 $("#popup_prompt").focus().select(); 151 break; 152 } 153 154 // Make draggable 155 if( $.alerts.draggable ) { 156 try { 157 $("#popup_container").draggable({ handle: $("#popup_title") }); 158 $("#popup_title").css({ cursor: 'move' }); 159 } catch(e) { /* requires jQuery UI draggables */ } 160 } 161 }, 162 163 _hide: function() { 164 $("#popup_container").remove(); 165 $.alerts._overlay('hide'); 166 $.alerts._maintainPosition(false); 167 }, 168 169 _overlay: function(status) { 170 switch( status ) { 171 case 'show': 172 $.alerts._overlay('hide'); 173 $("BODY").append('<div id="popup_overlay"></div>'); 174 $("#popup_overlay").css({ 175 position: 'absolute', 176 zIndex: 99998, 177 top: '0px', 178 left: '0px', 179 width: '100%', 180 height: $(document).height(), 181 background: $.alerts.overlayColor, 182 opacity: $.alerts.overlayOpacity 183 }); 184 break; 185 case 'hide': 186 $("#popup_overlay").remove(); 187 break; 188 } 189 }, 190 191 _reposition: function() { 192 var top = (($(window).height() / 2) - ($("#popup_container").outerHeight() / 2)) + $.alerts.verticalOffset; 193 var left = (($(window).width() / 2) - ($("#popup_container").outerWidth() / 2)) + $.alerts.horizontalOffset; 194 if( top < 0 ) top = 0; 195 if( left < 0 ) left = 0; 196 197 // IE6 fix 198 if( $.browser.msie && parseInt($.browser.version) <= 6 ) top = top + $(window).scrollTop(); 199 top=top+30; 200 $("#popup_container").css({ 201 top: top + 'px', 202 left: left + 'px' 203 }); 204 $("#popup_overlay").height( $(document).height() ); 205 }, 206 207 _maintainPosition: function(status) { 208 if( $.alerts.repositionOnResize ) { 209 switch(status) { 210 case true: 211 $(window).bind('resize', $.alerts._reposition); 212 break; 213 case false: 214 $(window).unbind('resize', $.alerts._reposition); 215 break; 216 } 217 } 218 } 219 220 } 221 222 // Shortuct functions 223 jAlert = function(message, title, callback) { 224 $.alerts.alert(message, title, callback); 225 } 226 227 jConfirm = function(message, title, callback) { 228 $.alerts.confirm(message, title, callback); 229 }; 230 231 jPrompt = function(message, value, title, callback) { 232 $.alerts.prompt(message, value, title, callback); 233 }; 234 235})(jQuery); 236