[Rt-commit] rt branch, 4.2/js-modal-library, created. rt-4.1.5-3-g393f37d

Thomas Sibley trs at bestpractical.com
Tue Dec 4 20:08:50 EST 2012


The branch, 4.2/js-modal-library has been created
        at  393f37d2e0ee7b06af9b6f0ab7f94150644facfb (commit)

- Log -----------------------------------------------------------------
commit 393f37d2e0ee7b06af9b6f0ab7f94150644facfb
Author: Thomas Sibley <trs at bestpractical.com>
Date:   Tue Dec 4 17:07:11 2012 -0800

    Add a simple, small JS modal ("lightbox") library
    
    An older version that's compatible with our currently ancient version
    1.4.2 of jQuery.

diff --git a/devel/third-party/README b/devel/third-party/README
index 84b29fa..933ba16 100644
--- a/devel/third-party/README
+++ b/devel/third-party/README
@@ -27,3 +27,7 @@ The Noun Project
 http://thenounproject.com/noun/eye-dropper/
 Creative Commons - Attribution (CC BY 3.0)
 Modified version included at share/html/NoAuth/images/eyedropper.png
+
+jquery.modal-0.2.5.js
+https://github.com/kylefox/jquery-modal/archive/v0.2.5.tar.gz
+Simple jQuery modal plugin, minified source in jquery.modal.min.js
diff --git a/devel/third-party/jquery.modal-0.2.5.js b/devel/third-party/jquery.modal-0.2.5.js
new file mode 100644
index 0000000..42154df
--- /dev/null
+++ b/devel/third-party/jquery.modal-0.2.5.js
@@ -0,0 +1,154 @@
+/*
+    A simple jQuery modal (http://github.com/kylefox/jquery-modal)
+    Version 0.2.5
+
+    Copyright (c) 2012 Kyle Fox
+
+    Permission is hereby granted, free of charge, to any person obtaining
+    a copy of this software and associated documentation files (the
+    "Software"), to deal in the Software without restriction, including
+    without limitation the rights to use, copy, modify, merge, publish,
+    distribute, sublicense, and/or sell copies of the Software, and to
+    permit persons to whom the Software is furnished to do so, subject to
+    the following conditions:
+
+    The above copyright notice and this permission notice shall be
+    included in all copies or substantial portions of the Software.
+
+    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+    EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+    MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+    NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+    LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+    OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+    WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+*/
+(function($) {
+
+  var current_modal = null;
+
+  $.fn.modal = function(options) {
+    
+    var $elm = $(this);
+    
+    // If this is a link, bind to its click event.
+    if($elm.attr('href')) {
+      $elm.click(open_modal_from_link);
+      return;
+    }
+
+    options = $.extend({}, $.fn.modal.defaults, options);
+
+    function block() {
+      current_modal.blocker = $('<div class="jquery-modal blocker"></div>').css({
+        top: 0, right: 0, bottom: 0, left: 0,
+        width: "100%", height: "100%",
+        position: "fixed",
+        zIndex: options.zIndex,
+        background: options.overlay,
+        opacity: options.opacity
+      });
+      if(options.escapeClose) {
+        $(document).bind('keydown.modal', function(event) {
+          if(event.which == 27) {$.fn.modal.close();}
+        });
+      }
+      if(options.clickClose) {
+        current_modal.blocker.click($.fn.modal.close);
+      }
+      $('body').append(current_modal.blocker);
+      $elm.trigger($.fn.modal.BLOCK, [current_modal]);
+    }
+
+    function show() {
+      center_modal(current_modal);
+      if(options.showClose) {
+        current_modal.closeButton = $('<a href="#close-modal" rel="modal:close" class="close-modal">' + options.closeText + '</a>');
+        current_modal.elm.append(current_modal.closeButton);
+      }
+      $elm.addClass(options.modalClass + ' current').show();
+      $elm.trigger($.fn.modal.OPEN, [current_modal]);
+    }
+
+    current_modal = {elm: $elm, options: options};
+    $elm.trigger($.fn.modal.BEFORE_BLOCK, [current_modal]);
+    block();
+    $elm.trigger($.fn.modal.BEFORE_OPEN, [current_modal]);
+    show();
+  };
+
+  $.fn.modal.defaults = {
+    overlay: "#000",
+    opacity: 0.75,
+    zIndex: 1,
+    escapeClose: true,
+    clickClose: true,
+    closeText: 'Close',
+    modalClass: "modal",
+    showClose: true
+  };
+
+  // Event constants:
+  $.fn.modal.BEFORE_BLOCK = 'modal:before-block';
+  $.fn.modal.BLOCK = 'modal:block';
+  $.fn.modal.BEFORE_OPEN = 'modal:before-open';
+  $.fn.modal.OPEN = 'modal:open';
+  $.fn.modal.BEFORE_CLOSE = 'modal:before-close';
+  $.fn.modal.CLOSE = 'modal:close';
+
+  $.fn.modal.close = function(event) {
+    if(event) {
+      event.preventDefault();
+    }
+    if(!current_modal) {
+      return;
+    }
+    
+    current_modal.elm.trigger($.fn.modal.BEFORE_CLOSE, [current_modal]);
+    if(current_modal.closeButton) {
+      current_modal.closeButton.remove();
+    }
+    current_modal.blocker.remove();
+    current_modal.elm.removeClass('current').hide();
+    current_modal.elm.trigger($.fn.modal.CLOSE, [current_modal]);
+    current_modal = null;
+    
+    $(document).unbind('keydown.modal');
+  };
+  
+  $.fn.modal.resize = function() {
+    center_modal(current_modal);
+  };
+
+  function open_modal_from_link(event) {
+    event.preventDefault();
+    var target = $(this).attr('href');
+    if(/^#/.test(target)) { // DOM id
+      $(target).modal();
+    } else { // AJAX
+      $.get(target, {}, function(html) {
+        $('<div/>')
+          .html(html)
+          .appendTo('body')
+          .bind('modal:close', function(event, modal) { modal.elm.remove(); })
+          .modal();
+      });
+    }
+  }
+  
+  function center_modal(modal) {
+    modal.elm.css({
+      position: 'fixed',
+      top: "50%",
+      left: "50%",
+      marginTop: - (modal.elm.outerHeight() / 2),
+      marginLeft: - (modal.elm.outerWidth() / 2),
+      zIndex: modal.options.zIndex + 1
+    });
+  };
+  
+  // Automatically bind links with rel="modal:close" to, well, close the modal.
+  $('a[rel="modal:open"]').live('click', open_modal_from_link);
+  $('a[rel="modal:close"]').live('click', $.fn.modal.close);
+  
+})(jQuery);
diff --git a/etc/RT_Config.pm.in b/etc/RT_Config.pm.in
index 40a696f..c164d15 100755
--- a/etc/RT_Config.pm.in
+++ b/etc/RT_Config.pm.in
@@ -899,6 +899,8 @@ Set(@JSFiles, qw/
     jquery-ui-1.8.4.custom.min.js
     jquery-ui-timepicker-addon.js
     jquery-ui-patch-datepicker.js
+    jquery.modal.min.js
+    jquery.modal-defaults.js
     titlebox-state.js
     util.js
     userautocomplete.js
diff --git a/share/html/NoAuth/css/base/jquery.modal.css b/share/html/NoAuth/css/base/jquery.modal.css
new file mode 100644
index 0000000..61e4cb6
--- /dev/null
+++ b/share/html/NoAuth/css/base/jquery.modal.css
@@ -0,0 +1,45 @@
+/*
+    Copyright (c) 2012 Kyle Fox
+
+    Permission is hereby granted, free of charge, to any person obtaining
+    a copy of this software and associated documentation files (the
+    "Software"), to deal in the Software without restriction, including
+    without limitation the rights to use, copy, modify, merge, publish,
+    distribute, sublicense, and/or sell copies of the Software, and to
+    permit persons to whom the Software is furnished to do so, subject to
+    the following conditions:
+
+    The above copyright notice and this permission notice shall be
+    included in all copies or substantial portions of the Software.
+
+    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+    EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+    MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+    NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+    LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+    OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+    WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+*/
+.modal {
+  display: none;
+  width: 400px;
+  background: #fff;
+  padding: 15px 30px;
+  -webkit-border-radius: 8px;
+  -moz-border-radius: 8px;
+  border-radius: 8px;
+  -webkit-box-shadow: 0 0 10px #000;
+  -moz-box-shadow: 0 0 10px #000;
+  box-shadow: 0 0 10px #000;
+}
+
+.modal a.close-modal {
+  position: absolute;
+  top: -12.5px;
+  right: -12.5px;
+  display: block;
+  width: 30px;
+  height: 30px;
+  text-indent: -9999px;
+  background: url(<% RT->Config->Get("WebPath") %>/NoAuth/css/images/jquery-modal-close.png) no-repeat 0 0;
+}
diff --git a/share/html/NoAuth/css/base/main.css b/share/html/NoAuth/css/base/main.css
index 4b844f4..a263eee 100644
--- a/share/html/NoAuth/css/base/main.css
+++ b/share/html/NoAuth/css/base/main.css
@@ -50,6 +50,7 @@
 @import "yui-fonts.css";
 @import "jquery-ui.css";
 @import "jquery-ui-timepicker-addon.css";
+ at import "jquery.modal.css";
 @import "superfish.css";
 @import "superfish-navbar.css";
 @import "superfish-vertical.css";
diff --git a/share/html/NoAuth/css/images/jquery-modal-close.png b/share/html/NoAuth/css/images/jquery-modal-close.png
new file mode 100644
index 0000000..4de4396
Binary files /dev/null and b/share/html/NoAuth/css/images/jquery-modal-close.png differ
diff --git a/share/html/NoAuth/js/jquery.modal-defaults.js b/share/html/NoAuth/js/jquery.modal-defaults.js
new file mode 100644
index 0000000..d14b002
--- /dev/null
+++ b/share/html/NoAuth/js/jquery.modal-defaults.js
@@ -0,0 +1,2 @@
+// RT's styles have some crazy z-indexes, so get above 'em all by default.
+jQuery.fn.modal.defaults.zIndex = 9999;
diff --git a/share/html/NoAuth/js/jquery.modal.min.js b/share/html/NoAuth/js/jquery.modal.min.js
new file mode 100644
index 0000000..133f51c
--- /dev/null
+++ b/share/html/NoAuth/js/jquery.modal.min.js
@@ -0,0 +1,26 @@
+/*
+    A simple jQuery modal (http://github.com/kylefox/jquery-modal)
+    Version 0.2.5
+
+    Copyright (c) 2012 Kyle Fox
+
+    Permission is hereby granted, free of charge, to any person obtaining
+    a copy of this software and associated documentation files (the
+    "Software"), to deal in the Software without restriction, including
+    without limitation the rights to use, copy, modify, merge, publish,
+    distribute, sublicense, and/or sell copies of the Software, and to
+    permit persons to whom the Software is furnished to do so, subject to
+    the following conditions:
+
+    The above copyright notice and this permission notice shall be
+    included in all copies or substantial portions of the Software.
+
+    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+    EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+    MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+    NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+    LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+    OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+    WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+*/
+(function(a){function d(a){a.elm.css({position:"fixed",top:"50%",left:"50%",marginTop:-(a.elm.outerHeight()/2),marginLeft:-(a.elm.outerWidth()/2),zIndex:a.options.zIndex+1})}function c(b){b.preventDefault();var c=a(this).attr("href");if(/^#/.test(c)){a(c).modal()}else{a.get(c,{},function(b){a("<div/>").html(b).appendTo("body").bind("modal:close",function(a,b){b.elm.remove()}).modal()})}}var b=null;a.fn.modal=function(e){function h(){d(b);if(e.showClose){b.closeButton=a('<a href="#close-modal" rel="modal:close" class="close-modal">'+e.closeText+"</a>");b.elm.append(b.closeButton)}f.addClass(e.modalClass+" current").show();f.trigger(a.fn.modal.OPEN,[b])}function g(){b.blocker=a('<div class="jquery-modal blocker"></div>').css({top:0,right:0,bottom:0,left:0,width:"100%",height:"100%",position:"fixed",zIndex:e.zIndex,background:e.overlay,opacity:e.opacity});if(e.escapeClose){a(document).bind("keydown.modal",function(b){if(b.which==27){a.fn.modal.close()}})}if(e.clickClose){b.bloc
 ker.click(a.fn.modal.close)}a("body").append(b.blocker);f.trigger(a.fn.modal.BLOCK,[b])}var f=a(this);if(f.attr("href")){f.click(c);return}e=a.extend({},a.fn.modal.defaults,e);b={elm:f,options:e};f.trigger(a.fn.modal.BEFORE_BLOCK,[b]);g();f.trigger(a.fn.modal.BEFORE_OPEN,[b]);h()};a.fn.modal.defaults={overlay:"#000",opacity:.75,zIndex:1,escapeClose:true,clickClose:true,closeText:"Close",modalClass:"modal",showClose:true};a.fn.modal.BEFORE_BLOCK="modal:before-block";a.fn.modal.BLOCK="modal:block";a.fn.modal.BEFORE_OPEN="modal:before-open";a.fn.modal.OPEN="modal:open";a.fn.modal.BEFORE_CLOSE="modal:before-close";a.fn.modal.CLOSE="modal:close";a.fn.modal.close=function(c){if(c){c.preventDefault()}if(!b){return}b.elm.trigger(a.fn.modal.BEFORE_CLOSE,[b]);if(b.closeButton){b.closeButton.remove()}b.blocker.remove();b.elm.removeClass("current").hide();b.elm.trigger(a.fn.modal.CLOSE,[b]);b=null;a(document).unbind("keydown.modal")};a.fn.modal.resize=function(){d(b)};a('a[rel="modal:op
 en"]').live("click",c);a('a[rel="modal:close"]').live("click",a.fn.modal.close)})(jQuery)

-----------------------------------------------------------------------


More information about the Rt-commit mailing list