Martchus
/
syncthing
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

gui: Add support for multiple stacked modals 

GitHub-Pull-Request: https://github.com/syncthing/syncthing/pull/3288
This commit is contained in:
Daniel Harte 2016-06-09 10:45:43 +00:00 committed by Jakob Borg
parent 11b9212948
commit 9a25df01fe
1 changed files with 57 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
gui/default/syncthing/core/modalDirective.js
View File

@ -11,6 +11,63 @@ angular.module('syncthing.core')
icon: '@',
close: '@',
large: '@'
},
link: function (scope, element, attrs, tabsCtrl) {
// before modal show animation
$(element).on('show.bs.modal', function () {
// cycle through open modals, acertain modal with highest z-index
var largestZ = 1040;
$('.modal:visible').each(function (i) {
var thisZ = parseInt($(this).css('zIndex'));
if (thisZ > largestZ) {
largestZ = thisZ;
}
});
// set this modal's z-index to be 10 above the highest z
var aboveLargestZ = largestZ + 10;
$(element).css('zIndex', aboveLargestZ);
// set backdrop z-index. timeout used because element does not exist immediatly
setTimeout(function () {
$('.modal-backdrop:not(:last)').removeClass('in').addClass('out');
$('.modal-backdrop:last').attr('for-modal-id', $(element).attr('id')).css('zIndex', aboveLargestZ - 5);
}, 0);
});
// BEFORE modal hide animation
$(element).on('hide.bs.modal', function () {
// find and unhide the next backdrop down in z order
var sel = false, largestZ = 0;
$('.modal-backdrop').each(function (i) {
console.log('sel each');
var thisZ = parseInt($(this).css('zIndex'));
if (thisZ > largestZ && $(this).attr('for-modal-id') !== $(element).attr('id')) {
largestZ = thisZ;
sel = i;
}
});
if (sel !== false) {
$('.modal-backdrop:eq(' + sel + ')').removeClass('out').addClass('in');
}
});
// AFTER modal hide animation
$(element).on('hidden.bs.modal', function () {
// reset z-index of modal to normal
$(element).css('zIndex', 1040);
// fix scrolling by re-adding .modal-open to body
if ($('.modal:visible').length > 0) {
$('body').addClass('modal-open');
}
});
}
};
});