1/*! 2 * jQuery DialogExtend 1.0 3 * 4 * Copyright (c) 2010 Shum Ting Hin 5 * 6 * Licensed under MIT 7 * http:// www.opensource.org/licenses/mit-license.php 8 * 9 * Project Home: 10 * http:// code.google.com/p/jquery-dialogextend/ 11 * 12 * Depends: 13 * jQuery 1.7.2 14 * jQuery UI Dialog 1.8.22 15 * 16 */ 17(function ($) { 18 19 // default settings 20 var defaults = { 21 "close": true, 22 "maximize": false, 23 "minimize": false, 24 "help": false, 25 "helpUrl": "", 26 "dblclick": false, 27 "titlebar": false, 28 "icons": { 29 "close": "ui-icon-closethick", 30 "maximize": "ui-icon-extlink", 31 "minimize": "ui-icon-minus", 32 "help": "ui-icon-help", 33 "restore": "ui-icon-newwin" 34 }, 35 "events": { 36 "load": null, 37 "beforeCollapse": null, 38 "beforeMaximize": function (evt, dlg) { 39 // megtalalja az osszes gridet a modal-on, es mindegyik contextmenujet eltunteti 40 $("div[SDAModal='true']").find($('div[type="ajaxgrid"]')).each(function (grid) { 41 var gridInstance = window[this.attributes['instanceid'].value]; 42 var caller = $('#' + gridInstance.GetClientID('gridmaindiv') + ' .context_selectedrow').find('.contextcell')[0]; 43 if (caller != undefined) 44 gridInstance.HideContextMenu(caller); 45 }); 46 }, 47 "beforeMinimize": null, 48 "beforeRestore": function (evt, dlg) { 49 // megtalalja az osszes gridet a modal-on, es mindegyik contextmenujet eltunteti 50 $("div[SDAModal='true']").find($('div[type="ajaxgrid"]')).each(function (grid) { 51 var gridInstance = window[this.attributes['instanceid'].value]; 52 var caller = $('#' + gridInstance.GetClientID('gridmaindiv') + ' .context_selectedrow').find('.contextcell')[0]; 53 if (caller != undefined) 54 gridInstance.HideContextMenu(caller); 55 }); 56 }, 57 "collapse": null, 58 "maximize": null, 59 "minimize": null, 60 "help": null, 61 "restore": null 62 } 63 }; 64 65 // plugin settings (will be modified during init) 66 var settings; 67 68 // plubic methods 69 var methods = { 70 71 "init": function (options) { 72 var self = this; 73 // validation 74 if (!$(self).dialog) { 75 $.error("jQuery.dialogExtend Error : Only jQuery UI Dialog element is accepted"); 76 } 77 // merge defaults & options, without modifying the defaults 78 options = options || {}; 79 options.icons = options.icons || {}; 80 options.events = options.events || {}; 81 settings = $.extend({}, defaults, options); 82 settings.icons = $.extend({}, defaults.icons, options.icons); 83 settings.events = $.extend({}, defaults.events, options.events); 84 // initiate plugin... 85 $(self).each(function () { 86 $(this) 87 // do bunch of things... 88 .dialogExtend("_verifySettings") 89 .dialogExtend("_initEvents") 90 .dialogExtend("_initStyles") 91 .dialogExtend("_initButtons") 92 .dialogExtend("_initTitleBar") 93 // set default dialog state 94 .dialogExtend("_setState", "normal") 95 // trigger custom event when done 96 .dialogExtend("_trigger", "load") 97 ; 98 }); 99 100 // maintain chainability 101 return self; 102 }, 103 104 "state": function () { 105 return $(this).data("dialog-extend-state"); 106 }, 107 108 "collapse": function () { 109 var self = this; 110 // calculate new dimension 111 var newHeight = $(this).dialog("widget").find(".ui-dialog-titlebar").height() + 15; 112 // start! 113 $(self) 114 // trigger custom event 115 .dialogExtend("_trigger", "beforeCollapse") 116 // remember original state 117 .dialogExtend("_saveSnapshot") 118 // modify dialog size (after hiding content) 119 .dialog("option", { 120 "resizable": false, 121 "height": newHeight, 122 "maxHeight": newHeight 123 }) 124 // hide content 125 // hide button-pane 126 // make title-bar no-wrap 127 .hide() 128 .dialog("widget") 129 .find(".ui-dialog-buttonpane:visible").hide().end() 130 .find(".ui-dialog-titlebar").css("white-space", "nowrap").end() 131 .find(".ui-dialog-content") 132 // mark new state 133 .dialogExtend("_setState", "collapsed") 134 // trigger custom event 135 .dialogExtend("_trigger", "collapse"); 136 // maintain chainability 137 return self; 138 }, 139 "help": function () { 140 var url = settings.helpUrl; 141 OpenHelp(url); 142 }, 143 "maximize": function () { 144 var self = this; 145 // caculate new dimension 146 var newHeight = $(window).height() - 11; 147 var newWidth = $(window).width() - 11; 148 // start! 149 //return self; 150 $(self) 151 // trigger custom event 152 .dialogExtend("_trigger", "beforeMaximize") 153 // restore to normal state first (when necessary) 154 .each(function () { 155 if ($(this).dialogExtend("state") != "normal") { 156 $(this).dialogExtend("_restoreWithoutTriggerEvent"); 157 } 158 }) 159 // remember original state 160 .dialogExtend("_saveSnapshot") 161 // fix dialog from scrolling 162 .dialog("widget") 163 .css({ 164 // ie6 does not support {position:fixed} ===> simply use {absolute} 165 //"position": (navigator.userAgent.match(/msie/i) && navigator.userAgent.match(/6/)) ? "absolute" : "fixed" 166 "position": "fixed" 167 }) 168 .find(".ui-dialog-content") 169 // show content 170 // show button-pane (when minimized/collapsed) 171 .show() 172 .dialog("widget") 173 .find(".ui-dialog-buttonpane").show().end() 174 .find(".ui-dialog-content") 175 176 // fix dialog from scrolling 177 .dialog("widget") 178 .css({ 179 // ie6 does not support {position:fixed} ===> simply use {absolute} 180 //"position": (navigator.userAgent.match(/msie/i) && navigator.userAgent.match(/6/)) ? "absolute" : "fixed" 181 "position": "fixed" 182 }) 183 .find(".ui-dialog-content") 184 185 // modify dialog with new config 186 .dialog("option", { 187 "resizable": false, 188 "draggable": false, 189 "height": newHeight, 190 "width": newWidth, 191 "position": [1, 1] 192 }) 193 // disable draggable-handle (for <titlebar=none> only) 194 //.dialog("widget") 195 // .draggable("option", "handle", null) 196 // .find(".ui-dialog-draggable-handle").css("cursor", "text").end() 197 //.find(".ui-dialog-content") 198 199 // mark new state 200 .dialogExtend("_setState", "maximized") 201 // modify dialog buttons according to new state 202 .dialogExtend("_toggleButtons") 203 // trigger custom event 204 .dialogExtend("_trigger", "maximize") 205 ; 206 // maintain chainability 207 return self; 208 }, 209 210 "minimize": function () { 211 var self = this; 212 /*...*/ 213 return self; 214 }, 215 216 "restore": function () { 217 var self = this; 218 // start! 219 $(self) 220 // trigger custom event 221 .dialogExtend("_trigger", "beforeRestore") 222 // restore to normal 223 .dialogExtend("_restoreWithoutTriggerEvent") 224 // mark new state ===> must set state *AFTER* restore because '_restoreWithoutTriggerEvent' will check 'beforeState' 225 .dialogExtend("_setState", "normal") 226 // modify dialog buttons according to new state 227 .dialogExtend("_toggleButtons") 228 229 // disable draggable-handle (for <titlebar=none> only) 230 //.dialog("widget") 231 // .draggable("option", "handle", null) 232 // .find(".ui-dialog-draggable-handle").css("cursor", "text").end() 233 //.find(".ui-dialog-content") 234 235 // trigger custom event 236 .dialogExtend("_trigger", "restore"); 237 // focuszál a modálra azért, hogy esc-re becsukódhasson 238 239 // maintain chainability 240 return self; 241 }, 242 243 "_initButtons": function () { 244 var self = this; 245 // start operation on titlebar 246 var titlebar = $(self).dialog("widget").find(".ui-dialog-titlebar"); 247 // create container for buttons
248 var buttonPane = $('<div class="ui-dialog-titlebar-buttonpane"></div>').appendTo(titlebar); 249 $(buttonPane).css({ 250 "position": "absolute", 251 "top": "50%", 252 "right": "0.3em", 253 "margin-top": "-10px", 254 "height": "18px" 255 }); 256 // move 'close' button to button-pane 257 $(titlebar) 258 .find(".ui-dialog-titlebar-close") 259 // override some unwanted jquery-ui styles 260 .css({ "position": "static", "top": "auto", "right": "auto", "margin": 0 }) 261 // change icon 262 .find(".ui-icon").removeClass("ui-icon-closethick").addClass(settings.icons.close).end() 263 // move to button-pane 264 .appendTo(buttonPane) 265 .end(); 266 267 // append other buttons to button-pane 268 $(buttonPane).append('<a class="ui-dialog-titlebar-maximize ui-corner-all" href="#"><span class="ui-icon ' + settings.icons.maximize + '">maximize</span></a>') 269 .append('<a class="ui-dialog-titlebar-restore ui-corner-all" href="#"><span class="ui-icon ' + settings.icons.restore + '">restore</span></a>') 270 .append('<a class="ui-dialog-titlebar-minimize ui-corner-all" href="#"><span class="ui-icon ' + settings.icons.minimize + '">minimize</span></a>'); 271 272 // ha kell a help gomb 273 if (settings.help) { 274 $(buttonPane).append('<a class="ui-dialog-titlebar-help ui-corner-all" href="#"><span class="ui-icon ' + settings.icons.help + '">help</span></a>'); 275 } 276 277 // add effect to buttons 278 $(buttonPane).find(".ui-dialog-titlebar-maximize,.ui-dialog-titlebar-minimize,.ui-dialog-titlebar-restore,.ui-dialog-titlebar-help") 279 .attr("role", "button") 280 .mouseover(function () { $(this).addClass("ui-state-hover"); }) 281 .mouseout(function () { $(this).removeClass("ui-state-hover"); }) 282 .focus(function () { $(this).addClass("ui-state-focus"); }) 283 .blur(function () { $(this).removeClass("ui-state-focus"); }) 284 .end() 285 // default show buttons 286 // set button positions 287 // on-click-button 288 .find(".ui-dialog-titlebar-close") 289 .toggle(settings.close) 290 .end() 291 .find(".ui-dialog-titlebar-maximize") 292 .toggle(settings.maximize) 293 .click(function (e) { 294 e.preventDefault(); 295 $(self).dialogExtend("maximize"); 296 }) 297 .end() 298 .find(".ui-dialog-titlebar-minimize") 299 .toggle(settings.minimize) 300 .click(function (e) { 301 e.preventDefault(); 302 $(self).dialogExtend("minimize"); 303 }) 304 .end() 305 .find(".ui-dialog-titlebar-help") 306 .click(function (e) { 307 e.preventDefault(); 308 $(self).dialogExtend("help"); 309 }) 310 .end() 311 .find(".ui-dialog-titlebar-restore") 312 .hide() 313 .click(function (e) { 314 e.preventDefault(); 315 $(self).dialogExtend("restore"); 316 }) 317 .end(); 318 // other titlebar behaviors 319 $(titlebar) 320 // on-dblclick-titlebar : maximize/minimize/collapse/restore 321 .dblclick(function (evt) { 322 if (settings.dblclick && settings.dblclick.length) { 323 $(self).dialogExtend($(self).dialogExtend("state") != "normal" ? "restore" : settings.dblclick); 324 } 325 }) 326 // avoid text-highlight when double-click 327 .select(function () { 328 return false; 329 }); 330 // maintain chainability 331 return self; 332 }, 333 334 "_initEvents": function () { 335 var self = this; 336 // bind event callbacks which specified at init 337 $.each(settings.events, function (type) { 338 if ($.isFunction(settings.events[type])) { 339 $(self).bind(type + ".dialogExtend", settings.events[type]); 340 //$(self).bind(type + ".autocomplateExtend", settings.events[type]); 341 } 342 }); 343 // maintain chainability 344 return self; 345 }, 346 347 "_initStyles": function () { 348 var self = this; 349 // append styles for this plugin to body 350 if (!$(".dialog-extend-css").length) { 351 var style = ''; 352 style += '<style class="dialog-extend-css" type="text/css">'; 353 style += '.ui-dialog .ui-dialog-titlebar-buttonpane>a { float: right; }'; 354 style += '.ui-dialog .ui-dialog-titlebar-maximize,'; 355 style += '.ui-dialog .ui-dialog-titlebar-minimize,'; 356 style += '.ui-dialog .ui-dialog-titlebar-help,'; 357 style += '.ui-dialog .ui-dialog-titlebar-restore { width: 19px; padding: 1px; height: 18px; }'; 358 359 style += '.ui-dialog .ui-dialog-titlebar-maximize span,'; 360 style += '.ui-dialog .ui-dialog-titlebar-minimize span,'; 361 style += '.ui-dialog .ui-dialog-titlebar-help span,'; 362 style += '.ui-dialog .ui-dialog-titlebar-restore span { display: block; margin: 1px; }'; 363 364 style += '.ui-dialog .ui-dialog-titlebar-maximize:hover,'; 365 style += '.ui-dialog .ui-dialog-titlebar-maximize:focus,'; 366 style += '.ui-dialog .ui-dialog-titlebar-minimize:hover,'; 367 style += '.ui-dialog .ui-dialog-titlebar-minimize:focus,'; 368 style += '.ui-dialog .ui-dialog-titlebar-help:hover,'; 369 style += '.ui-dialog .ui-dialog-titlebar-help:focus,'; 370 style += '.ui-dialog .ui-dialog-titlebar-restore:hover,'; 371 style += '.ui-dialog .ui-dialog-titlebar-restore:focus { padding: 0; }'; 372 373 style += '.ui-dialog .ui-dialog-titlebar ::selection { background-color: transparent; }'; 374 style += '</style>'; 375 $(style).appendTo("body"); 376 } 377 // maintain chainability 378 return self; 379 }, 380 381 "_initTitleBar": function () { 382 var self = this; 383 // modify title bar 384 switch (settings.titlebar) { 385 case false: 386 // do nothing 387 break; 388 case "none": 389 // create new draggable-handle as substitute of title bar 390 if ($(self).dialog("option", "draggable")) { 391 var handle = $("<div />").addClass("ui-dialog-draggable-handle").css("cursor", "move").height(5); 392 $(self).dialog("widget").prepend(handle).draggable("option", "handle", handle); 393 } 394 // remove title bar and keep it draggable 395 $(self) 396 .dialog("widget") 397 .find(".ui-dialog-titlebar") 398 // clear title text 399 .find(".ui-dialog-title").html(" ").end() 400 // keep buttons at upper-right-hand corner 401 .css({ 402 "background-color": "transparent", 403 "background-image": "none", 404 "border": 0, 405 "position": "absolute",
406 "right": 0, 407 "top": 0, 408 "z-index": 10002 409 }) 410 .end(); 411 break; 412 case "transparent": 413 // remove title style 414 $(self) 415 .dialog("widget") 416 .find(".ui-dialog-titlebar") 417 .css({ 418 "background-color": "transparent", 419 "background-image": "none", 420 "border": 0 421 }); 422 break; 423 default: 424 $.error("jQuery.dialogExtend Error : Invalid <titlebar> value '" + settings.titlebar + "'"); 425 } 426 // maintain chainability 427 return self; 428 }, 429 430 "_loadSnapshot": function () { 431 var self = this; 432 return { 433 "config": { 434 "resizable": $(self).data("original-config-resizable"), 435 "draggable": $(self).data("original-config-draggable") 436 }, 437 "size": { 438 "height": $(self).data("original-size-height"), 439 "width": $(self).data("original-size-width"), 440 "maxHeight": $(self).data("original-size-maxHeight") 441 }, 442 "position": { 443 "mode": $(self).data("original-position-mode"), 444 "left": $(self).data("original-position-left"), 445 "top": $(self).data("original-position-top") - $(window).scrollTop() 446 }, 447 "titlebar": { 448 "wrap": $(self).data("original-titlebar-wrap") 449 } 450 }; 451 }, 452 453 "_restoreFromCollapsed": function () { 454 var self = this; 455 var original = $(this).dialogExtend("_loadSnapshot"); 456 // restore dialog 457 $(self) 458 // show content 459 // show button-pane 460 // fix title-bar wrap 461 .show() 462 .dialog("widget") 463 .find(".ui-dialog-buttonpane:hidden").show().end() 464 .find(".ui-dialog-titlebar").css("white-space", original.titlebar.wrap).end() 465 .find(".ui-dialog-content") 466 // restore config & size 467 .dialog("option", { 468 "resizable": original.config.resizable, 469 "height": original.size.height, 470 "maxHeight": original.size.maxHeight 471 }); 472 // maintain chainability 473 return self; 474 }, 475 476 "_restoreFromNormal": function () { 477 // do nothing actually... 478 // maintain chainability 479 return this; 480 }, 481 482 "_restoreFromMaximized": function () { 483 var self = this; 484 var original = $(this).dialogExtend("_loadSnapshot"); 485 // restore dialog 486 $(self) 487 // free dialog from scrolling 488 // fix title-bar wrap (if dialog was minimized/collapsed) 489 .dialog("widget") 490 .css("position", original.position.mode) 491 .find(".ui-dialog-titlebar").css("white-space", original.titlebar.wrap).end() 492 .find(".ui-dialog-content") 493 // restore config & size 494 .dialog("option", { 495 "resizable": original.config.resizable, 496 "draggable": original.config.draggable, 497 "height": original.size.height, 498 "width": original.size.width, 499 "maxHeight": original.size.maxHeight 500 }) 501 // restore position *AFTER* size restored 502 .dialog("option", { 503 "position": [original.position.left, original.position.top] 504 }) 505 // restore draggable-handle (for <titlebar=none> only) 506 .dialog("widget") 507 //.draggable("option", "handle", $(this).find(".ui-dialog-draggable-handle")) 508 .draggable("option", "handle", null) 509 .find(".ui-dialog-draggable-handle") 510 .css("cursor", "move").end() 511 .find(".ui-dialog-content"); 512 513 // maintain chainability 514 return self; 515 }, 516 517 "_restoreFromMinimized": function () { 518 var self = this; 519 var original = $(this).dialogExtend("_loadSnapshot"); 520 // restore dialog 521 //$(self) 522 // // move dialog back from container to body 523 // .dialog("widget") 524 // .appendTo("body") 525 // .css({ 526 // "float": "none", 527 // "margin": 0, 528 // "position": original.position.mode 529 // }) 530 // .find(".ui-dialog-content") 531 // // revert title text 532 // .dialog("widget") 533 // .find(".ui-dialog-title") 534 // .css({ "width": "auto" }) 535 // .end() 536 // .find(".ui-dialog-content") 537 // // show content 538 // // show button-pane 539 // // fix title-bar wrap 540 // .show() 541 // .dialog("widget") 542 // .find(".ui-dialog-buttonpane:hidden").show().end() 543 // .find(".ui-dialog-titlebar").css("white-space", original.titlebar.wrap).end() 544 // .find(".ui-dialog-content") 545 // // restore config & size 546 // .dialog("option", { 547 // "resizable": original.config.resizable, 548 // "draggable": original.config.draggable, 549 // "height": original.size.height, 550 // "width": original.size.width, 551 // "maxHeight": original.size.maxHeight 552 // }) 553 // // restore position *AFTER* size restored 554 // .dialog("option", { 555 // "position": [original.position.left, original.position.top] 556 // }) 557 // // restore draggable-handle (for <titlebar=none> only) 558 // .dialog("widget") 559 // .draggable("option", "handle", $(this).find(".ui-dialog-draggable-handle")) 560 // .find(".ui-dialog-draggable-handle") 561 // .css("cursor", "move"); 562 // maintain chainability 563 return self; 564 }, 565 566 "_restoreWithoutTriggerEvent": function () { 567 var self = this; 568 var beforeState = $(self).dialogExtend("state"); 569 $(self) 570 // restore dialog according to previous state 571 .dialogExtend( 572 beforeState == "maximized" ? "_restoreFromMaximized" :
573 beforeState == "minimized" ? "_restoreFromMinimized" : 574 beforeState == "collapsed" ? "_restoreFromCollapsed" : 575 beforeState == "normal" ? "_restoreFromNormal" : 576 $.error("jQuery.dialogExtend Error : Cannot restore dialog from unknown state '" + beforeState + "'") 577 ); 578 // maintain chainability 579 return self; 580 }, 581 582 "_saveSnapshot": function () { 583 var self = this; 584 // remember all configs under normal state 585 if ($(self).dialogExtend("state") == "normal") { 586 $(self) 587 .data("original-config-resizable", $(self).dialog("option", "resizable")) 588 .data("original-config-draggable", $(self).dialog("option", "draggable")) 589 .data("original-size-height", $(self).dialog("widget").height()) 590 .data("original-size-width", $(self).dialog("option", "width")) 591 .data("original-size-maxHeight", $(self).dialog("option", "maxHeight")) 592 .data("original-position-mode", $(self).dialog("widget").css("position")) 593 .data("original-position-left", $(self).dialog("widget").offset().left) 594 .data("original-position-top", $(self).dialog("widget").offset().top) 595 .data("original-titlebar-wrap", $(self).dialog("widget").find(".ui-dialog-titlebar").css("white-space")); 596 } 597 // maintain chainability 598 return self; 599 }, 600 601 "_setState": function (state) { 602 var self = this; 603 $(self) 604 // toggle data state 605 .data("dialog-extend-state", state) 606 // toggle class 607 .removeClass("ui-dialog-normal ui-dialog-maximized ui-dialog-minimized ui-dialog-collapsed") 608 .addClass("ui-dialog-" + state); 609 // maintain chainability 610 return self; 611 }, 612 613 "_toggleButtons": function () { 614 var self = this; 615 // show or hide buttons & decide position 616 $(self).dialog("widget") 617 .find(".ui-dialog-titlebar-maximize") 618 .toggle($(self).dialogExtend("state") != "maximized" && settings.maximize) 619 .end() 620 .find(".ui-dialog-titlebar-minimize") 621 .toggle($(self).dialogExtend("state") != "minimized" && settings.minimize) 622 .end() 623 .find(".ui-dialog-titlebar-restore") 624 .toggle($(self).dialogExtend("state") != "normal" && (settings.maximize || settings.minimize)) 625 .css({ "right": $(self).dialogExtend("state") == "maximized" ? "1.9em" : $(self).dialogExtend("state") == "minimized" ? !settings.maximize ? "1.4em" : "2.5em" : "-9999em" }) 626 .end(); 627 // maintain chainability 628 return self; 629 }, 630 631 "_trigger": function (type) { 632 var self = this; 633 // trigger event with namespace when user bind to it 634 $(self).triggerHandler(type + ".dialogExtend", this); 635 // maintain chainability 636 return self; 637 }, 638 639 "_verifySettings": function () { 640 var self = this; 641 // check <dblclick> option 642 if (!settings.dblclick) { 643 } else if (settings.dblclick == "maximize") { 644 } else if (settings.dblclick == "minimize") { 645 } else if (settings.dblclick == "collapse") { 646 } else { 647 $.error("jQuery.dialogExtend Error : Invalid <dblclick> value '" + settings.dblclick + "'"); 648 settings.dblclick = false; 649 } 650 // check <titlebar> option 651 if (!settings.titlebar) { 652 } else if (settings.titlebar == "none") { 653 } else if (settings.titlebar == "transparent") { 654 } else { 655 $.error("jQuery.dialogExtend Error : Invalid <titlebar> value '" + settings.titlebar + "'"); 656 settings.titlebar = false; 657 } 658 // maintain chainability 659 return self; 660 } 661 662 }; 663 664 // core method 665 $.fn.dialogExtend = function (method) { 666 // method calling logic 667 if (methods[method]) { 668 return methods[method].apply(this, Array.prototype.slice.call(arguments, 1)); 669 } else if (typeof method === "object" || !method) { 670 return methods.init.apply(this, arguments); 671 } else { 672 $.error("jQuery.dialogExtend Error : Method <" + method + "> does not exist"); 673 } 674 }; 675}(jQuery));
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.