GithubMirrors/cardconjurer
1
0
Fork 1
mirror of https://github.com/Investigamer/cardconjurer.git synced 2025-07-26 21:04:58 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

optimizations

Browse Source
This commit is contained in:
Kyle
2019-04-12 17:05:42 -07:00
parent 0536461df7
commit 76cc8776e2
5 changed files with 31 additions and 1366 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
data/borders/planeswalker/border.js
View File

@@ -26,6 +26,9 @@ cardData.watermarkWidth = cwidth(520)
cardData.watermarkHeight = cheight(250)
cardData.setSymbolY = cheight(618)
cardData.setSymbolRight = cwidth(695)
imgRareStamp.load("none", cwidth(329), cheight(945), cwidth(90), cheight(50))
imgRareStampRight.load("none", cwidth(329), cheight(945), cwidth(90), cheight(50))
imgStamp.load("none", cwidth(340), cheight(961), cwidth(70), cheight(37))
//Images
imgPowerToughness.load("data/borders/planeswalker/white/pt.png")
imgArtMask.load("data/borders/planeswalker/imgArtMask.png")
@@ -61,9 +64,9 @@ function planeswalkerAbilityLines() {
for (var i = 0; i < abilityLines.length; i ++) {
//determine the correct color
if (i % 2 === 0) {
specialAContext.fillStyle = "#95959595"
specialAContext.fillStyle = "#d3d3d3d3"
} else {
specialAContext.fillStyle = "#6a6a6a6a"
specialAContext.fillStyle = "#a8a8a8a8"
}
if (i == abilityLines.length - 1) {
//This is the last line

BIN
data/borders/planeswalker/imgAbilityLineEven.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.4 KiB

After

Width:  |  Height:  |  Size: 3.4 KiB

BIN
data/borders/planeswalker/imgAbilityLineOdd.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.9 KiB

After

Width:  |  Height:  |  Size: 3.4 KiB

1029
data/main.js
View File

File diff suppressed because it is too large Load Diff

359
index.html
View File

@@ -362,9 +362,9 @@
</div>
<div class="cmm" id="cmm-planeswalker">
Planeswalker Ability Line Height
<input type="number" id="inputAbilityLine1" value="104" min="0" oninput="planeswalkerAbilityLines()">
<input type="number" id="inputAbilityLine2" value="104" min="0" oninput="planeswalkerAbilityLines()">
<input type="number" id="inputAbilityLine3" value="104" min="0" oninput="planeswalkerAbilityLines()">
<input type="number" id="inputAbilityLine1" value="102" min="0" oninput="planeswalkerAbilityLines()">
<input type="number" id="inputAbilityLine2" value="96" min="0" oninput="planeswalkerAbilityLines()">
<input type="number" id="inputAbilityLine3" value="80" min="0" oninput="planeswalkerAbilityLines()">
<input type="number" id="inputAbilityLine4" value="0" min="0" oninput="planeswalkerAbilityLines()">
Planeswalker Ability Values
<input type="text" id="inputAbilityValue0" value="+1" oninput="planeswalkerAbilityIcons()">
@@ -372,334 +372,6 @@
<input type="text" id="inputAbilityValue2" value="-1" oninput="planeswalkerAbilityIcons()">
<input type="text" id="inputAbilityValue3" value="" oninput="planeswalkerAbilityIcons()">
</div>
<!-- <div class="cmm shown" id="cmm-color">
Border
<span class="dropdown">
<select id="borderSelection" onchange="changeTemplate()">
<option value="m15/">M15</option>
</select>
</span>
<br>
Color
<span class="dropdown">
<select id="colorSelection" onchange="updateBorder()">
<option value="white">White</option>
</select>
</span>
<br>
<div class="checkbox">
<input type="checkbox" id="checkboxSecondColor" onchange="updateBorder()" />
<label for="checkboxSecondColor" />
<div>Second Color</div>
</div>
<span class="dropdown">
<select id="secondColorSelection" onchange="updateBorder()"></select>
</span>
<br>
<div class="checkbox">
<input type="checkbox" id="checkboxThirdColor" onchange="updateBorder()" />
<label for="checkboxThirdColor" />
<div>Third Color</div>
</div>
<span class="dropdown">
<select id="thirdColorSelection" onchange="updateBorder()"></select>
</span>
<br>
<div class="checkbox">
<input type="checkbox" id="checkboxArtifact" onchange="updateBorder()" />
<label for="checkboxArtifact" />
<div>Artifact</div>
</div>
</div>
<div class="cmm" id="cmm-advanced">
<div class="checkbox">
<input type="checkbox" id="checkboxLegendary" onchange="updateBorder()" />
<label for="checkboxLegendary" />
<div>Legendary</div>
</div>
<div class="checkbox">
<input type="checkbox" id="checkboxNyx" onchange="updateBorder()" />
<label for="checkboxNyx" />
<div>Nyx</div>
</div>
<div class="checkbox">
<input type="checkbox" id="checkboxMiracle" onchange="updateBorder()" />
<label for="checkboxMiracle" />
<div>Miracle</div>
</div>
<div class="checkbox">
<input type="checkbox" id="checkboxRareStamp" onchange="updateBorder()" />
<label for="checkboxRareStamp" />
<div>Rare Stamp</div>
</div>
<div class="checkbox">
<input type="checkbox" id="checkboxFlipIcon" onchange="updateBorder()" />
<label for="checkboxFlipIcon" />
<div>Flip Icon</div>
</div>
<span class="dropdown">
<select id="inputFlipIcon" onchange="updateBorder()">
<option value="blank.png">Blank</option>
<option value="day.png">Day</option>
<option value="night.png">Night</option>
<option value="compass.png">Compass</option>
<option value="moon.png">Moon</option>
<option value="eldrazi.png">Eldrazi</option>
<option value="planeswalker.png">Planeswalker</option>
<option value="creature.png">Creature</option>
<option value="instant.png">Instant</option>
<option value="sorcery.png">Sorcery</option>
<option value="enchantment.png">Enchantment</option>
<option value="artifact.png">Artifact</option>
<option value="land.png">Land</option>
<option value="multitype.png">Multitype</option>
<option value="planeshift.png">Planeshift</option>
<option value="structure.png">Structure</option>
</select>
</span>
<div class="checkbox">
<input type="checkbox" id="checkboxFlipTip" onchange="updateBorder()" />
<label for="checkboxFlipTip" />
<div>Flip Tip</div>
</div>
<input id="inputFlipTip" value="" type="text" class="input">
<div class="checkbox">
<input type="checkbox" id="checkboxFlippedDark" onchange="updateBorder()" />
<label for="checkboxFlippedDark" />
<div>Flipped (Darker)</div>
</div>
<div class="checkbox">
<input type="checkbox" id="checkboxSilverBorder" onchange="createBorder()" />
<label for="checkboxSilverBorder" />
<div>Silver Border</div>
</div>
<input type="color" id="inputColor" onchange="createBorder()" value="#000000"> Border Color
<div class="checkbox">
<input type="checkbox" id="checkboxFoil" />
<label for="checkboxFoil" />
<div>Foil</div>
</div>
<div class="checkbox">
<input type="checkbox" id="checkboxIdentity" onchange="createBorder()" />
<label for="checkboxIdentity" />
<div>Color Identity</div>
</div>
<input id="inputIdentity" type="text" class="input" onchange="createBorder()">
<div class="checkbox">
<input type="checkbox" id="checkboxBorderless" onchange="createBorder()" />
<label for="checkboxBorderless" />
<div>Borderless</div>
</div>
<div class="checkbox">
<input type="checkbox" id="checkboxTitleVisibility" checked="true" onchange="createBorder()">
<label for="checkboxTitleVisibility" />
<div>Title Visibility</div>
</div>
<div class="checkbox">
<input type="checkbox" id="checkboxTypeVisibility" checked="true" onchange="createBorder()">
<label for="checkboxTypeVisibility" />
<div>Type Visibility</div>
</div>
<div class="checkbox">
<input type="checkbox" id="checkboxRulesVisibility" checked="true" onchange="createBorder()">
<label for="checkboxRulesVisibility" />
<div>Rules Visibility</div>
</div>
Title Color <input type="color" id="inputTitleColor" value="#000000"> Outline <input type="color" id="inputTitleOutlineColor" value="#ffffff">
<div class="checkbox">
<input type="checkbox" id="checkboxTitleOutline">
<label for="checkboxTitleOutline" />
<div>Title Outline</div>
</div>
Type Color <input type="color" id="inputTypeColor" value="#000000"> Outline <input type="color" id="inputTypeOutlineColor" value="#ffffff">
<div class="checkbox">
<input type="checkbox" id="checkboxTypeOutline">
<label for="checkboxTypeOutline" />
<div>Type Outline</div>
</div>
Rules Color <input type="color" id="inputRulesColor" value="#000000"> Outline <input type="color" id="inputRulesOutlineColor" value="#ffffff">
<div class="checkbox">
<input type="checkbox" id="checkboxRulesOutline">
<label for="checkboxRulesOutline" />
<div>Rules Outline</div>
</div>
<input type="color" id="inputCreatureColor" value="#000000"> Power/Toughness Color<br>
</div>
<div class="cmm" id="cmm-general">
Name
<input id="inputName" type="text" class="input">
<br>
Mana Cost
<input id="inputCost" type="text" class="input">
<br>
Type
<input id="inputType" type="text" class="input">
<div class="checkbox">
<input type="checkbox" id="checkboxCreature" />
<label for="checkboxCreature" />
<div>Power/Toughness</div>
</div>
<input id="inputPowerToughness" class="input" type="text">
</div>
<div class="cmm" id="cmm-text">
Rules Text
<br>
<textarea id="inputText" class="input" rows="5" cols="40" style="width: 100%; resize: none; height: 200px" placeholder="Remember to include curly brackets ('{' and '}') around each code. To skip to the next line use {line}. See 'Mana Symbols' and 'Other Codes' (below) for more information."></textarea>
<br>
Rules Text Font Size
<input id="textSize" type="number" class="input" min="0" max="100" value="37" step="0.5">
<br>
Pixels Between Paragraphs
<input id="textShift" type="number" class="input" min="0" max="300" value="13">
<br>
Shift All Text Down
<input id="textDown" type="number" class="input" min="0" max="300" value="0">
<br>
Shift Mana Symbols Down
<input id="inputSymbolDown" type="number" class="input" value="0">
</div>
<div class="cmm" id="cmm-art">
Image
<input type="file" name="inputCardArt" class="input" accept="image/*" onchange="loadImage(event, imgArt, true)" id="inputPicture">
<br>
<input type="text" class="input" placeholder="Or use a URL" onchange="imageURL(this, imgArt)">
<br>
<input id="inputCardArtName" onchange="inputCardArtName(this.value)" class="input" type="text" placeholder="Or try using a card name"></input>
<br>
Card Name Result:
<input id="inputCardArtNameNumber" onchange="inputCardArtNameNumber(this.value)" class="input" type="number" value="1" min="1" max="3">
<br>
Image Zoom
<input id="imageSize" type="number" class="input" value="100" step="0.1">
<br>
Image Left
<input id="imageLeft" type="number" class="input" value="0" step="1">
<br>
Image Up
<input id="imageUp" type="number" class="input" value="0" step="1">
Image Rotation
<input id="imageRotation" type="number" class="input" value="0" step="1" min="0" max="360">
</div>
<div class="cmm" id="cmm-info">
Other Info
<input id="inputInfo" value="Not A Real Card" type="text" class="input">
<br>
Card Number
<input id="inputNumber" value="001/001" type="text" class="input">
<br>
Rarity
<input id="inputRarity" value="C" type="text" class="input">
<br>
Set Abbreviation
<input id="inputSet" value="MTG" type="text" class="input">
<br>
Language
<input id="inputLanguage" value="EN" type="text" class="input">
<br>
Artist Credit
<input id="inputArtist" type="text" class="input">
<br>
<input type="color" id="inputInfoColor" value="#ffffff"> Info Color<br>
</div>
<div class="cmm" id="cmm-set">
<div class="checkbox">
<input type="checkbox" id="checkboxSetSymbol" checked="true">
<label for="checkboxSetSymbol" />
<div>Set Symbol</div>
</div>
Set Code
<input type="text" onchange="loadSetSymbol()" value="hm" id="setSymbolCode" class="input">
<br>
Set Symbol Rarity
<input type="text" onchange="loadSetSymbol()" value="c" id="setSymbolRarity" class="input">
<br>
Custom Set Symbol
<input type="file" class="input" accept="image/*" onchange="loadImage(event, imgSetSymbol, true)" id="inputSetSymbol">
<br>
<input type="text" class="input" placeholder="Or use a URL" onchange="imageURL(this, imgSetSymbol)">
<br>
Scale Set Symbol
<input id="setSymbolSize" type="number" class="input" value="100" step="0.5">
</div>
<div class="cmm" id="cmm-download">
<a onclick="downloadCardImage(this)" id="downloadCardImage" href="" target="_blank" download="card.png">Download</a><br>
Frame Rate
<input type="number" class="input" id="inputFPS" value="5" min="0" onchange="window.clearInterval(cardClockInterval); cardClockInterval = setInterval(cardClock, 1000 / document.getElementById('inputFPS').value)">
<div class="checkbox">
<input type="checkbox" id="checkboxDebuggerLine" />
<label for="checkboxDebuggerLine" />
<div>Debugger Lines</div>
</div>
</div>
<div class="cmm" id="cmm-watermark">
<div class="checkbox">
<input type="checkbox" id="checkboxWatermark" checked="true" />
<label for="checkboxWatermark" />
<div>Watermark</div>
</div>
<input type="file" class="input" accept="image/*" onchange="loadImage(event, imgWatermark, true)" id="inputWatermark">
<br>
<input type="text" class="input" placeholder="Or use a URL" onchange="imageURL(this, imgWatermark)">
<br>
<input type="text" class="input" placeholder="Or use a set code" onchange="loadSetSymbolWatermark()" id="inputWatermarkSetCode">
<br>
Watermark Color
<br>
<span class="dropdown">
<select id="watermarkColorSelection">
<option value="#afa360">White</option>
<option value="#04527c">Blue</option>
<option value="#494949">Black</option>
<option value="#a3280d">Red</option>
<option value="#0f4f14">Green</option>
<option value="#7f5f00">Gold</option>
<option value="#616b72">Artifact/Colorless</option>
</select>
</span>
<br>
<div class="checkbox">
<input type="checkbox" id="checkboxSecondWatermarkColor" />
<label for="checkboxSecondWatermarkColor" />
<div>Second Color</div>
</div>
<span class="dropdown">
<select id="secondWatermarkColorSelection">
<option value="#afa360">White</option>
<option value="#04527c">Blue</option>
<option value="#494949">Black</option>
<option value="#a3280d">Red</option>
<option value="#0f4f14">Green</option>
<option value="#7f5f00">Gold</option>
<option value="#616b72">Artifact/Colorless</option>
</select>
</span>
Watermark Opacity
<input type="number" id="inputWatermarkOpacity" class="input" value="0.4" max="1" min="0" step="0.01">
<div class="checkbox">
<input type="checkbox" id="checkboxOriginalWatermark" />
<label for="checkboxOriginalWatermark" />
<div>Use Original Colors</div>
</div>
</div>
<div class="cmm" id="cmm-planeswalker">
Planeswalker Ability Line Height
<input type="number" id="abilityLine1" value="102" onchange="planeswalkerAbilityLines()">
<input type="number" id="abilityLine2" value="102" onchange="planeswalkerAbilityLines()">
<input type="number" id="abilityLine3" value="102" onchange="planeswalkerAbilityLines()">
<input type="number" id="abilityLine4" value="0" onchange="planeswalkerAbilityLines()">
These values set the height of each ability box of the planeswalker. For evenly spaced boxes use (145, 145) or (90, 90, 90)<br>
Planeswalker Ability Values
<input type="text" id="abilityValue0" value="+1">
<input type="text" id="abilityValue1" value="0">
<input type="text" id="abilityValue2" value="-1">
<input type="text" id="abilityValue3" value="">
</div>
<div class="cmm" id="cmm-vanguard">
Hand Size Modifier
<input type="text" id="inputVanguardHandMod">
Life Total Modifier
<input type="text" id="inputVanguardLifeMod">
</div> -->
</div>
</div>
<div class="tutorialArea">
@@ -748,19 +420,18 @@
</div>
</div>
<div class="extras" id="extras-codes">
Like the mana symbols, each of the following codes must include '{' before each code and '}' after. If a code doesn't work, try putting a space before and/or after the code.<br>
&#8226 line &#8594 Skips to the next line<br>
&#8226 bar &#8594 Just like line, except adds the bar that usually seperates flavor text<br>
&#8226 lineNoSpace &#8594 Just like line, except stays closer to the previous line<br>
&#8226 i &#8594 Text is italicized<br>
&#8226 /i &#8594 Text returns to normal<br>
&#8226 left &#8594 Text aligns to the left<br>
&#8226 center &#8594 Text aligns to the center<br>
&#8226 right &#8594 Text aligns to the right<br>
&#8226 upX &#8594 Shifts the following text X pixels up<br>
&#8226 downX &#8594 Shifts the following text X pixels down<br>
&#8226 leftX &#8594 Shifts the following text X pixels left<br>
&#8226 rightX &#8594 Shifts the following text X pixels right<br>
&#8226 {line} &#8594 Skips to the next line<br>
&#8226 {bar} &#8594 Just like line, except adds the bar that usually seperates flavor text<br>
&#8226 {lineNoSpace} &#8594 Just like line, except stays closer to the previous line<br>
&#8226 {i} &#8594 Text is italicized<br>
&#8226 {/i} &#8594 Text returns to normal<br>
&#8226 {left} &#8594 Text aligns to the left<br>
&#8226 {center} &#8594 Text aligns to the center<br>
&#8226 {right} &#8594 Text aligns to the right<br>
&#8226 {upX} &#8594 Shifts the following text X pixels up<br>
&#8226 {downX} &#8594 Shifts the following text X pixels down<br>
&#8226 {leftX} &#8594 Shifts the following text X pixels left<br>
&#8226 {rightX} &#8594 Shifts the following text X pixels right<br>
</div>
<div class="extras" id="extras-set">
Every set in Magic: The Gathering has an associated 2-3 letter code. For example, Homelands is HM and Innistrad is ISD. This program uses the codes from <a href="http://gatherer.wizards.com" target="_blank">The Gatherer</a>, the official Magic card database. A handy list of all sets and their codes can be found on <a href="https://en.wikipedia.org/wiki/List_of_Magic:_The_Gathering_sets" target="_blank">Wikipedia</a>.