* Handles AJAX fetching of views, including filter submission and response.
*/
-(function ($, Drupal, drupalSettings) {
+(function($, Drupal, drupalSettings) {
/**
* Attaches the AJAX behavior to exposed filters forms and key View links.
*
* Attaches ajaxView functionality to relevant elements.
*/
Drupal.behaviors.ViewsAjaxView = {};
- Drupal.behaviors.ViewsAjaxView.attach = function () {
- if (drupalSettings && drupalSettings.views && drupalSettings.views.ajaxViews) {
- const ajaxViews = drupalSettings.views.ajaxViews;
- Object.keys(ajaxViews || {}).forEach((i) => {
+ Drupal.behaviors.ViewsAjaxView.attach = function(context, settings) {
+ if (settings && settings.views && settings.views.ajaxViews) {
+ const {
+ views: { ajaxViews },
+ } = settings;
+ Object.keys(ajaxViews || {}).forEach(i => {
Drupal.views.instances[i] = new Drupal.views.ajaxView(ajaxViews[i]);
});
}
};
+ Drupal.behaviors.ViewsAjaxView.detach = (context, settings, trigger) => {
+ if (trigger === 'unload') {
+ if (settings && settings.views && settings.views.ajaxViews) {
+ const {
+ views: { ajaxViews },
+ } = settings;
+ Object.keys(ajaxViews || {}).forEach(i => {
+ const selector = `.js-view-dom-id-${ajaxViews[i].view_dom_id}`;
+ if ($(selector, context).length) {
+ delete Drupal.views.instances[i];
+ delete settings.views.ajaxViews[i];
+ }
+ });
+ }
+ }
+ };
/**
* @namespace
* @param {string} settings.view_dom_id
* The DOM id of the view.
*/
- Drupal.views.ajaxView = function (settings) {
+ Drupal.views.ajaxView = function(settings) {
const selector = `.js-view-dom-id-${settings.view_dom_id}`;
this.$view = $(selector);
let queryString = window.location.search || '';
if (queryString !== '') {
// Remove the question mark and Drupal path component if any.
- queryString = queryString.slice(1).replace(/q=[^&]+&?|&?render=[^&]+/, '');
+ queryString = queryString
+ .slice(1)
+ .replace(/q=[^&]+&?|&?render=[^&]+/, '');
if (queryString !== '') {
// If there is a '?' in ajaxPath, clean url are on and & should be
// used to add parameters.
- queryString = ((/\?/.test(ajaxPath)) ? '&' : '?') + queryString;
+ queryString = (/\?/.test(ajaxPath) ? '&' : '?') + queryString;
}
}
this.settings = settings;
// Add the ajax to exposed forms.
- this.$exposed_form = $(`form#views-exposed-form-${settings.view_name.replace(/_/g, '-')}-${settings.view_display_id.replace(/_/g, '-')}`);
- this.$exposed_form.once('exposed-form').each($.proxy(this.attachExposedFormAjax, this));
+ this.$exposed_form = $(
+ `form#views-exposed-form-${settings.view_name.replace(
+ /_/g,
+ '-',
+ )}-${settings.view_display_id.replace(/_/g, '-')}`,
+ );
+ this.$exposed_form
+ .once('exposed-form')
+ .each($.proxy(this.attachExposedFormAjax, this));
// Add the ajax to pagers.
this.$view
// Don't attach to nested views. Doing so would attach multiple behaviors
// to a given element.
.filter($.proxy(this.filterNestedViews, this))
- .once('ajax-pager').each($.proxy(this.attachPagerAjax, this));
+ .once('ajax-pager')
+ .each($.proxy(this.attachPagerAjax, this));
// Add a trigger to update this view specifically. In order to trigger a
// refresh use the following code.
/**
* @method
*/
- Drupal.views.ajaxView.prototype.attachExposedFormAjax = function () {
+ Drupal.views.ajaxView.prototype.attachExposedFormAjax = function() {
const that = this;
this.exposedFormAjax = [];
// Exclude the reset buttons so no AJAX behaviours are bound. Many things
// break during the form reset phase if using AJAX.
- $('input[type=submit], input[type=image]', this.$exposed_form).not('[data-drupal-selector=edit-reset]').each(function (index) {
- const selfSettings = $.extend({}, that.element_settings, {
- base: $(this).attr('id'),
- element: this,
+ $('input[type=submit], input[type=image]', this.$exposed_form)
+ .not('[data-drupal-selector=edit-reset]')
+ .each(function(index) {
+ const selfSettings = $.extend({}, that.element_settings, {
+ base: $(this).attr('id'),
+ element: this,
+ });
+ that.exposedFormAjax[index] = Drupal.ajax(selfSettings);
});
- that.exposedFormAjax[index] = Drupal.ajax(selfSettings);
- });
};
/**
* @return {bool}
* If there is at least one parent with a view class return false.
*/
- Drupal.views.ajaxView.prototype.filterNestedViews = function () {
+ Drupal.views.ajaxView.prototype.filterNestedViews = function() {
// If there is at least one parent with a view class, this view
// is nested (e.g., an attachment). Bail.
return !this.$view.parents('.view').length;
/**
* Attach the ajax behavior to each link.
*/
- Drupal.views.ajaxView.prototype.attachPagerAjax = function () {
- this.$view.find('ul.js-pager__items > li > a, th.views-field a, .attachment .views-summary a')
+ Drupal.views.ajaxView.prototype.attachPagerAjax = function() {
+ this.$view
+ .find(
+ 'ul.js-pager__items > li > a, th.views-field a, .attachment .views-summary a',
+ )
.each($.proxy(this.attachPagerLinkAjax, this));
};
* @param {HTMLElement} link
* The link element.
*/
- Drupal.views.ajaxView.prototype.attachPagerLinkAjax = function (id, link) {
+ Drupal.views.ajaxView.prototype.attachPagerLinkAjax = function(id, link) {
const $link = $(link);
const viewData = {};
const href = $link.attr('href');
* @param {string} response.selector
* Selector to use.
*/
- Drupal.AjaxCommands.prototype.viewsScrollTop = function (ajax, response) {
+ 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.
}
// Only scroll upward.
if (offset.top - 10 < $(scrollTarget).scrollTop()) {
- $(scrollTarget).animate({ scrollTop: (offset.top - 10) }, 500);
+ $(scrollTarget).animate({ scrollTop: offset.top - 10 }, 500);
}
};
-}(jQuery, Drupal, drupalSettings));
+})(jQuery, Drupal, drupalSettings);
projects / yaffs-website / blobdiff