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