@ribajs/moment
Version:
Moment.js module for Riba.js
152 lines • 11.2 kB
JavaScript
import { Component } from "@ribajs/core";
export class TimerComponent extends Component {
static tagName = "moment-timer";
autobind = true;
static get observedAttributes() {
return [
"time",
"countdown-years",
"countdown-days",
"countdown-hours",
"countdown-minutes",
"countdown-seconds",
];
}
requiredAttributes() {
return ["time"];
}
scope = {
countdownYears: false,
countdownDays: true,
countdownHours: true,
countdownMinutes: true,
countdownSeconds: true,
countdownRunning: true,
remainingYears: 0,
remainingDays: 0,
remainingHours: 0,
remainingMinutes: 0,
remainingSeconds: 0,
time: "",
};
updateIntervalId;
constructor() {
super();
}
connectedCallback() {
super.connectedCallback();
this.init(TimerComponent.observedAttributes);
this.startCountdownInterval();
}
async init(observedAttributes) {
return super.init(observedAttributes);
}
async beforeBind() {
return await super.beforeBind();
}
async afterBind() {
await super.afterBind();
}
updateCountdown() {
let remainingSeconds = this.getRemainingSeconds();
if (!remainingSeconds || remainingSeconds < 1) {
this.cancelCountdownInterval();
this.resetCountdown();
return;
}
this.scope.countdownRunning = true;
const secsOfMinute = 60;
const secsOfHour = 60 * secsOfMinute;
const secsOfDay = 24 * secsOfHour;
const secsOfYear = 365 * secsOfDay;
if (this.scope.countdownYears) {
if (this.isYearsLastUnit()) {
this.scope.remainingYears = Math.ceil(remainingSeconds / secsOfYear);
return;
}
else {
this.scope.remainingYears = Math.floor(remainingSeconds / secsOfYear);
remainingSeconds -= this.scope.remainingYears * secsOfYear;
}
}
if (this.scope.countdownDays) {
if (this.isDaysLastUnit()) {
this.scope.remainingDays = Math.ceil(remainingSeconds / secsOfDay);
return;
}
else {
this.scope.remainingDays = Math.floor(remainingSeconds / secsOfDay);
remainingSeconds -= this.scope.remainingDays * secsOfDay;
}
}
if (this.scope.countdownHours) {
if (this.isHoursLastUnit()) {
this.scope.remainingHours = Math.ceil(remainingSeconds / secsOfHour);
return;
}
else {
this.scope.remainingHours = Math.floor(remainingSeconds / secsOfHour);
remainingSeconds -= this.scope.remainingHours * secsOfHour;
}
}
if (this.scope.countdownMinutes) {
if (this.isMinutesLastUnit()) {
this.scope.remainingMinutes = Math.ceil(remainingSeconds / secsOfMinute);
return;
}
else {
this.scope.remainingMinutes = Math.floor(remainingSeconds / secsOfMinute);
remainingSeconds -= this.scope.remainingMinutes * secsOfMinute;
}
}
this.scope.remainingSeconds = Math.ceil(remainingSeconds);
}
resetCountdown() {
this.scope.remainingDays = 0;
this.scope.remainingHours = 0;
this.scope.remainingMinutes = 0;
this.scope.remainingSeconds = 0;
}
getRemainingSeconds() {
return Math.ceil((Date.parse(this.scope.time) - new Date().getTime()) / 1000);
}
isYearsLastUnit() {
return (this.scope.countdownYears == false &&
this.scope.countdownHours == false &&
this.scope.countdownMinutes == false &&
this.scope.countdownSeconds == false);
}
isDaysLastUnit() {
return (this.scope.countdownHours == false &&
this.scope.countdownMinutes == false &&
this.scope.countdownSeconds == false);
}
isHoursLastUnit() {
return (this.scope.countdownMinutes == false &&
this.scope.countdownSeconds == false);
}
isMinutesLastUnit() {
return this.scope.countdownSeconds == false;
}
startCountdownInterval() {
this.scope.countdownRunning = false;
this.updateCountdown();
this.updateIntervalId = window.setInterval(() => {
this.updateCountdown();
}, 1000);
}
cancelCountdownInterval() {
this.scope.countdownRunning = false;
if (this.updateIntervalId)
window.clearInterval(this.updateIntervalId);
this.updateIntervalId = undefined;
}
disconnectedCallback() {
super.disconnectedCallback();
this.cancelCountdownInterval();
}
template() {
return null;
}
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGltZXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvdGltZXIvdGltZXIuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQStCLE1BQU0sY0FBYyxDQUFDO0FBd0J0RSxNQUFNLE9BQU8sY0FBZSxTQUFRLFNBQVM7SUFDcEMsTUFBTSxDQUFDLE9BQU8sR0FBRyxjQUFjLENBQUM7SUFFN0IsUUFBUSxHQUFHLElBQUksQ0FBQztJQUUxQixNQUFNLEtBQUssa0JBQWtCO1FBQzNCLE9BQU87WUFDTCxNQUFNO1lBQ04saUJBQWlCO1lBQ2pCLGdCQUFnQjtZQUNoQixpQkFBaUI7WUFDakIsbUJBQW1CO1lBQ25CLG1CQUFtQjtTQUNwQixDQUFDO0lBQ0osQ0FBQztJQUVTLGtCQUFrQjtRQUMxQixPQUFPLENBQUMsTUFBTSxDQUFDLENBQUM7SUFDbEIsQ0FBQztJQUVNLEtBQUssR0FBVTtRQUNwQixjQUFjLEVBQUUsS0FBSztRQUNyQixhQUFhLEVBQUUsSUFBSTtRQUNuQixjQUFjLEVBQUUsSUFBSTtRQUNwQixnQkFBZ0IsRUFBRSxJQUFJO1FBQ3RCLGdCQUFnQixFQUFFLElBQUk7UUFFdEIsZ0JBQWdCLEVBQUUsSUFBSTtRQUV0QixjQUFjLEVBQUUsQ0FBQztRQUNqQixhQUFhLEVBQUUsQ0FBQztRQUNoQixjQUFjLEVBQUUsQ0FBQztRQUNqQixnQkFBZ0IsRUFBRSxDQUFDO1FBQ25CLGdCQUFnQixFQUFFLENBQUM7UUFDbkIsSUFBSSxFQUFFLEVBQUU7S0FDVCxDQUFDO0lBRU0sZ0JBQWdCLENBQVU7SUFFbEM7UUFDRSxLQUFLLEVBQUUsQ0FBQztJQUNWLENBQUM7SUFFUyxpQkFBaUI7UUFDekIsS0FBSyxDQUFDLGlCQUFpQixFQUFFLENBQUM7UUFDMUIsSUFBSSxDQUFDLElBQUksQ0FBQyxjQUFjLENBQUMsa0JBQWtCLENBQUMsQ0FBQztR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