1/** 2* version 1.1.0 3* upgrades 4* - fade animation on open and close 5* - open method. can open modal without binding link 6* - possible to open modal with "POST". nessecary when need to send large amount of data to modal 7*/ 8 9(function ($) { 10 11 $.modalLinkDefaults = { 12 height: 600, 13 width: 900, 14 showTitle: true, 15 showClose: true, 16 overlayOpacity: 0.6, 17 method: "GET", // GET, POST, REF, CLONE 18 disableScroll: true, 19 onHideScroll: function () { }, 20 onShowScroll: function () { } 21 }; 22 23 function hideBodyScroll(cb) { 24 var w = $("body").outerWidth(); 25 $("body").css({ overflow: "hidden" }); 26 var w2 = $("body").outerWidth(); 27 $("body").css({ width: w }); 28 29 if (typeof cb == "function") { 30 var scrollbarWidth = w2 - w; 31 cb(scrollbarWidth); 32 } 33 } 34 35 function showBodyScroll(cb) { 36 var $body = $("body"); 37 var w = $body.outerWidth(); 38 $body.css({ width: '', overflow: '' }); 39 var w2 = $body.outerWidth(); 40 41 if (typeof cb == "function") { 42 var scrollbarWidth = w - w2; 43 cb(scrollbarWidth); 44 } 45 } 46 47 /** 48 * Helper method for appending parameter to url 49 */ 50 function addUrlParam(url, name, value) { 51 return appendUrl(url, name + "=" + value); 52 } 53 54 /** 55 * Hepler method for appending querystring to url 56 */ 57 function appendUrl(url, data) { 58 return url + (url.indexOf("?") < 0 ? "?" : "&") + data; 59 } 60 61 function buildOptions(option) { 62 63 } 64 65 function resolveBooleanValue($link) { 66 67 for (var i = 1; i < arguments.length; i++) { 68 var val = arguments[i]; 69 70 if (typeof val == "boolean") { 71 return val; 72 } 73 74 if (typeof val == "string") { 75 var attrValue = $link.attr(val); 76 if (attrValue) { 77 if (attrValue.toLowerCase() === "true") { 78 return true; 79 } 80 if (attrValue.toLowerCase() === "false") { 81 return false; 82 } 83 } 84 } 85 } 86 } 87 88 var methods = { 89 init: function (options) { 90 91 var settings = $.extend({}, $.modalLinkDefaults); 92 $.extend(settings, options); 93 94 return this.each(function () { 95 var $link = $(this); 96 97 // already bound 98 if ($link.hasClass("sparkling-modal-link")) 99 return; 100 101 // mark as bound 102 $link.addClass("sparkling-modal-link"); 103 104 $link.click(function (e) { 105 e.preventDefault(); 106 methods.open($link, settings); 107 return false; 108 }); 109 }); 110 }, 111 112 close: function (cb) { 113 114 var $container = $(".sparkling-modal-container"); 115 116 var $link = $container.data("modallink"); 117 118 if (!$link) { 119 return; 120 } 121 122 $link.trigger("modallink.close"); 123
124 var $overlay = $container.find(".sparkling-modal-overlay"); 125 var $content = $container.find(".sparkling-modal-frame"); 126 127 $overlay.fadeTo("fast", 0); 128 $content.fadeTo("fast", 0, function () { 129 $container.remove(); 130 showBodyScroll(cb); 131 132 if (typeof cb == "function") { 133 cb(); 134 } 135 }); 136 }, 137 138 open: function ($link, options) { 139 140 this.close(); 141 142 options = options || {}; 143 var url, title, showTitle, showClose, disableScroll; 144 145 url = options.url || $link.attr("href"); 146 title = options.title 147 || $link.attr("data-ml-title") 148 || $link.attr("title") 149 || $link.text(); 150 151 showTitle = resolveBooleanValue($link, 152 options.showTitle, 153 "data-ml-show-title", 154 $.modalLinkDefaults.showTitle); 155 156 showClose = resolveBooleanValue($link, 157 options.showClose, 158 "data-ml-show-close", 159 $.modalLinkDefaults.showClose); 160 161 disableScroll = resolveBooleanValue($link, 162 options.disableScroll, 163 "data-ml-disable-scroll", 164 $.modalLinkDefaults.disableScroll); 165 166 var settings = $.extend({}, $.modalLinkDefaults); 167 $.extend(settings, options); 168 169 var dataWidth = $link.attr("data-ml-width"); 170 if (dataWidth) { 171 settings.width = parseInt(dataWidth); 172 } 173 var dataHeight = $link.attr("data-ml-height"); 174 if (dataHeight) { 175 settings.height = parseInt(dataHeight); 176 } 177 178 if (settings.method !== "CLONE" && url.length > 0 && url[0] === "#") { 179 settings.method = "REF"; 180 } 181 182 if (settings.method == "GET" || settings.method == "POST") { 183 url = addUrlParam(url, "__inmodal", "true"); 184 } 185 186 var data = {}; 187 188 if (typeof settings.data != 'undefined') { 189 if (typeof settings.data == "function") { 190 data = settings.data(); 191 } 192 else { 193 data = settings.data; 194 } 195 } 196 197 var $container = $("<div class=\"sparkling-modal-container\"></div>"); 198 $container.data("modallink", $link); 199
200 var $overlay = $("<div class=\"sparkling-modal-overlay\"></div>"); 201 $overlay.css({ position: 'fixed', top: 0, left: 0, opacity: 0, width: '100%', height: '100%', zIndex: 999 }); 202 $overlay.appendTo($container); 203 204 var $content = $("<div id=\"modalIframe\" class=\"sparkling-modal-frame\"></div>") 205 .css("opacity", 0) 206 .css({ zIndex: 1000, position: 'fixed', display: 'inline-block' }) 207 .css({ left: '50%', marginLeft: -settings.width / 2 }) 208 .css({ top: '50%', marginTop: -settings.height / 2 }) 209 .appendTo($container); 210 211 $("body").append($container); 212 213 if (showTitle) { 214 215 var $title = $("<div class=\"sparkling-modal-title\"></div>"); 216 $title.appendTo($content); 217 $title.append($("<span></span>").html(title)); 218 219 if (showClose) { 220 var $closeButton = $("<div class=\"sparkling-modal-close\"><div class='i-close'><div class='i-close-h' /><div class='i-close-v' /></div></div>"); 221 $closeButton.appendTo($title); 222 $closeButton.click(methods.close); 223 } 224 225 $title.append("<div style=\"clear: both;\"></div>"); 226 } 227 var $iframeContainer = $("<div class=\"sparkling-modal-content\"></div>"); 228 $iframeContainer.appendTo($content); 229 230 var $iframe; 231 if (settings.method == "REF") { 232 $iframe = $("<div />"); 233 $iframe.css("overflow", "auto"); 234 235 var $ref = $(url); 236 var id = "ref_" + new Date().getTime(); 237 var $ph = $("<div id='" + id + "' />"); 238 $ph.insertAfter($ref); 239 240 $ref.appendTo($iframe); 241 242 $link.on("modallink.close", function() { 243 $ph.replaceWith($ref); 244 }); 245 246 } else { 247 $iframe = $("<iframe frameborder=0 id='modal-frame' name='modal-frame'></iframe>"); 248 } 249 250 $iframe.appendTo($iframeContainer); 251 $iframe.css({ width: settings.width, height: settings.height }); 252 253 if (settings.method == "CLONE") { 254 console.log(url); 255 var $inlineContent = $(url); 256 console.log($inlineContent); 257 258 var iFrameDoc = $iframe[0].contentDocument || $iframe[0].contentWindow.document; 259 iFrameDoc.write($inlineContent.html()); 260 iFrameDoc.close(); 261 } 262 else if (settings.method == "GET") { 263 if (typeof data == "object") { 264 for (var i in data) { 265 if (data.hasOwnProperty(i)) { 266 url = addUrlParam(url, i, data[i]); 267 } 268 } 269 } else if (typeof data != "undefined") { 270 url = appendUrl(url, data); 271 } 272 273 $iframe.attr("src", url); 274 } 275 276 $content.css({ marginTop: -($content.outerHeight(false) / 2) }); 277 278 $overlay.fadeTo("fast", settings.overlayOpacity); 279 $content.fadeTo("fast", 1); 280 281 if (settings.method == "POST") { 282 283 var $form = settings.$form; 284 if ($form && $form instanceof jQuery) 285 { 286 var originalTarget = $form.attr("target"); 287 $form 288 .attr("target", "modal-frame") 289 .data("submitted-from-modallink", true) 290 .submit() 291 } 292 else 293 { 294 $form = $("<form />") 295 .attr("action", url) 296 .attr("method", "POST") 297 .attr("target", "modal-frame") 298 .css({ display: 'none'}); 299 300 $("<input />").attr({ type: "hidden", name: "__sparklingModalInit", value: 1 }).appendTo($form); 301 302 if ($.isArray(data)) { 303 for (var i in data) { 304 $("<input />").attr({ type: "hidden", name: data[i].name, value: data[i].value }).appendTo($form); 305 } 306 } 307 else 308 { 309 for (var i in data) { 310 $("<input />").attr({ type: "hidden", name: i, value: data[i] }).appendTo($form); 311 } 312 } 313 314 $form 315 .appendTo("body") 316 .submit(); 317 318 $form.remove(); 319 } 320 } 321 322 if (disableScroll) { 323 hideBodyScroll(settings.onHideScroll); 324 } 325 326 $link.trigger("modallink.open"); 327 } 328 }; 329 330 $.fn.modalLink = function(method) { 331 // Method calling logic 332 if (methods[method]) { 333 return methods[method].apply(this, Array.prototype.slice.call(arguments, 1)); 334 } else if (typeof method === 'object' || !method) { 335 return methods.init.apply(this, arguments); 336 } else { 337 $.error('Method ' + method + ' does not exist on jQuery.modalLink'); 338 return this; 339 } 340 }; 341 342 $.modalLink = function(method) { 343 // Method calling logic 344 if (methods[method]) { 345 return methods[method].apply(this, Array.prototype.slice.call(arguments, 1)); 346 } else if (typeof method === 'object' || !method) { 347 return methods.init.apply(this, arguments); 348 } else { 349 $.error('Method ' + method + ' does not exist on jQuery.modalLink'); 350 return this; 351 } 352 }; 353 354 $.modalLink.open = function(url, options) { 355 options = $.extend({}, options); 356 options.url = url; 357 methods["open"].call(this, $("<a />"), options); 358 }; 359 360})(jQuery); 361 362 363$(document).keyup(function(e) { 364 365 if (e.keyCode == 27) { 366 $.modalLink("close"); 367 } 368});
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.