completed wetransfer linking

.gitignore

@@ -1,2 +1,4 @@
 
 .env
+
+*.pyc

short/transfer/static/transfer/script.js

@@ -1,58 +1,56 @@
 
-// wait for submit button to be clicked
-document.getElementById("myinput").onclick = function () {
-    // get the link from the input
-    var link = document.getElementById("linkinput").value;
-
-    // data to be sent to the API
-    var data = {
-        domain: "link.laavesh.ml",
-        originalURL: link,
-        allowDuplicates: false,
-    };
-
-    // add custom path if it is given
-    if (document.getElementById("pathinput").value != "") {
-        data.path = document.getElementById("pathinput").value;
+
+document.addEventListener("DOMContentLoaded", function () {
+
+    // get the submit button
+    document.getElementById("myinput").onclick = function () {
+        // get the link from the input
+        var link = document.getElementById("linkinput").value;
+        var csrf = document.getElementsByName("csrfmiddlewaretoken")[0].value;
+        var message = document.getElementById("message");
+
+
+        console.log(csrf)
+        // data to be sent to the transfer view
+        console.log(link)
+
+        fetch("/transfer", {
+            method: "post",
+            headers: {
+                accept: "application/json",
+                "Content-Type": "application/json",
+                "X-CSRFToken": csrf,
+            },
+            body: JSON.stringify({
+                link: link,
+            }),
+        })
+        .then(function (response) {
+            return response.json();
+        })
+        .then(function (data) {
+            if (data.error) {
+                throw data.error;
+            }
+            // show link updated
+            // Get the text field
+
+            let url = "link.laavesh.ml/we";
+            message.innerHTML = "Updated!";
+            console.log("Updated!");
+
+            // Change back to link after 800ms
+            setTimeout(function () {
+                message.innerHTML = url;
+            }, 800); 
+        })
+
+
+        document.getElementById("linkinput").value = "";
     }
 
-    // send the data to the API
-    fetch("https://api.short.cm/links/public", {
-        method: "post",
-        headers: {
-            accept: "application/json",
-            "Content-Type": "application/json",
-            authorization: "pk_ynFkEXQHXdWrijOF",
-        },
-        body: JSON.stringify(data),
-    })
-    // get the response from the API
-    .then(function (response) {
-        return response.json();
-    })
-    // display the shortened link
-    .then(function (data) {
-        if (data.error) {
-            throw data.error;
-        }
-        // get shortened link
-        let url = String(data.shortURL);
-        // remove https://
-        url =url.replace("https://", "");
-        // display shortened link
-        console.log(url);
-        document.getElementById("message").innerHTML =  url;
-    })
-    // display error if any
-    .catch(function (error) {
-        console.log(error);
-        document.getElementById("message").innerHTML = error;
-    });
-
-    // clear the input fields
-    document.getElementById("linkinput").value = "";
-    document.getElementById("pathinput").value = "";
-};
+});
+
 
 
 // Copy the link to the clipboard

short/transfer/templates/transfer/transfer.html

@@ -15,23 +15,16 @@
 
         <!-- form -->
 		<div class="login-box">
-			<form method="post" action="{% url 'transfer' %}">
+			<form id="transfer_form" method="post" action="{% url 'transfer' %}">
                 {% csrf_token %}
-
                 <!-- long url -->
 				<div class="user-box">
 					<input type="text" name="text" value id="linkinput" required="" />
 					<label>Url</label>
 				</div>
 
-                <!-- path -->
-				<div class="user-box">
-					<input type="text" name="path" value id="pathinput" required="" />
-					<label>Slug</label>
-				</div>
-
                 <!-- button -->
-				<button type="submit" href="#" id="myinput" value="Shorten">
+				<a id="myinput" value="Shorten">
 					<span></span>
 					<span></span>
 					<span></span>
@@ -45,16 +38,16 @@
             <!-- shortened url box -->
             <div class="msg row">
                 <div class="column left">
-                    <p id="message">link.laavesh.ml/ </p>
+                    <p id="message">link.laavesh.ml/we </p>
                 </div>
                 <div class="column right">
-                    <button name="copy" id="copy"><img  src="copy.png" width="30px" alt="copy"  /></button>
+                    <button name="copy" id="copy"><img  src="{% static 'transfer/copy.png' %}" width="30px" alt="copy"  /></button>
                 </div>
             </div>
 		</div>
 
         <!-- link script -->
-        <script src="script.js"></script>
+        <script src="{% static 'transfer/script.js' %}"></script>
 
 	</body>
 </html>

short/transfer/views.py

@@ -1,11 +1,37 @@
 from django.shortcuts import render
+from dotenv import load_dotenv
+import os
+import requests
+import json
+from django.http import JsonResponse
 
 # Create your views here.
+load_dotenv()
+
 
 def transfer(request):
     if request.method == 'POST':
-        print(request.POST)
-        return render(request, 'transfer/transfer.html')
+        # get the post parameters json
+        longurl = json.loads(request.body)['link']
+
+
+        # link.laavesh.ml/we link id
+        url = "https://api.short.io/links/lnk_2MDV_9dCPkoujKaJ"
+
+        # https://developers.short.io/docs/updating-an-existing-short-url
+
+        payload = json.dumps({"allowDuplicates": False, "domain": "link.laavesh.ml", "originalURL": longurl })
+        headers = {
+            'accept': "application/json",
+            'content-type': "application/json",
+            'authorization': os.getenv("API_KEY")
+        }
+
+        response = requests.request("POST", url, data=payload, headers=headers)
+
+        return JsonResponse(response.json())
+
+
 
 
     return render(request, 'transfer/transfer.html')