Skip to content
Snippets Groups Projects
Unverified Commit 5030f45e authored by Lauri Timmanee's avatar Lauri Timmanee
Browse files

Issue #3300481 by Murz, smustgrave, catch: Move ScrollTopCommand views Ajax...

Issue #3300481 by Murz, smustgrave, catch: Move ScrollTopCommand views Ajax command to the Drupal Core
parent 7f2f2d10
No related branches found
No related tags found
29 merge requests!12227Issue #3181946 by jonmcl, mglaman,!54479.5.x SF update,!5014Issue #3071143: Table Render Array Example Is Incorrect,!4868Issue #1428520: Improve menu parent link selection,!4289Issue #1344552 by marcingy, Niklas Fiekas, Ravi.J, aleevas, Eduardo Morales...,!4114Issue #2707291: Disable body-level scrolling when a dialog is open as a modal,!4100Issue #3249600: Add support for PHP 8.1 Enums as allowed values for list_* data types,!3630Issue #2815301 by Chi, DanielVeza, kostyashupenko, smustgrave: Allow to create...,!3600Issue #3344629: Passing null to parameter #1 ($haystack) of type string is deprecated,!2378Issue #2875033: Optimize joins and table selection in SQL entity query implementation,!2334Issue #3228209: Add hasRole() method to AccountInterface,!2062Issue #3246454: Add weekly granularity to views date sort,!1591Issue #3199697: Add JSON:API Translation experimental module,!1484Exposed filters get values from URL when Ajax is on,!1255Issue #3238922: Refactor (if feasible) uses of the jQuery serialize function to use vanillaJS,!1162Issue #3100350: Unable to save '/' root path alias,!1105Issue #3025039: New non translatable field on translatable content throws error,!1073issue #3191727: Focus states on mobile second level navigation items fixed,!10223132456: Fix issue where views instances are emptied before an ajax request is complete,!925Issue #2339235: Remove taxonomy hard dependency on node module,!877Issue #2708101: Default value for link text is not saved,!872Draft: Issue #3221319: Race condition when creating menu links and editing content deletes menu links,!844Resolve #3036010 "Updaters",!579Issue #2230909: Simple decimals fail to pass validation,!560Move callback classRemove outside of the loop,!555Issue #3202493,!485Sets the autocomplete attribute for username/password input field on login form.,!213Issue #2906496: Give Media a menu item under Content,!30Issue #3182188: Updates composer usage to point at ./vendor/bin/composer
<?php
namespace Drupal\Core\Ajax;
/**
* Provides an AJAX command for scrolling to the top of an element.
*
* This command is implemented in Drupal.AjaxCommands.prototype.scrollTop.
*/
class ScrollTopCommand implements CommandInterface {
/**
* A CSS selector string.
*
* @var string
*/
protected $selector;
/**
* Constructs a \Drupal\Core\Ajax\ScrollTopCommand object.
*
* @param string $selector
* A CSS selector.
*/
public function __construct($selector) {
$this->selector = $selector;
}
/**
* {@inheritdoc}
*/
public function render(): array {
return [
'command' => 'scrollTop',
'selector' => $this->selector,
];
}
}
......@@ -1748,6 +1748,32 @@
});
});
},
/**
* Command to scroll the page to an html element.
*
* @param {Drupal.Ajax} [ajax]
* A {@link Drupal.ajax} object.
* @param {object} response
* Ajax response.
* @param {string} response.selector
* Selector to use.
*/
scrollTop(ajax, response) {
const offset = $(response.selector).offset();
// We can't guarantee that the scrollable object should be
// the body, as the element could be embedded in something
// more complex such as a modal popup. Recurse up the DOM
// and scroll the first element that has a non-zero top.
let scrollTarget = response.selector;
while ($(scrollTarget).scrollTop() === 0 && $(scrollTarget).parent()) {
scrollTarget = $(scrollTarget).parent();
}
// Only scroll upward.
if (offset.top - 10 < $(scrollTarget).scrollTop()) {
$(scrollTarget).animate({ scrollTop: offset.top - 10 }, 500);
}
},
};
/**
......
......@@ -214,23 +214,13 @@
* Ajax response.
* @param {string} response.selector
* Selector to use.
*
* @deprecated in drupal:10.1.0 and is removed from drupal:11.0.0.
* Use Drupal.AjaxCommands.prototype.scrollTop().
*
* @see https://www.drupal.org/node/3344141
*/
Drupal.AjaxCommands.prototype.viewsScrollTop = function (ajax, response) {
// Scroll to the top of the view. This will allow users
// to browse newly loaded content after e.g. clicking a pager
// link.
const offset = $(response.selector).offset();
// We can't guarantee that the scrollable object should be
// the body, as the view could be embedded in something
// more complex such as a modal popup. Recurse up the DOM
// and scroll the first element that has a non-zero top.
let scrollTarget = response.selector;
while ($(scrollTarget).scrollTop() === 0 && $(scrollTarget).parent()) {
scrollTarget = $(scrollTarget).parent();
}
// Only scroll upward.
if (offset.top - 10 < $(scrollTarget).scrollTop()) {
$(scrollTarget).animate({ scrollTop: offset.top - 10 }, 500);
}
Drupal.AjaxCommands.prototype.scrollTop(ajax, response);
};
})(jQuery, Drupal, drupalSettings);
......@@ -2,40 +2,17 @@
namespace Drupal\views\Ajax;
use Drupal\Core\Ajax\CommandInterface;
use Drupal\Core\Ajax\ScrollTopCommand as CoreScrollTopCommand;
/**
* Provides an AJAX command for scrolling to the top of an element.
*
* This command is implemented in Drupal.AjaxCommands.prototype.viewsScrollTop.
*/
class ScrollTopCommand implements CommandInterface {
/**
* A CSS selector string.
*
* @var string
*/
protected $selector;
/**
* Constructs a \Drupal\views\Ajax\ScrollTopCommand object.
* @deprecated in drupal:10.1.0 and is removed from drupal:11.0.0.
* Use \Drupal\Core\Ajax\ScrollTopCommand
*
* @param string $selector
* A CSS selector.
* @see https://www.drupal.org/node/3344141
*/
public function __construct($selector) {
$this->selector = $selector;
}
/**
* {@inheritdoc}
*/
public function render() {
return [
'command' => 'viewsScrollTop',
'selector' => $this->selector,
];
}
class ScrollTopCommand extends CoreScrollTopCommand {
}
......@@ -15,7 +15,7 @@
use Drupal\Core\Render\RenderContext;
use Drupal\Core\Render\RendererInterface;
use Drupal\Core\Routing\RedirectDestinationInterface;
use Drupal\views\Ajax\ScrollTopCommand;
use Drupal\Core\Ajax\ScrollTopCommand;
use Drupal\views\Ajax\ViewAjaxResponse;
use Drupal\views\ViewExecutableFactory;
use Symfony\Component\DependencyInjection\ContainerInterface;
......
......@@ -343,7 +343,7 @@ public function testAjaxViewWithPager() {
$this->assertInstanceOf(ViewAjaxResponse::class, $response);
$commands = $this->getCommands($response);
$this->assertEquals('viewsScrollTop', $commands[0]['command']);
$this->assertEquals('scrollTop', $commands[0]['command']);
$this->assertEquals('.js-view-dom-id-' . $dom_id, $commands[0]['selector']);
$this->assertViewResultCommand($response, 1);
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment