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

transform planeswalkers

Browse Source
This commit is contained in:
Kyle
2021-09-04 11:56:01 -07:00
parent 8968e5d259
commit 89ce0a127e
46 changed files with 208 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
js/creator-23.js
View File

@@ -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 + '<br>If you can see this and don\'t want to, please clear you cache.';
label.innerHTML = name + '<br>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);

21
js/frames/groupPlaneswalker.js
View File

@@ -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.')
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)

45
js/frames/packPlaneswalkerTransformBack.js Normal file
View File

@@ -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();

44
js/frames/packPlaneswalkerTransformFront.js Normal file
View File

@@ -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();

19
js/frames/packPlaneswalkerTransformIcons.js Normal file
View File

@@ -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();

72
js/frames/versionPlaneswalker.js
View File

@@ -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 += '<h3 class="selectable readable-background" onclick="toggleCreatorTabs(event, `planeswalker`)">Planeswalker</h3>';
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();