Commit recent changes

Add erase confirm screen
Commit previous changes
2026-03-14 15:14:37 +02:00 · 2026-03-10 15:43:34 +02:00 · 2026-03-10 15:43:14 +02:00 · 2026-02-16 19:06:32 +02:00 · 2026-02-04 09:09:00 +02:00 · 2026-01-14 13:47:36 +02:00
39 changed files with 706 additions and 174 deletions
--- a/README.md
+++ b/README.md
@@ -17,6 +17,12 @@ Recommended:
 - sass-stylesheets-bulma (needed if the web front-end is to be used)
 - libxapp-gtk3-module

+On Debian-based systems, you should get everything with the following:
+
+```
+apt install python3-flask python3-command-runner  python3-pytest python3-dmm gettext libjs-htmx sass-stylesheets-bulma fonts-fork-awesome
+```
+
 ## Development

 **Please Note:** This project is in early development, and if you have stumbled across this page, please note that it is nowhere near ready for production use yet. Hopefully that changes over the next few months!
--- a/src/.gitignore
+++ b/src/.gitignore
@@ -0,0 +1,2 @@
+__pycache__
+.swp
--- a/src/yasi-webclient
+++ b/src/yasi-webclient
@@ -4,6 +4,14 @@ import webview

 LOCATION = "http://localhost:9274/welcome"

+class Api():
+    def log(self, value):
+        print(value)
+        
+    def close(self):
+        window.destroy()
+
+
 def on_closed():
    """
    Actions to take when System Installer is closed.
@@ -12,15 +20,17 @@ def on_closed():


 window = webview.create_window('System Installer', LOCATION,
-                      transparent=True, easy_drag=True, frameless=True,
-                      width=1050, focus=True, zoomable=True,
-                      confirm_close=True, resizable=True, shadow=True
+                      transparent=True, easy_drag=False, frameless=True,
+                      width=1050, height=650, focus=True, zoomable=True,
+                      confirm_close=False, resizable=True, shadow=True,
+                      text_select=False, draggable=True, js_api=Api()
                      )

 webview.settings = {
  'ALLOW_DOWNLOADS': False,
  'ALLOW_FILE_URLS': False,
-  'DRAG_REGION_SELECTOR': 'pywebview-drag-region',
+  'DRAG_REGION_SELECTOR': '.pywebview-drag-region',
+  'DRAG_REGION_DIRECT_TARGET_ONLY': True,
  'OPEN_EXTERNAL_LINKS_IN_BROWSER': True,
  'OPEN_DEVTOOLS_IN_DEBUG': True,
  'IGNORE_SSL_ERRORS': False,
@@ -28,5 +38,13 @@ webview.settings = {
  'SHOW_DEFAULT_MENUS': True
 }

+
+def custom_logic(window):
+    pass
+    #window.toggle_fullscreen()
+    #window.evaluate_js('alert("Nice one brother")')
+    #window.destroy()
+
 window.events.closed += on_closed
-webview.start(icon='/usr/share/icons/yasi.png')
+#webview.start(icon='/usr/share/icons/yasi.png')
+webview.start(custom_logic, window)
--- a/src/yasi_applets/disks/init.py
+++ b/src/yasi_applets/disks/init.py
@@ -1,7 +1,9 @@
 from flask import Blueprint

 bp = Blueprint('disks', __name__,
-               template_folder='')
+               template_folder='',
+               static_folder='static',
+               static_url_path='/disks/static')

 from yasi_applets.disks import routes

--- a/src/yasi_applets/disks/pycache/init.cpython-312.pyc
+++ b/src/yasi_applets/disks/pycache/init.cpython-312.pyc
--- a/src/yasi_applets/disks/pycache/init.cpython-313.pyc
+++ b/src/yasi_applets/disks/pycache/init.cpython-313.pyc
--- a/src/yasi_applets/disks/pycache/routes.cpython-312.pyc
+++ b/src/yasi_applets/disks/pycache/routes.cpython-312.pyc
--- a/src/yasi_applets/disks/disks_advanced.html
+++ b/src/yasi_applets/disks/disks_advanced.html
@@ -1,36 +1,7 @@
 {% extends "layout.html" %}
 {% block body %}

-<div style="">
-
-<p><b>How would you like to install Debian?</b></p>
-
 <br>
-
-<div class="radios">
-  <label class="radio">
-    <input selected type="radio" name="rsvp" />
-    Preconfigured partitioning &nbsp;
-<!-- Let's hide these babies for the initial release.
-  <label class="radio">
-    <input type="radio" name="rsvp" disabled />
-    Erase entire disk
-  </label>
-  <label class="radio">
-    <input type="radio" name="rsvp" disabled />
-    Install alongside another operating system
-  </label>
-  <label class="radio">
-    <input type="radio" name="rsvp" disabled />
-    Edit existing partitions
-  </label>
-</div>
-->
-
-<div class="columns" width="100%">
-	<div class="column"><p> <br>Current layout: </p></div>
-</div>
-
 <!--
 <div style=""> 
 <div style="background-color: gray; padding: 4px 6px 7px 6px; border-radius: 10px;">
@@ -66,7 +37,7 @@
 -->


-{% for disk in blockdevs["blockdevices"] if disk["name"] != "zram0" and disk["name"] != "loop0" and disk["name"] != "sr0" %} 
+{% for disk in blockdevs["blockdevices"] if disk["name"] != "zram0" and "loop" not in disk["name"] and disk["name"] != "sr0" %} 

 <!--
 <h1> Raw data </h1>
@@ -88,33 +59,57 @@ fssize: {{ child['fssize'] }}
 <div style=""> <!-- partition bars -->
 <div style="background-color: gray; padding: 4px 6px 7px 6px; border-radius: 10px;">
 <p> <span style="width: 100%; border-radius: 8px 8px 0 0;" class="tag is-black">
-    <small><small>{{ disk['name'] }} ({{(disk['size']/1024000000)|round(0)|int }} GB) - Serial: {{ disk['serial'] }}</small></small>
-<div class="columns">
-{% for child in disk['children'] %}
-  <a hx-get="/disks/partition/{{ child['name'] }}" hx-swap="outerHTML"/>
-  <div class="column is-narrow is-primary">
-    <div class="box" style="min-width: 220px; border-radius: 0 0 0px 5px; height: 60px; padding-top: 5px;">
-    <p class="is-tiny">{{ child['name'] }} ({{ (child['size']/1024000000)|round(2) }} GiB)  </p>
-    <p class="title is-5"><span class="tag is-black">{{ child['mountpoint'] }}</span>
-    <span class="tag is-link">{{ child['fstype'] }}</span>
-    </p>
-    </div>
-  </div>
-  </a>
-{% endfor %}
+	<b>{{ disk['name'] }}: &nbsp; </b>  {{ disk['model'] }} - {{ disk['tran'] }} disk ({{(disk['size']/1024000000)|round(0)|int }} GB) - Serial: {{ disk['serial'] }} </p>
+    <center style="padding: 5px; padding-bottom: 5px;">
+     <td><a hx-get="/disks/details/{{ disk['name'] }}" hx-swap="outerHTML"><span class="tag is-link"> Disk Details </span></a></td>
+      <td><a hx-get="/disks/wipe_table/{{ disk['name'] }}" hx-swap="outerHTML"><span class="tag is-link"> Wipe Disk </span></a></td>
+      <td><a hx-get="/disks/new_partition/{{ disk['name'] }}" hx-swap="outerHTML"><span class="tag is-link"> New Partition </span></a></td>
+      <td><a hx-get="/disks/replicate/{{ disk['name'] }}" hx-swap="outerHTML"><span class="tag is-link"> Replicate Layout </span></a></td>
+      <td><a hx-get="/disks/diagnostics/{{ disk['name'] }}" hx-swap="outerHTML"><span class="tag is-link"> Diagnostics </span></a></td>
+    </center>
+
  {% if disk['maj:min'] == "252:0" %}
-  <div class="column is-narrow is-primary">
+  <div class="column">
    <div class="box" style="width: 100%; border-radius: 0 0 0px 5px; height: 60px; padding-top: 5px; right: 0px;">
-    <p class="is-tiny"> {{ disk['name'] }} ({{ (disk['size']/1024000000)|round(2) }} GiB)  </p>
-    <p class="title is-5"><span class="tag is-black">/dev/{{ disk['name'] }}</span>
    <span class="tag is-link">swap</span>
    </p>
    </div>
    </div>
  {% endif %}
+
+{% set colors = ['teal', '#E69F00', '#56B4E9', '#009E73', '#0072B2', '#D55E00', '#CC79A7'] %}
+
+<div id="percentagebar" style="width: 100%; height: 50px; background-color: transparent; display: inline-block; margin: 5; padding: 5; overflow: hidden; display: flex;">
+	{% for child in disk['children'] %}
+	<a hx-get="/disks/partition/{{ child['name'] }}" hx-swap="outerHTML">
+	<div style="min-width: 100px; width: {{ (((child['size'] / disk['size'])*100)|round(0)|int) }}%; height: 100%; background-color: {{ colors[loop.index0 % colors|length] }}; display: inline-block; margin: 1; padding: 1; border-radius: 8px;">
+		&nbsp; <a hx-get="/disks/partition/{{ child['name'] }}" hx-swap="outerHTML"> <font color="white">{{ child['name'] }} </font>
+	</div></a>
+	{% endfor %}
+</div>
+
+<table width="100%">
+	<th>Partition</th>
+	<th>Type</th>
+	<th>Mount Point</th>
+	<th>Label</th>
+	<th>Size</th>
+	<th>Used</th>
+{% for child in disk['children'] %}
+<tr>
+    <td><a hx-get="/disks/partition/{{ child['name'] }}" hx-swap="outerHTML"><span class="tag is-link">{{ child['name'] }}</span></a></td>
+    <td>{{ child['fstype'] }}</td>
+    <td>{{ child['mountpoint'] }}</td>
+    <td>{{ child['label'] }} </td>
+    <td>{{ (child['size']/1024000000)|round(2) }} GiB </td>
+</tr>
+{% endfor %}
+</table>
+
 </div>
 </div>

+<br />
 <!--
 <p> Diskname: {{ disk['name'] }} </p>
 <p> Model: {{ disk['model'] }} </p>
@@ -128,6 +123,7 @@ fssize: {{ child['fssize'] }}
 <p> There are {{ disk['children']|count }} Children </p>
 -->

+
 <!--
 {% for child in disk['children'] %}
 <br>
@@ -148,14 +144,28 @@ fssize: {{ child['fssize'] }}
 	<div class="column"><p> <br>Proposed partitioning: </p></div>
 </div>

+<div style=""> <!-- partition bars -->
+<div style="background-color: gray; padding: 4px 6px 7px 6px; border-radius: 10px;">
+<p> <span style="width: 100%; border-radius: 8px 8px 0 0;" class="tag is-black">
+    <small><small> New GPT Partition Table</small></small>
+<div class="columns">
 {% for partition in partitions %}
-<ul>
-<li> {{ partition }} </li>
-<ul>
-
-<!-- {% set commands = partition.split(' ') %} -->
-
+  {% if "mkpart" in partition['command'] %}
+  <a hx-get="/disks/partition/{{ partition['device'] }}" hx-swap="outerHTML"/ style="{% if "100%" in partition['command'] %}width: 100%; {% endif %}">
+  <div class="column is-narrow is-primary">
+    <div class="box" style="min-width: 220px; border-radius: 0 0 0px 5px; height: 60px; padding-top: 5px;">
+    <p class="is-tiny"> {{ partition['device'] }} </p>
+    <p class="title is-5"><span class="tag is-black"> {{ partition['mountpoint'] }} </span>
+    <span class="tag is-link"> {{ partition['fstype'] }} </span>
+    </p>
+    </div>
+  </div>
+  </a>
+  {% endif %}
 {% endfor %}
+</div>
+</div>
+

 </div>
 </div>
--- a/src/yasi_applets/disks/disks_details.html
+++ b/src/yasi_applets/disks/disks_details.html
@@ -0,0 +1,40 @@
+<div class="modal is-active">
+  <div class="modal-background"></div>
+  <div class="modal-content">
+
+    <div style="background-color: #424242; padding: 15px; border-radius: 15px; boders: none; color: white;">
+    <h1 class="is-size-4"> Disk: {{ disk }} </h1>
+
+<p>
+
+{% for pdisk in blockdevs["blockdevices"] if pdisk["name"] != "zram0" and "loop" not in pdisk["name"] and pdisk["name"] != "sr0" %}
+{% if pdisk['name'] == disk %}
+
+<p> Model: {{ pdisk['model'] }} </p>
+<p> Revision: {{ pdisk['rev'] }} </p>
+<p> Serial: {{ pdisk['serial'] }} </p>
+<p> Link: {{ pdisk['id-link'] }} </p>
+<p> Path: {{ pdisk['path'] }} </p>
+<p> Label: {{ pdisk['label'] }} </p>
+<p> Partition type: {{ pdisk['pttype'] }} </p>
+<p> Interface: {{ pdisk['tran'] }} </p>
+<p> Size: {{ pdisk['size'] }} </p>
+<p> Flags: {{ pdisk['flags'] }} </p>
+<p> UUID: {{ pdisk['uuid'] }} </p>
+<p> Partitions: {{ pdisk['children']|count }} </p>
+
+{% endif %}
+{% endfor %}
+
+
+</p>
+
+    <div class="columns">
+      <a href="/disks">
+           <div class="column"><button class="button is-light">Cancel</button></div>
+      </a>
+      <a href="/disks"><div class="column"><button class="button is-link">Continue</button></div></a>
+    </div>
+  </div>
+</div>
+</div>
--- a/src/yasi_applets/disks/disks_erase_confirmed.html
+++ b/src/yasi_applets/disks/disks_erase_confirmed.html
@@ -0,0 +1,105 @@
+{% extends "layout.html" %}
+{% block body %}
+
+<p><b>The following disk will be erased:</b></p>
+
+{% for disk in blockdevs["blockdevices"] if disk["name"] == diskname %}
+{% set disk_size = disk['size'] %}
+
+<div style="padding-top: 20px;"> <!-- partition bars -->
+<div style="background-color: gray; padding: 4px 6px 7px 6px; border-radius: 10px;">
+<p> <span style="width: 100%; border-radius: 8px 8px 0 0;" class="tag is-black">
+        <b>{{ disk['name'] }}: &nbsp; </b>  {{ disk['model'] }} - {{ disk['tran'] }} disk ({{(disk['size']/1024000000)|round(0)|int }} GB) - Serial: {{ disk['serial'] }} </p>
+    <center style="padding: 5px; padding-bottom: 5px;">
+    </center>
+
+  {% if disk['maj:min'] == "252:0" %}
+  <div class="column">
+    <div class="box" style="width: 100%; border-radius: 0 0 0px 5px; height: 60px; padding-top: 5px; right: 0px;">
+    <span class="tag is-link">swap</span>
+    </p>
+    </div>
+    </div>
+  {% endif %}
+
+{% set colors = ['teal', '#E69F00', '#56B4E9', '#009E73', '#0072B2', '#D55E00', '#CC79A7'] %}
+
+<div id="percentagebar" style="width: 100%; height: 50px; background-color: transparent; display: inline-block; margin: 5; padding: 5; overflow: hidden; display: flex;">
+        {% for child in disk['children'] %}
+        <a hx-get="/disks/partition/{{ child['name'] }}" hx-swap="outerHTML">
+        <div style="min-width: 100px; width: {{ (((child['size'] / disk['size'])*100)|round(0)|int) }}%; height: 100%; background-color: {{ colors[loop.index0 % colors|length] }}; display: inline-block; margin: 1; padding: 1; border-radius: 8px;">
+                &nbsp; <a hx-get="/disks/partition/{{ child['name'] }}" hx-swap="outerHTML"> <font color="white">{{ child['name'] }} </font>
+        </div></a>
+        {% endfor %}
+</div>
+
+<table width="100%">
+        <th>Partition</th>
+        <th>Type</th>
+        <th>Mount Point</th>
+        <th>Label</th>
+        <th>Size</th>
+{% for child in disk['children'] %}
+<tr>
+    <td><a hx-get="/disks/partition/{{ child['name'] }}" hx-swap="outerHTML"><span class="tag is-link">{{ child['name'] }}</span></a></td>
+    <td>{{ child['fstype'] }}</td>
+    <td>{{ child['mountpoint'] }}</td>
+    <td>{{ child['label'] }} </td>
+    <td>{{ (child['size']/1024000000)|round(2) }} GiB </td>
+</tr>
+{% endfor %}
+</table>
+</div>
+</div>
+{% endfor %}
+
+<br>
+
+<p><b>This layout will be created:</b></p>
+
+{% for disk in blockdevs["blockdevices"] if disk["name"] == diskname %}
+{% set disk_size = disk['size'] %}
+<div style="padding-top: 20px;"> <!-- partition bars -->
+<div style="background-color: gray; padding: 4px 6px 7px 6px; border-radius: 10px;">
+<p> <span style="width: 100%; border-radius: 8px 8px 0 0;" class="tag is-black">
+	<b>New GPT Partition Table on {{ disk['name'] }} </b> </p>
+        <!-- TODO: Unhardcode that, it might be a BIOS or other type of partition -->
+    <center style="padding: 5px; padding-bottom: 5px;">
+    </center>
+
+{% set colors = ['teal', '#E69F00', '#56B4E9', '#009E73', '#0072B2', '#D55E00', '#CC79A7'] %}
+
+<div id="percentagebar" style="width: 100%; height: 50px; background-color: transparent; display: inline-block; margin: 5; padding: 5; overflow: hidden; display: flex;">
+        {% for partition in partitions['command_set'] if partition['action-type'] == 'newpart' %}
+        <a hx-get="/disks/partition/" hx-swap="outerHTML">
+		<div style="min-width: 100px; width: {{ partition['size']}}; display: inline-block; margin: 1; padding: 1; border-radius: 8px; background-color: {{ colors[loop.index0 % colors|length] }}; display: inline-block; margin: 1; padding: 1; border-radius: 8px;">
+		<!-- TODO: That is totally wrong, but works for POC -->
+		&nbsp; <a hx-get="/disks/partition/" hx-swap="outerHTML"> <font color="white"> {{ partition['device'] }} </font>
+        </div></a>
+        {% endfor %}
+</div>
+
+<table width="100%">
+        <th>Partition</th>
+        <th>Type</th>
+        <th>Mount Point</th>
+        <th>Label</th>
+        <th>Size</th>
+{% for partition in partitions['command_set'] if partition['action-type'] == 'newpart' %}
+<tr>
+    <td><a hx-get="/disks/partition/{{ partition['device']}}" hx-swap="outerHTML"><span class="tag is-link">{{ partition['device'] }}</span></a></td>
+    <td>{{ partition['fstype'] }}</td>
+    <td>{{ partition['mountpoint'] }}</td>
+    <td>{{ partition['label'] }}  </td>
+    <td>{{ partition['size'] }} </td>
+</tr>
+{% endfor %}
+</table>
+</div>
+</div>
+{% endfor %}
+
+
+<BR>
+
+{% endblock %}
--- a/src/yasi_applets/disks/disks_erase_menu.html
+++ b/src/yasi_applets/disks/disks_erase_menu.html
@@ -0,0 +1,58 @@
+{% extends "layout.html" %}
+{% block body %}
+
+<p><b>Please confirm the disk to erase:</b></p>
+
+{% for disk in blockdevs["blockdevices"] if disk["name"] != "zram0" and "loop" not in disk["name"] and disk["name"] != "sr0" %}
+
+<div style="padding-top: 20px;"> <!-- partition bars -->
+<div style="background-color: gray; padding: 4px 6px 7px 6px; border-radius: 10px;">
+<p> <span style="width: 100%; border-radius: 8px 8px 0 0;" class="tag is-black">
+        <b>{{ disk['name'] }}: &nbsp; </b>  {{ disk['model'] }} - {{ disk['tran'] }} disk ({{(disk['size']/1024000000)|round(0)|int }} GB) - Serial: {{ disk['serial'] }} </p>
+    <center style="padding: 5px; padding-bottom: 5px;">
+     <td><a href="/disks/choose_disk_erase_chosen/{{ disk['name'] }}"><span class="tag is-link"> Select Disk  </span></a></td>
+    </center>
+
+  {% if disk['maj:min'] == "252:0" %}
+  <div class="column">
+    <div class="box" style="width: 100%; border-radius: 0 0 0px 5px; height: 60px; padding-top: 5px; right: 0px;">
+    <span class="tag is-link">swap</span>
+    </p>
+    </div>
+    </div>
+  {% endif %}
+
+{% set colors = ['teal', '#E69F00', '#56B4E9', '#009E73', '#0072B2', '#D55E00', '#CC79A7'] %}
+
+<div id="percentagebar" style="width: 100%; height: 50px; background-color: transparent; display: inline-block; margin: 5; padding: 5; overflow: hidden; display: flex;">
+        {% for child in disk['children'] %}
+        <a hx-get="/disks/partition/{{ child['name'] }}" hx-swap="outerHTML">
+        <div style="min-width: 100px; width: {{ (((child['size'] / disk['size'])*100)|round(0)|int) }}%; height: 100%; background-color: {{ colors[loop.index0 % colors|length] }}; display: inline-block; margin: 1; padding: 1; border-radius: 8px;">
+                &nbsp; <a hx-get="/disks/partition/{{ child['name'] }}" hx-swap="outerHTML"> <font color="white">{{ child['name'] }} </font>
+        </div></a>
+        {% endfor %}
+</div>
+
+<table width="100%">
+        <th>Partition</th>
+        <th>Type</th>
+        <th>Mount Point</th>
+        <th>Label</th>
+        <th>Size</th>
+        <th>Used</th>
+{% for child in disk['children'] %}
+<tr>
+    <td><a hx-get="/disks/partition/{{ child['name'] }}" hx-swap="outerHTML"><span class="tag is-link">{{ child['name'] }}</span></a></td>
+    <td>{{ child['fstype'] }}</td>
+    <td>{{ child['mountpoint'] }}</td>
+    <td>{{ child['label'] }} </td>
+    <td>{{ (child['size']/1024000000)|round(2) }} GiB </td>
+</tr>
+{% endfor %}
+</table>
+</div>
+</div>
+
+{% endfor %}
+
+{% endblock %}
--- a/src/yasi_applets/disks/disks_partition.html
+++ b/src/yasi_applets/disks/disks_partition.html
@@ -11,12 +11,11 @@
    <div class="select">
         <select>
         <option>Local file system</option>
-         <option>Remote file system</option>
         <option>Logical volume for ZFS zpool</option>
         <option>Logical volume for LVM</option>
         <option>Logical volume for LUKS encryption</option>
 	 <option>Logical volume for Linux (mdadm) RAID</option>
-	 <option>Logical volume for Microsoft LDM RAID</option>
+	 <option>Logical volume for (existing) Microsoft LDM RAID</option>
         <option>Swap partition</option>
         <option>Do not configure</option>
         </select>
@@ -49,9 +48,6 @@
         <option>jfs</option>
         <option>ntfs</option>
         <option>vfat</option>
-         <option>nfs</option>
-         <option>nbd</option>
-         <option>samba</option>
         </select>
    </div>
    </div>
--- a/src/yasi_applets/disks/disks_welcome.html
+++ b/src/yasi_applets/disks/disks_welcome.html
@@ -0,0 +1,60 @@
+{% extends "layout.html" %}
+{% block body %}
+
+<p><b>How would you like to install Debian?</b></p>
+
+<br>
+
+<center>
+
+<a href="">
+<div style="width: 200px; float: left; padding: 10px; color: white;">
+<img width="130px;" src="/disks/static/img/install_alongside.png"><br>
+Install next to existing partition
+</div>
+</a>
+
+<a href="/disks/choose_partition_erase">
+<div style="width: 200px; float: left; padding: 10px; color: white;">
+<img width="130px;" src="/disks/static/img/erase_partition.png"><br>
+Replace a partition
+</div>
+</a>
+
+<a href="/disks/choose_disk_erase">
+<div style="width: 200px; float: left; padding: 10px; color: white;">
+<img width="130px;" src="/disks/static/img/erase_disk.png"><br>
+Erase entire disk
+</div>
+</a>
+
+<a href="/disks/advanced">
+<div style="width: 200px; float: left; padding: 10px; color: white;">
+<img width="130px;" src="/disks/static/img/advanced_partitioning.png"><br>
+Advanced partitioning
+</div>
+</a>
+
+<a href="">
+<div style="width: 200px; float: left; padding: 10px; color: white;">
+<img width="130px;" src="/disks/static/img/preconfigured_partitioning.png"><br>
+Preconfigured Partitioning
+</div>
+</a>
+
+</center>
+
+<div style="float: none;">
+<p> <b>The following devices have been detected:</b>
+
+<br><br>
+
+<ul>
+{% for disk in blockdevs["blockdevices"] if disk["name"] != "zram0" and "loop" not in disk["name"] and disk["name"] != "sr0" %}
+<li>{{ disk['name'] }}
+{% endfor %}
+</ul>
+
+{% endblock %}
+
+</div>
--- a/src/yasi_applets/disks/disks_wipe_partition.html
+++ b/src/yasi_applets/disks/disks_wipe_partition.html
@@ -0,0 +1,24 @@
+<div class="modal is-active">
+  <div class="modal-background"></div>
+  <div class="modal-content">
+
+    <div style="background-color: #424242; padding: 15px; border-radius: 15px; boders: none; color: white;">
+    <h1 class="is-size-4"> Wipe partition: {{ disk }} </h1>
+
+    <p>Warning: wiping the partition table effectively destroys all data on the disk.</p>
+
+    <p>What kind of partition would you like to create? </p>
+
+    <p>DOS/MBR (Only use for legacy purposes, disks smaller than 2TB</p>
+    <p>GPT (Usable on all disk sizes, modern systems)</p>
+
+
+    <div class="columns">
+      <a href="/disks">
+           <div class="column"><button class="button is-light">Cancel</button></div>
+      </a>
+      <a href="/disks"><div class="column"><button class="button is-link">Continue</button></div></a>
+    </div>
+  </div>
+</div>
+</div>
--- a/src/yasi_applets/disks/routes.py
+++ b/src/yasi_applets/disks/routes.py
@@ -5,6 +5,84 @@ import dmm.lsblk as lsblk
 from flask import current_app

@bp.route('/disks')
+def disks_welcome():
+    """
+    Welcome menu for partitioning
+    """
+    menu = current_app.config['CONFIG']['settings']['menu_order'].split(" ")
+    next_step_url = menu[menu.index("disks")+1]
+    if menu[menu.index("disks")] == 1:
+        previous_step_url = False
+    else:
+        previous_step_url = menu[menu.index("disks")-1]
+
+    blockdevs = lsblk.list_block_devices()
+
+    return render_template('disks_welcome.html',
+                           menu=current_app.config['CONFIG']
+                                                  ['settings']['menu'],
+                           menu_order=current_app.config['CONFIG']
+                                                        ['settings']
+                                                        ['menu_order'].split(),
+                           previous_step=previous_step_url,
+                           next_step=next_step_url, blockdevs=blockdevs
+                           )
+
+
+@bp.route('/disks/choose_disk_erase')
+def disks_choose_disk_erase():
+    """
+    Choose a disk to erase
+    """
+    menu = current_app.config['CONFIG']['settings']['menu_order'].split(" ")
+    next_step_url = menu[menu.index("disks")+1]
+    if menu[menu.index("disks")] == 1:
+        previous_step_url = False
+    else:
+        previous_step_url = menu[menu.index("disks")-1]
+
+    blockdevs = lsblk.list_block_devices()
+
+    return render_template('disks_erase_menu.html',
+                           menu=current_app.config['CONFIG']
+                                                  ['settings']['menu'],
+                           menu_order=current_app.config['CONFIG']
+                                                        ['settings']
+                                                        ['menu_order'].split(),
+	                       previous_step = previous_step_url,
+                           next_step=next_step_url, blockdevs=blockdevs
+                           )
+
+
+@bp.route('/disks/choose_disk_erase_chosen/<disk>')
+def disks_choose_disk_erase_confirm(disk):
+    """
+    Disk chosen, show before and after of disk configuration.
+    """
+
+    partitions = current_app.config['CONFIG']['recipe']['create_partitions']
+
+    menu = current_app.config['CONFIG']['settings']['menu_order'].split(" ")
+    next_step_url = menu[menu.index("disks")+1]
+    if menu[menu.index("disks")] == 1:
+        previous_step_url = False
+    else:
+        previous_step_url = menu[menu.index("disks")-1]
+    blockdevs = lsblk.list_block_devices()
+
+    return render_template('disks_erase_confirmed.html',
+                           menu=current_app.config['CONFIG']
+                                                  ['settings']['menu'],
+                           menu_order=current_app.config['CONFIG']
+                                                        ['settings']
+                                                        ['menu_order'].split(),
+                           previous_step = previous_step_url,
+                           next_step=next_step_url, blockdevs=blockdevs,
+                           diskname=disk, partitions=partitions
+                           )
+
+
+@bp.route('/disks/advanced')
 def disks():
    """
    Disks screen for the webui.
@@ -25,12 +103,12 @@ def disks():
    bottom_menu = ""
    build_summary()

-    return render_template('disks.html', blockdevs=blockdevs,
+    return render_template('disks_advanced.html', blockdevs=blockdevs,
        menu=current_app.config['CONFIG']['settings']['menu'],
 	menu_order=current_app.config['CONFIG']['settings']['menu_order'].split(),
 	previous_step = previous_step_url,
 	next_step=next_step_url,
-	partitions=current_app.config['CONFIG']['recipe']['create_partitions']['commands'],
+	partitions=current_app.config['CONFIG']['recipe']['create_partitions']['command_set'],
 	format_partitions=current_app.config['CONFIG']['recipe']['format_partitions'],
 	bottom_menu=bottom_menu)

@@ -47,6 +125,23 @@ def disks_partition(part):
 	partition=partition)


+@bp.route('/disks/details/<disk>')
+def disks_details(disk):
+    """
+    Show some details about a disk.
+    """
+    blockdevs = lsblk.list_block_devices()
+    return render_template('disks_details.html', disk=disk, blockdevs=blockdevs)
+
+
+@bp.route('/disks/wipe_table/<disk>')
+def disks_wipe_table(disk):
+    """
+    Create a new partition table
+    """
+    return render_template('disks_wipe_partition.html', disk=disk)
+
+
 def build_menu():
    """
    Define menu items and paths.
--- a/src/yasi_applets/disks/static/img/advanced_partitioning.png
+++ b/src/yasi_applets/disks/static/img/advanced_partitioning.png
--- a/src/yasi_applets/disks/static/img/erase_disk.png
+++ b/src/yasi_applets/disks/static/img/erase_disk.png
--- a/src/yasi_applets/disks/static/img/erase_partition.png
+++ b/src/yasi_applets/disks/static/img/erase_partition.png
--- a/src/yasi_applets/disks/static/img/install_alongside.png
+++ b/src/yasi_applets/disks/static/img/install_alongside.png
--- a/src/yasi_applets/disks/static/img/preconfigured_partitioning.png
+++ b/src/yasi_applets/disks/static/img/preconfigured_partitioning.png
--- a/src/yasi_applets/install/init.py
+++ b/src/yasi_applets/install/init.py
@@ -3,7 +3,7 @@ from flask import Blueprint
 bp = Blueprint('install', __name__,
               template_folder='',
               static_folder='static',
-               static_url_path='/welcome/static')
+               static_url_path='/install/static')

 from yasi_applets.install import routes

--- a/src/yasi_applets/install/routes.py
+++ b/src/yasi_applets/install/routes.py
@@ -43,7 +43,7 @@ def run_script():
    status["status"] = "running"

    process = subprocess.Popen(
-        ["bash", "/data/jonathan/devel/highvoltage/system-installer/daemon/src/fake-install-shell.sh"],
+        ["bash", "/home/jonathan/devel/highvoltage/yasi/yasi-daemon/src/fake-install-shell.sh"],
        stdout = subprocess.PIPE,
        stderr = subprocess.STDOUT,
        text = True)
--- a/src/yasi_applets/main/header.html
+++ b/src/yasi_applets/main/header.html
@@ -4,7 +4,6 @@
 <!-- drag region class: -->
 <div id="titlebar" class="pywebview-drag-region" style="padding: 15px; margin: -15px; padding-bottom: 30px;">

-
 <!--
 You might be tempted to replace the unicode character by a fa-code as in the
 alternate commend below. Don't do it, it causes all kinds of artifacts and
@@ -22,7 +21,7 @@ than a proper webapp.

 <div style="position: absolute; top: 15px; right: 15px;">
    <a hx-get="/main/help" hx-swap="outerHTML"/> <button class="button is-light"> <i class="fa fa-question" aria-hidden="true"></i>  </button></a>
-    <a hx-get="/main/quit" hx-swap="outerHTML"/><button onclick="closeApp()" class="button is-danger" >  🗙 </button></a>
+    <a hx-trigger="click, keydown[altKey&&code=='F4'] from:body" hx-get="/main/quit" hx-swap="outerHTML"/><button class="button is-danger" >  🗙 </button></a>
 </div>

 </div> <!-- end pywebview-drag-region -->
--- a/src/yasi_applets/main/help.html
+++ b/src/yasi_applets/main/help.html
@@ -11,8 +11,8 @@
    <p>Some keyboard tips:<p>
    <br>
    <ul>
-    <li>ALT+n or CTRL+PGDn moves to the next page.</li>
-    <li>ALT+p or CTRL+PGUp moves to the previous page.</li>
+	<li><button>ALT</button> + <button>n</button> or <button>CTRL</button>+<button>PGDn</button> moves to the next page.</li>
+	<li><button>ALT</button> + <button>p</button> or <button>CTRL</button>+<button>PGUp</button> moves to the previous page.</li>
    </ul>

    <br>
--- a/src/yasi_applets/main/menu.html
+++ b/src/yasi_applets/main/menu.html
@@ -2,7 +2,8 @@
  <div class="modal-background"></div>
  <div class="modal-content">

-    <div style="background-color: #424242;  padding: 15px; border-radius: 15px; borders: none; color: white;">
+    <div style="background-color: #424242; height: 180px;  padding: 15px; border-radius: 15px; borders: none; color: white; position: fixed; left: 15px; top: 15px; bottom: 15px;">
+
    <h1 class="is-size-4"> Main menu </h1>

    <br />
--- a/src/yasi_applets/main/quit.html
+++ b/src/yasi_applets/main/quit.html
@@ -4,15 +4,14 @@

    <div style="background-color: #424242; padding: 15px; border-radius: 15px; boders: none; color: white;">
    <h1 class="is-size-4"> Exit system installer </h1>
-    <br /><p class="title is-6"><span class="tag is-danger">Quitting is not yet implemented.</span>

-    <br />
+    <br>
+    <p> Are you sure you want to quit? </p>
+    <br>

-    <p> ALT+F4 will bring up a dialog that works though. </p>
-
-    <br />
    <div class="columns">
-      <a href="/welcome"><div class="column"><button class="button is-link">Continue</button></div></a>
+      <a href="/welcome"><div class="column"><button class="button is-link">Back</button></div></a>
+      <a href=""><div class="column"><button onclick='pywebview.api.close()' class="button is-danger">Quit</button></div></a>
    </div>
  </div>
 </div>
--- a/src/yasi_applets/main/routes.py
+++ b/src/yasi_applets/main/routes.py
@@ -4,7 +4,18 @@ from flask import Flask, request, session, redirect, \
 # we use this neat little trick to get config data from the main app
 from flask import current_app
 import gettext
-import dmm.lsblk as lsblk
+
+# Set up Gettext
+def set_language(LANG):
+    """
+    Sets language for this applet
+    """
+    # TODO: unhardcode this path
+    translations = gettext.translation("welcome", '/usr/share/yasi-daemon/yasi_applets/welcome/locales',
+                                       fallback=True, languages=[LANG])
+    translations.install()
+    _ = translations.gettext
+

@bp.route('/')
 def index():
@@ -16,16 +27,7 @@ def index():
            "Version: Unavailable")


-@bp.route('/api/v0')
-def apihome():
-    """
-    Not sure what this function should do, but have
-    a feeling that it should exist.
-    """
-    return ("0")
-
-
-@bp.route('/main/help',methods=['GET', 'POST', 'PUT'])
+@bp.route('/main/help',methods=['GET'])
 def main_welcome():
    """
    Manages the main help system.
@@ -33,7 +35,7 @@ def main_welcome():
    return render_template('help.html')


-@bp.route('/main/quit',methods=['GET', 'POST', 'PUT'])
+@bp.route('/main/quit',methods=['GET'])
 def main_quit():
    """
    Manages the quit dialog.
@@ -41,9 +43,20 @@ def main_quit():
    return render_template('quit.html')


-@bp.route('/main/menu',methods=['GET', 'POST', 'PUT'])
+@bp.route('/main/menu',methods=['GET'])
 def main_menu():
    """
    Manages the main menu.
    """
    return render_template('menu.html')
+
+
+def build_stringlist():
+    """
+    Return all the strings that is used in this applet.
+    """
+    string_dict = {}
+    string_dict['next_text'] = _("Next")
+    string_dict['previous_text'] = _("Previous")
+    return string_dict
+
--- a/src/yasi_applets/main/static/icons/keyboard.svg
+++ b/src/yasi_applets/main/static/icons/keyboard.svg
@@ -1,53 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg
-   width="16"
-   height="16"
-   version="1.1"
-   id="svg2"
-   sodipodi:docname="keyboard.svg"
-   inkscape:version="1.4 (e7c3feb100, 2024-10-09)"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
-   xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg">
-  <defs
-     id="defs2" />
-  <sodipodi:namedview
-     id="namedview2"
-     pagecolor="#ffffff"
-     bordercolor="#000000"
-     borderopacity="0.25"
-     inkscape:showpageshadow="2"
-     inkscape:pageopacity="0.0"
-     inkscape:pagecheckerboard="0"
-     inkscape:deskcolor="#d1d1d1"
-     inkscape:zoom="52.375"
-     inkscape:cx="8"
-     inkscape:cy="8"
-     inkscape:window-width="1236"
-     inkscape:window-height="1041"
-     inkscape:window-x="662"
-     inkscape:window-y="199"
-     inkscape:window-maximized="0"
-     inkscape:current-layer="svg2" />
-  <g
-     font-weight="400"
-     fill="#474747"
-     id="g2"
-     style="fill:#c0bfbc">
-    <path
-       d="M3.702 1C2.17 1 .984 2.32.984 3.844v8.344c0 1.524 1.185 2.843 2.718 2.843h8.58c1.532 0 2.75-1.32 2.75-2.844V3.845c0-1.525-1.218-2.844-2.75-2.844zm.782 1.031c3.526.256 5.317.134 7.047 0 .754-.058 1.532.616 1.532 1.438v7.375c0 .665-.532 1.095-1.188 1.187-2.836.397-4.753.44-7.673 0-.655-.099-1.187-.522-1.187-1.187V3.5c0-.822.714-1.524 1.469-1.469z"
-       style="line-height:normal;-inkscape-font-specification:'Bitstream Vera Sans';text-indent:0;text-align:start;text-decoration-line:none;text-transform:none;marker:none;fill:#c0bfbc"
-       color="#bebebe"
-       font-family="Bitstream Vera Sans"
-       overflow="visible"
-       id="path1" />
-    <path
-       d="M10.564 5.977l-2.939.044.016 1 2.879-.043c.2.018.33.076.396.135.067.06.105.121.105.293l-.008.604H8.517l.037.002a1.457 1.457 0 00-1.164.43 1.558 1.558 0 00-.416 1.023c-.013.367.092.75.352 1.053.26.303.687.496 1.162.482h3.482l.051-3.59v-.004c0-.402-.16-.786-.435-1.035-.276-.249-.63-.364-.998-.393zM8.48 9.01h2.519l-.014.99H8.457c-.22.007-.302-.051-.371-.133a.553.553 0 01-.112-.367.587.587 0 01.141-.371c.079-.083.163-.134.363-.12zm2.862-5.985l-3 1 .316.95 3-1z"
-       style="line-height:normal;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;text-orientation:mixed;shape-padding:0;isolation:auto;mix-blend-mode:normal;marker:none;fill:#c0bfbc"
-       color="#000"
-       font-family="sans-serif"
-       overflow="visible"
-       id="path2" />
-  </g>
-</svg>
--- a/src/yasi_applets/main/static/icons/language.png
+++ b/src/yasi_applets/main/static/icons/language.png
--- a/src/yasi_applets/main/static/icons/language.svg
+++ b/src/yasi_applets/main/static/icons/language.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><!--!Font Awesome Free 7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M192 64C209.7 64 224 78.3 224 96L224 128L352 128C369.7 128 384 142.3 384 160C384 177.7 369.7 192 352 192L342.4 192L334 215.1C317.6 260.3 292.9 301.6 261.8 337.1C276 345.9 290.8 353.7 306.2 360.6L356.6 383L418.8 243C423.9 231.4 435.4 224 448 224C460.6 224 472.1 231.4 477.2 243L605.2 531C612.4 547.2 605.1 566.1 589 573.2C572.9 580.3 553.9 573.1 546.8 557L526.8 512L369.3 512L349.3 557C342.1 573.2 323.2 580.4 307.1 573.2C291 566 283.7 547.1 290.9 531L330.7 441.5L280.3 419.1C257.3 408.9 235.3 396.7 214.5 382.7C193.2 399.9 169.9 414.9 145 427.4L110.3 444.6C94.5 452.5 75.3 446.1 67.4 430.3C59.5 414.5 65.9 395.3 81.7 387.4L116.2 370.1C132.5 361.9 148 352.4 162.6 341.8C148.8 329.1 135.8 315.4 123.7 300.9L113.6 288.7C102.3 275.1 104.1 254.9 117.7 243.6C131.3 232.3 151.5 234.1 162.8 247.7L173 259.9C184.5 273.8 197.1 286.7 210.4 298.6C237.9 268.2 259.6 232.5 273.9 193.2L274.4 192L64.1 192C46.3 192 32 177.7 32 160C32 142.3 46.3 128 64 128L160 128L160 96C160 78.3 174.3 64 192 64zM448 334.8L397.7 448L498.3 448L448 334.8z"/></svg>
--- a/src/yasi_applets/main/static/system-installer-dark.css
+++ b/src/yasi_applets/main/static/system-installer-dark.css
@@ -10,6 +10,7 @@ body {
    overflow: hidden;
    min-width: 1050px;
    min-height: 600px;
+    user-select: none;
 }

 html, body {margin: 0; height: 100%; overflow: hidden;}
@@ -23,6 +24,7 @@ html, body {margin: 0; height: 100%; overflow: hidden;}
    position: absolute;
    top: 0px;
    bottom: 0px;
+    user-select: none;
 }

 .applet a:link a:hover a:active {
@@ -36,7 +38,7 @@ html, body {margin: 0; height: 100%; overflow: hidden;}

 .applet {
    width: 100%;
-    height: 442px;
+    height: 512px;
    overflow-y: scroll;
    overflow-x: hidden;
    overflow: -moz-scrollbars-none;
@@ -45,3 +47,8 @@ html, body {margin: 0; height: 100%; overflow: hidden;}
 .radio:hover {
    color: #f1f1f1;
 }
+
+.pywebview-drag-region {
+    width: 100%;
+    height: 85px;
+}
--- a/src/yasi_applets/users/routes.py
+++ b/src/yasi_applets/users/routes.py
@@ -10,7 +10,7 @@ def set_language(LANG):
    """
    Sets language for this applet
    """
-    translations = gettext.translation("users", './applets/users/locales',
+    translations = gettext.translation("users", './yasi_applets/users/locales',
                                       fallback=True, languages=[LANG])
    translations.install()
    _ = translations.gettext
@@ -101,6 +101,8 @@ def build_stringlist():
    string_dict['password_confirm'] = _("Password (confirm)")
    string_dict['password_nomatch'] = _("These passwords do now match")
    string_dict['password_tooshort'] = _("This password is too short")
+    string_dict['next_text'] = _("Next")
+    string_dict['back_text'] = _("Back")
    return string_dict


--- a/src/yasi_applets/welcome/locales/af/LC_MESSAGES/welcome.mo
+++ b/src/yasi_applets/welcome/locales/af/LC_MESSAGES/welcome.mo
--- a/src/yasi_applets/welcome/locales/af/LC_MESSAGES/welcome.po
+++ b/src/yasi_applets/welcome/locales/af/LC_MESSAGES/welcome.po
@@ -12,6 +12,33 @@ msgstr ""
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: UTF-8\n"

+msgid "Welcome"
+msgstr "Welkom"
+
+msgid "Users"
+msgstr "Gebruikers"
+
+msgid "Disks"
+msgstr "Skywe"
+
+msgid "Software"
+msgstr "Sagteware"
+
+msgid "Summary"
+msgstr "Opsomming"
+
+msgid "Power"
+msgstr "Krag"
+
+msgid "Internet"
+msgstr "Internet"
+
+msgid "Back"
+msgstr "Terug"
+
+msgid "Next"
+msgstr "Volgende"
+
 #: routes.py:27
 msgid "Welcome! This setup program will install Debian on to your system."
 msgstr "Welkom! Hierdie program sal jou deur die proses lei om Debian te installeer na jou sisteem."
--- a/src/yasi_applets/welcome/routes.py
+++ b/src/yasi_applets/welcome/routes.py
@@ -14,7 +14,8 @@ def set_language(LANG):
    """
    Sets language for this applet
    """
-    translations = gettext.translation("welcome", './applets/welcome/locales',
+    # TODO: unhardcode this path
+    translations = gettext.translation("welcome", './yasi_applets/welcome/locales',
                                       fallback=True, languages=[LANG])
    translations.install()
    _ = translations.gettext
@@ -40,6 +41,7 @@ def welcome_index():
    global lang
    lang = current_app.config['CONFIG']['settings']['language']
    set_language(lang)
+    global string_dict
    string_dict = build_stringlist()
    blkid = lsblk.list_scsi_devices()
    build_menu()
@@ -54,8 +56,8 @@ def welcome_index():
    else:
        previous_step_url = menu[menu.index("users")-1]

-    power_button = '<button id="powerbutton" hx-get="/welcome/battery/button" hx-trigger="load, every 1s" hx-target="#powerbutton" class="button is-dark"> <span style="color: #ffffff;"> <i class="fa fa-question" aria-hidden="true"></i></span> &nbsp; Power </button>'
-    internet_button = '&nbsp; <button id="internetbutton" class="button is-dark" hx-get="/welcome/internet/button" hx-trigger="load, every 1s" hx-target="#internetbutton"><span style="color: #ffffff;"> <i class="fa fa-question" aria-hidden="true"></i></span> &nbsp; Internet </button>'
+    power_button = '<button id="powerbutton" hx-get="/welcome/battery/button" hx-trigger="load, every 1s" hx-target="#powerbutton" class="button is-dark"> <span style="color: #ffffff;"> <i class="fa fa-question" aria-hidden="true"></i></span> &nbsp;</button>'
+    internet_button = '&nbsp; <button id="internetbutton" class="button is-dark" hx-get="/welcome/internet/button" hx-trigger="load, every 1s" hx-target="#internetbutton"><span style="color: #ffffff;"> <i class="fa fa-question" aria-hidden="true"></i></span> &nbsp;</button>'
    bottom_menu = power_button + internet_button


@@ -99,7 +101,7 @@ def welcome_battery_button():
    if on_battery:
        power_button = '<button id="powerbutton hx-get="/welcome/battery/button" hx-trigger="load, every 1s" hx-target="#powerbutton" class="button is-dark"> <span style="color: #ffa45c;"> <i class="fa fa-warning" aria-hidden="true"></i></span> &nbsp; Power: Battery: ' + percentage + '%</button>'
    else:
-        power_button = '<button id="powerbutton hx-get="/welcome/battery/button" hx-trigger="load, every 1s" hx-target="#powerbutton" class="button is-dark"> <span style="color: #a0ff98;"> <i class="fa fa-check" aria-hidden="true"></i></span> &nbsp; Power </button>'
+        power_button = """<button id="powerbutton hx-get="/welcome/battery/button" hx-trigger="load, every 1s" hx-target="#powerbutton" class="button is-dark"> <span style="color: #a0ff98;"> <i class="fa fa-check" aria-hidden="true"></i></span> &nbsp;""" +  string_dict["power_text"] + "</button>"""
    return str(power_button)


@@ -135,12 +137,21 @@ def build_stringlist():
    """
    string_dict = {}
    string_dict['menu_item'] = _("Welcome")
+    # In the future, these will be loaded from their own modules
+    string_dict['menu_item_users'] = _("Users")
+    string_dict['menu_item_disks'] = _("Disks")
+    string_dict['menu_item_software'] = _("Software")
+    string_dict['menu_item_summary'] = _("Summary")
    string_dict['welcome_text'] = _("Welcome! This setup program will install Debian on to your system.")
    string_dict['confirm_text'] = _("Please confirm the following details:")
    string_dict['language_text'] = _("Language:")
    string_dict['keylayout_text'] = _("Keyboard Layout:")
    string_dict['timezone_text'] = _("Time Zone:")
    string_dict['basicsettings_text'] = _("Basic Settings:")
+    string_dict['power_text'] = _("Power")
+    string_dict['internet_text'] = _("Internet")
+    string_dict['next_text'] = _("Next")
+    string_dict['back_text'] = _("Back")
    lang_dict = {}
    lang_dict['af'] = _("Afrikaans")
    lang_dict['en'] = _("English (International)")
@@ -157,6 +168,12 @@ def build_menu():
    """
    current_app.config['CONFIG']['settings']['menu']['welcome'] = (build_stringlist()['menu_item'], "/welcome", 10)

+    #TODO: temporary hack: We need an automated way to translate all menu items
+    current_app.config['CONFIG']['settings']['menu']['users'] = (build_stringlist()['menu_item_users'], "/users", 20)
+    current_app.config['CONFIG']['settings']['menu']['disks'] = (build_stringlist()['menu_item_disks'], "/disks", 30)
+    current_app.config['CONFIG']['settings']['menu']['software'] = (build_stringlist()['menu_item_software'], "/software", 40)
+    current_app.config['CONFIG']['settings']['menu']['summary'] = (build_stringlist()['menu_item_summary'], "/summary", 50)
+

 def build_summary():
    """
--- a/src/yasi_applets/welcome/static/img/keyboard.svg
+++ b/src/yasi_applets/welcome/static/img/keyboard.svg
--- a/src/yasi_applets/welcome/static/img/lang.svg
+++ b/src/yasi_applets/welcome/static/img/lang.svg
@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
+  <defs id="defs3051">
+    <style type="text/css" id="current-color-scheme">
+      .ColorScheme-Text {
+        color:#232629;
+      }
+      </style>
+  </defs>
+  <g transform="translate(1,1)">
+    <path style="fill:currentColor" d="M 8 3 L 8 5 L 3 5 L 3 7 L 11.6 7 C 11.1 8.5 10.3 9.4 9.1855469 10.681641 C 8.4665869 9.885369 7.8700275 8.91997 7.3984375 8 L 5.8535156 8 C 6.4178656 9.26012 7.1899 10.542606 8.15625 11.617188 L 4.2207031 15.498047 L 5.3183594 16.595703 L 9.1855469 12.730469 L 11.589844 15.134766 L 12.175781 13.558594 L 10.212891 11.617188 L 10.236328 11.59375 C 11.581488 10.09397 12.43566 8.82447 13 7 L 15 7 L 15 5 L 10 5 L 10 3 L 8 3 z M 14.982422 10 L 11.503906 19 L 13.050781 19 L 13.916016 16.595703 L 17.587891 16.595703 L 18.460938 19 L 20.007812 19 L 16.529297 10 L 14.982422 10 z M 15.755859 11.703125 L 17.007812 15.050781 L 14.503906 15.050781 L 15.755859 11.703125 z " class="ColorScheme-Text"/>
+  </g>
+</svg>
--- a/src/yasi_applets/welcome/static/img/lang_w.svg
+++ b/src/yasi_applets/welcome/static/img/lang_w.svg
@@ -0,0 +1,52 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   viewBox="0 0 24 24"
+   width="24"
+   height="24"
+   version="1.1"
+   id="svg1"
+   sodipodi:docname="lang_w.svg"
+   inkscape:version="1.4 (e7c3feb100, 2024-10-09)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview1"
+     pagecolor="#ffffff"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:zoom="48.375"
+     inkscape:cx="11.989664"
+     inkscape:cy="12"
+     inkscape:window-width="2560"
+     inkscape:window-height="1364"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg1" />
+  <defs
+     id="defs3051">
+    <style
+       type="text/css"
+       id="current-color-scheme">
+      .ColorScheme-Text {
+        color:#232629;
+      }
+      </style>
+  </defs>
+  <g
+     transform="translate(1,1)"
+     id="g1"
+     style="fill:#deddda">
+    <path
+       style="fill:#deddda"
+       d="M 8 3 L 8 5 L 3 5 L 3 7 L 11.6 7 C 11.1 8.5 10.3 9.4 9.1855469 10.681641 C 8.4665869 9.885369 7.8700275 8.91997 7.3984375 8 L 5.8535156 8 C 6.4178656 9.26012 7.1899 10.542606 8.15625 11.617188 L 4.2207031 15.498047 L 5.3183594 16.595703 L 9.1855469 12.730469 L 11.589844 15.134766 L 12.175781 13.558594 L 10.212891 11.617188 L 10.236328 11.59375 C 11.581488 10.09397 12.43566 8.82447 13 7 L 15 7 L 15 5 L 10 5 L 10 3 L 8 3 z M 14.982422 10 L 11.503906 19 L 13.050781 19 L 13.916016 16.595703 L 17.587891 16.595703 L 18.460938 19 L 20.007812 19 L 16.529297 10 L 14.982422 10 z M 15.755859 11.703125 L 17.007812 15.050781 L 14.503906 15.050781 L 15.755859 11.703125 z "
+       class="ColorScheme-Text"
+       id="path1" />
+  </g>
+</svg>
--- a/src/yasi_applets/welcome/welcome.html
+++ b/src/yasi_applets/welcome/welcome.html
@@ -5,34 +5,56 @@
     src="/welcome/static/img/banner.png"
     alt="Debian Image banner" />

+<!-- This odd, yet very efficient mechanism ensures that translations,
+     settings and summaries for each page gets loaded -->
+<div hx-get="/users" hx-target="#none" hx-trigger="load"></div>
+<div hx-get="/disks" hx-target="#none" hx-trigger="load"></div>
+<div hx-get="/software" hx-target="#none" hx-trigger="load"></div>
+<div hx-get="/summary" hx-target="#none" hx-trigger="load"></div>
+<!-- TODO: Add hook to fix next tab again after loading summary -->
+
+<div style="display: none;" id="none"></div>
+
 <p><b> {{ string_dict['welcome_text'] }} </b></p>
 <p>{{ string_dict['confirm_text'] }} </p> <br />

-<form action="/welcome" method="POST">
-<i class="fa fa-language" aria-hidden="true"></i> {{ string_dict['language_text'] }}
-<div class="control is-link" width="180px">
-  <div class="select">
-    <select hx-post="/welcome" hx-target="body" name="lang" style="width: 220px">
-      {% for lang in string_dict['lang_list'] %}
-      <option value="{{lang}}" {% if lang == selected_lang %} selected=selected {% endif %}>{{ string_dict['lang_list'][lang] }}</option>
-      {% endfor %}
-    </select>
-  </div>
-</div>
-</form>
-<br>
+<!-- pywebview api example
+<button onclick='pywebview.api.log("Woah dude")'>Click me</button>
+-->

-<form>
-<i class="fa fa-keyboard-o" aria-hidden="true"></i> {{ string_dict['keylayout_text'] }}
-<div class="control is-link">
-  <div class="select">
-    <select hx-post="/welcome" hx-target="body" name="keyboard" style="width: 220px">
-      <option>en-us</option>
-      <option>en-uk</option>
-    </select>
+<div style="left: 25px; display: flex; align-items: center; gap: 1rem;">
+  <img style="width: 80px;" src="/welcome/static/img/lang_w.svg" alt="Language icon" />
+  <form action="/welcome" method="POST" style="display: flex; flex-direction: column; gap: 0.5rem;">
+  <label for="lang">{{ string_dict['language_text'] }}</label>
+  <div class="control is-link">
+    <div class="select">
+      <select id="lang" name="lang" hx-post="/welcome" hx-target="body" style="width: 220px;">
+          {% for lang in string_dict['lang_list'] %}
+        <option value="{{ lang }}" {% if lang == selected_lang %} selected {% endif %}>
+          {{ string_dict['lang_list'][lang] }}
+        </option>
+        {% endfor %}
+      </select>
+    </div>
  </div>
-</div>
 </form>
+</div>
+
 <br />

+<div style="left: 25px; display: flex; align-items: center; gap: 1rem;">
+  <img style="width: 80px;" src="/welcome/static/img/keyboard.svg" alt="Language icon" />
+  <form action="/welcome" method="POST" style="display: flex; flex-direction: column; gap: 0.5rem;">
+  <label for="keyboard">{{ string_dict['keylayout_text'] }}</label>
+  <div class="control is-link">
+    <div class="select">
+      <select name="keyboard" hx-post="/welcome" hx-target="body" style="width: 220px;">
+      <option>en-us</option>
+      <option>en-uk</option>
+      </select>
+    </div>
+  </div>
+</form>
+</div>
+
 {% endblock %}
Author	SHA1	Message	Date
Jonathan Carter	de76cd16ea	Commit recent changes	2026-03-14 15:14:37 +02:00
Jonathan Carter	24c5f6e12d	Add erase confirm screen	2026-03-10 15:43:34 +02:00
Jonathan Carter	3a3d211cd3	Commit previous changes	2026-03-10 15:43:14 +02:00
Jonathan Carter	829149ebc1	Improve app frame buttons	2026-02-16 19:06:32 +02:00
Jonathan Carter	87799719c2	Add images and gitignore	2026-02-04 09:09:00 +02:00
Jonathan Carter	401bfb55d9	some disks refactoring	2026-01-14 13:47:36 +02:00
Jonathan Carter	1c4656ade3	merge	2026-01-12 12:21:46 +02:00
Jonathan Carter	7337daac01	Submit local changes	2026-01-12 12:20:15 +02:00
Jonathan Carter	7eec15b7df	Some partition ui stuff	2026-01-11 21:19:29 +02:00
Jonathan Carter	d823bdd251	Set window height	2026-01-07 22:37:48 +02:00
Jonathan Carter	f10ff43adb	Rework partition page a bit	2026-01-07 22:29:22 +02:00
Jonathan Carter	ed2ddb0a77	list debian deps	2025-12-10 21:18:21 +02:00
Jonathan Carter	31bb032a4e	Set text_select to false for new pywbview'	2025-10-25 21:52:17 +02:00
Jonathan Carter	22dcf36b14	cleanup mainapplet a bit	2025-08-31 18:31:51 +02:00
				`@@ -1 +0,0 @@`
				<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><!--!Font Awesome Free 7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M192 64C209.7 64 224 78.3 224 96L224 128L352 128C369.7 128 384 142.3 384 160C384 177.7 369.7 192 352 192L342.4 192L334 215.1C317.6 260.3 292.9 301.6 261.8 337.1C276 345.9 290.8 353.7 306.2 360.6L356.6 383L418.8 243C423.9 231.4 435.4 224 448 224C460.6 224 472.1 231.4 477.2 243L605.2 531C612.4 547.2 605.1 566.1 589 573.2C572.9 580.3 553.9 573.1 546.8 557L526.8 512L369.3 512L349.3 557C342.1 573.2 323.2 580.4 307.1 573.2C291 566 283.7 547.1 290.9 531L330.7 441.5L280.3 419.1C257.3 408.9 235.3 396.7 214.5 382.7C193.2 399.9 169.9 414.9 145 427.4L110.3 444.6C94.5 452.5 75.3 446.1 67.4 430.3C59.5 414.5 65.9 395.3 81.7 387.4L116.2 370.1C132.5 361.9 148 352.4 162.6 341.8C148.8 329.1 135.8 315.4 123.7 300.9L113.6 288.7C102.3 275.1 104.1 254.9 117.7 243.6C131.3 232.3 151.5 234.1 162.8 247.7L173 259.9C184.5 273.8 197.1 286.7 210.4 298.6C237.9 268.2 259.6 232.5 273.9 193.2L274.4 192L64.1 192C46.3 192 32 177.7 32 160C32 142.3 46.3 128 64 128L160 128L160 96C160 78.3 174.3 64 192 64zM448 334.8L397.7 448L498.3 448L448 334.8z"/></svg>