Packages

exq_ui

0.12.1
0.19.0 0.18.0 0.17.0 0.16.0 0.15.0 0.14.0 0.13.0 0.12.3 0.12.2 0.12.1 0.12.0 0.11.1 0.11.0 0.10.0 0.9.0 0.8.6 0.8.5 0.8.4 0.8.3 0.8.2 0.8.1 0.8.0 0.7.1 0.7.0 0.6.5 0.6.4 0.6.3 0.6.0 0.5.0 0.1.0

Exq UI is the UI component for Exq, a job processing library. Exq UI provides the UI dashboard to display stats on job processing.

HexDocs

Current section

Files

Jump to
Readme
30 Versions
5 Dependencies
0 Dependants
Files
Activity
exq_ui assets js hooks timestamp.js
Raw

assets/js/hooks/timestamp.js 

import { ViewHook } from "phoenix_live_view";



function relativeTime(dateString) {

  if (

    typeof window.Intl != "object" ||

    typeof window.Intl.RelativeTimeFormat != "function"

  ) {

    return dateString;

  }



  let date = new Date(dateString);

  let value = (date - new Date()) / 1000;

  const abs = Math.abs(value);

  let unit;

  if (abs < 60) {

    unit = "second";

  } else if (abs < 60 * 60) {

    unit = "minute";

    value = value / 60;

  } else if (abs < 60 * 60 * 60) {

    unit = "hour";

    value = value / (60 * 60);

  } else {

    unit = "day";

    value = value / (60 * 60 * 60);

  }



  const rtf = new Intl.RelativeTimeFormat("en", { numeric: "auto" });

  return rtf.format(Math.round(value), unit);

}



/** @type {ViewHook}*/

let Timestamp = {

  mounted() {

    let dateString = this.el.textContent.trim();

    this.el.innerText = relativeTime(dateString);

  },

};



export { Timestamp };