ui/file_manager/audio_player/elements/volume_controller.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 (function() {
   6   'use strict';
   7
   8   Polymer('volume-controller', {
   9     /**
  10      * Initializes an element. This method is called automatically when the
  11      * element is ready.
  12      */
  13     ready: function() {
  14       this.style.width = this.width + 'px';
  15       this.style.height = this.height + 'px';
  16
  17       this.$.rawValueInput.style.width = this.height + 'px';
  18       this.$.rawValueInput.style.height = this.width + 'px';
  19       this.$.rawValueInput.style.webkitTransformOrigin =
  20           (this.width / 2) + 'px ' +
  21           (this.width / 2 - 2) + 'px';
  22
  23       var barLeft = (this.width / 2 - 1);
  24       this.$.bar.style.left = barLeft + 'px';
  25       this.$.bar.style.right = barLeft + 'px';
  26
  27       this.addEventListener('keydown', this.onKeyDown_.bind(this));
  28     },
  29
  30     /**
  31      * Registers handlers for changing of external variables
  32      */
  33     observe: {
  34       'model.volume': 'onVolumeChanged',
  35     },
  36
  37     /**
  38      * Model object of the Audio Player.
  39      * @type {AudioPlayerModel}
  40      */
  41     model: null,
  42
  43     /**
  44      * Invoked when the model changed.
  45      * @param {AudioPlayerModel} oldValue Old Value.
  46      * @param {AudioPlayerModel} newValue New Value.
  47      */
  48     modelChanged: function(oldValue, newValue) {
  49       this.onVolumeChanged((oldValue || {}).volume, (newValue || {}).volume);
  50     },
  51
  52     /**
  53      * Volume. 0 is silent, and 100 is maximum.
  54      * @type {number}
  55      */
  56     value: 50,
  57
  58     /**
  59      * Volume. 1000 is silent, and 0 is maximum.
  60      * @type {number}
  61      */
  62     rawValue: 0,
  63
  64     /**
  65      * Height of the element in pixels. Must be specified before ready() is
  66      * called. Dynamic change is not supported.
  67      * @type {number}
  68      */
  69     height: 100,
  70
  71     /**
  72      * Width of the element in pixels. Must be specified before ready() is
  73      * called. Dynamic change is not supported.
  74      * @type {number}
  75      */
  76     width: 32,
  77
  78     /**
  79      * Invoked when the 'volume' value in the model is changed.
  80      * @param {number} oldValue Old value.
  81      * @param {number} newValue New value.
  82      */
  83     onVolumeChanged: function(oldValue, newValue) {
  84       if (oldValue != newValue)
  85         this.rawValue = 100 - newValue;
  86     },
  87
  88     /**
  89      * Invoked when the 'rawValue' property is changed.
  90      * @param {number} oldValue Old value.
  91      * @param {number} newValue New value.
  92      */
  93     rawValueChanged: function(oldValue, newValue) {
  94       if (oldValue != newValue)
  95         this.model.volume = 100 - newValue;
  96     },
  97
  98     /**
  99      * Invoked when the 'keydown' event is fired.
 100      * @param {Event} event The event object.
 101      */
 102     onKeyDown_: function(event) {
 103       switch (event.keyIdentifier) {
 104         // Prevents the default behavior. These key should be handled in
 105         // <audio-player> element.
 106         case 'Up':
 107         case 'Down':
 108         case 'PageUp':
 109         case 'PageDown':
 110           event.preventDefault();
 111           break;
 112       }
 113     },
 114   });
 115 })();  // Anonymous closure