From: Nick Veys <nickveys@gmail.com>
Date: Sat, 17 Sep 2011 19:47:38 +0000 (-0500)
Subject: Adding flag to prevent backdrop click hiding modal
X-Git-Tag: v1.4.0~78
X-Git-Url: http://git.ipfire.org/gitweb.cgi?a=commitdiff_plain;h=2cb233319da422c9f003e8687d686e96a92be489;p=thirdparty%2Fbootstrap.git

Adding flag to prevent backdrop click hiding modal
---

diff --git a/docs/javascript.html b/docs/javascript.html
index f001ad8083..e0d85f25a7 100644
--- a/docs/javascript.html
+++ b/docs/javascript.html
@@ -105,6 +105,12 @@
                <td>false</td>
                <td>Includes a modal-backdrop element</td>
              </tr>
+             <tr>
+               <td>backdropClickHides</td>
+               <td>boolean</td>
+               <td>true</td>
+               <td>A click on the modal-backdrop element hides the modal</td>
+             </tr>
              <tr>
                <td>keyboard</td>
                <td>boolean</td>
diff --git a/js/bootstrap-modal.js b/js/bootstrap-modal.js
index da67060731..98e5d43015 100644
--- a/js/bootstrap-modal.js
+++ b/js/bootstrap-modal.js
@@ -133,8 +133,10 @@
       , animate = this.$element.hasClass('fade') ? 'fade' : ''
     if ( this.isShown && this.settings.backdrop ) {
       this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
-        .click($.proxy(this.hide, this))
-        .appendTo(document.body)
+      if ( this.settings.backdropClickHides ) {
+          this.$backdrop.click($.proxy(this.hide, this))
+      }
+      this.$backdrop.appendTo(document.body)
 
       setTimeout(function () {
         that.$backdrop && that.$backdrop.addClass('in')
@@ -208,6 +210,7 @@
 
   $.fn.modal.defaults = {
     backdrop: false
+  , backdropClickHides: true
   , keyboard: false
   , show: true
   }
diff --git a/js/tests/unit/bootstrap-modal.js b/js/tests/unit/bootstrap-modal.js
index 4bbb3313cc..69e720f0f1 100644
--- a/js/tests/unit/bootstrap-modal.js
+++ b/js/tests/unit/bootstrap-modal.js
@@ -86,4 +86,66 @@ $(function () {
           })
           .modal("toggle")
       })
-})
\ No newline at end of file
+
+      test("should add backdrop when desired", function () {
+        stop()
+        $.support.transition = false
+        var div = $("<div id='modal-test'></div>")
+        div
+          .modal({backdrop:true})
+          .modal("show")
+          .bind("shown", function () {
+            equal($('.modal-backdrop').length, 1, 'modal backdrop inserted into dom')
+            start()
+            div.remove()
+            $('.modal-backdrop').remove()
+          })
+      })
+
+      test("should not add backdrop when not desired", function () {
+        stop()
+        $.support.transition = false
+        var div = $("<div id='modal-test'></div>")
+        div
+          .modal({backdrop:false})
+          .modal("show")
+          .bind("shown", function () {
+            equal($('.modal-backdrop').length, 0, 'modal backdrop not inserted into dom')
+            start()
+            div.remove()
+          })
+      })
+
+      test("should close backdrop when clicked", function () {
+        stop()
+        $.support.transition = false
+        var div = $("<div id='modal-test'></div>")
+        div
+          .modal({backdrop:true})
+          .modal("show")
+          .bind("shown", function () {
+            equal($('.modal-backdrop').length, 1, 'modal backdrop inserted into dom')
+            $('.modal-backdrop').click()
+            equal($('.modal-backdrop').length, 0, 'modal backdrop removed from dom')
+            start()
+            div.remove()
+          })
+      })
+
+      test("should not close backdrop when click disabled", function () {
+        stop()
+        $.support.transition = false
+        var div = $("<div id='modal-test'></div>")
+        div
+          .modal({backdrop:true, backdropClickHides:false})
+          .modal("show")
+          .bind("shown", function () {
+            equal($('.modal-backdrop').length, 1, 'modal backdrop inserted into dom')
+            $('.modal-backdrop').click()
+            equal($('.modal-backdrop').length, 1, 'modal backdrop still in dom')
+            start()
+            div.remove()
+            $('.modal-backdrop').remove()
+          })
+      })
+})