API, front-end

openprotest · Sep 23, 2024 · 757d5d2 · 757d5d2
1 parent 2ce4d52
commit 757d5d2
Show file tree

Hide file tree

Showing 2 changed files with 105 additions and 4 deletions.
diff --git a/Protest/Front/api.js b/Protest/Front/api.js
@@ -17,7 +17,7 @@ class Api extends List {
 		this.createButton = this.AddToolbarButton("Create API link", "mono/add.svg?light");
 		this.deleteButton = this.AddToolbarButton("Delete", "mono/delete.svg?light");
 
-		this.createButton.onclick = ()=> this.Create();
+		this.createButton.onclick = ()=> this.CreateDialog();
 		this.deleteButton.onclick = ()=> this.Delete();
 
 		this.UpdateAuthorization();
@@ -30,11 +30,112 @@ class Api extends List {
 		super.UpdateAuthorization();
 	}
 
-	Create() {
+	CreateDialog() {
+		const dialog = this.DialogBox("420px");
+		if (dialog === null) return;
 
+		const {okButton, innerBox} = dialog;
+
+		okButton.value = "Create";
+
+		innerBox.parentElement.style.maxWidth = "640px";
+
+		innerBox.style.padding = "16px 32px";
+		innerBox.style.display = "grid";
+		innerBox.style.gridTemplateColumns = "auto 150px 275px auto";
+		innerBox.style.gridTemplateRows = "repeat(6, 38px) 72px";
+		innerBox.style.alignItems = "center";
+
+		let counter = 0;
+		const AddParameter = (name, tag, type, properties) => {
+			counter++;
+
+			const label = document.createElement("div");
+			label.style.gridArea = `${counter} / 2`;
+			label.textContent = `${name}:`;
+
+			const input = document.createElement(tag);
+			input.style.gridArea = `${counter} / 3`;
+			if (type) {
+				input.type = type;
+			}
+
+			for (let param in properties) {
+				input[param] = properties[param];
+			}
+
+			innerBox.append(label, input);
+
+			return input;
+		};
+
+		const nameInput = AddParameter("Name", "input", "text");
+
+		setTimeout(()=>nameInput.focus(), 200);
+
+		okButton.onclick =  async ()=> {
+			let requiredFieldMissing = false;
+			let requiredFields = [nameInput];
+
+			for (let i=0; i<requiredFields.length; i++) {
+				if (requiredFields[i].value.length === 0) {
+					if (!requiredFieldMissing) requiredFields[i].focus();
+					requiredFields[i].required = true;
+					requiredFieldMissing = true;
+					requiredFields[i].style.animationDuration = `${(i+1)*.1}s`;
+				}
+				else {
+					requiredFields[i].required = false;
+				}
+			}
+
+			if (requiredFieldMissing) return;
+
+			let body = `name=${nameInput.value}\n`;
+			body += `guid=00000000-0000-0000-0000-000000000000\n`;
+
+			try {
+				const response = await fetch("api/create", {
+					method: "POST",
+					body: body
+				});
+
+				if (response.status !== 200) LOADER.HttpErrorHandler(response.status);
+
+				const json = await response.json();
+				if (json.error) throw (json.error);
+
+				this.link = json;
+				this.ListCerts();
+			}
+			catch (ex) {
+				this.ConfirmBox(ex, true, "mono/error.svg");
+			}
+
+			dialog.Close();
+		};
 	}
 
 	async Delete() {
+		if (this.args.select === null) return;
+
+		this.ConfirmBox("Are you sure you want delete this link?").addEventListener("click", async()=> {
+			try {
+				const response = await fetch(`api/delete?name=${encodeURIComponent(this.args.select)}`);
+				if (response.status !== 200) LOADER.HttpErrorHandler(response.status);
+
+				const json = await response.json();
+				if (json.error) throw(json.error);
+
+				this.selected = null;
+				this.args.select = null;
 
+				this.link = json;
+				this.ListCerts();
+			}
+			catch (ex) {
+				this.ConfirmBox(ex, true, "mono/error.svg")
+			}
+		});
 	}
 }
diff --git a/Protest/Front/backup.js b/Protest/Front/backup.js
@@ -19,7 +19,7 @@ class Backup extends List {
 		this.AddToolbarSeparator();
 		this.downloadButton = this.AddToolbarButton("Download", "mono/download.svg?light");
 
-		this.createButton.onclick = ()=> this.Create();
+		this.createButton.onclick = ()=> this.CreateDialog();
 		this.deleteButton.onclick = ()=> this.Delete();
 		this.downloadButton.onclick = ()=> this.Download();
 
@@ -70,7 +70,7 @@ class Backup extends List {
 		}
 	}
 
-	Create() {
+	CreateDialog() {
 		const dialog = this.DialogBox("108px");
 		if (dialog === null) return;