debian-mirror-gitlab/app/assets/javascripts/main.js

281 lines
8.4 KiB
JavaScript
Raw Normal View History

2018-05-09 12:01:36 +05:30
/* global $ */
2017-08-17 22:00:37 +05:30
import jQuery from 'jquery';
2018-10-15 14:42:47 +05:30
// bootstrap webpack, common libs, polyfills, and behaviors
import './webpack';
import './commons';
import './behaviors';
2017-08-17 22:00:37 +05:30
// lib/utils
2020-10-24 23:57:45 +05:30
import applyGitLabUIConfig from '@gitlab/ui/dist/config';
import { GlBreakpointInstance as bp } from '@gitlab/ui/dist/utils';
2021-01-03 14:25:43 +05:30
import { initRails } from '~/lib/utils/rails_ujs';
2021-03-11 19:13:27 +05:30
import * as popovers from '~/popovers';
import * as tooltips from '~/tooltips';
2022-01-26 12:08:38 +05:30
import { initPrefetchLinks } from '~/lib/utils/navigation_utility';
2022-04-04 11:22:00 +05:30
import { logHelloDeferred } from 'jh_else_ce/lib/logger/hello_deferred';
2021-03-11 19:13:27 +05:30
import initAlertHandler from './alert_handler';
2022-01-26 12:08:38 +05:30
import { addDismissFlashClickListener } from './flash';
2021-03-11 19:13:27 +05:30
import initTodoToggle from './header';
import initLayoutNav from './layout_nav';
2021-04-29 21:17:54 +05:30
import { handleLocationHash, addSelectOnFocusBehaviour } from './lib/utils/common_utils';
2021-09-04 01:27:46 +05:30
import { localTimeAgo } from './lib/utils/datetime/timeago_utility';
2018-03-17 18:26:18 +05:30
import { getLocationHash, visitUrl } from './lib/utils/url_utility';
2017-08-17 22:00:37 +05:30
// everything else
2021-03-11 19:13:27 +05:30
import initFeatureHighlight from './feature_highlight';
2017-09-10 17:25:29 +05:30
import LazyLoader from './lazy_loader';
2018-03-17 18:26:18 +05:30
import initLogoAnimation from './logo';
import initBreadcrumbs from './breadcrumb';
2021-03-11 19:13:27 +05:30
import initPersistentUserCallouts from './persistent_user_callouts';
import { initUserTracking, initDefaultTrackers } from './tracking';
2021-09-30 23:02:18 +05:30
import initServicePingConsent from './service_ping_consent';
2018-12-05 23:21:45 +05:30
import GlFieldErrors from './gl_field_errors';
2019-02-15 15:39:39 +05:30
import initUserPopovers from './user_popovers';
2020-03-13 15:44:24 +05:30
import initBroadcastNotifications from './broadcast_notification';
2021-06-08 01:23:25 +05:30
import { initTopNav } from './nav';
2022-01-26 12:08:38 +05:30
import { initCopyCodeButton } from './behaviors/copy_code';
2022-08-13 15:12:31 +05:30
import initHeaderSearch from './header_search/init';
2021-01-03 14:25:43 +05:30
2019-09-30 21:07:59 +05:30
import 'ee_else_ce/main_ee';
2021-11-11 11:23:49 +05:30
import 'jh_else_ce/main_jh';
logHelloDeferred();
2019-09-30 21:07:59 +05:30
2020-07-28 23:09:34 +05:30
applyGitLabUIConfig();
2018-10-15 14:42:47 +05:30
// expose jQuery as global (TODO: remove these)
window.jQuery = jQuery;
window.$ = jQuery;
2021-09-30 23:02:18 +05:30
// ensure that window.gl is set up
window.gl = window.gl || {};
2018-03-27 19:54:05 +05:30
// inject test utilities if necessary
2020-07-28 23:09:34 +05:30
if (process.env.NODE_ENV !== 'production' && gon?.test_env) {
2022-08-13 15:12:31 +05:30
import(/* webpackMode: "eager" */ './test_utils');
2018-03-27 19:54:05 +05:30
}
2017-08-17 22:00:37 +05:30
2018-03-17 18:26:18 +05:30
document.addEventListener('beforeunload', () => {
2017-08-17 22:00:37 +05:30
// Unbind scroll events
2021-02-22 17:27:13 +05:30
// eslint-disable-next-line @gitlab/no-global-event-off
2017-08-17 22:00:37 +05:30
$(document).off('scroll');
// Close any open tooltips
2021-01-03 14:25:43 +05:30
tooltips.dispose(document.querySelectorAll('.has-tooltip, [data-toggle="tooltip"]'));
2017-09-10 17:25:29 +05:30
// Close any open popover
2021-01-29 00:20:46 +05:30
popovers.dispose();
2017-08-17 22:00:37 +05:30
});
2018-03-17 18:26:18 +05:30
window.addEventListener('hashchange', handleLocationHash);
2018-10-15 14:42:47 +05:30
window.addEventListener(
'load',
function onLoad() {
window.removeEventListener('load', onLoad, false);
handleLocationHash();
},
false,
);
2017-08-17 22:00:37 +05:30
2017-09-10 17:25:29 +05:30
gl.lazyLoader = new LazyLoader({
scrollContainer: window,
2018-03-17 18:26:18 +05:30
observerNode: '#content-body',
2017-09-10 17:25:29 +05:30
});
2021-01-03 14:25:43 +05:30
initRails();
2019-03-02 22:35:43 +05:30
// Put all initialisations here that can also wait after everything is rendered and ready
function deferredInitialisation() {
2018-03-17 18:26:18 +05:30
const $body = $('body');
2021-06-08 01:23:25 +05:30
initTopNav();
2018-03-17 18:26:18 +05:30
initBreadcrumbs();
initTodoToggle();
2022-01-26 12:08:38 +05:30
initPrefetchLinks('.js-prefetch-document');
2018-03-17 18:26:18 +05:30
initLogoAnimation();
2021-09-30 23:02:18 +05:30
initServicePingConsent();
2019-02-15 15:39:39 +05:30
initUserPopovers();
2020-03-13 15:44:24 +05:30
initBroadcastNotifications();
2020-06-23 00:09:42 +05:30
initPersistentUserCallouts();
2020-11-24 15:15:51 +05:30
initDefaultTrackers();
2021-03-11 19:13:27 +05:30
initFeatureHighlight();
2022-01-26 12:08:38 +05:30
initCopyCodeButton();
2022-03-02 08:16:31 +05:30
const helpToggle = document.querySelector('.header-help-dropdown-toggle');
if (helpToggle) {
helpToggle.addEventListener(
'click',
() => {
import(/* webpackChunkName: 'versionCheck' */ './gitlab_version_check')
.then(({ default: initGitlabVersionCheck }) => {
initGitlabVersionCheck();
})
.catch(() => {});
},
{ once: true },
);
}
2018-03-27 19:54:05 +05:30
addSelectOnFocusBehaviour('.js-select-on-focus');
2018-03-17 18:26:18 +05:30
2019-09-30 21:07:59 +05:30
const glTooltipDelay = localStorage.getItem('gl-tooltip-delay');
const delay = glTooltipDelay ? JSON.parse(glTooltipDelay) : 0;
2017-08-17 22:00:37 +05:30
// Initialize tooltips
2021-01-03 14:25:43 +05:30
tooltips.initTooltips({
2017-08-17 22:00:37 +05:30
selector: '.has-tooltip, [data-toggle="tooltip"]',
2018-11-08 19:23:39 +05:30
trigger: 'hover',
boundary: 'viewport',
2019-09-30 21:07:59 +05:30
delay,
2017-08-17 22:00:37 +05:30
});
2018-03-17 18:26:18 +05:30
2017-09-10 17:25:29 +05:30
// Initialize popovers
2021-01-29 00:20:46 +05:30
popovers.initPopovers();
2018-03-17 18:26:18 +05:30
2020-10-24 23:57:45 +05:30
// Adding a helper class to activate animations only after all is rendered
setTimeout(() => $body.addClass('page-initialised'), 1000);
2019-03-02 22:35:43 +05:30
}
2022-08-13 15:12:31 +05:30
// header search vue component bootstrap
// loading this inside requestIdleCallback is causing issues
// see https://gitlab.com/gitlab-org/gitlab/-/issues/365746
initHeaderSearch();
2021-10-27 15:23:28 +05:30
const $body = $('body');
const $document = $(document);
const bootstrapBreakpoint = bp.getBreakpointSize();
initUserTracking();
initLayoutNav();
initAlertHandler();
// `hashchange` is not triggered when link target is already in window.location
$body.on('click', 'a[href^="#"]', function clickHashLinkCallback() {
const href = this.getAttribute('href');
if (href.substr(1) === getLocationHash()) {
setTimeout(handleLocationHash, 1);
2019-03-02 22:35:43 +05:30
}
2021-10-27 15:23:28 +05:30
});
2019-03-02 22:35:43 +05:30
2021-10-27 15:23:28 +05:30
/**
* TODO: Apparently we are collapsing the right sidebar on certain screensizes per default
* except on issue board pages. Why can't we do it with CSS?
*
* Proposal: Expose a global sidebar API, which we could import wherever we are manipulating
* the visibility of the sidebar.
*
* Quick fix: Get rid of jQuery for this implementation
*/
const isBoardsPage = /(projects|groups):boards:show/.test(document.body.dataset.page);
2022-07-16 23:28:13 +05:30
if (
!isBoardsPage &&
!window.gon?.features?.movedMrSidebar &&
(bootstrapBreakpoint === 'sm' || bootstrapBreakpoint === 'xs')
) {
2021-10-27 15:23:28 +05:30
const $rightSidebar = $('aside.right-sidebar');
const $layoutPage = $('.layout-page');
if ($rightSidebar.length > 0) {
$rightSidebar.removeClass('right-sidebar-expanded').addClass('right-sidebar-collapsed');
$layoutPage.removeClass('right-sidebar-expanded').addClass('right-sidebar-collapsed');
} else {
$layoutPage.removeClass('right-sidebar-expanded right-sidebar-collapsed');
}
}
2019-03-02 22:35:43 +05:30
2021-10-27 15:23:28 +05:30
// prevent default action for disabled buttons
$('.btn').click(function clickDisabledButtonCallback(e) {
if ($(this).hasClass('disabled')) {
e.preventDefault();
e.stopImmediatePropagation();
return false;
}
2019-03-02 22:35:43 +05:30
2021-10-27 15:23:28 +05:30
return true;
});
2018-03-17 18:26:18 +05:30
2021-10-27 15:23:28 +05:30
localTimeAgo(document.querySelectorAll('abbr.timeago, .js-timeago'), true);
/**
* This disables form buttons while a form is submitting
* We do not difinitively know all of the places where this is used
*
* TODO: Defer execution, migrate to behaviors, and add sentry logging
*/
$body.on('ajax:complete, ajax:beforeSend, submit', 'form', function ajaxCompleteCallback(e) {
const $buttons = $('[type="submit"], .js-disable-on-submit', this).not('.js-no-auto-disable');
switch (e.type) {
case 'ajax:beforeSend':
case 'submit':
return $buttons.disable();
default:
return $buttons.enable();
}
});
2019-03-02 22:35:43 +05:30
2021-10-27 15:23:28 +05:30
$('.navbar-toggler').on('click', () => {
document.body.classList.toggle('top-nav-responsive-open');
});
2018-03-17 18:26:18 +05:30
2021-10-27 15:23:28 +05:30
/**
* Show suppressed commit diff
*
* TODO: Move to commit diff pages
*/
$document.on('click', '.diff-content .js-show-suppressed-diff', function showDiffCallback() {
const $container = $(this).parent();
$container.next('table').show();
$container.remove();
});
2018-03-17 18:26:18 +05:30
2021-10-27 15:23:28 +05:30
// Show/hide comments on diff
$body.on('click', '.js-toggle-diff-comments', function toggleDiffCommentsCallback(e) {
const $this = $(this);
const notesHolders = $this.closest('.diff-file').find('.notes_holder');
2018-03-17 18:26:18 +05:30
2021-10-27 15:23:28 +05:30
e.preventDefault();
2018-03-17 18:26:18 +05:30
2021-10-27 15:23:28 +05:30
$this.toggleClass('selected');
2018-03-17 18:26:18 +05:30
2021-10-27 15:23:28 +05:30
if ($this.hasClass('active')) {
notesHolders.show().find('.hide, .content').show();
} else {
notesHolders.hide().find('.content').hide();
}
2018-03-17 18:26:18 +05:30
2021-10-27 15:23:28 +05:30
$(document).trigger('toggle.comments');
});
2017-09-10 17:25:29 +05:30
2021-10-27 15:23:28 +05:30
$('form.filter-form').on('submit', function filterFormSubmitCallback(event) {
const link = document.createElement('a');
link.href = this.action;
2017-09-10 17:25:29 +05:30
2021-10-27 15:23:28 +05:30
const action = `${this.action}${link.search === '' ? '?' : '&'}`;
2018-03-17 18:26:18 +05:30
2021-10-27 15:23:28 +05:30
event.preventDefault();
// eslint-disable-next-line no-jquery/no-serialize
visitUrl(`${action}${$(this).serialize()}`);
});
2018-03-17 18:26:18 +05:30
2021-10-27 15:23:28 +05:30
const flashContainer = document.querySelector('.flash-container');
2018-03-17 18:26:18 +05:30
2021-10-27 15:23:28 +05:30
if (flashContainer && flashContainer.children.length) {
flashContainer
.querySelectorAll('.flash-alert, .flash-notice, .flash-success')
.forEach((flashEl) => {
2022-01-26 12:08:38 +05:30
addDismissFlashClickListener(flashEl);
2021-10-27 15:23:28 +05:30
});
}
2019-03-02 22:35:43 +05:30
2021-10-27 15:23:28 +05:30
// initialize field errors
$('.gl-show-field-errors').each((i, form) => new GlFieldErrors(form));
requestIdleCallback(deferredInitialisation);
2022-07-23 23:45:48 +05:30
// initialize hiding of tooltip after clicking on dropdown's links and buttons
document
.querySelectorAll('a[data-toggle="dropdown"], button[data-toggle="dropdown"]')
.forEach((element) => {
element.addEventListener('click', () => tooltips.hide(element));
});