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

308 lines
8.6 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';
import Cookies from 'js-cookie';
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
2018-03-27 19:54:05 +05:30
import { handleLocationHash, addSelectOnFocusBehaviour } from './lib/utils/common_utils';
2018-03-17 18:26:18 +05:30
import { localTimeAgo } from './lib/utils/datetime_utility';
import { getLocationHash, visitUrl } from './lib/utils/url_utility';
2017-08-17 22:00:37 +05:30
// everything else
2017-09-10 17:25:29 +05:30
import loadAwardsHandler from './awards_handler';
import bp from './breakpoints';
2018-03-17 18:26:18 +05:30
import Flash, { removeFlashClickListener } from './flash';
2017-08-17 22:00:37 +05:30
import './gl_dropdown';
2018-03-17 18:26:18 +05:30
import initTodoToggle from './header';
import initImporterStatus from './importer_status';
import initLayoutNav from './layout_nav';
import './feature_highlight/feature_highlight_options';
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';
2018-11-08 19:23:39 +05:30
import './frequent_items';
2018-03-17 18:26:18 +05:30
import initBreadcrumbs from './breadcrumb';
2018-11-20 20:47:30 +05:30
import initUsagePingConsent from './usage_ping_consent';
2018-12-05 23:21:45 +05:30
import initPerformanceBar from './performance_bar';
import initSearchAutocomplete from './search_autocomplete';
import GlFieldErrors from './gl_field_errors';
2019-02-15 15:39:39 +05:30
import initUserPopovers from './user_popovers';
2017-09-10 17:25:29 +05:30
2018-10-15 14:42:47 +05:30
// expose jQuery as global (TODO: remove these)
window.jQuery = jQuery;
window.$ = jQuery;
2018-03-27 19:54:05 +05:30
// inject test utilities if necessary
if (process.env.NODE_ENV !== 'production' && gon && gon.test_env) {
$.fx.off = true;
import(/* webpackMode: "eager" */ './test_utils/');
}
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
$(document).off('scroll');
// Close any open tooltips
2018-11-08 19:23:39 +05:30
$('.has-tooltip, [data-toggle="tooltip"]').tooltip('dispose');
2017-09-10 17:25:29 +05:30
// Close any open popover
2018-11-08 19:23:39 +05:30
$('[data-toggle="popover"]').popover('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
});
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');
initBreadcrumbs();
initImporterStatus();
initTodoToggle();
initLogoAnimation();
2018-11-20 20:47:30 +05:30
initUsagePingConsent();
2019-02-15 15:39:39 +05:30
initUserPopovers();
2017-08-17 22:00:37 +05:30
2018-12-05 23:21:45 +05:30
if (document.querySelector('.search')) initSearchAutocomplete();
2017-08-17 22:00:37 +05:30
2018-03-27 19:54:05 +05:30
addSelectOnFocusBehaviour('.js-select-on-focus');
2018-03-17 18:26:18 +05:30
$('.remove-row').on('ajax:success', function removeRowAjaxSuccessCallback() {
2018-10-15 14:42:47 +05:30
$(this)
2018-11-08 19:23:39 +05:30
.tooltip('dispose')
2017-08-17 22:00:37 +05:30
.closest('li')
.fadeOut();
});
2018-03-17 18:26:18 +05:30
$('.js-remove-tr').on('ajax:before', function removeTRAjaxBeforeCallback() {
$(this).hide();
2017-08-17 22:00:37 +05:30
});
2018-03-17 18:26:18 +05:30
$('.js-remove-tr').on('ajax:success', function removeTRAjaxSuccessCallback() {
2018-10-15 14:42:47 +05:30
$(this)
.closest('tr')
.fadeOut();
2017-08-17 22:00:37 +05:30
});
2018-03-17 18:26:18 +05:30
// Initialize select2 selects
2019-03-02 22:35:43 +05:30
if ($('select.select2').length) {
import(/* webpackChunkName: 'select2' */ 'select2/select2')
.then(() => {
$('select.select2').select2({
width: 'resolve',
dropdownAutoWidth: true,
});
// Close select2 on escape
$('.js-select2').on('select2-close', () => {
setTimeout(() => {
$('.select2-container-active').removeClass('select2-container-active');
$(':focus').blur();
}, 1);
});
})
.catch(() => {});
}
2018-03-17 18:26:18 +05:30
2017-08-17 22:00:37 +05:30
// Initialize tooltips
$body.tooltip({
selector: '.has-tooltip, [data-toggle="tooltip"]',
2018-11-08 19:23:39 +05:30
trigger: 'hover',
boundary: 'viewport',
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
$body.popover({
selector: '[data-toggle="popover"]',
2018-03-17 18:26:18 +05:30
trigger: 'focus',
// set the viewport to the main content, excluding the navigation bar, so
// the navigation can't overlap the popover
viewport: '.layout-page',
2017-09-10 17:25:29 +05:30
});
2018-03-17 18:26:18 +05:30
2019-03-02 22:35:43 +05:30
loadAwardsHandler();
2019-07-31 22:56:46 +05:30
/**
* Toggle Canary Badge
*
* For GitLab.com only, when the user is using canary
* we render a Next badge and hide the option to switch
* to canay
*/
if (Cookies.get('gitlab_canary') && Cookies.get('gitlab_canary') === 'true') {
const canaryBadge = document.querySelector('.js-canary-badge');
const canaryLink = document.querySelector('.js-canary-link');
if (canaryBadge) {
canaryBadge.classList.remove('hidden');
}
if (canaryLink) {
canaryLink.classList.add('hidden');
}
}
2019-03-02 22:35:43 +05:30
}
document.addEventListener('DOMContentLoaded', () => {
const $body = $('body');
const $document = $(document);
const $window = $(window);
const $sidebarGutterToggle = $('.js-sidebar-toggle');
let bootstrapBreakpoint = bp.getBreakpointSize();
if (document.querySelector('#js-peek')) initPerformanceBar({ container: '#js-peek' });
initLayoutNav();
// Set the default path for all cookies to GitLab's root directory
Cookies.defaults.path = gon.relative_url_root || '/';
// `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);
}
});
if (bootstrapBreakpoint === 'xs') {
const $rightSidebar = $('aside.right-sidebar, .layout-page');
$rightSidebar.removeClass('right-sidebar-expanded').addClass('right-sidebar-collapsed');
}
// prevent default action for disabled buttons
$('.btn').click(function clickDisabledButtonCallback(e) {
if ($(this).hasClass('disabled')) {
e.preventDefault();
e.stopImmediatePropagation();
return false;
}
return true;
});
localTimeAgo($('abbr.timeago, .js-timeago'), true);
2017-08-17 22:00:37 +05:30
// Form submitter
2018-03-17 18:26:18 +05:30
$('.trigger-submit').on('change', function triggerSubmitCallback() {
2018-10-15 14:42:47 +05:30
$(this)
.parents('form')
.submit();
2017-08-17 22:00:37 +05:30
});
2018-03-17 18:26:18 +05:30
2017-08-17 22:00:37 +05:30
// Disable form buttons while a form is submitting
2018-03-17 18:26:18 +05:30
$body.on('ajax:complete, ajax:beforeSend, submit', 'form', function ajaxCompleteCallback(e) {
const $buttons = $('[type="submit"], .js-disable-on-submit', this);
2017-08-17 22:00:37 +05:30
switch (e.type) {
case 'ajax:beforeSend':
case 'submit':
2018-03-17 18:26:18 +05:30
return $buttons.disable();
2017-08-17 22:00:37 +05:30
default:
2018-03-17 18:26:18 +05:30
return $buttons.enable();
2017-08-17 22:00:37 +05:30
}
});
2018-03-17 18:26:18 +05:30
$(document).ajaxError((e, xhrObj) => {
const ref = xhrObj.status;
if (ref === 401) {
Flash('You need to be logged in.');
2017-08-17 22:00:37 +05:30
} else if (ref === 404 || ref === 500) {
2018-03-17 18:26:18 +05:30
Flash('Something went wrong on our end.');
2017-08-17 22:00:37 +05:30
}
});
2018-03-17 18:26:18 +05:30
2019-03-02 22:35:43 +05:30
$('.navbar-toggler').on('click', () => {
$('.header-content').toggleClass('menu-expanded');
});
2017-08-17 22:00:37 +05:30
// Commit show suppressed diff
2018-03-17 18:26:18 +05:30
$document.on('click', '.diff-content .js-show-suppressed-diff', function showDiffCallback() {
const $container = $(this).parent();
$container.next('table').show();
$container.remove();
});
2017-08-17 22:00:37 +05:30
// Show/hide comments on diff
2018-03-17 18:26:18 +05:30
$body.on('click', '.js-toggle-diff-comments', function toggleDiffCommentsCallback(e) {
const $this = $(this);
const notesHolders = $this.closest('.diff-file').find('.notes_holder');
e.preventDefault();
2017-08-17 22:00:37 +05:30
$this.toggleClass('active');
2018-03-17 18:26:18 +05:30
2017-08-17 22:00:37 +05:30
if ($this.hasClass('active')) {
2018-10-15 14:42:47 +05:30
notesHolders
.show()
.find('.hide, .content')
.show();
2017-08-17 22:00:37 +05:30
} else {
2018-10-15 14:42:47 +05:30
notesHolders
.hide()
.find('.content')
.hide();
2017-08-17 22:00:37 +05:30
}
2018-03-17 18:26:18 +05:30
2017-08-17 22:00:37 +05:30
$(document).trigger('toggle.comments');
});
2018-03-17 18:26:18 +05:30
$document.on('breakpoint:change', (e, breakpoint) => {
2017-08-17 22:00:37 +05:30
if (breakpoint === 'sm' || breakpoint === 'xs') {
2018-03-17 18:26:18 +05:30
const $gutterIcon = $sidebarGutterToggle.find('i');
2017-08-17 22:00:37 +05:30
if ($gutterIcon.hasClass('fa-angle-double-right')) {
2018-03-17 18:26:18 +05:30
$sidebarGutterToggle.trigger('click');
2017-08-17 22:00:37 +05:30
}
}
});
2018-03-17 18:26:18 +05:30
function fitSidebarForSize() {
const oldBootstrapBreakpoint = bootstrapBreakpoint;
2017-08-17 22:00:37 +05:30
bootstrapBreakpoint = bp.getBreakpointSize();
2018-03-17 18:26:18 +05:30
2017-08-17 22:00:37 +05:30
if (bootstrapBreakpoint !== oldBootstrapBreakpoint) {
2018-03-17 18:26:18 +05:30
$document.trigger('breakpoint:change', [bootstrapBreakpoint]);
2017-08-17 22:00:37 +05:30
}
2018-03-17 18:26:18 +05:30
}
2017-08-17 22:00:37 +05:30
2018-03-17 18:26:18 +05:30
$window.on('resize.app', fitSidebarForSize);
2017-08-17 22:00:37 +05:30
2018-03-17 18:26:18 +05:30
$('form.filter-form').on('submit', function filterFormSubmitCallback(event) {
2017-09-10 17:25:29 +05:30
const link = document.createElement('a');
link.href = this.action;
const action = `${this.action}${link.search === '' ? '?' : '&'}`;
event.preventDefault();
2018-03-17 18:26:18 +05:30
visitUrl(`${action}${$(this).serialize()}`);
2017-09-10 17:25:29 +05:30
});
2018-03-17 18:26:18 +05:30
const flashContainer = document.querySelector('.flash-container');
if (flashContainer && flashContainer.children.length) {
2018-10-15 14:42:47 +05:30
flashContainer
.querySelectorAll('.flash-alert, .flash-notice, .flash-success')
.forEach(flashEl => {
removeFlashClickListener(flashEl);
});
2018-03-17 18:26:18 +05:30
}
2018-12-05 23:21:45 +05:30
// initialize field errors
$('.gl-show-field-errors').each((i, form) => new GlFieldErrors(form));
2019-03-02 22:35:43 +05:30
requestIdleCallback(deferredInitialisation);
2017-08-17 22:00:37 +05:30
});