add discord webhook manager

2020-10-13 21:52:02 +03:00 · 2020-10-13 21:52:02 +03:00 · 4c5901d614
commit 4c5901d614
parent 6b84c13a9b
1 changed files with 124 additions and 0 deletions
--- a/discordwebhookmanager/index.html
+++ b/discordwebhookmanager/index.html
@ -0,0 +1,124 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>hippoz</title>
+
+    <link rel="stylesheet" href="https://hippoz.xyz/res/style.css">
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500&display=swap">
+
+    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
+</head>
+<body>
+    <div id="app">
+        <div class="card navigation-card">
+            <div class="navigation-buttons">
+                <a v-for="(webhook, webhookIndex) in webhooks" @click="selectedWebhook = webhookIndex" class="button-default button-selected">{{ webhook.name }}</a>
+            </div>
+        </div>
+    
+        <div class="card" id="content-container">
+            <h2>Selected webhook: {{ selectedWebhookObject.name }}</h2>
+            <p>i think</p>
+            <br>
+            <div id="contols" v-if="selectedWebhookObject.url && selectedWebhookObject.name">
+                <input class="input" placeholder="message" type="text" v-model="message"> </br>
+                <button class="button-default button-selected" @click="sendMessage(selectedWebhookObject, message)">Send</button>
+                <br>
+                <button class="button-default button-selected" @click="deleteCurrentWebhook()">Delete</button>
+            </div>
+            <br>
+            <div>
+                <button class="button-default button-selected" @click="createWebhook()">New webhook</button>
+            </div>
+        </div>
+    </div>
+
+
+    <script>
+        const app = new Vue({
+            el: '#app',
+            data: {
+                webhooks: [
+                    {
+                        name: 'test',
+                        url: 'https://discordapp.com/api/webhooks/765640620327829525/Qe9525MFu14-K_t7Fq3PitanumcF-gLf_NZ9ncG0RD2yPye9JEkuC3L7vkDqxRtvvQMD'
+                    }
+                ],
+                selectedWebhook: -1,
+                message: ''
+            },
+            mounted: function() {
+                this.loadFromLocalstorage();
+            },
+            methods: {
+                sendMessage: async function(webhook, message) {
+                    if (!webhook.url || !webhook.name || !message) return;
+
+                    const res = await fetch(webhook.url, {
+                        method: 'POST',
+                        headers: {
+                            'Content-Type': 'application/json'
+                        }, 
+                        body: JSON.stringify({
+                            content: message
+                        })
+                    });
+
+                    console.log(await res.text());
+                },
+                createWebhook: function() {
+                    const name = prompt('Webhook name');
+                    const url = prompt('Webhook url');
+                    if (!url || !name || url === '' || name === '') {
+                        alert('Invalid input');
+                        return;
+                    }
+
+                    this.webhooks.push({ name, url });
+                    this.saveToLocalstorage();
+                },
+                deleteWebhookByIndex: function(index) {
+                    this.webhooks.splice(index, 1);
+                },
+                deleteCurrentWebhook: function() {
+                    this.selectedWebhook = -1;
+                    this.deleteWebhookByIndex(this.selectedWebhook);
+                    this.saveToLocalstorage();
+                },
+                saveToLocalstorage: function() {
+                    localStorage.setItem('webhooks', JSON.stringify(this.webhooks));
+                },
+                loadFromLocalstorage: function() {
+                    const savedWebhooks = localStorage.getItem('webhooks');
+                    if (!savedWebhooks) {
+                        this.webhooks = [];
+                        return;
+                    }
+                    try {
+                        const webhooksJSON = JSON.parse(savedWebhooks);
+                        if (!webhooksJSON) {
+                            console.error('Parsing localstorage data returned undefined, clearing localstorage...', e);
+                            this.webhooks = [];
+                            localStorage.clear();
+                            return;
+                        }
+                        this.webhooks = webhooksJSON;
+                    } catch(e) {
+                        console.error('Error while parsing saved localstorage data, clearing localstorage...', e);
+                        this.webhooks = [];
+                        localStorage.clear();
+                        return;
+                    }
+                }
+            },
+            computed: {
+                selectedWebhookObject: function() {
+                    return this.webhooks[this.selectedWebhook] || { name: 'none' };
+                }
+            }
+        });
+    </script>
+</body>
+</html>