//
// Copyright 2019 Stijn de Witt. Some rights reserved.
// Licensed under the MIT Open Source license. 
// https://opensource.org/licenses/MIT
// See LICENSE for details.
//
// Based on code copyright 2018 Google Inc. All Rights Reserved.
// Licensed under the Apache License, Version 2.0.
// http://www.apache.org/licenses/LICENSE-2.0
// See LICENSE-MDC for details.
// 
// Unless required by applicable law or agreed to in writing, software
// distributed under these licenses is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the licenses for the specific language governing permissions and
// limitations under these licenses.
// 

@import "../animation/functions";
@import "./keyframes";
@import "./mixins";
@import "./variables";

.mdc-linear-progress {
  position: relative;
  width: 100%;
  height: 4px;
  transform: translateZ(0);
  transition: mdc-animation-exit-temporary(opacity, 250ms);
  overflow: hidden;

  &__bar {
    position: absolute;
    width: 100%;
    height: 100%;
    animation: none;
    transform-origin: top left;
    transition: mdc-animation-exit-temporary(transform, 250ms);
  }

  &__bar-inner {
    display: inline-block;
    position: absolute;
    width: 100%;
    height: 100%;
    animation: none;
  }

  &__buffering-dots {
    position: absolute;
    width: 100%;
    height: 100%;
    animation: buffering 250ms infinite linear;
    background-repeat: repeat-x;
    background-size: 10px 4px;
  }

  &__buffer {
    position: absolute;
    width: 100%;
    height: 100%;
    transform-origin: top left;
    transition: mdc-animation-exit-temporary(transform, 250ms);
  }

  &__primary-bar {
    transform: scaleX(0);
  }

  &__secondary-bar {
    visibility: hidden;
  }

  &--indeterminate {
    .mdc-linear-progress__bar {
      transition: none;
    }

    .mdc-linear-progress__primary-bar {
      left: -145.166611%;
      animation: primary-indeterminate-translate 2s infinite linear;

      > .mdc-linear-progress__bar-inner {
        animation: primary-indeterminate-scale 2s infinite linear;
      }
    }

    .mdc-linear-progress__secondary-bar {
      left: -54.888891%;
      animation: secondary-indeterminate-translate 2s infinite linear;
      visibility: visible;

      > .mdc-linear-progress__bar-inner {
        animation: secondary-indeterminate-scale 2s infinite linear;
      }
    }
  }

  &--reversed {
    .mdc-linear-progress__bar,
    .mdc-linear-progress__buffer {
      right: 0;
      transform-origin: center right;
    }

    .mdc-linear-progress__primary-bar {
      animation-name: primary-indeterminate-translate-reverse;
    }

    .mdc-linear-progress__secondary-bar {
      animation-name: secondary-indeterminate-translate-reverse;
    }

    .mdc-linear-progress__buffering-dots {
      animation: buffering-reverse 250ms infinite linear;
    }
  }

  &--closed {
    opacity: 0;
  }
}

@at-root {
  @include mdc-linear-progress-bar-color(primary);
  @include mdc-linear-progress-buffer-color($mdc-linear-progress-baseline-buffer-color);
}

.mdc-linear-progress--indeterminate.mdc-linear-progress--reversed {
  .mdc-linear-progress__primary-bar {
    right: -145.166611%;
    left: auto;
  }

  .mdc-linear-progress__secondary-bar {
    right: -54.888891%;
    left: auto;
  }
}