diff --git a/data/images/imageCSV.csv b/data/images/imageCSV.csv index 9a706a75..c4f9b974 100644 --- a/data/images/imageCSV.csv +++ b/data/images/imageCSV.csv @@ -7,10 +7,59 @@ Green,m15GFull.png,Full-0-0-750-1050;Title-0-0-750-1050;Type-0-0-750-1050;Rules Multicolored,m15MFull.png,Full-0-0-750-1050;Title-0-0-750-1050;Type-0-0-750-1050;Rules Text-0-0-750-1050;Pinline-0-0-750-1050;Frame-0-0-750-1050 Artifact,m15AFull.png,Full-0-0-750-1050;Title-0-0-750-1050;Type-0-0-750-1050;Rules Text-0-0-750-1050;Pinline-0-0-750-1050;Frame-0-0-750-1050 Colorless,m15CFull.png,Full-0-0-750-1050;Title-0-0-750-1050;Type-0-0-750-1050;Rules Text-0-0-750-1050;Pinline-0-0-750-1050;Frame-0-0-750-1050 +Vehicle,m15VFull.png,Full-0-0-750-1050;Title-0-0-750-1050;Type-0-0-750-1050;Rules Text-0-0-750-1050;Pinline-0-0-750-1050;Frame-0-0-750-1050 White Land,m15WLFull.png,Full-0-0-750-1050;Title-0-0-750-1050;Type-0-0-750-1050;Rules Text-0-0-750-1050;Pinline-0-0-750-1050;Frame-0-0-750-1050 Blue Land,m15ULFull.png,Full-0-0-750-1050;Title-0-0-750-1050;Type-0-0-750-1050;Rules Text-0-0-750-1050;Pinline-0-0-750-1050;Frame-0-0-750-1050 Black Land,m15BLFull.png,Full-0-0-750-1050;Title-0-0-750-1050;Type-0-0-750-1050;Rules Text-0-0-750-1050;Pinline-0-0-750-1050;Frame-0-0-750-1050 Red Land,m15RLFull.png,Full-0-0-750-1050;Title-0-0-750-1050;Type-0-0-750-1050;Rules Text-0-0-750-1050;Pinline-0-0-750-1050;Frame-0-0-750-1050 Green Land,m15GLFull.png,Full-0-0-750-1050;Title-0-0-750-1050;Type-0-0-750-1050;Rules Text-0-0-750-1050;Pinline-0-0-750-1050;Frame-0-0-750-1050 Multicolored Land,m15MLFull.png,Full-0-0-750-1050;Title-0-0-750-1050;Type-0-0-750-1050;Rules Text-0-0-750-1050;Pinline-0-0-750-1050;Frame-0-0-750-1050 -Colorless Land,m15CLFull.png,Full-0-0-750-1050;Title-0-0-750-1050;Type-0-0-750-1050;Rules Text-0-0-750-1050;Pinline-0-0-750-1050;Frame-0-0-750-1050 \ No newline at end of file +Colorless Land,m15CLFull.png,Full-0-0-750-1050;Title-0-0-750-1050;Type-0-0-750-1050;Rules Text-0-0-750-1050;Pinline-0-0-750-1050;Frame-0-0-750-1050 +White,m15WPT.png,Full-570-934-137-77 +Blue,m15UPT.png,Full-570-934-137-77 +Black,m15BPT.png,Full-570-934-137-77 +Red,m15RPT.png,Full-570-934-137-77 +Green,m15GPT.png,Full-570-934-137-77 +Multicolored,m15MPT.png,Full-570-934-137-77 +Artifact,m15APT.png,Full-570-934-137-77 +Colorless,m15CPT.png,Full-570-934-137-77 +Vehicle,m15VPT.png,Full-570-934-137-77 +White,m15WLegendary.png,Full-20-20-714-186 +Blue,m15ULegendary.png,Full-20-20-714-186 +Black,m15BLegendary.png,Full-20-20-714-186 +Red,m15RLegendary.png,Full-20-20-714-186 +Green,m15GLegendary.png,Full-20-20-714-186 +Multicolored,m15MLegendary.png,Full-20-20-714-186 +Artifact,m15ALegendary.png,Full-20-20-714-186 +Colorless,m15CLegendary.png,Full-20-20-714-186 +White,m15WRareStamp.png,Full-329-949-90-50 +Blue,m15URareStamp.png,Full-329-949-90-50 +Black,m15BRareStamp.png,Full-329-949-90-50 +Red,m15RRareStamp.png,Full-329-949-90-50 +Green,m15GRareStamp.png,Full-329-949-90-50 +Multicolored,m15MRareStamp.png,Full-329-949-90-50 +Artifact,m15ARareStamp.png,Full-329-949-90-50 +Colorless,m15CRareStamp.png,Full-329-949-90-50 +White,m15WMiracle.png,Full-30-30-690-511 +Blue,m15UMiracle.png,Full-30-30-690-511 +Black,m15BMiracle.png,Full-30-30-690-511 +Red,m15RMiracle.png,Full-30-30-690-511 +Green,m15GMiracle.png,Full-30-30-690-511 +Multicolored,m15MMiracle.png,Full-30-30-690-511 +Artifact,m15AMiracle.png,Full-30-30-690-511 +Colorless,m15CMiracle.png,Full-30-30-690-511 +White,m15WNyx.png,Full-30-30-690-586 +Blue,m15UNyx.png,Full-30-30-690-586 +Black,m15BNyx.png,Full-30-30-690-586 +Red,m15RNyx.png,Full-30-30-690-586 +Green,m15GNyx.png,Full-30-30-690-586 +Multicolored,m15MNyx.png,Full-30-30-690-586 +Artifact,m15ANyx.png,Full-30-30-690-586 +Colorless,m15CNyx.png,Full-30-30-690-586 +White Land,m15WLNyx.png,Full-30-30-690-586 +Blue Land,m15ULNyx.png,Full-30-30-690-586 +Black Land,m15BLNyx.png,Full-30-30-690-586 +Red Land,m15RLNyx.png,Full-30-30-690-586 +Green Land,m15GLNyx.png,Full-30-30-690-586 +Multicolored Land,m15MLNyx.png,Full-30-30-690-586 +Colorless Land,m15CLNyx.png,Full-30-30-690-586 \ No newline at end of file diff --git a/data/scripts/main.js b/data/scripts/main.js index 6431ac0a..537de87a 100644 --- a/data/scripts/main.js +++ b/data/scripts/main.js @@ -16,7 +16,7 @@ function initiate() { window.cardWidth = 750; window.cardHeight = 1050; window.frameList = new Array(); - window.maskNameList = ["Right Half", "Full", "Title", "Type", "Rules Text", "Pinline", "Frame"]; + window.maskNameList = ["Right Half", "Full", "Title", "Type", "Rules Text", "Pinline", "Frame", "Border"]; window.maskList = []; window.selectedFrame = -1; window.selectedMask = ""; @@ -88,12 +88,8 @@ class frameImage { this.heightList[i] = scale(parseInt(splitIndividualMasks[4])); } } - cardMasterElement(targetMask, right) { - var extraMask = "" - if (right) { - extraMask = " - Right" - } - return "
" + this.displayName + " (" + targetMask + extraMask + ")x
"; + cardMasterElement(targetMask) { + return "
" + this.displayName + " (" + targetMask + ")x
"; } framePickerElement(targetElement) { return "
"; @@ -138,10 +134,10 @@ function maskOptionClicked(event) { clickedElement.classList.add("maskOptionSelected"); selectedMask = clickedElement.id.replace("maskName", ""); } -function addFrameToCardMaster(right = false) { +function addFrameToCardMaster(right = "") { //Takes the stored selectedFrame and selectedMask to add the frame w/ mask to the card master! if (selectedFrame > -1 && selectedMask != "") { - cardMaster.innerHTML = frameList[selectedFrame].cardMasterElement(selectedMask, right) + cardMaster.innerHTML; + cardMaster.innerHTML = frameList[selectedFrame].cardMasterElement(selectedMask + right) + cardMaster.innerHTML; cardMasterUpdated(); } } diff --git a/data/scripts/sortable.js b/data/scripts/sortable.js index c9929e2a..192a3659 100644 --- a/data/scripts/sortable.js +++ b/data/scripts/sortable.js @@ -2155,6 +2155,9 @@ Sortable.prototype = if (moved && !awaitingDragStarted) { toggleClass(dragEl, putSortable ? putSortable.options.ghostClass : this.options.ghostClass, false); + //code added by me (Kyle) starts here! + cardMasterUpdated() + //code added by me (Kyle) ends here! } toggleClass(dragEl, this.options.chosenClass, false); // Drag stop event diff --git a/data/site/newStyles.css b/data/site/newStyles.css index 0e4e8994..963f5cf3 100644 --- a/data/site/newStyles.css +++ b/data/site/newStyles.css @@ -194,7 +194,7 @@ footer a:hover { /*Controls the area taken by the canvas*/ -@media screen and (min-width: 888pt) { +@media screen and (min-width: 905pt) { /*Makes room for the canvas and controls to be side by side*/ .mainGrid { padding: 1.5em; @@ -266,9 +266,17 @@ footer a:hover { background-color: var(--clear-light); border: 1px solid var(--light-color); border-radius: 0.25em; - padding: 0.25em; + padding: 0.5em; margin-top: 0.25em; } +.cardMasterElement img { + max-height: 2em; + position: absolute; + transform: translate(1em, -0.35em); +} +.cardmasterElement img.cardMasterElementMaskImage { + transform: translate(3em, -0.35em); +} .cardMasterElementMoving { background-color: var(--clear-dark); } @@ -283,10 +291,16 @@ footer a:hover { - +#framePicker, #maskPicker { + max-height: 260pt; + overflow-y: auto; + overflow-x: hidden; + border: 1px solid var(--light-color); +} .frameOption { height: 4em; text-align: center; + width: 100%; } .frameOption img { max-width: 4em; @@ -303,9 +317,9 @@ footer a:hover { background-color: var(--clear-light); border: 1px solid var(--light-color); border-radius: 0.25em; - width: 100%; } .maskOption { margin-left: 0.5em; padding: 0.125em; + width: calc(100% - 1.4em); } diff --git a/test.html b/test.html index 5586476d..9b4ad23b 100644 --- a/test.html +++ b/test.html @@ -28,8 +28,8 @@
- -
+ +
oh cool some text! @@ -59,9 +59,9 @@
Want More Customization?
-
+
This version of the website is currently a work in progress, so it doesn't have all the features the original Card Conjurer had. If you'd like to go back to the old version, click here.