blob: d2a92cd8aabf89ecaa4d2c23ea7bd03afc723570 [file] [log] [blame]
<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../paper-tooltip/paper-tooltip.html">
<script src="../moment/min/moment.min.js"></script>
<script src="../moment-timezone/builds/moment-timezone-with-data.min.js"></script>
<dom-module id="chops-timestamp">
<template is="dom-if" if="[[!short]]">
[[_fmtDate]] ([[_computeRelativeTime(date)]])
<template is="dom-if" if="[[short]]">
'use strict';
* `<chops-timestamp>` displays a formatted time string in PDT and the relative time.
* This element shows a time in a human readable form.
* @customElement
* @polymer
* @demo /demo/chops-timestamp_demo.html
class ChopsTimestamp extends Polymer.Element {
static get is() { return 'chops-timestamp'; }
static get properties() {
return {
/** The javascript Date object, which is stored in UTC, to be processed. */
date: Object,
/** When true, a shorter version of the date will be displayed. */
short: {
type: Boolean,
value: false,
/** The format of the date. */
dateFormat: {
type: String,
value: "ddd D MMM 'YY, h:mm a z",
/** The formatted date. */
_fmtDate: {
type: String,
computed: '_computeDisplayedTime(date, dateFormat)',
_computeDisplayedTime(date, format) {
return moment(date).tz('America/Los_Angeles').format(format);
_computeRelativeTime(date) {
return moment(date).fromNow();
customElements.define(, ChopsTimestamp);