XeNote/public/scripts/projects.js

53 lines
2.8 KiB
JavaScript

(() => {
class Project {
label; date; url;
constructor(label, date, url) {
this.label = label;
this.date = date;
this.url = url;
}
_build() {
return `
<p class="text-gray-900 text-sm ">${this.label}</p>
<div class="border border-dashed flex-1 border-gray-500 h-0"></div>
<div class="flex gap-1 items-baseline">
<i class="text-xs text-gray-800">${this.date}</i>
<a href="${this.url}">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="w-5 h-5 cursor-pointer text-blue-500 hover:text-blue-600">
<path stroke-linecap="round" stroke-linejoin="round"
d="M13.5 6H5.25A2.25 2.25 0 0 0 3 8.25v10.5A2.25 2.25 0 0 0 5.25 21h10.5A2.25 2.25 0 0 0 18 18.75V10.5m-10.5 6L21 3m0 0h-5.25M21 3v5.25" />
</svg>
</a>
</div>
`
}
show() {
const container = document.createElement('div')
container.classList = `flex flex-row items-baseline justify-between gap-2`
container.innerHTML = this._build()
return container
}
}
const data = [
{ label: "Web Window Manager", date: new Date("9/18/2022"), url: "https://github.com/tristonarmstrong/web-window-manager" },
{ label: "Component Test Helper", date: new Date("6/18/2022"), url: "https://github.com/tristonarmstrong/component-test-helper" },
{ label: "Hive DAPP", date: new Date("3/8/2022"), url: "https://github.com/tristonarmstrong/hive-dapp" },
{ label: "Kivy Twisted Input Capture", date: new Date("6/27/2021"), url: "https://github.com/tristonarmstrong/KivyTwistedInputCapture" },
{ label: "Plant Monitor Node MCU", date: new Date("6/27/2021"), url: "https://github.com/tristonarmstrong/PlantMonitorNodeMCU" },
{ label: "Oppo BDP 103 CLI", date: new Date("4/10/2021"), url: "https://github.com/tristonarmstrong/oppo_bdp_103_CLI" },
{ label: "Sony Bravia Pro Server", date: new Date("4/10/2021"), url: "https://github.com/tristonarmstrong/sony_bravia_pro_display_mock_server" },
{ label: "Chat IO", date: new Date("6/10/2020"), url: "https://github.com/tristonarmstrong/chat.io" },
{ label: "Solar Battery Monitor API", date: new Date("7/18/2023"), url: "https://github.com/tristonarmstrong/SolarBatteryMonitorApi" },
{ label: "Zip Code Distance App", date: new Date("1/28/2020"), url: "https://github.com/tristonarmstrong/zipapp" },
{ label: "Armstrong Editor", date: new Date("12/14/2022"), url: "https://github.com/tristonarmstrong/armstrong-editor" },
]
const container = document.getElementById('projects')
data.sort((a, b) => b.date - a.date).forEach(
p => container.appendChild(new Project(p.label, p.date.toDateString(), p.url).show())
)
})()