Fixed QR Code Display for Domain-Based URIs
This commit is contained in:
@ -678,32 +678,48 @@
|
|||||||
|
|
||||||
// QR Code Modal
|
// QR Code Modal
|
||||||
$("#qrcodeModal").on("show.bs.modal", function (event) {
|
$("#qrcodeModal").on("show.bs.modal", function (event) {
|
||||||
const button = $(event.relatedTarget);
|
const button = $(event.relatedTarget);
|
||||||
const username = button.data("username");
|
const configContainer = $(`#userConfigs-${button.data("username")}`);
|
||||||
const configContainer = $(`#userConfigs-${username}`);
|
const qrcodesContainer = $("#qrcodesContainer");
|
||||||
const qrcodesContainer = $("#qrcodesContainer");
|
qrcodesContainer.empty();
|
||||||
qrcodesContainer.empty();
|
|
||||||
|
|
||||||
configContainer.find(".config-container").each(function () {
|
configContainer.find(".config-container").each(function () {
|
||||||
const configLink = $(this).data("link");
|
const configLink = $(this).data("link");
|
||||||
const configType = $(this).find(".config-type").text().replace(":", "");
|
const configType = $(this).find(".config-type").text().replace(":", "");
|
||||||
|
|
||||||
// Create a card for each QR code
|
let displayType = configType;
|
||||||
|
|
||||||
|
const hashMatch = configLink.match(/#(.+)$/);
|
||||||
|
if (hashMatch && hashMatch[1]) {
|
||||||
|
const hashValue = hashMatch[1];
|
||||||
|
if (hashValue.includes("IPv4") || hashValue.includes("IPv6")) {
|
||||||
|
displayType = hashValue;
|
||||||
|
}
|
||||||
|
} else if (configLink.includes("ipv4") || configLink.includes("IPv4")) {
|
||||||
|
displayType = "IPv4";
|
||||||
|
} else if (configLink.includes("ipv6") || configLink.includes("IPv6")) {
|
||||||
|
displayType = "IPv6";
|
||||||
|
}
|
||||||
|
|
||||||
|
const qrCodeId = `qrcode-${displayType}-${Math.random().toString(36).substring(2, 10)}`;
|
||||||
|
|
||||||
const card = $(`
|
const card = $(`
|
||||||
<div class="card d-inline-block mx-2 my-2" style="width: 180px;">
|
<div class="card d-inline-block my-2">
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<div id="qrcode-${configType}" class="mx-auto cursor-pointer"></div>
|
<div id="${qrCodeId}" class="mx-auto cursor-pointer"></div>
|
||||||
<div class="config-type-text mt-2 text-center">${configType}</div>
|
<br>
|
||||||
|
<div class="config-type-text mt-2 text-center">${displayType}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
`);
|
`);
|
||||||
|
|
||||||
qrcodesContainer.append(card);
|
qrcodesContainer.append(card);
|
||||||
|
|
||||||
const qrCodeStyling = new QRCodeStyling({
|
const qrCodeStyling = new QRCodeStyling({
|
||||||
width: 150,
|
width: 180,
|
||||||
height: 150,
|
height: 180,
|
||||||
data: configLink,
|
data: configLink,
|
||||||
|
margin: 5,
|
||||||
dotsOptions: {
|
dotsOptions: {
|
||||||
color: "#212121",
|
color: "#212121",
|
||||||
type: "square"
|
type: "square"
|
||||||
@ -720,15 +736,14 @@
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
qrCodeStyling.append(document.getElementById(`qrcode-${configType}`));
|
qrCodeStyling.append(document.getElementById(qrCodeId));
|
||||||
|
|
||||||
// Add click to copy functionality to the card
|
|
||||||
card.on("click", function () {
|
card.on("click", function () {
|
||||||
navigator.clipboard.writeText(configLink)
|
navigator.clipboard.writeText(configLink)
|
||||||
.then(() => {
|
.then(() => {
|
||||||
Swal.fire({
|
Swal.fire({
|
||||||
icon: "success",
|
icon: "success",
|
||||||
title: configType + " link copied!",
|
title: displayType + " link copied!",
|
||||||
showConfirmButton: false,
|
showConfirmButton: false,
|
||||||
timer: 1500,
|
timer: 1500,
|
||||||
});
|
});
|
||||||
@ -745,12 +760,10 @@
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
// Prevent modal from closing when clicking inside
|
|
||||||
$("#qrcodeModal .modal-content").on("click", function (e) {
|
$("#qrcodeModal .modal-content").on("click", function (e) {
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
});
|
});
|
||||||
|
|
||||||
// Clear the QR code when the modal is hidden
|
|
||||||
$("#qrcodeModal").on("hidden.bs.modal", function () {
|
$("#qrcodeModal").on("hidden.bs.modal", function () {
|
||||||
$("#qrcodesContainer").empty();
|
$("#qrcodesContainer").empty();
|
||||||
});
|
});
|
||||||
@ -759,7 +772,6 @@
|
|||||||
$("#qrcodeModal").modal("hide");
|
$("#qrcodeModal").modal("hide");
|
||||||
});
|
});
|
||||||
|
|
||||||
// Search Functionality
|
|
||||||
function filterUsers() {
|
function filterUsers() {
|
||||||
const searchText = $("#searchInput").val().toLowerCase();
|
const searchText = $("#searchInput").val().toLowerCase();
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user