<commit_before><link rel="import" href="../bower_components/polymer/polymer.html">

<polymer-element name="countdown-timer"
    attributes="date dateadjustment easeintime waittime easeouttime">

  <template>
    <style>
      :host {
        display: block;
        width: 300px;
        height: 200px;
      }

      .countdown-timer,
      .countdown-timer__surface {
        width: 100%;
        height: 100%;
      }
    </style>
    <div class="countdown-timer">
      <canvas class="countdown-timer__surface" id="surface"></canvas>
    </div>
  </template>
  <script>

  Polymer({

    date: 'Mon, 02 Mar 2015 09:00:00 GMT-0700',
    dateadjustment: 3,
    easeintime: 500,
    waittime: 300,
    easeouttime: 400,

    ready: function() {

      var targetDate = Date.parse(this.date);

      if (isNaN(targetDate))
        targetDate = Date.now();

      targetDate = new Date(targetDate);

      var timer = new IO.CountdownTimer(this.$.surface);
      timer.animate({
        targetDate: targetDate,
        adjustmentInDays: this.dateadjustment,
        easeInTime: this.easeintime,
        waitTime: this.waittime,
        easeOutTime: this.easeouttime
      });
    }

  })

  var IO = {};

  IO.CountdownTimerColors = {
    Background: '#26C6DA',
    LightBlue: '#E0F7FA',
    MediumBlue: '#80DEEA',
    DarkBlue: '#00ACC1',
    Black: '#000',
    Shadow: 'rgba(0,0,0,0.4)'
  };

  IO.CountdownTimerEasing = {
    /**
     * Quintic ease-out from:
     * @see: https://github.com/sole/tween.js/blob/master/src/Tween.js
     */
    Out: function(t) {
      return --t * t * t * t * t + 1;
    }
  };

  IO.CountdownTimerAnimation = {
    In: 1,
    Out: 2
  };
<commit_msg>Camel cases the attributes and uses the ID for the style of the canvas.<commit_after><link rel="import" href="../bower_components/polymer/polymer.html">

<polymer-element name="countdown-timer"
    attributes="date dateAdjustment easeInTime waitTime easeOutTime">

  <template>
    <style>
      :host {
        display: block;
        width: 300px;
        height: 200px;
      }

      .countdown-timer,
      #surface {
        width: 100%;
        height: 100%;
      }
    </style>
    <div class="countdown-timer">
      <canvas id="surface"></canvas>
    </div>
  </template>
  <script>

  Polymer({

    date: 'Mon, 02 Mar 2015 09:00:00 GMT-0700',
    dateAdjustment: 3,
    easeInTime: 500,
    waitTime: 300,
    easeOutTime: 400,

    ready: function() {

      var targetDate = Date.parse(this.date);

      if (isNaN(targetDate))
        targetDate = Date.now();

      targetDate = new Date(targetDate);

      var timer = new IO.CountdownTimer(this.$.surface);
      timer.animate({
        targetDate: targetDate,
        adjustmentInDays: this.dateAdjustment,
        easeInTime: this.easeInTime,
        waitTime: this.waitTime,
        easeOutTime: this.easeOutTime
      });
    }

  })

  var IO = {};

  IO.CountdownTimerColors = {
    Background: '#26C6DA',
    LightBlue: '#E0F7FA',
    MediumBlue: '#80DEEA',
    DarkBlue: '#00ACC1',
    Black: '#000',
    Shadow: 'rgba(0,0,0,0.4)'
  };

  IO.CountdownTimerEasing = {
    /**
     * Quintic ease-out from:
     * @see: https://github.com/sole/tween.js/blob/master/src/Tween.js
     */
    Out: function(t) {
      return --t * t * t * t * t + 1;
    }
  };

  IO.CountdownTimerAnimation = {
    In: 1,
    Out: 2
  };

{'fraction_non_alphanumeric': 0.1437869822485207, 'fraction_numerical': 0.034911242603550295, 'mean_word_length': 2.2921129503407984, 'pattern_counts': {'":': 0, '<': 25, '<?xml version=': 0, '>': 25, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6417403', 'n_tokens_mistral': 1272, 'n_tokens_neox': 1153, 'n_words': 236}