system-installer/system-installer-daemon
1
1
Fork 0
Code Issues 14 Pull Requests Actions Packages Projects Releases Wiki Activity

Update ui a bit more

Browse Source
This commit is contained in:
Jonathan Carter
2024-12-05 12:01:16 +02:00
parent 6a2dfbbde5
commit 6a5905374d
10 changed files with 105 additions and 237 deletions
Download Patch File Download Diff File Expand all files Collapse all files

96
src/applets/disks/disks.html
View File

@@ -1,31 +1,9 @@
{% extends "layout.html" %} {% extends "layout.html" %}
{% block body %} {% block body %}
<div style="width: 1000px; font-family: Noto Sans;"> <div style="width: 1000px; height: 100%;">
<div class="pywebview-drag-regioni"> <!-- Header --> <p><b>How would you like to install Debian?</b></p>
<span>
<h1 class="is-size-4"> <button class="button is-link"> ☰ </button>&nbsp; System Installer - Disks and Partitions <button class="button is-danger" style="float: right;"> 🗙 </button> </h1>
</span>
</div> <!-- Header -->
<div> <!-- Disks and Partitions Content -->
<br>
<div class="tabs" style="padding-left: 0px;">
<uli>
<button class="button is-dark"><a href="/welcome">Welcome</a></button>
<button class="button is-dark"><a href="/users">Users</a></button>
<button class="button is-success"><a href="/disks">Disks</a></button>
<button class="button is-dark"><a href="/software">Software</a></button>
<button class="button is-dark"><a href="/summary">Summary</a></button>
</ul>
</div>
<br>
<p> How would you like to install Debian?</p>
<br> <br>
@@ -46,42 +24,11 @@
<br> <br>
<p> There are {{ blockdevs["blockdevices"]|count }} block devices detected. </p>
<p> They are </p>
<br>
{% for disk in blockdevs["blockdevices"] %}
<p> Diskname: {{ disk['name'] }} </p>
<p> Model: {{ disk['model'] }} </p>
<p> Serial: {{ disk['serial'] }} </p>
<p> Removable: {{ disk['rm'] }} </p>
<p> Size: {{ (disk['size'] | int) / 1024000000 | round(2) }} GiB </p>
<p> ID: {{disk['id'] }} </p>
<p> pttype: {{disk['pttype'] }} </p>
<p> Maj:min: {{disk['maj:min']}} </p>
<p> phy-sec: {{ disk['phy-sec'] }}. log-sec: {{ disk['log-sec'] }} </p>
<p> There are {{ disk['children']|count }} Children </p>
{% for child in disk['children'] %}
<br>
<p> Name: {{ child['name'] }}. Path: {{ child['path'] }}. {{ child['size'] }}. Block: {{ child['subsystems'] }} {{ child['maj:min'] }} {{ child['type'] }} </p>
<p> Fstype: {{ child['fstype'] }}. Label: {{ child['label'] }}. Rota: {{ child['rota'] }}</p>
<p> Parttypename: {{ child['parttypename'] }}
<br>
{% endfor %}
<br>
{% endfor %}
<div class="columns" width="100%"> <div class="columns" width="100%">
<div class="column"><p> Proposed layout: </p></div> <div class="column"><p> Proposed layout: </p></div>
<div class="column is-link"><button> + </button></div> <div class="column is-link"><button class="button iis-info"> <img src="/static/icons/tab-new-symbolic.svg"> &nbsp; Add Disk or Filesystem </button></div>
</div> </div>
<!-- Add Undetected Disk
Add Virtual Filesystem
Add Network Filesystem -->
<div style=""> <!-- partition bars --> <div style=""> <!-- partition bars -->
<div style="background-color: gray; padding: 10px; border-radius: 10px;"> <div style="background-color: gray; padding: 10px; border-radius: 10px;">
<p> <span style="width: 100%;" class="tag is-black">Physical disk: TOSHIBA HDWD120 (2000 GB) <br> <p> <span style="width: 100%;" class="tag is-black">Physical disk: TOSHIBA HDWD120 (2000 GB) <br>
<div class="columns"> <div class="columns">
@@ -129,11 +76,41 @@
</div> </div>
</div> </div>
</div> </div>
<br><br>
</div> <!-- end partition bars --> </div> <!-- end partition bars -->
<br>
<p> There are {{ blockdevs["blockdevices"]|count }} block devices detected. </p>
<p> They are </p>
<br>
{% for disk in blockdevs["blockdevices"] %}
<p> Diskname: {{ disk['name'] }} </p>
<p> Model: {{ disk['model'] }} </p>
<p> Serial: {{ disk['serial'] }} </p>
<p> Removable: {{ disk['rm'] }} </p>
<p> Size: {{ (disk['size'] | int) / 1024000000 | round(2) }} GiB </p>
<p> ID: {{disk['id'] }} </p>
<p> pttype: {{disk['pttype'] }} </p>
<p> Maj:min: {{disk['maj:min']}} </p>
<p> phy-sec: {{ disk['phy-sec'] }}. log-sec: {{ disk['log-sec'] }} </p>
<p> There are {{ disk['children']|count }} Children </p>
{% for child in disk['children'] %}
<br>
<p> Name: {{ child['name'] }}. Path: {{ child['path'] }}. {{ child['size'] }}. Block: {{ child['subsystems'] }} {{ child['maj:min'] }} {{ child['type'] }} </p>
<p> Fstype: {{ child['fstype'] }}. Label: {{ child['label'] }}. Rota: {{ child['rota'] }}</p>
<p> Parttypename: {{ child['parttypename'] }}
<br>
{% endfor %}
<br>
{% endfor %}
<!-- Add Undetected Disk
Add Virtual Filesystem
Add Network Filesystem -->
<div> <!-- Disks and Partitions Content --> <div> <!-- Disks and Partitions Content -->
<br><br> <br><br>
@@ -151,7 +128,6 @@
</div> </div>
</div> </div>
</div> </div>
{% endblock %} {% endblock %}

2
src/applets/disks/routes.py
View File

@@ -3,7 +3,7 @@ from flask import Flask, request, session, redirect, \
url_for, render_template, flash, Blueprint url_for, render_template, flash, Blueprint
import dmm.lsblk as lsblk import dmm.lsblk as lsblk
@bp.route('/disks/') @bp.route('/disks')
def disks(): def disks():
""" """
Disks screen for the webui. Disks screen for the webui.

19
src/applets/software/software.html
View File

@@ -1,24 +1,9 @@
{% extends "layout.html" %} {% extends "layout.html" %}
{% block body %} {% block body %}
<h1 class="is-size-3"> Select Software </h1> <div style="width: 1000px; font-family: Noto Sans;">
<br> <p> <b> Would you like fries with that? </b></p>
<div class="tabs">
<ul>
<li><a href="/welcome">Welcome</a></li>
<li><a href="/users">Users</a></li>
<li><a href="/disks">Disks</a></li>
<li class="is-active"><a href="/software">Software</a></li>
<li><a href="/summary">Summary</a></li>
</ul>
</div>
<br>
<p> Would you like fries with that?</p>
<br> <br>

39
src/applets/summary/summary.html
View File

@@ -1,36 +1,9 @@
<!doctype html> {% extends "layout.html" %}
<html> {% block body %}
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="/static/bulma.css" rel="stylesheet">
<link href="/static/welcome.css" rel="stylesheet">
</head>
<body>
<div class="bg"></div> <div style="width: 1000px; height: 100%;">
<div style="min-height: 80%; left: 22%; right: 22%; top: 50px; bottom: 50px; position: absolute; width:1000px;" class="container"> <p><b> Ready to install! Please review all changes.</b></p>
<div class="notification is-dark">
<h1 class="is-size-3"> Summary </h1>
<br>
<div class="tabs">
<ul>
<li><a href="./welcome">Welcome</a></li>
<li><a href="./users">Users</a></li>
<li><a href="./disks">Disks</a></li>
<li><a href="./software">Software</a></li>
<li class="is-active"><a href="./summary">Summary</a></li>
</ul>
</div>
<br>
<p> Ready to install.</p>
<br> <br>
@@ -41,8 +14,8 @@
<a href="./install"><div class="column"><button class="button is-link">Start Install</button></div></a> <a href="./install"><div class="column"><button class="button is-link">Start Install</button></div></a>
</div> </div>
</div>
</div> </div>
</div> </div>
</body> {% endblock %}
</html>

46
src/applets/users/users.html
View File

@@ -1,43 +1,18 @@
<!doctype html> {% extends "layout.html" %}
<html> {% block body %}
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="/static/bulma.css" rel="stylesheet">
<link href="/static/welcome.css" rel="stylesheet">
</head>
<body>
<div class="bg"></div> <div style="width: 1000px; font-family: Noto Sans;">
<div style="min-height: 80%; left: 22%; right: 22%; top: 50px; bottom: 50px; position: absolute; width:1000px;" class="container"> <p><b> Let's set up an initial user. </b></p>
<div class="notification is-dark">
<h1 class="is-size-3"> Configure User </h1>
<br> <br>
<img src="/static/icons/avatar-default.svg" width="160px" style="float: left; position: absolute;" />
<div class="tabs"> <div style="margin-left: 180px;">
<ul>
<li><a href="./welcome">Welcome</a></li>
<li class="is-active"><a href="./users">Users</a></li>
<li><a href="./disks">Disks</a></li>
<li><a href="./software">Software</a></li>
<li><a href="./summary">Summary</a></li>
</ul>
</div>
<br>
<p> Let's set up an initial user.</p>
<br>
<div class="field"> <div class="field">
<label>Full Name</label> <label>Full Name</label> <div class="control"><input class="input" type="text" placeholder="Text input">
<div class="control">
<input class="input" type="text" placeholder="Text input">
</div> </div>
</div> </div>
@@ -69,6 +44,8 @@
</div> </div>
</div> </div>
</div> <!-- style 180 -->
<br><br> <br><br>
<div class="columns"> <div class="columns">
@@ -79,5 +56,6 @@
</div> </div>
</div> </div>
</body> </div>
</html>
{% endblock %}

53
src/applets/welcome/welcome.html
View File

@@ -1,47 +1,19 @@
<!doctype html> {% extends "layout.html" %}
<html> {% block body %}
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="/static/bulma.css" rel="stylesheet">
<link href="/static/welcome.css" rel="stylesheet">
</head>
<body>
<div class="bg"></div> <div style="width: 1000px; height: 100%; font-family: Noto Sans;">
<p><b>Welcome! This setup program will install Debian on to your system.</b></p>
<div style="min-height: 80%; left: 22%; right: 22%; top: 50px; bottom: 50px; position: absolute; width:1000px;" class="container">
<div class="notification is-dark">
<h1 class="is-size-3"> Welcome to System Installer </h1>
<br> <br>
<div class="columns" style="text-align: center;">
<div class="tabs">
<ul>
<li class="is-active"><a href="./welcome">Welcome</a></li>
<li><a href="./users">Users</a></li>
<li><a href="./disks">Disks</a></li>
<li><a href="./software">Software</a></li>
<li><a href="./summary">Summary</a></li>
</ul>
</div>
<br>
<p> Welcome! This setup program will install Debian on to your system.</p>
<br>
<div class="columns">
<div class="column"> <div class="column">
<img src="/static/icons/keyboard.svg" width="180px" /> <img src="/static/icons/keyboard.svg" style="fill: white;" width="180px" />
<div class="control is-link"> <div class="control is-link" width="180px">
<div class="select"> <div class="select">
<select> <select style="width: 180px">
<option>English</option> <option>English</option>
<option>Afrikaans</option> <option>Afrikaans</option>
</select> </select>
@@ -55,7 +27,7 @@
<img src="/static/icons/keyboard.svg" width="180px" /> <img src="/static/icons/keyboard.svg" width="180px" />
<div class="control is-link"> <div class="control is-link">
<div class="select"> <div class="select">
<select> <select style="width: 180px">
<option>en-us</option> <option>en-us</option>
<option>en-uk</option> <option>en-uk</option>
</select> </select>
@@ -69,7 +41,7 @@
<img src="/static/icons/keyboard.svg" width="180px" /> <img src="/static/icons/keyboard.svg" width="180px" />
<div class="control is-link"> <div class="control is-link">
<div class="select"> <div class="select">
<select> <select style="width: 180px">
<option>Africa/Johannesburg</option> <option>Africa/Johannesburg</option>
<option>UTC</option> <option>UTC</option>
</select> </select>
@@ -79,7 +51,7 @@
</div> <!-- end columns --> </div> <!-- end columns -->
<br><br><br><br><br><br> <br><br><br><br><br><br<br><br>
<div class="columns"> <div class="columns">
<div class="column"><button class="button is-light">Quit</button></div> <div class="column"><button class="button is-light">Quit</button></div>
@@ -89,5 +61,4 @@
</div> </div>
</div> </div>
</body> {% endblock %}
</html>

28
src/static/welcome.css
View File

@@ -1,21 +1,13 @@
@mixin glassmorphism() {
background: rgba(255,255,255,0.05);
backdrop-filter: blur(10px);
}
.bg {
position: absolute;
z-index:-1;
top:0;
right:0;
bottom:0;
left:0;
background-image: radial-gradient(circle at 30% 86%, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.03) 8%,transparent 8%, transparent 92%),radial-gradient(circle at 55% 100%, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.03) 8%,transparent 8%, transparent 92%),radial-gradient(circle at 40% 75%, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.03) 6%,transparent 6%, transparent 94%),radial-gradient(circle at 7% 99%, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.03) 6%,transparent 6%, transparent 94%),radial-gradient(circle at 69% 76%, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.03) 6%,transparent 6%, transparent 94%),radial-gradient(circle at 2% 35%, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.03) 6%,transparent 6%, transparent 94%),radial-gradient(circle at 14% 48%, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.03) 6%,transparent 6%, transparent 94%),radial-gradient(circle at 28% 87%, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.04) 4%,transparent 4%, transparent 96%),radial-gradient(circle at 65% 14%, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.04) 4%,transparent 4%, transparent 96%),radial-gradient(circle at 51% 36%, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.04) 4%,transparent 4%, transparent 96%),radial-gradient(circle at 6% 93%, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.04) 4%,transparent 4%, transparent 96%),linear-gradient(135deg, rgb(23, 233, 173),rgb(29, 24, 208));
}
body { body {
display: flex; display: flex;
border-radius: 15px; font-family: Noto Sans;
min-width: 1150px;
min-height: 600px;
overflow: hidden;
} }
html {
/* Overwrite the white that is set by bulma.css */
background-color: transparent;
}

36
src/system-installer-daemon.py
View File

@@ -1,10 +1,8 @@
#!/usr/bin/env python3 #!/usr/bin/env python3
""" """
Welcome to SID - The System Installer Daemon! Welcome to SID - The System Installer Daemon!
""" """
from flask import Flask, request, session, redirect, \ from flask import Flask, request, session, redirect, \
url_for, render_template, flash, Blueprint url_for, render_template, flash, Blueprint
from waitress import serve from waitress import serve
@@ -15,33 +13,28 @@ import importlib
# configuration # configuration
VERSION = "0.00" VERSION = "0.00"
SECRET_KEY = "exampls" SECRET_KEY = "exampls"
DEV_MODE = 1 DEV_MODE = True
APPS = "main welcome users disks software summary" APPS = "main welcome users disks software summary"
if DEV_MODE == 1: if DEV_MODE:
print("Note: Starting in devmode!") print("Note: Starting in devmode!")
DEBUG = True DEBUG = True
tracebacks = True
# create our application in flask # create our application in flask
app = Flask(__name__) app = Flask(__name__)
app.config.from_object(__name__) app.config.from_object(__name__)
# Register blueprints here # Register blueprints here
for APP in APPS.split(" "): for APP in APPS.split(" "):
print(f"Loading applet: {APP} ") print(f"Loading applet: {APP} ")
# Dynamically import the blueprint module # Dynamically import the blueprint module
module = importlib.import_module(f"applets.{APP}") module = importlib.import_module(f"applets.{APP}")
# Get the blueprint (bp) from the imported module # Get the blueprint (bp) from the imported module
bp = getattr(module, "bp") bp = getattr(module, "bp")
# Register the blueprint with the app # Register the blueprint with the app
app.register_blueprint(bp) app.register_blueprint(bp)
# configure logs # configure logs
# logging.basicConfig() # logging.basicConfig()
logger = logging.getLogger('waitress') logger = logging.getLogger('waitress')
@@ -49,22 +42,9 @@ if DEV_MODE == "1":
logger.setLevel(logging.DEBUG) logger.setLevel(logging.DEBUG)
logger.debug("logger set to DEBUG") logger.debug("logger set to DEBUG")
# Justtry doing something with dmm
lsblk.list_scsi_devices()
if __name__ == '__main__': if __name__ == '__main__':
if DEV_MODE: serve(app,
serve(app, host='0.0.0.0',
host='0.0.0.0', port=8080,
port=8080, url_scheme='http',
url_scheme='http', expose_tracebacks=DEV_MODE)
expose_tracebacks=True)
else:
serve(app,
host='0.0.0.0',
port=8080,
url_scheme='https',
expose_tracebacks=False)

15
src/templates/header.html Normal file
View File

@@ -0,0 +1,15 @@
<!-- Header -->
<div id="titlebar" class="pywebview-drag-region">
<span>
<button class="button is-link"> ☰ </button>
<a href="/welcome"><button class="button is-{% if request.path == "/welcome" %}info{% else %}dark{% endif %}">Welcome</button></a>
<a href="/users"><button class="button is-{% if request.path == "/users" %}info{% else %}dark{% endif %}">Users</button></a>
<a href="/disks"><button class="button is-{% if request.path == "/disks" %}info{% else %}dark{% endif %}">Disks</button></a>
<a href="/software"><button class="button is-{% if request.path == "/software" %}info{% else %}dark{% endif %}">Software</button></a>
<a href="/summary"><button class="button is-{% if request.path == "/summary" %}info{% else %}dark{% endif %}">Summary</button></a>
<a href="/quit"> <button class="button is-danger" style="float: right;"> 🗙 </button></a>
<a href="/help"> <button class="button is-light" style="float: right; margin-right: 5px;"> <b> ? </b> </button></a>
</span>
</div> <!-- end pywebview-drag-region -->
<br>
<!-- End Header -->

8
src/templates/layout.html
View File

@@ -7,13 +7,11 @@
<link href="/static/welcome.css" rel="stylesheet"> <link href="/static/welcome.css" rel="stylesheet">
<script src="/static/htmx.min.js" crossorigin="anonymous"></script> <script src="/static/htmx.min.js" crossorigin="anonymous"></script>
</head> </head>
<body style="background-color: transparent; border-radius: 50px;"> <body>
<!--div class="bg"></div> --> <div style="border-radius: 10px; padding: 12px;" class="notification is-dark">
<!--div style="min-height: 80%; left: 22%; right: 22%; top: 50px; bottom: 50px; position: absolute; width:1000px; height:800;" class="container" -->
<div class="notification is-dark">
{% include "header.html" %}
{% block body %} {% block body %}
{% endblock %} {% endblock %}