From e729edd50900d6c052574d6fd0c900e4ae3faa03 Mon Sep 17 00:00:00 2001 From: Josh Birnholz Date: Fri, 25 Nov 2022 13:14:45 -0500 Subject: [PATCH] Initial autoframe support --- creator/index.html | 11 ++ js/creator-23.js | 264 +++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 275 insertions(+) diff --git a/creator/index.html b/creator/index.html index 0a5a58ee..48120e97 100644 --- a/creator/index.html +++ b/creator/index.html @@ -585,6 +585,11 @@ +
Enable automatically setting card frames
+
Save your current card
@@ -629,6 +634,12 @@
+
+
Auto-set frames
+
+ +
+

Download your card

Click here for an alternative download
diff --git a/js/creator-23.js b/js/creator-23.js index d7626daa..ef2f1eb5 100644 --- a/js/creator-23.js +++ b/js/creator-23.js @@ -503,6 +503,258 @@ function doubleClick(event, maskOrFrame) { } return null; } +function cardFrameProperties(colors, manaCost, typeLine, power) { + var colors = colors.map(color => color.toUpperCase()) + if ([ + ['U', 'W'], + ['B', 'W'], + ['R', 'B'], + ['G', 'B'], + ['B', 'U'], + ['R', 'U'], + ['G', 'R'], + ['W', 'R'], + ['W', 'G'], + ['U', 'G'] + ].map(arr => JSON.stringify(arr) === JSON.stringify(colors)).includes(true)) { + colors.reverse(); + } + + var land = 'L'; + + var landRight; + + var isHybrid = manaCost.includes('/'); + + var pinlineRules; + if (colors.length > 2) { + pinlineRules = 'M'; + } else if (colors.length != 0) { + pinlineRules = colors[0]; + } else if (typeLine.includes('Land')) { + pinlineRules = land; + } else { + pinlineRules = 'A'; + } + + var pinelineRulesRight; + if (typeLine.includes('Land')) { + pinelineRulesRight = landRight; + } else if (colors.length == 2) { + pinelineRulesRight = colors[1]; + } + + var typeTitle; + if (colors.length >= 2) { + if (colors.length > 2) { + typeTitle = 'M' + } else if (isHybrid) { + typeTitle = 'L'; + } else { + typeTitle = 'M'; + } + } else if (colors.length == 1) { + typeTitle = colors[0]; + } else if (typeLine.includes('Land')) { + typeTitle = land; + } else { + typeTitle = 'A'; + } + + var pt; + if (power) { + if (typeLine.includes('Vehicle')) { + pt = 'V'; + } else if (typeTitle == 'L') { + pt = 'C'; + } else { + pt = typeTitle; + } + } + + var frame; + if (typeLine.includes('Land')) { + frame = 'L'; + } else if (typeLine.includes('Vehicle')) { + frame = 'V'; + } else if (typeLine.includes('Artifact')) { + frame = 'A'; + } else if (colors.length > 2) { + frame = 'M'; + } else if (colors.length == 2) { + if (isHybrid) { + frame = colors[0]; + } else { + frame = 'M'; + } + } else if (colors.length == 1) { + frame = colors[0]; + } else { + frame = 'L'; + } + + var frameRight; + if (typeLine.includes('Land')) { + frameRight = landRight; + } else if (colors.length == 2 && isHybrid) { + frameRight = colors[1]; + } + + return { + 'land': land, + 'landRight': landRight, + 'pinlineRules': pinlineRules, + 'pinlineRulesRight': pinelineRulesRight, + 'typeTitle': typeTitle, + 'pt': pt, + 'frame': frame, + 'frameRight': frameRight, + } +} +function autoFrame(frame) { + var colors = [...new Set(card.text.mana.text.toUpperCase().split('').filter(char => ['W', 'U', 'B', 'R', 'G'].includes(char)))]; + + if (frame == 'M15') { + autoM15Frame(colors, card.text.mana.text, card.text.type.text, card.text.pt.text); + } +} +async function autoM15Frame(colors, mana_cost, type_line, power) { + var frames = card.frames.filter(frame => frame.name.includes('Extension')); + + //clear the draggable frames + card.frames = []; + document.querySelector('#frame-list').innerHTML = null; + + var properties = cardFrameProperties(colors, mana_cost, type_line, power); + + // Set frames + + if (type_line.includes('Legendary')) { + if (properties.pinlineRulesRight) { + frames.push(makeM15FrameByLetter(properties.pinlineRulesRight, 'Crown', true)); + } + frames.push(makeM15FrameByLetter(properties.pinlineRules, "Crown", false)); + frames.push(makeM15FrameByLetter(properties.pinlineRules, "Crown Border Cover", false)); + } + if (properties.pt) { + frames.push(makeM15FrameByLetter(properties.pt, 'PT', false)); + } + if (properties.pinlineRulesRight) { + frames.push(makeM15FrameByLetter(properties.pinlineRulesRight, 'Pinline', true)); + } + frames.push(makeM15FrameByLetter(properties.pinlineRules, 'Pinline', false)); + frames.push(makeM15FrameByLetter(properties.typeTitle, 'Type', false)); + frames.push(makeM15FrameByLetter(properties.typeTitle, 'Title', false)); + if (properties.pinlineRulesRight) { + frames.push(makeM15FrameByLetter(properties.pinlineRulesRight, 'Rules', true)); + } + frames.push(makeM15FrameByLetter(properties.pinlineRules, 'Rules', false)); + if (properties.frameRight) { + frames.push(makeM15FrameByLetter(properties.frameRight, 'Frame', true)); + } + frames.push(makeM15FrameByLetter(properties.frame, 'Frame', false)); + frames.push(makeM15FrameByLetter(properties.frame, 'Border', false)); + + if (card.text.pt && type_line.includes('Vehicle') && !card.text.pt.text.includes('fff')) { + card.text.pt.text = '{fontcolor#fff}' + card.text.pt.text; + } + + card.frames = frames; + card.frames.reverse(); + await card.frames.forEach(item => addFrame([], item)); + card.frames.reverse(); +} +function makeM15FrameByLetter(letter, mask = false, maskToRightHalf = false) { + letter = letter.toUpperCase(); + var frameNames = { + 'W': 'White', + 'U': 'Blue', + 'B': 'Black', + 'R': 'Red', + 'G': 'Green', + 'M': 'Multicolored', + 'A': 'Artifact', + 'L': 'Land', + 'C': 'Colorless', + 'V': 'Vehicle' + } + + var frameName = frameNames[letter]; + + if (mask == "Crown Border Cover") { + return { + 'name': 'Legend Crown Border Cover', + 'src': '/img/black.png', + 'masks': [], + 'bounds': { + 'height': 0.0177, + 'width': 0.9214, + 'x': 0.0394, + 'y': 0.0277 + } + } + } + + if (mask == "Crown") { + var frame = { + 'name': frameName + ' Legend Crown', + 'src': '/img/frames/m15/crowns/m15Crown' + letter + '.png', + 'masks': [], + 'bounds': { + 'height': 0.1667, + 'width': 0.9454, + 'x': 0.0274, + 'y': 0.0191 + } + } + if (maskToRightHalf) { + frame.masks.push({ + 'src': '/img/frames/maskRightHalf.png', + 'name': 'Right Half' + }); + } + return frame; + } + + if (mask == 'PT') { + return { + 'name': frameName + ' Power/Toughness', + 'src': '/img/frames/m15/regular/m15PT' + letter + '.png', + 'masks': [], + 'bounds': { + 'height': 0.0733, + 'width': 0.188, + 'x': 0.7573, + 'y': 0.8848 + } + } + } + + var frame = { + 'name': frameName + ' Frame', + 'src': '/img/frames/m15/regular/m15Frame' + letter + '.png', + } + + if (mask) { + frame.masks = [ + { + 'src': '/img/frames/m15/regular/m15Mask' + mask + '.png', + 'name': mask + } + ] + + if (maskToRightHalf) { + frame.masks.push({ + 'src': '/img/frames/maskRightHalf.png', + 'name': 'Right Half' + }); + } + } else { + frame.masks = []; + } + + return frame; +} async function addFrame(additionalMasks = [], loadingFrame = false) { var frameToAdd = JSON.parse(JSON.stringify(availableFrames[selectedFrameIndex])); var maskThumbnail = true; @@ -1740,6 +1992,9 @@ function toggleStarDot() { function enableImportCollectorInfo() { localStorage.setItem('enableImportCollectorInfo', document.querySelector('#enableImportCollectorInfo').checked); } +function enableAutoFrame() { + localStorage.setItem('enableAutoFrame', document.querySelector('#enableAutoFrame').checked); +} function removeDefaultCollector() { defaultCollector = {}; //{number: year, rarity:'P', setCode:'MTG', lang:'EN', starDot:false}; localStorage.removeItem('defaultCollector'); //localStorage.setItem('defaultCollector', JSON.stringify(defaultCollector)); @@ -1955,6 +2210,10 @@ function changeCardIndex() { if (!document.querySelector('#lockSetSymbolURL').checked) { fetchSetSymbol(); } + //autoframe + if (localStorage.getItem('enableAutoFrame') == 'true') { + autoM15Frame(cardToImport.colors, cardToImport.mana_cost, cardToImport.type_line, cardToImport.power); + } //font size Object.keys(card.text).forEach(key => { card.text[key].fontSize = 0; @@ -2348,6 +2607,11 @@ if (!localStorage.getItem('enableImportCollectorInfo')) { } else { document.querySelector('#enableImportCollectorInfo').checked = (localStorage.getItem('enableImportCollectorInfo') == 'true'); } +if (!localStorage.getItem('enableAutoFrame')) { + localStorage.setItem('enableAutoFrame', 'false'); +} else { + document.querySelector('#enableAutoFrame').checked = (localStorage.getItem('enableAutoFrame') == 'true'); +} // lock set symbol code (user defaults) if (!localStorage.getItem('lockSetSymbolCode')) {