Commit 2ed3b840 authored by Cottser's avatar Cottser

Issue #2790855 by tedbow, drpal, xjm, tkoleary, tim.plunkett, Wim Leers,...

Issue #2790855 by tedbow, drpal, xjm, tkoleary, tim.plunkett, Wim Leers, Cottser: Rework animation for standard dialog system
parent d32af630
......@@ -80,3 +80,11 @@
box-shadow: 2px 2px #ddd;
}
.offcanvas-lining {
background: #fff;
position: absolute;
top: 0;
height: 100%;
width: 100%;
z-index: -1;
}
......@@ -18,6 +18,8 @@
*/
var edge = document.documentElement.dir === 'rtl' ? 'left' : 'right';
var $mainCanvasWrapper = $('#main-canvas-wrapper');
/**
* Resets the size of the dialog.
*
......@@ -81,12 +83,11 @@
function bodyPadding(event) {
var $element = event.data.$element;
var $widget = $element.dialog('widget');
var $body = $('body');
var width = $widget.outerWidth();
var bodyPadding = $body.css('padding-' + edge);
if (width !== bodyPadding) {
$body.css('padding-' + edge, width + 'px');
var mainCanvasPadding = $mainCanvasWrapper.css('padding-' + edge);
if (width !== mainCanvasPadding) {
$mainCanvasWrapper.css('padding-' + edge, width + 'px');
$widget.attr('data-offset-' + edge, width);
displace();
}
......@@ -125,7 +126,7 @@
if ($element.is('#drupal-offcanvas')) {
$(document).off('.outsidein');
$(window).off('.outsidein');
$('body').css('padding-' + edge, 0);
$mainCanvasWrapper.css('padding-' + edge, 0);
}
}
});
......
......@@ -49,6 +49,8 @@ public function render() {
'settings' => $this->settings,
'data' => $this->getRenderedContent(),
'dialogOptions' => $this->dialogOptions,
'effect' => 'fade',
'speed' => 1000,
];
}
......
......@@ -46,6 +46,8 @@ public function testDialog() {
'draggable' => FALSE,
'drupalAutoButtons' => FALSE,
],
'effect' => 'fade',
'speed' => 1000,
];
// Emulate going to the JS version of the page and check the JSON response.
......
......@@ -18,5 +18,6 @@
{{ children }}
</div>
</div>
<div class="offcanvas-lining"></div>
{% endspaceless %}
{% endif %}
......@@ -31,6 +31,8 @@ public function testRender() {
'draggable' => FALSE,
'drupalAutoButtons' => FALSE,
],
'effect' => 'fade',
'speed' => 1000,
];
$this->assertEquals($expected, $command->render());
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment