BodgeMaster
/
barebones_webpage
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

initial commit, add files

master
BodgeMaster 2024-04-23 17:14:05 +02:00
commit 5b2dd977c1
16 changed files with 558 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.gitignore vendored Normal file
View File

@ -0,0 +1,3 @@
*.swp
/webroot/

23
LICENSE.txt Normal file
View File

@ -0,0 +1,23 @@
Copyright 2024 Jan Danielzick aka. BodgeMaster
Redistribution and use in source and binary forms, with or without
modification, are permitted provided that the following conditions are met:
1. Redistributions of source code must retain the above copyright notice,
this list of conditions and the following disclaimer.
2. Redistributions in binary form must reproduce the above copyright notice,
this list of conditions and the following disclaimer in the documentation
and/or other materials provided with the distribution.
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
“AS IS” AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS
FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED
TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA,
OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

61
build.sh Executable file
View File

@ -0,0 +1,61 @@
#!/usr/bin/env bash
function assemble_index {
# $1 src
# $2 webroot
# $3 directory below src
# $4 template directory
sed -e 's/^ //' <<< "
import json
properties = json.loads('''$(cat "$1/$3/properties.json")''')
index_path = ''
print('''
echo 'Assembling index:'
type=$(ls "$1/$3/" | grep "content\\..*body" | sed -e 's/^content\.//;s/body$//')
echo \" - Type: \$type\"
echo ' - Title: ''' + properties['page title'] + ''''
echo ' - Slogan: ''' + properties['section slogan'] + ''''
echo ' - Custom CSS: ''' + properties['inject css'] + ''''
sed -e 's/%TITLE%/''' + properties['page title'] + '''/;s/%SLOGAN%/''' +properties['section slogan']+ '''/;s/%ADDITIONAL_STYLE%/''' +properties['inject css']+ '''/' < $4/html_begin.template > $2/$3/index.\$type
cat $1/$3/content.\${type}body >> $2/$3/index.\$type
cat $4/html_end.template >> $2/$3/index.\$type
''')
" | python3 | bash
}
function copy_additional_files {
# $1 src
# $2 webroot
# $3 directory below src
sed -e 's/^ //' <<< "
import json
properties = json.loads('''$(cat "$1/$3/properties.json")''')
for additional_file in properties['additional files']:
print('cp --no-dereference -v \"$1/$3/' + additional_file + '\" \"$2/$3/' + additional_file + '\"')
" | python3 | bash
}
function build {
# $1 src
# $2 webroot
# $3 template directory
original_ifs="$IFS"
IFS=$'\n'
for dir in $(cd "$1" && find . -type d)
do
echo ">> $dir"
[ ! -d "$2/dir" ] && mkdir "$2/$dir"
assemble_index "$1" "$2" "$dir" "$3"
copy_additional_files "$1" "$2" "$dir"
done
IFS="$original_ifs"
}
echo ">>> Cleaning webroots:"
./reset.sh
echo ">>> Building external:"
build src webroot templates

10
reset.sh Executable file
View File

@ -0,0 +1,10 @@
#!/usr/bin/env bash
function recreate_directory {
echo ">> $1"
rm -r $1
mkdir $1
touch $1/.keep
}
recreate_directory webroot

7
src/content.htmlbody Normal file
View File

@ -0,0 +1,7 @@
<h1 class="home">
Test Page
</h1>
<p>
This is a test page created to check whether I have everything I need
in my framework.
</p>

1
src/example_a/content.htmlbody Normal file
View File

@ -0,0 +1 @@
<p>Just another page.</p>

6
src/example_a/properties.json Normal file
View File

@ -0,0 +1,6 @@
{
"section slogan": "Iek! Iek!",
"page title": "Example A",
"additional files": [],
"inject css": ""
}

26
src/example_b/Hi.txt Normal file
View File

@ -0,0 +1,26 @@
___
.·*¯¯___¯¯*·.
/ .*¯ ¯*. \
: / \ :
| : <o> <o> : |
| | A | |
| : ; |
; \ .___. / :
/ ,*·-----·*. \
ˇ*·.* *.·*ˇ
/ / \ \
| : : |
| | | |
| : : |
| : ; |
\,*---------*./
: ;
\ . /
| / \ |
| | | |
| | | |
| | | |
|____| |____|
/____; :____\
[_____] [_____]

1
src/example_b/content.phpbody Normal file
View File

@ -0,0 +1 @@
<p>This is not actually php, just a file to demonstrate that this also deals with PHP.</p>

6
src/example_b/properties.json Normal file
View File

@ -0,0 +1,6 @@
{
"section slogan": "Ook! Ook!",
"page title": "Example B",
"additional files": ["test.txt", "Hi.txt"],
"inject css": ""
}

11
src/example_b/test.txt Normal file
View File

@ -0,0 +1,11 @@
_____ ____
/ | / /
/ . | / / .*¯¯¯¯¯¯¯¯| /¯¯¯/ .*¯¯¯¯¯¯¯¯¯/ /¯¯¯¯¯¯¯¯¯/
/ /| | / / / ,––––, / / / / ,–––––. / / ,––––. /
/ / | | / / / / / / / / / / V / / V
/ / | | / / / / / / / / / / / ’–––*/
/ / | | / / / / / / / / / / / ,–––./
/ / | |/ / / / / / / / / / / /
/ / | ' / / ’––––’ / / / / ’–––––.*/ / ’–––––.*/
/___/ |_____/ |_________.* /___/ |__________/ /__________/

6
src/properties.json Normal file
View File

@ -0,0 +1,6 @@
{
"section slogan": "Meow!",
"page title": "Test",
"additional files": ["style.css"],
"inject css": ""
}

335
src/style.css Normal file
View File

@ -0,0 +1,335 @@
:root {
--body-background: #d0d0d0;
--header-background: #d11a11;
--header-text: #ffffff;
--nav-background: #8f0303;
--nav-background-hover: #b72200;
--nav-text: #ffffff;
--main-bg-color: #ffffff;
}
body {
margin: 0;
padding: 0;
}
body:not(.embed) {
background-color: var(--body-background);
}
body * {
font-family: sans-serif;
}
header {
background-color: var(--header-background);
width: 100%;
padding: 0;
margin: 0;
}
header * {
color: var(--header-text);
text-decoration: none;
text-align: center;
font-weight: bold;
}
header h1 {
font-size: 3em;
padding: 0.35em 0 0 0;
margin: 0;
}
header h2 {
font-size: 1em;
font-style: italic;
padding: 0 0 0.5em 0;
margin: 0;
}
nav {
margin: 0;
display: table;
table-layout: fixed;
width: 100%;
position: sticky;
top: 0;
background-color: var(--nav-background);
}
nav * {
color: var(--nav-text);
text-decoration: none;
text-align: center;
font-weight: lighter;
display: table-cell;
vertical-align: middle;
background-color: var(--nav-background);
padding: 0;
}
nav a {
padding-top: 0.7em;
padding-bottom: 0.4em;
}
nav a:hover {
background-color: var(--nav-background-hover);
}
main {
/* TODO: snap to use all available space on small screens */
width: 90%;
margin-left: auto;
margin-right: auto;
border: 1px solid #505050;
border-top: none;
padding: 0 0.5em;
background-color: var(--main-bg-color);
}
body.embed {
background-color: var(--main-bg-color);
}
main h1 {
margin: 0;
font-size: 1.5em;
font-weight: bold;
padding-left: 0;
padding-right: 0;
padding-top: 0.5em;
padding-bottom: 0.3em;
}
body.embed h1 {
margin: 0;
font-size: 1.5em;
font-weight: bold;
padding-left: 0;
padding-right: 0;
padding-top: 0.5em;
padding-bottom: 0.3em;
}
main h1.main {
padding-bottom: 0;
}
body.embed h1.main {
padding-bottom: 0;
}
main h1.sub {
font-size: 1em;
font-style: italic;
font-weight: bold;
padding-top: 0;
padding-bottom: 0.5em;
}
body.embed h1.sub {
font-size: 1em;
font-style: italic;
font-weight: bold;
padding-top: 0;
padding-bottom: 0.5em;
}
main h1.home {
width: fit-content;
text-align: center;
font-size: 3.5em;
padding: 0.8em 0.4em 0 0.4em;
margin-left: auto;
margin-right: auto;
margin-bottom: 0.28em;
border-bottom: 1px solid;
}
main h2 {
margin: 0;
font-size: 1.2em;
font-weight: bold;
padding-left: 0;
padding-right: 0;
padding-top: 0.5em;
padding-bottom: 0.3em;
}
body.embed h2 {
margin: 0;
font-size: 1.2em;
font-weight: bold;
padding-left: 0;
padding-right: 0;
padding-top: 0.5em;
padding-bottom: 0.3em;
}
main h2.main {
padding-bottom: 0;
}
body.embed h2.main {
padding-bottom: 0;
}
main h2.sub {
font-size: 0.8em;
font-style: italic;
font-weight: bold;
padding-top: 0;
padding-bottom: 0.5em;
}
body.embed h2.sub {
font-size: 0.8em;
font-style: italic;
font-weight: bold;
padding-top: 0;
padding-bottom: 0.5em;
}
main h3 {
margin: 0;
font-size: 1em;
font-weight: bold;
padding-left: 0;
padding-right: 0;
padding-top: 0.5em;
padding-bottom: 0.3em;
}
body.embed h3 {
margin: 0;
font-size: 1em;
font-weight: bold;
padding-left: 0;
padding-right: 0;
padding-top: 0.5em;
padding-bottom: 0.3em;
}
main h3.main {
padding-bottom: 0;
}
body.embed h3.main {
padding-bottom: 0;
}
main h3.sub {
font-size: 0.7em;
font-style: italic;
font-weight: bold;
padding-top: 0;
padding-bottom: 0.5em;
}
body.embed h3.sub {
font-size: 0.7em;
font-style: italic;
font-weight: bold;
padding-top: 0;
padding-bottom: 0.5em;
}
main p {
margin: 0;
padding: 0 0.8em;
padding-bottom: 0.5em;
font-size: 1em;
}
body.embed p {
margin: 0;
padding: 0 0.8em;
padding-bottom: 0.5em;
font-size: 1em;
}
main p.note {
font-size: 0.75em;
font-style: italic;
}
body.embed p.note {
font-size: 0.75em;
font-style: italic;
}
main p.center {
margin-left: auto;
margin-right: auto;
text-align: center;
}
body.embed p.center {
margin-left: auto;
margin-right: auto;
text-align: center;
}
main div.center {
width: fit-content;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
main div.center_contents_vertically {
overflow: auto;
white-space: nowrap;
}
main div.center_contents_vertically * {
vertical-align: middle;
}
iframe {
border: none;
width: 100%;
}
input[type="range"] {
height: 1em;
vertical-align: bottom;
}
input[type="submit"] {
vertical-align: top;
}
dialog#show-img::backdrop {
background: rgba(0,0,0,0.8);
}
dialog#show-img {
background: transparent;
border: none;
}
dialog#show-img p {
color: white;
font-size: 0.8em;
width: 100%;
text-align: center;
}
dialog#show-img img {
display: block;
margin-left: auto;
margin-right: auto;
max-height: 80vh;
max-width: 90vw;
}
footer {
margin: 0;
padding-top: 0.5em;
padding-bottom: 0.5em;
}
footer p {
text-align: center;
margin: auto;
font-size: 0.7em;
color: #888A85;
}
footer a {
text-decoration: none;
color: #555753;
}
footer a:hover {
text-decoration: underline;
color: #888A85;
}

18
templates/html_begin.template Normal file
View File

@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<title> LostCave - %TITLE% </title>
<link rel="stylesheet" type="text/css" href="/style.css" />
<style> %ADDITIONAL_STYLE% </style>
</head>
<body>
<header>
<h1> LostCave </h1>
<h2> %SLOGAN% </h2>
</header>
<nav>
<a href="/"> HOME </a>
<a href="/example_a"> EXAMPLE A </a>
<a href="/example_b"> EXAMPLE B </a>
</nav>
<main>

44
templates/html_end.template Normal file
View File

@ -0,0 +1,44 @@
</main>
<dialog id="show-img"></dialog>
<footer>
<p>This page uses code from <a href="https://lostcave.ddnss.de/">https://lostcave.ddnss.de</a>.</p>
</footer>
<script>
var dialog_show_img = document.getElementById("show-img");
dialog_show_img.addEventListener("click", function(event) {
event.target.close();
}, false)
var images = document.getElementsByTagName("img");
for (var i=0; i<images.length; i++) {
images[i].addEventListener(
"click",
function(event) {
dialog_show_img.innerHTML = event.target.outerHTML;
dialog_show_img.appendChild(document.createElement('p')).innerText = event.target.getAttribute("alt");
if (event.target.width<300 || event.target.height<300) {
width = event.target.width * 2;
dialog_show_img.children[0].style = "width: " + width + "px; image-rendering: pixelated;"
}
dialog_show_img.children[0].addEventListener(
"click",
function(e){
dialog_show_img.close();
},
false
);
dialog_show_img.children[1].addEventListener(
"click",
function(e){
dialog_show_img.close();
},
false
);
dialog_show_img.showModal();
},
false
);
}
</script>
</body>
</html>

0
webroot/.keep Normal file
View File