Nils
5 years ago
18 changed files with 693 additions and 2 deletions
@ -0,0 +1,119 @@ |
|||
temp/ |
|||
out/ |
|||
|
|||
# ---> Python |
|||
# Byte-compiled / optimized / DLL files |
|||
__pycache__/ |
|||
*.py[cod] |
|||
*$py.class |
|||
|
|||
# C extensions |
|||
*.so |
|||
|
|||
# Distribution / packaging |
|||
.Python |
|||
build/ |
|||
develop-eggs/ |
|||
dist/ |
|||
downloads/ |
|||
eggs/ |
|||
.eggs/ |
|||
lib/ |
|||
lib64/ |
|||
parts/ |
|||
sdist/ |
|||
var/ |
|||
wheels/ |
|||
*.egg-info/ |
|||
.installed.cfg |
|||
*.egg |
|||
MANIFEST |
|||
|
|||
# PyInstaller |
|||
# Usually these files are written by a python script from a template |
|||
# before PyInstaller builds the exe, so as to inject date/other infos into it. |
|||
*.manifest |
|||
*.spec |
|||
|
|||
# Installer logs |
|||
pip-log.txt |
|||
pip-delete-this-directory.txt |
|||
|
|||
# Unit test / coverage reports |
|||
htmlcov/ |
|||
.tox/ |
|||
.nox/ |
|||
.coverage |
|||
.coverage.* |
|||
.cache |
|||
nosetests.xml |
|||
coverage.xml |
|||
*.cover |
|||
.hypothesis/ |
|||
.pytest_cache/ |
|||
|
|||
# Translations |
|||
*.mo |
|||
*.pot |
|||
|
|||
# Django stuff: |
|||
*.log |
|||
local_settings.py |
|||
db.sqlite3 |
|||
|
|||
# Flask stuff: |
|||
instance/ |
|||
.webassets-cache |
|||
|
|||
# Scrapy stuff: |
|||
.scrapy |
|||
|
|||
# Sphinx documentation |
|||
docs/_build/ |
|||
|
|||
# PyBuilder |
|||
target/ |
|||
|
|||
# Jupyter Notebook |
|||
.ipynb_checkpoints |
|||
|
|||
# IPython |
|||
profile_default/ |
|||
ipython_config.py |
|||
|
|||
# pyenv |
|||
.python-version |
|||
|
|||
# celery beat schedule file |
|||
celerybeat-schedule |
|||
|
|||
# SageMath parsed files |
|||
*.sage.py |
|||
|
|||
# Environments |
|||
.env |
|||
.venv |
|||
env/ |
|||
venv/ |
|||
ENV/ |
|||
env.bak/ |
|||
venv.bak/ |
|||
|
|||
# Spyder project settings |
|||
.spyderproject |
|||
.spyproject |
|||
|
|||
# Rope project settings |
|||
.ropeproject |
|||
|
|||
# mkdocs documentation |
|||
/site |
|||
|
|||
# mypy |
|||
.mypy_cache/ |
|||
.dmypy.json |
|||
dmypy.json |
|||
|
|||
# Pyre type checker |
|||
.pyre/ |
|||
|
|||
@ -1,3 +1,27 @@ |
|||
# laborejo.org |
|||
# Generator for laborejo.org |
|||
|
|||
An assortment of scripts and programs that pulls in info from our repositories and puts out a website. |
|||
Everything is a low-tech as possible while avoiding editing redundant information (e.g. copyright |
|||
date on every individual page) |
|||
|
|||
This is specialized for our own website and *not* a general purpose CMS or static site generator. |
|||
|
|||
1. `generate.bash` |
|||
2. get out/ into your public html |
|||
3. ???? |
|||
4. profit |
|||
|
|||
|
|||
## Directories |
|||
|
|||
`static` holds the base structure and all non-generated files such as css and images. These files |
|||
do not get parsed, combined or modified but simply cp -r into `out`/. This is done as first step. |
|||
If you have conflicting files names later they will overwrite static files. |
|||
|
|||
`modules` are parts of static html that is the same on every page. |
|||
|
|||
`directcontent` texts and content exclusively for the website, like a welcome, are also found here. |
|||
These are not generated from projects but written directly in these files. Watch out for redundant |
|||
information. Dates, version numbers etc. should not be in here. |
|||
|
|||
|
|||
An assortment of scripts and programs that pulls in info from our repositories and puts out a website. |
|||
@ -0,0 +1,24 @@ |
|||
<div id="main"> |
|||
<div class="header"> |
|||
<h1><img class="pure-img-responsive" src="/images/software-suite.png" alt="Welcome to Laborejo Software Suite!"></h1> |
|||
</div> <!-- header --> |
|||
|
|||
<div class="content"> |
|||
<p> |
|||
Laborejo Software Suite is a group of programs to make music (and also the name of its main program). |
|||
Everything is free in every sense of the word: free of cost, free to share and use, free of |
|||
spyware or ads, free-and-open-source. |
|||
</p> |
|||
<p> |
|||
The programs have very different target groups. For example: while Laborejo itself is made for |
|||
advanced composers with classical background Patroneo is made specificially for beginners who |
|||
only know the very basics about music. |
|||
</p> |
|||
|
|||
<p><h2 class="content-subhead">Help and Support</h2></p> |
|||
<p>Every program has a comprehensive user manual in multiple languages.</p> |
|||
<p>You can write an e-mail to <a href="mailto:info@laborejo.org">info@laborejo.org</a> for any comment or question.</p> |
|||
<p>For bugs and issues a <a href="https://www.laborejo.org/bugs/">service</a> has been set up that works without registration. Thank you for your help to make our software better by reporting bugs.</p> |
|||
|
|||
</div> <!-- content --> |
|||
</div> <!-- main --> |
|||
@ -0,0 +1,89 @@ |
|||
#!/bin/bash |
|||
|
|||
set -euf -o pipefail #exit on fail, unset variables, file-globs/expansion and piping problems |
|||
|
|||
function finish { |
|||
read -n 1 -s -r -p "Press any key to continue" |
|||
} |
|||
trap finish EXIT |
|||
|
|||
ROOTPATH="$( cd "$(dirname "$0")" >/dev/null 2>&1 ; pwd -P )" |
|||
cd "$ROOTPATH" |
|||
echo Running from "$ROOTPATH" |
|||
|
|||
#Create initial structure and data-set |
|||
mkdir temp || true #in .gitignore . Make dir, ignore fail if exists for set -e |
|||
mkdir -p "out/images" || true #in .gitignore . Make dir, ignore fail if exists for set -e |
|||
rm -rf out/ |
|||
cp -r static out |
|||
cd temp |
|||
|
|||
#We loop over all projects several times, each stage of the generation. |
|||
#Instead of doing one project fully at a time, creating one giant nested loop. |
|||
#Administration first, the processing! |
|||
PROJECTS=(laborejo patroneo vico fluajho argodejo) #The order here is the order on the page. Each of these gets its own entry. |
|||
|
|||
#Gather and update data |
|||
for PROJECT in ${PROJECTS[*]} template |
|||
do |
|||
GIT="https://git.laborejo.org/lss/$PROJECT.git" |
|||
echo "$GIT" |
|||
|
|||
if [ -d "$PROJECT" ]; then |
|||
cd "$PROJECT" |
|||
git pull |
|||
cd .. |
|||
else |
|||
git clone "$GIT" |
|||
fi |
|||
done |
|||
cd "$ROOTPATH" #reset for next step |
|||
|
|||
|
|||
#Generate Menu. n^2 loop. For each project all projects |
|||
for PROJECT in ${PROJECTS[*]} |
|||
do |
|||
echo "" > "temp/$PROJECT/module_menu" #empty file |
|||
|
|||
#Index/Home is the same for all sub-pages. index is not included in the list so we do not care about the "this is the current page" highlight here. |
|||
echo "<li class='pure-menu-item'><a class='pure-menu-link' href='/'>Home</a></li>" >> "temp/$PROJECT/module_menu" #automatic newline |
|||
|
|||
for EACH in ${PROJECTS[*]} |
|||
do |
|||
TITLE=$(echo "$EACH" | sed 's/[^ ]\+/\L\u&/g') |
|||
if [ "$PROJECT" = "$EACH" ]; then |
|||
#Special line for ourselves |
|||
echo "<li class='pure-menu-item menu-item-divided pure-menu-selected'><a class='pure-menu-link' href='/$PROJECT/'>$TITLE</a></li>" >> "temp/$PROJECT/module_menu" #automatic newline |
|||
else |
|||
echo "<li class='pure-menu-item'><a class='pure-menu-link' href='/$EACH/'>$TITLE</a></li>" >> "temp/$PROJECT/module_menu" #automatic newline |
|||
fi |
|||
|
|||
done |
|||
done |
|||
|
|||
for PROJECT in ${PROJECTS[*]} |
|||
do |
|||
echo "" > "temp/$PROJECT/module_page" #empty file |
|||
|
|||
done |
|||
cd "$ROOTPATH" #reset for next step |
|||
|
|||
|
|||
#Combine Modules to real html in out/ |
|||
for PROJECT in ${PROJECTS[*]} |
|||
do |
|||
./projectinfo2modulepage.py "$PROJECT" > "temp/$PROJECT/module_page" |
|||
cat "modules/10head" "temp/$PROJECT/module_menu" "modules/20aftermenu" "temp/$PROJECT/module_page" "modules/90foot" > "out/$PROJECT.html" |
|||
done |
|||
|
|||
#Create Home/Welcome page |
|||
#A bit of redundancy first. Generate a menu. |
|||
echo "" > "temp/index_menu" #empty file |
|||
echo "<li class='pure-menu-item menu-item-divided pure-menu-selected'><a class='pure-menu-link' href='/'>Home</a></li>" >> "temp/index_menu" #automatic newline |
|||
for EACH in ${PROJECTS[*]} |
|||
do |
|||
TITLE=$(echo "$EACH" | sed 's/[^ ]\+/\L\u&/g') |
|||
echo "<li class='pure-menu-item'><a class='pure-menu-link' href='/$EACH/'>$TITLE</a></li>" >> "temp/index_menu" #automatic newline |
|||
done |
|||
#Home-Content |
|||
cat "modules/10head" "temp/index_menu" "modules/20aftermenu" "directcontent/index" "modules/90foot" > "out/index.html" |
|||
@ -0,0 +1,29 @@ |
|||
<!doctype html> |
|||
<html lang="en"> |
|||
<head> |
|||
<meta charset="utf-8"> |
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|||
<meta name="description" content="LSS is a group of programs to make music."> |
|||
|
|||
<title>Laborejo Software Suite</title> |
|||
|
|||
<link rel="stylesheet" href="css/pure-min.css"> |
|||
<link rel="stylesheet" href="css/layouts/side-menu.css"> |
|||
</head> |
|||
<body> |
|||
|
|||
<div id="layout"> |
|||
<!-- Menu toggle --> |
|||
<a href="#menu" id="menuLink" class="menu-link"> |
|||
<!-- Hamburger icon --> |
|||
<span></span> |
|||
</a> |
|||
|
|||
<nav> |
|||
<div id="menu"> |
|||
<div class="pure-menu"> |
|||
<p class="pure-menu-heading">MENU</p> |
|||
<ul class="pure-menu-list"> |
|||
|
|||
<!-- list of generated menu entries, with a selection-highlight for each page --> |
|||
|
|||
@ -0,0 +1,6 @@ |
|||
</ul> |
|||
</div> |
|||
</div> |
|||
</nav> |
|||
|
|||
<!-- Page Start --> |
|||
@ -0,0 +1,9 @@ |
|||
<!-- Page End --> |
|||
|
|||
|
|||
</div> |
|||
|
|||
<script src="./js/ui.js "></script> |
|||
|
|||
</body> |
|||
</html> |
|||
@ -0,0 +1,54 @@ |
|||
#! /usr/bin/env python3 |
|||
# -*- coding: utf-8 -*- |
|||
|
|||
""" |
|||
This file is called by generate.bash and will put out part of our website. |
|||
It pulls the info directly from the projects metada dict. Therefore we need this to be a python |
|||
script. |
|||
|
|||
The projects themselves are oblivious to any html website format and style. We can change the website |
|||
at any time as long as the data structures stay the same. |
|||
|
|||
Output is to stdout, we rely on bash piping in generate.bash to write a file. |
|||
|
|||
We expect a directory "temp" on our level with each project as lowercase name: |
|||
temp/fluajho |
|||
temp/patroneo |
|||
etc. |
|||
|
|||
The image file is a static file. At this point in time manually copied into the static/ dir |
|||
|
|||
""" |
|||
|
|||
import sys |
|||
|
|||
project = sys.argv[1] |
|||
config = __import__(f"temp.{project}.engine.config", fromlist=["METADATA"]) |
|||
META = config.METADATA |
|||
|
|||
assert META["shortName"] == project, (META["shortName"], project) |
|||
|
|||
htmlDescription = META["description"].replace("\n\n", "</p>\n\n<p>") |
|||
|
|||
template = f"""<div id="main"> |
|||
<div class="header"> |
|||
<h1><img class="pure-img-responsive" src="/images/{META["shortName"]}.png" alt="{META["name"]}"></h1> |
|||
</div> <!-- header --> |
|||
|
|||
<div class="content"> |
|||
<p>{htmlDescription}</p> |
|||
|
|||
<ul> |
|||
<li>Current Version: {META["version"]} ({META["year"]})</li> |
|||
<li>Multi-Language <a href="/documentation/{META["shortName"]}">Manual</a></li> |
|||
<li>Download: <a href="/downloads/{META["shortName"]}-{META["version"]}.tar.gz">Sourcecode</a> or <a href="/downloads">All Downloads</a></li> |
|||
<li>Bugs and Issues: <a href="https://www.laborejo.org/bugs">https://www.laborejo.org/bugs</a> |
|||
<li>Git and Developers README: <a href="http://git.laborejo.org/lss/{META["shortName"]}.git">https://git.laborejo.org/lss/{META["shortName"]}.git</a></li> |
|||
</ul> |
|||
|
|||
</div> <!-- content --> |
|||
</div> <!-- main --> |
|||
""" |
|||
|
|||
print (template) #stdout. our job is done |
|||
|
|||
@ -0,0 +1,24 @@ |
|||
RewriteEngine On |
|||
RewriteCond %{HTTPS} !=on |
|||
RewriteCond %{ENV:HTTPS} !=on |
|||
RewriteRule .* https://%{SERVER_NAME}%{REQUEST_URI} [R=301,L] |
|||
|
|||
#Remove html extension. |
|||
#RewriteRule ^([^\.]+)$ $1.html [NC,L] |
|||
|
|||
#Remove extension and add trailing slash |
|||
RewriteEngine On |
|||
RewriteCond %{REQUEST_FILENAME} !-f |
|||
RewriteRule ^([^/]+)/$ $1.html |
|||
RewriteRule ^([^/]+)/([^/]+)/$ /$1/$2.html |
|||
RewriteCond %{REQUEST_FILENAME} !-f |
|||
RewriteCond %{REQUEST_FILENAME} !-d |
|||
RewriteCond %{REQUEST_URI} !(\.[a-zA-Z0-9]{1,5}|/)$ |
|||
RewriteRule (.*)$ /$1/ [R=301,L] |
|||
|
|||
|
|||
#Old URLs. Don't use them anymore publically. |
|||
Redirect /patroneo.git https://git.laborejo.org/lss/patroneo |
|||
Redirect /laborejo.git https://git.laborejo.org/lss/laborejo |
|||
Redirect /fluajhjo.git https://git.laborejo.org/lss/fluajho |
|||
Redirect /vico.git https://git.laborejo.org/lss/vico |
|||
@ -0,0 +1,248 @@ |
|||
body { |
|||
color: #777; |
|||
} |
|||
|
|||
.pure-img-responsive { |
|||
max-width: 100%; |
|||
height: auto; |
|||
} |
|||
|
|||
/* |
|||
Add transition to containers so they can push in and out. |
|||
*/ |
|||
#layout, |
|||
#menu, |
|||
.menu-link { |
|||
-webkit-transition: all 0.2s ease-out; |
|||
-moz-transition: all 0.2s ease-out; |
|||
-ms-transition: all 0.2s ease-out; |
|||
-o-transition: all 0.2s ease-out; |
|||
transition: all 0.2s ease-out; |
|||
} |
|||
|
|||
/* |
|||
This is the parent `<div>` that contains the menu and the content area. |
|||
*/ |
|||
#layout { |
|||
position: relative; |
|||
left: 0; |
|||
padding-left: 0; |
|||
} |
|||
#layout.active #menu { |
|||
left: 150px; |
|||
width: 150px; |
|||
} |
|||
|
|||
#layout.active .menu-link { |
|||
left: 150px; |
|||
} |
|||
/* |
|||
The content `<div>` is where all your content goes. |
|||
*/ |
|||
.content { |
|||
margin: 0 auto; |
|||
padding: 0 2em; |
|||
max-width: 800px; |
|||
margin-bottom: 50px; |
|||
line-height: 1.6em; |
|||
} |
|||
|
|||
.header { |
|||
margin: 0; |
|||
color: #333; |
|||
text-align: center; |
|||
padding: 2.5em 2em 0; |
|||
border-bottom: 1px solid #eee; |
|||
} |
|||
.header h1 { |
|||
margin: 0.2em 0; |
|||
font-size: 3em; |
|||
font-weight: 300; |
|||
} |
|||
.header h2 { |
|||
font-weight: 300; |
|||
color: #ccc; |
|||
padding: 0; |
|||
margin-top: 0; |
|||
} |
|||
|
|||
.content-subhead { |
|||
margin: 50px 0 20px 0; |
|||
font-weight: 300; |
|||
color: #888; |
|||
} |
|||
|
|||
|
|||
|
|||
/* |
|||
The `#menu` `<div>` is the parent `<div>` that contains the `.pure-menu` that |
|||
appears on the left side of the page. |
|||
*/ |
|||
|
|||
#menu { |
|||
margin-left: -150px; /* "#menu" width */ |
|||
width: 150px; |
|||
position: fixed; |
|||
top: 0; |
|||
left: 0; |
|||
bottom: 0; |
|||
z-index: 1000; /* so the menu or its navicon stays above all content */ |
|||
background: #191818; |
|||
overflow-y: auto; |
|||
-webkit-overflow-scrolling: touch; |
|||
} |
|||
/* |
|||
All anchors inside the menu should be styled like this. |
|||
*/ |
|||
#menu a { |
|||
color: #999; |
|||
border: none; |
|||
padding: 0.6em 0 0.6em 0.6em; |
|||
} |
|||
|
|||
/* |
|||
Remove all background/borders, since we are applying them to #menu. |
|||
*/ |
|||
#menu .pure-menu, |
|||
#menu .pure-menu ul { |
|||
border: none; |
|||
background: transparent; |
|||
} |
|||
|
|||
/* |
|||
Add that light border to separate items into groups. |
|||
*/ |
|||
#menu .pure-menu ul, |
|||
#menu .pure-menu .menu-item-divided { |
|||
border-top: 1px solid #333; |
|||
} |
|||
/* |
|||
Change color of the anchor links on hover/focus. |
|||
*/ |
|||
#menu .pure-menu li a:hover, |
|||
#menu .pure-menu li a:focus { |
|||
background: #333; |
|||
} |
|||
|
|||
/* |
|||
This styles the selected menu item `<li>`. |
|||
*/ |
|||
#menu .pure-menu-selected, |
|||
#menu .pure-menu-heading { |
|||
background: #1f8dd6; |
|||
} |
|||
/* |
|||
This styles a link within a selected menu item `<li>`. |
|||
*/ |
|||
#menu .pure-menu-selected a { |
|||
color: #fff; |
|||
} |
|||
|
|||
/* |
|||
This styles the menu heading. |
|||
*/ |
|||
#menu .pure-menu-heading { |
|||
font-size: 110%; |
|||
color: #fff; |
|||
margin: 0; |
|||
} |
|||
|
|||
/* -- Dynamic Button For Responsive Menu -------------------------------------*/ |
|||
|
|||
/* |
|||
The button to open/close the Menu is custom-made and not part of Pure. Here's |
|||
how it works: |
|||
*/ |
|||
|
|||
/* |
|||
`.menu-link` represents the responsive menu toggle that shows/hides on |
|||
small screens. |
|||
*/ |
|||
.menu-link { |
|||
position: fixed; |
|||
display: block; /* show this only on small screens */ |
|||
top: 0; |
|||
left: 0; /* "#menu width" */ |
|||
background: #000; |
|||
background: rgba(0,0,0,0.7); |
|||
font-size: 10px; /* change this value to increase/decrease button size */ |
|||
z-index: 10; |
|||
width: 2em; |
|||
height: auto; |
|||
padding: 2.1em 1.6em; |
|||
} |
|||
|
|||
.menu-link:hover, |
|||
.menu-link:focus { |
|||
background: #000; |
|||
} |
|||
|
|||
.menu-link span { |
|||
position: relative; |
|||
display: block; |
|||
} |
|||
|
|||
.menu-link span, |
|||
.menu-link span:before, |
|||
.menu-link span:after { |
|||
background-color: #fff; |
|||
width: 100%; |
|||
height: 0.2em; |
|||
} |
|||
|
|||
.menu-link span:before, |
|||
.menu-link span:after { |
|||
position: absolute; |
|||
margin-top: -0.6em; |
|||
content: " "; |
|||
} |
|||
|
|||
.menu-link span:after { |
|||
margin-top: 0.6em; |
|||
} |
|||
|
|||
|
|||
/* -- Responsive Styles (Media Queries) ------------------------------------- */ |
|||
|
|||
/* |
|||
Hides the menu at `48em`, but modify this based on your app's needs. |
|||
*/ |
|||
@media (min-width: 48em) { |
|||
|
|||
.header, |
|||
.content { |
|||
padding-left: 2em; |
|||
padding-right: 2em; |
|||
} |
|||
|
|||
#layout { |
|||
padding-left: 150px; /* left col width "#menu" */ |
|||
left: 0; |
|||
} |
|||
#menu { |
|||
left: 150px; |
|||
} |
|||
|
|||
.menu-link { |
|||
position: fixed; |
|||
left: 150px; |
|||
display: none; |
|||
} |
|||
|
|||
#layout.active .menu-link { |
|||
left: 150px; |
|||
} |
|||
} |
|||
|
|||
@media (max-width: 48em) { |
|||
/* Only apply this when the window is small. Otherwise, the following |
|||
case results in extra padding on the left: |
|||
* Make the window small. |
|||
* Tap the menu to trigger the active state. |
|||
* Make the window large again. |
|||
*/ |
|||
#layout.active { |
|||
position: relative; |
|||
left: 150px; |
|||
} |
|||
} |
|||
File diff suppressed because one or more lines are too long
@ -0,0 +1,8 @@ |
|||
#Logo Images Origin |
|||
|
|||
The original .svg sources are in a private repository for copyright reasons. |
|||
See out/web , there. |
|||
|
|||
The websites logos and images are created statically and copied here, by hand. |
|||
|
|||
|
|||
|
After Width: | Height: | Size: 8.7 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 9.5 KiB |
|
After Width: | Height: | Size: 7.3 KiB |
@ -0,0 +1,46 @@ |
|||
(function (window, document) { |
|||
|
|||
var layout = document.getElementById('layout'), |
|||
menu = document.getElementById('menu'), |
|||
menuLink = document.getElementById('menuLink'), |
|||
content = document.getElementById('main'); |
|||
|
|||
function toggleClass(element, className) { |
|||
var classes = element.className.split(/\s+/), |
|||
length = classes.length, |
|||
i = 0; |
|||
|
|||
for(; i < length; i++) { |
|||
if (classes[i] === className) { |
|||
classes.splice(i, 1); |
|||
break; |
|||
} |
|||
} |
|||
// The className is not found
|
|||
if (length === classes.length) { |
|||
classes.push(className); |
|||
} |
|||
|
|||
element.className = classes.join(' '); |
|||
} |
|||
|
|||
function toggleAll(e) { |
|||
var active = 'active'; |
|||
|
|||
e.preventDefault(); |
|||
toggleClass(layout, active); |
|||
toggleClass(menu, active); |
|||
toggleClass(menuLink, active); |
|||
} |
|||
|
|||
menuLink.onclick = function (e) { |
|||
toggleAll(e); |
|||
}; |
|||
|
|||
content.onclick = function(e) { |
|||
if (menu.className.indexOf('active') !== -1) { |
|||
toggleAll(e); |
|||
} |
|||
}; |
|||
|
|||
}(this, this.document)); |
|||
Loading…
Reference in new issue