Skip to content

Instantly share code, notes, and snippets.

@ihaveamac

ihaveamac/cover-maker.php

Last active December 16, 2015 22:36
Show Gist options
  • Save ihaveamac/b2229c8feb513476e745 to your computer and use it in GitHub Desktop.
Save ihaveamac/b2229c8feb513476e745 to your computer and use it in GitHub Desktop.
Download ZIP
3DSflow Banners site - cover maker by @gocario - https://ianburgwin.net/3dsflow/ (OUTDATED - see https://github.com/ihaveamac/3DSFlow-downloader)
Raw
cover-maker.php
<div>
<canvas id="canvasPreview" width="400px" height="222px">No canvas? That's sad...</canvas>
<p>Please, right click on the preview to download it.</p>
</div>
<div>
<div>
<select id="templateType" name="templateType">
<option value selected disabled>Select a cover!</option>
<optgroup label="Nintendo 3DS Games">
<option value="template-basic-banner-fullscreen.png">Generic</option>
<option value="template-new-banner-fullscreen.png" data-offset-x="10" data-offset-y="10" disabled>Generic New (Not available yet)</option>
<option value="template-nnetwork-banner-fullscreen.png">Nintendo Network</option>
<option value="template-amiibo-banner-fullscreen.png">amiibo</option>
<option value="template-eshop-banner-fullscreen.png">Nintendo eShop</option>
</optgroup>
<optgroup label="Virtual Console">
<option value="template-VC-generic-banner-fullscreen.png">Generic/Other</option>
<option value="template-VC-GB-banner-fullscreen.png">Game Boy &amp; Game Boy Color</option>
<option value="template-VC-GBA-banner-fullscreen.png">Game Boy Advance</option>
<option value="template-VC-NES-banner-fullscreen.png">Nintendo Entertainment System</option>
<option value="template-VC-SNES-banner-fullscreen.png">Super NES</option>
<option value="template-VC-GG-banner-fullscreen.png">Game Gear</option>
</optgroup>
<optgroup label="Other">
<option value="template-system-banner-fullscreen.png">System</option>
<option value="template-hb-banner-fullscreen.png">Homebrew</option>
</optgroup>
</select>
<input type="button" id="coverGame" name="coverGame" value="Load a cover">
<input type="button" id="importCoverGame" name="importCoverGame" value="Import a cover">
<!-- TODO: The template selector of the import -->
</div>
<div>
<label><input type="checkbox" id="demoCheck" name="demoCheck">&nbsp;Add the demo logo</label>
</div>
<div class="hidden">
<!-- To load images -->
<img id="templatePreview" alt="templatePreview">
<img id="coverPreview" alt="coverPreview">
<img id="demoPreview" alt="demoPreview">
<img id="importCoverPreview" alt="importCoverPreview">
<form id="fileForm">
<input type="file" id="fileLoad">
</form>
</div>
</div>
<script type="text/javascript">
function el(e){return document.getElementById(e);}
function addEvent(e,ev,f){if(e.addEventListener){e.addEventListener(ev,f,false);return true;}else if(e.attachEvent)e.attachEvent('on'+ev,f);}
addEvent(window, 'load', function() {
var $canvas = el('canvasPreview');
var ctx = $canvas.getContext("2d");
/** Hidden previews **/
var $templatePreview = el('templatePreview');
var $coverPreview = el('coverPreview');
var $importCoverPreview = el('importCoverPreview');
var $demoPreview = el('demoPreview');
var COVER_DEFAULT_X = 94, COVER_DEFAULT_Y = 9, COVER_SIZE = 186;
var coverX = COVER_DEFAULT_X, coverY = COVER_DEFAULT_Y;
var demoX = COVER_DEFAULT_X, demoY = COVER_DEFAULT_Y;
var importCover = false;
var updatePreview = function() {
ctx.clearRect(0, 0, $canvas.width, $canvas.height);
ctx.drawImage($templatePreview, 0, 0);
if (importCover) ctx.drawImage($importCoverPreview, coverX, coverY, COVER_SIZE, COVER_SIZE, COVER_DEFAULT_X, COVER_DEFAULT_Y, COVER_SIZE, COVER_SIZE);
else ctx.drawImage($coverPreview, coverX, coverY, COVER_SIZE, COVER_SIZE);
if ($demoCheck.checked)ctx.drawImage($demoPreview, demoX, demoY);
};
addEvent($templatePreview, 'load', updatePreview);
addEvent($coverPreview, 'load', updatePreview);
addEvent($importCoverPreview, 'load', updatePreview);
addEvent($demoPreview, 'load', updatePreview);
/*********************/
/** Select changes (Template) **/
var $templateType = el('templateType');
var templateFolder = "banners/Templates/"; //"//ianburgwin.net/3dsflow/banners/Templates/";
var updateTemplatePreview = function() {
$templatePreview.src = templateFolder + $templateType.value;
coverX = (parseInt($templateType.selectedOptions[0].dataset.offsetX) || COVER_DEFAULT_X);
coverY = (parseInt($templateType.selectedOptions[0].dataset.offsetY) || COVER_DEFAULT_Y);
};
addEvent($templateType, 'change', updateTemplatePreview);
// updateTemplatePreview();
/*******************************/
/** File changes (Cover) **/
var $coverGame = el('coverGame');
var $importCoverGame = el('importCoverGame');
addEvent($coverGame, 'click', function() {
importCover = false;
el('fileLoad').click();
});
addEvent($importCoverGame, 'click', function() {
importCover = true;
el('fileLoad').click();
});
addEvent(el('fileLoad'), 'change', function() {
tempImageReader.readAsDataURL(this.files[0]);
el('fileForm').reset();
});
var tempImageReader = new FileReader();
addEvent(tempImageReader, 'load', function() {
if (importCover) $importCoverPreview.src = tempImageReader.result;
else $coverPreview.src = tempImageReader.result;
});
/**************************/
/** Demo **/
var $demoCheck = el('demoCheck');
$demoPreview.src = templateFolder + "!template-demo-logo.png";
addEvent($demoCheck, 'change', updatePreview);
/**********/
});
</script>
Raw
index.php
<?php
// most of this is probably a bad idea but it works so shut up unless you can make it better :)
if(!isset($_SERVER['HTTPS']) || $_SERVER['HTTPS'] == ""){
$redirect = "https://".$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI'];
header("HTTP/1.1 301 Moved Permanently");
header("Location: $redirect");
die;
}
$types = array("USA", "EUR", "GER", "AUS", "JPN", "Homebrew", "Custom", "Templates", "Make");
if (isset($_GET["type"])) {
if (!in_array($_GET["type"], $types)) {
header("Location: https://".$_SERVER['HTTP_HOST']."/3dsflow/");
die;
}
$is_region = $_GET["type"] == "USA" || $_GET["type"] == "EUR" || $_GET["type"] == "GER" || $_GET["type"] == "AUS" || $_GET["type"] == "JPN";
}
function listImages($dir) {
$files = scandir($dir);
foreach ($files as $file) {
if ($file[0] != "." && $file[0] != "!" && $file != "header.php") {
echo '<div class="banner-img col-xs-12 col-sm-4 col-md-3 col-lg-3"><div><a href="'.$dir.'/'.$file.'"><img src="'.$dir.'/'.$file.'"></a></div></div>'."\n";
}
}
}
?>
<!DOCTYPE html>
<html>
<head>
<title>3DSFlow Banners<?php echo ((isset($_GET["type"])) ? " - ".$_GET["type"] : " for the Grid Launcher"); ?></title>
<link href='https://fonts.googleapis.com/css?family=Ubuntu:400,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
font-family: 'Ubuntu', sans-serif;
/*text-align: center;*/
}
#types {
font-size: 20px;
}
.banner-img div {
display: inline-block;
width: 246px;
height: 216px;
overflow: hidden;
margin: 0 -10px -10px -10px;
}
.banner-img div img {
position: relative;
left: -77px;
}
.navbar {
border-radius: 0 0 4px 4px;
border-top: 0;
}
</style>
</head>
<body>
<div class="container">
<div class="navbar navbar-inverse" role="navigation">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/3dsflow/">3DSFlow Banners</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li<?php if ($_GET["type"] == "USA") echo ' class="active"'; ?>><a href="?type=USA">USA</a></li>
<li<?php if ($_GET["type"] == "EUR") echo ' class="active"'; ?>><a href="?type=EUR">EUR</a></li>
<li<?php if ($_GET["type"] == "GER") echo ' class="active"'; ?>><a href="?type=GER">GER</a></li>
<li<?php if ($_GET["type"] == "AUS") echo ' class="active"'; ?>><a href="?type=AUS">AUS</a></li>
<li<?php if ($_GET["type"] == "JPN") echo ' class="active"'; ?>><a href="?type=JPN">JPN</a></li>
<li<?php if ($_GET["type"] == "Homebrew") echo ' class="active"'; ?>><a href="?type=Homebrew">Homebrew</a></li>
<li<?php if ($_GET["type"] == "Custom") echo ' class="active"'; ?>><a href="?type=Custom">Custom</a></li>
<li<?php if ($_GET["type"] == "Templates") echo ' class="active"'; ?>><a href="?type=Templates">Templates</a></li>
<li<?php if ($_GET["type"] == "Make") echo ' class="active"'; ?>><a href="?type=Make">Make your own!</a></li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</div>
<p><a href="https://github.com/mashers/3ds_hb_menu/wiki/Banners">How to use Banners</a> &mdash; Click an image to download it!</p>
<div id="banners">
<?php
if (isset($_GET["type"])) {
if (file_exists("banners/".$_GET["type"]."/header.php")) {
include("banners/".$_GET["type"]."/header.php");
}
echo "<hr>";
if ($is_region) {
echo "<div class=\"container\"><h2>Retail</h2>";
listImages("banners/".$_GET["type"]."/retail");
echo "</div><div class=\"container\"><h2>Nintendo eShop</h2>";
listImages("banners/".$_GET["type"]."/eshop");
echo "</div><div class=\"container\"><h2>Virtual Console</h2>";
listImages("banners/".$_GET["type"]."/vc");
echo "</div>";
} elseif ($_GET["type"] == "Homebrew") {
echo "<div class=\"container\"><h2>General</h2>";
listImages("banners/".$_GET["type"]."/general");
echo "</div><div class=\"container\"><h2>Emulators</h2>";
listImages("banners/".$_GET["type"]."/emulators");
echo "</div>";
} else {
echo "<div class=\"container\">";
listImages("banners/".$_GET["type"]);
echo "</div>";
}
}
?>
<hr>
<div class="container"><p>
<a href="https://gbatemp.net/threads/gridlauncher-3dsflow-project-box-cover-banners.405303/">GBAtemp thread</a> &mdash; <a href="https://gist.github.com/ihaveamac/b2229c8feb513476e745">Site source code &amp; credits on GitHub Gist</a> &mdash; <a href="https://ianburgwin.net/">ianburgwin.net</a>
</p></div>
</div>
</div>
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment