Permalink
Browse files

Add preventBodyShift option

Closes #114
  • Loading branch information...
1 parent 1199659 commit 89fa9690769edca5da65b12c34557ff0370cdf6a @MohammadYounes committed Jul 30, 2016
Showing with 71 additions and 41 deletions.
  1. +1 −1 src/js/dialog/dialog.js
  2. +50 −30 src/js/dialog/intro.js
  3. +11 −10 src/js/intro.js
  4. +9 −0 src/less/alertify.less
@@ -352,7 +352,7 @@
// allow custom `onclose` method
dispatchEvent('onclose', this);
- //remove from open dialogs
+ //remove from open dialogs
openDialogs.splice(openDialogs.indexOf(this),1);
this.__internal.isOpen = false;
@@ -28,32 +28,32 @@
},
//common class names
classes = {
+ animationIn: 'ajs-in',
+ animationOut: 'ajs-out',
base: 'alertify',
- prefix: 'ajs-',
+ basic:'ajs-basic',
+ capture: 'ajs-capture',
+ closable:'ajs-closable',
+ fixed: 'ajs-fixed',
+ frameless:'ajs-frameless',
hidden: 'ajs-hidden',
+ maximize: 'ajs-maximize',
+ maximized: 'ajs-maximized',
+ maximizable:'ajs-maximizable',
+ modeless: 'ajs-modeless',
+ movable: 'ajs-movable',
noSelection: 'ajs-no-selection',
noOverflow: 'ajs-no-overflow',
noPadding:'ajs-no-padding',
- modeless: 'ajs-modeless',
- movable: 'ajs-movable',
+ pin:'ajs-pin',
+ pinnable:'ajs-pinnable',
+ prefix: 'ajs-',
resizable: 'ajs-resizable',
- capture: 'ajs-capture',
- fixed: 'ajs-fixed',
- closable:'ajs-closable',
- maximizable:'ajs-maximizable',
- maximize: 'ajs-maximize',
restore: 'ajs-restore',
- pinnable:'ajs-pinnable',
- unpinned:'ajs-unpinned',
- pin:'ajs-pin',
- maximized: 'ajs-maximized',
- animationIn: 'ajs-in',
- animationOut: 'ajs-out',
shake:'ajs-shake',
- basic:'ajs-basic',
- frameless:'ajs-frameless'
+ unpinned:'ajs-unpinned',
};
-
+
/**
* Helper: initializes the dialog instance
*
@@ -176,19 +176,18 @@
transitionOutHandler:undefined,
destroy:undefined
};
-
-
+
var elements = {};
//root node
elements.root = document.createElement('div');
elements.root.className = classes.base + ' ' + classes.hidden + ' ';
-
+
elements.root.innerHTML = templates.dimmer + templates.modal;
//dimmer
elements.dimmer = elements.root.firstChild;
-
+
//dialog
elements.modal = elements.root.lastChild;
elements.modal.innerHTML = templates.dialog;
@@ -318,14 +317,36 @@
requiresNoOverflow+=1;
}
}
- if(requiresNoOverflow === 0){
+ if(requiresNoOverflow === 0 && document.body.className.indexOf(classes.noOverflow) >= 0){
//last open modal or last maximized one
removeClass(document.body, classes.noOverflow);
+ preventBodyShift(false);
}else if(requiresNoOverflow > 0 && document.body.className.indexOf(classes.noOverflow) < 0){
//first open modal or first maximized one
+ preventBodyShift(true);
addClass(document.body, classes.noOverflow);
}
}
+ var top = '', topScroll = 0;
+ /**
+ * Helper: prevents body shift.
+ *
+ */
+ function preventBodyShift(add){
+ if(alertify.defaults.preventBodyShift && document.documentElement.scrollHeight > document.documentElement.clientHeight){
+ if(add ){//&& openDialogs[openDialogs.length-1].elements.dialog.clientHeight <= document.documentElement.clientHeight){
+ topScroll = scrollY;
+ top = window.getComputedStyle(document.body).top;
+ addClass(document.body, classes.fixed);
+ document.body.style.top = -scrollY + 'px';
+ } else {
+ scrollY = topScroll;
+ document.body.style.top = top;
+ removeClass(document.body, classes.fixed);
+ restoreScrollPosition();
+ }
+ }
+ }
/**
* Sets the name of the transition used to show/hide the dialog
@@ -353,27 +374,27 @@
//make modal
removeClass(instance.elements.root, classes.modeless);
-
+
//only if open
if(instance.isOpen()){
unbindModelessEvents(instance);
-
+
//in case a pinned modless dialog was made modal while open.
updateAbsPositionFix(instance);
-
+
ensureNoOverflow();
}
}else{
//make modelss
addClass(instance.elements.root, classes.modeless);
-
+
//only if open
if(instance.isOpen()){
bindModelessEvents(instance);
-
+
//in case pin/unpin was called while a modal is open
updateAbsPositionFix(instance);
-
+
ensureNoOverflow();
}
}
@@ -575,7 +596,7 @@
callback.call(instance,key, old, value);
}
result.items.push({'key': key, 'value': value , 'found':true});
-
+
}else{
result.items.push({'key': key, 'value': value , 'found':false});
}
@@ -586,4 +607,3 @@
}
return result;
}
-
View
@@ -18,23 +18,24 @@
* @type {Object}
*/
var defaults = {
- modal:true,
+ autoReset:true,
basic:false,
- frameless:false,
- movable:true,
- moveBounded:false,
- resizable:true,
closable:true,
closableByDimmer:true,
+ frameless:false,
+ maintainFocus:true, //global default not per instance, applies to all dialogs
maximizable:true,
- startMaximized:false,
+ modal:true,
+ movable:true,
+ moveBounded:false,
+ overflow:true,
+ padding: true,
pinnable:true,
pinned:true,
- padding: true,
- overflow:true,
- maintainFocus:true,
+ preventBodyShift:false, //global default not per instance, applies to all dialogs
+ resizable:true,
+ startMaximized:false,
transition:'pulse',
- autoReset:true,
notifier:{
delay:5,
position:'bottom-right'
@@ -383,6 +383,15 @@
.no-overflow {
overflow: hidden !important;
outline: none;
+
+ &.fixed {
+ position: fixed;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ overflow-y: scroll!important;
+ }
}
//disables selection
.no-selection, .no-selection * {

0 comments on commit 89fa969

Please sign in to comment.