Skip to content

Commit f49b466

Browse files
Semantic-Pusher-RobotSemantic-Pusher-Robot
committed
Updated component to version 2.2.12
1 parent 59518f4 commit f49b466

8 files changed

+68
-25
lines changed

‎RELEASE-NOTES.md

+5
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,8 @@
1+
### Version 2.2.12 - Aug 07, 2017
2+
3+
- **Modal** - Modal will now take into account absolutely positioned elements inside a modal when determining if scrolling is necessary. [#5578](https://github.com/Semantic-Org/Semantic-UI/issues/5578) **Thanks @lulalala**
4+
- **Modal** - Fixes issue where init order matters when multiple modals are shown at same time and `allowMultiple: true` is used [#5559](https://github.com/Semantic-Org/Semantic-UI/issues/5559)
5+
16
### Version 2.2.11 - July 11, 2017
27

38
- **Modal** - Using multiple modals with different `inverted` `blurring` or `closable` settings will now function normally in all cases [#4368](https://github.com/Semantic-Org/Semantic-UI/issues/4368)

‎composer.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -15,5 +15,5 @@
1515
"framework"
1616
],
1717
"license": "MIT",
18-
"version": "2.2.11"
18+
"version": "2.2.12"
1919
}

‎index.js

+26-5
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*!
2-
* # Semantic UI 2.2.11 - Modal
2+
* # Semantic UI 2.2.12 - Modal
33
* http://github.com/semantic-org/semantic-ui/
44
*
55
*
@@ -330,6 +330,9 @@ module.exports = function(parameters) {
330330
module.hideOthers(module.showModal);
331331
}
332332
else {
333+
if(settings.allowMultiple && settings.detachable) {
334+
$module.detach().appendTo($dimmer);
335+
}
333336
settings.onShow.call(element);
334337
if(settings.transition && $.fn.transition !== undefined && $module.transition('is supported')) {
335338
module.debug('Showing modal with css animations');
@@ -533,24 +536,41 @@ module.exports = function(parameters) {
533536
},
534537

535538
cacheSizes: function() {
539+
$module.addClass(className.loading);
536540
var
537-
modalHeight = $module.outerHeight()
541+
scrollHeight = $module.prop('scrollHeight'),
542+
modalHeight = $module.outerHeight()
538543
;
539544
if(module.cache === undefined || modalHeight !== 0) {
540545
module.cache = {
541546
pageHeight : $(document).outerHeight(),
542547
height : modalHeight + settings.offset,
548+
scrollHeight : scrollHeight + settings.offset,
543549
contextHeight : (settings.context == 'body')
544550
? $(window).height()
545-
: $dimmable.height()
551+
: $dimmable.height(),
546552
};
553+
module.cache.topOffset = -(module.cache.height / 2);
547554
}
555+
$module.removeClass(className.loading);
548556
module.debug('Caching modal and container sizes', module.cache);
549557
},
550558

551559
can: {
552560
fit: function() {
553-
return ( ( module.cache.height + (settings.padding * 2) ) < module.cache.contextHeight);
561+
var
562+
contextHeight = module.cache.contextHeight,
563+
verticalCenter = module.cache.contextHeight / 2,
564+
topOffset = module.cache.topOffset,
565+
scrollHeight = module.cache.scrollHeight,
566+
height = module.cache.height,
567+
paddingHeight = settings.padding,
568+
startPosition = (verticalCenter + topOffset)
569+
;
570+
return (scrollHeight > height)
571+
? (startPosition + scrollHeight + paddingHeight < contextHeight)
572+
: (height + (paddingHeight * 2) < contextHeight)
573+
;
554574
}
555575
},
556576

@@ -665,7 +685,7 @@ module.exports = function(parameters) {
665685
$module
666686
.css({
667687
top: '',
668-
marginTop: -(module.cache.height / 2)
688+
marginTop: module.cache.topOffset
669689
})
670690
;
671691
}
@@ -938,6 +958,7 @@ _module.exports.settings = {
938958
animating : 'animating',
939959
blurring : 'blurring',
940960
inverted : 'inverted',
961+
loading : 'loading',
941962
scrolling : 'scrolling',
942963
undetached : 'undetached'
943964
}

‎modal.css

+6-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*!
2-
* # Semantic UI 2.2.11 - Modal
2+
* # Semantic UI 2.2.12 - Modal
33
* http://github.com/semantic-org/semantic-ui/
44
*
55
*
@@ -332,6 +332,11 @@
332332
States
333333
*******************************/
334334

335+
.ui.loading.modal {
336+
display: block;
337+
visibility: hidden;
338+
z-index: -1;
339+
}
335340
.ui.active.modal {
336341
display: block;
337342
}

‎modal.js

+26-5
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*!
2-
* # Semantic UI 2.2.11 - Modal
2+
* # Semantic UI 2.2.12 - Modal
33
* http://github.com/semantic-org/semantic-ui/
44
*
55
*
@@ -329,6 +329,9 @@ $.fn.modal = function(parameters) {
329329
module.hideOthers(module.showModal);
330330
}
331331
else {
332+
if(settings.allowMultiple && settings.detachable) {
333+
$module.detach().appendTo($dimmer);
334+
}
332335
settings.onShow.call(element);
333336
if(settings.transition && $.fn.transition !== undefined && $module.transition('is supported')) {
334337
module.debug('Showing modal with css animations');
@@ -532,24 +535,41 @@ $.fn.modal = function(parameters) {
532535
},
533536

534537
cacheSizes: function() {
538+
$module.addClass(className.loading);
535539
var
536-
modalHeight = $module.outerHeight()
540+
scrollHeight = $module.prop('scrollHeight'),
541+
modalHeight = $module.outerHeight()
537542
;
538543
if(module.cache === undefined || modalHeight !== 0) {
539544
module.cache = {
540545
pageHeight : $(document).outerHeight(),
541546
height : modalHeight + settings.offset,
547+
scrollHeight : scrollHeight + settings.offset,
542548
contextHeight : (settings.context == 'body')
543549
? $(window).height()
544-
: $dimmable.height()
550+
: $dimmable.height(),
545551
};
552+
module.cache.topOffset = -(module.cache.height / 2);
546553
}
554+
$module.removeClass(className.loading);
547555
module.debug('Caching modal and container sizes', module.cache);
548556
},
549557

550558
can: {
551559
fit: function() {
552-
return ( ( module.cache.height + (settings.padding * 2) ) < module.cache.contextHeight);
560+
var
561+
contextHeight = module.cache.contextHeight,
562+
verticalCenter = module.cache.contextHeight / 2,
563+
topOffset = module.cache.topOffset,
564+
scrollHeight = module.cache.scrollHeight,
565+
height = module.cache.height,
566+
paddingHeight = settings.padding,
567+
startPosition = (verticalCenter + topOffset)
568+
;
569+
return (scrollHeight > height)
570+
? (startPosition + scrollHeight + paddingHeight < contextHeight)
571+
: (height + (paddingHeight * 2) < contextHeight)
572+
;
553573
}
554574
},
555575

@@ -664,7 +684,7 @@ $.fn.modal = function(parameters) {
664684
$module
665685
.css({
666686
top: '',
667-
marginTop: -(module.cache.height / 2)
687+
marginTop: module.cache.topOffset
668688
})
669689
;
670690
}
@@ -937,6 +957,7 @@ $.fn.modal.settings = {
937957
animating : 'animating',
938958
blurring : 'blurring',
939959
inverted : 'inverted',
960+
loading : 'loading',
940961
scrolling : 'scrolling',
941962
undetached : 'undetached'
942963
}

0 commit comments

Comments
 (0)