toolbar.js 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
  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. });
  85. }
  86. };
  87. Drupal.toolbar = {
  88. views: {},
  89. models: {},
  90. mql: {},
  91. setSubtrees: new $.Deferred(),
  92. mediaQueryChangeHandler: function mediaQueryChangeHandler(model, label, mql) {
  93. switch (label) {
  94. case 'toolbar.narrow':
  95. model.set({
  96. isOriented: mql.matches,
  97. isTrayToggleVisible: false
  98. });
  99. if (!mql.matches || !model.get('orientation')) {
  100. model.set({ orientation: 'vertical' }, { validate: true });
  101. }
  102. break;
  103. case 'toolbar.standard':
  104. model.set({
  105. isFixed: mql.matches
  106. });
  107. break;
  108. case 'toolbar.wide':
  109. model.set({
  110. orientation: mql.matches && !model.get('locked') ? 'horizontal' : 'vertical'
  111. }, { validate: true });
  112. model.set({
  113. isTrayToggleVisible: mql.matches
  114. });
  115. break;
  116. default:
  117. break;
  118. }
  119. }
  120. };
  121. Drupal.theme.toolbarOrientationToggle = function () {
  122. return '<div class="toolbar-toggle-orientation"><div class="toolbar-lining">' + '<button class="toolbar-icon" type="button"></button>' + '</div></div>';
  123. };
  124. Drupal.AjaxCommands.prototype.setToolbarSubtrees = function (ajax, response, status) {
  125. Drupal.toolbar.setSubtrees.resolve(response.subtrees);
  126. };
  127. })(jQuery, Drupal, drupalSettings);