summaryrefslogtreecommitdiffstatshomepage
path: root/core/modules/toolbar/js
diff options
context:
space:
mode:
Diffstat (limited to 'core/modules/toolbar/js')
-rw-r--r--core/modules/toolbar/js/escapeAdmin.js1
-rw-r--r--core/modules/toolbar/js/models/ToolbarModel.js11
-rw-r--r--core/modules/toolbar/js/toolbar.js37
-rw-r--r--core/modules/toolbar/js/toolbar.menu.js24
-rw-r--r--core/modules/toolbar/js/views/MenuVisualView.js3
-rw-r--r--core/modules/toolbar/js/views/ToolbarAuralView.js10
-rw-r--r--core/modules/toolbar/js/views/ToolbarVisualView.js53
7 files changed, 49 insertions, 90 deletions
diff --git a/core/modules/toolbar/js/escapeAdmin.js b/core/modules/toolbar/js/escapeAdmin.js
index b462be38f5ab..0c469c2a43ad 100644
--- a/core/modules/toolbar/js/escapeAdmin.js
+++ b/core/modules/toolbar/js/escapeAdmin.js
@@ -17,6 +17,7 @@
Drupal.behaviors.escapeAdmin = {
attach: function attach() {
var $toolbarEscape = $('[data-toolbar-escape-admin]').once('escapeAdmin');
+
if ($toolbarEscape.length && pathInfo.currentPathIsAdmin) {
if (escapeAdminPath !== null) {
$toolbarEscape.attr('href', escapeAdminPath);
diff --git a/core/modules/toolbar/js/models/ToolbarModel.js b/core/modules/toolbar/js/models/ToolbarModel.js
index 30ca577fbbbd..8bf91dafa26f 100644
--- a/core/modules/toolbar/js/models/ToolbarModel.js
+++ b/core/modules/toolbar/js/models/ToolbarModel.js
@@ -9,25 +9,15 @@
Drupal.toolbar.ToolbarModel = Backbone.Model.extend({
defaults: {
activeTab: null,
-
activeTray: null,
-
isOriented: false,
-
isFixed: false,
-
areSubtreesLoaded: false,
-
isViewportOverflowConstrained: false,
-
orientation: 'horizontal',
-
locked: false,
-
isTrayToggleVisible: true,
-
height: null,
-
offsets: {
top: 0,
right: 0,
@@ -35,7 +25,6 @@
left: 0
}
},
-
validate: function validate(attributes, options) {
if (attributes.orientation === 'horizontal' && this.get('locked') && !options.override) {
return Drupal.t('The toolbar cannot be set to a horizontal orientation when it is locked.');
diff --git a/core/modules/toolbar/js/toolbar.js b/core/modules/toolbar/js/toolbar.js
index f705a9b0153c..faf546e4e03e 100644
--- a/core/modules/toolbar/js/toolbar.js
+++ b/core/modules/toolbar/js/toolbar.js
@@ -18,7 +18,6 @@
vertical: Drupal.t('Vertical orientation')
}
});
-
Drupal.behaviors.toolbar = {
attach: function attach(context) {
if (!window.matchMedia('only screen').matches) {
@@ -31,19 +30,14 @@
activeTab: document.getElementById(JSON.parse(localStorage.getItem('Drupal.toolbar.activeTabID'))),
height: $('#toolbar-administration').outerHeight()
});
-
Drupal.toolbar.models.toolbarModel = model;
-
Object.keys(options.breakpoints).forEach(function (label) {
var mq = options.breakpoints[label];
var mql = window.matchMedia(mq);
Drupal.toolbar.mql[label] = mql;
-
mql.addListener(Drupal.toolbar.mediaQueryChangeHandler.bind(null, model, label));
-
Drupal.toolbar.mediaQueryChangeHandler.call(null, model, label, mql);
});
-
Drupal.toolbar.views.toolbarVisualView = new Drupal.toolbar.ToolbarVisualView({
el: this,
model: model,
@@ -58,10 +52,8 @@
el: this,
model: model
});
-
model.trigger('change:isFixed', model, model.get('isFixed'));
model.trigger('change:activeTray', model, model.get('activeTray'));
-
var menuModel = new Drupal.toolbar.MenuModel();
Drupal.toolbar.models.menuModel = menuModel;
Drupal.toolbar.views.menuVisualView = new Drupal.toolbar.MenuVisualView({
@@ -69,21 +61,16 @@
model: menuModel,
strings: options.strings
});
-
Drupal.toolbar.setSubtrees.done(function (subtrees) {
menuModel.set('subtrees', subtrees);
var theme = drupalSettings.ajaxPageState.theme;
- localStorage.setItem('Drupal.toolbar.subtrees.' + theme, JSON.stringify(subtrees));
-
+ localStorage.setItem("Drupal.toolbar.subtrees.".concat(theme), JSON.stringify(subtrees));
model.set('areSubtreesLoaded', true);
});
-
Drupal.toolbar.views.toolbarVisualView.loadSubtrees();
-
$(document).on('drupalViewportOffsetChange.toolbar', function (event, offsets) {
model.set('offsets', offsets);
});
-
model.on('change:orientation', function (model, orientation) {
$(document).trigger('drupalToolbarOrientationChange', orientation);
}).on('change:activeTab', function (model, tab) {
@@ -105,11 +92,10 @@
if (settings.drupalOffCanvasPosition === 'top') {
var height = Drupal.offCanvas.getContainer($element).outerHeight();
- $toolbar.css('margin-top', height + 'px');
-
+ $toolbar.css('margin-top', "".concat(height, "px"));
$element.on('dialogContentResize.off-canvas', function () {
var newHeight = Drupal.offCanvas.getContainer($element).outerHeight();
- $toolbar.css('margin-top', newHeight + 'px');
+ $toolbar.css('margin-top', "".concat(newHeight, "px"));
});
}
},
@@ -120,16 +106,11 @@
});
}
};
-
Drupal.toolbar = {
views: {},
-
models: {},
-
mql: {},
-
setSubtrees: new $.Deferred(),
-
mediaQueryChangeHandler: function mediaQueryChangeHandler(model, label, mql) {
switch (label) {
case 'toolbar.narrow':
@@ -139,8 +120,13 @@
});
if (!mql.matches || !model.get('orientation')) {
- model.set({ orientation: 'vertical' }, { validate: true });
+ model.set({
+ orientation: 'vertical'
+ }, {
+ validate: true
+ });
}
+
break;
case 'toolbar.standard':
@@ -152,8 +138,9 @@
case 'toolbar.wide':
model.set({
orientation: mql.matches && !model.get('locked') ? 'horizontal' : 'vertical'
- }, { validate: true });
-
+ }, {
+ validate: true
+ });
model.set({
isTrayToggleVisible: mql.matches
});
diff --git a/core/modules/toolbar/js/toolbar.menu.js b/core/modules/toolbar/js/toolbar.menu.js
index 5f7345d8d4e8..1a9ee5532287 100644
--- a/core/modules/toolbar/js/toolbar.menu.js
+++ b/core/modules/toolbar/js/toolbar.menu.js
@@ -17,20 +17,15 @@
function toggleList($item, switcher) {
var $toggle = $item.children('.toolbar-box').children('.toolbar-handle');
switcher = typeof switcher !== 'undefined' ? switcher : !$item.hasClass('open');
-
$item.toggleClass('open', switcher);
-
$toggle.toggleClass('open', switcher);
-
$toggle.find('.action').text(switcher ? ui.handleClose : ui.handleOpen);
}
function toggleClickHandler(event) {
var $toggle = $(event.target);
var $item = $toggle.closest('li');
-
toggleList($item);
-
var $openItems = $item.siblings().filter('.open');
toggleList($openItems, false);
}
@@ -45,15 +40,14 @@
function initItems($menu) {
var options = {
- class: 'toolbar-icon toolbar-handle',
+ "class": 'toolbar-icon toolbar-handle',
action: ui.handleOpen,
text: ''
};
-
$menu.find('li > a').wrap('<div class="toolbar-box">');
-
$menu.find('li').each(function (index, element) {
var $item = $(element);
+
if ($item.children('ul.toolbar-menu').length) {
var $box = $item.children('.toolbar-box');
options.text = Drupal.t('@label', {
@@ -66,20 +60,23 @@
function markListLevels($lists, level) {
level = !level ? 1 : level;
- var $lis = $lists.children('li').addClass('level-' + level);
+ var $lis = $lists.children('li').addClass("level-".concat(level));
$lists = $lis.children('ul');
+
if ($lists.length) {
markListLevels($lists, level + 1);
}
}
function openActiveItem($menu) {
- var pathItem = $menu.find('a[href="' + window.location.pathname + '"]');
+ var pathItem = $menu.find("a[href=\"".concat(window.location.pathname, "\"]"));
+
if (pathItem.length && !activeItem) {
activeItem = window.location.pathname;
}
+
if (activeItem) {
- var $activeItem = $menu.find('a[href="' + activeItem + '"]').addClass('menu-item--active');
+ var $activeItem = $menu.find("a[href=\"".concat(activeItem, "\"]")).addClass('menu-item--active');
var $activeTrail = $activeItem.parentsUntil('.root', 'li').addClass('menu-item--active-trail');
toggleList($activeTrail, true);
}
@@ -87,19 +84,18 @@
return this.each(function (selector) {
var $menu = $(this).once('toolbar-menu');
+
if ($menu.length) {
$menu.on('click.toolbar', '.toolbar-box', toggleClickHandler).on('click.toolbar', '.toolbar-box a', linkClickHandler);
-
$menu.addClass('root');
initItems($menu);
markListLevels($menu);
-
openActiveItem($menu);
}
});
};
Drupal.theme.toolbarMenuItemToggle = function (options) {
- return '<button class="' + options.class + '"><span class="action">' + options.action + '</span> <span class="label">' + options.text + '</span></button>';
+ return "<button class=\"".concat(options["class"], "\"><span class=\"action\">").concat(options.action, "</span> <span class=\"label\">").concat(options.text, "</span></button>");
};
})(jQuery, Drupal, drupalSettings); \ No newline at end of file
diff --git a/core/modules/toolbar/js/views/MenuVisualView.js b/core/modules/toolbar/js/views/MenuVisualView.js
index 8156a8b11d9e..a82214c87da7 100644
--- a/core/modules/toolbar/js/views/MenuVisualView.js
+++ b/core/modules/toolbar/js/views/MenuVisualView.js
@@ -14,9 +14,8 @@
var _this = this;
var subtrees = this.model.get('subtrees');
-
Object.keys(subtrees || {}).forEach(function (id) {
- _this.$el.find('#toolbar-link-' + id).once('toolbar-subtrees').after(subtrees[id]);
+ _this.$el.find("#toolbar-link-".concat(id)).once('toolbar-subtrees').after(subtrees[id]);
});
if ('drupalToolbarMenu' in $.fn) {
diff --git a/core/modules/toolbar/js/views/ToolbarAuralView.js b/core/modules/toolbar/js/views/ToolbarAuralView.js
index 6096d4170fdb..fae40f334b9c 100644
--- a/core/modules/toolbar/js/views/ToolbarAuralView.js
+++ b/core/modules/toolbar/js/views/ToolbarAuralView.js
@@ -9,7 +9,6 @@
Drupal.toolbar.ToolbarAuralView = Backbone.View.extend({
initialize: function initialize(options) {
this.strings = options.strings;
-
this.listenTo(this.model, 'change:orientation', this.onOrientationChange);
this.listenTo(this.model, 'change:activeTray', this.onActiveTrayChange);
},
@@ -24,17 +23,22 @@
if (!relevantTray) {
return;
}
+
var action = tray === null ? Drupal.t('closed') : Drupal.t('opened');
var trayNameElement = relevantTray.querySelector('.toolbar-tray-name');
- var text = void 0;
+ var text;
+
if (trayNameElement !== null) {
text = Drupal.t('Tray "@tray" @action.', {
'@tray': trayNameElement.textContent,
'@action': action
});
} else {
- text = Drupal.t('Tray @action.', { '@action': action });
+ text = Drupal.t('Tray @action.', {
+ '@action': action
+ });
}
+
Drupal.announce(text);
}
});
diff --git a/core/modules/toolbar/js/views/ToolbarVisualView.js b/core/modules/toolbar/js/views/ToolbarVisualView.js
index 5b3fb6a32714..70013a04852e 100644
--- a/core/modules/toolbar/js/views/ToolbarVisualView.js
+++ b/core/modules/toolbar/js/views/ToolbarVisualView.js
@@ -22,25 +22,20 @@
},
initialize: function initialize(options) {
this.strings = options.strings;
-
this.listenTo(this.model, 'change:activeTab change:orientation change:isOriented change:isTrayToggleVisible', this.render);
this.listenTo(this.model, 'change:mqMatches', this.onMediaQueryChange);
this.listenTo(this.model, 'change:offsets', this.adjustPlacement);
this.listenTo(this.model, 'change:activeTab change:orientation change:isOriented', this.updateToolbarHeight);
-
this.$el.find('.toolbar-tray .toolbar-lining').append(Drupal.theme('toolbarOrientationToggle'));
-
this.model.trigger('change:activeTab');
},
updateToolbarHeight: function updateToolbarHeight() {
var toolbarTabOuterHeight = $('#toolbar-bar').find('.toolbar-tab').outerHeight() || 0;
var toolbarTrayHorizontalOuterHeight = $('.is-active.toolbar-tray-horizontal').outerHeight() || 0;
this.model.set('height', toolbarTabOuterHeight + toolbarTrayHorizontalOuterHeight);
-
$('body').css({
'padding-top': this.model.get('height')
});
-
this.triggerDisplace();
},
triggerDisplace: function triggerDisplace() {
@@ -52,7 +47,6 @@
this.updateTabs();
this.updateTrayOrientation();
this.updateBarAttributes();
-
$('body').removeClass('toolbar-loading');
if (this.model.changed.orientation === 'vertical' || this.model.changed.activeTab) {
@@ -65,16 +59,13 @@
if (event.currentTarget.hasAttribute('data-toolbar-tray')) {
var activeTab = this.model.get('activeTab');
var clickedTab = event.currentTarget;
-
this.model.set('activeTab', !activeTab || clickedTab !== activeTab ? clickedTab : null);
-
event.preventDefault();
event.stopPropagation();
}
},
onOrientationToggleClick: function onOrientationToggleClick(event) {
var orientation = this.model.get('orientation');
-
var antiOrientation = orientation === 'vertical' ? 'horizontal' : 'vertical';
var locked = antiOrientation === 'vertical';
@@ -91,27 +82,25 @@
validate: true,
override: true
});
-
event.preventDefault();
event.stopPropagation();
},
updateTabs: function updateTabs() {
var $tab = $(this.model.get('activeTab'));
-
$(this.model.previous('activeTab')).removeClass('is-active').prop('aria-pressed', false);
-
$(this.model.previous('activeTray')).removeClass('is-active');
if ($tab.length > 0) {
$tab.addClass('is-active').prop('aria-pressed', true);
var name = $tab.attr('data-toolbar-tray');
-
var id = $tab.get(0).id;
+
if (id) {
localStorage.setItem('Drupal.toolbar.activeTabID', JSON.stringify(id));
}
- var $tray = this.$el.find('[data-toolbar-tray="' + name + '"].toolbar-tray');
+ var $tray = this.$el.find("[data-toolbar-tray=\"".concat(name, "\"].toolbar-tray"));
+
if ($tray.length) {
$tray.addClass('is-active');
this.model.set('activeTray', $tray.get(0));
@@ -125,6 +114,7 @@
},
updateBarAttributes: function updateBarAttributes() {
var isOriented = this.model.get('isOriented');
+
if (isOriented) {
this.$el.find('.toolbar-bar').attr('data-offset-top', '');
} else {
@@ -135,30 +125,23 @@
},
updateTrayOrientation: function updateTrayOrientation() {
var orientation = this.model.get('orientation');
-
var antiOrientation = orientation === 'vertical' ? 'horizontal' : 'vertical';
-
$('body').toggleClass('toolbar-vertical', orientation === 'vertical').toggleClass('toolbar-horizontal', orientation === 'horizontal');
-
var removeClass = antiOrientation === 'horizontal' ? 'toolbar-tray-horizontal' : 'toolbar-tray-vertical';
- var $trays = this.$el.find('.toolbar-tray').removeClass(removeClass).addClass('toolbar-tray-' + orientation);
-
- var iconClass = 'toolbar-icon-toggle-' + orientation;
- var iconAntiClass = 'toolbar-icon-toggle-' + antiOrientation;
+ var $trays = this.$el.find('.toolbar-tray').removeClass(removeClass).addClass("toolbar-tray-".concat(orientation));
+ var iconClass = "toolbar-icon-toggle-".concat(orientation);
+ var iconAntiClass = "toolbar-icon-toggle-".concat(antiOrientation);
var $orientationToggle = this.$el.find('.toolbar-toggle-orientation').toggle(this.model.get('isTrayToggleVisible'));
$orientationToggle.find('button').val(antiOrientation).attr('title', this.strings[antiOrientation]).text(this.strings[antiOrientation]).removeClass(iconClass).addClass(iconAntiClass);
-
var dir = document.documentElement.dir;
var edge = dir === 'rtl' ? 'right' : 'left';
-
$trays.removeAttr('data-offset-left data-offset-right data-offset-top');
-
- $trays.filter('.toolbar-tray-vertical.is-active').attr('data-offset-' + edge, '');
-
+ $trays.filter('.toolbar-tray-vertical.is-active').attr("data-offset-".concat(edge), '');
$trays.filter('.toolbar-tray-horizontal.is-active').attr('data-offset-top', '');
},
adjustPlacement: function adjustPlacement() {
var $trays = this.$el.find('.toolbar-tray');
+
if (!this.model.get('isOriented')) {
$trays.removeClass('toolbar-tray-horizontal').addClass('toolbar-tray-vertical');
}
@@ -170,20 +153,20 @@
if (!this.model.get('areSubtreesLoaded') && typeof $activeTab.data('drupal-subtrees') !== 'undefined' && orientation === 'vertical') {
var subtreesHash = drupalSettings.toolbar.subtreesHash;
var theme = drupalSettings.ajaxPageState.theme;
- var endpoint = Drupal.url('toolbar/subtrees/' + subtreesHash);
- var cachedSubtreesHash = localStorage.getItem('Drupal.toolbar.subtreesHash.' + theme);
- var cachedSubtrees = JSON.parse(localStorage.getItem('Drupal.toolbar.subtrees.' + theme));
+ var endpoint = Drupal.url("toolbar/subtrees/".concat(subtreesHash));
+ var cachedSubtreesHash = localStorage.getItem("Drupal.toolbar.subtreesHash.".concat(theme));
+ var cachedSubtrees = JSON.parse(localStorage.getItem("Drupal.toolbar.subtrees.".concat(theme)));
var isVertical = this.model.get('orientation') === 'vertical';
if (isVertical && subtreesHash === cachedSubtreesHash && cachedSubtrees) {
Drupal.toolbar.setSubtrees.resolve(cachedSubtrees);
} else if (isVertical) {
- localStorage.removeItem('Drupal.toolbar.subtreesHash.' + theme);
- localStorage.removeItem('Drupal.toolbar.subtrees.' + theme);
-
- Drupal.ajax({ url: endpoint }).execute();
-
- localStorage.setItem('Drupal.toolbar.subtreesHash.' + theme, subtreesHash);
+ localStorage.removeItem("Drupal.toolbar.subtreesHash.".concat(theme));
+ localStorage.removeItem("Drupal.toolbar.subtrees.".concat(theme));
+ Drupal.ajax({
+ url: endpoint
+ }).execute();
+ localStorage.setItem("Drupal.toolbar.subtreesHash.".concat(theme), subtreesHash);
}
}
}
generated by cgit v1.2.3 (git 2.39.1) at 2025-05-05 15:44:17 +0000