1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
|
<script lang="ts">
import PredictionItem from './PredictionItem.svelte';
import { onMount } from 'svelte';
import { earth_weather, space_weather } from '../../../stores';
const monthNames = ["January", "February", "March", "April", "May", "June",
"July", "August", "September", "October", "November", "December"
];
let predictions;
space_weather.subscribe(assembleWeatherData);
earth_weather.subscribe(assembleWeatherData);
async function assembleWeatherData() {
if ($space_weather.updating || $earth_weather.updating) {
predictions = null;
return;
}
// First just reorganize the space_weather data
let forecast = $space_weather.usnoaa_data_raw.geospace_pred_est_kp_1_hour.filter(x => x.model_prediction_time >= new Date());
predictions = forecast.map(
pred => ({
"time": pred.model_prediction_time,
"kp": Math.round(pred.k),
"temp": null,
"clouds": null,
"hasNOMETData": $earth_weather.available
})
);
// Add earth weather data if it is available
if ($earth_weather.available) {
predictions.forEach((pred, i) => {
let closestDate = new Date(0,0,0);
let temp;
let clouds;
$earth_weather.yr_data_raw.properties.timeseries.forEach((earth_pred, i) => {
let predDate = new Date(earth_pred.time);
if (Math.abs(predDate.getTime() - pred.time.getTime()) < Math.abs(closestDate.getTime() - pred.time.getTime())) {
closestDate = predDate;
temp = (earth_pred["data"]["instant"]["details"]["air_temperature"]);
clouds = earth_pred["data"]["instant"]["details"]["cloud_area_fraction"];
}
});
predictions[i] = {
...predictions[i], "temp": temp, "clouds": clouds
}
});
}
}
</script>
<style>
.prediction-table {
height: 100%;
overflow-y: scroll;
padding-bottom: 1rem;
}
.prediction-table::-webkit-scrollbar {
display: none;
}
</style>
<div class="prediction-table">
{#each predictions as prediction, i}
<PredictionItem {prediction}/>
{/each}
</div>
|
