diff --git a/front/src/index.ts b/front/src/index.ts
index 63cefdf..977b594 100644
--- a/front/src/index.ts
+++ b/front/src/index.ts
@@ -201,149 +201,150 @@ const openLocker = (lat: string, lon: string, openCode: string, id: string) => {
};
};
-const refreshPackages = () =>
- request("packages", {}).then((res: Package[]) => {
- const table = document.querySelector("tbody")!;
- res.reverse().forEach((shipment) => {
- const row = table.insertRow();
- const id = row.insertCell(0);
- const sender = row.insertCell(1);
- const status = row.insertCell(2);
- const locker = row.insertCell(3);
- const details = row.insertCell(4);
- const opener = row.insertCell(5);
+const refreshPackages = async (response?: Package[]) => {
+ const res: Package[] = response || (await request("packages", {}));
+ const table = document.querySelector("tbody")!;
+ res.reverse().forEach((shipment) => {
+ const row = table.insertRow();
+ const id = row.insertCell(0);
+ const sender = row.insertCell(1);
+ const status = row.insertCell(2);
+ const locker = row.insertCell(3);
+ const details = row.insertCell(4);
+ const opener = row.insertCell(5);
- row.dataset.pickupPointLat = shipment.pickupPoint.location.latitude.toString();
- row.dataset.pickupPointLon = shipment.pickupPoint.location.longitude.toString();
- row.dataset.pickupPointDescription = shipment.pickupPoint.description;
- row.dataset.pickupPointName = shipment.pickupPoint.name;
- row.dataset.pickupPointStatus = shipment.pickupPoint.status;
- row.dataset.pickupPointStreet = shipment.pickupPoint.address.street;
- row.dataset.pickupPointStreetNumber = shipment.pickupPoint.address.buildingNumber;
- row.dataset.pickupPointCity = shipment.pickupPoint.address.city;
- row.dataset.pickupPointProvince = shipment.pickupPoint.address.province;
- row.dataset.pickupPointPostCode = shipment.pickupPoint.address.postCode;
- row.dataset.openCode = shipment.openCode;
- row.dataset.id = shipment.shipmentNumber;
- row.dataset.sender = shipment.senderName;
- row.dataset.status = shipment.status;
+ row.dataset.pickupPointLat = shipment.pickupPoint.location.latitude.toString();
+ row.dataset.pickupPointLon = shipment.pickupPoint.location.longitude.toString();
+ row.dataset.pickupPointDescription = shipment.pickupPoint.description;
+ row.dataset.pickupPointName = shipment.pickupPoint.name;
+ row.dataset.pickupPointStatus = shipment.pickupPoint.status;
+ row.dataset.pickupPointStreet = shipment.pickupPoint.address.street;
+ row.dataset.pickupPointStreetNumber = shipment.pickupPoint.address.buildingNumber;
+ row.dataset.pickupPointCity = shipment.pickupPoint.address.city;
+ row.dataset.pickupPointProvince = shipment.pickupPoint.address.province;
+ row.dataset.pickupPointPostCode = shipment.pickupPoint.address.postCode;
+ row.dataset.openCode = shipment.openCode;
+ row.dataset.id = shipment.shipmentNumber;
+ row.dataset.sender = shipment.senderName;
+ row.dataset.status = shipment.status;
- id.innerText = shipment.shipmentNumber;
- sender.innerText = shipment.senderName;
- status.innerText = shipment.status;
- locker.innerText = `${shipment.pickupPoint.name} - ${shipment.pickupPoint.description}`;
+ id.innerText = shipment.shipmentNumber;
+ sender.innerText = shipment.senderName;
+ status.innerText = shipment.status;
+ locker.innerText = `${shipment.pickupPoint.name} - ${shipment.pickupPoint.description}`;
- const showDetailsAction = document.createElement("a");
- showDetailsAction.classList.add("button", "is-light", "is-small");
- showDetailsAction.innerHTML = "Info";
+ const showDetailsAction = document.createElement("a");
+ showDetailsAction.classList.add("button", "is-light", "is-small");
+ showDetailsAction.innerHTML = "Info";
- showDetailsAction.addEventListener("click", async (event) => {
- const detailsBox = document.querySelector(".details-box")! as HTMLDivElement;
- detailsBox.style.display = "block";
- const data = ((event.target as Element).parentNode!.parentNode as HTMLElement).dataset;
- // maybe this looks like shit, but it works
- let leafletLoaded = false;
- try {
- leafletLoaded = !!L;
- } catch (e) {
- if (!(e instanceof ReferenceError)) {
- throw e;
- }
+ showDetailsAction.addEventListener("click", async (event) => {
+ const detailsBox = document.querySelector(".details-box")! as HTMLDivElement;
+ detailsBox.style.display = "block";
+ const data = ((event.target as Element).parentNode!.parentNode as HTMLElement).dataset;
+ // maybe this looks like shit, but it works
+ let leafletLoaded = false;
+ try {
+ leafletLoaded = !!L;
+ } catch (e) {
+ if (!(e instanceof ReferenceError)) {
+ throw e;
}
- if (!leafletLoaded) {
- document.querySelector("head")!.appendChild(leafletLoaderCSS);
- document.querySelector("head")!.appendChild(leafletLoaderJS);
- await new Promise((resolve, reject) => {
- leafletLoaderJS.addEventListener("load", () => {
- resolve();
- });
- leafletLoaderJS.addEventListener("error", () => {
- reject();
- });
+ }
+ if (!leafletLoaded) {
+ document.querySelector("head")!.appendChild(leafletLoaderCSS);
+ document.querySelector("head")!.appendChild(leafletLoaderJS);
+ await new Promise((resolve, reject) => {
+ leafletLoaderJS.addEventListener("load", () => {
+ resolve();
});
- map = L.map("map");
- }
- map!.setView([parseFloat(data.pickupPointLat!), parseFloat(data.pickupPointLon!)], 17);
- L.tileLayer("https://{s}.tile.openstreetmap.fr/hot/{z}/{x}/{y}.png", {
- attribution:
- 'Map data © OpenStreetMap contributors',
- maxZoom: 19,
- }).addTo(map!);
- // delete previous markers
- while (markers.length > 0) {
- // @ts-ignore it's always marker, while loop checks length
- map.removeLayer(markers.pop());
- }
- const marker = L.marker([
- parseFloat(data.pickupPointLat!),
- parseFloat(data.pickupPointLon!),
- ]).addTo(map!);
- markers.push(marker);
- const openButton = detailsBox.querySelector(
- ".modal-card-foot button.is-primary",
- )! as HTMLButtonElement;
- if (data.status === PackageStatus.READY_TO_PICKUP) {
- openButton.removeAttribute("disabled");
- openButton.onclick = (e: Event) => {
- e.preventDefault();
- (document.querySelector(".details-box")! as HTMLElement).style.display = "none";
- const { dataset } = (event.target as Element).parentNode!.parentNode as HTMLElement;
- openLocker(
- dataset.pickupPointLat!,
- dataset.pickupPointLon!,
- dataset.openCode!,
- dataset.id!,
- );
- };
- } else {
- openButton.setAttribute("disabled", "true");
- openButton.onclick = null;
- }
- const infoTable = detailsBox.querySelector(".details-text")! as HTMLTableElement;
- // remove previous data from table
- Array.from(infoTable.tBodies).forEach((tbody) => tbody.remove());
- ([
- ["Status", "status"],
- [
- "Pickup point",
- (d) => `${d.pickupPointName} (${d.pickupPointStatus})
+ leafletLoaderJS.addEventListener("error", () => {
+ reject();
+ });
+ });
+ map = L.map("map");
+ }
+ map!.setView([parseFloat(data.pickupPointLat!), parseFloat(data.pickupPointLon!)], 17);
+ L.tileLayer("https://{s}.tile.openstreetmap.fr/hot/{z}/{x}/{y}.png", {
+ attribution:
+ 'Map data © OpenStreetMap contributors',
+ maxZoom: 19,
+ }).addTo(map!);
+ // delete previous markers
+ while (markers.length > 0) {
+ // @ts-ignore it's always marker, while loop checks length
+ map.removeLayer(markers.pop());
+ }
+ const marker = L.marker([
+ parseFloat(data.pickupPointLat!),
+ parseFloat(data.pickupPointLon!),
+ ]).addTo(map!);
+ markers.push(marker);
+ const openButton = detailsBox.querySelector(
+ ".modal-card-foot button.is-primary",
+ )! as HTMLButtonElement;
+ if (data.status === PackageStatus.READY_TO_PICKUP) {
+ openButton.removeAttribute("disabled");
+ openButton.onclick = (e: Event) => {
+ e.preventDefault();
+ (document.querySelector(".details-box")! as HTMLElement).style.display = "none";
+ const { dataset } = (event.target as Element).parentNode!.parentNode as HTMLElement;
+ openLocker(
+ dataset.pickupPointLat!,
+ dataset.pickupPointLon!,
+ dataset.openCode!,
+ dataset.id!,
+ );
+ };
+ } else {
+ openButton.setAttribute("disabled", "true");
+ openButton.onclick = null;
+ }
+ const infoTable = detailsBox.querySelector(".details-text")! as HTMLTableElement;
+ // remove previous data from table
+ Array.from(infoTable.tBodies).forEach((tbody) => tbody.remove());
+ ([
+ ["Status", "status"],
+ [
+ "Pickup point",
+ (d) => `${d.pickupPointName} (${d.pickupPointStatus})
${d.pickupPointDescription}
${d.pickupPointStreet} ${d.pickupPointStreetNumber}
${d.pickupPointProvince}
${d.pickupPointPostCode} ${d.pickupPointCity}`,
- ],
- ["Sender", "sender"],
- ["Open code", "openCode"],
- ["Package number", "id"],
- ] as [string, string | ((d: typeof data) => string)][]).forEach(([key, value]) => {
- const infoRow = infoTable.insertRow();
- const keyCell = infoRow.insertCell();
- keyCell.innerText = key;
- const valueCell = infoRow.insertCell();
- if (typeof value === "string") {
- valueCell.innerText = `${data[value]}`;
- } else {
- valueCell.innerText = value(data);
- }
- });
+ ],
+ ["Sender", "sender"],
+ ["Open code", "openCode"],
+ ["Package number", "id"],
+ ] as [string, string | ((d: typeof data) => string)][]).forEach(([key, value]) => {
+ const infoRow = infoTable.insertRow();
+ const keyCell = infoRow.insertCell();
+ keyCell.innerText = key;
+ const valueCell = infoRow.insertCell();
+ if (typeof value === "string") {
+ valueCell.innerText = `${data[value]}`;
+ } else {
+ valueCell.innerText = value(data);
+ }
});
-
- const openAction = document.createElement("a");
- openAction.classList.add("button", "is-light", "is-small");
- openAction.innerHTML = "Open";
- if (shipment.status === PackageStatus.READY_TO_PICKUP) {
- openAction.addEventListener("click", (event) => {
- const data = ((event.target as Element).parentNode!.parentNode as HTMLElement).dataset;
- openLocker(data.pickupPointLat!, data.pickupPointLon!, data.openCode!, data.id!);
- });
- } else {
- openAction.setAttribute("disabled", "");
- }
-
- opener.appendChild(openAction);
- details.appendChild(showDetailsAction);
});
+
+ const openAction = document.createElement("a");
+ openAction.classList.add("button", "is-light", "is-small");
+ openAction.innerHTML = "Open";
+ if (shipment.status === PackageStatus.READY_TO_PICKUP) {
+ openAction.addEventListener("click", (event) => {
+ const data = ((event.target as Element).parentNode!.parentNode as HTMLElement).dataset;
+ openLocker(data.pickupPointLat!, data.pickupPointLon!, data.openCode!, data.id!);
+ });
+ } else {
+ openAction.setAttribute("disabled", "");
+ }
+
+ opener.appendChild(openAction);
+ details.appendChild(showDetailsAction);
});
+};
+
window.addEventListener("load", () => {
const login = document.querySelector(".login-form")!;
login.addEventListener("submit", (event) => {
@@ -453,29 +454,30 @@ window.addEventListener("load", () => {
});
});
- request("session", {}).then((res) => {
- switch (parseInt(res.status, 10)) {
- case 200:
- // logged in, verified e-mail and phone
- refreshPackages().then(() => {
- (document.querySelector(".package-list")! as HTMLDivElement).style.display = "block";
- });
- localStorage.removeItem("phone");
- break;
- case -1:
- // not logged in
- [".login-box", ".register-box"].forEach((elementName) => {
- (document.querySelector(elementName)! as HTMLDivElement).style.display = "block";
- });
- break;
- case -2:
- (document.querySelector(".mail-box")! as HTMLDivElement).style.display = "block";
- break;
- case -3:
- (document.querySelector(".sms-box")! as HTMLDivElement).style.display = "block";
- break;
- default:
- openError(res.description || res.msg || `Session error: ${res.status}`);
+ request("packages", {}).then((res) => {
+ if (Array.isArray(res)) {
+ // logged in, verified e-mail and phone, res is the package list
+ refreshPackages(res);
+ (document.querySelector(".package-list")! as HTMLDivElement).style.display = "block";
+ // just to be sure
+ localStorage.removeItem("phone");
+ } else {
+ switch (parseInt(res.status, 10)) {
+ case -1:
+ // not logged in
+ [".login-box", ".register-box"].forEach((elementName) => {
+ (document.querySelector(elementName)! as HTMLDivElement).style.display = "block";
+ });
+ break;
+ case -2:
+ (document.querySelector(".mail-box")! as HTMLDivElement).style.display = "block";
+ break;
+ case -3:
+ (document.querySelector(".sms-box")! as HTMLDivElement).style.display = "block";
+ break;
+ default:
+ openError(res.description || res.msg || `Session error: ${res.status}`);
+ }
}
});
});