Skip to content

Commit a260f00

Browse files
zleyyijzleyyij
authored
Merge branch 'v2' into v2-gpu
2 parents 1802645 + e396de2 commit a260f00

7 files changed

Lines changed: 327 additions & 214 deletions

File tree

‎new/apps/web/src/lib/common/ModalWidget.svelte‎

Lines changed: 18 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -9,17 +9,20 @@
99
widgetContents,
1010
/** what's displayed when the widget is in modal mode*/
1111
modalContents,
12+
/** "more info" contents*/
13+
extraModalContents,
1214
} = $props();
1315
1416
// TODO: support for "more info" is not currently
1517
// implemented. When it is, it should not make use
1618
// of IDs
17-
let expanded = $state(false);
19+
let modalExpanded = $state(false);
20+
let moreInfoExpanded = $state(false);
1821
</script>
1922

2023
<button
2124
onclick={() => {
22-
expanded = true;
25+
modalExpanded = true;
2326
}}
2427
class="_widget">
2528
<h1>{title}</h1>
@@ -28,38 +31,39 @@
2831
</div>
2932
</button>
3033

31-
{#if expanded}
32-
<span class="backdrop" onclick={() => {expanded = false}} role="none">
34+
{#if modalExpanded}
35+
<span class="backdrop" onclick={() => {modalExpanded = false}} role="none">
3336
</span>
3437
<div class="_modal">
3538
<!-- modal header -->
3639
<div>
3740
<h5>{title}</h5>
38-
<button onclick={() => {expanded = false;}} type="button" aria-label="Close"
41+
<button onclick={() => {modalExpanded = false;}} type="button" aria-label="Close"
3942
></button>
4043
</div>
4144

4245
<div class="modal-body">
4346
{@render modalContents()}
4447
</div>
4548

46-
<!-- more info -->
47-
<!-- <div class="modal-body">
48-
{@render extraModalContents()}
49-
</div> -->
49+
<!-- more info -->
50+
{#if extraModalContents && moreInfoExpanded}
51+
<div class="modal-body">
52+
{@render extraModalContents()}
53+
</div>
54+
{/if}
5055

5156
<!-- footer -->
5257
<div>
53-
<!-- {#if extraModalContents}
58+
{#if extraModalContents && moreInfoExpanded == false}
5459
<button
5560
type="button"
5661
class="btn btn-secondary"
57-
id={modalId + '-more-info-button'}
58-
onclick={() => infoClick(modalId)}>More Info</button
62+
onclick={() => {moreInfoExpanded = true}}>More Info</button
5963
>
60-
{/if} -->
64+
{/if}
6165
<button
62-
onclick={() => {expanded = false;}}
66+
onclick={() => {modalExpanded = false;}}
6367
type="button">Close</button
6468
>
6569
</div>

‎new/apps/web/src/lib/components/Widgets.svelte‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -15,18 +15,20 @@
1515
import PowerProfiles from './widgets/PowerProfiles.svelte';
1616
1717
export let report;
18+
export let cpuMoreInfo;
1819
</script>
1920

2021
<div class="widgets">
2122
<Cpu cpu={report.Hardware.Cpu} />
22-
<Gpu gpus={report.Hardware.Gpu} monitors={report.Hardware.Monitors} />
23-
<!--<RAM ramData={rawJSON.Hardware.Ram} pagefileData={rawJSON.System.PageFile} />
2423
<Motherboard
25-
tpmData={rawJSON.Security.Tpm}
26-
motherboardData={rawJSON.Hardware.Motherboard}
27-
biosData={rawJSON.Hardware.BiosInfo}
24+
tpm={report.Security.Tpm}
25+
motherboard={report.Hardware.Motherboard}
26+
bios={report.Hardware.BiosInfo}
2827
/>
29-
<GPU rawGPUData={rawJSON.Hardware.Gpu} rawMonitorData={rawJSON.Hardware.Monitors} />
28+
<Ram ram={report.Hardware.Ram} pagefile={report.System.PageFile}/>
29+
<Gpu gpus={report.Hardware.Gpu} monitors={report.Hardware.Monitors} />
30+
31+
<!--
3032
<OS securityData={rawJSON.Security} basicinfoData={rawJSON.BasicInfo} />
3133
<NIC nicData={rawJSON.Network.Adapters} /> -->
3234
</div>

‎new/apps/web/src/lib/components/widgets/Cpu.svelte‎

Lines changed: 21 additions & 74 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
<!-- NOT YET MIGRATED TO NEW WIDGET SYSTEM -->
22

33
<script lang="ts">
4-
import { onMount } from 'svelte';
5-
import { dev } from '$app/environment';
64
import Widget from '../../common/ModalWidget.svelte';
75
86
interface CpuInfo {
@@ -18,77 +16,14 @@
1816
1917
interface Props {
2018
cpu: CpuInfo;
19+
cpuMoreInfo: Promise<any>;
2120
}
2221
2322
let {
24-
cpu
23+
cpu,
24+
cpuMoreInfo
2525
}: Props = $props();
2626
27-
async function cpuLookup() {
28-
let response;
29-
if (dev) {
30-
console.info('Trying local server for hwapi');
31-
try {
32-
response = await (
33-
await fetch(
34-
`http://localhost:3000/api/cpus/?name=${encodeURIComponent(cpu.Name)}`,
35-
{
36-
method: 'GET',
37-
mode: 'cors'
38-
}
39-
)
40-
).json();
41-
} catch (e) {
42-
console.warn(
43-
'Could not connect to local hwapi instance, falling back to spec-ify.com'
44-
);
45-
}
46-
}
47-
if (!response) {
48-
response = await (
49-
await fetch(`https://spec-ify.com/api/cpus/?name=${encodeURIComponent(cpu.Name)}`, {
50-
method: 'GET',
51-
mode: 'cors'
52-
})
53-
).json();
54-
}
55-
// update the title element to reflect the name fetched from the database
56-
let infoTitle = document.getElementById('cpu-info-title');
57-
if (infoTitle) {
58-
infoTitle.innerHTML = infoTitle.innerHTML.slice(0, -3) + response.name;
59-
}
60-
61-
let tableContents = '';
62-
// add new elements to the table for every kv in the database
63-
for (const [key, value] of Object.entries(response.attributes)) {
64-
tableContents += `<tr><td>${key}</td><td>${value}</td></tr>`;
65-
}
66-
// cpuTable.innerHTML = tableContents;
67-
let fetchedTitle = document.getElementById('fetched-cpu-info');
68-
if (fetchedTitle) {
69-
fetchedTitle.innerHTML = tableContents;
70-
}
71-
}
72-
73-
onMount(() => {
74-
const observer = new IntersectionObserver((entries) => {
75-
if (entries[0].isIntersecting) {
76-
cpuLookup().then();
77-
unobserve();
78-
}
79-
});
80-
81-
let cpuDatabase = document.getElementById('cpu-info-title');
82-
if (cpuDatabase) {
83-
observer.observe(cpuDatabase);
84-
}
85-
86-
function unobserve() {
87-
if (cpuDatabase) {
88-
observer.unobserve(cpuDatabase);
89-
}
90-
}
91-
});
9227
</script>
9328

9429
<!-- CPU -->
@@ -131,12 +66,24 @@
13166
</table>
13267
{/snippet}
13368

134-
<!-- <div slot="extras" class="modal-body" id="cpu-modal-info-table" style="display:none;">
135-
<h6 class="modal-title" id="cpu-info-title">Database results for: ...</h6>
136-
<table class="table">
137-
<tbody id="fetched-cpu-info"> </tbody>
138-
</table>
139-
</div> -->
69+
{#snippet extraModalContents()}
70+
{#await cpuMoreInfo}
71+
<h6 class="modal-title">Database results for: ...</h6>
72+
{:then response}
73+
<h6 class="modal-title">Database results for: {response.name}</h6>
74+
<table class="table">
75+
<tbody>
76+
{#each Object.entries(response.attributes) as [key, value]}
77+
<tr>
78+
<td>{key}</td>
79+
<td>{value}</td>
80+
</tr>
81+
{/each}
82+
</tbody>
83+
</table>
84+
{/await}
85+
{/snippet}
86+
14087
</Widget>
14188

14289
<style>

0 commit comments

Comments
 (0)