toolbar.js 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175
  1. /**
  2. * DO NOT EDIT THIS FILE.
  3. * See the following change record for more information,
  4. * https://www.drupal.org/node/2815083
  5. * @preserve
  6. **/
  7. (function ($, Drupal, drupalSettings) {
  8. var options = $.extend({
  9. breakpoints: {
  10. 'toolbar.narrow': '',
  11. 'toolbar.standard': '',
  12. 'toolbar.wide': ''
  13. }
  14. }, drupalSettings.toolbar, {
  15. strings: {
  16. horizontal: Drupal.t('Horizontal orientation'),
  17. vertical: Drupal.t('Vertical orientation')
  18. }
  19. });
  20. Drupal.behaviors.toolbar = {
  21. attach: function attach(context) {
  22. if (!window.matchMedia('only screen').matches) {
  23. return;
  24. }
  25. $(context).find('#toolbar-administration').once('toolbar').each(function () {
  26. var model = new Drupal.toolbar.ToolbarModel({
  27. locked: JSON.parse(localStorage.getItem('Drupal.toolbar.trayVerticalLocked')),
  28. activeTab: document.getElementById(JSON.parse(localStorage.getItem('Drupal.toolbar.activeTabID'))),
  29. height: $('#toolbar-administration').outerHeight()
  30. });
  31. Drupal.toolbar.models.toolbarModel = model;
  32. Object.keys(options.breakpoints).forEach(function (label) {
  33. var mq = options.breakpoints[label];
  34. var mql = window.matchMedia(mq);
  35. Drupal.toolbar.mql[label] = mql;
  36. mql.addListener(Drupal.toolbar.mediaQueryChangeHandler.bind(null, model, label));
  37. Drupal.toolbar.mediaQueryChangeHandler.call(null, model, label, mql);
  38. });
  39. Drupal.toolbar.views.toolbarVisualView = new Drupal.toolbar.ToolbarVisualView({
  40. el: this,
  41. model: model,
  42. strings: options.strings
  43. });
  44. Drupal.toolbar.views.toolbarAuralView = new Drupal.toolbar.ToolbarAuralView({
  45. el: this,
  46. model: model,
  47. strings: options.strings
  48. });
  49. Drupal.toolbar.views.bodyVisualView = new Drupal.toolbar.BodyVisualView({
  50. el: this,
  51. model: model
  52. });
  53. model.trigger('change:isFixed', model, model.get('isFixed'));
  54. model.trigger('change:activeTray', model, model.get('activeTray'));
  55. var menuModel = new Drupal.toolbar.MenuModel();
  56. Drupal.toolbar.models.menuModel = menuModel;
  57. Drupal.toolbar.views.menuVisualView = new Drupal.toolbar.MenuVisualView({
  58. el: $(this).find('.toolbar-menu-administration').get(0),
  59. model: menuModel,
  60. strings: options.strings
  61. });
  62. Drupal.toolbar.setSubtrees.done(function (subtrees) {
  63. menuModel.set('subtrees', subtrees);
  64. var theme = drupalSettings.ajaxPageState.theme;
  65. localStorage.setItem('Drupal.toolbar.subtrees.' + theme, JSON.stringify(subtrees));
  66. model.set('areSubtreesLoaded', true);
  67. });
  68. Drupal.toolbar.views.toolbarVisualView.loadSubtrees();
  69. $(document).on('drupalViewportOffsetChange.toolbar', function (event, offsets) {
  70. model.set('offsets', offsets);
  71. });
  72. model.on('change:orientation', function (model, orientation) {
  73. $(document).trigger('drupalToolbarOrientationChange', orientation);
  74. }).on('change:activeTab', function (model, tab) {
  75. $(document).trigger('drupalToolbarTabChange', tab);
  76. }).on('change:activeTray', function (model, tray) {
  77. $(document).trigger('drupalToolbarTrayChange', tray);
  78. });
  79. if (Drupal.toolbar.models.toolbarModel.get('orientation') === 'horizontal' && Drupal.toolbar.models.toolbarModel.get('activeTab') === null) {
  80. Drupal.toolbar.models.toolbarModel.set({
  81. activeTab: $('.toolbar-bar .toolbar-tab:not(.home-toolbar-tab) a').get(0)
  82. });
  83. }
  84. $(window).on({
  85. 'dialog:aftercreate': function dialogAftercreate(event, dialog, $element, settings) {
  86. var $toolbar = $('#toolbar-bar');
  87. $toolbar.css('margin-top', '0');
  88. if (settings.drupalOffCanvasPosition === 'top') {
  89. var height = Drupal.offCanvas.getContainer($element).outerHeight();
  90. $toolbar.css('margin-top', height + 'px');
  91. $element.on('dialogContentResize.off-canvas', function () {
  92. var newHeight = Drupal.offCanvas.getContainer($element).outerHeight();
  93. $toolbar.css('margin-top', newHeight + 'px');
  94. });
  95. }
  96. },
  97. 'dialog:beforeclose': function dialogBeforeclose() {
  98. $('#toolbar-bar').css('margin-top', '0');
  99. }
  100. });
  101. });
  102. }
  103. };
  104. Drupal.toolbar = {
  105. views: {},
  106. models: {},
  107. mql: {},
  108. setSubtrees: new $.Deferred(),
  109. mediaQueryChangeHandler: function mediaQueryChangeHandler(model, label, mql) {
  110. switch (label) {
  111. case 'toolbar.narrow':
  112. model.set({
  113. isOriented: mql.matches,
  114. isTrayToggleVisible: false
  115. });
  116. if (!mql.matches || !model.get('orientation')) {
  117. model.set({ orientation: 'vertical' }, { validate: true });
  118. }
  119. break;
  120. case 'toolbar.standard':
  121. model.set({
  122. isFixed: mql.matches
  123. });
  124. break;
  125. case 'toolbar.wide':
  126. model.set({
  127. orientation: mql.matches && !model.get('locked') ? 'horizontal' : 'vertical'
  128. }, { validate: true });
  129. model.set({
  130. isTrayToggleVisible: mql.matches
  131. });
  132. break;
  133. default:
  134. break;
  135. }
  136. }
  137. };
  138. Drupal.theme.toolbarOrientationToggle = function () {
  139. return '<div class="toolbar-toggle-orientation"><div class="toolbar-lining">' + '<button class="toolbar-icon" type="button"></button>' + '</div></div>';
  140. };
  141. Drupal.AjaxCommands.prototype.setToolbarSubtrees = function (ajax, response, status) {
  142. Drupal.toolbar.setSubtrees.resolve(response.subtrees);
  143. };
  144. })(jQuery, Drupal, drupalSettings);