You've already forked tritonmconverter
init
This commit is contained in:
Dancbeunny98
150
css/style.css
Normal file
150
css/style.css
Normal file
@@ -0,0 +1,150 @@
|
|||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
padding: .5em .5em 0;
|
||||||
|
background-color: #fafafa;
|
||||||
|
|
||||||
|
height: 100vh;
|
||||||
|
max-height: 100vh;
|
||||||
|
|
||||||
|
overflow-x: hidden;
|
||||||
|
overflow-y: auto;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
font-family: Arial sans-serif;
|
||||||
|
font-size: 15pt;
|
||||||
|
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.settings {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.setting-group {
|
||||||
|
display: flex;
|
||||||
|
width: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.setting-group:last-child{
|
||||||
|
flex-direction: column;
|
||||||
|
gap: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.setting-group:first-child, .input {
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.setting-group label {
|
||||||
|
display: flex;
|
||||||
|
width: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.setting-group input {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-field {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
gap: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.args {
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
gap: .5em;
|
||||||
|
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.arg {
|
||||||
|
padding: 5px 10px;
|
||||||
|
border: 1px solid;
|
||||||
|
|
||||||
|
border-radius: 15px;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
gap: .25em;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.delete-arg {
|
||||||
|
font-size: 15px;
|
||||||
|
color: red;
|
||||||
|
font-weight: 600;
|
||||||
|
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
flex-grow: 1;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content .buttons {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content .buttons div {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
width: 49%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content textarea {
|
||||||
|
height: 100%;
|
||||||
|
width: 49%;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
padding: .5em;
|
||||||
|
margin-top: .5em;
|
||||||
|
|
||||||
|
font-size: 12pt;
|
||||||
|
|
||||||
|
text-align: center;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
font-weight: 600;
|
||||||
|
|
||||||
|
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer a {
|
||||||
|
text-decoration: none;
|
||||||
|
|
||||||
|
color: #333;
|
||||||
|
transition: color .5s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer a:hover {
|
||||||
|
color: blueviolet;
|
||||||
|
}
|
||||||
97
index.html
Normal file
97
index.html
Normal file
@@ -0,0 +1,97 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Text Transformer</title>
|
||||||
|
<link rel="stylesheet" href="css/style.css">
|
||||||
|
<!-- <style>-->
|
||||||
|
<!-- body {-->
|
||||||
|
<!-- display: flex;-->
|
||||||
|
<!-- flex-direction: column;-->
|
||||||
|
<!-- font-family: Arial, sans-serif;-->
|
||||||
|
<!-- margin: 0;-->
|
||||||
|
<!-- padding: 0;-->
|
||||||
|
<!-- }-->
|
||||||
|
<!-- .settings, .container {-->
|
||||||
|
<!-- padding: 10px;-->
|
||||||
|
<!-- border-bottom: 1px solid #ccc;-->
|
||||||
|
<!-- }-->
|
||||||
|
<!-- .container {-->
|
||||||
|
<!-- display: flex;-->
|
||||||
|
<!-- height: calc(100vh - 100px);-->
|
||||||
|
<!-- }-->
|
||||||
|
<!-- .input-section, .output-section {-->
|
||||||
|
<!-- width: 50%;-->
|
||||||
|
<!-- padding: 10px;-->
|
||||||
|
<!-- }-->
|
||||||
|
<!-- textarea {-->
|
||||||
|
<!-- width: 100%;-->
|
||||||
|
<!-- height: 100%;-->
|
||||||
|
<!-- resize: none;-->
|
||||||
|
<!-- }-->
|
||||||
|
<!-- </style>-->
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<!-- Yandex.Metrika counter -->
|
||||||
|
<script type="text/javascript" >
|
||||||
|
(function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
|
||||||
|
m[i].l=1*new Date();
|
||||||
|
for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }}
|
||||||
|
k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)})
|
||||||
|
(window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");
|
||||||
|
|
||||||
|
ym(97929485, "init", {
|
||||||
|
clickmap:true,
|
||||||
|
trackLinks:true,
|
||||||
|
accurateTrackBounce:true,
|
||||||
|
webvisor:true
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<noscript><div><img src="https://mc.yandex.ru/watch/97929485" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
|
||||||
|
<!-- /Yandex.Metrika counter -->
|
||||||
|
|
||||||
|
<div class="settings">
|
||||||
|
<div class="setting-group">
|
||||||
|
<label for="key">Enter a key</label><input id="key" type="text" placeholder="Enter localization prefix">
|
||||||
|
</div>
|
||||||
|
<div class="setting-group">
|
||||||
|
<div class="input">
|
||||||
|
<label for="add_arg">Enter a new arg</label><input type="text" id="add_arg" placeholder="e.g. player admin arg1 arg2 end press enter">
|
||||||
|
</div>
|
||||||
|
<div class="args" id="args">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="content">
|
||||||
|
<div class="buttons">
|
||||||
|
<div class="div"><span>Input</span></div>
|
||||||
|
<div class="div"><span>Output</span><button onclick="copyResult()">Copy to clipboard</button></div>
|
||||||
|
</div>
|
||||||
|
<textarea id="input" placeholder="Paste input"></textarea>
|
||||||
|
<textarea id="output" placeholder="Copy Output" ></textarea>
|
||||||
|
</div>
|
||||||
|
<footer>
|
||||||
|
<p>2023-<span id="date"></span> © <a href="https://discord.com/users/566255927926456320">DestKoder</a> & <a href="https://quickfirecorp.ru">QuickFire Corp</a> All Rights Reserved</p>
|
||||||
|
</footer>
|
||||||
|
<!--<div class="settings">-->
|
||||||
|
<!-- <label for="langInput">Language Key: </label>-->
|
||||||
|
<!-- <input type="text" id="langInput" placeholder="e.g., chatty">-->
|
||||||
|
<!-- <br><br>-->
|
||||||
|
<!-- <label for="argsInput">Arguments (comma-separated): </label>-->
|
||||||
|
<!-- <input type="text" id="argsInput" placeholder="e.g., {label}, {player}, {players}">-->
|
||||||
|
<!--</div>-->
|
||||||
|
<!--<div class="container">-->
|
||||||
|
<!-- <div class="input-section">-->
|
||||||
|
<!-- <h3>Input Text</h3>-->
|
||||||
|
<!-- <textarea id="inputText" placeholder="Paste text here..."></textarea>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- <div class="output-section">-->
|
||||||
|
<!-- <h3>Output Text</h3>-->
|
||||||
|
<!-- <textarea id="outputText" readonly></textarea>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!--</div>-->
|
||||||
|
<script src="js/main.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
130
js/main.js
Normal file
130
js/main.js
Normal file
@@ -0,0 +1,130 @@
|
|||||||
|
const lang = {
|
||||||
|
langKeyEmpty: "Please enter a language key"
|
||||||
|
}
|
||||||
|
|
||||||
|
const prefixInput = document.getElementById("key");
|
||||||
|
const tagInput = document.getElementById("add_arg")
|
||||||
|
|
||||||
|
const argsElement = document.getElementById("args");
|
||||||
|
|
||||||
|
const inputEl = document.getElementById("input");
|
||||||
|
const outputEl = document.getElementById("output");
|
||||||
|
|
||||||
|
function handleInput(){
|
||||||
|
let prefix = prefixInput.value;
|
||||||
|
console.log(prefix);
|
||||||
|
if(!prefix){
|
||||||
|
outputEl.value = lang.langKeyEmpty;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
let value = inputEl.value.split("\n");
|
||||||
|
|
||||||
|
outputEl.value = "";
|
||||||
|
|
||||||
|
let regex = getRegex();
|
||||||
|
let args = getArgs();
|
||||||
|
|
||||||
|
let counter = 0;
|
||||||
|
|
||||||
|
value.forEach(line => {
|
||||||
|
if(line.startsWith("#")) {
|
||||||
|
outputEl.value+=line + "\n";
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
let isListItem = false
|
||||||
|
if(line.match(/:\s+["']|-\s+["']/i) == null){
|
||||||
|
outputEl.value+=line + "\n";
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
isListItem = line.match(/-\s+["']/i) !=null;
|
||||||
|
|
||||||
|
let matches = line.match(regex);
|
||||||
|
let key = isListItem ? line.split("-")[0] +"- " : line.split(":")[0] + ": ";
|
||||||
|
|
||||||
|
if(matches == null || args.length === 0){
|
||||||
|
outputEl.value += key + "\"[lang]"+prefix +"_"+counter+"[/lang]\"\n";
|
||||||
|
counter++;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
let re = /[%<\[<\{]{1}[a-zA-Z_-]+[%>\]\}]{1}/g;
|
||||||
|
|
||||||
|
outputEl.value += key + "\"[lang]" +prefix + "_"+counter+"[args]";
|
||||||
|
let m;
|
||||||
|
do {
|
||||||
|
m = re.exec(line);
|
||||||
|
if (m) {
|
||||||
|
if(args.indexOf(m+"") > -1){
|
||||||
|
outputEl.value+= "[arg]" + m + "[/arg]";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} while (m);
|
||||||
|
outputEl.value += "[/args][/lang]\"\n";
|
||||||
|
counter++;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
function handleTagInput(e) {
|
||||||
|
let tagDiv = document.createElement("div");
|
||||||
|
tagDiv.classList.add("arg")
|
||||||
|
let el = document.createElement("span");
|
||||||
|
el.innerHTML = tagInput.value.replace("<", "<").replace(">", ">");
|
||||||
|
tagDiv.append(el);
|
||||||
|
|
||||||
|
let tagCloser = document.createElement("span")
|
||||||
|
tagCloser.classList.add("delete-arg");
|
||||||
|
tagCloser.innerHTML = "X";
|
||||||
|
tagDiv.append(tagCloser);
|
||||||
|
|
||||||
|
tagCloser.addEventListener("click", deleteArg);
|
||||||
|
|
||||||
|
argsElement.append(tagDiv);
|
||||||
|
tagInput.value = "";
|
||||||
|
|
||||||
|
handleInput()
|
||||||
|
}
|
||||||
|
|
||||||
|
function copyResult(){
|
||||||
|
outputEl.focus();
|
||||||
|
outputEl.select();
|
||||||
|
|
||||||
|
document.execCommand("copy");
|
||||||
|
}
|
||||||
|
|
||||||
|
function deleteArg(e) {
|
||||||
|
e.target.removeEventListener("click", deleteArg);
|
||||||
|
e.target.parentElement.remove();
|
||||||
|
handleInput()
|
||||||
|
}
|
||||||
|
|
||||||
|
function getArgs(){
|
||||||
|
let args = [];
|
||||||
|
for(let i = 0; i < argsElement.children.length; i++){
|
||||||
|
args[i] = argsElement.children[i].children[0].innerHTML.trim().replace("<", "<").replace(">", ">");
|
||||||
|
}
|
||||||
|
return args;
|
||||||
|
}
|
||||||
|
|
||||||
|
function getRegex(){
|
||||||
|
let args = getArgs();
|
||||||
|
let regex = "";
|
||||||
|
for(let i =0; i < args.length; i ++){
|
||||||
|
if(i !== args.length-1) regex += args[i] + "|"
|
||||||
|
else regex += args[i];
|
||||||
|
}
|
||||||
|
return new RegExp(regex);
|
||||||
|
}
|
||||||
|
|
||||||
|
tagInput.addEventListener("change", handleTagInput);
|
||||||
|
prefixInput.addEventListener("input", handleInput);
|
||||||
|
inputEl.addEventListener("input", handleInput);
|
||||||
|
|
||||||
|
|
||||||
|
document.getElementById("date").innerHTML = new Date().getFullYear();
|
||||||
|
|
||||||
|
// (() => {
|
||||||
|
// let dateElem = document.getElementById("date");
|
||||||
|
// })();
|
||||||
Reference in New Issue
Block a user