<!--
  This in an HTML Import-able file that contains the JS and HTML Templates for
  the human-date-sk element.

  To use this file import it:

    <link href="/res/imp/human-date-sk.html" rel="import" />

  Properties:
    date - The date to make human-readable.

    diff - Rather than displaying the date, display the difference between the
        current date and the given date.

    seconds - Indicates that the given date is expressed in seconds.

  Methods:
    None.

  Events:
    None.
-->
<link rel="import" href="/res/imp/bower_components/polymer/polymer.html">
<dom-module id="human-date-sk">
  <template>
    <span>{{_humanDate}}</span>
  </template>
  <script>
  (function() {
    Polymer({
      is: "human-date-sk",

      properties: {
        date: {
          value: 0,
        },

        diff: {
          type: Boolean,
          value: false,
        },

        seconds: {
          type: Boolean,
          value: false,
        },

        _humanDate: {
          type: String,
          computed: "_humanFormat(date, diff, seconds)",
        },
      },

      _humanFormat: function(date, diff, seconds) {
        // Take the input and convert it to milliseconds.
        var intDate = parseInt(date);
        if (intDate.toString() != date) {
          // date is a string. Parse it into a Date object and get the millis.
          date = new Date(date).getTime();
        } else {
          // date is a number wrapped in a string. Use the value from parseInt.
          date = intDate;
          if (seconds) {
            date *= 1000;
          }
        }

        if (diff) {
          return sk.human.diffDate(date);
        }
        var d = new Date(date);
        return d.toLocaleDateString() + ", " + d.toLocaleTimeString();
      }
    });
  }());
  </script>
</dom-module>