getnamingo-registry/cp/resources/views/partials/js-tlds.twig
2025-04-03 13:36:21 +03:00

118 lines
No EOL
8.2 KiB
Twig
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<script src="/assets/js/tabulator.min.js" defer></script>
<script src="/assets/js/tabler.min.js" defer></script>
<script src="/assets/js/xlsx.full.min.js" defer></script>
<script src="/assets/js/jspdf.umd.min.js" defer></script>
<script src="/assets/js/jspdf.plugin.autotable.min.js" defer></script>
<script>
var table;
document.addEventListener("DOMContentLoaded", function(){
function tldLinkFormatter(cell){
var displayName = cell.getValue();
var punycodeName = cell.getRow().getData().tld_o;
return `<a href="/registry/tld/${punycodeName}" style="font-weight:bold;">${displayName}</a>`;
}
function secureFormatter(cell) {
// Get the value of the 'secure' field
var secure = cell.getValue();
// Return appropriate SVG icon and text based on the secure value
return secure === 1 ?
`<svg xmlns="http://www.w3.org/2000/svg" class="icon me-1 text-success" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 12l5 5l10 -10" /></svg> {{ __('Signed') }}` :
`<svg xmlns="http://www.w3.org/2000/svg" class="icon me-1 text-warning" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M18 6l-12 12" /><path d="M6 6l12 12" /></svg> {{ __('Not signed') }}`;
}
function actionsFormatter(cell, formatterParams, onRendered) {
return `<a class="btn btn-icon btn-outline-primary" href="/registry/tld/${cell.getRow().getData().tld_o}" title="{{ __('Manage Settings') }}"><svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M7 10h3v-3l-3.5 -3.5a6 6 0 0 1 8 8l6 6a2 2 0 0 1 -3 3l-6 -6a6 6 0 0 1 -8 -8l3.5 3.5" /></svg></a> <a class="btn btn-icon btn-outline-green" href="/registry/promotion/${cell.getRow().getData().tld_o}" title="{{ __('Manage Promotions') }}"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M17 17m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" /><path d="M7 7m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" /><path d="M6 18l12 -12" /></svg></a> <a class="btn btn-icon btn-outline-indigo" href="/registry/phases/${cell.getRow().getData().tld_o}" title="{{ __('Manage Launch Phases') }}"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="icon"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M16 2c.183 0 .355 .05 .502 .135l.033 .02c.28 .177 .465 .49 .465 .845v1h1a3 3 0 0 1 2.995 2.824l.005 .176v12a3 3 0 0 1 -2.824 2.995l-.176 .005h-12a3 3 0 0 1 -2.995 -2.824l-.005 -.176v-12a3 3 0 0 1 2.824 -2.995l.176 -.005h1v-1a1 1 0 0 1 .514 -.874l.093 -.046l.066 -.025l.1 -.029l.107 -.019l.12 -.007q .083 0 .161 .013l.122 .029l.04 .012l.06 .023c.328 .135 .568 .44 .61 .806l.007 .117v1h6v-1a1 1 0 0 1 1 -1m3 7h-14v9.625c0 .705 .386 1.286 .883 1.366l.117 .009h12c.513 0 .936 -.53 .993 -1.215l.007 -.16z" /><path d="M9.015 13a1 1 0 0 1 -1 1a1.001 1.001 0 1 1 -.005 -2c.557 0 1.005 .448 1.005 1" /><path d="M13.015 13a1 1 0 0 1 -1 1a1.001 1.001 0 1 1 -.005 -2c.557 0 1.005 .448 1.005 1" /><path d="M17.02 13a1 1 0 0 1 -1 1a1.001 1.001 0 1 1 -.005 -2c.557 0 1.005 .448 1.005 1" /><path d="M12.02 15a1 1 0 0 1 0 2a1.001 1.001 0 1 1 -.005 -2z" /><path d="M9.015 16a1 1 0 0 1 -1 1a1.001 1.001 0 1 1 -.005 -2c.557 0 1.005 .448 1.005 1" /></svg></a> <a class="btn btn-icon btn-outline-orange" href="/registry/idnexport/${cell.getRow().getData().tld_o}" title="{{ __('Export IDN Table') }}" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M14 3v4a1 1 0 0 0 1 1h4" /><path d="M11.5 21h-4.5a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v5m-5 6h7m-3 -3l3 3l-3 3" /></svg></a>`;
}
// Mapping of database string values to script names
const dbValueToScriptName = {
'/^(?!-)(?!.*--)[A-Z0-9-]{1,63}(?<!-)(.(?!-)(?!.*--)[A-Z0-9-]{1,63}(?<!-))*$/i': 'ASCII',
'/^[а-яА-ЯґҐєЄіІїЇѝЍћЋљЈ0-9ʼѫѣѭ]+$/u': 'Cyrillic',
'/^[ぁ-んァ-ン一-龯々0-9]+$/u': 'Japanese',
'/^[가-힣0-9]+$/u': 'Korean',
'/^(?!-)(?!.*--)[\u0621-\u064A\u0660-\u0669\u0671-\u06D3-]{1,63}(?<!-)$/u': 'Arabic'
};
const scriptNameToBadgeClass = {
'ASCII': 'bg-indigo-lt', // Blue badge for ASCII
'Cyrillic': 'bg-secondary-lt', // Grey badge for Cyrillic
'Japanese': 'bg-success-lt', // Green badge for Japanese
'Korean': 'bg-danger-lt', // Red badge for Korean
'Arabic': 'bg-teal-lt', // Teal badge for Japanese
// Add more mappings as needed
'Unknown': 'bg-warning-lt' // Yellow badge for Unknown
};
function scriptNameFormatter(cell, formatterParams) {
const idnTableValue = cell.getValue();
const scriptName = dbValueToScriptName[idnTableValue] || 'Unknown';
const badgeClass = scriptNameToBadgeClass[scriptName];
// Return HTML string with Bootstrap badge
return `<span class="badge ${badgeClass}">${scriptName}</span>`;
}
table = new Tabulator("#tldTable", {
ajaxURL:"/api/records/domain_tld", // Set the URL for your JSON data
ajaxConfig:"GET",
pagination:"local",
paginationSize: 10,
paginationSizeSelector:[10, 25, 50, 100],
clipboard:true,
clipboardPasteAction:"replace",
ajaxResponse:function(url, params, response){
return response.records;
},
layout:"fitColumns",
responsiveLayout: "collapse",
responsiveLayoutCollapseStartOpen:false,
resizableColumns:false,
placeholder: "{{ __('No Data') }}",
columns:[
{formatter:"responsiveCollapse", width:30, minWidth:30, hozAlign:"center", resizable:false, headerSort:false, responsive:0},
{title:"TLD", field:"tld", minWidth:50, headerSort:true, resizable:false, formatter: tldLinkFormatter, responsive:0},
{ title: "{{ __('Script') }}", field: "idn_table", width:300, minWidth:80, headerSort:true, resizable:false, formatter: scriptNameFormatter, responsive:2},
{title:"DNSSEC", field:"secure", width:250, minWidth:80, headerSort:true, resizable:false, formatter: secureFormatter, responsive:2},
{title: "{{ __('Actions') }}", formatter: actionsFormatter, minWidth:200, headerSort: false, resizable:false, download:false, hozAlign: "center", responsive:0, cellClick:function(e, cell){ e.stopPropagation(); }},
]
});
var searchInput = document.getElementById("search-input");
searchInput.addEventListener("input", function () {
var term = searchInput.value.toLowerCase();
if (term) { // Only apply the filter when there's a term to search for
table.setFilter(function (data) {
// Check if any of the fields contain the search term
return (
String(data.tld).toLowerCase().includes(term) ||
String(data.secure).toLowerCase().includes(term)
);
});
} else {
table.clearFilter(); // Clear the filter when the search box is emptied
}
});
});
function downloadCSV() {
table.download("csv", "tlds.csv");
}
function downloadJSON() {
table.download("json", "tlds.json");
}
function downloadXLSX() {
table.download("xlsx", "tlds.xlsx", {sheetName:"My TLDs"});
}
function downloadPDF() {
table.download("pdf", "tlds.pdf", {
orientation:"portrait",
title:"My TLDs"
});
}
</script>