tobast/glowingbear-mainbox
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Simplify usage of modal

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

6
index.html
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="title" ng-bind-html="activeBuffer().title | irclinky:'_blank'" title="{{activeBuffer().title}}"></div>
<div class="actions pull-right vertical-line-left"> <div class="actions pull-right vertical-line-left">
<div class="pull-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> <i class="glyphicon glyphicon-cog"></i>
</a> </a>
</div> </div>
@ -263,7 +263,7 @@ $ openssl req -nodes -newkey rsa:4096 -keyout relay.pem -x509 -days 365 -out rel
</div> </div>
</div> </div>
<div id="soundNotification"></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-dialog" ng-click="preventModalToggle('settingsModal', $event)">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
@ -383,7 +383,7 @@ $ openssl req -nodes -newkey rsa:4096 -keyout relay.pem -x509 -days 365 -out rel
</ul> </ul>
</div> </div>
<div class="modal-footer"> <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>
</div><!-- /.modal-content --> </div><!-- /.modal-content -->
</div><!-- /.modal-dialog --> </div><!-- /.modal-dialog -->

16
js/glowingbear.js
View file

@ -1080,10 +1080,18 @@ weechat.controller('WeechatCtrl', ['$rootScope', '$scope', '$store', '$timeout',
} }
}; };
// Modal toggles $scope.showModal = function(elementId) {
$scope.toggleModal = function(elementId) { document.getElementById(elementId).setAttribute('data-state', 'visible');
var element = document.getElementById(elementId); };
element.setAttribute('data-state', element.getAttribute('data-state') === "hidden" ? "visible" : "hidden"); $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) { $scope.preventModalToggle = function(elementId, event) {