Modern Pastebin Alternative - Printed Paste ID: gn-meth-25

<head>

body {

background-color: #333;

}

h1 {

color: #fff;

display: block;

padding: 10px;

max-width: 800px;

border-radius: 5px;

background-color: #444;

}

#container {

grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));

max-width: 800px;

}

.zone-item {

border: 1px solid #666;

overflow: hidden;

box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);

color: #fff;

width: 100%;

object-fit: cover;

width: 100%;

border: none;

color: white;

border-radius: 0 0 5px 5px;

transition: background-color 0.2s;

background-color: #0056b3;

display: none;

top: 50%;

transform: translate(-50%, -50%);

height: 80%;

border: 2px solid #000;

box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);

width: 100%;

border: none;

}

#zoneInfo {

justify-content: space-between;

padding: 5px;

color: #fff;

}

#zoneTitle {

}

#zoneId {

}

#controls {

}

#controls button {

margin: 0 5px;

background-color: #007bff;

cursor: pointer;

font-size: 14px;

}

#controls button:hover {

}

#topControls {

justify-content: space-between;

margin: 10px auto;

max-width: 800px;

display: flex;

}

#dataButtons button {

border: none;

color: white;

border-radius: 5px;

transition: background-color 0.3s;

background-color: #367C39;

display: inline-block;

border: 1px solid #666;

font-size: 16px;

background-color: #555;

}

#sortOptions {

border: 1px solid #666;

font-size: 16px;

background-color: white;

background-repeat: no-repeat;

background-size: 8px 10px;

border-color: #80bdff;

box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, .25);

position: fixed;

right: 20px;

border: none;

color: white;

border-radius: 5px;

transition: background-color 0.3s;

}

#darkModeToggle:hover {

}

body:not(.dark-mode) {

color: #000;

border-color: #ddd;

color: #000;

background-color: white;

box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);

}

body:not(.dark-mode) #zoneViewer {

box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);

background-color: #fff;

background: #ddd;

}

body:not(.dark-mode) #dataButtons input[type="file"] {

background-color: #f9f9f9;

}

body:not(.dark-mode) #sortOptions {

color: #000;

background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E");

max-width: 1000px;

}

.zone-count {

font-size: 18px;

color: var(--text-color, #ffffff);

</style>

</select>

<div id="container">Loading...</div>

</div>

<button onclick="closeZone()">Close</button>

<button onclick="aboutBlank()">about:blank (use if embed is broken)</button>

</div>

const zoneViewer = document.getElementById('zoneViewer');

const searchBar = document.getElementById('searchBar');

// https://www.jsdelivr.com/tools/purge

const coverURL = "https://cdn.jsdelivr.net/gh/adatskov-wcpss/gn-covers@main";;

let zones = [];

async function listZones() {

const response = await fetch(zonesURL);

zones = json;

sortZones();

const id = search.get('id');

const zone = zones.find(zone => zone.id + '' == id + '');

openZone(zone);

}

container.innerHTML = `Error loading zones: ${error}`;

}

try {

const data = await response.json();

const idMatch = file.name.match(/\/(\d+)\.html$/);

const id = parseInt(idMatch[1]);

}

} catch (error) {

}

const sortBy = sortOptions.value;

zones.sort((a, b) => a.name.localeCompare(b.name));

zones.sort((a, b) => a.id - b.id);

zones.sort((a, b) => (popularityData[b.id] || 0) - (popularityData[a.id] || 0));

zones.sort((a, b) => (a.id === -1 ? -1 : b.id === -1 ? 1 : 0));

}

function displayZones(zones) {

zones.forEach(file => {

zoneItem.className = "zone-item";

const img = document.createElement("img");

zoneItem.appendChild(img);

button.textContent = file.name;

event.stopPropagation();

};

container.appendChild(zoneItem);

if (container.innerHTML === "") {

} else {

}

const query = searchBar.value.toLowerCase();

displayZones(filteredZones);

if (file.url.startsWith("http")) {

} else {

fetch(url).then(response => response.text()).then(html => {

zoneFrame = document.createElement("iframe");

zoneViewer.appendChild(zoneFrame);

zoneFrame.contentDocument.open();

zoneFrame.contentDocument.close();

document.getElementById('zoneId').textContent = file.id;

}).catch(error => alert("Failed to load zone: " + error));

}

function aboutBlank() {

let zone = zones.find(zone => zone.id + '' === document.getElementById('zoneId').textContent).url.replace("{COVER_URL}", coverURL).replace("{HTML_URL}", htmlURL);

if (newWindow) {

newWindow.document.write(html);

}

function closeZone() {

zoneViewer.removeChild(zoneFrame);

if (zoneFrame.requestFullscreen) {

} else if (zoneFrame.mozRequestFullScreen) {

} else if (zoneFrame.webkitRequestFullscreen) {

} else if (zoneFrame.msRequestFullscreen) {

}

let data = JSON.stringify(localStorage) + "\n\n|\n\n" + document.cookie;

link.href = URL.createObjectURL(new Blob([data], {

}));

document.body.appendChild(link);

document.body.removeChild(link);

const file = event.target.files[0];

const reader = new FileReader();

const content = e.target.result;

try {

for (let key in parsedData) {

}

console.error(error);

if (cookieData) {

cookies.forEach(cookie => {

});

alert("Data loaded");

reader.readAsText(file);

const darkModeToggle = document.getElementById('darkModeToggle');

document.body.classList.toggle('dark-mode');

listZones();

</body>

</html>