{% extends "layout.html" %}
{% block body %}

<br>
<!--
<div style=""> 
<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">Physical disk: TOSHIBA HDWD120 (2000 GB) <br>
<div class="columns">
  <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">/dev/sda1</p>
    <p class="title is-5"><span class="tag is-black">/boot/efi</span>
    <span class="tag is-dark">200 MB</span>
    <span class="tag is-link">vfat</span>
    </p>
  </div>
</div>
  <a hx-get="/disks/partition/sda" hx-swap="outerHTML"/>
  <div class="column">
    <div class="box" style="border-radius: 0 0 5px 0px; height: 60px; padding-top: 5px;">
      <p class="is-tiny">/dev/sda2</p>
      <p class="title is-5"><span class="tag is-black">/</span> <span class="tag is-dark">18 GB</span> <span class="tag is-link">btrfs</span></p>
    </div>
  </a>
  </div>
</div>
</div>
</div>
</div> 
-->

<!--
<p> There are {{ blockdevs["blockdevices"]|count }} block devices detected. </p>
<p> They are </p>
<br>
-->


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

<!--
<h1> Raw data </h1>
{{ disk }}

<h1> Children </h1>

{% for child in disk['children'] %}

<h2> <big><b> Child </b></big> </h2>
Path: {{ child['path'] }} 
fstype: {{ child['fstype'] }}
fssize: {{ child['fssize'] }}
{{ child }}
{% endfor %}

-->

<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">
	<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">
    <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>

<br />
<!--
<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 %}
-->

{% endfor %}

<!-- Add Undetected Disk
     Add Virtual Filesystem
     Add Network Filesystem -->

<div class="columns" width="100%">
	<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 %}
  {% 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>
</div>
</div>

{% endblock %}