upgrayedd

This commit is contained in:
Kyle
2020-03-28 18:11:40 -07:00
parent 84d478350d
commit 3668b99311
56 changed files with 354 additions and 134 deletions

View File

@@ -1,73 +1,14 @@
<!DOCTYPE html5>
<html>
<script async src="data/scripts/cookies.js"></script>
<head>
<title>CC - Ask Scryfall</title>
<script async src="data/scripts/cookies.js"></script>
<link rel="stylesheet" href="data/site/styles.css">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
.askScryfallGrid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: auto 90pt auto;
align-items: center;
justify-items: center;
}
.urzaCard {
width: 360pt;
text-align: center;
grid-column: 1 / span 3;
}
.urzaCard > img {
position: relative;
left: -2rem;
width: 360pt;
height: auto;
}
img {
position: relative;
left: -1rem;
}
.askScryfallGrid > * {
/*border: 1px solid red;*/
}
.askScryfallButton {
width: auto;
height: 60pt;
transition: 0.25s;
}
.askScryfallButton:hover {
height: 80pt;
}
.askScryfallButton:active {
height: 90pt !important;
}
#askScryfallResult {
grid-column: 1 / span 3;
padding: 2rem;
margin: 1rem;
background: var(--background-color-contrast);
color: var(--font-color-contrast);
border-radius: 1rem;
font: 2rem belerenb;
}
@media screen and (min-width: 864pt) {
.askScryfallGrid {
grid-template-columns: calc(360pt) 1fr 1fr 1fr !important;
grid-template-rows: 90pt auto !important;
}
.urzaCard {
grid-column: 1;
grid-row: 1 / span 2 !important;
}
#askScryfallResult {
grid-column: 2 / span 3 !important;
}
}
</style>
</head>
<body>
<title>CC - Ask Scryfall</title>
<link rel="stylesheet" href="data/site/askScryfallStyles.css">
<div>
<div class="title darkLayer">
Ask Scryfall
@@ -104,14 +45,16 @@
</div>
</div>
</div>
<script defer src="data/site/other/askScryfall/askScryfall.js"></script>
</body>
<footer class='footer'>
<div>
Card Conjurer by Kyle Burton<br>
<select id='inputColorPalette' onchange='loadScript("data/scripts/" + this.value + ".js")'>
<select id='inputColorPalette' onchange='loadScript("data/scripts/palettes/" + this.value + ".js")'>
<option value='lightMode'>Light Mode</option>
<option value='darkMode'>Dark Mode</option>
<option value='raveMode'>Rave Mode</option>
<option value='scholarMode'>Scholar Mode</option>
</select>
</div>
<div>
@@ -125,7 +68,6 @@
<a href='termsofuse.html'>Terms of Use</a><br>
<a href='disclaimer.html'>Disclaimer</a>
</div>
<script defer src="data/scripts/animations.js"></script>
</footer>
<script defer src="data/scripts/animations.js"></script>
<script defer src="data/site/other/askScryfall/askScryfall.js"></script>
<html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 751 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 41 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 733 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 679 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 709 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 712 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 746 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 672 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 664 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 719 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 717 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 698 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 681 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 717 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 689 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 159 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 159 KiB

After

Width:  |  Height:  |  Size: 1.3 MiB

View File

@@ -371,6 +371,7 @@ function writeText(textObjectList, targetContext) {
var textCanvasBuffer = 100
var rewritingLine = false
var textSize, textFont
var savedTextX = 0
outerloop:
for (var i = 0; i < textObjectList.length; i++) {
if (!rewritingLine) {
@@ -446,6 +447,10 @@ function writeText(textObjectList, targetContext) {
finishLine = true
paragraphSpace += parseInt(possibleCodeLower.replace('down', '')) - textSize
temporaryLineShift += currentLineWidth
} else if (possibleCodeLower == 'savetextx') {
savedTextX = textX
} else if (possibleCodeLower == 'loadtextx') {
textX = savedTextX
} else if (possibleCodeLower.includes('outline:')) {
outline = true
textLineContext.strokeStyle = possibleCodeLower.replace('outline:', '').split(',')[0]

View File

@@ -2,7 +2,9 @@ rootStyles.setProperty('--background-color', '#1c1c1c')
rootStyles.setProperty('--background-color-contrast', '#111')
rootStyles.setProperty('--interactable-color', '#333')
rootStyles.setProperty('--interactable-selected-color', '#555')
rootStyles.setProperty('--interactable-tiling', '100% 100%')
rootStyles.setProperty('--input-color', '#3a3a3a')
rootStyles.setProperty('--input-font-color', '#fff')
rootStyles.setProperty('--font-color', '#fff')
rootStyles.setProperty('--font-color-contrast', '#eee')
rootStyles.setProperty('--body-background', 'none')

View File

@@ -2,7 +2,9 @@ rootStyles.setProperty('--background-color', '#fafafa')
rootStyles.setProperty('--background-color-contrast', '#333')
rootStyles.setProperty('--interactable-color', '#aaa')
rootStyles.setProperty('--interactable-selected-color', '#777')
rootStyles.setProperty('--interactable-tiling', '100% 100%')
rootStyles.setProperty('--input-color', '#ddd')
rootStyles.setProperty('--input-font-color', '#000')
rootStyles.setProperty('--font-color', '#000')
rootStyles.setProperty('--font-color-contrast', '#eee')
rootStyles.setProperty('--body-background', 'none')

View File

@@ -2,11 +2,13 @@ rootStyles.setProperty('--background-color', '#1c1c1c')
rootStyles.setProperty('--background-color-contrast', '#111')
rootStyles.setProperty('--interactable-color', '#333')
rootStyles.setProperty('--interactable-selected-color', '#555')
rootStyles.setProperty('--interactable-tiling', '100% 100%')
rootStyles.setProperty('--input-color', '#3a3a3a')
rootStyles.setProperty('--font-color', '#fff')
rootStyles.setProperty('--input-font-color', '#fff')
rootStyles.setProperty('--font-color', '#000')
rootStyles.setProperty('--font-color-contrast', '#eee')
rootStyles.setProperty('--body-background', 'url(images/lowpoly.png)')
setCookie('colorPalette', 'darkMode')
setCookie('colorPalette', 'raveMode')
//Cycles through a rainbow!
if (currentColorIndex == undefined) {

View File

@@ -0,0 +1,11 @@
rootStyles.setProperty('--background-color', 'none')
rootStyles.setProperty('--background-color-contrast', 'url(images/palettes/canvasPaper.png)')
rootStyles.setProperty('--interactable-color', 'url(images/palettes/whitePaperTileable.png)')
rootStyles.setProperty('--interactable-selected-color', 'url(images/palettes/whitePaperHighlightedTileable.png)')
rootStyles.setProperty('--interactable-tiling', 'auto')
rootStyles.setProperty('--input-color', 'url(images/palettes/whitePaperTileable.png)')
rootStyles.setProperty('--input-font-color', '#000')
rootStyles.setProperty('--font-color', '#eee')
rootStyles.setProperty('--font-color-contrast', '#000')
rootStyles.setProperty('--body-background', 'url(images/palettes/darkWood.png)')
setCookie('colorPalette', 'scholarMode')

View File

@@ -0,0 +1,50 @@
var versionInventionImageList = [
['Invention Frame', 'data/images/invention/inventionFrame.png', 0, 0, 1, 1, ['Full', 'Pinline Super (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']],
['Invention Power/Toughness', 'data/images/invention/inventionPT.png', 1142/1500, 1856/2100, 287/1500, 157/2100, ['Full']]
]
var versionInventionMaskList = []
if (!loadedVersions.includes('invention')) {
loadedVersions.push("invention")
// loadMaskImages(versionM15InventionMaskList)
loadFrameImages(versionInventionImageList, 'frameClassM15')
}
if (currentVersion != 'invention') {
currentVersion = 'invention'
hideFrameImages('frameClassM15')
loadTextOptions([
new cardText('Card Title', '', 126/1500, 187/2100, 1248/1500, 80/2100, 'belerenb', 80/2100, 'black', ['oneLine=true']),
new cardText('Card Type', '', 126/1500, 1263/2100, 1248/1500, 68/2100, 'belerenb', 68/2100, 'black', ['oneLine=true']),
new cardText('Rules Text', '', 135/1500, 1372/2100, 1230/1500, 624/2100, 'mplantin', 74/2100, 'black'),
new cardText('Power/Toughness', '', 1190/1500, 1950/2100, 210/1500, 78/2100, 'belerenbsc', 78/2100, 'black', ['oneLine=true,textAlign="center"'])
])
artX = scaleX(60/1500)
artY = scaleY(60/2100)
artWidth = scaleX(1440/1500)
artHeight = scaleY(1888/2100)
manaCostXPath = '1316 - 78 * manaSymbolIndex'
manaCostYPath = '121'
manaCostDiameter = '70'
manaCostShadowOffset = '[-2, 6]'
manaCostDirection = 'reverse'
setSymbolX = [scaleX(1382/1500), 'right']
setSymbolY = [scaleY(1240/2100), 'center']
setSymbolWidth = scaleX(180/1500)
setSymbolHeight = scaleY(80/2100)
watermarkX = scaleX(0.5)
watermarkY = scaleY(1630/2100)
watermarkWidth = scaleX(1140/1500)
watermarkHeight = scaleY(484/2100)
bottomInfoFunction = 'bottomInfoM15'
bottomInfoUpdated()
}

View File

@@ -1,13 +1,13 @@
var versionM15ImageList = [
['White Frame', 'data/images/m15/m15FrameW.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']],
['Blue Frame', 'data/images/m15/m15FrameU.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']],
['Black Frame', 'data/images/m15/m15FrameB.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']],
['Red Frame', 'data/images/m15/m15FrameR.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']],
['Green Frame', 'data/images/m15/m15FrameG.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']],
['Multicolored Frame', 'data/images/m15/m15FrameM.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']],
['Artifact Frame', 'data/images/m15/m15FrameA.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']],
['Vehicle Frame', 'data/images/m15/m15FrameV.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']],
['Land Frame', 'data/images/m15/m15FrameL.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']],
['White Frame', 'data/images/m15/m15FrameW.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)', 'Pinline Super (m15)']],
['Blue Frame', 'data/images/m15/m15FrameU.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)', 'Pinline Super (m15)']],
['Black Frame', 'data/images/m15/m15FrameB.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)', 'Pinline Super (m15)']],
['Red Frame', 'data/images/m15/m15FrameR.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)', 'Pinline Super (m15)']],
['Green Frame', 'data/images/m15/m15FrameG.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)', 'Pinline Super (m15)']],
['Multicolored Frame', 'data/images/m15/m15FrameM.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)', 'Pinline Super (m15)']],
['Artifact Frame', 'data/images/m15/m15FrameA.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)', 'Pinline Super (m15)']],
['Vehicle Frame', 'data/images/m15/m15FrameV.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)', 'Pinline Super (m15)']],
['Land Frame', 'data/images/m15/m15FrameL.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)', 'Pinline Super (m15)']],
['White Power/Toughness', 'data/images/m15/m15PTW.png', 1142/1500, 1856/2100, 287/1500, 157/2100, ['Full']],
['Blue Power/Toughness', 'data/images/m15/m15PTU.png', 1142/1500, 1856/2100, 287/1500, 157/2100, ['Full']],
['Black Power/Toughness', 'data/images/m15/m15PTB.png', 1142/1500, 1856/2100, 287/1500, 157/2100, ['Full']],
@@ -15,18 +15,19 @@ var versionM15ImageList = [
['Green Power/Toughness', 'data/images/m15/m15PTG.png', 1142/1500, 1856/2100, 287/1500, 157/2100, ['Full']],
['Multicolored Power/Toughness', 'data/images/m15/m15PTM.png', 1142/1500, 1856/2100, 287/1500, 157/2100, ['Full']],
['Artifact Power/Toughness', 'data/images/m15/m15PTA.png', 1142/1500, 1856/2100, 287/1500, 157/2100, ['Full']],
['White Legend Crown', 'data/images/m15/m15CrownW.png', 38/1500, 29/2100, 1422/1500, 341/2100, ['Full']],
['Blue Legend Crown', 'data/images/m15/m15CrownU.png', 38/1500, 29/2100, 1422/1500, 341/2100, ['Full']],
['Black Legend Crown', 'data/images/m15/m15CrownB.png', 38/1500, 29/2100, 1422/1500, 341/2100, ['Full']],
['Red Legend Crown', 'data/images/m15/m15CrownR.png', 38/1500, 29/2100, 1422/1500, 341/2100, ['Full']],
['Green Legend Crown', 'data/images/m15/m15CrownG.png', 38/1500, 29/2100, 1422/1500, 341/2100, ['Full']],
['Multicolored Legend Crown', 'data/images/m15/m15CrownM.png', 38/1500, 29/2100, 1422/1500, 341/2100, ['Full']],
['Artifact Legend Crown', 'data/images/m15/m15CrownA.png', 38/1500, 29/2100, 1422/1500, 341/2100, ['Full']],
['Land Legend Crown', 'data/images/m15/m15CrownL.png', 38/1500, 29/2100, 1422/1500, 341/2100, ['Full']],
['White Legend Crown', 'data/images/m15/m15CrownW.png', 38/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Legend Crown (m15)', 'Legend Crown W/ Pinline (m15)']],
['Blue Legend Crown', 'data/images/m15/m15CrownU.png', 38/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Legend Crown (m15)', 'Legend Crown W/ Pinline (m15)']],
['Black Legend Crown', 'data/images/m15/m15CrownB.png', 38/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Legend Crown (m15)', 'Legend Crown W/ Pinline (m15)']],
['Red Legend Crown', 'data/images/m15/m15CrownR.png', 38/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Legend Crown (m15)', 'Legend Crown W/ Pinline (m15)']],
['Green Legend Crown', 'data/images/m15/m15CrownG.png', 38/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Legend Crown (m15)', 'Legend Crown W/ Pinline (m15)']],
['Multicolored Legend Crown', 'data/images/m15/m15CrownM.png', 38/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Legend Crown (m15)', 'Legend Crown W/ Pinline (m15)']],
['Artifact Legend Crown', 'data/images/m15/m15CrownA.png', 38/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Legend Crown (m15)', 'Legend Crown W/ Pinline (m15)']],
['Land Legend Crown', 'data/images/m15/m15CrownL.png', 38/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Legend Crown (m15)', 'Legend Crown W/ Pinline (m15)']],
['Legend Crown Border Cover', 'data/images/m15/m15LegendCrownBorderCover.png', 0, 0, 1, 1, ['Full', 'Legend Crown (m15)', 'Legend Crown W/ Pinline (m15)']],
['Midnight Frame', 'data/images/m15/m15Midnight.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']]
]
var versionM15MaskList = [['Full', 'data/images/maskFull.png'], ['Border (m15)', 'data/images/m15/m15MaskBorder.png'], ['Right Half', 'data/images/maskRightHalf.png'], ['Pinline (m15)', 'data/images/m15/m15MaskPinline.png'], ['Title (m15)', 'data/images/m15/m15MaskTitle.png'], ['Type (m15)', 'data/images/m15/m15MaskType.png'], ['Rules (m15)', 'data/images/m15/m15MaskRules.png'], ['Frame (m15)', 'data/images/m15/m15MaskFrame.png']]
var versionM15MaskList = [['Full', 'data/images/maskFull.png'], ['Border (m15)', 'data/images/m15/m15MaskBorder.png'], ['Right Half', 'data/images/maskRightHalf.png'], ['Pinline (m15)', 'data/images/m15/m15MaskPinline.png'], ['Title (m15)', 'data/images/m15/m15MaskTitle.png'], ['Type (m15)', 'data/images/m15/m15MaskType.png'], ['Rules (m15)', 'data/images/m15/m15MaskRules.png'], ['Frame (m15)', 'data/images/m15/m15MaskFrame.png'], ['Pinline Super (m15)', 'data/images/m15/m15MaskPinlineSuper.png'], ['Legend Crown (m15)', 'data/images/m15/m15MaskLegendCrown.png'], ['Legend Crown W/ Pinline (m15)', 'data/images/m15/m15MaskLegendCrownPinline.png']]
if (!loadedVersions.includes('m15')) {
loadedVersions.push('m15')
@@ -82,8 +83,8 @@ function bottomInfoM15() {
}
writeText(
[
{text: document.getElementById('inputInfoNumber').value, x: 97/1500, y: 1990/2100, width: 1306/1500, height: 36/2100, font: 'gothammedium', fontSize: 36/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: document.getElementById('inputInfoSet').value + '{right' + scaleX(0.005) + '}\u2605{right' + scaleX(0.005) + '}' + document.getElementById('inputInfoLanguage').value + ' {artistbrush}{up' + scaleY(36/2100) + '}' + document.getElementById('inputInfoRarity').value + ' {down' + scaleY(72/2100) + '}{up' + scaleY(36/2100) + '}{fontbelerenbsc}' + document.getElementById('inputInfoArtist').value, x: 97/1500, y: 2026/2100, width: 1306/1500, height: 36/2100, font: 'gothammedium', fontSize: 36/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: document.getElementById('inputInfoSet').value + '{right' + scaleX(0.005) + '}\u2605{right' + scaleX(0.005) + '}' + document.getElementById('inputInfoLanguage').value + ' {saveTextX}{artistbrush}{fontbelerenbsc}' + document.getElementById('inputInfoArtist').value, x: 97/1500, y: 2026/2100, width: 1306/1500, height: 36/2100, font: 'gothammedium', fontSize: 36/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: document.getElementById('inputInfoNumber').value + '{loadTextX}' + document.getElementById('inputInfoRarity').value, x: 97/1500, y: 1990/2100, width: 1306/1500, height: 36/2100, font: 'gothammedium', fontSize: 36/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: '{right}\u2122 & \u00a9 ' + date.getFullYear() + ' Wizards of the Coast', x: 97/1500, y: 1990/2100 + ptBoxShift, width: 1306/1500, height: 35/2100, font: 'mplantin', fontSize: 35/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: '*Not for Sale*', x: 97/1500, y: 2056/2100, width: 1306/1500, height: 30/2100, font: 'gothammedium', fontSize: 30/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: '{right}CardConjurer.com', x: 97/1500, y: 2020/2100 + ptBoxShift, width: 1306/1500, height: 30/2100, font: 'mplantin', fontSize: 30/2100, fontColor: 'white', otherParameters: ['oneLine=true']}

View File

@@ -1,17 +1,17 @@
var versionM15NyxImageList = [
['White Nyx Nyx Frame', 'data/images/m15/m15FrameWNyx.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']],
['Blue Nyx Frame', 'data/images/m15/m15FrameUNyx.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']],
['Black Nyx Frame', 'data/images/m15/m15FrameBNyx.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']],
['Red Nyx Frame', 'data/images/m15/m15FrameRNyx.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']],
['Green Nyx Frame', 'data/images/m15/m15FrameGNyx.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']],
['Multicolored Nyx Frame', 'data/images/m15/m15FrameMNyx.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']],
['Artifact Nyx Frame', 'data/images/m15/m15FrameANyx.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)']],
['White Nyx Legend Crown', 'data/images/m15/m15CrownWNyx.png', 39/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Nyx Crown (m15)', 'Nyx Crown Outer (m15)', 'Nyx Crown Inner (m15)', 'Nyx Crown Shadowless (m15)']],
['Blue Nyx Legend Crown', 'data/images/m15/m15CrownUNyx.png', 39/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Nyx Crown (m15)', 'Nyx Crown Outer (m15)', 'Nyx Crown Inner (m15)', 'Nyx Crown Shadowless (m15)']],
['Black Nyx Legend Crown', 'data/images/m15/m15CrownBNyx.png', 39/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Nyx Crown (m15)', 'Nyx Crown Outer (m15)', 'Nyx Crown Inner (m15)', 'Nyx Crown Shadowless (m15)']],
['Red Nyx Legend Crown', 'data/images/m15/m15CrownRNyx.png', 39/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Nyx Crown (m15)', 'Nyx Crown Outer (m15)', 'Nyx Crown Inner (m15)', 'Nyx Crown Shadowless (m15)']],
['Green Nyx Legend Crown', 'data/images/m15/m15CrownGNyx.png', 39/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Nyx Crown (m15)', 'Nyx Crown Outer (m15)', 'Nyx Crown Inner (m15)', 'Nyx Crown Shadowless (m15)']],
['Multicolored Nyx Legend Crown', 'data/images/m15/m15CrownMNyx.png', 39/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Nyx Crown (m15)', 'Nyx Crown Outer (m15)', 'Nyx Crown Inner (m15)', 'Nyx Crown Shadowless (m15)']]
['White Nyx Frame', 'data/images/m15/m15FrameWNyx.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)', 'Pinline Super (m15)']],
['Blue Nyx Frame', 'data/images/m15/m15FrameUNyx.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)', 'Pinline Super (m15)']],
['Black Nyx Frame', 'data/images/m15/m15FrameBNyx.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)', 'Pinline Super (m15)']],
['Red Nyx Frame', 'data/images/m15/m15FrameRNyx.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)', 'Pinline Super (m15)']],
['Green Nyx Frame', 'data/images/m15/m15FrameGNyx.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)', 'Pinline Super (m15)']],
['Multicolored Nyx Frame', 'data/images/m15/m15FrameMNyx.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)', 'Pinline Super (m15)']],
['Artifact Nyx Frame', 'data/images/m15/m15FrameANyx.png', 0, 0, 1, 1, ['Full', 'Pinline (m15)', 'Title (m15)', 'Type (m15)', 'Rules (m15)', 'Frame (m15)', 'Border (m15)', 'Pinline Super (m15)']],
['White Nyx Legend Crown', 'data/images/m15/m15CrownWNyx.png', 39/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Nyx Crown (m15)', 'Nyx Crown Outer (m15)', 'Nyx Crown Inner (m15)', 'Nyx Crown Shadowless (m15)', 'Title (m15)']],
['Blue Nyx Legend Crown', 'data/images/m15/m15CrownUNyx.png', 39/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Nyx Crown (m15)', 'Nyx Crown Outer (m15)', 'Nyx Crown Inner (m15)', 'Nyx Crown Shadowless (m15)', 'Title (m15)']],
['Black Nyx Legend Crown', 'data/images/m15/m15CrownBNyx.png', 39/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Nyx Crown (m15)', 'Nyx Crown Outer (m15)', 'Nyx Crown Inner (m15)', 'Nyx Crown Shadowless (m15)', 'Title (m15)']],
['Red Nyx Legend Crown', 'data/images/m15/m15CrownRNyx.png', 39/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Nyx Crown (m15)', 'Nyx Crown Outer (m15)', 'Nyx Crown Inner (m15)', 'Nyx Crown Shadowless (m15)', 'Title (m15)']],
['Green Nyx Legend Crown', 'data/images/m15/m15CrownGNyx.png', 39/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Nyx Crown (m15)', 'Nyx Crown Outer (m15)', 'Nyx Crown Inner (m15)', 'Nyx Crown Shadowless (m15)', 'Title (m15)']],
['Multicolored Nyx Legend Crown', 'data/images/m15/m15CrownMNyx.png', 39/1500, 29/2100, 1422/1500, 341/2100, ['Full', 'Nyx Crown (m15)', 'Nyx Crown Outer (m15)', 'Nyx Crown Inner (m15)', 'Nyx Crown Shadowless (m15)', 'Title (m15)']]
]
var versionM15NyxMaskList = [['Nyx Crown (m15)', 'data/images/m15/m15MaskNyxCrown.png'], ['Nyx Crown Outer (m15)', 'data/images/m15/m15MaskNyxCrownOuter.png'], ['Nyx Crown Inner (m15)', 'data/images/m15/m15MaskNyxCrownInner.png'], ['Nyx Crown Shadowless (m15)', 'data/images/m15/m15MaskNyxCrownShadowless.png']]
@@ -46,7 +46,7 @@ if (currentVersion != 'm15') {
manaCostDirection = 'reverse'
setSymbolX = [scaleX(1382/1500), 'right']
setSymbolY = [scaleY(1200/2100), 'center']
setSymbolY = [scaleY(1240/2100), 'center']
setSymbolWidth = scaleX(180/1500)
setSymbolHeight = scaleY(80/2100)

View File

@@ -109,8 +109,8 @@ function bottomInfoPlaneswalker() {
var ptBoxShift = 36/2100
writeText(
[
{text: document.getElementById('inputInfoNumber').value, x: 97/1500, y: 1990/2100, width: 1306/1500, height: 36/2100, font: 'gothammedium', fontSize: 36/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: document.getElementById('inputInfoSet').value + '{right' + scaleX(0.005) + '}\u2605{right' + scaleX(0.005) + '}' + document.getElementById('inputInfoLanguage').value + ' {artistbrush}{up' + scaleY(36/2100) + '}' + document.getElementById('inputInfoRarity').value + ' {down' + scaleY(72/2100) + '}{up' + scaleY(36/2100) + '}{fontbelerenbsc}' + document.getElementById('inputInfoArtist').value, x: 97/1500, y: 2026/2100, width: 1306/1500, height: 36/2100, font: 'gothammedium', fontSize: 36/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: document.getElementById('inputInfoSet').value + '{right' + scaleX(0.005) + '}\u2605{right' + scaleX(0.005) + '}' + document.getElementById('inputInfoLanguage').value + ' {saveTextX}{artistbrush}{fontbelerenbsc}' + document.getElementById('inputInfoArtist').value, x: 97/1500, y: 2026/2100, width: 1306/1500, height: 36/2100, font: 'gothammedium', fontSize: 36/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: document.getElementById('inputInfoNumber').value + '{loadTextX}' + document.getElementById('inputInfoRarity').value, x: 97/1500, y: 1990/2100, width: 1306/1500, height: 36/2100, font: 'gothammedium', fontSize: 36/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: '{right}\u2122 & \u00a9 ' + date.getFullYear() + ' Wizards of the Coast', x: 97/1500, y: 1990/2100 + ptBoxShift, width: 1306/1500, height: 35/2100, font: 'mplantin', fontSize: 35/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: '*Not for Sale*', x: 97/1500, y: 2056/2100, width: 1306/1500, height: 30/2100, font: 'gothammedium', fontSize: 30/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: '{right}CardConjurer.com', x: 97/1500, y: 2020/2100 + ptBoxShift, width: 1306/1500, height: 30/2100, font: 'mplantin', fontSize: 30/2100, fontColor: 'white', otherParameters: ['oneLine=true']}

View File

@@ -0,0 +1,72 @@
var versionSeventhImageList = [
['White Frame', 'data/images/seventh/seventhFrameW.png', 0, 0, 1, 1, ['Full', 'Pinline (seventh)', 'Rules (seventh)', 'Frame (seventh)', 'Border (seventh)']],
['Blue Frame', 'data/images/seventh/seventhFrameU.png', 0, 0, 1, 1, ['Full', 'Pinline (seventh)', 'Rules (seventh)', 'Frame (seventh)', 'Border (seventh)']],
['Black Frame', 'data/images/seventh/seventhFrameB.png', 0, 0, 1, 1, ['Full', 'Pinline (seventh)', 'Rules (seventh)', 'Frame (seventh)', 'Border (seventh)']],
['Red Frame', 'data/images/seventh/seventhFrameR.png', 0, 0, 1, 1, ['Full', 'Pinline (seventh)', 'Rules (seventh)', 'Frame (seventh)', 'Border (seventh)']],
['Green Frame', 'data/images/seventh/seventhFrameG.png', 0, 0, 1, 1, ['Full', 'Pinline (seventh)', 'Rules (seventh)', 'Frame (seventh)', 'Border (seventh)']],
['Multicolored Frame', 'data/images/seventh/seventhFrameM.png', 0, 0, 1, 1, ['Full', 'Pinline (seventh)', 'Rules (seventh)', 'Frame (seventh)', 'Border (seventh)']],
['Artifact Frame', 'data/images/seventh/seventhFrameA.png', 0, 0, 1, 1, ['Full', 'Pinline (seventh)', 'Rules (seventh)', 'Frame (seventh)', 'Border (seventh)']],
['White Land Frame', 'data/images/seventh/seventhFrameWL.png', 0, 0, 1, 1, ['Full', 'Pinline (seventh)', 'Rules (seventh)', 'Frame (seventh)', 'Border (seventh)']],
['Blue Land Frame', 'data/images/seventh/seventhFrameUL.png', 0, 0, 1, 1, ['Full', 'Pinline (seventh)', 'Rules (seventh)', 'Frame (seventh)', 'Border (seventh)']],
['Black Land Frame', 'data/images/seventh/seventhFrameBL.png', 0, 0, 1, 1, ['Full', 'Pinline (seventh)', 'Rules (seventh)', 'Frame (seventh)', 'Border (seventh)']],
['Red Land Frame', 'data/images/seventh/seventhFrameRL.png', 0, 0, 1, 1, ['Full', 'Pinline (seventh)', 'Rules (seventh)', 'Frame (seventh)', 'Border (seventh)']],
['Green Land Frame', 'data/images/seventh/seventhFrameGL.png', 0, 0, 1, 1, ['Full', 'Pinline (seventh)', 'Rules (seventh)', 'Frame (seventh)', 'Border (seventh)']],
['Land Frame', 'data/images/seventh/seventhFrameCL.png', 0, 0, 1, 1, ['Full', 'Pinline (seventh)', 'Rules (seventh)', 'Frame (seventh)', 'Border (seventh)']],
['Foil Stamp', 'data/images/seventh/seventhFoilStamp.png', 81/744, 867/1039, 300/744, 115/1039, ['Full']]
]
var versionSeventhMaskList = [['Border (seventh)', 'data/images/seventh/seventhMaskBorder.png'], ['Pinline (seventh)', 'data/images/seventh/seventhMaskPinline.png'], ['Rules (seventh)', 'data/images/seventh/seventhMaskRules.png'], ['Frame (seventh)', 'data/images/seventh/seventhMaskFrame.png']]
if (!loadedVersions.includes('seventh')) {
loadedVersions.push('seventh')
loadMaskImages(versionSeventhMaskList)
loadFrameImages(versionSeventhImageList, 'frameClassSeventh')
}
if (currentVersion != 'seventh') {
currentVersion = 'seventh'
hideFrameImages('frameClassSeventh')
loadTextOptions([
new cardText('Card Title', '', 165/1500, 162/2100, 1170/1500, 84/2100, 'goudymedieval', 85/2100, 'white', ['oneLine=true','shadow=' + scaleY(4/2100)]),
new cardText('Card Type', '', 165/1500, 1228/2100, 1170/1500, 66/2100, 'mplantin', 67/2100, 'white', ['oneLine=true','shadow=' + scaleY(4/2100)]),
new cardText('Rules Text', '', 196/1500, 1327/2100, 1112/1500, 590/2100, 'mplantin', 73/2100, 'black'),
new cardText('Power/Toughness', '', 1190/1500, 1969/2100, 230/1500, 78/2100, 'mplantin', 95/2100, 'white', ['oneLine=true,textAlign="center"','shadow=' + scaleY(2/2100)])
])
artX = scaleX(177 / 1500)
artY = scaleY(206 / 2100)
artWidth = scaleX(1144 / 1500)
artHeight = scaleY(934 / 2100)
manaCostXPath = '1306 - 83 * manaSymbolIndex'
manaCostYPath = '99'
manaCostDiameter = '72'
manaCostShadowOffset = '[0, 0]'
manaCostDirection = 'reverse'
setSymbolX = [scaleX(1337/1500), 'right']
setSymbolY = [scaleY(1209/2100), 'center']
setSymbolWidth = scaleX(180/1500)
setSymbolHeight = scaleY(80/2100)
watermarkX = scaleX(0.5)
watermarkY = scaleY(1630/2100)
watermarkWidth = scaleX(1140/1500)
watermarkHeight = scaleY(484/2100)
bottomInfoFunction = 'bottomInfoSeventh'
bottomInfoUpdated()
}
function bottomInfoSeventh() {
bottomInfoContext.clearRect(0, 0, cardWidth, cardHeight)
writeText(
[
{text: '{center}Illus: ' + document.getElementById('inputInfoArtist').value, x: 92/1500, y: 1929/2100, width: 1316/1500, height: 59/2100, font: 'mplantin', fontSize: 59/2100, fontColor: 'white', otherParameters: ['oneLine=true','shadow=' + scaleY(4/2100)]},
{text: '{center}\u2122 & \u00a9 ' + date.getFullYear() + ' Wizards of the Coast', x: 92/1500, y: 1972/2100, width: 1316/1500, height: 36/2100, font: 'mplantin', fontSize: 36/2100, fontColor: 'white', otherParameters: ['oneLine=true','shadow=' + scaleY(4/2100)]},
{text: '{center}*Not for Sale* CardConjurer.com', x: 92/1500, y: 2005/2100, width: 1316/1500, height: 30/2100, font: 'mplantin', fontSize: 30/2100, fontColor: 'white', otherParameters: ['oneLine=true','shadow=' + scaleY(4/2100)]},
], bottomInfoContext)
}

View File

@@ -64,8 +64,8 @@ function bottomInfoStorybook() {
}
writeText(
[
{text: document.getElementById('inputInfoNumber').value, x: 97/1500, y: 2000/2100, width: 1306/1500, height: 36/2100, font: 'gothammedium', fontSize: 36/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: document.getElementById('inputInfoSet').value + '{right' + scaleX(0.005) + '}\u2605{right' + scaleX(0.005) + '}' + document.getElementById('inputInfoLanguage').value + ' {artistbrush}{up' + scaleY(36/2100) + '}' + document.getElementById('inputInfoRarity').value + ' {down' + scaleY(72/2100) + '}{up' + scaleY(36/2100) + '}{fontbelerenbsc}' + document.getElementById('inputInfoArtist').value, x: 97/1500, y: 2036/2100, width: 1306/1500, height: 36/2100, font: 'gothammedium', fontSize: 36/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: document.getElementById('inputInfoSet').value + '{right' + scaleX(0.005) + '}\u2605{right' + scaleX(0.005) + '}' + document.getElementById('inputInfoLanguage').value + ' {saveTextX}{artistbrush}{fontbelerenbsc}' + document.getElementById('inputInfoArtist').value, x: 97/1500, y: 2036/2100, width: 1306/1500, height: 36/2100, font: 'gothammedium', fontSize: 36/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: document.getElementById('inputInfoNumber').value + '{loadTextX}' + document.getElementById('inputInfoRarity').value, x: 97/1500, y: 2000/2100, width: 1306/1500, height: 36/2100, font: 'gothammedium', fontSize: 36/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: '{right}\u2122 & \u00a9 ' + date.getFullYear() + ' Wizards of the Coast', x: 97/1500, y: 2000/2100 + ptBoxShift, width: 1306/1500, height: 35/2100, font: 'mplantin', fontSize: 35/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: '*Not for Sale*', x: 97/1500, y: 2066/2100, width: 1306/1500, height: 30/2100, font: 'gothammedium', fontSize: 30/2100, fontColor: 'white', otherParameters: ['oneLine=true']},
{text: '{right}CardConjurer.com', x: 97/1500, y: 2030/2100 + ptBoxShift, width: 1306/1500, height: 30/2100, font: 'mplantin', fontSize: 30/2100, fontColor: 'white', otherParameters: ['oneLine=true']}

View File

@@ -0,0 +1,58 @@
.askScryfallGrid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: auto 90pt auto;
align-items: center;
justify-items: center;
}
.urzaCard {
width: 360pt;
text-align: center;
grid-column: 1 / span 3;
}
.urzaCard > img {
position: relative;
left: -2rem;
width: 360pt;
height: auto;
}
img {
position: relative;
left: -1rem;
}
.askScryfallGrid > * {
/*border: 1px solid red;*/
}
.askScryfallButton {
width: auto;
height: 60pt;
transition: 0.25s;
}
.askScryfallButton:hover {
height: 80pt;
}
.askScryfallButton:active {
height: 90pt !important;
}
#askScryfallResult {
grid-column: 1 / span 3;
padding: 2rem;
margin: 1rem;
background: var(--background-color-contrast);
color: var(--font-color-contrast);
border-radius: 1rem;
font: 2rem belerenb;
}
@media screen and (min-width: 864pt) {
.askScryfallGrid {
grid-template-columns: calc(360pt) 1fr 1fr 1fr !important;
grid-template-rows: 90pt auto !important;
}
.urzaCard {
grid-column: 1;
grid-row: 1 / span 2 !important;
}
#askScryfallResult {
grid-column: 2 / span 3 !important;
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 700 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 255 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 93 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 64 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 MiB

After

Width:  |  Height:  |  Size: 3.3 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 MiB

After

Width:  |  Height:  |  Size: 3.5 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 869 KiB

After

Width:  |  Height:  |  Size: 3.8 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 MiB

After

Width:  |  Height:  |  Size: 3.2 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 MiB

After

Width:  |  Height:  |  Size: 4.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 MiB

View File

@@ -41,7 +41,9 @@
--background-color-contrast: #333;
--interactable-color: #aaa;
--interactable-selected-color: #777;
--interactable-tiling: 100% 100%;
--input-color: #ddd;
--input-font-color: #000;
--font-color: #000;
--font-color-contrast: #eee;
--body-background: none;
@@ -82,7 +84,7 @@ a:hover {
.title {
text-align: center;
color: var(--font-color);
/*color: var(--font-color);*/
font: 2.5rem 'belerenbsc';
padding: 1rem 0;
}
@@ -97,6 +99,8 @@ a:hover {
grid-template-columns: 2rem auto 2rem;
align-items: center;
background: var(--interactable-color);
color: var(--input-font-color);
background-size: var(--interactable-tiling);
cursor: pointer;
}
.cardMasterElement > .handle {
@@ -162,6 +166,8 @@ img {
}
#maskPicker > div, #framePicker > div {
background: var(--interactable-color);
color: var(--input-font-color);
background-size: var(--interactable-tiling);
cursor: pointer;
}
#maskPicker > div {
@@ -179,6 +185,8 @@ img {
#textPicker > div {
font: 1rem belerenbsc;
background: var(--interactable-color);
color: var(--input-font-color);
background-size: var(--interactable-tiling);
padding: 0.5rem;
cursor: pointer;
}
@@ -223,6 +231,8 @@ textarea {
text-align: center;
padding: 0.5rem 0;
background: var(--interactable-color);
color: var(--input-font-color);
background-size: var(--interactable-tiling);
cursor: pointer;
}
.tabPicker > div.tabOptionSelected {
@@ -231,7 +241,7 @@ textarea {
input:not([type='checkbox']), textarea, button, select {
font: inherit;
color: var(--font-color);
color: var(--input-font-color);
width: 100%;
background: var(--input-color);
border: none;
@@ -240,7 +250,7 @@ input:not([type='checkbox']), textarea, button, select {
margin-top: 0.1rem;
}
input:not([type='checkbox']):active, textarea:active, button:active {
border: 0.1rem solid var(--interactable-color);
border: 0.1rem solid var(--input-font-color);
padding: 0.1rem;
}
input[type='checkbox'] {
@@ -275,6 +285,7 @@ input[type='checkbox'], select, option, input[type='file'], button {
}
.darkLayer {
background: var(--background-color-contrast);
background-size: 100% 100%;
color: var(--font-color-contrast);
}
.layer > div {
@@ -286,19 +297,17 @@ input[type='checkbox'], select, option, input[type='file'], button {
.layer.revealedLayer.fadeIn > div {
animation: fade-in 2s;
}
.mainGrid.fadeIn {
animation: fade-in 0.5s;
}
.layer.revealedLayer.slideFromLeft > div {
animation: slide-from-left 2s;
animation: slide-from-left 1.5s;
}
.layer.revealedLayer.slideFromRight > div {
animation: slide-from-right 2s;
animation: slide-from-right 1.5s;
}
.footer {
padding: 2rem;
background: var(--background-color-contrast);
background-size: 100% 100%;
color: var(--font-color-contrast);
font: 0.6rem arial;
display: grid;
@@ -368,3 +377,18 @@ input[type='checkbox'], select, option, input[type='file'], button {
.paragraph {
text-indent: 2em;
}
.cardLayerGrid {
display: grid;
grid-template-columns: auto auto;
grid-gap: 1rem;
justify-items: center;
align-items: center;
}
.cardLayerGrid > img {
width: 300pt;
height: auto;
}
.truncate {
word-break: break-word;
}

View File

@@ -1,13 +1,13 @@
<!DOCTYPE html5>
<html>
<script async src="data/scripts/cookies.js"></script>
<head>
<title>CC - Disclaimer</title>
<script async src="data/scripts/cookies.js"></script>
<link rel="stylesheet" href="data/site/styles.css">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<title>CC - Disclaimer</title>
<div class='title'>Disclaimer</div>
<div class='layer darkLayer fadeIn'>
<div class='paragraph'>
@@ -37,10 +37,11 @@
<footer class='footer'>
<div>
Card Conjurer by Kyle Burton<br>
<select id='inputColorPalette' onchange='loadScript("data/scripts/" + this.value + ".js")'>
<select id='inputColorPalette' onchange='loadScript("data/scripts/palettes/" + this.value + ".js")'>
<option value='lightMode'>Light Mode</option>
<option value='darkMode'>Dark Mode</option>
<option value='raveMode'>Rave Mode</option>
<option value='scholarMode'>Scholar Mode</option>
</select>
</div>
<div>
@@ -54,6 +55,6 @@
<a href='termsofuse.html'>Terms of Use</a><br>
<a href='disclaimer.html'>Disclaimer</a>
</div>
<script defer src="data/scripts/animations.js"></script>
</footer>
<script defer src="data/scripts/animations.js"></script>
<html>

View File

@@ -145,12 +145,14 @@
<input type="number" class="input number" id="inputCardNameNumberTextImport" onchange="inputCardNameNumberTextImport(this.value)" value="1" min="1" max="1">
</div>
<div id='advancedTab' class='hidden'>
Click one of the following buttons to load the described card frame:<br>
Click on one of the following buttons to load the described card frame:<br>
<button onclick='loadScript("data/scripts/versions/versionM15.js")'>M15</button>
<button onclick='loadScript("data/scripts/versions/versionM15Nyx.js")'>Nyx (M15)</button><br><br>
<button onclick='loadScript("data/scripts/versions/versionPlaneswalker.js")'>Planeswalker (M15)</button><br><br>
<button onclick='loadScript("data/scripts/versions/versionM15Nyx.js")'>Nyx (M15)</button>
<button onclick='loadScript("data/scripts/versions/versionInvention.js")'>Invention (M15)</button><br><br>
<button onclick='loadScript("data/scripts/versions/versionPlaneswalker.js")'>Planeswalker</button><br><br>
<button onclick='loadScript("data/scripts/versions/versionStorybook.js")'>*Storybook (Non-Adventure)</button><br><br>
<button onclick='loadScript("data/scripts/versions/versionFuture.js")'>*Future Shifted</button>
<button onclick='loadScript("data/scripts/versions/versionFuture.js")'>Future Shifted</button><br><br>
<button onclick='loadScript("data/scripts/versions/versionSeventh.js")'>Seventh Edition</button>
<br><br>*Starred frames are works in progress, however they can still be used.
</div>
</div>
@@ -171,19 +173,65 @@
</div>
</div>
</div>
<div class='layer fadeIn'>
<div class='paragraph'>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Laoreet suspendisse interdum consectetur libero id faucibus nisl tincidunt. Id volutpat lacus laoreet non curabitur. Adipiscing tristique risus nec feugiat in fermentum. Vulputate mi sit amet mauris. Morbi tincidunt augue interdum velit euismod in. Amet mattis vulputate enim nulla aliquet porttitor lacus luctus accumsan. Sed felis eget velit aliquet sagittis. Neque ornare aenean euismod elementum nisi quis eleifend. Nisl nunc mi ipsum faucibus vitae. Mattis nunc sed blandit libero volutpat sed cras ornare. Sed vulputate mi sit amet mauris commodo quis imperdiet massa. Condimentum mattis pellentesque id nibh tortor. Leo in vitae turpis massa. Dignissim cras tincidunt lobortis feugiat vivamus. Massa ultricies mi quis hendrerit dolor magna eget est.
<div class='layer slideFromRight'>
<div class='cardLayerGrid'>
<img src='data/site/images/samples/sampleVariety.png'>
<div>
<div class='layerTitle'>
Choose From A Variety Of Card Frames
</div>
<div>
Card Conjurer offers more card frame options than any other web-based Magic card maker
</div>
</div>
<div class='layer darkLayer slideFromRight'>
</div>
</div>
<div class='layer darkLayer slideFromLeft'>
<div class='cardLayerGrid'>
<div>
<div class='layerTitle'>
Customize To Your Heart's Content
</div>
<div>
With Card Conjurer's level of customization, you'll have endless options when designing your dream cards
</div>
</div>
<img src='data/site/images/samples/sampleCustomize.png'>
</div>
</div>
<div class='layer slideFromRight'>
<div class='cardLayerGrid'>
<img src='data/site/images/samples/sampleBling.png'>
<div>
<div class='layerTitle'>
Or Bling Out Existing Favorites
</div>
<div>
Easily import vital information from existing cards, then redesign them
</div>
</div>
</div>
</div>
<div class='layer darkLayer fadeIn'>
<div>
<div>
<div class='layerTitle'>
Have Any Questions?
</div>
<div class='paragraph'>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Vehicula ipsum a arcu cursus vitae. Venenatis tellus in metus vulputate eu. Id diam maecenas ultricies mi. Enim nec dui nunc mattis enim ut tellus elementum. Consectetur libero id faucibus nisl tincidunt eget nullam non. Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Morbi leo urna molestie at elementum eu facilisis sed odio. Nulla pharetra diam sit amet nisl suscipit. A erat nam at lectus urna duis. Neque viverra justo nec ultrices.
If you have a question, a request, or even just want to share that cool card you made, please don't hesitate to email me at <label class="truncate"><a href="https://mail.google.com/mail/u/0/?view=cm&fs=1&to=CardConjurerMTG@gmail.com&su=Card%20Conjurer&tf=1" target="_blank">CardConjurerMTG@gmail.com</a></label>!
</div>
</div>
</div>
</div>
<div class='layer slideFromLeft'>
<div class='paragraph'>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Vehicula ipsum a arcu cursus vitae. Venenatis tellus in metus vulputate eu. Id diam maecenas ultricies mi. Enim nec dui nunc mattis enim ut tellus elementum. Consectetur libero id faucibus nisl tincidunt eget nullam non. Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Morbi leo urna molestie at elementum eu facilisis sed odio. Nulla pharetra diam sit amet nisl suscipit. A erat nam at lectus urna duis. Neque viverra justo nec ultrices.
<div>
<div class='layerTitle'>
The Proxy Factory
</div>
<div class="paragraph">
If you'd like to delve deeper into making custom Magic: The Gathering cards, check out The Proxy Factory! They're a community full of individuals interested in creating custom cards, and are very welcoming to new members. Take a look at their <a style='color: #ff4500;' href='https://www.reddit.com/r/TheProxyFactory/' target='_blank'>Reddit</a>, or join their <a style='color: #738adb;' href='https://discordapp.com/invite/xBCQprM' target='_blank'>Discord</a>. Happy proxying!
</div>
</div>
</div>
<script defer src="data/scripts/sortable.js"></script>
@@ -197,6 +245,7 @@
<option value='lightMode'>Light Mode</option>
<option value='darkMode'>Dark Mode</option>
<option value='raveMode'>Rave Mode</option>
<option value='scholarMode'>Scholar Mode</option>
</select>
</div>
<div>

View File

@@ -1,13 +1,13 @@
<!DOCTYPE html5>
<html>
<script async src="data/scripts/cookies.js"></script>
<head>
<title>CC - Terms of Use</title>
<script async src="data/scripts/cookies.js"></script>
<link rel="stylesheet" href="data/site/styles.css">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<title>CC - Terms of Use</title>
<div class='title darkLayer'>Terms of Use</div>
<div class='layer fadeIn'>
<div class='paragraph'>
@@ -28,10 +28,11 @@
<footer class='footer'>
<div>
Card Conjurer by Kyle Burton<br>
<select id='inputColorPalette' onchange='loadScript("data/scripts/" + this.value + ".js")'>
<select id='inputColorPalette' onchange='loadScript("data/scripts/palettes/" + this.value + ".js")'>
<option value='lightMode'>Light Mode</option>
<option value='darkMode'>Dark Mode</option>
<option value='raveMode'>Rave Mode</option>
<option value='scholarMode'>Scholar Mode</option>
</select>
</div>
<div>
@@ -45,6 +46,6 @@
<a href='termsofuse.html'>Terms of Use</a><br>
<a href='disclaimer.html'>Disclaimer</a>
</div>
<script defer src="data/scripts/animations.js"></script>
</footer>
<script defer src="data/scripts/animations.js"></script>
<html>