From e236d937e2d158bc40ed91fa518593cb6a759c5e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lorenz=20H=C3=BCbschle-Schneider?=
 <lorenz-dev@lgh-alumni.de>
Date: Sun, 6 Jul 2014 15:05:48 +0100
Subject: [PATCH] Simplify usage of modal

---
 index.html        |  6 +++---
 js/glowingbear.js | 16 ++++++++++++----
 2 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/index.html b/index.html
index d8b7b71..9d3bde1 100644
--- a/index.html
+++ b/index.html
@@ -196,7 +196,7 @@ $ openssl req -nodes -newkey rsa:4096 -keyout relay.pem -x509 -days 365 -out rel
         <div class="title" ng-bind-html="activeBuffer().title | irclinky:'_blank'" title="{{activeBuffer().title}}"></div>
         <div class="actions pull-right vertical-line-left">
           <div class="pull-left">
-            <a class="settings-toggle" ng-click="toggleModal('settingsModal')" title="Options menu">
+            <a class="settings-toggle" ng-click="showModal('settingsModal')" title="Options menu">
               <i class="glyphicon glyphicon-cog"></i>
             </a>
           </div>
@@ -263,7 +263,7 @@ $ openssl req -nodes -newkey rsa:4096 -keyout relay.pem -x509 -days 365 -out rel
       </div>
     </div>
     <div id="soundNotification"></div>
-    <div id="settingsModal" class="gb-modal" data-state="hidden" ng-click="toggleModal('settingsModal')">
+    <div id="settingsModal" class="gb-modal" data-state="hidden" ng-click="closeModal($event)">
       <div class="modal-dialog" ng-click="preventModalToggle('settingsModal', $event)">
         <div class="modal-content">
           <div class="modal-header">
@@ -383,7 +383,7 @@ $ openssl req -nodes -newkey rsa:4096 -keyout relay.pem -x509 -days 365 -out rel
             </ul>
           </div>
           <div class="modal-footer">
-            <button type="button" class="btn btn-primary" ng-click="toggleModal('settingsModal')">Close</button>
+            <button type="button" class="btn btn-primary" ng-click="closeModal($event)">Close</button>
           </div>
         </div><!-- /.modal-content -->
       </div><!-- /.modal-dialog -->
diff --git a/js/glowingbear.js b/js/glowingbear.js
index e322d52..e169bd7 100644
--- a/js/glowingbear.js
+++ b/js/glowingbear.js
@@ -1080,10 +1080,18 @@ weechat.controller('WeechatCtrl', ['$rootScope', '$scope', '$store', '$timeout',
         }
     };
 
-    // Modal toggles
-    $scope.toggleModal = function(elementId) {
-        var element = document.getElementById(elementId);
-        element.setAttribute('data-state', element.getAttribute('data-state') === "hidden" ? "visible" : "hidden");
+    $scope.showModal = function(elementId) {
+        document.getElementById(elementId).setAttribute('data-state', 'visible');
+    };
+    $scope.closeModal = function($event) {
+        function closest(elem, selector) {
+            var matchesSelector = elem.matches || elem.webkitMatchesSelector || elem.mozMatchesSelector || elem.msMatchesSelector;
+            while (elem) {
+                if (matchesSelector.call(elem, selector)) return elem;
+                else elem = elem.parentElement;
+            }
+        }
+        closest($event.target, '.gb-modal').setAttribute('data-state', 'hidden');
     };
 
     $scope.preventModalToggle = function(elementId, event) {