mirror of
https://github.com/Investigamer/cardconjurer.git
synced 2025-07-30 06:41:42 -05:00
adding new frames, withholding the ability to use them temporarily
This commit is contained in:
@@ -3,13 +3,16 @@ $title = 'Card Conjurer - Gallery';
|
||||
$desc = 'See examples of available frames';
|
||||
include('../globalHTML/header-1.php');
|
||||
?>
|
||||
<h2 class='readable-background header-extension title center'>Gallery</h2>
|
||||
<div class='layer center'>
|
||||
<h3>Showcase Frames</h3>
|
||||
<h4>What they're called, and where to find them</h4>
|
||||
</div>
|
||||
<div class='layer center galleryGrid' id="galleryGrid"></div>
|
||||
<div class='layer center'></div>
|
||||
<h2 class='readable-background header-extension title center'>Available Frames</h2>
|
||||
<h4 class='readable-background header-extension center'>What they're called, and where to find them</h4>
|
||||
<h3 class='layer center'>Showcase Frames</h3>
|
||||
<div class='layer center galleryGrid' id="showcaseGrid"></div>
|
||||
<h3 class='layer center'>Regular Frames</h3>
|
||||
<div class='layer center galleryGrid' id="regularGrid"></div>
|
||||
<h3 class='layer center'>Token Frames</h3>
|
||||
<div class='layer center galleryGrid' id="tokenGrid"></div>
|
||||
<h3 class='layer center'>Other Card Types</h3>
|
||||
<div class='layer center galleryGrid' id="otherGrid"></div>
|
||||
<style>
|
||||
.galleryGrid {
|
||||
display: grid;
|
||||
@@ -29,6 +32,7 @@ include('../globalHTML/header-1.php');
|
||||
padding: 0.5rem;
|
||||
}
|
||||
.galleryGridItem > img {
|
||||
width: 100%;
|
||||
aspect-ratio: 5 / 7;
|
||||
}
|
||||
.galleryGridItem > h4 {
|
||||
@@ -40,7 +44,43 @@ include('../globalHTML/header-1.php');
|
||||
</style>
|
||||
<script>
|
||||
//template data
|
||||
const templates = [
|
||||
//REGULAR FRAMES
|
||||
const regularTemplates = [
|
||||
{name: "Regular", location: "Regular > Regular Frames", image: "regular.png"},
|
||||
{name: "Lands", location: "Regular > Lands", image: "land.png"},
|
||||
{name: "Class", location: "Regular > Class (D&D)", image: "class.png"},
|
||||
{name: "Snow", location: "Regular > Snow (Kaldheim)", image: "snow.png"},
|
||||
{name: "Mutate", location: "Regular > Mutate (Ikoria)", image: "mutate.png"},
|
||||
{name: "Nyx", location: "Regular > Nyx (Theros)", image: "nyx.png"},
|
||||
{name: "Adventures", location: "Regular > Adventures (Eldraine)", image: "adventure.png"},
|
||||
{name: "Devoid", location: "Regular > Devoid (Zendikar)", image: "devoid.png"},
|
||||
{name: "Aftermath", location: "Regular > Aftermath (Amonkhet)", image: "aftermath.png"},
|
||||
{name: "Flip", location: "Regular > Flip (Kamigawa)", image: "flip.png"},
|
||||
{name: "Levelers", location: "Regular > Levelers (Zendikar)", image: "levelers.png"},
|
||||
{name: "Split", location: "Regular > Split Cards", image: "split.png"},
|
||||
{name: "Fuse", location: "Regular > Fuse Cards", image: "fuse.png"},
|
||||
{name: "Conspiracies", location: "Regular > Conspiracies (Draft Matters)", image: "conspiracy.png"},
|
||||
{name: "Colorshifted", location: "Regular > Colorshifted (Planar Chaos)", image: "colorshifted.png"},
|
||||
];
|
||||
//TOKEN FRAMES
|
||||
const tokenTemplates = [
|
||||
{name: "Regular Token", location: "Token > Regular", image: "tokenRegular.png"},
|
||||
{name: "Textless Token", location: "Token > Textless", image: "tokenTextless.png"},
|
||||
{name: "Tall Token", location: "Token > Tall", image: "tokenTall.png"},
|
||||
{name: "Day/Night Marker", location: "Token > Day/Night Marker", image: "tokenDayNight.png"},
|
||||
{name: "Jumpstart Front Cards", location: "Token > Jumpstart Front Cards", image: "tokenJumpstart.png"},
|
||||
{name: "Planeswalker Emblems", location: "Token > Planeswalker Emblems", image: "emblem.png"},
|
||||
{name: "Regular Token (Old)", location: "Token > Regular Token (Bordered M15)", image: "tokenOldRegular.png"},
|
||||
{name: "Textless Token (Old)", location: "Token > Textless Token (Bordered M15)", image: "tokenOldTextless.png"},
|
||||
{name: "Original Token", location: "Token > Original (Old Bordered)", image: "tokenOriginal.png"},
|
||||
{name: "Unglued Token", location: "Token > Unglued", image: "tokenUnglued.png"},
|
||||
];
|
||||
//OTHER FRAMES
|
||||
const otherTemplates = [
|
||||
// {name: "TEMPLATENAME", location: "Token > DISPLAYNAME", image: "IMAGENAME.png"},
|
||||
];
|
||||
//SHOWCASE FRAMES
|
||||
const showcaseTemplates = [
|
||||
{name: "Gilded (SNC)", location: "Showcase Frames > Gilded (SNC)", image: "sncGilded.png"},
|
||||
{name: "Ninja (NEO)", location: "Showcase Frames > Ninja (NEO)", image: "neoNinja.png"},
|
||||
{name: "Samurai (NEO)", location: "Showcase Frames > Samurai (NEO)", image: "neoSamurai.png"},
|
||||
@@ -72,6 +112,7 @@ include('../globalHTML/header-1.php');
|
||||
{name: "FNM Inverted Promo", location: "Showcase Frames > FNM Promo (Inverted Promos)", image: "inverted.png"},
|
||||
{name: "Universes Beyond", location: "Showcase Frames > Universes Beyond", image: "universesBeyond.png"},
|
||||
{name: "Full Text", location: "Showcase Frames > Full Text", image: "fullText.png"},
|
||||
{name: "Etched", location: "Showcase Frames > Etched (Commander Precons)", image: "etched.png"},
|
||||
{name: "Expeditions (ZNR)", location: "Showcase Frames > ZNR Expeditions (2020)", image: "znrExpedition.png"},
|
||||
{name: "Jace", location: "Showcase Frames > Signature Spellbook (Jace/Gideon)", image: "jace.png"},
|
||||
{name: "Gideon", location: "Showcase Frames > Signature Spellbook (Jace/Gideon)", image: "gideon.png"},
|
||||
@@ -84,6 +125,7 @@ include('../globalHTML/header-1.php');
|
||||
];
|
||||
//functions
|
||||
getURL = (imageName) => {
|
||||
return "img/" + imageName;
|
||||
return "https://raw.githubusercontent.com/ImKyle4815/cardconjurer/master/gallery/img/" + imageName;
|
||||
}
|
||||
templateSample = (name, location, image) => {
|
||||
@@ -91,8 +133,13 @@ include('../globalHTML/header-1.php');
|
||||
shell.classList.add("galleryGridItem");
|
||||
shell.classList.add("readable-background");
|
||||
const img = document.createElement("img");
|
||||
img.src = getURL(image);
|
||||
img.src = getURL("loading.jpg");
|
||||
shell.appendChild(img);
|
||||
const actualImage = new Image();
|
||||
actualImage.onload = () => {
|
||||
img.src = getURL(image);
|
||||
}
|
||||
actualImage.src = getURL(image);
|
||||
const title = document.createElement("h4");
|
||||
title.innerHTML = name;
|
||||
shell.appendChild(title);
|
||||
@@ -101,10 +148,16 @@ include('../globalHTML/header-1.php');
|
||||
shell.appendChild(loc);
|
||||
return shell;
|
||||
}
|
||||
//main
|
||||
const container = document.getElementById("galleryGrid");
|
||||
for (t of templates) {
|
||||
container.appendChild(templateSample(t.name, t.location, t.image));
|
||||
populateGroup = (elementID, templates) => {
|
||||
const elem = document.getElementById(elementID);
|
||||
for (t of templates) {
|
||||
elem.appendChild(templateSample(t.name, t.location, t.image));
|
||||
}
|
||||
}
|
||||
//Populate everything
|
||||
populateGroup("regularGrid", regularTemplates);
|
||||
populateGroup("showcaseGrid", showcaseTemplates);
|
||||
populateGroup("tokenGrid", tokenTemplates);
|
||||
populateGroup("otherGrid", otherTemplates);
|
||||
</script>
|
||||
<?php include('../globalHTML/footer.php'); ?>
|
Reference in New Issue
Block a user