73 lines
1.2 KiB
Svelte
73 lines
1.2 KiB
Svelte
<div>
|
|
{#each rows as row,i (i)}
|
|
<div class="row">
|
|
{#each row as item,j (j)}
|
|
<div class="cell">
|
|
{#if item}
|
|
<img src="icons/crew-star.svg" alt="crew loss threshold" />
|
|
{/if}
|
|
</div>
|
|
{/each}
|
|
</div>
|
|
{/each}
|
|
|
|
</div>
|
|
|
|
<script>
|
|
import { ceil } from '$lib/dux/utils';
|
|
|
|
export let ship_mass = 0;
|
|
export let rating = 0;
|
|
export let advanced = false;
|
|
|
|
let nbr_rows;
|
|
$: nbr_rows = advanced ? 3 : 4;
|
|
|
|
let cells;
|
|
$: cells = Array(rating).fill(false);
|
|
|
|
let dcp;
|
|
$: dcp= ceil(ship_mass/20);
|
|
|
|
$: cells = divide(cells, dcp).map(
|
|
g => {
|
|
g[g.length-1] = true;
|
|
return g;
|
|
}
|
|
).flat();
|
|
|
|
function divide(list, divider) {
|
|
if( divider <= 1 ) return [ list ];
|
|
|
|
let div = list.length / divider;
|
|
const mod = list.length % divider;
|
|
|
|
if(mod) div++;
|
|
|
|
return [
|
|
list.slice(0,div),
|
|
...divide( list.slice(div), divider-1 )
|
|
]
|
|
}
|
|
|
|
let rows = [];
|
|
$: rows = divide( cells, nbr_rows );
|
|
|
|
|
|
</script>
|
|
|
|
<style>
|
|
.row {
|
|
}
|
|
.cell {
|
|
display: inline-block;
|
|
margin-right: 0.5em;
|
|
width: 1em;
|
|
height: 1em;
|
|
border: 1px solid black;
|
|
}
|
|
img {
|
|
width: 1em;
|
|
}
|
|
</style>
|