879 lines
30 KiB
JavaScript
879 lines
30 KiB
JavaScript
/**
|
|
* @file
|
|
* Attaches the behaviors for the Overlay parent pages.
|
|
*/
|
|
|
|
(function ($, Drupal, displace) {
|
|
|
|
"use strict";
|
|
|
|
/**
|
|
* Open the overlay, or load content into it, when an admin link is clicked.
|
|
*/
|
|
Drupal.behaviors.overlayParent = {
|
|
attach: function (context, settings) {
|
|
if (this.processed) {
|
|
return;
|
|
}
|
|
this.processed = true;
|
|
|
|
$(window)
|
|
// When the hash (URL fragment) changes, open the overlay if needed.
|
|
.bind('hashchange.drupal-overlay', $.proxy(Drupal.overlay, 'eventhandlerOperateByURLFragment'))
|
|
// Trigger the hashchange handler once, after the page is loaded, so that
|
|
// permalinks open the overlay.
|
|
.triggerHandler('hashchange.drupal-overlay');
|
|
|
|
// Do not use the overlay on devices with low screen width.
|
|
// @todo Replace with conditional loading.
|
|
if(!Drupal.checkWidthBreakpoint()) {
|
|
return;
|
|
}
|
|
|
|
$(document)
|
|
// Instead of binding a click event handler to every link we bind one to
|
|
// the document and only handle events that bubble up. This allows other
|
|
// scripts to bind their own handlers to links and also to prevent
|
|
// overlay's handling.
|
|
.bind('click.drupal-overlay mouseup.drupal-overlay', $.proxy(Drupal.overlay, 'eventhandlerOverrideLink'));
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Overlay object for parent windows.
|
|
*
|
|
* Events
|
|
* Overlay triggers a number of events that can be used by other scripts.
|
|
* - drupalOverlayOpen: This event is triggered when the overlay is opened.
|
|
* - drupalOverlayBeforeClose: This event is triggered when the overlay attempts
|
|
* to close. If an event handler returns false, the close will be prevented.
|
|
* - drupalOverlayClose: This event is triggered when the overlay is closed.
|
|
* - drupalOverlayBeforeLoad: This event is triggered right before a new URL
|
|
* is loaded into the overlay.
|
|
* - drupalOverlayReady: This event is triggered when the DOM of the overlay
|
|
* child document is fully loaded.
|
|
* - drupalOverlayLoad: This event is triggered when the overlay is finished
|
|
* loading.
|
|
* - drupalOverlayResize: This event is triggered when the overlay is being
|
|
* resized to match the parent window.
|
|
*/
|
|
Drupal.overlay = Drupal.overlay || {
|
|
isOpen: false,
|
|
isOpening: false,
|
|
isClosing: false,
|
|
isLoading: false
|
|
};
|
|
|
|
Drupal.overlay.prototype = {};
|
|
|
|
/**
|
|
* Open the overlay.
|
|
*
|
|
* @param url
|
|
* The URL of the page to open in the overlay.
|
|
*
|
|
* @return
|
|
* TRUE if the overlay was opened, FALSE otherwise.
|
|
*/
|
|
Drupal.overlay.open = function (url) {
|
|
// Just one overlay is allowed.
|
|
if (this.isOpen || this.isOpening) {
|
|
return this.load(url);
|
|
}
|
|
this.isOpening = true;
|
|
// Store the original document title.
|
|
this.originalTitle = document.title;
|
|
|
|
// Create the dialog and related DOM elements.
|
|
this.create();
|
|
|
|
this.isOpening = false;
|
|
this.isOpen = true;
|
|
$(document.documentElement).addClass('overlay-open');
|
|
|
|
// Allow other scripts to respond to this event.
|
|
$(document).trigger('drupalOverlayOpen');
|
|
|
|
return this.load(url);
|
|
};
|
|
|
|
/**
|
|
* Create the underlying markup and behaviors for the overlay.
|
|
*/
|
|
Drupal.overlay.create = function () {
|
|
// Update offsets values on the page.
|
|
displace(false);
|
|
|
|
// Build the overlay container.
|
|
this.$container = $(Drupal.theme('overlayContainer'))
|
|
.appendTo(document.body);
|
|
|
|
// Overlay uses transparent iframes that cover the full parent window.
|
|
// When the overlay is open the scrollbar of the parent window is hidden.
|
|
// Because some browsers show a white iframe background for a short moment
|
|
// while loading a page into an iframe, overlay uses two iframes. By loading
|
|
// the page in a hidden (inactive) iframe the user doesn't see the white
|
|
// background. When the page is loaded the active and inactive iframes
|
|
// are switched.
|
|
this.activeFrame = this.$iframeA = $(Drupal.theme('overlayElement'))
|
|
.appendTo(this.$container);
|
|
|
|
this.inactiveFrame = this.$iframeB = $(Drupal.theme('overlayElement'))
|
|
.appendTo(this.$container);
|
|
|
|
this.$iframeA.bind('load.drupal-overlay', { self: this.$iframeA[0], sibling: this.$iframeB }, $.proxy(this, 'loadChild'));
|
|
this.$iframeB.bind('load.drupal-overlay', { self: this.$iframeB[0], sibling: this.$iframeA }, $.proxy(this, 'loadChild'));
|
|
|
|
// Add a second class "drupal-overlay-open" to indicate these event handlers
|
|
// should only be bound when the overlay is open.
|
|
var eventClass = '.drupal-overlay.drupal-overlay-open';
|
|
$(window)
|
|
.bind('resize' + eventClass, $.proxy(this, 'eventhandlerOuterResize'));
|
|
$(document)
|
|
.bind('drupalViewportOffsetChange' + eventClass, $.proxy(this, 'eventhandlerViewportOffsetChange'))
|
|
.bind('drupalOverlayLoad' + eventClass, $.proxy(this, 'eventhandlerOuterResize'))
|
|
.bind('drupalOverlayReady' + eventClass +
|
|
' drupalOverlayClose' + eventClass, $.proxy(this, 'eventhandlerSyncURLFragment'))
|
|
.bind('drupalOverlayClose' + eventClass, $.proxy(this, 'eventhandlerRefreshPage'))
|
|
.bind('drupalOverlayBeforeClose' + eventClass +
|
|
' drupalOverlayBeforeLoad' + eventClass +
|
|
' drupalOverlayResize' + eventClass, $.proxy(this, 'eventhandlerDispatchEvent'));
|
|
|
|
$(document)
|
|
.bind('drupalOverlayResize' + eventClass, $.proxy(this, 'eventhandlerAlterDisplacedElements'))
|
|
.bind('drupalOverlayClose' + eventClass, $.proxy(this, 'eventhandlerRestoreDisplacedElements'));
|
|
};
|
|
|
|
/**
|
|
* Load the given URL into the overlay iframe.
|
|
*
|
|
* Use this method to change the URL being loaded in the overlay if it is
|
|
* already open.
|
|
*
|
|
* @return
|
|
* TRUE if URL is loaded into the overlay, FALSE otherwise.
|
|
*/
|
|
Drupal.overlay.load = function (url) {
|
|
if (!this.isOpen) {
|
|
return false;
|
|
}
|
|
|
|
// Allow other scripts to respond to this event.
|
|
$(document).trigger('drupalOverlayBeforeLoad');
|
|
|
|
$(document.documentElement).addClass('overlay-loading');
|
|
|
|
// The contentDocument property is not supported in IE until IE8.
|
|
var iframeDocument = this.inactiveFrame[0].contentDocument || this.inactiveFrame[0].contentWindow.document;
|
|
|
|
// location.replace doesn't create a history entry. location.href does.
|
|
// In this case, we want location.replace, as we're creating the history
|
|
// entry using URL fragments.
|
|
iframeDocument.location.replace(url);
|
|
|
|
return true;
|
|
};
|
|
|
|
/**
|
|
* Close the overlay and remove markup related to it from the document.
|
|
*
|
|
* @return
|
|
* TRUE if the overlay was closed, FALSE otherwise.
|
|
*/
|
|
Drupal.overlay.close = function () {
|
|
// Prevent double execution when close is requested more than once.
|
|
if (!this.isOpen || this.isClosing) {
|
|
return false;
|
|
}
|
|
|
|
// Allow other scripts to respond to this event.
|
|
var event = $.Event('drupalOverlayBeforeClose');
|
|
$(document).trigger(event);
|
|
// If a handler returned false, the close will be prevented.
|
|
if (event.isDefaultPrevented()) {
|
|
return false;
|
|
}
|
|
|
|
this.isClosing = true;
|
|
this.isOpen = false;
|
|
$(document.documentElement).removeClass('overlay-open');
|
|
// Restore the original document title.
|
|
document.title = this.originalTitle;
|
|
|
|
// Allow other scripts to respond to this event.
|
|
$(document).trigger('drupalOverlayClose');
|
|
|
|
Drupal.announce(Drupal.t('Tabbing is no longer constrained by the Overlay module.'));
|
|
|
|
// When the iframe is still loading don't destroy it immediately but after
|
|
// the content is loaded (see Drupal.overlay.loadChild).
|
|
if (!this.isLoading) {
|
|
this.destroy();
|
|
this.isClosing = false;
|
|
}
|
|
return true;
|
|
};
|
|
|
|
/**
|
|
* Destroy the overlay.
|
|
*/
|
|
Drupal.overlay.destroy = function () {
|
|
$([document, window]).unbind('.drupal-overlay-open');
|
|
this.$container.remove();
|
|
|
|
this.$container = null;
|
|
this.$iframeA = null;
|
|
this.$iframeB = null;
|
|
|
|
this.iframeWindow = null;
|
|
};
|
|
|
|
/**
|
|
* Redirect the overlay parent window to the given URL.
|
|
*
|
|
* @param url
|
|
* Can be an absolute URL or a relative link to the domain root.
|
|
*/
|
|
Drupal.overlay.redirect = function (url) {
|
|
// Create a native Link object, so we can use its object methods.
|
|
var link = $(url.link(url)).get(0);
|
|
|
|
// If the link is already open, force the hashchange event to simulate reload.
|
|
if (window.location.href === link.href) {
|
|
$(window).triggerHandler('hashchange.drupal-overlay');
|
|
}
|
|
|
|
window.location.href = link.href;
|
|
return true;
|
|
};
|
|
|
|
/**
|
|
* Bind the child window.
|
|
*
|
|
* Note that this function is fired earlier than Drupal.overlay.loadChild.
|
|
*/
|
|
Drupal.overlay.bindChild = function (iframeWindow, isClosing) {
|
|
this.iframeWindow = iframeWindow;
|
|
|
|
// We are done if the child window is closing.
|
|
if (isClosing || this.isClosing || !this.isOpen) {
|
|
return;
|
|
}
|
|
|
|
// Allow other scripts to respond to this event.
|
|
$(document).trigger('drupalOverlayReady');
|
|
};
|
|
|
|
/**
|
|
* Event handler: load event handler for the overlay iframe.
|
|
*
|
|
* @param event
|
|
* Event being triggered, with the following restrictions:
|
|
* - event.type: load
|
|
* - event.currentTarget: iframe
|
|
*/
|
|
Drupal.overlay.loadChild = function (event) {
|
|
var iframe = event.data.self;
|
|
var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
|
|
var iframeWindow = iframeDocument.defaultView || iframeDocument.parentWindow;
|
|
if (iframeWindow.location.href === 'about:blank') {
|
|
return;
|
|
}
|
|
|
|
this.isLoading = false;
|
|
$(document.documentElement).removeClass('overlay-loading');
|
|
event.data.sibling.removeClass('overlay-active').prop({ 'tabindex': -1 });
|
|
|
|
// Only continue when overlay is still open and not closing.
|
|
if (this.isOpen && !this.isClosing) {
|
|
// And child document is an actual overlayChild.
|
|
if (iframeWindow.Drupal && iframeWindow.Drupal.overlayChild) {
|
|
// Replace the document title with title of iframe.
|
|
document.title = iframeWindow.document.title;
|
|
|
|
this.activeFrame = $(iframe)
|
|
.addClass('overlay-active')
|
|
// Add a title attribute to the iframe for accessibility.
|
|
.attr('title', Drupal.t('@title dialog', { '@title': iframeWindow.jQuery('#overlay-title').text() })).prop('tabindex', false);
|
|
this.inactiveFrame = event.data.sibling;
|
|
|
|
Drupal.announce(Drupal.t('The overlay has been opened to @title', {'@title': iframeWindow.jQuery('#overlay-title').text()}));
|
|
|
|
// Load an empty document into the inactive iframe.
|
|
(this.inactiveFrame[0].contentDocument || this.inactiveFrame[0].contentWindow.document).location.replace('about:blank');
|
|
|
|
// Create a fake link before the skip link in order to give it focus.
|
|
var skipLink = iframeWindow.jQuery('[href="#main-content"]');
|
|
Drupal.overlay.setFocusBefore(skipLink, iframeWindow.document);
|
|
|
|
// Report these tabbables to the TabbingManger in the parent window.
|
|
Drupal.overlay.releaseTabbing();
|
|
Drupal.overlay.constrainTabbing($(iframeWindow.document).add('#toolbar-administration'));
|
|
|
|
Drupal.announce(Drupal.t('Tabbing is constrained to items in the administrative toolbar and the overlay.'));
|
|
|
|
// Allow other scripts to respond to this event.
|
|
$(document).trigger('drupalOverlayLoad');
|
|
}
|
|
else {
|
|
window.location = iframeWindow.location.href.replace(/([?&]?)render=overlay&?/g, '$1').replace(/\?$/, '');
|
|
}
|
|
}
|
|
else {
|
|
this.destroy();
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Creates a placeholder element to receive document focus.
|
|
*
|
|
* Setting the document focus to a link will make it visible, even if it's a
|
|
* "skip to main content" link that should normally be visible only when the
|
|
* user tabs to it. This function can be used to set the document focus to
|
|
* just before such an invisible link.
|
|
*
|
|
* @param $element
|
|
* The jQuery element that should receive focus on the next tab press.
|
|
* @param document
|
|
* The iframe window element to which the placeholder should be added. The
|
|
* placeholder element has to be created inside the same iframe as the element
|
|
* it precedes, to keep IE happy. (http://bugs.jquery.com/ticket/4059)
|
|
*/
|
|
Drupal.overlay.setFocusBefore = function ($element, document) {
|
|
// Create an anchor inside the placeholder document.
|
|
var placeholder = document.createElement('a');
|
|
var $placeholder = $(placeholder).addClass('visually-hidden').attr('href', '#');
|
|
// Put the placeholder where it belongs, and set the document focus to it.
|
|
$placeholder.insertBefore($element);
|
|
$placeholder.attr('autofocus', true);
|
|
// Make the placeholder disappear as soon as it loses focus, so that it
|
|
// doesn't appear in the tab order again.
|
|
$placeholder.one('blur', function () {
|
|
$(this).remove();
|
|
});
|
|
};
|
|
|
|
/**
|
|
* Check if the given link is in the administrative section of the site.
|
|
*
|
|
* @param url
|
|
* The URL to be tested.
|
|
*
|
|
* @return boolean
|
|
* TRUE if the URL represents an administrative link, FALSE otherwise.
|
|
*/
|
|
Drupal.overlay.isAdminLink = function (url) {
|
|
if (Drupal.overlay.isExternalLink(url)) {
|
|
return false;
|
|
}
|
|
|
|
var path = this.getPath(url);
|
|
|
|
// Turn the list of administrative paths into a regular expression.
|
|
if (!this.adminPathRegExp) {
|
|
var prefix = '';
|
|
if (Drupal.settings.overlay.pathPrefixes.length) {
|
|
// Allow path prefixes used for language negatiation followed by slash,
|
|
// and the empty string.
|
|
prefix = '(' + Drupal.settings.overlay.pathPrefixes.join('/|') + '/|)';
|
|
}
|
|
var adminPaths = '^' + prefix + '(' + Drupal.settings.overlay.paths.admin.replace(/\s+/g, '|') + ')$';
|
|
var nonAdminPaths = '^' + prefix + '(' + Drupal.settings.overlay.paths.non_admin.replace(/\s+/g, '|') + ')$';
|
|
adminPaths = adminPaths.replace(/\*/g, '.*');
|
|
nonAdminPaths = nonAdminPaths.replace(/\*/g, '.*');
|
|
this.adminPathRegExp = new RegExp(adminPaths);
|
|
this.nonAdminPathRegExp = new RegExp(nonAdminPaths);
|
|
}
|
|
|
|
return this.adminPathRegExp.exec(path) && !this.nonAdminPathRegExp.exec(path);
|
|
};
|
|
|
|
/**
|
|
* Determine whether a link is external to the site.
|
|
*
|
|
* @param url
|
|
* The URL to be tested.
|
|
*
|
|
* @return boolean
|
|
* TRUE if the URL is external to the site, FALSE otherwise.
|
|
*/
|
|
Drupal.overlay.isExternalLink = function (url) {
|
|
var re = new RegExp('^((f|ht)tps?:)?//(?!' + window.location.host + ')');
|
|
return re.test(url);
|
|
};
|
|
|
|
/**
|
|
* Responds to the drupalViewportOffsetChange event.
|
|
*
|
|
* @param object event
|
|
* A jQuery event object.
|
|
*
|
|
* @param object offsets
|
|
* An object whose keys are the for sides an element -- top, right, bottom
|
|
* and left. The value of each key is the viewport displacement distance for
|
|
* that edge.
|
|
*/
|
|
Drupal.overlay.eventhandlerViewportOffsetChange = function (event, offsets) {
|
|
// Allow other scripts to respond to this event.
|
|
$(document).trigger('drupalOverlayResize');
|
|
};
|
|
|
|
/**
|
|
* Event handler: resizes overlay according to the size of the parent window.
|
|
*
|
|
* @param event
|
|
* Event being triggered, with the following restrictions:
|
|
* - event.type: any
|
|
* - event.currentTarget: any
|
|
*/
|
|
Drupal.overlay.eventhandlerOuterResize = function (event) {
|
|
// Proceed only if the overlay still exists.
|
|
if (!(this.isOpen || this.isOpening) || this.isClosing || !this.iframeWindow) {
|
|
return;
|
|
}
|
|
|
|
// IE6 uses position:absolute instead of position:fixed.
|
|
if (typeof document.body.style.maxHeight !== 'string') {
|
|
this.activeFrame.height($(window).height());
|
|
}
|
|
|
|
// Allow other scripts to respond to this event.
|
|
$(document).trigger('drupalOverlayResize');
|
|
};
|
|
|
|
/**
|
|
* Event handler: resizes displaced elements so they won't overlap the scrollbar
|
|
* of overlay's iframe.
|
|
*
|
|
* @param event
|
|
* Event being triggered, with the following restrictions:
|
|
* - event.type: any
|
|
* - event.currentTarget: any
|
|
*/
|
|
Drupal.overlay.eventhandlerAlterDisplacedElements = function (event) {
|
|
// Proceed only if the overlay still exists.
|
|
if (!(this.isOpen || this.isOpening) || this.isClosing || !this.iframeWindow) {
|
|
return;
|
|
}
|
|
|
|
var offsets = displace.offsets;
|
|
|
|
// Move the body of the iframe contentDocument inward a sufficient distance
|
|
// to prevent it from appearing underneath displacing elements like the
|
|
// toolbar.
|
|
var iframeBody = this.iframeWindow.document.body;
|
|
$(iframeBody).css({
|
|
'padding-top': offsets.top,
|
|
'padding-right': offsets.right,
|
|
'padding-bottom': offsets.bottom,
|
|
'padding-left': offsets.left
|
|
});
|
|
// Trigger a repaint.
|
|
iframeBody.style.display = 'none';
|
|
iframeBody.style.display = 'block';
|
|
|
|
// Constrain the width of offsetting top and bottom elements, such as the
|
|
// toolbar, so that a scroll in the overlay iframe won't be occluded.
|
|
var iframeBodyWidth = iframeBody.clientWidth;
|
|
if (iframeBodyWidth > 0 && iframeBodyWidth < document.documentElement.clientWidth) {
|
|
$('[data-offset-top], [data-offset-bottom]').css('max-width', iframeBodyWidth);
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Event handler: restores size of displaced elements as they were before
|
|
* overlay was opened.
|
|
*
|
|
* @param event
|
|
* Event being triggered, with the following restrictions:
|
|
* - event.type: any
|
|
* - event.currentTarget: any
|
|
*/
|
|
Drupal.overlay.eventhandlerRestoreDisplacedElements = function (event) {
|
|
$('[data-offset-top], [data-offset-bottom]').css('max-width', 'none');
|
|
};
|
|
|
|
/**
|
|
* Event handler: overrides href of administrative links to be opened in
|
|
* the overlay.
|
|
*
|
|
* This click event handler should be bound to any document (for example the
|
|
* overlay iframe) of which you want links to open in the overlay.
|
|
*
|
|
* @param event
|
|
* Event being triggered, with the following restrictions:
|
|
* - event.type: click, mouseup
|
|
* - event.currentTarget: document
|
|
*
|
|
* @see Drupal.overlayChild.behaviors.addClickHandler
|
|
*/
|
|
Drupal.overlay.eventhandlerOverrideLink = function (event) {
|
|
// In some browsers the click event isn't fired for right-clicks. Use the
|
|
// mouseup event for right-clicks and the click event for everything else.
|
|
if ((event.type === 'click' && event.button === 2) || (event.type === 'mouseup' && event.button !== 2)) {
|
|
return;
|
|
}
|
|
|
|
var $target = $(event.target);
|
|
|
|
// Only continue if clicked target (or one of its parents) is a link.
|
|
if (!$target.is('a')) {
|
|
$target = $target.closest('a');
|
|
if (!$target.length) {
|
|
return;
|
|
}
|
|
}
|
|
|
|
// Never open links in the overlay that contain the overlay-exclude class.
|
|
if ($target.hasClass('overlay-exclude')) {
|
|
return;
|
|
}
|
|
|
|
// Close the overlay when the link contains the overlay-close class.
|
|
if ($target.hasClass('overlay-close')) {
|
|
// Clearing the overlay URL fragment will close the overlay.
|
|
$.bbq.removeState('overlay');
|
|
return;
|
|
}
|
|
|
|
var target = $target[0];
|
|
var href = target.href;
|
|
// Only handle links that have an href attribute and use the HTTP(S) protocol.
|
|
if (typeof href !== 'undefined' && href !== '' && (/^https?\:/).test(target.protocol)) {
|
|
var anchor = href.replace(target.ownerDocument.location.href, '');
|
|
// Skip anchor links.
|
|
if (anchor.length === 0 || anchor.charAt(0) === '#') {
|
|
return;
|
|
}
|
|
// Open admin links in the overlay.
|
|
else if (this.isAdminLink(href)) {
|
|
// If the link contains the overlay-restore class and the overlay-context
|
|
// state is set, also update the parent window's location.
|
|
var parentLocation = ($target.hasClass('overlay-restore') && typeof $.bbq.getState('overlay-context') === 'string') ? Drupal.url($.bbq.getState('overlay-context')) : null;
|
|
href = this.fragmentizeLink($target.get(0), parentLocation);
|
|
// Only override default behavior when left-clicking and user is not
|
|
// pressing the ALT, CTRL, META (Command key on the Macintosh keyboard)
|
|
// or SHIFT key.
|
|
if (event.button === 0 && !event.altKey && !event.ctrlKey && !event.metaKey && !event.shiftKey) {
|
|
// Redirect to a fragmentized href. This will trigger a hashchange event.
|
|
this.redirect(href);
|
|
// Prevent default action and further propagation of the event.
|
|
return false;
|
|
}
|
|
// Otherwise alter clicked link's href. This is being picked up by
|
|
// the default action handler.
|
|
else {
|
|
$target
|
|
// Restore link's href attribute on blur or next click.
|
|
.one('blur mousedown', { target: target, href: target.href }, function (event) { $(event.data.target).attr('href', event.data.href); })
|
|
.attr('href', href);
|
|
}
|
|
}
|
|
// Non-admin links should close the overlay and open in the main window,
|
|
// which is the default action for a link. We only need to handle them
|
|
// if the overlay is open and the clicked link is inside the overlay iframe.
|
|
else if (this.isOpen && target.ownerDocument === this.iframeWindow.document) {
|
|
// Open external links in the immediate parent of the frame, unless the
|
|
// link already has a different target.
|
|
if (target.hostname !== window.location.hostname) {
|
|
if (!$target.attr('target')) {
|
|
$target.attr('target', '_parent');
|
|
}
|
|
}
|
|
else {
|
|
// Add the overlay-context state to the link, so "overlay-restore" links
|
|
// can restore the context.
|
|
// Leave links with an existing fragment alone. Adding an extra
|
|
// parameter to a link like "node/1#section-1" breaks the link.
|
|
if (!$target[0].hash) {
|
|
// For links with no existing fragment, add the overlay context.
|
|
$target.attr('href', $.param.fragment(href, { 'overlay-context': this.getPath(window.location) + window.location.search }));
|
|
}
|
|
|
|
// When the link has a destination query parameter and that destination
|
|
// is an admin link we need to fragmentize it. This will make it reopen
|
|
// in the overlay.
|
|
var params = $.deparam.querystring(href);
|
|
if (params.destination && this.isAdminLink(params.destination)) {
|
|
var fragmentizedDestination = $.param.fragment(this.getPath(window.location), { overlay: params.destination });
|
|
$target.attr('href', $.param.querystring(href, { destination: fragmentizedDestination }));
|
|
}
|
|
|
|
// Make the link open in the immediate parent of the frame, unless the
|
|
// link already has a different target.
|
|
if (!$target.attr('target')) {
|
|
$target.attr('target', '_parent');
|
|
}
|
|
}
|
|
}
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Event handler: opens or closes the overlay based on the current URL fragment.
|
|
*
|
|
* @param event
|
|
* Event being triggered, with the following restrictions:
|
|
* - event.type: hashchange
|
|
* - event.currentTarget: document
|
|
*/
|
|
Drupal.overlay.eventhandlerOperateByURLFragment = function (event) {
|
|
// If we changed the hash to reflect an internal redirect in the overlay,
|
|
// its location has already been changed, so don't do anything.
|
|
if ($.data(window.location, window.location.href) === 'redirect') {
|
|
$.data(window.location, window.location.href, null);
|
|
return;
|
|
}
|
|
|
|
// Get the overlay URL from the current URL fragment.
|
|
var state = $.bbq.getState('overlay');
|
|
if (state) {
|
|
// Append render variable, so the server side can choose the right
|
|
// rendering and add child frame code to the page if needed.
|
|
var url = $.param.querystring(Drupal.url(state), { render: 'overlay' });
|
|
|
|
this.open(url);
|
|
this.resetActiveClass(this.getPath(url));
|
|
}
|
|
// If there is no overlay URL in the fragment and the overlay is (still)
|
|
// open, close the overlay.
|
|
else if (this.isOpen && !this.isClosing) {
|
|
this.close();
|
|
this.resetActiveClass(this.getPath(window.location));
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Event handler: makes sure the internal overlay URL is reflected in the parent
|
|
* URL fragment.
|
|
*
|
|
* Normally the parent URL fragment determines the overlay location. However, if
|
|
* the overlay redirects internally, the parent doesn't get informed, and the
|
|
* parent URL fragment will be out of date. This is a sanity check to make
|
|
* sure we're in the right place.
|
|
*
|
|
* The parent URL fragment is also not updated automatically when overlay's
|
|
* open, close or load functions are used directly (instead of through
|
|
* eventhandlerOperateByURLFragment).
|
|
*
|
|
* @param event
|
|
* Event being triggered, with the following restrictions:
|
|
* - event.type: drupalOverlayReady, drupalOverlayClose
|
|
* - event.currentTarget: document
|
|
*/
|
|
Drupal.overlay.eventhandlerSyncURLFragment = function (event) {
|
|
if (this.isOpen) {
|
|
var expected = $.bbq.getState('overlay');
|
|
// This is just a sanity check, so we're comparing paths, not query strings.
|
|
if (this.getPath(Drupal.url(expected)) !== this.getPath(this.iframeWindow.document.location)) {
|
|
// There may have been a redirect inside the child overlay window that the
|
|
// parent wasn't aware of. Update the parent URL fragment appropriately.
|
|
var newLocation = Drupal.overlay.fragmentizeLink(this.iframeWindow.document.location);
|
|
// Set a 'redirect' flag on the new location so the hashchange event handler
|
|
// knows not to change the overlay's content.
|
|
$.data(window.location, newLocation, 'redirect');
|
|
// Use location.replace() so we don't create an extra history entry.
|
|
window.location.replace(newLocation);
|
|
}
|
|
}
|
|
else {
|
|
$.bbq.removeState('overlay');
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Event handler: if the child window suggested that the parent refresh on
|
|
* close, force a page refresh.
|
|
*
|
|
* @param event
|
|
* Event being triggered, with the following restrictions:
|
|
* - event.type: drupalOverlayClose
|
|
* - event.currentTarget: document
|
|
*/
|
|
Drupal.overlay.eventhandlerRefreshPage = function (event) {
|
|
if (Drupal.overlay.refreshPage) {
|
|
window.location.reload(true);
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Event handler: dispatches events to the overlay document.
|
|
*
|
|
* @param event
|
|
* Event being triggered, with the following restrictions:
|
|
* - event.type: any
|
|
* - event.currentTarget: any
|
|
*/
|
|
Drupal.overlay.eventhandlerDispatchEvent = function (event) {
|
|
if (this.iframeWindow && this.iframeWindow.document) {
|
|
this.iframeWindow.jQuery(this.iframeWindow.document).trigger(event);
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Make a regular admin link into a URL that will trigger the overlay to open.
|
|
*
|
|
* @param link
|
|
* A JavaScript Link object (i.e. an <a> element).
|
|
* @param parentLocation
|
|
* (optional) URL to override the parent window's location with.
|
|
*
|
|
* @return
|
|
* A URL that will trigger the overlay (in the form
|
|
* /node/1#overlay=admin/config).
|
|
*/
|
|
Drupal.overlay.fragmentizeLink = function (link, parentLocation) {
|
|
// Don't operate on links that are already overlay-ready.
|
|
var params = $.deparam.fragment(link.href);
|
|
if (params.overlay) {
|
|
return link.href;
|
|
}
|
|
|
|
// Determine the link's original destination.
|
|
var path = this.getPath(link);
|
|
// Preserve existing query and fragment parameters in the URL, except for
|
|
// "render=overlay" which is re-added in Drupal.overlay.eventhandlerOperateByURLFragment.
|
|
var destination = path + link.search.replace(/&?render=overlay/, '').replace(/\?$/, '') + link.hash;
|
|
|
|
// Assemble and return the overlay-ready link.
|
|
return $.param.fragment(parentLocation || window.location.href, { overlay: destination });
|
|
};
|
|
|
|
/**
|
|
* Refresh a specific region.
|
|
*
|
|
* @param regionName
|
|
* Name of the region.
|
|
* @param regionSelector
|
|
* CSS selector for the region.
|
|
*/
|
|
function refreshRegion(regionName, regionSelector) {
|
|
var $region = $(regionSelector);
|
|
Drupal.detachBehaviors($region);
|
|
$.get(Drupal.url(Drupal.settings.overlay.ajaxCallback + '/' + regionName), function (newElement) {
|
|
$region.replaceWith($(newElement));
|
|
Drupal.attachBehaviors($region, Drupal.settings);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Refresh any regions of the page that are displayed outside the overlay.
|
|
*
|
|
* @param data
|
|
* An array of objects with information on the page regions to be refreshed.
|
|
* For each object, the key is a CSS class identifying the region to be
|
|
* refreshed, and the value represents the section of the Drupal $page array
|
|
* corresponding to this region.
|
|
*/
|
|
Drupal.overlay.refreshRegions = function (data) {
|
|
var region, region_info, regionClass;
|
|
for (region in data) {
|
|
if (data.hasOwnProperty(region)) {
|
|
region_info = data[region];
|
|
for (regionClass in region_info) {
|
|
if (region_info.hasOwnProperty(regionClass)) {
|
|
refreshRegion(region_info[regionClass], '.' + regionClass);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Reset the active class on links in displaced elements according to
|
|
* given path.
|
|
*
|
|
* @param activePath
|
|
* Path to match links against.
|
|
*/
|
|
Drupal.overlay.resetActiveClass = function(activePath) {
|
|
var self = this;
|
|
var windowDomain = window.location.protocol + window.location.hostname;
|
|
|
|
$('#toolbar-administration')
|
|
.find('a[href]')
|
|
// Remove active class from all links in displaced elements.
|
|
.removeClass('active')
|
|
// Add active class to links that match activePath.
|
|
.each(function () {
|
|
var linkDomain = this.protocol + this.hostname;
|
|
var linkPath = self.getPath(this);
|
|
|
|
// A link matches if it is part of the active trail of activePath, except
|
|
// for frontpage links.
|
|
if (linkDomain === windowDomain && (activePath + '/').indexOf(linkPath + '/') === 0 && (linkPath !== '' || activePath === '')) {
|
|
$(this).addClass('active');
|
|
}
|
|
});
|
|
};
|
|
|
|
/**
|
|
* Helper function to get the (corrected) Drupal path of a link.
|
|
*
|
|
* @param link
|
|
* Link object or string to get the Drupal path from.
|
|
*
|
|
* @return
|
|
* The Drupal path.
|
|
*/
|
|
Drupal.overlay.getPath = function (link) {
|
|
if (typeof link === 'string') {
|
|
// Create a native Link object, so we can use its object methods.
|
|
link = $(link.link(link)).get(0);
|
|
}
|
|
|
|
var path = link.pathname;
|
|
// Ensure a leading slash on the path, omitted in some browsers.
|
|
if (path.charAt(0) !== '/') {
|
|
path = '/' + path;
|
|
}
|
|
path = path.replace(new RegExp(Drupal.settings.basePath + Drupal.settings.scriptPath), '');
|
|
|
|
return path;
|
|
};
|
|
|
|
/**
|
|
* Makes elements outside the overlay unreachable via the tab key.
|
|
*/
|
|
Drupal.overlay.constrainTabbing = function ($tabbables) {
|
|
// If a tabset is already active, return without creating a new one.
|
|
if (this.tabset && !this.tabset.released) {
|
|
return;
|
|
}
|
|
// Leave links inside the overlay and toolbars alone.
|
|
this.tabset = Drupal.tabbingManager.constrain($tabbables);
|
|
var self = this;
|
|
$(document).on('drupalOverlayClose.tabbing', function () {
|
|
self.tabset.release();
|
|
$(document).off('drupalOverlayClose.tabbing');
|
|
});
|
|
};
|
|
|
|
/**
|
|
*
|
|
*/
|
|
Drupal.overlay.releaseTabbing = function () {
|
|
if (this.tabset) {
|
|
this.tabset.release();
|
|
delete this.tabset;
|
|
}
|
|
};
|
|
|
|
$.extend(Drupal.theme, {
|
|
/**
|
|
* Theme function to create the overlay iframe element.
|
|
*/
|
|
overlayContainer: function () {
|
|
return '<div id="overlay-container"><div class="overlay-modal-background"></div></div>';
|
|
},
|
|
|
|
/**
|
|
* Theme function to create an overlay iframe element.
|
|
*/
|
|
overlayElement: function (url) {
|
|
return '<iframe class="overlay-element" frameborder="0" scrolling="auto" allowtransparency="true"></iframe>';
|
|
}
|
|
});
|
|
|
|
})(jQuery, Drupal, Drupal.displace);
|