diff --git a/img/frames/planeswalker/text.svg b/img/frames/planeswalker/text.svg new file mode 100644 index 00000000..dde4abdc --- /dev/null +++ b/img/frames/planeswalker/text.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/img/frames/planeswalker/transform/ab.png b/img/frames/planeswalker/transform/ab.png new file mode 100644 index 00000000..bbcd6c9b Binary files /dev/null and b/img/frames/planeswalker/transform/ab.png differ diff --git a/img/frames/planeswalker/transform/abThumb.png b/img/frames/planeswalker/transform/abThumb.png new file mode 100644 index 00000000..f4cb8856 Binary files /dev/null and b/img/frames/planeswalker/transform/abThumb.png differ diff --git a/img/frames/planeswalker/transform/bb.png b/img/frames/planeswalker/transform/bb.png new file mode 100644 index 00000000..3a1efbdf Binary files /dev/null and b/img/frames/planeswalker/transform/bb.png differ diff --git a/img/frames/planeswalker/transform/bbThumb.png b/img/frames/planeswalker/transform/bbThumb.png new file mode 100644 index 00000000..0a8e4f96 Binary files /dev/null and b/img/frames/planeswalker/transform/bbThumb.png differ diff --git a/img/frames/planeswalker/transform/bf.png b/img/frames/planeswalker/transform/bf.png new file mode 100644 index 00000000..6c1e6810 Binary files /dev/null and b/img/frames/planeswalker/transform/bf.png differ diff --git a/img/frames/planeswalker/transform/bfThumb.png b/img/frames/planeswalker/transform/bfThumb.png new file mode 100644 index 00000000..c6d3fc50 Binary files /dev/null and b/img/frames/planeswalker/transform/bfThumb.png differ diff --git a/img/frames/planeswalker/transform/frame.svg b/img/frames/planeswalker/transform/frame.svg new file mode 100644 index 00000000..c1aa154c --- /dev/null +++ b/img/frames/planeswalker/transform/frame.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/img/frames/planeswalker/transform/frameFront.svg b/img/frames/planeswalker/transform/frameFront.svg new file mode 100644 index 00000000..b76a5c31 --- /dev/null +++ b/img/frames/planeswalker/transform/frameFront.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/img/frames/planeswalker/transform/frameFrontThumb.png b/img/frames/planeswalker/transform/frameFrontThumb.png new file mode 100644 index 00000000..70f17918 Binary files /dev/null and b/img/frames/planeswalker/transform/frameFrontThumb.png differ diff --git a/img/frames/planeswalker/transform/frameThumb.png b/img/frames/planeswalker/transform/frameThumb.png new file mode 100644 index 00000000..acece99c Binary files /dev/null and b/img/frames/planeswalker/transform/frameThumb.png differ diff --git a/img/frames/planeswalker/transform/gb.png b/img/frames/planeswalker/transform/gb.png new file mode 100644 index 00000000..1acaa18a Binary files /dev/null and b/img/frames/planeswalker/transform/gb.png differ diff --git a/img/frames/planeswalker/transform/gbThumb.png b/img/frames/planeswalker/transform/gbThumb.png new file mode 100644 index 00000000..0f1800b1 Binary files /dev/null and b/img/frames/planeswalker/transform/gbThumb.png differ diff --git a/img/frames/planeswalker/transform/gf.png b/img/frames/planeswalker/transform/gf.png new file mode 100644 index 00000000..c5d6e769 Binary files /dev/null and b/img/frames/planeswalker/transform/gf.png differ diff --git a/img/frames/planeswalker/transform/gfThumb.png b/img/frames/planeswalker/transform/gfThumb.png new file mode 100644 index 00000000..f7d2aed1 Binary files /dev/null and b/img/frames/planeswalker/transform/gfThumb.png differ diff --git a/img/frames/planeswalker/transform/loyalty.png b/img/frames/planeswalker/transform/loyalty.png new file mode 100644 index 00000000..41d0e517 Binary files /dev/null and b/img/frames/planeswalker/transform/loyalty.png differ diff --git a/img/frames/planeswalker/transform/loyaltyThumb.png b/img/frames/planeswalker/transform/loyaltyThumb.png new file mode 100644 index 00000000..66dca424 Binary files /dev/null and b/img/frames/planeswalker/transform/loyaltyThumb.png differ diff --git a/img/frames/planeswalker/transform/mb.png b/img/frames/planeswalker/transform/mb.png new file mode 100644 index 00000000..bbf282ca Binary files /dev/null and b/img/frames/planeswalker/transform/mb.png differ diff --git a/img/frames/planeswalker/transform/mbThumb.png b/img/frames/planeswalker/transform/mbThumb.png new file mode 100644 index 00000000..a78cc4f5 Binary files /dev/null and b/img/frames/planeswalker/transform/mbThumb.png differ diff --git a/img/frames/planeswalker/transform/mf.png b/img/frames/planeswalker/transform/mf.png new file mode 100644 index 00000000..76013cc6 Binary files /dev/null and b/img/frames/planeswalker/transform/mf.png differ diff --git a/img/frames/planeswalker/transform/mfThumb.png b/img/frames/planeswalker/transform/mfThumb.png new file mode 100644 index 00000000..d728ed83 Binary files /dev/null and b/img/frames/planeswalker/transform/mfThumb.png differ diff --git a/img/frames/planeswalker/transform/pinline.svg b/img/frames/planeswalker/transform/pinline.svg new file mode 100644 index 00000000..630b5c4b --- /dev/null +++ b/img/frames/planeswalker/transform/pinline.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/img/frames/planeswalker/transform/pinlineFront.svg b/img/frames/planeswalker/transform/pinlineFront.svg new file mode 100644 index 00000000..3d38b0dc --- /dev/null +++ b/img/frames/planeswalker/transform/pinlineFront.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/img/frames/planeswalker/transform/pinlineFrontThumb.png b/img/frames/planeswalker/transform/pinlineFrontThumb.png new file mode 100644 index 00000000..5da0d2c8 Binary files /dev/null and b/img/frames/planeswalker/transform/pinlineFrontThumb.png differ diff --git a/img/frames/planeswalker/transform/pinlineThumb.png b/img/frames/planeswalker/transform/pinlineThumb.png new file mode 100644 index 00000000..6f4b2f6f Binary files /dev/null and b/img/frames/planeswalker/transform/pinlineThumb.png differ diff --git a/img/frames/planeswalker/transform/rb.png b/img/frames/planeswalker/transform/rb.png new file mode 100644 index 00000000..75088918 Binary files /dev/null and b/img/frames/planeswalker/transform/rb.png differ diff --git a/img/frames/planeswalker/transform/rbThumb.png b/img/frames/planeswalker/transform/rbThumb.png new file mode 100644 index 00000000..416f72b0 Binary files /dev/null and b/img/frames/planeswalker/transform/rbThumb.png differ diff --git a/img/frames/planeswalker/transform/rf.png b/img/frames/planeswalker/transform/rf.png new file mode 100644 index 00000000..c36601f8 Binary files /dev/null and b/img/frames/planeswalker/transform/rf.png differ diff --git a/img/frames/planeswalker/transform/rfThumb.png b/img/frames/planeswalker/transform/rfThumb.png new file mode 100644 index 00000000..c50e6337 Binary files /dev/null and b/img/frames/planeswalker/transform/rfThumb.png differ diff --git a/img/frames/planeswalker/transform/textFront.svg b/img/frames/planeswalker/transform/textFront.svg new file mode 100644 index 00000000..37862e1a --- /dev/null +++ b/img/frames/planeswalker/transform/textFront.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/img/frames/planeswalker/transform/title.svg b/img/frames/planeswalker/transform/title.svg new file mode 100644 index 00000000..fed42ad7 --- /dev/null +++ b/img/frames/planeswalker/transform/title.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/img/frames/planeswalker/transform/titleThumb.png b/img/frames/planeswalker/transform/titleThumb.png new file mode 100644 index 00000000..54a98204 Binary files /dev/null and b/img/frames/planeswalker/transform/titleThumb.png differ diff --git a/img/frames/planeswalker/transform/ub.png b/img/frames/planeswalker/transform/ub.png new file mode 100644 index 00000000..d66772c6 Binary files /dev/null and b/img/frames/planeswalker/transform/ub.png differ diff --git a/img/frames/planeswalker/transform/ubThumb.png b/img/frames/planeswalker/transform/ubThumb.png new file mode 100644 index 00000000..01d6b299 Binary files /dev/null and b/img/frames/planeswalker/transform/ubThumb.png differ diff --git a/img/frames/planeswalker/transform/uf.png b/img/frames/planeswalker/transform/uf.png new file mode 100644 index 00000000..f9292d94 Binary files /dev/null and b/img/frames/planeswalker/transform/uf.png differ diff --git a/img/frames/planeswalker/transform/ufThumb.png b/img/frames/planeswalker/transform/ufThumb.png new file mode 100644 index 00000000..242fb641 Binary files /dev/null and b/img/frames/planeswalker/transform/ufThumb.png differ diff --git a/img/frames/planeswalker/transform/wb.png b/img/frames/planeswalker/transform/wb.png new file mode 100644 index 00000000..766e0817 Binary files /dev/null and b/img/frames/planeswalker/transform/wb.png differ diff --git a/img/frames/planeswalker/transform/wbThumb.png b/img/frames/planeswalker/transform/wbThumb.png new file mode 100644 index 00000000..e967c26c Binary files /dev/null and b/img/frames/planeswalker/transform/wbThumb.png differ diff --git a/img/frames/planeswalker/transform/wf.png b/img/frames/planeswalker/transform/wf.png new file mode 100644 index 00000000..d27fe2ef Binary files /dev/null and b/img/frames/planeswalker/transform/wf.png differ diff --git a/img/frames/planeswalker/transform/wfThumb.png b/img/frames/planeswalker/transform/wfThumb.png new file mode 100644 index 00000000..ef46ccd8 Binary files /dev/null and b/img/frames/planeswalker/transform/wfThumb.png differ diff --git a/js/creator-23.js b/js/creator-23.js index c6559061..c1aeeda1 100644 --- a/js/creator-23.js +++ b/js/creator-23.js @@ -119,10 +119,10 @@ function sizeCanvas(name, width = Math.round(card.width * (1 + 2 * card.marginX) } window[name + 'Canvas'].width = width; window[name + 'Canvas'].height = height; - if (name == 'line') { //force true to view all canvases + if (name == 'line') { //force true to view all canvases - must restore to name == 'line' for proper kerning adjustments window[name + 'Canvas'].style = 'width: 20rem; height: 28rem; border: 1px solid red;'; const label = document.createElement('div'); - label.innerHTML = name + '
If you can see this and don\'t want to, please clear you cache.'; + label.innerHTML = name + '
If you can see this and don\'t want to, please clear your cache.'; label.appendChild(window[name + 'Canvas']); label.classList = 'fake-hidden'; //Comment this out to view canvases document.body.appendChild(label); @@ -1502,10 +1502,15 @@ function drawCard() { cardContext.drawImage(art, 0, 0, art.width * card.artZoom, art.height * card.artZoom); cardContext.restore(); // frame elements - cardContext.drawImage(frameCanvas, 0, 0, cardCanvas.width, cardCanvas.height); - if (card.version.includes('planeswalker') && typeof planeswalkerCanvas !== "undefined") { - cardContext.drawImage(planeswalkerCanvas, 0, 0, cardCanvas.width, cardCanvas.height); + if (card.version.includes('planeswalker') && typeof planeswalkerPreFrameCanvas !== "undefined") { + cardContext.drawImage(planeswalkerPreFrameCanvas, 0, 0, cardCanvas.width, cardCanvas.height); } + cardContext.drawImage(frameCanvas, 0, 0, cardCanvas.width, cardCanvas.height); + if (card.version.includes('planeswalker') && typeof planeswalkerPostFrameCanvas !== "undefined") { + cardContext.drawImage(planeswalkerPostFrameCanvas, 0, 0, cardCanvas.width, cardCanvas.height); + } else if (card.version.includes('planeswalker') && typeof planeswalkerCanvas !== "undefined") { + cardContext.drawImage(planeswalkerCanvas, 0, 0, cardCanvas.width, cardCanvas.height); + } // REMOVE/DELETE ME AFTER A FEW WEEKS // guidelines if (document.querySelector('#show-guidelines').checked) { cardContext.drawImage(guidelinesCanvas, scaleX(card.marginX) / 2, scaleY(card.marginY) / 2, cardCanvas.width, cardCanvas.height); diff --git a/js/frames/groupPlaneswalker.js b/js/frames/groupPlaneswalker.js index 9472a4ba..0060e1b1 100644 --- a/js/frames/groupPlaneswalker.js +++ b/js/frames/groupPlaneswalker.js @@ -1,11 +1,16 @@ loadFramePacks([ - {name:'Regular Frames', value:'PlaneswalkerRegular'}, - {name:'Borderless Frames', value:'PlaneswalkerBorderless'}, - {name:'Extended Art Frames', value:'PlaneswalkerBoxTopper'}, - {name:'Nickname Frames', value:'PlaneswalkerNickname'}, - {name:'Tall Frames', value:'PlaneswalkerTall'}, - {name:'MDFC Frames', value:'PlaneswalkerMDFC'}, + {name:'Regular', value:'PlaneswalkerRegular'}, + {name:'Borderless', value:'PlaneswalkerBorderless'}, + {name:'Extended Art', value:'PlaneswalkerBoxTopper'}, + {name:'Tall', value:'PlaneswalkerTall'}, {name:'Special Frames', value:'disabled'}, - {name:'Blackout (SDCC15)', value:'PlaneswalkerSDCC15'} + {name:'Nickname', value:'PlaneswalkerNickname'}, + {name:'Blackout (SDCC15)', value:'PlaneswalkerSDCC15'}, + {name:'DFC Frames', value:'disabled'}, + {name:'MDFC', value:'PlaneswalkerMDFC'}, + {name:'Transform (Front)', value:'PlaneswalkerTransformFront'}, + {name:'Transform (Back)', value:'PlaneswalkerTransformBack'}, + {name:'Color Identity Pips', value:'M15CIPips'}, + {name:'Transform Icons', value:'PlaneswalkerTransformIcons'} ]) -notify('When you load a Planeswalker frame version, a "Planeswalker" tab will appear. This tab controls the placement and loyalty costs for Planeswalker abilities.') \ No newline at end of file +notify('When you load a Planeswalker frame version, a "Planeswalker" tab will appear. This tab controls the placement and loyalty costs for Planeswalker abilities.', 10) \ No newline at end of file diff --git a/js/frames/packPlaneswalkerTransformBack.js b/js/frames/packPlaneswalkerTransformBack.js new file mode 100644 index 00000000..3dd70f20 --- /dev/null +++ b/js/frames/packPlaneswalkerTransformBack.js @@ -0,0 +1,45 @@ +//Create objects for common properties across available frames +var masks = [{src:'/img/frames/planeswalker/transform/pinline.svg', name:'Pinline'}, {src:'/img/frames/planeswalker/transform/title.svg', name:'Title'}, {src:'/img/frames/planeswalker/regular/planeswalkerMaskType.png', name:'Type'}, {src:'/img/frames/planeswalker/transform/frame.svg', name:'Frame'}, {src:'/img/frames/planeswalker/regular/planeswalkerMaskBorder.png', name:'Border'}]; +//defines available frames +availableFrames = [ + {name:'White Frame (Back)', src:'/img/frames/planeswalker/transform/wb.png', masks:masks}, + {name:'Blue Frame (Back)', src:'/img/frames/planeswalker/transform/ub.png', masks:masks}, + {name:'Black Frame (Back)', src:'/img/frames/planeswalker/transform/bb.png', masks:masks}, + {name:'Red Frame (Back)', src:'/img/frames/planeswalker/transform/rb.png', masks:masks}, + {name:'Green Frame (Back)', src:'/img/frames/planeswalker/transform/gb.png', masks:masks}, + {name:'Multicolored Frame (Back)', src:'/img/frames/planeswalker/transform/mb.png', masks:masks}, + {name:'Loyalty Box', src:'/img/frames/planeswalker/transform/loyalty.png', bounds:{x:0.8, y:0.8796, width:0.152, height:0.0677}} +]; +//disables/enables the "Load Frame Version" button +document.querySelector('#loadFrameVersion').disabled = false; +//defines process for loading this version, if applicable +document.querySelector('#loadFrameVersion').onclick = async function() { + //resets things so that every frame doesn't have to + await resetCardIrregularities(); + //sets card version + card.version = 'planeswalkerTransformBack'; + card.onload = '/js/frames/versionPlaneswalker.js'; + loadScript('/js/frames/versionPlaneswalker.js'); + //art bounds + card.artBounds = {x:0.068, y:0.101, width:0.864, height:0.8143}; + autoFitArt(); + //set symbol bounds + card.setSymbolBounds = {x:0.9227, y:0.5891, width:0.12, height:0.0381, vertical:'center', horizontal: 'right'}; + resetSetSymbol(); + //watermark bounds + card.watermarkBounds = {x:0.5, y:0.7762, width:0.75, height:0.2305}; + resetWatermark(); + //text + loadTextOptions({ + mana: {name:'Mana Cost', text:'', y:0.0481, width:0.9292, height:71/2100, oneLine:true, size:71/1638, align:'right', shadowX:-0.001, shadowY:0.0029, manaCost:true, manaSpacing:0}, + title: {name:'Title', text:'', x:0.16, y:0.0372, width:0.8292, height:0.0548, oneLine:true, font:'belerenb', size:0.0381, color:'white'}, + type: {name:'Type', text:'', x:0.1307, y:0.5625, width:0.7827, height:0.0548, oneLine:true, font:'belerenb', size:0.0324, color:'white'}, + ability0: {name:'Ability 1', text:'', x:0.18, y:0.6239, width:0.7467, height:0.0972, size:0.0353}, + ability1: {name:'Ability 2', text:'', x:0.18, y:0, width:0.7467, height:0.0972, size:0.0353}, + ability2: {name:'Ability 3', text:'', x:0.18, y:0, width:0.7467, height:0.0972, size:0.0353}, + ability3: {name:'Ability 4', text:'', x:0.18, y:0, width:0.7467, height:0, size:0.0353}, + loyalty: {name:'Loyalty', text:'', x:0.806, y:0.902, width:0.14, height:0.0372, size:0.0372, font:'belerenbsc', oneLine:true, align:'center', color:'white'} + }); +} +//loads available frames +loadFramePack(); \ No newline at end of file diff --git a/js/frames/packPlaneswalkerTransformFront.js b/js/frames/packPlaneswalkerTransformFront.js new file mode 100644 index 00000000..fc8ce253 --- /dev/null +++ b/js/frames/packPlaneswalkerTransformFront.js @@ -0,0 +1,44 @@ +//Create objects for common properties across available frames +var masks = [{src:'/img/frames/planeswalker/transform/pinlineFront.svg', name:'Pinline'}, {src:'/img/frames/planeswalker/transform/title.svg', name:'Title'}, {src:'/img/frames/planeswalker/regular/planeswalkerMaskType.png', name:'Type'}, {src:'/img/frames/planeswalker/transform/frameFront.svg', name:'Frame'}, {src:'/img/frames/planeswalker/regular/planeswalkerMaskBorder.png', name:'Border'}, {src:'/img/frames/planeswalker/maskLoyalty.png', name:'Loyalty'}]; +//defines available frames +availableFrames = [ + {name:'White Frame (Front)', src:'/img/frames/planeswalker/transform/wf.png', masks:masks}, + {name:'Blue Frame (Front)', src:'/img/frames/planeswalker/transform/uf.png', masks:masks}, + {name:'Black Frame (Front)', src:'/img/frames/planeswalker/transform/bf.png', masks:masks}, + {name:'Red Frame (Front)', src:'/img/frames/planeswalker/transform/rf.png', masks:masks}, + {name:'Green Frame (Front)', src:'/img/frames/planeswalker/transform/gf.png', masks:masks}, + {name:'Multicolored Frame (Front)', src:'/img/frames/planeswalker/transform/mf.png', masks:masks} +]; +//disables/enables the "Load Frame Version" button +document.querySelector('#loadFrameVersion').disabled = false; +//defines process for loading this version, if applicable +document.querySelector('#loadFrameVersion').onclick = async function() { + //resets things so that every frame doesn't have to + await resetCardIrregularities(); + //sets card version + card.version = 'planeswalkerTransformFront'; + card.onload = '/js/frames/versionPlaneswalker.js'; + loadScript('/js/frames/versionPlaneswalker.js'); + //art bounds + card.artBounds = {x:0.068, y:0.101, width:0.864, height:0.8143}; + autoFitArt(); + //set symbol bounds + card.setSymbolBounds = {x:0.9227, y:0.5891, width:0.12, height:0.0381, vertical:'center', horizontal: 'right'}; + resetSetSymbol(); + //watermark bounds + card.watermarkBounds = {x:0.5, y:0.7762, width:0.75, height:0.2305}; + resetWatermark(); + //text + loadTextOptions({ + mana: {name:'Mana Cost', text:'', y:0.0481, width:0.9292, height:71/2100, oneLine:true, size:71/1638, align:'right', shadowX:-0.001, shadowY:0.0029, manaCost:true, manaSpacing:0}, + title: {name:'Title', text:'', x:0.16, y:0.0372, width:0.8292, height:0.0548, oneLine:true, font:'belerenb', size:0.0381}, + type: {name:'Type', text:'', x:0.0867, y:0.5625, width:0.8267, height:0.0548, oneLine:true, font:'belerenb', size:0.0324}, + ability0: {name:'Ability 1', text:'', x:0.18, y:0.6239, width:0.7467, height:0.0972, size:0.0353}, + ability1: {name:'Ability 2', text:'', x:0.18, y:0, width:0.7467, height:0.0972, size:0.0353}, + ability2: {name:'Ability 3', text:'', x:0.18, y:0, width:0.7467, height:0.0972, size:0.0353}, + ability3: {name:'Ability 4', text:'', x:0.18, y:0, width:0.7467, height:0, size:0.0353}, + loyalty: {name:'Loyalty', text:'', x:0.806, y:0.902, width:0.14, height:0.0372, size:0.0372, font:'belerenbsc', oneLine:true, align:'center', color:'white'} + }); +} +//loads available frames +loadFramePack(); \ No newline at end of file diff --git a/js/frames/packPlaneswalkerTransformIcons.js b/js/frames/packPlaneswalkerTransformIcons.js new file mode 100644 index 00000000..37e29b9e --- /dev/null +++ b/js/frames/packPlaneswalkerTransformIcons.js @@ -0,0 +1,19 @@ +//Create objects for common properties across available frames +var bounds = {x:0.0594, y:0.0377, width:0.0734, height:0.0524}; +//defines available frames +availableFrames = [ + {name:'Sun', src:'/img/frames/m15/transform/icons/sun.svg', bounds:bounds}, + {name:'Crescent Moon', src:'/img/frames/m15/transform/icons/moon.svg', bounds:bounds}, + {name:'Full Moon', src:'/img/frames/m15/transform/icons/fullmoon.svg', bounds:bounds}, + {name:'Emrakul', src:'/img/frames/m15/transform/icons/emrakul.svg', bounds:bounds}, + {name:'Compass', src:'/img/frames/m15/transform/icons/compass.svg', bounds:bounds}, + {name:'Land', src:'/img/frames/m15/transform/icons/land.svg', bounds:bounds}, + {name:'Planeswalker Ember', src:'/img/frames/m15/transform/icons/spark.svg', bounds:bounds}, + {name:'Planeswalker Spark', src:'/img/frames/m15/transform/icons/planeswalker.svg', bounds:bounds} +]; +//disables/enables the "Load Frame Version" button +document.querySelector('#loadFrameVersion').disabled = true; +//defines process for loading this version, if applicable +document.querySelector('#loadFrameVersion').onclick = null; +//loads available frames +loadFramePack(); \ No newline at end of file diff --git a/js/frames/versionPlaneswalker.js b/js/frames/versionPlaneswalker.js index 71863e2e..fe07fcff 100644 --- a/js/frames/versionPlaneswalker.js +++ b/js/frames/versionPlaneswalker.js @@ -1,7 +1,8 @@ //checks to see if it needs to run if (!loadedVersions.includes('/js/frames/versionPlaneswalker.js')) { loadedVersions.push('/js/frames/versionPlaneswalker.js'); - sizeCanvas('planeswalker'); + sizeCanvas('planeswalkerPreFrame'); + sizeCanvas('planeswalkerPostFrame'); document.querySelector('#creator-menu-tabs').innerHTML += '

Planeswalker

'; var newHTML = document.createElement('div'); newHTML.id = 'creator-menu-planeswalker'; @@ -53,7 +54,7 @@ if (!loadedVersions.includes('/js/frames/versionPlaneswalker.js')) { setImageUrl(darkToLight, '/img/frames/planeswalker/abilityLineEven.png'); var planeswalkerTextMask = new Image(); planeswalkerTextMask.onload = function(){resetPlaneswalkerImages(fixPlaneswalkerInputs(planeswalkerEdited));} - setImageUrl(planeswalkerTextMask, '/img/frames/planeswalker/planeswalkerMaskText.png'); + setImageUrl(planeswalkerTextMask, '/img/frames/planeswalker/text.svg'); var lightColor = 'white'; var darkColor = '#a4a4a4'; } else { @@ -61,21 +62,30 @@ if (!loadedVersions.includes('/js/frames/versionPlaneswalker.js')) { } function planeswalkerEdited() { + // manage text masks var planeswalkerTall = 0; if (card.version == 'planeswalkerTall') { planeswalkerTall = 1; if (!planeswalkerTextMask.src.includes('tall')) { setImageUrl(planeswalkerTextMask, '/img/frames/planeswalker/tall/planeswalkerTallMaskRules.png'); } - } else if (card.version == 'planeswalkerMDFC') { - if (!planeswalkerTextMask.src.includes('mdfc')) { - setImageUrl(planeswalkerTextMask, '/img/frames/planeswalker/mdfc/text.svg'); + } else if (card.version == 'planeswalkerTransformFront') { + if (!planeswalkerTextMask.src.includes('transform/textFront')) { + setImageUrl(planeswalkerTextMask, '/img/frames/planeswalker/transform/textFront.svg'); } } else { - if (planeswalkerTextMask.src.includes('tall') || planeswalkerTextMask.src.includes('mdfc')) { - setImageUrl(planeswalkerTextMask, '/img/frames/planeswalker/planeswalkerMaskText.png'); + if (!planeswalkerTextMask.src.includes('planeswalker/text.svg')) { + setImageUrl(planeswalkerTextMask, '/img/frames/planeswalker/text.svg'); } } + // manage textbox size + if (card.version == 'planeswalkerTransformFront') { + card.planeswalker.x = 0.1167; + card.planeswalker.width = 0.8334; + } else { + card.planeswalker.x = 0.1167; + card.planeswalker.width = 0.8094; + } card.planeswalker.abilities[0] = document.querySelector('#planeswalker-cost-0').value; card.planeswalker.abilities[1] = document.querySelector('#planeswalker-cost-1').value; card.planeswalker.abilities[2] = document.querySelector('#planeswalker-cost-2').value; @@ -97,7 +107,9 @@ function planeswalkerEdited() { } fixPlaneswalkerInputs(); var transitionHeight = scaleHeight(0.0048); - planeswalkerContext.clearRect(0, 0, planeswalkerCanvas.width, planeswalkerCanvas.height); + planeswalkerPreFrameContext.clearRect(0, 0, planeswalkerPreFrameCanvas.width, planeswalkerPreFrameCanvas.height); + planeswalkerPreFrameContext.globalCompositeOperation = 'source-over'; + planeswalkerPostFrameContext.clearRect(0, 0, planeswalkerPostFrameCanvas.width, planeswalkerPostFrameCanvas.height); if (card.version != 'planeswalkerSDCC15') { for (var i = 0; i < card.planeswalker.count; i ++) { var x = scaleX(card.planeswalker.x); @@ -111,50 +123,50 @@ function planeswalkerEdited() { height += scaleHeight(0.5); } if (i % 2 == 0) { - planeswalkerContext.fillStyle = lightColor; - planeswalkerContext.globalAlpha = 0.608; - planeswalkerContext.fillRect(x, y + transitionHeight, width, height - 2 * transitionHeight); - planeswalkerContext.globalAlpha = 1; + planeswalkerPreFrameContext.fillStyle = lightColor; + planeswalkerPreFrameContext.globalAlpha = 0.608; + planeswalkerPreFrameContext.fillRect(x, y + transitionHeight, width, height - 2 * transitionHeight); + planeswalkerPreFrameContext.globalAlpha = 1; if (lightToDark.complete) { - planeswalkerContext.drawImage(lightToDark, x, y + height - transitionHeight, width, 2 * transitionHeight); + planeswalkerPreFrameContext.drawImage(lightToDark, x, y + height - transitionHeight, width, 2 * transitionHeight); } } else { - planeswalkerContext.fillStyle = darkColor; - planeswalkerContext.globalAlpha = 0.706; - planeswalkerContext.fillRect(x, y + transitionHeight, width, height - 2 * transitionHeight); - planeswalkerContext.globalAlpha = 1; + planeswalkerPreFrameContext.fillStyle = darkColor; + planeswalkerPreFrameContext.globalAlpha = 0.706; + planeswalkerPreFrameContext.fillRect(x, y + transitionHeight, width, height - 2 * transitionHeight); + planeswalkerPreFrameContext.globalAlpha = 1; if (darkToLight.complete) { - planeswalkerContext.drawImage(darkToLight, x, y + height - transitionHeight, width, 2 * transitionHeight); + planeswalkerPreFrameContext.drawImage(darkToLight, x, y + height - transitionHeight, width, 2 * transitionHeight); } } } } - planeswalkerContext.globalCompositeOperation = 'destination-in'; + planeswalkerPreFrameContext.globalCompositeOperation = 'destination-in'; if (planeswalkerTextMask.complete) { - planeswalkerContext.drawImage(planeswalkerTextMask, scaleX(0), scaleY(0), scaleWidth(1), scaleHeight(1)); + planeswalkerPreFrameContext.drawImage(planeswalkerTextMask, scaleX(0), scaleY(0), scaleWidth(1), scaleHeight(1)); } - planeswalkerContext.globalCompositeOperation = 'source-over'; - planeswalkerContext.fillStyle = 'white' - planeswalkerContext.font = scaleHeight(0.0286) + 'px belerenbsc'; - planeswalkerContext.textAlign = 'center'; + planeswalkerPostFrameContext.globalCompositeOperation = 'source-over'; + planeswalkerPostFrameContext.fillStyle = 'white' + planeswalkerPostFrameContext.font = scaleHeight(0.0286) + 'px belerenbsc'; + planeswalkerPostFrameContext.textAlign = 'center'; for (var i = 0; i < card.planeswalker.count; i ++) { var planeswalkerIconValue = card.planeswalker.abilities[i]; var planeswalkerPlacement = scaleY(planeswalkerAbilityLayout[planeswalkerTall][card.planeswalker.count - 1][i] + card.planeswalker.abilityAdjust[i]) if (planeswalkerIconValue.includes('+')) { if (plusIcon.complete) { - planeswalkerContext.drawImage(plusIcon, scaleX(0.0294), planeswalkerPlacement - scaleHeight(0.0258), scaleWidth(0.14), scaleHeight(0.0724)); + planeswalkerPostFrameContext.drawImage(plusIcon, scaleX(0.0294), planeswalkerPlacement - scaleHeight(0.0258), scaleWidth(0.14), scaleHeight(0.0724)); } - planeswalkerContext.fillText(planeswalkerIconValue, scaleX(0.1027), planeswalkerPlacement + scaleHeight(0.0172)); + planeswalkerPostFrameContext.fillText(planeswalkerIconValue, scaleX(0.1027), planeswalkerPlacement + scaleHeight(0.0172)); } else if (planeswalkerIconValue.includes('-')) { if (minusIcon.complete) { - planeswalkerContext.drawImage(minusIcon, scaleX(0.028), planeswalkerPlacement - scaleHeight(0.0153), scaleWidth(0.1414), scaleHeight(0.0705)); + planeswalkerPostFrameContext.drawImage(minusIcon, scaleX(0.028), planeswalkerPlacement - scaleHeight(0.0153), scaleWidth(0.1414), scaleHeight(0.0705)); } - planeswalkerContext.fillText(planeswalkerIconValue, scaleX(0.1027), planeswalkerPlacement + scaleHeight(0.0181)); + planeswalkerPostFrameContext.fillText(planeswalkerIconValue, scaleX(0.1027), planeswalkerPlacement + scaleHeight(0.0181)); } else if (planeswalkerIconValue != '') { if (neutralIcon.complete) { - planeswalkerContext.drawImage(neutralIcon, scaleX(0.028), planeswalkerPlacement - scaleHeight(0.0153), scaleWidth(0.1414), scaleHeight(0.061)); + planeswalkerPostFrameContext.drawImage(neutralIcon, scaleX(0.028), planeswalkerPlacement - scaleHeight(0.0153), scaleWidth(0.1414), scaleHeight(0.061)); } - planeswalkerContext.fillText(planeswalkerIconValue, scaleX(0.1027), planeswalkerPlacement + scaleHeight(0.0191)); + planeswalkerPostFrameContext.fillText(planeswalkerIconValue, scaleX(0.1027), planeswalkerPlacement + scaleHeight(0.0191)); } } drawTextBuffer();