chrome/browser/resources/pdf/elements/viewer-progress-bar/viewer-progress-bar.js

   1 // Copyright 2014 The Chromium Authors. All rights reserved.
   2 // Use of this source code is governed by a BSD-style license that can be
   3 // found in the LICENSE file.
   4
   5 Polymer({
   6   is: 'viewer-progress-bar',
   7
   8   properties: {
   9     progress: {
  10       type: Number,
  11       observer: 'progressChanged'
  12     },
  13
  14     text: {
  15       type: String,
  16       value: 'Loading'
  17     },
  18
  19     numSegments: {
  20       type: Number,
  21       value: 8,
  22       observer: 'numSegmentsChanged'
  23     }
  24   },
  25
  26   segments: [],
  27
  28   ready: function() {
  29     this.numSegmentsChanged();
  30   },
  31
  32   progressChanged: function() {
  33     var numVisible = this.progress * this.segments.length / 100.0;
  34     for (var i = 0; i < this.segments.length; i++) {
  35       this.segments[i].style.visibility =
  36           i < numVisible ? 'inherit' : 'hidden';
  37     }
  38
  39     if (this.progress >= 100 || this.progress < 0)
  40       this.style.opacity = 0;
  41   },
  42
  43   numSegmentsChanged: function() {
  44     // Clear the existing segments.
  45     this.segments = [];
  46     var segmentsElement = this.$.segments;
  47     segmentsElement.innerHTML = '';
  48
  49     // Create the new segments.
  50     var segment = document.createElement('li');
  51     segment.classList.add('segment');
  52     var angle = 360 / this.numSegments;
  53     for (var i = 0; i < this.numSegments; ++i) {
  54       var segmentCopy = segment.cloneNode(true);
  55       segmentCopy.style.webkitTransform =
  56           'rotate(' + (i * angle) + 'deg) skewY(' +
  57           -1 * (90 - angle) + 'deg)';
  58       segmentsElement.appendChild(segmentCopy);
  59       this.segments.push(segmentCopy);
  60     }
  61     this.progressChanged();
  62   }
  63 });