Mindfang/cardconjurer
1
0
Fork 0
forked from GithubMirrors/cardconjurer
Code Pull Requests Actions Packages Activity

Colored Borders!

Browse Source
This commit is contained in:
Kyle
2018-10-14 16:58:55 -07:00
parent 38f74bb695
commit 1e90cdc642
3 changed files with 13 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
data/borders/artistBrush.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 857 B

After

Width:  |  Height:  |  Size: 534 B

BIN
data/borders/m15/borderColorMask.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.7 KiB

17
index.html
View File

@@ -43,6 +43,8 @@
<br/> <br/>
<input type="checkbox" id="silverBorderCheckbox">Silver Border</input> <input type="checkbox" id="silverBorderCheckbox">Silver Border</input>
<br/> <br/>
<input type="color" id="inputColor"> Border Color</input>
<br/>
<input type="checkbox" id="foilCheckbox">Foil</input> <input type="checkbox" id="foilCheckbox">Foil</input>
<br/> <br/>
</div> </div>
@@ -392,7 +394,7 @@ var m15Info = true
var canvas = document.getElementById("canvas") var canvas = document.getElementById("canvas")
var card = canvas.getContext("2d") var card = canvas.getContext("2d")
//Load dynamic images //Load dynamic images
var dynamicImageList = ["borderColor", "secondBorderColor", "thirdBorderColor", "borderCreature", "secondBorderCreature", "thirdBorderCreature", "borderLegendary", "secondBorderLegendary", "thirdBorderLegendary", "borderRareStamp", "secondBorderRareStamp", "art", "artMask", "setSymbol", "watermark", "multiMask", "LegendMultiMask", "legendSilver"] var dynamicImageList = ["borderColor", "secondBorderColor", "thirdBorderColor", "borderCreature", "secondBorderCreature", "thirdBorderCreature", "borderLegendary", "secondBorderLegendary", "thirdBorderLegendary", "borderRareStamp", "secondBorderRareStamp", "art", "artMask", "setSymbol", "watermark", "multiMask", "LegendMultiMask", "legendSilver", "borderColorMask"]
for (i = 0; i < dynamicImageList.length; i ++) { for (i = 0; i < dynamicImageList.length; i ++) {
var imgName = "img" + dynamicImageList[i].charAt(0).toUpperCase() + dynamicImageList[i].slice(1) var imgName = "img" + dynamicImageList[i].charAt(0).toUpperCase() + dynamicImageList[i].slice(1)
window[imgName] = new Image() window[imgName] = new Image()
@@ -470,6 +472,7 @@ function updateBorder() {
imgMultiMask.src = "data/borders/" + document.getElementById("borderSelection").value + "multiMask.png" imgMultiMask.src = "data/borders/" + document.getElementById("borderSelection").value + "multiMask.png"
imgLegendMultiMask.src = "data/borders/" + document.getElementById("borderSelection").value + "legendMultiMask.png" imgLegendMultiMask.src = "data/borders/" + document.getElementById("borderSelection").value + "legendMultiMask.png"
imgLegendSilver.src = "data/borders/" + document.getElementById("borderSelection").value + "legendSilver.png" imgLegendSilver.src = "data/borders/" + document.getElementById("borderSelection").value + "legendSilver.png"
imgBorderColorMask.src = "data/borders/" + document.getElementById("borderSelection").value + "borderColorMask.png"
updateColor() updateColor()
} }
//Loads the images for the card frame, power toughness box, and rare stamp //Loads the images for the card frame, power toughness box, and rare stamp
@@ -527,13 +530,15 @@ function drawBorder() {
card.drawImage(imgRareStamp, 340, rareStampY, 70, 37) card.drawImage(imgRareStamp, 340, rareStampY, 70, 37)
} }
} }
//Draws the selected colored border
drawMask(document.getElementById("inputColor").value, 0, 0, canvas.width, canvas.height, imgBorderColorMask, false, false)
if(document.getElementById("legendaryCheckbox").checked == true) { if(document.getElementById("legendaryCheckbox").checked == true) {
card.drawImage(imgBorderEdge, 0, 0, canvas.width, canvas.height) //////////////////////////////////////////////////////////////////////////////////////card.drawImage(imgBorderEdge, 0, 0, canvas.width, canvas.height)
if (document.getElementById("silverBorderCheckbox").checked == true) { if (document.getElementById("silverBorderCheckbox").checked == true) {
drawMask(imgLegendSilver, 0, 0, canvas.width, canvas.height, imgCardMask, false, false) drawMask(imgLegendSilver, 0, 0, canvas.width, canvas.height, imgCardMask, false, false)
} }
} else { } else {
card.drawImage(imgBorderEdge, 0, 0, canvas.width, canvas.height) /////////////////////////////////////////////////////////////////////////////////////card.drawImage(imgBorderEdge, 0, 0, canvas.width, canvas.height)
if (document.getElementById("silverBorderCheckbox").checked == true) { if (document.getElementById("silverBorderCheckbox").checked == true) {
card.drawImage(imgSilverBorder, 0, 0, canvas.width, canvas.height) card.drawImage(imgSilverBorder, 0, 0, canvas.width, canvas.height)
} }
@@ -632,8 +637,12 @@ function writeText() {
} }
//Bottom info on M15 cards //Bottom info on M15 cards
function bottomInfoM15() { function bottomInfoM15() {
if (document.getElementById("artistColor").checked == true) {
card.fillStyle = "black"
} else {
card.fillStyle = "white"
}
var shiftInfo = 445 var shiftInfo = 445
card.fillStyle = "white"
canvas.style.letterSpacing = "0.8px" canvas.style.letterSpacing = "0.8px"
card.font = "19.5px relaymedium" card.font = "19.5px relaymedium"
var bottomLine = document.getElementById("inputSet").value + " \u00b7 " + document.getElementById("inputLanguage").value var bottomLine = document.getElementById("inputSet").value + " \u00b7 " + document.getElementById("inputLanguage").value