diff options
Diffstat (limited to 'app/assets/javascripts/lib')
| -rw-r--r-- | app/assets/javascripts/lib/ace.js | 1 | ||||
| -rw-r--r-- | app/assets/javascripts/lib/utils/bootstrap_linked_tabs.js.es6 | 113 | ||||
| -rw-r--r-- | app/assets/javascripts/lib/utils/common_utils.js | 82 | ||||
| -rw-r--r-- | app/assets/javascripts/lib/utils/custom_event_polyfill.js.es6 | 12 | ||||
| -rw-r--r-- | app/assets/javascripts/lib/utils/datetime_utility.js | 12 | ||||
| -rw-r--r-- | app/assets/javascripts/lib/utils/notify.js | 3 | ||||
| -rw-r--r-- | app/assets/javascripts/lib/utils/timeago.js | 239 |
7 files changed, 170 insertions, 292 deletions
diff --git a/app/assets/javascripts/lib/ace.js b/app/assets/javascripts/lib/ace.js index b1718e89d3d..4cdf99cae72 100644 --- a/app/assets/javascripts/lib/ace.js +++ b/app/assets/javascripts/lib/ace.js @@ -1,3 +1,2 @@ -/* eslint-disable */ /*= require ace-rails-ap */ /*= require ace/ext-searchbox */ diff --git a/app/assets/javascripts/lib/utils/bootstrap_linked_tabs.js.es6 b/app/assets/javascripts/lib/utils/bootstrap_linked_tabs.js.es6 new file mode 100644 index 00000000000..e810ee85bd3 --- /dev/null +++ b/app/assets/javascripts/lib/utils/bootstrap_linked_tabs.js.es6 @@ -0,0 +1,113 @@ +/** + * Linked Tabs + * + * Handles persisting and restores the current tab selection and content. + * Reusable component for static content. + * + * ### Example Markup + * + * <ul class="nav-links tab-links"> + * <li class="active"> + * <a data-action="tab1" data-target="#tab1" data-toggle="tab" href="/path/tab1"> + * Tab 1 + * </a> + * </li> + * <li class="groups-tab"> + * <a data-action="tab2" data-target="#tab2" data-toggle="tab" href="/path/tab2"> + * Tab 2 + * </a> + * </li> + * + * + * <div class="tab-content"> + * <div class="tab-pane" id="tab1"> + * Tab 1 Content + * </div> + * <div class="tab-pane" id="tab2"> + * Tab 2 Content + * </div> + * </div> + * + * + * ### How to use + * + * new window.gl.LinkedTabs({ + * action: "#{controller.action_name}", + * defaultAction: 'tab1', + * parentEl: '.tab-links' + * }); + */ + +(() => { + window.gl = window.gl || {}; + + window.gl.LinkedTabs = class LinkedTabs { + /** + * Binds the events and activates de default tab. + * + * @param {Object} options + */ + constructor(options) { + this.options = options || {}; + + this.defaultAction = this.options.defaultAction; + this.action = this.options.action || this.defaultAction; + + if (this.action === 'show') { + this.action = this.defaultAction; + } + + this.currentLocation = window.location; + + const tabSelector = `${this.options.parentEl} a[data-toggle="tab"]`; + + // since this is a custom event we need jQuery :( + $(document) + .off('shown.bs.tab', tabSelector) + .on('shown.bs.tab', tabSelector, e => this.tabShown(e)); + + this.activateTab(this.action); + } + + /** + * Handles the `shown.bs.tab` event to set the currect url action. + * + * @param {type} evt + * @return {Function} + */ + tabShown(evt) { + const source = evt.target.getAttribute('href'); + + return this.setCurrentAction(source); + } + + /** + * Updates the URL with the path that matched the given action. + * + * @param {String} source + * @return {String} + */ + setCurrentAction(source) { + const copySource = source; + + copySource.replace(/\/+$/, ''); + + const newState = `${copySource}${this.currentLocation.search}${this.currentLocation.hash}`; + + history.replaceState({ + turbolinks: true, + url: newState, + }, document.title, newState); + return newState; + } + + /** + * Given the current action activates the correct tab. + * http://getbootstrap.com/javascript/#tab-show + * Note: Will trigger `shown.bs.tab` + */ + activateTab() { + return $(`${this.options.parentEl} a[data-action='${this.action}']`).tab('show'); + } + }; +})(); diff --git a/app/assets/javascripts/lib/utils/common_utils.js b/app/assets/javascripts/lib/utils/common_utils.js index d83c41fae9d..8fa80502d92 100644 --- a/app/assets/javascripts/lib/utils/common_utils.js +++ b/app/assets/javascripts/lib/utils/common_utils.js @@ -1,4 +1,4 @@ -/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-var, no-unused-expressions, no-param-reassign, no-else-return, quotes, object-shorthand, comma-dangle, camelcase, one-var, vars-on-top, one-var-declaration-per-line, no-return-assign, consistent-return, padded-blocks, max-len */ +/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-var, no-unused-expressions, no-param-reassign, no-else-return, quotes, object-shorthand, comma-dangle, camelcase, one-var, vars-on-top, one-var-declaration-per-line, no-return-assign, consistent-return, padded-blocks, max-len, prefer-template */ (function() { (function(w) { var base; @@ -33,10 +33,6 @@ }); }; - w.gl.utils.split = function(val) { - return val.split(/,\s*/); - }; - w.gl.utils.extractLast = function(term) { return this.split(term).pop(); }; @@ -67,63 +63,51 @@ }); }; - w.gl.utils.disableButtonIfAnyEmptyField = function(form, form_selector, button_selector) { - var closest_submit, updateButtons; - closest_submit = form.find(button_selector); - updateButtons = function() { - var filled; - filled = true; - form.find('input').filter(form_selector).each(function() { - return filled = this.rstrip($(this).val()) !== "" || !$(this).attr('required'); - }); - if (filled) { - return closest_submit.enable(); - } else { - return closest_submit.disable(); - } - }; - updateButtons(); - return form.keyup(updateButtons); - }; - - w.gl.utils.sanitize = function(str) { - return str.replace(/<(?:.|\n)*?>/gm, ''); - }; - - w.gl.utils.unbindEvents = function() { - return $(document).off('scroll'); - }; + // automatically adjust scroll position for hash urls taking the height of the navbar into account + // https://github.com/twitter/bootstrap/issues/1768 + w.gl.utils.handleLocationHash = function() { + var hash = w.gl.utils.getLocationHash(); + if (!hash) return; - w.gl.utils.shiftWindow = function() { - return w.scrollBy(0, -100); - }; + var navbar = document.querySelector('.navbar-gitlab'); + var subnav = document.querySelector('.layout-nav'); + var fixedTabs = document.querySelector('.js-tabs-affix'); + var adjustment = 0; + if (navbar) adjustment -= navbar.offsetHeight; + if (subnav) adjustment -= subnav.offsetHeight; - gl.utils.updateTooltipTitle = function($tooltipEl, newTitle) { - return $tooltipEl.tooltip('destroy').attr('title', newTitle).tooltip('fixTitle'); - }; - gl.utils.preventDisabledButtons = function() { - return $('.btn').click(function(e) { - if ($(this).hasClass('disabled')) { - e.preventDefault(); - e.stopImmediatePropagation(); - return false; + // scroll to user-generated markdown anchor if we cannot find a match + if (document.getElementById(hash) === null) { + var target = document.getElementById('user-content-' + hash); + if (target && target.scrollIntoView) { + target.scrollIntoView(true); + window.scrollBy(0, adjustment); } - }); + } else { + // only adjust for fixedTabs when not targeting user-generated content + if (fixedTabs) { + adjustment -= fixedTabs.offsetHeight; + } + window.scrollBy(0, adjustment); + } }; + gl.utils.getPagePath = function() { return $('body').data('page').split(':')[0]; }; + gl.utils.parseUrl = function (url) { var parser = document.createElement('a'); parser.href = url; return parser; }; - gl.utils.cleanupBeforeFetch = function() { - // Unbind scroll events - $(document).off('scroll'); - // Close any open tooltips - $('.has-tooltip, [data-toggle="tooltip"]').tooltip('destroy'); + + gl.utils.parseUrlPathname = function (url) { + var parsedUrl = gl.utils.parseUrl(url); + // parsedUrl.pathname will return an absolute path for Firefox and a relative path for IE11 + // We have to make sure we always have an absolute path. + return parsedUrl.pathname.charAt(0) === '/' ? parsedUrl.pathname : '/' + parsedUrl.pathname; }; gl.utils.isMetaKey = function(e) { diff --git a/app/assets/javascripts/lib/utils/custom_event_polyfill.js.es6 b/app/assets/javascripts/lib/utils/custom_event_polyfill.js.es6 new file mode 100644 index 00000000000..5ae978010c9 --- /dev/null +++ b/app/assets/javascripts/lib/utils/custom_event_polyfill.js.es6 @@ -0,0 +1,12 @@ +/** + * CustomEvent support for IE + */ +if (typeof window.CustomEvent !== 'function') { + window.CustomEvent = function CustomEvent(e, params) { + const options = params || { bubbles: false, cancelable: false, detail: undefined }; + const evt = document.createEvent('CustomEvent'); + evt.initCustomEvent(e, options.bubbles, options.cancelable, options.detail); + return evt; + }; + window.CustomEvent.prototype = window.Event.prototype; +} diff --git a/app/assets/javascripts/lib/utils/datetime_utility.js b/app/assets/javascripts/lib/utils/datetime_utility.js index d480fdc882b..e8e502694d6 100644 --- a/app/assets/javascripts/lib/utils/datetime_utility.js +++ b/app/assets/javascripts/lib/utils/datetime_utility.js @@ -1,4 +1,10 @@ -/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-var, no-param-reassign, no-cond-assign, no-undef, comma-dangle, no-unused-expressions, prefer-template, padded-blocks, max-len */ +/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-var, no-param-reassign, no-cond-assign, comma-dangle, no-unused-expressions, prefer-template, padded-blocks, max-len */ +/* global timeago */ +/* global dateFormat */ + +/*= require timeago */ +/*= require date.format */ + (function() { (function(w) { var base; @@ -23,7 +29,7 @@ setTimeago = true; } - $timeagoEls.each(function() { + $timeagoEls.filter(':not([data-timeago-rendered])').each(function() { var $el = $(this); $el.attr('title', gl.utils.formatDate($el.attr('datetime'))); @@ -33,6 +39,8 @@ template: '<div class="tooltip local-timeago" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>' }); } + + $el.attr('data-timeago-rendered', true); gl.utils.renderTimeago($el); }); }; diff --git a/app/assets/javascripts/lib/utils/notify.js b/app/assets/javascripts/lib/utils/notify.js index d0fe69260a5..3c9ad0e67c8 100644 --- a/app/assets/javascripts/lib/utils/notify.js +++ b/app/assets/javascripts/lib/utils/notify.js @@ -1,4 +1,5 @@ -/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-var, one-var, one-var-declaration-per-line, consistent-return, no-undef, prefer-arrow-callback, no-return-assign, object-shorthand, comma-dangle, no-param-reassign, padded-blocks, max-len */ +/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-var, one-var, one-var-declaration-per-line, consistent-return, prefer-arrow-callback, no-return-assign, object-shorthand, comma-dangle, no-param-reassign, padded-blocks, max-len */ + (function() { (function(w) { var notificationGranted, notifyMe, notifyPermissions; diff --git a/app/assets/javascripts/lib/utils/timeago.js b/app/assets/javascripts/lib/utils/timeago.js deleted file mode 100644 index edf0a612374..00000000000 --- a/app/assets/javascripts/lib/utils/timeago.js +++ /dev/null @@ -1,239 +0,0 @@ -/* eslint-disable no-unused-expressions, wrap-iife, func-names, curly, no-param-reassign, no-trailing-spaces, prefer-arrow-callback, no-var, one-var, quote-props, space-before-function-paren, vars-on-top, radix, prefer-template, space-infix-ops, no-use-before-define, newline-per-chained-call, no-useless-escape, no-nested-ternary, indent, no-undef, no-plusplus, one-var-declaration-per-line, operator-assignment, consistent-return, keyword-spacing, max-len, space-unary-ops, no-shadow, no-restricted-syntax, guard-for-in, eol-last, max-len */ - -/** - * Copyright (c) 2016 hustcc - * License: MIT - * Version: v2.0.2 - * https://github.com/hustcc/timeago.js - * This is a forked from (https://gitlab.com/ClemMakesApps/timeago.js) -**/ -/* eslint-disable */ -/* jshint expr: true */ -!function (root, factory) { - if (typeof module === 'object' && module.exports) - module.exports = factory(root); - else - root.timeago = factory(root); -}(typeof window !== 'undefined' ? window : this, -function () { - var cnt = 0, // the timer counter, for timer key - indexMapEn = 'second_minute_hour_day_week_month_year'.split('_'), - - // build-in locales: en & zh_CN - locales = { - 'en': function(number, index) { - if (index === 0) return ['just now', 'right now']; - var unit = indexMapEn[parseInt(index / 2)]; - if (number > 1) unit += 's'; - return [number + ' ' + unit + ' ago', 'in ' + number + ' ' + unit]; - }, - }, - // second, minute, hour, day, week, month, year(365 days) - SEC_ARRAY = [60, 60, 24, 7, 365/7/12, 12], - SEC_ARRAY_LEN = 6, - ATTR_DATETIME = 'datetime'; - - // format Date / string / timestamp to Date instance. - function toDate(input) { - if (input instanceof Date) return input; - if (!isNaN(input)) return new Date(toInt(input)); - if (/^\d+$/.test(input)) return new Date(toInt(input, 10)); - input = (input || '').trim().replace(/\.\d+/, '') // remove milliseconds - .replace(/-/, '/').replace(/-/, '/') - .replace(/T/, ' ').replace(/Z/, ' UTC') - .replace(/([\+\-]\d\d)\:?(\d\d)/, ' $1$2'); // -04:00 -> -0400 - return new Date(input); - } - // change f into int, remove Decimal. just for code compression - function toInt(f) { - return parseInt(f); - } - // format the diff second to *** time ago, with setting locale - function formatDiff(diff, locale, defaultLocale) { - // if locale is not exist, use defaultLocale. - // if defaultLocale is not exist, use build-in `en`. - // be sure of no error when locale is not exist. - locale = locales[locale] ? locale : (locales[defaultLocale] ? defaultLocale : 'en'); - // if (! locales[locale]) locale = defaultLocale; - var i = 0; - agoin = diff < 0 ? 1 : 0; // timein or timeago - diff = Math.abs(diff); - - for (; diff >= SEC_ARRAY[i] && i < SEC_ARRAY_LEN; i++) { - diff /= SEC_ARRAY[i]; - } - diff = toInt(diff); - i *= 2; - - if (diff > (i === 0 ? 9 : 1)) i += 1; - return locales[locale](diff, i)[agoin].replace('%s', diff); - } - // calculate the diff second between date to be formated an now date. - function diffSec(date, nowDate) { - nowDate = nowDate ? toDate(nowDate) : new Date(); - return (nowDate - toDate(date)) / 1000; - } - /** - * nextInterval: calculate the next interval time. - * - diff: the diff sec between now and date to be formated. - * - * What's the meaning? - * diff = 61 then return 59 - * diff = 3601 (an hour + 1 second), then return 3599 - * make the interval with high performace. - **/ - function nextInterval(diff) { - var rst = 1, i = 0, d = Math.abs(diff); - for (; diff >= SEC_ARRAY[i] && i < SEC_ARRAY_LEN; i++) { - diff /= SEC_ARRAY[i]; - rst *= SEC_ARRAY[i]; - } - // return leftSec(d, rst); - d = d % rst; - d = d ? rst - d : rst; - return Math.ceil(d); - } - // get the datetime attribute, jQuery and DOM - function getDateAttr(node) { - if (node.getAttribute) return node.getAttribute(ATTR_DATETIME); - if(node.attr) return node.attr(ATTR_DATETIME); - } - /** - * timeago: the function to get `timeago` instance. - * - nowDate: the relative date, default is new Date(). - * - defaultLocale: the default locale, default is en. if your set it, then the `locale` parameter of format is not needed of you. - * - * How to use it? - * var timeagoLib = require('timeago.js'); - * var timeago = timeagoLib(); // all use default. - * var timeago = timeagoLib('2016-09-10'); // the relative date is 2016-09-10, so the 2016-09-11 will be 1 day ago. - * var timeago = timeagoLib(null, 'zh_CN'); // set default locale is `zh_CN`. - * var timeago = timeagoLib('2016-09-10', 'zh_CN'); // the relative date is 2016-09-10, and locale is zh_CN, so the 2016-09-11 will be 1天前. - **/ - function Timeago(nowDate, defaultLocale) { - var timers = {}; // real-time render timers - // if do not set the defaultLocale, set it with `en` - if (! defaultLocale) defaultLocale = 'en'; // use default build-in locale - // what the timer will do - function doRender(node, date, locale, cnt) { - var diff = diffSec(date, nowDate); - node.innerHTML = formatDiff(diff, locale, defaultLocale); - // waiting %s seconds, do the next render - timers['k' + cnt] = setTimeout(function() { - doRender(node, date, locale, cnt); - }, nextInterval(diff) * 1000); - } - /** - * nextInterval: calculate the next interval time. - * - diff: the diff sec between now and date to be formated. - * - * What's the meaning? - * diff = 61 then return 59 - * diff = 3601 (an hour + 1 second), then return 3599 - * make the interval with high performace. - **/ - // this.nextInterval = function(diff) { // for dev test - // var rst = 1, i = 0, d = Math.abs(diff); - // for (; diff >= SEC_ARRAY[i] && i < SEC_ARRAY_LEN; i++) { - // diff /= SEC_ARRAY[i]; - // rst *= SEC_ARRAY[i]; - // } - // // return leftSec(d, rst); - // d = d % rst; - // d = d ? rst - d : rst; - // return Math.ceil(d); - // }; // for dev test - /** - * format: format the date to *** time ago, with setting or default locale - * - date: the date / string / timestamp to be formated - * - locale: the formated string's locale name, e.g. en / zh_CN - * - * How to use it? - * var timeago = require('timeago.js')(); - * timeago.format(new Date(), 'pl'); // Date instance - * timeago.format('2016-09-10', 'fr'); // formated date string - * timeago.format(1473473400269); // timestamp with ms - **/ - this.format = function(date, locale) { - return formatDiff(diffSec(date, nowDate), locale, defaultLocale); - }; - /** - * render: render the DOM real-time. - * - nodes: which nodes will be rendered. - * - locale: the locale name used to format date. - * - * How to use it? - * var timeago = new require('timeago.js')(); - * // 1. javascript selector - * timeago.render(document.querySelectorAll('.need_to_be_rendered')); - * // 2. use jQuery selector - * timeago.render($('.need_to_be_rendered'), 'pl'); - * - * Notice: please be sure the dom has attribute `datetime`. - **/ - this.render = function(nodes, locale) { - if (nodes.length === undefined) nodes = [nodes]; - for (var i = 0; i < nodes.length; i++) { - doRender(nodes[i], getDateAttr(nodes[i]), locale, ++ cnt); // render item - } - }; - /** - * cancel: cancel all the timers which are doing real-time render. - * - * How to use it? - * var timeago = new require('timeago.js')(); - * timeago.render(document.querySelectorAll('.need_to_be_rendered')); - * timeago.cancel(); // will stop all the timer, stop render in real time. - **/ - this.cancel = function() { - for (var key in timers) { - clearTimeout(timers[key]); - } - timers = {}; - }; - /** - * setLocale: set the default locale name. - * - * How to use it? - * var timeago = require('timeago.js'); - * timeago = new timeago(); - * timeago.setLocale('fr'); - **/ - this.setLocale = function(locale) { - defaultLocale = locale; - }; - return this; - } - /** - * timeago: the function to get `timeago` instance. - * - nowDate: the relative date, default is new Date(). - * - defaultLocale: the default locale, default is en. if your set it, then the `locale` parameter of format is not needed of you. - * - * How to use it? - * var timeagoLib = require('timeago.js'); - * var timeago = timeagoLib(); // all use default. - * var timeago = timeagoLib('2016-09-10'); // the relative date is 2016-09-10, so the 2016-09-11 will be 1 day ago. - * var timeago = timeagoLib(null, 'zh_CN'); // set default locale is `zh_CN`. - * var timeago = timeagoLib('2016-09-10', 'zh_CN'); // the relative date is 2016-09-10, and locale is zh_CN, so the 2016-09-11 will be 1天前. - **/ - function timeagoFactory(nowDate, defaultLocale) { - return new Timeago(nowDate, defaultLocale); - } - /** - * register: register a new language locale - * - locale: locale name, e.g. en / zh_CN, notice the standard. - * - localeFunc: the locale process function - * - * How to use it? - * var timeagoLib = require('timeago.js'); - * - * timeagoLib.register('the locale name', the_locale_func); - * // or - * timeagoLib.register('pl', require('timeago.js/locales/pl')); - **/ - timeagoFactory.register = function(locale, localeFunc) { - locales[locale] = localeFunc; - }; - - return timeagoFactory; -});
\ No newline at end of file |