wasm page generator for emscripten
Brett
parent
cd81c583d3
commit
03591e8e9d
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
import argparse
|
import argparse
|
||||||
import subprocess
|
import subprocess
|
||||||
import color_io
|
import util.color_io as color_io
|
||||||
|
|
||||||
parser = argparse.ArgumentParser(prog='Site Generator', description='Apache/Nginx Site Generator', epilog='Currently Only For Nginx')
|
parser = argparse.ArgumentParser(prog='Site Generator', description='Apache/Nginx Site Generator', epilog='Currently Only For Nginx')
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
import argparse
|
import argparse
|
||||||
import subprocess
|
import subprocess
|
||||||
import color_io
|
import util.color_io as color_io
|
||||||
import sys
|
import sys
|
||||||
|
|
||||||
parser = argparse.ArgumentParser(prog='SystemD Service Generator', description='SystemD Service Unit File Generator', epilog='Meow')
|
parser = argparse.ArgumentParser(prog='SystemD Service Generator', description='SystemD Service Unit File Generator', epilog='Meow')
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,210 @@
|
||||||
|
#!/bin/python3
|
||||||
|
|
||||||
|
import argparse
|
||||||
|
import subprocess
|
||||||
|
import util.color_io as color_io
|
||||||
|
import sys
|
||||||
|
|
||||||
|
parser = argparse.ArgumentParser(prog='WebASM Generator', description='Creates a webpage to run a WebASM Project, designed for use with emscripten', epilog='Meow')
|
||||||
|
|
||||||
|
parser.add_argument("-i", "--install", nargs='?', const="/var/www/html/", default=None)
|
||||||
|
if ("--install" in sys.argv or "-i" in sys.argv):
|
||||||
|
parser.add_argument("file", default=None)
|
||||||
|
|
||||||
|
args = parser.parse_args()
|
||||||
|
|
||||||
|
f = sys.stdout
|
||||||
|
|
||||||
|
html_base = """
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>${TITLE HERE}</title>
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
height: 100vh;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
background-color: #222;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loading-container {
|
||||||
|
width: 80%;
|
||||||
|
max-width: 600px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loading-text-container {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loading-bar-container {
|
||||||
|
width: 100%;
|
||||||
|
height: 20px;
|
||||||
|
background-color: rgba(255, 255, 255, 0.1);
|
||||||
|
border-radius: 10px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loading-bar {
|
||||||
|
width: 0;
|
||||||
|
height: 100%;
|
||||||
|
background-color: #007bff;
|
||||||
|
transition: width 0.5s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.seperator {
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.progress-text {
|
||||||
|
font-size: 20px;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.progress-text p {
|
||||||
|
margin: 0px;
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.canvas {
|
||||||
|
display: none;
|
||||||
|
margin: 0px;
|
||||||
|
padding: 0px;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
canvas.canvas {
|
||||||
|
margin: 0px;
|
||||||
|
padding: 0px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="loading-container" id="loading-container">
|
||||||
|
<div class="loading-bar-container">
|
||||||
|
<div class="loading-bar" id="loadingBar1"></div>
|
||||||
|
</div>
|
||||||
|
<div class="seperator"></div>
|
||||||
|
<div class="loading-text-container">
|
||||||
|
<div class="progress-text" id="progressIndicator"></div>
|
||||||
|
</div>
|
||||||
|
<div class="loading-text-container">
|
||||||
|
<div class="progress-text" id="progressText"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="canvas" id="canvas-container">
|
||||||
|
<canvas class="canvas" id="canvas" oncontextmenu="event.preventDefault()" width=100% height=100%, tabindex=-1></canvas>
|
||||||
|
</div>
|
||||||
|
<script type="text/javascript">
|
||||||
|
var canvas = document.getElementById("canvas");
|
||||||
|
const loadingBar1 = document.getElementById('loadingBar1');
|
||||||
|
|
||||||
|
const progressText = document.getElementById('progressText');
|
||||||
|
const progressIndicator = document.getElementById('progressIndicator');
|
||||||
|
const loadingContainer = document.getElementById('loading-container');
|
||||||
|
const canvasContainer = document.getElementById('canvas-container');
|
||||||
|
|
||||||
|
var Module = {
|
||||||
|
totalDependencies: 0,
|
||||||
|
preRun: [],
|
||||||
|
postRun: [],
|
||||||
|
print: (function() {
|
||||||
|
return function(text) {
|
||||||
|
if (arguments.length > 1)
|
||||||
|
text = Array.prototype.slice.call(arguments).join(' ');
|
||||||
|
console.log(text);
|
||||||
|
};
|
||||||
|
})(),
|
||||||
|
printErr: (function() {
|
||||||
|
return function(text){
|
||||||
|
if (arguments.length > 1)
|
||||||
|
text = Array.prototype.slice.call(arguments).join(' ');
|
||||||
|
console.error(text);
|
||||||
|
};
|
||||||
|
})(),
|
||||||
|
canvas: (function() {
|
||||||
|
var canvas = document.getElementById('canvas');
|
||||||
|
|
||||||
|
// As a default initial behavior, pop up an alert when webgl context is lost. To make your
|
||||||
|
// application robust, you may want to override this behavior before shipping!
|
||||||
|
// See http://www.khronos.org/registry/webgl/specs/latest/1.0/#5.15.2
|
||||||
|
canvas.addEventListener("webglcontextlost", function(e) {
|
||||||
|
alert('WebGL context lost. You will need to reload the page.');
|
||||||
|
e.preventDefault();
|
||||||
|
}, false);
|
||||||
|
|
||||||
|
return canvas;
|
||||||
|
})(),
|
||||||
|
setStatus: function(left) {
|
||||||
|
if (this.totalDependencies == 0)
|
||||||
|
return;
|
||||||
|
if (typeof left !== "number"){
|
||||||
|
if (left.includes("Download")){
|
||||||
|
progressIndicator.innerHTML = left;
|
||||||
|
progressText.innerText = "";
|
||||||
|
let open = left.lastIndexOf("(");
|
||||||
|
let close = left.lastIndexOf(")");
|
||||||
|
let progressFull = left.substring(open + 1, close);
|
||||||
|
let progressData = progressFull.split("/");
|
||||||
|
let downloaded = parseInt(progressData[0]);
|
||||||
|
let totalDownload = parseInt(progressData[1]);
|
||||||
|
let percentProgress = Math.round(Math.min((downloaded / totalDownload) * 100, 100));
|
||||||
|
loadingBar1.style.width = `${percentProgress}%`;
|
||||||
|
progressText.innerText = `${percentProgress}%`;
|
||||||
|
} else {
|
||||||
|
// Hide loading bar container
|
||||||
|
loadingContainer.style.display = 'none';
|
||||||
|
// show the canvas
|
||||||
|
canvasContainer.style.display = 'block';
|
||||||
|
}
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
let progress = (this.totalDependencies - left) / this.totalDependencies;
|
||||||
|
let percentProgress = Math.round(Math.min(progress * 100, 100));
|
||||||
|
progressText.innerText = `${percentProgress}%`;
|
||||||
|
progressIndicator.innerHTML = `Loading Content (<p id="progressContent">0/0</p>)`;
|
||||||
|
const progressContent = document.getElementById('progressContent');
|
||||||
|
progressContent.innerText = `${this.totalDependencies - left}/${this.totalDependencies}`;
|
||||||
|
},
|
||||||
|
monitorRunDependencies: function(left) {
|
||||||
|
this.totalDependencies = Math.max(this.totalDependencies, left);
|
||||||
|
Module.setStatus(left);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
window.onerror = function() {
|
||||||
|
Module.setStatus = function(text) {
|
||||||
|
if (text)
|
||||||
|
console.error('[post-exception status] ' + text);
|
||||||
|
};
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<script async type="text/javascript" src="${SCRIPT_HERE}"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
"""
|
||||||
|
|
||||||
|
if args.install:
|
||||||
|
path = args.install
|
||||||
|
if not args.install.endswith("/"):
|
||||||
|
path += "/"
|
||||||
|
path += args.file
|
||||||
|
if not args.file.endswith(".html"):
|
||||||
|
path += ".html"
|
||||||
|
f = open(path, "wt")
|
||||||
|
|
||||||
|
def bprint(*args, **kwargs):
|
||||||
|
print(*args, file=f, **kwargs)
|
||||||
|
|
||||||
|
if __name__ == "__main__":
|
||||||
|
html_out = html_base.replace("${TITLE_HERE}", color_io.input_print("Please enter page title"));
|
||||||
|
html_out = html_out.replace("${SCRIPT_HERE}", color_io.input_print("Please enter script location and name"));
|
||||||
|
|
||||||
|
bprint(html_out);
|
||||||
|
|
@ -0,0 +1,173 @@
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>${TITLE HERE}</title>
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
height: 100vh;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
background-color: #222;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loading-container {
|
||||||
|
width: 80%;
|
||||||
|
max-width: 600px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loading-text-container {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loading-bar-container {
|
||||||
|
width: 100%;
|
||||||
|
height: 20px;
|
||||||
|
background-color: rgba(255, 255, 255, 0.1);
|
||||||
|
border-radius: 10px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loading-bar {
|
||||||
|
width: 0;
|
||||||
|
height: 100%;
|
||||||
|
background-color: #007bff;
|
||||||
|
transition: width 0.5s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.seperator {
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.progress-text {
|
||||||
|
font-size: 20px;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.progress-text p {
|
||||||
|
margin: 0px;
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.canvas {
|
||||||
|
display: none;
|
||||||
|
margin: 0px;
|
||||||
|
padding: 0px;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
canvas.canvas {
|
||||||
|
margin: 0px;
|
||||||
|
padding: 0px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="loading-container" id="loading-container">
|
||||||
|
<div class="loading-bar-container">
|
||||||
|
<div class="loading-bar" id="loadingBar1"></div>
|
||||||
|
</div>
|
||||||
|
<div class="seperator"></div>
|
||||||
|
<div class="loading-text-container">
|
||||||
|
<div class="progress-text" id="progressIndicator"></div>
|
||||||
|
</div>
|
||||||
|
<div class="loading-text-container">
|
||||||
|
<div class="progress-text" id="progressText"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="canvas" id="canvas-container">
|
||||||
|
<canvas class="canvas" id="canvas" oncontextmenu="event.preventDefault()" width=100% height=100%, tabindex=-1></canvas>
|
||||||
|
</div>
|
||||||
|
<script type="text/javascript">
|
||||||
|
var canvas = document.getElementById("canvas");
|
||||||
|
const loadingBar1 = document.getElementById('loadingBar1');
|
||||||
|
|
||||||
|
const progressText = document.getElementById('progressText');
|
||||||
|
const progressIndicator = document.getElementById('progressIndicator');
|
||||||
|
const loadingContainer = document.getElementById('loading-container');
|
||||||
|
const canvasContainer = document.getElementById('canvas-container');
|
||||||
|
|
||||||
|
var Module = {
|
||||||
|
totalDependencies: 0,
|
||||||
|
preRun: [],
|
||||||
|
postRun: [],
|
||||||
|
print: (function() {
|
||||||
|
return function(text) {
|
||||||
|
if (arguments.length > 1)
|
||||||
|
text = Array.prototype.slice.call(arguments).join(' ');
|
||||||
|
console.log(text);
|
||||||
|
};
|
||||||
|
})(),
|
||||||
|
printErr: (function() {
|
||||||
|
return function(text){
|
||||||
|
if (arguments.length > 1)
|
||||||
|
text = Array.prototype.slice.call(arguments).join(' ');
|
||||||
|
console.error(text);
|
||||||
|
};
|
||||||
|
})(),
|
||||||
|
canvas: (function() {
|
||||||
|
var canvas = document.getElementById('canvas');
|
||||||
|
|
||||||
|
// As a default initial behavior, pop up an alert when webgl context is lost. To make your
|
||||||
|
// application robust, you may want to override this behavior before shipping!
|
||||||
|
// See http://www.khronos.org/registry/webgl/specs/latest/1.0/#5.15.2
|
||||||
|
canvas.addEventListener("webglcontextlost", function(e) {
|
||||||
|
alert('WebGL context lost. You will need to reload the page.');
|
||||||
|
e.preventDefault();
|
||||||
|
}, false);
|
||||||
|
|
||||||
|
return canvas;
|
||||||
|
})(),
|
||||||
|
setStatus: function(left) {
|
||||||
|
if (this.totalDependencies == 0)
|
||||||
|
return;
|
||||||
|
if (typeof left !== "number"){
|
||||||
|
if (left.includes("Download")){
|
||||||
|
progressIndicator.innerHTML = left;
|
||||||
|
progressText.innerText = "";
|
||||||
|
let open = left.lastIndexOf("(");
|
||||||
|
let close = left.lastIndexOf(")");
|
||||||
|
let progressFull = left.substring(open + 1, close);
|
||||||
|
let progressData = progressFull.split("/");
|
||||||
|
let downloaded = parseInt(progressData[0]);
|
||||||
|
let totalDownload = parseInt(progressData[1]);
|
||||||
|
let percentProgress = Math.round(Math.min((downloaded / totalDownload) * 100, 100));
|
||||||
|
loadingBar1.style.width = `${percentProgress}%`;
|
||||||
|
progressText.innerText = `${percentProgress}%`;
|
||||||
|
} else {
|
||||||
|
// Hide loading bar container
|
||||||
|
loadingContainer.style.display = 'none';
|
||||||
|
// show the canvas
|
||||||
|
canvasContainer.style.display = 'block';
|
||||||
|
}
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
let progress = (this.totalDependencies - left) / this.totalDependencies;
|
||||||
|
let percentProgress = Math.round(Math.min(progress * 100, 100));
|
||||||
|
progressText.innerText = `${percentProgress}%`;
|
||||||
|
progressIndicator.innerHTML = `Loading Content (<p id="progressContent">0/0</p>)`;
|
||||||
|
const progressContent = document.getElementById('progressContent');
|
||||||
|
progressContent.innerText = `${this.totalDependencies - left}/${this.totalDependencies}`;
|
||||||
|
},
|
||||||
|
monitorRunDependencies: function(left) {
|
||||||
|
this.totalDependencies = Math.max(this.totalDependencies, left);
|
||||||
|
Module.setStatus(left);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
window.onerror = function() {
|
||||||
|
Module.setStatus = function(text) {
|
||||||
|
if (text)
|
||||||
|
console.error('[post-exception status] ' + text);
|
||||||
|
};
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<script async type="text/javascript" src="${SCRIPT_HERE}"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Binary file not shown.
|
|
@ -0,0 +1,17 @@
|
||||||
|
import sys
|
||||||
|
|
||||||
|
def eprint(*args, **kwargs):
|
||||||
|
print(*args, file=sys.stderr, **kwargs)
|
||||||
|
|
||||||
|
def input_print(p, default = ""):
|
||||||
|
eprint("\033[93m" + p, end=':\033[0m ', flush=True)
|
||||||
|
inp = input("")
|
||||||
|
if inp:
|
||||||
|
return inp
|
||||||
|
else:
|
||||||
|
if not default:
|
||||||
|
return input_print(p, default)
|
||||||
|
return default
|
||||||
|
|
||||||
|
def green_print(p):
|
||||||
|
eprint("\033[92m" + p + "\033[0m")
|
||||||
Loading…
Reference in New Issue