forked from GithubMirrors/cardconjurer
optimizations
This commit is contained in:
Kyle
@@ -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
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 5.4 KiB After Width: | Height: | Size: 3.4 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.9 KiB After Width: | Height: | Size: 3.4 KiB |
1029
data/main.js
1029
data/main.js
File diff suppressed because it is too large
Load Diff
361
index.html
361
index.html
@@ -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>
|
||||
• line → Skips to the next line<br>
|
||||
• bar → Just like line, except adds the bar that usually seperates flavor text<br>
|
||||
• lineNoSpace → Just like line, except stays closer to the previous line<br>
|
||||
• i → Text is italicized<br>
|
||||
• /i → Text returns to normal<br>
|
||||
• left → Text aligns to the left<br>
|
||||
• center → Text aligns to the center<br>
|
||||
• right → Text aligns to the right<br>
|
||||
• upX → Shifts the following text X pixels up<br>
|
||||
• downX → Shifts the following text X pixels down<br>
|
||||
• leftX → Shifts the following text X pixels left<br>
|
||||
• rightX → Shifts the following text X pixels right<br>
|
||||
• {line} → Skips to the next line<br>
|
||||
• {bar} → Just like line, except adds the bar that usually seperates flavor text<br>
|
||||
• {lineNoSpace} → Just like line, except stays closer to the previous line<br>
|
||||
• {i} → Text is italicized<br>
|
||||
• {/i} → Text returns to normal<br>
|
||||
• {left} → Text aligns to the left<br>
|
||||
• {center} → Text aligns to the center<br>
|
||||
• {right} → Text aligns to the right<br>
|
||||
• {upX} → Shifts the following text X pixels up<br>
|
||||
• {downX} → Shifts the following text X pixels down<br>
|
||||
• {leftX} → Shifts the following text X pixels left<br>
|
||||
• {rightX} → 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>.
|
||||
@@ -1104,4 +775,4 @@ References
|
||||
...
|
||||
</div>
|
||||
|
||||
-->
|
||||
-->
|
||||
Reference in New Issue
Block a user