silver borders

creator/index.php

@@ -86,16 +86,16 @@ include('../globalHTML/header-1.php');
 							<div class='input-grid margin-bottom'>
 								<select id='selectFrameGroup' onchange='loadScript("/js/frames/group" + this.value + ".js")' class='input'>
 									<option disabled>Standard Frames</option>
-									<option value='Standard-2'>Regular</option>
+									<option value='Standard-3'>Regular</option>
-									<option value='Token-1'>Tokens</option>
+									<option value='Token-2'>Tokens</option>
-									<option value='Saga'>Sagas</option>
+									<option value='Saga-1'>Sagas</option>
 									<option value='Planeswalker'>Planeswalkers</option>
 									<option value='DFC'>Transform</option>
 									<option disabled>Special Frames</option>
-									<option value='Showcase-2'>Showcase Frames</option>
+									<option value='Showcase-3'>Showcase Frames</option>
-									<option value='Promo'>Promos (Tall Art)</option>
+									<option value='Promo-1'>Promos (Tall Art)</option>
-									<option value='Textless-2'>Textless/Fullart</option>
+									<option value='Textless-3'>Textless/Fullart</option>
-									<option value='Modal'>Short Modal DFC's</option>
+									<option value='Modal-1'>Short Modal DFC's</option>
 									<option disabled>Other Frames</option>
 									<option value='Custom'>Custom</option>
 									<option value='Misc-1'>Old/Misc</option>
@@ -420,5 +420,5 @@ include('../globalHTML/header-1.php');
 			</h4>
 		</div>
 	</div>
-	<script defer src='/js/creator-8.js'></script>
+	<script defer src='/js/creator-9.js'></script>
 <?php include('../globalHTML/footer.php'); ?>

js/creator-9.js

@@ -331,8 +331,11 @@ function frameOptionClicked(event) {
 	}
 	clickedFrameOption.classList.add('selected');
 	selectedFrameIndex = getElementIndex(clickedFrameOption);
-	document.querySelector('#mask-picker').innerHTML = '<div class="mask-option selected" onclick="maskOptionClicked(event)"><img src="' + black.src + '"><p>No Mask</p></div>';
+	if (!availableFrames[selectedFrameIndex].noDefaultMask) {
-	selectedMaskIndex = 0;
+		document.querySelector('#mask-picker').innerHTML = '<div class="mask-option" onclick="maskOptionClicked(event)"><img src="' + black.src + '"><p>No Mask</p></div>';
+	} else {
+		document.querySelector('#mask-picker').innerHTML = '';
+	}
 	document.querySelector('#selectedPreview').innerHTML = '(Selected: ' + availableFrames[selectedFrameIndex].name + ', No Mask)';
 	if (availableFrames[selectedFrameIndex].masks) {
 		availableFrames[selectedFrameIndex].masks.forEach(item => {
@@ -351,10 +354,13 @@ function frameOptionClicked(event) {
 			document.querySelector('#mask-picker').appendChild(maskOption);
 		});
 	}
+	var firstChild = document.querySelector('#mask-picker').firstChild;
+	firstChild.classList.add('selected');
+	firstChild.click();
 }
 function maskOptionClicked(event) {
 	var clickedMaskOption = event.target.closest('.mask-option');
-	document.querySelector('.mask-option.selected').classList.remove('selected');
+	(document.querySelector('.mask-option.selected').classList || document.querySelector('body').classList).remove('selected');
 	clickedMaskOption.classList.add('selected');
 	selectedMaskIndex = getElementIndex(clickedMaskOption);
 	var selectedMaskName = 'No Mask'
@@ -365,8 +371,10 @@ function addFrame(additionalMasks = [], loadingFrame = false) {
 	var frameToAdd = JSON.parse(JSON.stringify(availableFrames[selectedFrameIndex]));
 	var maskThumbnail = true;
 	if (!loadingFrame) {
-		if (frameToAdd.masks && selectedMaskIndex > 0) {
+		var noDefaultMask = 0;
-			frameToAdd.masks = frameToAdd.masks.slice(selectedMaskIndex - 1, selectedMaskIndex);
+		if (frameToAdd.noDefaultMask) {noDefaultMask = 1;}
+		if (frameToAdd.masks && selectedMaskIndex + noDefaultMask > 0) {
+			frameToAdd.masks = frameToAdd.masks.slice(selectedMaskIndex - 1 + noDefaultMask, selectedMaskIndex + noDefaultMask);
 		} else {
 		 	frameToAdd.masks = [];
 		 	maskThumbnail = false;
@@ -1398,5 +1406,5 @@ if (!localStorage.getItem('autoLoadFrameVersion')) {
 }
 document.querySelector('#autoLoadFrameVersion').checked = 'true' == localStorage.getItem('autoLoadFrameVersion');
 document.querySelector('#info-number').value = date.getFullYear();
-loadScript('/js/frames/groupStandard-2.js');
+loadScript('/js/frames/groupStandard-3.js');
 loadAvailableCards();

js/frames/groupModal-1.js

@@ -6,5 +6,6 @@ loadFramePacks([
 	{name:'Floating Legend Crowns', value:'M15LegendCrownsFloating'},
 	{name:'Inner Crowns', value:'M15InnerCrowns'},
 	{name:'Holo Stamps', value:'M15HoloStamps'},
-	{name:'Dark Power/Toughness', value:'M15DarkPT'}
+	{name:'Dark Power/Toughness', value:'M15DarkPT'},
+	{name:'Colored Borders', value:'M15Borders'}
 ])

js/frames/groupPromo-1.js

@@ -6,5 +6,6 @@ loadFramePacks([
 	{name:'Floating Legend Crowns', value:'M15LegendCrownsFloating'},
 	{name:'Inner Crowns', value:'M15InnerCrowns'},
 	{name:'Holo Stamps', value:'M15HoloStamps'},
-	{name:'Dark Power/Toughness', value:'M15DarkPT'}
+	{name:'Dark Power/Toughness', value:'M15DarkPT'},
+	{name:'Colored Borders', value:'M15Borders'}
 ])

js/frames/groupSaga-1.js

@@ -3,6 +3,7 @@ loadFramePacks([
 	{name:'Addons', value:'disabled'},
 	{name:'Legend Crowns', value:'M15LegendCrowns'},
 	{name:'Inner Crowns', value:'M15InnerCrowns'},
-	{name:'Holo Stamps', value:'M15HoloStamps'}
+	{name:'Holo Stamps', value:'M15HoloStamps'},
+	{name:'Colored Borders', value:'M15Borders'}
 ])
 notify('When you load the Saga frame version, a "Saga" tab will appear. This tab controls the placement and chapter counts for Saga chapters.')

js/frames/groupShowcase-3.js

@@ -19,5 +19,6 @@ loadFramePacks([
 	{name:'Floating Legend Crowns', value:'M15LegendCrownsFloating'},
 	{name:'Inner Crowns', value:'M15InnerCrowns'},
 	{name:'Holo Stamps', value:'M15HoloStamps'},
-	{name:'Dark Power/Toughness', value:'M15DarkPT'}
+	{name:'Dark Power/Toughness', value:'M15DarkPT'},
+	{name:'Colored Borders', value:'M15Borders'}
 ])

js/frames/groupStandard-3.js

@@ -6,6 +6,7 @@ loadFramePacks([
 	{name:'Inner Crowns', value:'M15InnerCrowns'},
 	{name:'Holo Stamps', value:'M15HoloStamps'},
 	{name:'Dark Power/Toughness', value:'M15DarkPT'},
+	{name:'Colored Borders', value:'M15Borders'},
 	{name:'Other Frames', value:'disabled'},
 	{name:'Lands', value:'M15Lands'},
 	{name:'Snow', value:'M15Snow'},

js/frames/groupTextless-3.js

@@ -10,5 +10,6 @@ loadFramePacks([
 	{name:'Floating Legend Crowns', value:'M15LegendCrownsFloating'},
 	{name:'Inner Crowns', value:'M15InnerCrowns'},
 	{name:'Holo Stamps', value:'M15HoloStamps'},
-	{name:'Dark Power/Toughness', value:'M15DarkPT'}
+	{name:'Dark Power/Toughness', value:'M15DarkPT'},
+	{name:'Colored Borders', value:'M15Borders'}
 ])

js/frames/groupToken-2.js

@@ -6,5 +6,6 @@ loadFramePacks([
 	{name:'Floating Legend Crowns', value:'M15LegendCrownsFloating'},
 	{name:'Inner Crowns', value:'M15InnerCrowns'},
 	{name:'Holo Stamps', value:'M15HoloStamps'},
-	{name:'Dark Power/Toughness', value:'M15DarkPT'}
+	{name:'Dark Power/Toughness', value:'M15DarkPT'},
+	{name:'Colored Borders', value:'M15Borders'}
 ])

js/frames/packM15Borders.js

@@ -0,0 +1,14 @@
+//Create objects for common properties across available frames
+var masks = [{src:'/img/frames/m15/m15MaskBorderSliver.png', name:'Border'}, {src:'/img/frames/m15/m15MaskBorderSliverCrown.png', name:'Border (With Crown)'}];
+//defines available frames
+availableFrames = [
+	{name:'White Border', src:'/img/frames/white.png', masks:masks, noDefaultMask:true},
+	{name:'White Border', src:'/img/frames/silver.png', masks:masks, noDefaultMask:true},
+	{name:'White Border', src:'/img/frames/gold.png', masks:masks, noDefaultMask:true},
+];
+//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();