mirror of
https://github.com/gmemstr/notdonemywebsite.git
synced 2024-09-19 21:51:10 +01:00
Getting different template on button press works
This commit is contained in:
parent
9a0e526e2a
commit
392016837b
|
@ -1,17 +1,17 @@
|
||||||
console.log("app.js loaded");
|
console.log("app.js loaded");
|
||||||
|
|
||||||
var getTemplateHtml = template => {
|
var getTemplateHtml = template => {
|
||||||
fetch('template/template.html')
|
document.getElementById('iframe').src = "about:blank";
|
||||||
|
fetch('template/'+template+'.html')
|
||||||
.then(function(response) {
|
.then(function(response) {
|
||||||
return response.text()
|
return response.text()
|
||||||
})
|
})
|
||||||
.then(function(html) {
|
.then(function(html) {
|
||||||
document.getElementById('iframe').contentWindow.document.write(html);
|
document.getElementById('iframe').contentWindow.document.write(html);
|
||||||
|
console.log(document.getElementById('iframe').contentWindow.document)
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
getTemplateHtml("1");
|
|
||||||
|
|
||||||
var valueChange = value => {
|
var valueChange = value => {
|
||||||
var iframehtml = document.getElementById('iframe').contentWindow.document.getElementById(value);
|
var iframehtml = document.getElementById('iframe').contentWindow.document.getElementById(value);
|
||||||
val = document.getElementById(value).value;
|
val = document.getElementById(value).value;
|
||||||
|
|
|
@ -17,8 +17,8 @@
|
||||||
<div id="themebtns">
|
<div id="themebtns">
|
||||||
<h1>I'm not done my website!</h1>
|
<h1>I'm not done my website!</h1>
|
||||||
<h2>Theme</h2>
|
<h2>Theme</h2>
|
||||||
<button class="themebtn" id="original">Original</button>
|
<button class="themebtn" id="original" onclick="getTemplateHtml('original')">Original</button>
|
||||||
<button class="themebtn" id="fork">Fork</button>
|
<button class="themebtn" id="fork" onclick="getTemplateHtml('fork')">Fork</button>
|
||||||
</div>
|
</div>
|
||||||
<!-- Colour inputs -->
|
<!-- Colour inputs -->
|
||||||
<div id="themeclrs">
|
<div id="themeclrs">
|
||||||
|
|
53
make.php
53
make.php
|
@ -1,53 +0,0 @@
|
||||||
<?php
|
|
||||||
header('Content-Type: text/plain');
|
|
||||||
header('Content-Disposition: attachment; filename=index.html');
|
|
||||||
|
|
||||||
$sname = $_POST['sname'];
|
|
||||||
$surl = $_POST['surl'];
|
|
||||||
$devname = $_POST['devname'];
|
|
||||||
$pcolour = $_POST['pcolour'];
|
|
||||||
$scolour = $_POST['scolour'];
|
|
||||||
$template = $_POST['template'];
|
|
||||||
|
|
||||||
$tFile = "template/template.html";
|
|
||||||
|
|
||||||
if($template == "The Original"){
|
|
||||||
$tFile = "template/template.html";
|
|
||||||
}
|
|
||||||
if($template == "Forked"){
|
|
||||||
$tFile = "template/template2.html";
|
|
||||||
}
|
|
||||||
|
|
||||||
$template = fopen($tFile, "r+"); // Change this if you have a custom template filename
|
|
||||||
$tempContents = fread($template, filesize($tFile));
|
|
||||||
|
|
||||||
// Keywords for replacement - see README
|
|
||||||
$keywords = array("rep_PCOLOUR", "rep_SCOLOUR", "rep_SNAME", "rep_URL", "rep_DEVNAME");
|
|
||||||
$replacement = array($pcolour, $scolour, $sname, $surl, $devname);
|
|
||||||
// ---
|
|
||||||
|
|
||||||
$contents = str_replace($keywords, $replacement, $tempContents); // Replace the contents of the variable
|
|
||||||
|
|
||||||
fclose($template);
|
|
||||||
|
|
||||||
/* Debug stuff
|
|
||||||
echo "$sname ";
|
|
||||||
echo "$surl ";
|
|
||||||
echo "$devname ";
|
|
||||||
echo "$pcolour ";
|
|
||||||
echo "$scolour ";
|
|
||||||
*/
|
|
||||||
|
|
||||||
echo $contents; // Echo out the generated page
|
|
||||||
|
|
||||||
/* Not actually needed but may need to reuse this code later on
|
|
||||||
*
|
|
||||||
* $indexfile = fopen("index.html", "w");
|
|
||||||
* fwrite($indexfile, NULL);
|
|
||||||
* fclose($indexfile);
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
|
|
||||||
// Make the client download the file as a .html :)
|
|
||||||
|
|
||||||
?>
|
|
|
@ -1,48 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<!-- Very simple webpage that scales decently -->
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8">
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
|
||||||
<title>rep_SNAME</title>
|
|
||||||
<meta name="description" content="">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
||||||
<link href='https://fonts.googleapis.com/css?family=Roboto:400,700' rel='stylesheet' type='text/css'>
|
|
||||||
|
|
||||||
<style type="text/css">
|
|
||||||
body{
|
|
||||||
font-family: 'Roboto', sans-serif;
|
|
||||||
position: fixed;
|
|
||||||
top: 40%;
|
|
||||||
left: 50%;
|
|
||||||
transform: translate(-50%, -50%);
|
|
||||||
background-color: #E9E9E9;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header{
|
|
||||||
font-weight: 700;
|
|
||||||
padding: 10px;
|
|
||||||
text-align: center;
|
|
||||||
background-color: rep_PCOLOUR;
|
|
||||||
box-shadow:2px 2px 5px #888;
|
|
||||||
}
|
|
||||||
|
|
||||||
.content{
|
|
||||||
font-weight: 400;
|
|
||||||
padding: 6%;
|
|
||||||
text-align: center;
|
|
||||||
background-color: rep_SCOLOUR;
|
|
||||||
box-shadow:2px 2px 5px #888;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div class="header">
|
|
||||||
<h1 id="sitename">rep_SNAME</h1>
|
|
||||||
</div>
|
|
||||||
<br />
|
|
||||||
<div class="content" id="content">
|
|
||||||
<p><span id="url">rep_URL</span> is being worked on by <span id="devname">rep_DEVNAME!</span></p> <!-- See README for keywords -->
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
|
@ -1,59 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<!-- Very simple webpage that scales decently -->
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8">
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
|
||||||
<title>rep_SNAME - Under Construction</title>
|
|
||||||
<meta name="description" content="">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
||||||
<link href='https://fonts.googleapis.com/css?family=Roboto:400,700' rel='stylesheet' type='text/css'>
|
|
||||||
|
|
||||||
<style type="text/css">
|
|
||||||
body{
|
|
||||||
font-family: 'Roboto', sans-serif;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
background-color: #E9E9E9;
|
|
||||||
}
|
|
||||||
|
|
||||||
.container {
|
|
||||||
width: 40%;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
header {
|
|
||||||
margin-top: -20px;
|
|
||||||
background-color: rep_PCOLOUR;
|
|
||||||
border-bottom: 5px solid rep_SCOLOUR;
|
|
||||||
padding: 10px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.content{
|
|
||||||
width: 40%;
|
|
||||||
position: fixed;
|
|
||||||
top: 40%;
|
|
||||||
left: 50%;
|
|
||||||
transform: translate(-50%, -50%);
|
|
||||||
font-weight: 400;
|
|
||||||
text-align: center;
|
|
||||||
color: rep_SCOLOUR;
|
|
||||||
background-color: rep_PCOLOUR;
|
|
||||||
box-shadow:2px 2px 5px #888;
|
|
||||||
border-bottom: 5px solid rep_SCOLOUR;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<header>
|
|
||||||
<div class="container">
|
|
||||||
<h1>rep_SNAME</h1>
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<div class="content">
|
|
||||||
<h1>Under Construction</h1>
|
|
||||||
<p>rep_SNAME is being worked on by rep_DEVNAME!</p> <!-- See README for keywords -->
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
Loading…
Reference in a new issue