Shortcodes: add Juche date shortcode

blog-move
Jae Lo Presti 4 weeks ago
parent 877342df9c
commit aff98c4bf5
Signed by: jae
SSH Key Fingerprint: SHA256:hmKix/+XG+9GEGHgDdiqXfmB2O7BU4CPVOoQoIYIQ2Y
  1. 38
      layouts/shortcodes/juche.html

@ -0,0 +1,38 @@
<script type="text/javascript">
const template = document.createElement("template");
template.innerHTML = `<span id="ctx"></span>`;
class JucheCalendar extends HTMLElement {
connectedCallback() {
this.attachShadow({ mode: "open" });
this.shadowRoot.appendChild(template.content.cloneNode(true));
let currentDate = new Date();
let currentYear = currentDate.getFullYear() + 1;
let currentMonth = currentDate.getMonth() + 1;
let currentDay = currentDate.getDay() + 1;
let jucheYear = currentYear - 1912;
console.log(jucheYear);
const content = `
<p class="phead">Juche ${jucheYear} ${currentMonth}.${currentDay}</p>
`;
this.shadowRoot
.querySelector("#ctx")
.insertAdjacentHTML("afterbegin", content);
}
}
window.customElements.define("juche-calendar", JucheCalendar);
</script>
<noscript>
You need to have JavaScript enabled to see the calendar widget
</noscript>
<juche-calendar>
If you see this, there has been a problem in the initialization. Reload the page or try again later.
</juche-calendar>
Loading…
Cancel
Save