232 lines
7 KiB
HTML
232 lines
7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Bulk Template Generator</title>
|
|
|
|
<script>
|
|
function addVariable() {
|
|
const container = document.getElementById('variableContainer');
|
|
const variableCount = container.children.length + 1;
|
|
const newVariableGroup = document.createElement('div');
|
|
newVariableGroup.className = 'variable-group';
|
|
newVariableGroup.innerHTML = `<textarea placeholder="Enter one word per line for [var${variableCount}]" rows="5" class="variableInput"></textarea>`;
|
|
container.appendChild(newVariableGroup);
|
|
}
|
|
|
|
function customizeText() {
|
|
const inputText = document.getElementById('inputText').value;
|
|
const variableInputs = document.querySelectorAll('.variableInput');
|
|
const wordArrays = Array.from(variableInputs).map(textarea => textarea.value.split('\n').map(word => word.trim()));
|
|
|
|
const maxLength = Math.max(...wordArrays.map(words => words.length));
|
|
let results = [];
|
|
|
|
for (let i = 0; i < maxLength; i++) {
|
|
let modifiedText = inputText;
|
|
wordArrays.forEach((words, index) => {
|
|
const placeholder = new RegExp(`\\[var${index + 1}\\]`, 'g');
|
|
const word = words[i % words.length] || '';
|
|
modifiedText = modifiedText.replace(placeholder, word);
|
|
});
|
|
results.push(modifiedText);
|
|
}
|
|
document.getElementById('outputContainer').value = results.join('\n');
|
|
}
|
|
|
|
function exportToTextFile() {
|
|
const text = document.getElementById('outputContainer').value;
|
|
const blob = new Blob([text], { type: 'text/plain' });
|
|
const link = document.createElement('a');
|
|
link.href = URL.createObjectURL(blob);
|
|
link.download = 'svli-output.txt';
|
|
link.click();
|
|
URL.revokeObjectURL(link.href);
|
|
}
|
|
|
|
function copyToClipboard() {
|
|
const outputText = document.getElementById('outputContainer');
|
|
outputText.select();
|
|
document.execCommand('copy');
|
|
alert('Copied to clipboard!');
|
|
}
|
|
|
|
function copyShareableLink() {
|
|
const shareableLink = document.getElementById('shareableLink');
|
|
shareableLink.select();
|
|
document.execCommand('copy');
|
|
alert('Shareable link copied to clipboard!');
|
|
}
|
|
|
|
function generateShareableLink() {
|
|
const inputText = document.getElementById('inputText').value;
|
|
const variableInputs = document.querySelectorAll('.variableInput');
|
|
const variables = Array.from(variableInputs).map(textarea => textarea.value.split('\n').map(word => word.trim()).join(',')).join(';');
|
|
|
|
const url = new URL(window.location.href);
|
|
url.searchParams.set('template', btoa(inputText));
|
|
url.searchParams.set('variables', btoa(variables));
|
|
|
|
const shareableLink = document.getElementById('shareableLink');
|
|
shareableLink.value = url.toString();
|
|
}
|
|
|
|
function loadFromUrl() {
|
|
const urlParams = new URLSearchParams(window.location.search);
|
|
const template = urlParams.get('template');
|
|
const variables = urlParams.get('variables');
|
|
|
|
if (template) {
|
|
document.getElementById('inputText').value = atob(template);
|
|
}
|
|
|
|
if (variables) {
|
|
const variableContainer = document.getElementById('variableContainer');
|
|
variableContainer.innerHTML = ''; // Clear existing variables
|
|
const variableList = atob(variables).split(';');
|
|
variableList.forEach((variable, index) => {
|
|
const newVariableGroup = document.createElement('div');
|
|
newVariableGroup.className = 'variable-group';
|
|
newVariableGroup.innerHTML = `<textarea placeholder="Enter one word per line for [var${index + 1}]" rows="5" class="variableInput">${variable.split(',').join('\n')}</textarea>`;
|
|
variableContainer.appendChild(newVariableGroup);
|
|
});
|
|
}
|
|
}
|
|
|
|
document.addEventListener('DOMContentLoaded', loadFromUrl);
|
|
</script>
|
|
<style>
|
|
body {
|
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
box-sizing: border-box;
|
|
margin: 0;
|
|
padding: 20px;
|
|
color: #111;
|
|
background-color: #fefefe;
|
|
}
|
|
|
|
.container {
|
|
max-width: 600px;
|
|
margin: auto;
|
|
padding: 20px;
|
|
border: 1px solid #ddd;
|
|
border-radius: 8px;
|
|
background-color: #fff;
|
|
}
|
|
|
|
h1 {
|
|
font-size: 1.5em;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
input,
|
|
button {
|
|
padding: 10px;
|
|
margin-top: 10px;
|
|
font-size: 1em;
|
|
}
|
|
|
|
textarea {
|
|
width: 100%;
|
|
margin-top: 10px;
|
|
padding: 10px;
|
|
font-size: 1em;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.output {
|
|
margin-top: 20px;
|
|
padding: 10px;
|
|
border: 1px solid #ccc;
|
|
border-radius: 4px;
|
|
background-color: #f9f9f9;
|
|
}
|
|
|
|
.variables {
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.variable-group {
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.small-button {
|
|
font-size: 0.8em;
|
|
padding: 5px;
|
|
}
|
|
.yellow-button {
|
|
margin-right: 10px;
|
|
background-color: #fbb000;
|
|
border: none;
|
|
color: white;
|
|
padding: 3px 7px;
|
|
border-radius: 4px;
|
|
cursor: pointer;
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
}
|
|
.blue-button {
|
|
margin-right: 10px;
|
|
background-color: #007bff;
|
|
border: none;
|
|
color: white;
|
|
padding: 3px 7px;
|
|
border-radius: 4px;
|
|
cursor: pointer;
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
}
|
|
.green-button {
|
|
margin-right: 10px;
|
|
background-color: #28a745;
|
|
border: none;
|
|
color: white;
|
|
padding: 3px 7px;
|
|
border-radius: 4px;
|
|
cursor: pointer;
|
|
font-size: 1.5rem;
|
|
font-weight: bold;
|
|
}
|
|
hr {
|
|
color: #ddd;
|
|
border-top: 1px solid #ddd;
|
|
}
|
|
.footer {
|
|
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<h1>Bulk Template Generator</h1>
|
|
<hr>
|
|
<h2>Template:</h2>
|
|
<textarea id="inputText">Example: host [var1] has IP [var2].</textarea>
|
|
<hr>
|
|
<h2>Variables:</h2>
|
|
<div id="variableContainer" class="variables">
|
|
<div class="variable-group">
|
|
<textarea placeholder="Enter one word per line for [var1]" rows="5" class="variableInput"></textarea>
|
|
</div>
|
|
<div class="variable-group">
|
|
<textarea placeholder="Enter one word per line for [var2]" rows="5" class="variableInput"></textarea>
|
|
</div>
|
|
</div>
|
|
<button class="yellow-button" onclick="addVariable()">Add Variable</button><br>
|
|
<hr>
|
|
<h2>Generating:</h2>
|
|
<button class="green-button" onclick="customizeText()">RUN</button>
|
|
<textarea id="outputContainer" class="output" row="10" readonly></textarea>
|
|
<button class="blue-button" onclick="copyToClipboard()">Copy</button>
|
|
<button class="blue-button" onclick="exportToTextFile()">Export to File</button>
|
|
<hr>
|
|
<h2>Sharing:</h2>
|
|
<button class="blue-button" onclick="generateShareableLink()">Generate Shareable Link</button>
|
|
<textarea id="shareableLink" class="output" readonly></textarea>
|
|
<button class="blue-button" onclick="copyShareableLink()">Copy Link</button>
|
|
</div>
|
|
</body>
|
|
</html>
|
|
|