Added functionality to update and delete links

php
Aadhavan Srinivasan 1 year ago
parent f7b6fa83dd
commit 7b0e1986e2

@ -1,3 +1,9 @@
<?php
session_start();
if (!isset($_SESSION['user'])) {
header('Location: https://glink.zip/');
}
?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
@ -6,6 +12,8 @@
<link rel="stylesheet" href="output.css"> <link rel="stylesheet" href="output.css">
</head> </head>
<body class="mx-[10%]"> <body class="mx-[10%]">
<script src="htmx.min.js"></script>
<main class="m-10 h-auto w-auto "> <main class="m-10 h-auto w-auto ">
<?php include 'header.php'; ?> <?php include 'header.php'; ?>
@ -17,87 +25,26 @@
<thead> <thead>
<tr class="text-emerald-400 brightness-125 text-xl font-bold text-center"> <tr class="text-emerald-400 brightness-125 text-xl font-bold text-center">
<th></th> <th></th>
<th>gLink</th> <th>GLink</th>
<th>URL</th> <th>URL</th>
<th>Edit</th> <th>Edit</th>
<th>Delete</th> <th>Delete</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<!-- row 1 --> <?php
<tr class="data_row text-center" > require_once 'db.inc.php';
<th>1</th> $session = init_cass_db();
<td><input type="text" class="input input-bordered input-success glink_str text-center italic border-none rounded-lg focus:shadow-lg" readonly value="Link 1"></td> $statement = $session->prepare("SELECT * FROM data WHERE user=? AND hell=false ALLOW FILTERING;");
<td><input type="text" class="input input-bordered input-success url_str italic text-center border-none rounded-lg focus:shadow-lg" readonly value="https://www.example.com"></td> $result = $session->execute($statement,array('arguments' => array($_SESSION['user'])));
<td>
<button class="edit_btn btn bg-transparent hover:bg-transparent border-none p-0 m-0" onclick = " ">
<svg width="24"
height="24"
fill="blue"
class="bi bi-pencil"
viewBox="0 0 16 16">
<path d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z"/>
</svg></button>
<button class="save_btn btn mx-8 bg-transparent hover:bg-transparent border-none p-0 m-0 hidden">
<div class="inline-block rotate-45 h-[24px] w-[12px] border-b-4 border-b-green-500 border-r-green-500 border-r-4 hover:border-b-green-300 hover:border-r-green-300"></div>
</button>
<button class="cancel_btn btn bg-transparent hover:bg-transparent border-none p-0 m-0 hidden">
<div class="w-[24px] h-[24px] before:absolute before:content-[' '] before:h-[32px] before:w-[2px] before:bg-red-600 before:rotate-45 after:absolute after:content-[' '] after:h-[32px] after:w-[2px] after:bg-red-600 after:-rotate-45 hover:before:bg-red-400 hover:after:bg-red-400"></div>
</button></td>
<td>
<button class="delete_btn btn bg-transparent hover:bg-transparent border-none p-0 m-0">
<svg xmlns="http://www.w3.org/2000/svg" fill="red" x="0px" y="0px" viewBox="0 0 25 24.8" width="25" height="24" xml:space="preserve" class= "group icon-trashcan ct-delete" data-ember-action="" data-ember-action-1015="1015">
<g class="trashcan-open invisible group-hover:visible">
<path d="M18.7,24.4H5.9L4.9,7h14.9L18.7,24.4z M7.6,22.6H17l0.8-13.7h-11L7.6,22.6z"></path>
<polygon points="13.6,10.3 13.1,21.2 14.9,21.2 15.4,10.3 "></polygon>
<polygon points="11.5,21.2 11,10.3 9.2,10.3 9.7,21.2 "></polygon>
<path d="M19.1,0.7l-4.7,0.9l-0.8-1.4L8.2,1.3L8,3l-4.7,1l0.2,4.7l17.3-3.5L19.1,0.7z
M8.8,1.9l4.4 -1.0 l0.5,0.8 for ($i=0; $i < $result->count(); $i++) { ?>
L8.7,2.8z
M5.2,6.4l0-1L18,2.8l0.3,0.9L5.2,6.4z"></path>
</g>
<g class="trashcan-closed group-hover:invisible">
<path d="M6.8,8.8h11L17,22.6
H7.6L6.8,8.8z
M4.9,7l1,17.4h12.8
l1-17.4
H4.9z"></path>
<polygon points="13.6,10.3 13.1,21.2 14.9,21.2 15.4,10.3 "></polygon>
<polygon points="11.5,21.2 11,10.3 9.2,10.3 9.7,21.2 "></polygon>
<path d="M20.4,4h-4.8l-0.5-1.6
H9.5L9,4
H4.2
L3.5,8.6h17.6
L20.4,4z
M9.9,3.2h4.8
L14.9,3.9h-5.2z
M5.6,6.7l0.2-1 h13l0.2,1
H5.6z"></path>
</g>
</svg>
</button>
</td>
</tr>
<tr class="notification_row text-center w-full hidden">
<td colspan="5"><div class="alert alert-error text-lg">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="stroke-current shrink-0 w-8 h-8"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
<span>You have just deleted a row. Press <button class="undo_btn btn bg-transparent m-0 p-0 h-fit hover:bg-transparent border-none"><kbd class="px-2 py-1.5 text-xs font-semibold text-gray-800 bg-gray-100 border border-gray-200 rounded-lg dark:bg-gray-600 dark:text-gray-100 dark:border-gray-500">undo</kbd></button> to undo the action</span>
<button class="close_btn btn bg-transparent hover:bg-transparent broder-none p-0 m-0 "><svg xmlns="http://www.w3.org/2000/svg" class="stroke-black shrink-0 h-8 w-8" fill="none" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" /></svg></button>
</div></td>
</tr>
</tbody>
<!-- row 2 -->
<tbody>
<tr class="data_row text-center" > <tr class="data_row text-center" >
<th>2</th> <th><?php echo($i+1) ?></th>
<td><input type="text" class="input input-bordered input-success glink_str text-center italic border-none rounded-lg focus:shadow-lg" readonly value="Link 1"></td> <td><input type="text" class="input input-bordered input-success glink_str text-center italic border-none rounded-lg focus:shadow-lg" readonly value=<?php echo($result[$i]['shortlink']);?>></td>
<td><input type="text" class="input input-bordered input-success url_str italic text-center border-none rounded-lg focus:shadow-lg" readonly value="https://www.example.com"></td> <td><input type="text" class="input input-bordered input-success url_str italic text-center border-none rounded-lg focus:shadow-lg" readonly value="<?php echo($result[$i]['url']);?>"></td>
<td> <td>
<button class="edit_btn btn bg-transparent hover:bg-transparent border-none p-0 m-0" onclick = " "> <button class="edit_btn btn bg-transparent hover:bg-transparent border-none p-0 m-0">
<svg width="24" <svg width="24"
height="24" height="24"
fill="blue" fill="blue"
@ -105,14 +52,14 @@
viewBox="0 0 16 16"> viewBox="0 0 16 16">
<path d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z"/> <path d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z"/>
</svg></button> </svg></button>
<button class="save_btn btn mx-8 bg-transparent hover:bg-transparent border-none p-0 m-0 hidden"> <button class="save_btn btn mx-8 bg-transparent hover:bg-transparent border-none p-0 m-0 hidden" hx-post="/updatelink.php" hx-vals='js:{"old_link": "<?php echo($result[$i]['shortlink']); ?>", "old_url": "<?php echo($result[$i]['url']); ?>", "link": event.currentTarget.parentElement.parentElement.getElementsByClassName("glink_str")[0].value, "url": event.currentTarget.parentElement.parentElement.getElementsByClassName("url_str")[0].value}'>
<div class="inline-block rotate-45 h-[24px] w-[12px] border-b-4 border-b-green-500 border-r-green-500 border-r-4 hover:border-b-green-300 hover:border-r-green-300"></div> <div class="inline-block rotate-45 h-[24px] w-[12px] border-b-4 border-b-green-500 border-r-green-500 border-r-4 hover:border-b-green-300 hover:border-r-green-300"></div>
</button> </button>
<button class="cancel_btn btn bg-transparent hover:bg-transparent border-none p-0 m-0 hidden"> <button class="cancel_btn btn bg-transparent hover:bg-transparent border-none p-0 m-0 hidden">
<div class="w-[24px] h-[24px] before:absolute before:content-[' '] before:h-[32px] before:w-[2px] before:bg-red-600 before:rotate-45 after:absolute after:content-[' '] after:h-[32px] after:w-[2px] after:bg-red-600 after:-rotate-45 hover:before:bg-red-400 hover:after:bg-red-400"></div> <div class="w-[24px] h-[24px] before:absolute before:content-[' '] before:h-[32px] before:w-[2px] before:bg-red-600 before:rotate-45 after:absolute after:content-[' '] after:h-[32px] after:w-[2px] after:bg-red-600 after:-rotate-45 hover:before:bg-red-400 hover:after:bg-red-400"></div>
</button></td> </button></td>
<td> <td>
<button class="delete_btn btn bg-transparent hover:bg-transparent border-none p-0 m-0"> <button class="delete_btn btn bg-transparent hover:bg-transparent border-none p-0 m-0" hx-post="/deletelink.php" hx-vals='{"link": "<?php echo($result[$i]['shortlink']);?>"}' >
<svg xmlns="http://www.w3.org/2000/svg" fill="red" x="0px" y="0px" viewBox="0 0 25 24.8" width="25" height="24" xml:space="preserve" class= "group icon-trashcan ct-delete" data-ember-action="" data-ember-action-1015="1015"> <svg xmlns="http://www.w3.org/2000/svg" fill="red" x="0px" y="0px" viewBox="0 0 25 24.8" width="25" height="24" xml:space="preserve" class= "group icon-trashcan ct-delete" data-ember-action="" data-ember-action-1015="1015">
<g class="trashcan-open invisible group-hover:visible"> <g class="trashcan-open invisible group-hover:visible">
<path d="M18.7,24.4H5.9L4.9,7h14.9L18.7,24.4z M7.6,22.6H17l0.8-13.7h-11L7.6,22.6z"></path> <path d="M18.7,24.4H5.9L4.9,7h14.9L18.7,24.4z M7.6,22.6H17l0.8-13.7h-11L7.6,22.6z"></path>
@ -152,77 +99,12 @@
<tr class="notification_row text-center w-full hidden"> <tr class="notification_row text-center w-full hidden">
<td colspan="5"><div class="alert alert-error text-lg"> <td colspan="5"><div class="alert alert-error text-lg">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="stroke-current shrink-0 w-8 h-8"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="stroke-current shrink-0 w-8 h-8"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
<span>You have just deleted a row. Press <button class="undo_btn btn bg-transparent m-0 p-0 h-fit hover:bg-transparent border-none"><kbd class="px-2 py-1.5 text-xs font-semibold text-gray-800 bg-gray-100 border border-gray-200 rounded-lg dark:bg-gray-600 dark:text-gray-100 dark:border-gray-500">undo</kbd></button> to undo the action</span> <span>You have just deleted a row. Press <button class="undo_btn btn bg-transparent m-0 p-0 h-fit hover:bg-transparent border-none" hx-post="/undodeletelink.php" hx-vals='{"link": "<?php echo($result[$i]['shortlink']); ?>"}'><kbd class="px-2 py-1.5 text-xs font-semibold text-gray-800 bg-gray-100 border border-gray-200 rounded-lg dark:bg-gray-600 dark:text-gray-100 dark:border-gray-500">undo</kbd></button> to undo the action</span>
<button class="close_btn btn bg-transparent hover:bg-transparent broder-none p-0 m-0 "><svg xmlns="http://www.w3.org/2000/svg" class="stroke-black shrink-0 h-8 w-8" fill="none" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" /></svg></button> <button class="close_btn btn bg-transparent hover:bg-transparent broder-none p-0 m-0 "><svg xmlns="http://www.w3.org/2000/svg" class="stroke-black shrink-0 h-8 w-8" fill="none" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" /></svg></button>
</div></td> </div></td>
</tr> </tr>
</tbody> <?php } ?>
<!-- row 3 -->
<tbody>
<tr class="data_row text-center" >
<th>3</th>
<td><input type="text" class="input input-bordered input-success glink_str text-center italic border-none rounded-lg focus:shadow-lg" readonly value="Link 1"></td>
<td><input type="text" class="input input-bordered input-success url_str italic text-center border-none rounded-lg focus:shadow-lg" readonly value="https://www.example.com"></td>
<td>
<button class="edit_btn btn bg-transparent hover:bg-transparent border-none p-0 m-0" onclick = " ">
<svg width="24"
height="24"
fill="blue"
class="bi bi-pencil"
viewBox="0 0 16 16">
<path d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z"/>
</svg></button>
<button class="save_btn btn mx-8 bg-transparent hover:bg-transparent border-none p-0 m-0 hidden">
<div class="inline-block rotate-45 h-[24px] w-[12px] border-b-4 border-b-green-500 border-r-green-500 border-r-4 hover:border-b-green-300 hover:border-r-green-300"></div>
</button>
<button class="cancel_btn btn bg-transparent hover:bg-transparent border-none p-0 m-0 hidden">
<div class="w-[24px] h-[24px] before:absolute before:content-[' '] before:h-[32px] before:w-[2px] before:bg-red-600 before:rotate-45 after:absolute after:content-[' '] after:h-[32px] after:w-[2px] after:bg-red-600 after:-rotate-45 hover:before:bg-red-400 hover:after:bg-red-400"></div>
</button></td>
<td>
<button class="delete_btn btn bg-transparent hover:bg-transparent border-none p-0 m-0">
<svg xmlns="http://www.w3.org/2000/svg" fill="red" x="0px" y="0px" viewBox="0 0 25 24.8" width="25" height="24" xml:space="preserve" class= "group icon-trashcan ct-delete" data-ember-action="" data-ember-action-1015="1015">
<g class="trashcan-open invisible group-hover:visible">
<path d="M18.7,24.4H5.9L4.9,7h14.9L18.7,24.4z M7.6,22.6H17l0.8-13.7h-11L7.6,22.6z"></path>
<polygon points="13.6,10.3 13.1,21.2 14.9,21.2 15.4,10.3 "></polygon>
<polygon points="11.5,21.2 11,10.3 9.2,10.3 9.7,21.2 "></polygon>
<path d="M19.1,0.7l-4.7,0.9l-0.8-1.4L8.2,1.3L8,3l-4.7,1l0.2,4.7l17.3-3.5L19.1,0.7z
M8.8,1.9l4.4 -1.0 l0.5,0.8
L8.7,2.8z
M5.2,6.4l0-1L18,2.8l0.3,0.9L5.2,6.4z"></path>
</g>
<g class="trashcan-closed group-hover:invisible">
<path d="M6.8,8.8h11L17,22.6
H7.6L6.8,8.8z
M4.9,7l1,17.4h12.8
l1-17.4
H4.9z"></path>
<polygon points="13.6,10.3 13.1,21.2 14.9,21.2 15.4,10.3 "></polygon>
<polygon points="11.5,21.2 11,10.3 9.2,10.3 9.7,21.2 "></polygon>
<path d="M20.4,4h-4.8l-0.5-1.6
H9.5L9,4
H4.2
L3.5,8.6h17.6
L20.4,4z
M9.9,3.2h4.8
L14.9,3.9h-5.2z
M5.6,6.7l0.2-1 h13l0.2,1
H5.6z"></path>
</g>
</svg>
</button>
</td>
</tr>
<tr class="notification_row text-center w-full hidden">
<td colspan="5"><div class="alert alert-error text-lg">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="stroke-current shrink-0 w-8 h-8"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
<span>You have just deleted a row. Press <button class="undo_btn btn bg-transparent m-0 p-0 h-fit hover:bg-transparent border-none"><kbd class="px-2 py-1.5 text-xs font-semibold text-gray-800 bg-gray-100 border border-gray-200 rounded-lg dark:bg-gray-600 dark:text-gray-100 dark:border-gray-500">undo</kbd></button> to undo the action</span>
<button class="close_btn btn bg-transparent hover:bg-transparent broder-none p-0 m-0 "><svg xmlns="http://www.w3.org/2000/svg" class="stroke-black shrink-0 h-8 w-8" fill="none" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" /></svg></button>
</div></td>
</tr>
</tbody> </tbody>
<script> <script>
let allButtons = document.getElementsByClassName('btn'); let allButtons = document.getElementsByClassName('btn');

Loading…
Cancel
Save