aleph1.co.uk Git - yaffs-website/blob - web/core/misc/dialog/off-canvas.js

   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
   8 (function ($, Drupal, debounce, displace) {
   9   Drupal.offCanvas = {
  10     position: null,
  11
  12     minimumHeight: 30,
  13
  14     minDisplaceWidth: 768,
  15
  16     $mainCanvasWrapper: $('[data-off-canvas-main-canvas]'),
  17
  18     isOffCanvas: function isOffCanvas($element) {
  19       return $element.is('#drupal-off-canvas');
  20     },
  21     removeOffCanvasEvents: function removeOffCanvasEvents($element) {
  22       $element.off('.off-canvas');
  23       $(document).off('.off-canvas');
  24       $(window).off('.off-canvas');
  25     },
  26     beforeCreate: function beforeCreate(_ref) {
  27       var settings = _ref.settings,
  28           $element = _ref.$element;
  29
  30       Drupal.offCanvas.removeOffCanvasEvents($element);
  31
  32       $('body').addClass('js-off-canvas-dialog-open');
  33
  34       settings.position = {
  35         my: 'left top',
  36         at: Drupal.offCanvas.getEdge() + ' top',
  37         of: window
  38       };
  39
  40       var position = settings.drupalOffCanvasPosition;
  41       var height = position === 'side' ? $(window).height() : settings.height;
  42       var width = position === 'side' ? settings.width : '100%';
  43       settings.height = height;
  44       settings.width = width;
  45     },
  46     beforeClose: function beforeClose(_ref2) {
  47       var $element = _ref2.$element;
  48
  49       $('body').removeClass('js-off-canvas-dialog-open');
  50
  51       Drupal.offCanvas.removeOffCanvasEvents($element);
  52       Drupal.offCanvas.resetPadding();
  53     },
  54     afterCreate: function afterCreate(_ref3) {
  55       var $element = _ref3.$element,
  56           settings = _ref3.settings;
  57
  58       var eventData = { settings: settings, $element: $element, offCanvasDialog: this };
  59
  60       $element.on('dialogContentResize.off-canvas', eventData, Drupal.offCanvas.handleDialogResize).on('dialogContentResize.off-canvas', eventData, Drupal.offCanvas.bodyPadding);
  61
  62       Drupal.offCanvas.getContainer($element).attr('data-offset-' + Drupal.offCanvas.getEdge(), '');
  63
  64       $(window).on('resize.off-canvas', eventData, debounce(Drupal.offCanvas.resetSize, 100)).trigger('resize.off-canvas');
  65     },
  66     render: function render(_ref4) {
  67       var settings = _ref4.settings;
  68
  69       $('.ui-dialog-off-canvas, .ui-dialog-off-canvas .ui-dialog-titlebar').toggleClass('ui-dialog-empty-title', !settings.title);
  70     },
  71     handleDialogResize: function handleDialogResize(event) {
  72       var $element = event.data.$element;
  73       var $container = Drupal.offCanvas.getContainer($element);
  74
  75       var $offsets = $container.find('> :not(#drupal-off-canvas, .ui-resizable-handle)');
  76       var offset = 0;
  77
  78       $element.css({ height: 'auto' });
  79       var modalHeight = $container.height();
  80
  81       $offsets.each(function (i, e) {
  82         offset += $(e).outerHeight();
  83       });
  84
  85       var scrollOffset = $element.outerHeight() - $element.height();
  86       $element.height(modalHeight - offset - scrollOffset);
  87     },
  88     resetSize: function resetSize(event) {
  89       var $element = event.data.$element;
  90       var container = Drupal.offCanvas.getContainer($element);
  91       var position = event.data.settings.drupalOffCanvasPosition;
  92
  93       if (Drupal.offCanvas.position && Drupal.offCanvas.position !== position) {
  94         container.removeAttr('data-offset-' + Drupal.offCanvas.position);
  95       }
  96
  97       if (position === 'top') {
  98         $element.css('min-height', Drupal.offCanvas.minimumHeight + 'px');
  99       }
 100
 101       displace();
 102
 103       var offsets = displace.offsets;
 104
 105       var topPosition = position === 'side' && offsets.top !== 0 ? '+' + offsets.top : '';
 106       var adjustedOptions = {
 107         position: {
 108           my: Drupal.offCanvas.getEdge() + ' top',
 109           at: Drupal.offCanvas.getEdge() + ' top' + topPosition,
 110           of: window
 111         }
 112       };
 113
 114       var height = position === 'side' ? $(window).height() - (offsets.top + offsets.bottom) + 'px' : event.data.settings.height;
 115       container.css({
 116         position: 'fixed',
 117         height: height
 118       });
 119
 120       $element.dialog('option', adjustedOptions).trigger('dialogContentResize.off-canvas');
 121
 122       Drupal.offCanvas.position = position;
 123     },
 124     bodyPadding: function bodyPadding(event) {
 125       var position = event.data.settings.drupalOffCanvasPosition;
 126       if (position === 'side' && $('body').outerWidth() < Drupal.offCanvas.minDisplaceWidth) {
 127         return;
 128       }
 129       Drupal.offCanvas.resetPadding();
 130       var $element = event.data.$element;
 131       var $container = Drupal.offCanvas.getContainer($element);
 132       var $mainCanvasWrapper = Drupal.offCanvas.$mainCanvasWrapper;
 133
 134       var width = $container.outerWidth();
 135       var mainCanvasPadding = $mainCanvasWrapper.css('padding-' + Drupal.offCanvas.getEdge());
 136       if (position === 'side' && width !== mainCanvasPadding) {
 137         $mainCanvasWrapper.css('padding-' + Drupal.offCanvas.getEdge(), width + 'px');
 138         $container.attr('data-offset-' + Drupal.offCanvas.getEdge(), width);
 139         displace();
 140       }
 141
 142       var height = $container.outerHeight();
 143       if (position === 'top') {
 144         $mainCanvasWrapper.css('padding-top', height + 'px');
 145         $container.attr('data-offset-top', height);
 146         displace();
 147       }
 148     },
 149     getContainer: function getContainer($element) {
 150       return $element.dialog('widget');
 151     },
 152     getEdge: function getEdge() {
 153       return document.documentElement.dir === 'rtl' ? 'left' : 'right';
 154     },
 155     resetPadding: function resetPadding() {
 156       Drupal.offCanvas.$mainCanvasWrapper.css('padding-' + Drupal.offCanvas.getEdge(), 0);
 157       Drupal.offCanvas.$mainCanvasWrapper.css('padding-top', 0);
 158       displace();
 159     }
 160   };
 161
 162   Drupal.behaviors.offCanvasEvents = {
 163     attach: function attach() {
 164       $(window).once('off-canvas').on({
 165         'dialog:beforecreate': function dialogBeforecreate(event, dialog, $element, settings) {
 166           if (Drupal.offCanvas.isOffCanvas($element)) {
 167             Drupal.offCanvas.beforeCreate({ dialog: dialog, $element: $element, settings: settings });
 168           }
 169         },
 170         'dialog:aftercreate': function dialogAftercreate(event, dialog, $element, settings) {
 171           if (Drupal.offCanvas.isOffCanvas($element)) {
 172             Drupal.offCanvas.render({ dialog: dialog, $element: $element, settings: settings });
 173             Drupal.offCanvas.afterCreate({ $element: $element, settings: settings });
 174           }
 175         },
 176         'dialog:beforeclose': function dialogBeforeclose(event, dialog, $element) {
 177           if (Drupal.offCanvas.isOffCanvas($element)) {
 178             Drupal.offCanvas.beforeClose({ dialog: dialog, $element: $element });
 179           }
 180         }
 181       });
 182     }
 183   };
 184 })(jQuery, Drupal, Drupal.debounce, Drupal.displace);