Add paper-menu-button and its dependencies to third_party/polymer

third_party/polymer/v1_0/components/paper-progress/paper-progress.html

Index: third_party/polymer/v1_0/components/paper-progress/paper-progress.html
diff --git a/third_party/polymer/v1_0/components/paper-progress/paper-progress.html b/third_party/polymer/v1_0/components/paper-progress/paper-progress.html
index 3df2577b3b14cc93f5aa0f3043b27b1316e4cc2c..4c9e027e668028ffd954f307cb33eaac5303c814 100644
--- a/third_party/polymer/v1_0/components/paper-progress/paper-progress.html
+++ b/third_party/polymer/v1_0/components/paper-progress/paper-progress.html
@@ -58,6 +58,17 @@ the value changed. You can also customize the transition:
       --paper-progress-transition-transition-delay: 0s;
     }
     
+The following mixins are available for styling:
+
+
+
+Custom property | Description | Default
+----------------|-------------|----------
+`--paper-progress-container` | Mixin applied to container | `{}`
+
+
+
+
 @group Paper Elements
 @element paper-progress
 @hero hero.svg
@@ -93,8 +104,12 @@ the value changed. You can also customize the transition:
     #progressContainer {
       position: relative;
       height: 100%;
-      background-color: var(--paper-progress-container-color, --google-grey-300);
       overflow: hidden;
+      @apply(--paper-progress-container);
+    }
+    
+    #progressContainer, #indeterminateSplitter {
+      background-color: var(--paper-progress-container-color, --google-grey-300);
     }
 
     #activeProgress,
@@ -112,35 +127,87 @@ the value changed. You can also customize the transition:
     #secondaryProgress {
       background-color: var(--paper-progress-secondary-color, --google-green-100);
     }
+    
+    #indeterminateSplitter {
+      display: none;
+    }
 
     #activeProgress.indeterminate {
+      -webkit-transform-origin: right center;
+      transform-origin: right center;
+      -webkit-animation: indeterminate-bar 2s linear infinite;
+      animation: indeterminate-bar 2s linear infinite;
+    }
+
+    #indeterminateSplitter.indeterminate {
+      display: block;
       -webkit-transform-origin: center center;
       transform-origin: center center;
-      -webkit-animation: indeterminate-bar 1s linear infinite;
-      animation: indeterminate-bar 1s linear infinite;
+      -webkit-animation: indeterminate-splitter 2s linear infinite;
+      animation: indeterminate-splitter 2s linear infinite;
     }
 
     @-webkit-keyframes indeterminate-bar {
       0% {
-        -webkit-transform: translate(-50%) scaleX(0);
+        -webkit-transform: scaleX(1) translateX(-100%);
       }
       50% {
-        -webkit-transform: translate(0%) scaleX(0.3);
+        -webkit-transform: scaleX(1) translateX(0%);
+      }
+      75% {
+        -webkit-transform: scaleX(1) translateX(0%);
+        -webkit-animation-timing-function: cubic-bezier(.28,.62,.37,.91);
       }
       100% {
-        -webkit-transform: translate(50%) scaleX(0);
+        -webkit-transform: scaleX(0) translateX(0%);
+      }
+    }
+
+    @-webkit-keyframes indeterminate-splitter {
+      0% {
+        -webkit-transform: scaleX(.75) translateX(-125%);
+      }
+      30% {
+        -webkit-transform: scaleX(.75) translateX(-125%);
+        -webkit-animation-timing-function: cubic-bezier(.42,0,.6,.8);
+      }
+      90% {
+        -webkit-transform: scaleX(.75) translateX(125%);
+      }
+      100% {
+        -webkit-transform: scaleX(.75) translateX(125%);
       }
     }
 
     @keyframes indeterminate-bar {
       0% {
-        transform: translate(-50%) scaleX(0);
+        transform: scaleX(1) translateX(-100%);
       }
       50% {
-        transform: translate(0%) scaleX(0.3);
+        transform: scaleX(1) translateX(0%);
+      }
+      75% {
+        transform: scaleX(1) translateX(0%);
+        animation-timing-function: cubic-bezier(.28,.62,.37,.91);
+      }
+      100% {
+        transform: scaleX(0) translateX(0%);
+      }
+    }
+
+    @keyframes indeterminate-splitter {
+      0% {
+        transform: scaleX(.75) translateX(-125%);
+      }
+      30% {
+        transform: scaleX(.75) translateX(-125%);
+        animation-timing-function: cubic-bezier(.42,0,.6,.8);
+      }
+      90% {
+        transform: scaleX(.75) translateX(125%);
       }
       100% {
-        transform: translate(50%) scaleX(0);
+        transform: scaleX(.75) translateX(125%);
       }
     }
   </style>
@@ -148,6 +215,7 @@ the value changed. You can also customize the transition:
     <div id="progressContainer" role="progressbar" aria-valuenow$="{{value}}" aria-valuemin$="{{min}}" aria-valuemax$="{{max}}">
       <div id="secondaryProgress" class="fit"></div>
       <div id="activeProgress" class="fit"></div>
+      <div id="indeterminateSplitter" class="fit"></div>
     </div>
   </template>
 </dom-module>
@@ -202,6 +270,7 @@ the value changed. You can also customize the transition:
       // If we use attribute/class binding, the animation sometimes doesn't translate properly
       // on Safari 7.1. So instead, we toggle the class here in the update method.
       this.toggleClass('indeterminate', this.indeterminate, this.$.activeProgress);
+      this.toggleClass('indeterminate', this.indeterminate, this.$.indeterminateSplitter);
     },
 
     _transformProgress: function(progress, ratio) {