webpack-bootstrap-ui-kit/src/js_old/_components/_ui.opening-hours.js

120 lines
3.0 KiB
JavaScript
Raw Normal View History

2021-08-18 20:51:15 +02:00
"use strict";
2020-12-24 23:42:33 +01:00
2021-08-18 20:51:15 +02:00
import $ from "jquery";
2019-06-08 17:20:51 +02:00
2021-08-18 20:51:15 +02:00
import Events from "../_events";
2019-06-08 17:20:51 +02:00
const OpeningHoursUI = (($) => {
// Constants
2021-08-18 20:51:15 +02:00
const NAME = "OpeningHoursUI";
2019-06-08 17:20:51 +02:00
class OpeningHoursUI {
// Static methods
static each(callback) {
2021-08-18 20:51:15 +02:00
$(".js-opening-hours").each((i, e) => {
2019-06-08 17:20:51 +02:00
callback(i, $(e));
});
}
static init() {
this.dispose();
2020-09-09 17:40:58 +02:00
console.log(`${NAME}: init ...`);
2021-08-18 20:51:15 +02:00
const hours = $.parseJSON($(".oppening-hours-json").html());
2019-06-08 17:20:51 +02:00
const date = new Date();
const dateYMD = this.Date_toYMD(date);
const weekday = [
2021-08-18 20:51:15 +02:00
"Sunday",
"Monday",
"Tuesday",
"Wednesday",
"Thursday",
"Friday",
"Saturday",
2019-06-08 17:20:51 +02:00
];
const today = weekday[date.getDay()];
2020-12-24 23:42:33 +01:00
let html =
'<b class="opening-hours-status opening-hours-status-closed">Closed today</b>';
2019-06-08 17:20:51 +02:00
if (
2021-08-18 20:51:15 +02:00
typeof hours["days"] !== "undefined" &&
typeof hours["days"][today] !== "undefined" &&
hours["days"][today].length
2019-06-08 17:20:51 +02:00
) {
2021-08-18 20:51:15 +02:00
html = "Open today ";
$.each(hours["days"][today], (i, v) => {
if (v["DisplayStart"] || v["DisplayEnd"]) {
2019-06-08 17:20:51 +02:00
if (
2021-08-18 20:51:15 +02:00
(v["DisplayStart"] &&
v["DisplayStart"] <= dateYMD &&
v["DisplayEnd"] &&
v["DisplayEnd"] >= dateYMD) ||
(v["DisplayStart"] &&
v["DisplayStart"] <= dateYMD &&
!v["DisplayEnd"]) ||
(v["DisplayEnd"] &&
v["DisplayEnd"] >= dateYMD &&
!v["DisplayStart"])
2019-06-08 17:20:51 +02:00
) {
2021-08-18 20:51:15 +02:00
html = `Open today from ${v["From"]} to ${v["Till"]}`;
2019-06-08 17:20:51 +02:00
return false;
}
} else {
if (i > 0) {
2021-08-18 20:51:15 +02:00
html += ", <br/>";
2019-06-08 17:20:51 +02:00
}
2021-08-18 20:51:15 +02:00
html += `from ${v["From"]} to ${v["Till"]}`;
2019-06-08 17:20:51 +02:00
}
});
html += ' <b class="opening-hours-status"></b>';
}
if (
2021-08-18 20:51:15 +02:00
typeof hours["holidays"] !== "undefined" &&
typeof hours["holidays"][dateYMD] !== "undefined"
2019-06-08 17:20:51 +02:00
) {
2020-09-09 17:40:58 +02:00
html = `<b class="opening-hours-status opening-hours-status-closed">Closed today${
2021-08-18 20:51:15 +02:00
hours["holidays"][dateYMD] ? ` for ${hours["holidays"][dateYMD]}` : ""
2019-06-08 17:20:51 +02:00
}</b>`;
}
this.each((i, e) => {
const $e = $(e);
$e.html(html);
});
}
static Date_toYMD(date) {
var year, month, day;
year = String(date.getFullYear());
month = String(date.getMonth() + 1);
if (month.length == 1) {
2020-12-24 23:42:33 +01:00
month = `0${month}`;
2019-06-08 17:20:51 +02:00
}
day = String(date.getDate());
if (day.length == 1) {
2020-12-24 23:42:33 +01:00
day = `0${day}`;
2019-06-08 17:20:51 +02:00
}
2020-12-24 23:42:33 +01:00
return `${year}-${month}-${day}`;
2019-06-08 17:20:51 +02:00
}
static dispose() {
2020-12-24 23:42:33 +01:00
console.log(`${NAME}: dispose`);
2019-06-08 17:20:51 +02:00
this.each((i, e) => {
2021-08-18 20:51:15 +02:00
$(e).html("");
2019-06-08 17:20:51 +02:00
});
}
}
2020-09-09 17:40:58 +02:00
$(window).on(`${NAME}.init ${Events.AJAX} ${Events.LOADED}`, () => {
2019-06-08 17:20:51 +02:00
OpeningHoursUI.init();
});
return OpeningHoursUI;
})($);
export default OpeningHoursUI;