257 lines
10 KiB
HTML
257 lines
10 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
<title>Dystopika XML Entries Generator</title>
|
||
|
|
<link rel="icon" href="favicon.png" type="image/png">
|
||
|
|
<meta name="title" content="Dystopika XML Entries Generator">
|
||
|
|
<meta name="description" content="Generate custom XML configurations for Dystopika billboard ads in the game. Customize your ad settings such as image, excluded aspect ratios, color, grid density, and dot size using our interactive form.">
|
||
|
|
<meta property="og:type" content="website">
|
||
|
|
<meta property="og:url" content="https://cyberwa.re/dystopika-xml-entries-generator/">
|
||
|
|
<meta property="og:title" content="Dystopika XML Entries Generator">
|
||
|
|
<meta property="og:description" content="Generate custom XML configurations for Dystopika billboard ads in the game. Customize your ad settings such as image, excluded aspect ratios, color, grid density, and dot size using our interactive form.">
|
||
|
|
<meta property="og:image" content="https://cyberwa.re/dystopika-xml-entries-generator/social.jpg">
|
||
|
|
<meta property="twitter:card" content="summary_large_image">
|
||
|
|
<meta property="twitter:url" content="https://cyberwa.re/dystopika-xml-entries-generator/">
|
||
|
|
<meta property="twitter:title" content="Dystopika XML Entries Generator">
|
||
|
|
<meta property="twitter:description" content="Generate custom XML configurations for Dystopika billboard ads in the game. Customize your ad settings such as image, excluded aspect ratios, color, grid density, and dot size using our interactive form.">
|
||
|
|
<meta property="twitter:image" content="https://cyberwa.re/dystopika-xml-entries-generator/social.jpg">
|
||
|
|
<meta name="keywords" content="Dystopika, XML, Entries Generator, Billboard Ads, Ad Configuration, Custom XML, Game Ads">
|
||
|
|
<meta name="author" content="Revengeday">
|
||
|
|
<style>
|
||
|
|
body {
|
||
|
|
font-family: 'Arial', sans-serif;
|
||
|
|
background: url('bg.jpg') no-repeat center center fixed;
|
||
|
|
background-size: cover;
|
||
|
|
color: #ffffff;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
h1, h2, p {
|
||
|
|
text-align: center;
|
||
|
|
text-shadow:
|
||
|
|
2px 0 black,
|
||
|
|
-2px 0 black,
|
||
|
|
0 2px black,
|
||
|
|
0 -2px black,
|
||
|
|
2px 2px black,
|
||
|
|
-2px -2px black,
|
||
|
|
-2px 2px black,
|
||
|
|
2px -2px black;
|
||
|
|
}
|
||
|
|
|
||
|
|
form {
|
||
|
|
background: rgba(15, 15, 15, 0.9);
|
||
|
|
padding: 30px;
|
||
|
|
border-radius: 15px;
|
||
|
|
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.5);
|
||
|
|
max-width: 600px;
|
||
|
|
margin: 20px auto;
|
||
|
|
width: 90%;
|
||
|
|
}
|
||
|
|
|
||
|
|
label {
|
||
|
|
display: block;
|
||
|
|
margin: 20px 0 10px;
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
|
||
|
|
input[type="text"],
|
||
|
|
input[type="number"],
|
||
|
|
textarea {
|
||
|
|
width: calc(100% - 22px);
|
||
|
|
padding: 12px;
|
||
|
|
margin: 10px 0 10px;
|
||
|
|
border: none;
|
||
|
|
border-radius: 5px;
|
||
|
|
background: #222;
|
||
|
|
color: #ffffff;
|
||
|
|
font-size: 16px;
|
||
|
|
}
|
||
|
|
|
||
|
|
input[type="number"] {
|
||
|
|
width: calc(50% - 16px);
|
||
|
|
display: inline-block;
|
||
|
|
margin-right: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
input[type="checkbox"] {
|
||
|
|
transform: scale(1.5);
|
||
|
|
margin: 5px 10px 0 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
input[type="checkbox"] + label {
|
||
|
|
display: inline-block;
|
||
|
|
margin: 5px 10px 5px 0;
|
||
|
|
vertical-align: middle;
|
||
|
|
}
|
||
|
|
|
||
|
|
button {
|
||
|
|
width: 100%;
|
||
|
|
padding: 12px;
|
||
|
|
border: none;
|
||
|
|
border-radius: 5px;
|
||
|
|
background: linear-gradient(45deg, #1fa2ff, #12d8fa, #a6ffcb);
|
||
|
|
color: #1a1a1a;
|
||
|
|
font-size: 16px;
|
||
|
|
font-weight: bold;
|
||
|
|
cursor: pointer;
|
||
|
|
transition: background 0.3s ease, transform 0.2s ease;
|
||
|
|
}
|
||
|
|
|
||
|
|
button:hover {
|
||
|
|
transform: scale(1.05);
|
||
|
|
}
|
||
|
|
|
||
|
|
.hint-text {
|
||
|
|
margin: 10px 0 20px;
|
||
|
|
padding: 10px;
|
||
|
|
background: rgba(255, 255, 255, 0.1);
|
||
|
|
border-radius: 5px;
|
||
|
|
font-size: 0.9em;
|
||
|
|
color: #ddd;
|
||
|
|
}
|
||
|
|
|
||
|
|
.error-message, .warning-message {
|
||
|
|
margin-top: -10px;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
|
||
|
|
.error-message {
|
||
|
|
color: #ff4f4f;
|
||
|
|
}
|
||
|
|
|
||
|
|
.warning-message {
|
||
|
|
color: #ffbf00;
|
||
|
|
}
|
||
|
|
|
||
|
|
textarea {
|
||
|
|
height: 150px;
|
||
|
|
resize: none;
|
||
|
|
background: #222;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<h1>Dystopika XML Entries Generator</h1>
|
||
|
|
<p>Use this form to generate XML configurations for Dystopika billboard ads in the game.<br>Fill in the details and click 'Generate XML' to create your custom XML entries.</p>
|
||
|
|
<form id="xmlForm">
|
||
|
|
<label for="asset">Image file (png/jpg):</label>
|
||
|
|
<input type="text" id="asset" name="asset" required>
|
||
|
|
<p class="hint-text">Enter the name of the image file to be used as a billboard ad. The image file should have a .png or .jpg extension.</p>
|
||
|
|
<span id="assetError" class="error-message"></span>
|
||
|
|
|
||
|
|
<label>Excluded Aspect Ratios:</label>
|
||
|
|
<p class="hint-text">Check the aspect ratios in which the ad should not be displayed.</p>
|
||
|
|
|
||
|
|
<input type="checkbox" id="aspect1_1" name="excludedAspectRatios" value="1:1">
|
||
|
|
<label for="aspect1_1">1:1</label>
|
||
|
|
|
||
|
|
<input type="checkbox" id="aspect1_2" name="excludedAspectRatios" value="1:2">
|
||
|
|
<label for="aspect1_2">1:2</label>
|
||
|
|
|
||
|
|
<input type="checkbox" id="aspect2_1" name="excludedAspectRatios" value="2:1">
|
||
|
|
<label for="aspect2_1">2:1</label>
|
||
|
|
|
||
|
|
<input type="checkbox" id="aspect2_2" name="excludedAspectRatios" value="2:2">
|
||
|
|
<label for="aspect2_2">2:2</label>
|
||
|
|
|
||
|
|
<span id="aspectError" class="error-message"></span>
|
||
|
|
<span id="aspectWarning" class="warning-message"></span>
|
||
|
|
|
||
|
|
<label for="colorR">Color - R (Red):</label>
|
||
|
|
<input type="number" id="colorR" name="colorR" min="0" max="255">
|
||
|
|
<label for="colorG">Color - G (Green):</label>
|
||
|
|
<input type="number" id="colorG" name="colorG" min="0" max="255">
|
||
|
|
<label for="colorB">Color - B (Blue):</label>
|
||
|
|
<input type="number" id="colorB" name="colorB" min="0" max="255">
|
||
|
|
<label for="colorA">Color - A (Alpha/Opacity):</label>
|
||
|
|
<input type="number" id="colorA" name="colorA" min="0" max="1" step="0.1">
|
||
|
|
<p class="hint-text">Enter values for the color of the ad in RGBA format. The values for R, G, and B should be between 0 and 255, while A (opacity) should be between 0 and 1.</p>
|
||
|
|
|
||
|
|
<label for="gridDensity">Grid Density:</label>
|
||
|
|
<input type="number" id="gridDensity" name="gridDensity" step="0.01">
|
||
|
|
<p class="hint-text">Define the density of the LCD grid pattern. Higher values mean denser grids.</p>
|
||
|
|
<label for="dotSize">Dot Size:</label>
|
||
|
|
<input type="number" id="dotSize" name="dotSize" step="0.01">
|
||
|
|
<p class="hint-text">Set the size of the dots in the grid pattern. Higher values mean larger dots.</p>
|
||
|
|
|
||
|
|
<button type="button" onclick="generateXML()">Generate XML</button>
|
||
|
|
</form>
|
||
|
|
|
||
|
|
<h2>Generated XML:</h2>
|
||
|
|
<textarea id="generatedXML" readonly></textarea>
|
||
|
|
<p>Build by Revengeday</p>
|
||
|
|
<script>
|
||
|
|
function isValidImageFile(filename) {
|
||
|
|
return /\.(jpg|png)$/i.test(filename);
|
||
|
|
}
|
||
|
|
|
||
|
|
function generateXML() {
|
||
|
|
const asset = document.getElementById('asset').value;
|
||
|
|
const assetError = document.getElementById('assetError');
|
||
|
|
const aspectError = document.getElementById('aspectError');
|
||
|
|
const aspectWarning = document.getElementById('aspectWarning');
|
||
|
|
|
||
|
|
if (!isValidImageFile(asset)) {
|
||
|
|
assetError.textContent = "Invalid file format. Please enter a file with the extension .jpg or .png.";
|
||
|
|
return;
|
||
|
|
} else {
|
||
|
|
assetError.textContent = "";
|
||
|
|
}
|
||
|
|
|
||
|
|
const excludedAspectRatios = Array.from(document.querySelectorAll('input[name="excludedAspectRatios"]:checked'))
|
||
|
|
.map(el => el.value);
|
||
|
|
|
||
|
|
if (excludedAspectRatios.length === 4) {
|
||
|
|
aspectError.textContent = "All aspect ratios are excluded. The image will not be displayed in the game.";
|
||
|
|
aspectWarning.textContent = "";
|
||
|
|
return;
|
||
|
|
} else if (excludedAspectRatios.length === 0) {
|
||
|
|
aspectError.textContent = "";
|
||
|
|
aspectWarning.textContent = "No aspect ratios are excluded. The image might be displayed incorrectly in the game.";
|
||
|
|
} else {
|
||
|
|
aspectError.textContent = "";
|
||
|
|
aspectWarning.textContent = "";
|
||
|
|
}
|
||
|
|
|
||
|
|
const colorR = document.getElementById('colorR').value;
|
||
|
|
const colorG = document.getElementById('colorG').value;
|
||
|
|
const colorB = document.getElementById('colorB').value;
|
||
|
|
const colorA = document.getElementById('colorA').value;
|
||
|
|
|
||
|
|
const gridDensity = document.getElementById('gridDensity').value || "1.0";
|
||
|
|
const dotSize = document.getElementById('dotSize').value || "3.0";
|
||
|
|
|
||
|
|
let xml = '<AdConfig>\n';
|
||
|
|
xml += ` <Asset>${asset}</Asset>\n`;
|
||
|
|
|
||
|
|
excludedAspectRatios.forEach(ratio => {
|
||
|
|
const [width, height] = ratio.split(':');
|
||
|
|
xml += ` <ExcludedAspect width="${width}" height="${height}" />\n`;
|
||
|
|
});
|
||
|
|
|
||
|
|
if (colorR && colorG && colorB && colorA) {
|
||
|
|
xml += ` <Color>\n`;
|
||
|
|
xml += ` <r>${colorR}</r>\n`;
|
||
|
|
xml += ` <g>${colorG}</g>\n`;
|
||
|
|
xml += ` <b>${colorB}</b>\n`;
|
||
|
|
xml += ` <a>${colorA}</a>\n`;
|
||
|
|
xml += ` </Color>\n`;
|
||
|
|
}
|
||
|
|
|
||
|
|
xml += ` <GridDensity>${gridDensity}</GridDensity>\n`;
|
||
|
|
xml += ` <DotSize>${dotSize}</DotSize>\n`;
|
||
|
|
xml += '</AdConfig>';
|
||
|
|
|
||
|
|
document.getElementById('generatedXML').value = xml;
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|