From abb60fe20d53bb8bd26d0a07defe84bed2d079b5 Mon Sep 17 00:00:00 2001
From: CJ Cenizal <cj@cenizal.com>
Date: Tue, 5 Jul 2016 19:29:26 -0700
Subject: [PATCH] Remove Bootstrap carousel and slide component styles and
 directives.

---
 .../angular-bootstrap/carousel/carousel.html  |   8 -
 .../angular-bootstrap/carousel/carousel.js    | 293 ------------------
 .../angular-bootstrap/carousel/slide.html     |   7 -
 src/ui/public/angular-bootstrap/index.js      |  16 -
 src/ui/public/styles/bootstrap/bootstrap.less |   1 -
 src/ui/public/styles/bootstrap/carousel.less  | 270 ----------------
 src/ui/public/styles/bootstrap/variables.less |  17 -
 src/ui/public/styles/theme/bootstrap.less     |   1 -
 .../styles/variables/bootstrap-mods.less      |  14 -
 9 files changed, 627 deletions(-)
 delete mode 100755 src/ui/public/angular-bootstrap/carousel/carousel.html
 delete mode 100755 src/ui/public/angular-bootstrap/carousel/carousel.js
 delete mode 100755 src/ui/public/angular-bootstrap/carousel/slide.html
 delete mode 100644 src/ui/public/styles/bootstrap/carousel.less

diff --git a/src/ui/public/angular-bootstrap/carousel/carousel.html b/src/ui/public/angular-bootstrap/carousel/carousel.html
deleted file mode 100755
index 9769b383a6f4d..0000000000000
--- a/src/ui/public/angular-bootstrap/carousel/carousel.html
+++ /dev/null
@@ -1,8 +0,0 @@
-<div ng-mouseenter="pause()" ng-mouseleave="play()" class="carousel" ng-swipe-right="prev()" ng-swipe-left="next()">
-    <ol class="carousel-indicators" ng-show="slides.length > 1">
-        <li ng-repeat="slide in slides track by $index" ng-class="{active: isActive(slide)}" ng-click="select(slide)"></li>
-    </ol>
-    <div class="carousel-inner" ng-transclude></div>
-    <a class="left carousel-control" ng-click="prev()" ng-show="slides.length > 1"><span class="glyphicon glyphicon-chevron-left"></span></a>
-    <a class="right carousel-control" ng-click="next()" ng-show="slides.length > 1"><span class="glyphicon glyphicon-chevron-right"></span></a>
-</div>
diff --git a/src/ui/public/angular-bootstrap/carousel/carousel.js b/src/ui/public/angular-bootstrap/carousel/carousel.js
deleted file mode 100755
index 9d91004da70fc..0000000000000
--- a/src/ui/public/angular-bootstrap/carousel/carousel.js
+++ /dev/null
@@ -1,293 +0,0 @@
-/**
-* @ngdoc overview
-* @name ui.bootstrap.carousel
-*
-* @description
-* AngularJS version of an image carousel.
-*
-*/
-angular.module('ui.bootstrap.carousel', ['ui.bootstrap.transition'])
-.controller('CarouselController', ['$scope', '$timeout', '$interval', '$transition', function ($scope, $timeout, $interval, $transition) {
-  var self = this,
-    slides = self.slides = $scope.slides = [],
-    currentIndex = -1,
-    currentInterval, isPlaying;
-  self.currentSlide = null;
-
-  var destroyed = false;
-  /* direction: "prev" or "next" */
-  self.select = $scope.select = function(nextSlide, direction) {
-    var nextIndex = slides.indexOf(nextSlide);
-    //Decide direction if it's not given
-    if (direction === undefined) {
-      direction = nextIndex > currentIndex ? 'next' : 'prev';
-    }
-    if (nextSlide && nextSlide !== self.currentSlide) {
-      if ($scope.$currentTransition) {
-        $scope.$currentTransition.cancel();
-        //Timeout so ng-class in template has time to fix classes for finished slide
-        $timeout(goNext);
-      } else {
-        goNext();
-      }
-    }
-    function goNext() {
-      // Scope has been destroyed, stop here.
-      if (destroyed) { return; }
-      //If we have a slide to transition from and we have a transition type and we're allowed, go
-      if (self.currentSlide && angular.isString(direction) && !$scope.noTransition && nextSlide.$element) {
-        //We shouldn't do class manip in here, but it's the same weird thing bootstrap does. need to fix sometime
-        nextSlide.$element.addClass(direction);
-        var reflow = nextSlide.$element[0].offsetWidth; //force reflow
-
-        //Set all other slides to stop doing their stuff for the new transition
-        angular.forEach(slides, function(slide) {
-          angular.extend(slide, {direction: '', entering: false, leaving: false, active: false});
-        });
-        angular.extend(nextSlide, {direction: direction, active: true, entering: true});
-        angular.extend(self.currentSlide||{}, {direction: direction, leaving: true});
-
-        $scope.$currentTransition = $transition(nextSlide.$element, {});
-        //We have to create new pointers inside a closure since next & current will change
-        (function(next,current) {
-          $scope.$currentTransition.then(
-            function(){ transitionDone(next, current); },
-            function(){ transitionDone(next, current); }
-          );
-        }(nextSlide, self.currentSlide));
-      } else {
-        transitionDone(nextSlide, self.currentSlide);
-      }
-      self.currentSlide = nextSlide;
-      currentIndex = nextIndex;
-      //every time you change slides, reset the timer
-      restartTimer();
-    }
-    function transitionDone(next, current) {
-      angular.extend(next, {direction: '', active: true, leaving: false, entering: false});
-      angular.extend(current||{}, {direction: '', active: false, leaving: false, entering: false});
-      $scope.$currentTransition = null;
-    }
-  };
-  $scope.$on('$destroy', function () {
-    destroyed = true;
-  });
-
-  /* Allow outside people to call indexOf on slides array */
-  self.indexOfSlide = function(slide) {
-    return slides.indexOf(slide);
-  };
-
-  $scope.next = function() {
-    var newIndex = (currentIndex + 1) % slides.length;
-
-    //Prevent this user-triggered transition from occurring if there is already one in progress
-    if (!$scope.$currentTransition) {
-      return self.select(slides[newIndex], 'next');
-    }
-  };
-
-  $scope.prev = function() {
-    var newIndex = currentIndex - 1 < 0 ? slides.length - 1 : currentIndex - 1;
-
-    //Prevent this user-triggered transition from occurring if there is already one in progress
-    if (!$scope.$currentTransition) {
-      return self.select(slides[newIndex], 'prev');
-    }
-  };
-
-  $scope.isActive = function(slide) {
-     return self.currentSlide === slide;
-  };
-
-  $scope.$watch('interval', restartTimer);
-  $scope.$on('$destroy', resetTimer);
-
-  function restartTimer() {
-    resetTimer();
-    var interval = +$scope.interval;
-    if (!isNaN(interval) && interval > 0) {
-      currentInterval = $interval(timerFn, interval);
-    }
-  }
-
-  function resetTimer() {
-    if (currentInterval) {
-      $interval.cancel(currentInterval);
-      currentInterval = null;
-    }
-  }
-
-  function timerFn() {
-    var interval = +$scope.interval;
-    if (isPlaying && !isNaN(interval) && interval > 0) {
-      $scope.next();
-    } else {
-      $scope.pause();
-    }
-  }
-
-  $scope.play = function() {
-    if (!isPlaying) {
-      isPlaying = true;
-      restartTimer();
-    }
-  };
-  $scope.pause = function() {
-    if (!$scope.noPause) {
-      isPlaying = false;
-      resetTimer();
-    }
-  };
-
-  self.addSlide = function(slide, element) {
-    slide.$element = element;
-    slides.push(slide);
-    //if this is the first slide or the slide is set to active, select it
-    if(slides.length === 1 || slide.active) {
-      self.select(slides[slides.length-1]);
-      if (slides.length == 1) {
-        $scope.play();
-      }
-    } else {
-      slide.active = false;
-    }
-  };
-
-  self.removeSlide = function(slide) {
-    //get the index of the slide inside the carousel
-    var index = slides.indexOf(slide);
-    slides.splice(index, 1);
-    if (slides.length > 0 && slide.active) {
-      if (index >= slides.length) {
-        self.select(slides[index-1]);
-      } else {
-        self.select(slides[index]);
-      }
-    } else if (currentIndex > index) {
-      currentIndex--;
-    }
-  };
-
-}])
-
-/**
- * @ngdoc directive
- * @name ui.bootstrap.carousel.directive:carousel
- * @restrict EA
- *
- * @description
- * Carousel is the outer container for a set of image 'slides' to showcase.
- *
- * @param {number=} interval The time, in milliseconds, that it will take the carousel to go to the next slide.
- * @param {boolean=} noTransition Whether to disable transitions on the carousel.
- * @param {boolean=} noPause Whether to disable pausing on the carousel (by default, the carousel interval pauses on hover).
- *
- * @example
-<example module="ui.bootstrap">
-  <file name="index.html">
-    <carousel>
-      <slide>
-        <img src="http://placekitten.com/150/150" style="margin:auto;">
-        <div class="carousel-caption">
-          <p>Beautiful!</p>
-        </div>
-      </slide>
-      <slide>
-        <img src="http://placekitten.com/100/150" style="margin:auto;">
-        <div class="carousel-caption">
-          <p>D'aww!</p>
-        </div>
-      </slide>
-    </carousel>
-  </file>
-  <file name="demo.css">
-    .carousel-indicators {
-      top: auto;
-      bottom: 15px;
-    }
-  </file>
-</example>
- */
-.directive('carousel', [function() {
-  return {
-    restrict: 'EA',
-    transclude: true,
-    replace: true,
-    controller: 'CarouselController',
-    require: 'carousel',
-    templateUrl: 'template/carousel/carousel.html',
-    scope: {
-      interval: '=',
-      noTransition: '=',
-      noPause: '='
-    }
-  };
-}])
-
-/**
- * @ngdoc directive
- * @name ui.bootstrap.carousel.directive:slide
- * @restrict EA
- *
- * @description
- * Creates a slide inside a {@link ui.bootstrap.carousel.directive:carousel carousel}.  Must be placed as a child of a carousel element.
- *
- * @param {boolean=} active Model binding, whether or not this slide is currently active.
- *
- * @example
-<example module="ui.bootstrap">
-  <file name="index.html">
-<div ng-controller="CarouselDemoCtrl">
-  <carousel>
-    <slide ng-repeat="slide in slides" active="slide.active">
-      <img ng-src="{{slide.image}}" style="margin:auto;">
-      <div class="carousel-caption">
-        <h4>Slide {{$index}}</h4>
-        <p>{{slide.text}}</p>
-      </div>
-    </slide>
-  </carousel>
-  Interval, in milliseconds: <input type="number" ng-model="myInterval">
-  <br />Enter a negative number to stop the interval.
-</div>
-  </file>
-  <file name="script.js">
-function CarouselDemoCtrl($scope) {
-  $scope.myInterval = 5000;
-}
-  </file>
-  <file name="demo.css">
-    .carousel-indicators {
-      top: auto;
-      bottom: 15px;
-    }
-  </file>
-</example>
-*/
-
-.directive('slide', function() {
-  return {
-    require: '^carousel',
-    restrict: 'EA',
-    transclude: true,
-    replace: true,
-    templateUrl: 'template/carousel/slide.html',
-    scope: {
-      active: '=?'
-    },
-    link: function (scope, element, attrs, carouselCtrl) {
-      carouselCtrl.addSlide(scope, element);
-      //when the scope is destroyed then remove the slide from the current slides array
-      scope.$on('$destroy', function() {
-        carouselCtrl.removeSlide(scope);
-      });
-
-      scope.$watch('active', function(active) {
-        if (active) {
-          carouselCtrl.select(scope);
-        }
-      });
-    }
-  };
-});
diff --git a/src/ui/public/angular-bootstrap/carousel/slide.html b/src/ui/public/angular-bootstrap/carousel/slide.html
deleted file mode 100755
index 451e4fba3e04c..0000000000000
--- a/src/ui/public/angular-bootstrap/carousel/slide.html
+++ /dev/null
@@ -1,7 +0,0 @@
-<div ng-class="{
-    'active': leaving || (active && !entering),
-    'prev': (next || active) && direction=='prev',
-    'next': (next || active) && direction=='next',
-    'right': direction=='prev',
-    'left': direction=='next'
-  }" class="item text-center" ng-transclude></div>
diff --git a/src/ui/public/angular-bootstrap/index.js b/src/ui/public/angular-bootstrap/index.js
index 7945c4f25a1be..27ce00243db31 100644
--- a/src/ui/public/angular-bootstrap/index.js
+++ b/src/ui/public/angular-bootstrap/index.js
@@ -19,7 +19,6 @@ angular.module('ui.bootstrap', [
   'ui.bootstrap.alert',
   'ui.bootstrap.bindHtml',
   'ui.bootstrap.buttons',
-  'ui.bootstrap.carousel',
   'ui.bootstrap.dateparser',
   'ui.bootstrap.position',
   'ui.bootstrap.datepicker',
@@ -37,8 +36,6 @@ angular.module('ui.bootstrap', [
 
 angular.module('ui.bootstrap.tpls', [
   'template/alert/alert.html',
-  'template/carousel/carousel.html',
-  'template/carousel/slide.html',
   'template/datepicker/datepicker.html',
   'template/datepicker/day.html',
   'template/datepicker/month.html',
@@ -66,7 +63,6 @@ import './accordion';
 import './alert';
 import './bindHtml';
 import './buttons';
-import './carousel';
 import './collapse';
 import './dateparser';
 import './datepicker';
@@ -89,18 +85,6 @@ angular.module('template/alert/alert.html', []).run(['$templateCache', function(
   $templateCache.put('template/alert/alert.html', alert);
 }]);
 
-import carousel from './carousel/carousel.html';
-
-angular.module('template/carousel/carousel.html', []).run(['$templateCache', function($templateCache) {
-  $templateCache.put('template/carousel/carousel.html', carousel);
-}]);
-
-import slide from './carousel/slide.html';
-
-angular.module('template/carousel/slide.html', []).run(['$templateCache', function($templateCache) {
-  $templateCache.put('template/carousel/slide.html', slide);
-}]);
-
 import datepicker from './datepicker/datepicker.html';
 
 angular.module('template/datepicker/datepicker.html', []).run(['$templateCache', function($templateCache) {
diff --git a/src/ui/public/styles/bootstrap/bootstrap.less b/src/ui/public/styles/bootstrap/bootstrap.less
index 1c0477805fa93..381cca8882dc4 100644
--- a/src/ui/public/styles/bootstrap/bootstrap.less
+++ b/src/ui/public/styles/bootstrap/bootstrap.less
@@ -49,7 +49,6 @@
 @import "modals.less";
 @import "tooltip.less";
 @import "popovers.less";
-@import "carousel.less";
 
 // Utility classes
 @import "utilities.less";
diff --git a/src/ui/public/styles/bootstrap/carousel.less b/src/ui/public/styles/bootstrap/carousel.less
deleted file mode 100644
index 252011e9e2508..0000000000000
--- a/src/ui/public/styles/bootstrap/carousel.less
+++ /dev/null
@@ -1,270 +0,0 @@
-//
-// Carousel
-// --------------------------------------------------
-
-
-// Wrapper for the slide container and indicators
-.carousel {
-  position: relative;
-}
-
-.carousel-inner {
-  position: relative;
-  overflow: hidden;
-  width: 100%;
-
-  > .item {
-    display: none;
-    position: relative;
-    .transition(.6s ease-in-out left);
-
-    // Account for jankitude on images
-    > img,
-    > a > img {
-      &:extend(.img-responsive);
-      line-height: 1;
-    }
-
-    // WebKit CSS3 transforms for supported devices
-    @media all and (transform-3d), (-webkit-transform-3d) {
-      .transition-transform(~'0.6s ease-in-out');
-      .backface-visibility(~'hidden');
-      .perspective(1000px);
-
-      &.next,
-      &.active.right {
-        .translate3d(100%, 0, 0);
-        left: 0;
-      }
-      &.prev,
-      &.active.left {
-        .translate3d(-100%, 0, 0);
-        left: 0;
-      }
-      &.next.left,
-      &.prev.right,
-      &.active {
-        .translate3d(0, 0, 0);
-        left: 0;
-      }
-    }
-  }
-
-  > .active,
-  > .next,
-  > .prev {
-    display: block;
-  }
-
-  > .active {
-    left: 0;
-  }
-
-  > .next,
-  > .prev {
-    position: absolute;
-    top: 0;
-    width: 100%;
-  }
-
-  > .next {
-    left: 100%;
-  }
-  > .prev {
-    left: -100%;
-  }
-  > .next.left,
-  > .prev.right {
-    left: 0;
-  }
-
-  > .active.left {
-    left: -100%;
-  }
-  > .active.right {
-    left: 100%;
-  }
-
-}
-
-// Left/right controls for nav
-// ---------------------------
-
-.carousel-control {
-  position: absolute;
-  top: 0;
-  left: 0;
-  bottom: 0;
-  width: @carousel-control-width;
-  .opacity(@carousel-control-opacity);
-  font-size: @carousel-control-font-size;
-  color: @carousel-control-color;
-  text-align: center;
-  text-shadow: @carousel-text-shadow;
-  background-color: rgba(0, 0, 0, 0); // Fix IE9 click-thru bug
-  // We can't have this transition here because WebKit cancels the carousel
-  // animation if you trip this while in the middle of another animation.
-
-  // Set gradients for backgrounds
-  &.left {
-    #gradient > .horizontal(@start-color: rgba(0,0,0,.5); @end-color: rgba(0,0,0,.0001));
-  }
-  &.right {
-    left: auto;
-    right: 0;
-    #gradient > .horizontal(@start-color: rgba(0,0,0,.0001); @end-color: rgba(0,0,0,.5));
-  }
-
-  // Hover/focus state
-  &:hover,
-  &:focus {
-    outline: 0;
-    color: @carousel-control-color;
-    text-decoration: none;
-    .opacity(.9);
-  }
-
-  // Toggles
-  .icon-prev,
-  .icon-next,
-  .glyphicon-chevron-left,
-  .glyphicon-chevron-right {
-    position: absolute;
-    top: 50%;
-    margin-top: -10px;
-    z-index: 5;
-    display: inline-block;
-  }
-  .icon-prev,
-  .glyphicon-chevron-left {
-    left: 50%;
-    margin-left: -10px;
-  }
-  .icon-next,
-  .glyphicon-chevron-right {
-    right: 50%;
-    margin-right: -10px;
-  }
-  .icon-prev,
-  .icon-next {
-    width:  20px;
-    height: 20px;
-    line-height: 1;
-    font-family: serif;
-  }
-
-
-  .icon-prev {
-    &:before {
-      content: '\2039';// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039)
-    }
-  }
-  .icon-next {
-    &:before {
-      content: '\203a';// SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A)
-    }
-  }
-}
-
-// Optional indicator pips
-//
-// Add an unordered list with the following class and add a list item for each
-// slide your carousel holds.
-
-.carousel-indicators {
-  position: absolute;
-  bottom: 10px;
-  left: 50%;
-  z-index: 15;
-  width: 60%;
-  margin-left: -30%;
-  padding-left: 0;
-  list-style: none;
-  text-align: center;
-
-  li {
-    display: inline-block;
-    width:  10px;
-    height: 10px;
-    margin: 1px;
-    text-indent: -999px;
-    border: 1px solid @carousel-indicator-border-color;
-    border-radius: 10px;
-    cursor: pointer;
-
-    // IE8-9 hack for event handling
-    //
-    // Internet Explorer 8-9 does not support clicks on elements without a set
-    // `background-color`. We cannot use `filter` since that's not viewed as a
-    // background color by the browser. Thus, a hack is needed.
-    // See https://developer.mozilla.org/en-US/docs/Web/Events/click#Internet_Explorer
-    //
-    // For IE8, we set solid black as it doesn't support `rgba()`. For IE9, we
-    // set alpha transparency for the best results possible.
-    background-color: #000 \9; // IE8
-    background-color: rgba(0,0,0,0); // IE9
-  }
-  .active {
-    margin: 0;
-    width:  12px;
-    height: 12px;
-    background-color: @carousel-indicator-active-bg;
-  }
-}
-
-// Optional captions
-// -----------------------------
-// Hidden by default for smaller viewports
-.carousel-caption {
-  position: absolute;
-  left: 15%;
-  right: 15%;
-  bottom: 20px;
-  z-index: 10;
-  padding-top: 20px;
-  padding-bottom: 20px;
-  color: @carousel-caption-color;
-  text-align: center;
-  text-shadow: @carousel-text-shadow;
-  & .btn {
-    text-shadow: none; // No shadow for button elements in carousel-caption
-  }
-}
-
-
-// Scale up controls for tablets and up
-@media screen and (min-width: @screen-sm-min) {
-
-  // Scale up the controls a smidge
-  .carousel-control {
-    .glyphicon-chevron-left,
-    .glyphicon-chevron-right,
-    .icon-prev,
-    .icon-next {
-      width: (@carousel-control-font-size * 1.5);
-      height: (@carousel-control-font-size * 1.5);
-      margin-top: (@carousel-control-font-size / -2);
-      font-size: (@carousel-control-font-size * 1.5);
-    }
-    .glyphicon-chevron-left,
-    .icon-prev {
-      margin-left: (@carousel-control-font-size / -2);
-    }
-    .glyphicon-chevron-right,
-    .icon-next {
-      margin-right: (@carousel-control-font-size / -2);
-    }
-  }
-
-  // Show and left align the captions
-  .carousel-caption {
-    left: 20%;
-    right: 20%;
-    padding-bottom: 30px;
-  }
-
-  // Move up the indicators
-  .carousel-indicators {
-    bottom: 20px;
-  }
-}
diff --git a/src/ui/public/styles/bootstrap/variables.less b/src/ui/public/styles/bootstrap/variables.less
index b057ef5bf907b..abc3a4fadaada 100644
--- a/src/ui/public/styles/bootstrap/variables.less
+++ b/src/ui/public/styles/bootstrap/variables.less
@@ -799,23 +799,6 @@
 @breadcrumb-separator:          "/";
 
 
-//== Carousel
-//
-//##
-
-@carousel-text-shadow:                        0 1px 2px rgba(0,0,0,.6);
-
-@carousel-control-color:                      #fff;
-@carousel-control-width:                      15%;
-@carousel-control-opacity:                    .5;
-@carousel-control-font-size:                  20px;
-
-@carousel-indicator-active-bg:                #fff;
-@carousel-indicator-border-color:             #fff;
-
-@carousel-caption-color:                      #fff;
-
-
 //== Close
 //
 //##
diff --git a/src/ui/public/styles/theme/bootstrap.less b/src/ui/public/styles/theme/bootstrap.less
index a68568990f093..50bf65d0550f3 100644
--- a/src/ui/public/styles/theme/bootstrap.less
+++ b/src/ui/public/styles/theme/bootstrap.less
@@ -46,7 +46,6 @@
 @import "~ui/styles/bootstrap/modals.less";
 @import "~ui/styles/bootstrap/tooltip.less";
 @import "~ui/styles/bootstrap/popovers.less";
-@import "~ui/styles/bootstrap/carousel.less";
 
 // Utility classes
 @import "~ui/styles/bootstrap/utilities.less";
diff --git a/src/ui/public/styles/variables/bootstrap-mods.less b/src/ui/public/styles/variables/bootstrap-mods.less
index cf89cce9fda7b..17bb71b5d3233 100644
--- a/src/ui/public/styles/variables/bootstrap-mods.less
+++ b/src/ui/public/styles/variables/bootstrap-mods.less
@@ -745,20 +745,6 @@
 @breadcrumb-separator:          "/";
 
 
-//== Carousel
-//
-//##
-
-@carousel-text-shadow:                  0 1px 2px rgba(0,0,0,.6);
-@carousel-control-color:                @white;
-@carousel-indicator-active-bg:          @white;
-@carousel-indicator-border-color:       @white;
-@carousel-caption-color:                @white;
-@carousel-control-width:                      15%;
-@carousel-control-opacity:                    .5;
-@carousel-control-font-size:                  20px;
-
-
 //== Close
 //
 //##