Add erase confirm screen

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 %}

src/yasi_applets/disks/disks_erase_menu.html

@@ -10,7 +10,7 @@
 <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 hx-get="/disks/choose_disk_erase_disk/{{ disk['name'] }}" hx-swap="outerHTML"><span class="tag is-link"> Select Disk  </span></a></td>
+     <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" %}

src/yasi_applets/disks/routes.py

@@ -54,6 +54,34 @@ def disks_choose_disk_erase():
                            )
 
 
+@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():
     """

src/yasi_applets/welcome/welcome.html

@@ -12,8 +12,8 @@
 <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>
 
+<div style="display: none;" id="none"></div>
 
 <p><b> {{ string_dict['welcome_text'] }} </b></p>
 <p>{{ string_dict['confirm_text'] }} </p> <br />