Simplify usage of modal

This commit is contained in:
Lorenz Hübschle-Schneider 2014-07-06 15:05:48 +01:00
parent 73dcddac0e
commit e236d937e2
2 changed files with 15 additions and 7 deletions

View file

@ -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 -->

View file

@ -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) {