Merge remote-tracking branch 'ce/master' into ce-to-ee

CHANGELOG.md

@@ -12,6 +12,7 @@ entry.
 - Trim leading and trailing whitespace on project_path (Linus Thiel)
 - Prevent award emoji via notes for issues/MRs authored by user (barthc)
 - Adds support for the `token` attribute in project hooks API (Gauvain Pocentek)
+- Change auto selection behaviour of emoji and slash commands to be more UX/Type friendly (Yann Gravrand)
 - Adds an optional path parameter to the Commits API to filter commits by path (Luis HGO)
 - Fix Markdown styling inside reference links (Jan Zdráhal)
 - Create new issue board list after creating a new label
@@ -73,13 +74,34 @@ entry.
 - Updated commit SHA styling on the branches page.
 - Fix 404 when visit /projects page
+## 8.13.5 (2016-11-08)
+
+- Restore unauthenticated access to public container registries
+- Fix showing pipeline status for a given commit from correct branch. !7034
+- Only skip group when it's actually a group in the "Share with group" select. !7262
+- Introduce round-robin project creation to spread load over multiple shards. !7266
+- Ensure merge request's "remove branch" accessors return booleans. !7267
+- Ensure external users are not able to clone disabled repositories.
+- Fix XSS issue in Markdown autolinker.
+- Respect event visibility in Gitlab::ContributionsCalendar.
+- Honour issue and merge request visibility in their respective finders.
+- Disable reference Markdown for unavailable features.
+- Fix lightweight tags not processed correctly by GitTagPushService. !6532
+- Allow owners to fetch source code in CI builds. !6943
+- Return conflict error in label API when title is taken by group label. !7014
+- Reduce the overhead to calculate number of open/closed issues and merge requests within the group or project. !7123
+- Fix builds tab visibility. !7178
+- Fix project features default values. !7181
+
+## 8.13.4
+
+- Pulled due to packaging error.
+
 ## 8.13.3 (2016-11-02)
 - Removes any symlinks before importing a project export file. CVE-2016-9086
 - Fixed Import/Export foreign key issue to do with project members.
 - Fix relative links in Markdown wiki when displayed in "Project" tab !7218
-- Reduce the overhead to calculate number of open/closed issues and merge requests within the group or project
-- Fix project features default values
 - Changed build dropdown list length to be 6,5 builds long in the pipeline graph
 ## 8.13.2 (2016-10-31)
@@ -270,6 +292,10 @@ entry.
 - Fix broken Project API docs (Takuya Noguchi)
 - Migrate invalid project members (owner -> master)
+## 8.12.9 (2016-11-07)
+
+- Fix XSS issue in Markdown autolinker
+
 ## 8.12.8 (2016-11-02)
 - Removes any symlinks before importing a project export file. CVE-2016-9086
@@ -534,6 +560,10 @@ entry.
   - Fix non-master branch readme display in tree view
   - Add UX improvements for merge request version diffs
+## 8.11.11 (2016-11-07)
+
+- Fix XSS issue in Markdown autolinker
+
 ## 8.11.10 (2016-11-02)
 - Removes any symlinks before importing a project export file. CVE-2016-9086

app/assets/javascripts/activities.js

@@ -13,12 +13,12 @@
     }
     Activities.prototype.updateTooltips = function() {
-      return gl.utils.localTimeAgo($('.js-timeago', '.content_list'));
+      gl.utils.localTimeAgo($('.js-timeago', '.content_list'));
     };
     Activities.prototype.reloadActivities = function() {
       $(".content_list").html('');
-      return Pager.init(20, true);
+      Pager.init(20, true, false, this.updateTooltips);
     };
     Activities.prototype.toggleFilter = function(sender) {

app/assets/javascripts/application.js

@@ -13,7 +13,6 @@
 /*= require jquery-ui/sortable */
 /*= require jquery_ujs */
 /*= require jquery.endless-scroll */
-/*= require jquery.timeago */
 /*= require jquery.highlight */
 /*= require jquery.waitforimages */
 /*= require jquery.atwho */
@@ -199,9 +198,6 @@
         warningMessage: warningMessage
       });
     });
-    $document.on('click', 'button', function () {
-      return $(this).blur();
-    });
     $('input[type="search"]').each(function () {
       var $this = $(this);
       $this.attr('value', $this.val());
@@ -243,8 +239,5 @@
     // bind sidebar events
     new gl.Sidebar();
-
-    // Custom time ago
-    gl.utils.shortTimeAgo($('.js-short-timeago'));
   });
 }).call(this);

app/assets/javascripts/build.js

@@ -8,56 +8,55 @@
     Build.state = null;
     function Build(options) {
-      this.page_url = options.page_url;
-      this.build_url = options.build_url;
-      this.build_status = options.build_status;
+      options = options || $('.js-build-options').data();
+      this.pageUrl = options.pageUrl;
+      this.buildUrl = options.buildUrl;
+      this.buildStatus = options.buildStatus;
       this.state = options.state1;
-      this.build_stage = options.build_stage;
-      this.hideSidebar = bind(this.hideSidebar, this);
-      this.toggleSidebar = bind(this.toggleSidebar, this);
+      this.buildStage = options.buildStage;
       this.updateDropdown = bind(this.updateDropdown, this);
       this.$document = $(document);
       clearInterval(Build.interval);
       // Init breakpoint checker
       this.bp = Breakpoints.get();
+
       this.initSidebar();
-      this.populateJobs(this.build_stage);
-      this.updateStageDropdownText(this.build_stage);
-      $(window).off('resize.build').on('resize.build', this.hideSidebar);
+      this.$buildScroll = $('#js-build-scroll');
+      this.populateJobs(this.buildStage);
+      this.updateStageDropdownText(this.buildStage);
+      this.sidebarOnResize();
+      this.$document.off('click', '.js-sidebar-build-toggle').on('click', '.js-sidebar-build-toggle', this.sidebarOnClick.bind(this));
       this.$document.off('click', '.stage-item').on('click', '.stage-item', this.updateDropdown);
-      $('#js-build-scroll > a').off('click').on('click', this.stepTrace);
+      $(window).off('resize.build').on('resize.build', this.sidebarOnResize.bind(this));
+      $('a', this.$buildScroll).off('click.stepTrace').on('click.stepTrace', this.stepTrace);
       this.updateArtifactRemoveDate();
       if ($('#build-trace').length) {
         this.getInitialBuildTrace();
-        this.initScrollButtons();
+        this.initScrollButtonAffix();
       }
-      if (this.build_status === "running" || this.build_status === "pending") {
+      if (this.buildStatus === "running" || this.buildStatus === "pending") {
+        // Bind autoscroll button to follow build output
         $('#autoscroll-button').on('click', function() {
           var state;
           state = $(this).data("state");
           if ("enabled" === state) {
             $(this).data("state", "disabled");
-            return $(this).text("enable autoscroll");
+            return $(this).text("Enable autoscroll");
           } else {
             $(this).data("state", "enabled");
-            return $(this).text("disable autoscroll");
+            return $(this).text("Disable autoscroll");
           }
-        //
-        // Bind autoscroll button to follow build output
-        //
         });
         Build.interval = setInterval((function(_this) {
+          // Check for new build output if user still watching build page
+          // Only valid for runnig build when output changes during time
           return function() {
-            if (window.location.href.split("#").first() === _this.page_url) {
+            if (_this.location() === _this.pageUrl) {
               return _this.getBuildTrace();
             }
           };
-        //
-        // Check for new build output if user still watching build page
-        // Only valid for runnig build when output changes during time
-        //
         })(this), 4000);
       }
     }
@@ -72,20 +71,23 @@
         top: this.sidebarTranslationLimits.max
       });
       this.$sidebar.niceScroll();
-      this.hideSidebar();
       this.$document.off('click', '.js-sidebar-build-toggle').on('click', '.js-sidebar-build-toggle', this.toggleSidebar);
       this.$document.off('scroll.translateSidebar').on('scroll.translateSidebar', this.translateSidebar.bind(this));
     };
+    Build.prototype.location = function() {
+      return window.location.href.split("#")[0];
+    };
+
     Build.prototype.getInitialBuildTrace = function() {
       var removeRefreshStatuses = ['success', 'failed', 'canceled', 'skipped']
       return $.ajax({
-        url: this.build_url,
+        url: this.buildUrl,
         dataType: 'json',
-        success: function(build_data) {
-          $('.js-build-output').html(build_data.trace_html);
-          if (removeRefreshStatuses.indexOf(build_data.status) >= 0) {
+        success: function(buildData) {
+          $('.js-build-output').html(buildData.trace_html);
+          if (removeRefreshStatuses.indexOf(buildData.status) >= 0) {
             return $('.js-build-refresh').remove();
           }
         }
@@ -94,7 +96,7 @@
     Build.prototype.getBuildTrace = function() {
       return $.ajax({
-        url: this.page_url + "/trace.json?state=" + (encodeURIComponent(this.state)),
+        url: this.pageUrl + "/trace.json?state=" + (encodeURIComponent(this.state)),
         dataType: "json",
         success: (function(_this) {
           return function(log) {
@@ -108,8 +110,8 @@
                 $('.js-build-output').html(log.html);
               }
               return _this.checkAutoscroll();
-            } else if (log.status !== _this.build_status) {
-              return Turbolinks.visit(_this.page_url);
+            } else if (log.status !== _this.buildStatus) {
+              return Turbolinks.visit(_this.pageUrl);
             }
           };
         })(this)
@@ -122,12 +124,11 @@
       }
     };
-    Build.prototype.initScrollButtons = function() {
-      var $body, $buildScroll, $buildTrace;
-      $buildScroll = $('#js-build-scroll');
+    Build.prototype.initScrollButtonAffix = function() {
+      var $body, $buildTrace;
       $body = $('body');
       $buildTrace = $('#build-trace');
-      return $buildScroll.affix({
+      return this.$buildScroll.affix({
         offset: {
           bottom: function() {
             return $body.outerHeight() - ($buildTrace.outerHeight() + $buildTrace.offset().top);
@@ -136,18 +137,12 @@
       });
     };
-    Build.prototype.shouldHideSidebar = function() {
+    Build.prototype.shouldHideSidebarForViewport = function() {
       var bootstrapBreakpoint;
       bootstrapBreakpoint = this.bp.getBreakpointSize();
       return bootstrapBreakpoint === 'xs' || bootstrapBreakpoint === 'sm';
     };
-    Build.prototype.toggleSidebar = function() {
-      if (this.shouldHideSidebar()) {
-        return this.$sidebar.toggleClass('right-sidebar-expanded right-sidebar-collapsed');
-      }
-    };
-
     Build.prototype.translateSidebar = function(e) {
       var newPosition = this.sidebarTranslationLimits.max - (document.body.scrollTop || document.documentElement.scrollTop);
       if (newPosition < this.sidebarTranslationLimits.min) newPosition = this.sidebarTranslationLimits.min;
@@ -156,12 +151,20 @@
       });
     };
-    Build.prototype.hideSidebar = function() {
-      if (this.shouldHideSidebar()) {
-        return this.$sidebar.removeClass('right-sidebar-expanded').addClass('right-sidebar-collapsed');
-      } else {
-        return this.$sidebar.removeClass('right-sidebar-collapsed').addClass('right-sidebar-expanded');
-      }
+    Build.prototype.toggleSidebar = function(shouldHide) {
+      var shouldShow = typeof shouldHide === 'boolean' ? !shouldHide : undefined;
+      this.$buildScroll.toggleClass('sidebar-expanded', shouldShow)
+        .toggleClass('sidebar-collapsed', shouldHide);
+      this.$sidebar.toggleClass('right-sidebar-expanded', shouldShow)
+        .toggleClass('right-sidebar-collapsed', shouldHide);
+    };
+
+    Build.prototype.sidebarOnResize = function() {
+      this.toggleSidebar(this.shouldHideSidebarForViewport());
+    };
+
+    Build.prototype.sidebarOnClick = function() {
+      if (this.shouldHideSidebarForViewport()) this.toggleSidebar();
     };
     Build.prototype.updateArtifactRemoveDate = function() {
@@ -169,7 +172,7 @@
       $date = $('.js-artifacts-remove');
       if ($date.length) {
         date = $date.text();
-        return $date.text($.timefor(new Date(date.replace(/([0-9]+)-([0-9]+)-([0-9]+)/g, '$1/$2/$3')), ' '));
+        return $date.text(gl.utils.timefor(new Date(date.replace(/([0-9]+)-([0-9]+)-([0-9]+)/g, '$1/$2/$3')), ' '));
       }
     };

app/assets/javascripts/compare.js

@@ -80,7 +80,8 @@
         success: function(html) {
           loading.hide();
           $target.html(html);
-          return $('.js-timeago', $target).timeago();
+          var className = '.' + $target[0].className.replace(' ', '.');
+          gl.utils.localTimeAgo($('.js-timeago', className));
         }
       });
     };

app/assets/javascripts/diff.js

@@ -43,10 +43,6 @@
             bottom: unfoldBottom,
             offset: offset,
             unfold: unfold,
-            // indent is used to compensate for single space indent to fit
-            // '+' and '-' prepended to diff lines,
-            // see https://gitlab.com/gitlab-org/gitlab-ce/issues/707
-            indent: 1,
             view: file.data('view')
           };
           return $.get(link, params, function(response) {

app/assets/javascripts/dispatcher.js.es6

@@ -29,6 +29,9 @@
         case 'projects:boards:index':
           shortcut_handler = new ShortcutsNavigation();
           break;
+        case 'projects:builds:show':
+          new Build();
+          break;
         case 'projects:merge_requests:index':
         case 'projects:issues:index':
           Issuable.init();

app/assets/javascripts/gfm_auto_complete.js.es6

@@ -34,6 +34,8 @@
     },
     DefaultOptions: {
       sorter: function(query, items, searchKey) {
+        // Highlight first item only if at least one char was typed
+        this.setting.highlightFirst = query.length > 0;
         if ((items[0].name != null) && items[0].name === 'loading') {
           return items;
         }
@@ -182,6 +184,7 @@
         insertTpl: '${atwho-at}"${title}"',
         data: ['loading'],
         callbacks: {
+          sorter: this.DefaultOptions.sorter,
           beforeSave: function(milestones) {
             return $.map(milestones, function(m) {
               if (m.title == null) {
@@ -236,6 +239,7 @@
         displayTpl: this.Labels.template,
         insertTpl: '${atwho-at}${title}',
         callbacks: {
+          sorter: this.DefaultOptions.sorter,
           beforeSave: function(merges) {
             var sanitizeLabelTitle;
             sanitizeLabelTitle = function(title) {

app/assets/javascripts/lib/utils/common_utils.js

@@ -119,31 +119,12 @@
       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');
     };
-
-    return jQuery.timefor = function(time, suffix, expiredLabel) {
-      var suffixFromNow, timefor;
-      if (!time) {
-        return '';
-      }
-      suffix || (suffix = 'remaining');
-      expiredLabel || (expiredLabel = 'Past due');
-      jQuery.timeago.settings.allowFuture = true;
-      suffixFromNow = jQuery.timeago.settings.strings.suffixFromNow;
-      jQuery.timeago.settings.strings.suffixFromNow = suffix;
-      timefor = $.timeago(time);
-      if (timefor.indexOf('ago') > -1) {
-        timefor = expiredLabel;
-      }
-      jQuery.timeago.settings.strings.suffixFromNow = suffixFromNow;
-      return timefor;
-    };
   })(window);
 }).call(this);

app/assets/javascripts/lib/utils/datetime_utility.js

@@ -22,51 +22,64 @@
       if (setTimeago == null) {
         setTimeago = true;
       }
+
       $timeagoEls.each(function() {
-        var $el;
-        $el = $(this);
-        return $el.attr('title', gl.utils.formatDate($el.attr('datetime')));
+        var $el = $(this);
+        $el.attr('title', gl.utils.formatDate($el.attr('datetime')));
+
+        if (setTimeago) {
+          // Recreate with custom template
+          $el.tooltip({
+            template: '<div class="tooltip local-timeago" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>'
+          });
+        }
+        gl.utils.renderTimeago($el);
       });
-      if (setTimeago) {
-        $timeagoEls.timeago();
-        $timeagoEls.tooltip('destroy');
-        // Recreate with custom template
-        return $timeagoEls.tooltip({
-          template: '<div class="tooltip local-timeago" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>'
-        });
-      }
     };
-    w.gl.utils.shortTimeAgo = function($el) {
-      var shortLocale, tmpLocale;
-      shortLocale = {
-        prefixAgo: null,
-        prefixFromNow: null,
-        suffixAgo: 'ago',
-        suffixFromNow: 'from now',
-        seconds: '1 min',
-        minute: '1 min',
-        minutes: '%d mins',
-        hour: '1 hr',
-        hours: '%d hrs',
-        day: '1 day',
-        days: '%d days',
-        month: '1 month',
-        months: '%d months',
-        year: '1 year',
-        years: '%d years',
-        wordSeparator: ' ',
-        numbers: []
+    w.gl.utils.getTimeago = function() {
+      var locale = function(number, index) {
+        return [
+          ['less than a minute ago', 'a while'],
+          ['less than a minute ago', 'in %s seconds'],
+          ['about a minute ago', 'in 1 minute'],
+          ['%s minutes ago', 'in %s minutes'],
+          ['about an hour ago', 'in 1 hour'],
+          ['about %s hours ago', 'in %s hours'],
+          ['a day ago', 'in 1 day'],
+          ['%s days ago', 'in %s days'],
+          ['a week ago', 'in 1 week'],
+          ['%s weeks ago', 'in %s weeks'],
+          ['a month ago', 'in 1 month'],
+          ['%s months ago', 'in %s months'],
+          ['a year ago', 'in 1 year'],
+          ['%s years ago', 'in %s years']
+        ][index];
       };
-      tmpLocale = $.timeago.settings.strings;
-      $el.each(function(el) {
-        var $el1;
-        $el1 = $(this);
-        return $el1.attr('title', gl.utils.formatDate($el.attr('datetime')));
-      });
-      $.timeago.settings.strings = shortLocale;
-      $el.timeago();
-      $.timeago.settings.strings = tmpLocale;
+
+      timeago.register('gl_en', locale);
+      return timeago();
+    };
+
+    w.gl.utils.timeFor = function(time, suffix, expiredLabel) {
+      var timefor;
+      if (!time) {
+        return '';
+      }
+      suffix || (suffix = 'remaining');
+      expiredLabel || (expiredLabel = 'Past due');
+      timefor = gl.utils.getTimeago().format(time).replace('in', '');
+      if (timefor.indexOf('ago') > -1) {
+        timefor = expiredLabel;
+      } else {
+        timefor = timefor.trim() + ' ' + suffix;
+      }
+      return timefor;
+    };
+
+    w.gl.utils.renderTimeago = function($element) {
+      var timeagoInstance = gl.utils.getTimeago();
+      timeagoInstance.render($element, 'gl_en');
     };
     w.gl.utils.getDayDifference = function(a, b) {
@@ -75,7 +88,7 @@
       var date2 = Date.UTC(b.getFullYear(), b.getMonth(), b.getDate());
       return Math.floor((date2 - date1) / millisecondsPerDay);
-    }
+    };
   })(window);

app/assets/javascripts/lib/utils/timeago.js

+/**
+ * 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

app/assets/javascripts/merge_request_widget.js.es6

@@ -235,7 +235,7 @@
         }
         if (environment.deployed_at && environment.deployed_at_formatted) {
-          environment.deployed_at = $.timeago(environment.deployed_at) + '.';
+          environment.deployed_at = gl.utils.getTimeago(environment.deployed_at) + '.';
         } else {
           $('.js-environment-timeago', $template).remove();
           environment.name += '.';

app/assets/javascripts/milestone_select.js

@@ -162,7 +162,7 @@
                 if (data.milestone != null) {
                   data.milestone.namespace = _this.currentProject.namespace;
                   data.milestone.path = _this.currentProject.path;
-                  data.milestone.remaining = $.timefor(data.milestone.due_date);
+                  data.milestone.remaining = gl.utils.timeFor(data.milestone.due_date);
                   $value.html(milestoneLinkTemplate(data.milestone));
                   return $sidebarCollapsedValue.find('span').html(collapsedSidebarLabelTemplate(data.milestone));
                 } else {

app/assets/stylesheets/framework/buttons.scss

@@ -6,7 +6,6 @@
   &:focus,
   &:active {
-    outline: none;
     background-color: $btn-active-gray;
     box-shadow: $gl-btn-active-background;
   }
@@ -267,10 +266,6 @@
       outline: none;
     }
-    &:focus {
-      outline: none;
-    }
-
     &:active {
       outline: none;
     }

app/assets/stylesheets/framework/dropdowns.scss

@@ -38,7 +38,6 @@
   text-align: left;
   border: 1px solid $border-color;
   border-radius: $border-radius-base;
-  outline: 0;
   text-overflow: ellipsis;
   white-space: nowrap;
   overflow: hidden;
@@ -55,6 +54,10 @@
     }
   }
+  &.no-outline {
+    outline: 0;
+  }
+
   &:hover, {
     border-color: $dropdown-toggle-hover-border-color;

app/assets/stylesheets/framework/header.scss

@@ -100,10 +100,6 @@ header {
       &:hover {
         background-color: $btn-gray-hover;
       }
-
-      &:focus {
-        outline: none;
-      }
     }
   }

app/assets/stylesheets/framework/nav.scss

@@ -58,7 +58,6 @@
       &:active,
       &:focus {
         text-decoration: none;
-        outline: none;
       }
     }

app/assets/stylesheets/framework/sidebar.scss

@@ -83,7 +83,6 @@
       display: block;
       text-decoration: none;
       font-weight: normal;
-      outline: none;
       &:hover,
       &:active,

app/assets/stylesheets/pages/builds.scss

@@ -14,18 +14,10 @@
     }
   }
-  .autoscroll-container {
-    position: fixed;
-    bottom: 20px;
-    right: 20px;
-    z-index: 100;
-  }
-
   .scroll-controls {
-    &.affix-top {
-      position: absolute;
-      top: 10px;
-      right: 25px;
+    .scroll-step {
+      width: 31px;
+      margin: 0 0 0 auto;
     }
     &.affix-bottom {
@@ -34,13 +26,13 @@
     }
     &.affix {
-      right: 30px;
+      right: 25px;
       bottom: 15px;
       z-index: 1;
-      @media (min-width: $screen-md-min) {
-        right: 26%;
-      }
+    }
+    &.sidebar-expanded {
+      right: #{$gutter_width + ($gl-padding * 2)};
     }
     a {

app/assets/stylesheets/pages/diff.scss

@@ -92,20 +92,6 @@
         &.noteable_line {
           position: relative;
-
-          &.old {
-            &::before {
-              content: '-';
-              position: absolute;
-            }
-          }
-
-          &.new {
-            &::before {
-              content: '+';
-              position: absolute;
-            }
-          }
         }
         span {
@@ -151,8 +137,9 @@
     .line_content {
       display: block;
       margin: 0;
-      padding: 0 0.5em;
+      padding: 0 1.5em;
       border: none;
+      position: relative;
       &.parallel {
         display: table-cell;
@@ -161,6 +148,22 @@
           word-break: break-all;
         }
       }
+
+      &.old {
+        &::before {
+          content: '-';
+          position: absolute;
+          left: 0.5em;
+        }
+      }
+
+      &.new {
+        &::before {
+          content: '+';
+          position: absolute;
+          left: 0.5em;
+        }
+      }
     }
     .text-file.diff-wrap-lines table .line_holder td span {