Graham McIntire
ff3a879dff
- Viewshed uses propagation score to set max range (ducting/NLOS distance) - Terrain checked within radio horizon; clear paths get full atmospheric range - Detail panel moves from map popup to sidebar for better visibility - Panel shows instantly on click with loading state - Dark opaque background for readability over map - Factor analysis section explains each score with contextual descriptions
296 lines
8.8 KiB
Elixir
296 lines
8.8 KiB
Elixir
defmodule MicrowavepropWeb.MapLive do
|
|
@moduledoc false
|
|
use MicrowavepropWeb, :live_view
|
|
|
|
alias Microwaveprop.Propagation
|
|
alias Microwaveprop.Propagation.BandConfig
|
|
alias Microwaveprop.Terrain.Viewshed
|
|
|
|
require Logger
|
|
|
|
@default_band 10_000
|
|
@initial_bounds %{
|
|
"south" => 29.5,
|
|
"north" => 36.3,
|
|
"west" => -101.5,
|
|
"east" => -92.5
|
|
}
|
|
|
|
@impl true
|
|
def mount(_params, _session, socket) do
|
|
bands = BandConfig.all_bands()
|
|
valid_time = Propagation.latest_valid_time()
|
|
initial_scores = Propagation.latest_scores(@default_band, @initial_bounds)
|
|
|
|
if connected?(socket) do
|
|
Phoenix.PubSub.subscribe(Microwaveprop.PubSub, "propagation:updated")
|
|
end
|
|
|
|
{:ok,
|
|
assign(socket,
|
|
page_title: "Propagation Map",
|
|
bands: bands,
|
|
selected_band: @default_band,
|
|
initial_scores_json: Jason.encode!(initial_scores),
|
|
valid_time: valid_time,
|
|
bounds: @initial_bounds,
|
|
grid_visible: false,
|
|
antenna_height_ft: 33
|
|
)}
|
|
end
|
|
|
|
@impl true
|
|
def handle_event("select_band", %{"value" => band}, socket) do
|
|
band = if is_binary(band), do: String.to_integer(band), else: band
|
|
scores = Propagation.latest_scores(band, socket.assigns.bounds)
|
|
|
|
socket =
|
|
socket
|
|
|> assign(:selected_band, band)
|
|
|> push_event("update_scores", %{scores: scores})
|
|
|> push_event("update_band_info", %{band_info: band_info(band)})
|
|
|
|
{:noreply, socket}
|
|
end
|
|
|
|
def handle_event("set_antenna_height", %{"height_ft" => value}, socket) do
|
|
height =
|
|
case Integer.parse(value) do
|
|
{h, _} when h >= 0 and h <= 200 -> h
|
|
_ -> 8
|
|
end
|
|
|
|
{:noreply, assign(socket, :antenna_height_ft, height)}
|
|
end
|
|
|
|
def handle_event("toggle_grid", _params, socket) do
|
|
visible = !socket.assigns.grid_visible
|
|
|
|
socket =
|
|
socket
|
|
|> assign(:grid_visible, visible)
|
|
|> push_event("toggle_grid", %{visible: visible})
|
|
|
|
{:noreply, socket}
|
|
end
|
|
|
|
def handle_event("point_detail", %{"lat" => lat, "lon" => lon}, socket) do
|
|
detail = Propagation.point_detail(socket.assigns.selected_band, lat, lon)
|
|
{:noreply, push_event(socket, "point_detail", detail || %{})}
|
|
end
|
|
|
|
def handle_event("map_bounds", bounds, socket) do
|
|
scores = Propagation.latest_scores(socket.assigns.selected_band, bounds)
|
|
|
|
socket =
|
|
socket
|
|
|> assign(:bounds, bounds)
|
|
|> push_event("update_scores", %{scores: scores})
|
|
|
|
{:noreply, socket}
|
|
end
|
|
|
|
def handle_event("compute_viewshed", %{"lat" => lat, "lon" => lon}, socket) do
|
|
band_mhz = socket.assigns.selected_band
|
|
band_config = BandConfig.get(band_mhz)
|
|
freq_ghz = band_mhz / 1_000
|
|
ant_height_m = socket.assigns.antenna_height_ft * 0.3048
|
|
|
|
# Use propagation score to determine atmospheric range potential
|
|
score =
|
|
case Propagation.point_detail(band_mhz, lat, lon) do
|
|
%{score: s} -> s
|
|
_ -> 50
|
|
end
|
|
|
|
max_range_km = score_range_km(score, band_config)
|
|
|
|
socket =
|
|
start_async(socket, :viewshed, fn ->
|
|
Viewshed.compute(lat, lon,
|
|
freq_ghz: freq_ghz,
|
|
ant_height_m: ant_height_m,
|
|
max_range_km: max_range_km,
|
|
score: score
|
|
)
|
|
end)
|
|
|
|
{:noreply, socket}
|
|
end
|
|
|
|
@impl true
|
|
def handle_info({:propagation_updated, valid_time}, socket) do
|
|
scores = Propagation.latest_scores(socket.assigns.selected_band, socket.assigns.bounds)
|
|
|
|
socket =
|
|
socket
|
|
|> assign(:valid_time, valid_time)
|
|
|> push_event("update_scores", %{scores: scores})
|
|
|
|
{:noreply, socket}
|
|
end
|
|
|
|
@impl true
|
|
def handle_async(:viewshed, {:ok, result}, socket) do
|
|
points = Enum.map(result.boundary, fn p -> %{lat: p.lat, lon: p.lon} end)
|
|
Logger.info("Viewshed complete: #{length(points)} boundary points")
|
|
|
|
socket =
|
|
push_event(socket, "viewshed_result", %{
|
|
origin: result.origin,
|
|
points: points
|
|
})
|
|
|
|
{:noreply, socket}
|
|
end
|
|
|
|
def handle_async(:viewshed, {:exit, reason}, socket) do
|
|
Logger.warning("Viewshed computation failed: #{inspect(reason)}")
|
|
{:noreply, socket}
|
|
end
|
|
|
|
defp score_range_km(score, config) do
|
|
cond do
|
|
score >= 80 -> config.exceptional_range_km
|
|
score >= 65 -> config.extended_range_km
|
|
score >= 50 -> config.typical_range_km
|
|
score >= 33 -> round(config.typical_range_km * 0.6)
|
|
true -> round(config.typical_range_km * 0.3)
|
|
end
|
|
end
|
|
|
|
defp band_info(band_mhz) do
|
|
config = BandConfig.get(band_mhz)
|
|
|
|
%{
|
|
band_label: config.label,
|
|
typical_range_km: config.typical_range_km,
|
|
extended_range_km: config.extended_range_km,
|
|
exceptional_range_km: config.exceptional_range_km,
|
|
humidity_effect: to_string(config.humidity_effect),
|
|
freq_mhz: config.freq_mhz
|
|
}
|
|
end
|
|
|
|
defp time_ago(dt) do
|
|
seconds = DateTime.diff(DateTime.utc_now(), dt)
|
|
|
|
cond do
|
|
seconds < 60 -> "just now"
|
|
seconds < 3600 -> "#{div(seconds, 60)}m ago"
|
|
seconds < 86_400 -> "#{div(seconds, 3600)}h ago"
|
|
true -> "#{div(seconds, 86_400)}d ago"
|
|
end
|
|
end
|
|
|
|
defp selected_label(bands, selected_band) do
|
|
case Enum.find(bands, &(&1.freq_mhz == selected_band)) do
|
|
nil -> "Select Band"
|
|
band -> band.label
|
|
end
|
|
end
|
|
|
|
@impl true
|
|
def render(assigns) do
|
|
~H"""
|
|
<div class="relative w-screen h-screen">
|
|
<%!-- Full-page map --%>
|
|
<div
|
|
id="propagation-map"
|
|
phx-hook="PropagationMap"
|
|
phx-update="ignore"
|
|
data-scores={@initial_scores_json}
|
|
data-band-info={Jason.encode!(band_info(@selected_band))}
|
|
class="absolute inset-0 z-0"
|
|
>
|
|
</div>
|
|
|
|
<%!-- Top-left control panel --%>
|
|
<div id="map-controls" class="absolute top-3 left-14 z-[1000] flex flex-col gap-2">
|
|
<div class="bg-base-100/90 shadow rounded-box border border-base-300 p-3 flex flex-col gap-2">
|
|
<div class="font-bold text-sm leading-tight px-1">
|
|
North Texas Microwave Society
|
|
<div class="font-normal text-xs opacity-70">Propagation Map</div>
|
|
</div>
|
|
|
|
<%!-- Band selector --%>
|
|
<div class="dropdown">
|
|
<div tabindex="0" role="button" class="btn btn-sm w-full justify-between">
|
|
{selected_label(@bands, @selected_band)}
|
|
<.icon name="hero-chevron-down" class="size-3" />
|
|
</div>
|
|
<ul
|
|
tabindex="0"
|
|
class="dropdown-content menu bg-base-100 rounded-box shadow-lg w-44 mt-1 p-1"
|
|
>
|
|
<li :for={band <- @bands}>
|
|
<button
|
|
onclick="document.activeElement.blur()"
|
|
phx-click={
|
|
JS.dispatch("show-loading", to: "#propagation-map")
|
|
|> JS.push("select_band", value: %{value: band.freq_mhz})
|
|
}
|
|
class={[if(@selected_band == band.freq_mhz, do: "active")]}
|
|
>
|
|
{band.label}
|
|
</button>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<%!-- Grid toggle --%>
|
|
<label class="flex items-center gap-2 cursor-pointer px-1">
|
|
<input
|
|
type="checkbox"
|
|
class="toggle toggle-sm toggle-primary"
|
|
checked={@grid_visible}
|
|
phx-click="toggle_grid"
|
|
/>
|
|
<span class="text-sm">Grid squares</span>
|
|
</label>
|
|
|
|
<%!-- Antenna height --%>
|
|
<form phx-change="set_antenna_height" class="flex items-center gap-2 px-1">
|
|
<label class="text-sm whitespace-nowrap">Antenna</label>
|
|
<input
|
|
type="number"
|
|
name="height_ft"
|
|
min="0"
|
|
max="200"
|
|
step="1"
|
|
value={@antenna_height_ft}
|
|
class="input input-xs w-16 text-right"
|
|
/>
|
|
<span class="text-xs opacity-70">ft</span>
|
|
</form>
|
|
|
|
<%!-- Latest data --%>
|
|
<div :if={@valid_time} class="text-xs opacity-70 px-1">
|
|
Data: {Calendar.strftime(@valid_time, "%b %d, %H:%M UTC")} ({time_ago(@valid_time)})
|
|
</div>
|
|
|
|
<%!-- Links --%>
|
|
<div class="flex flex-col gap-1 border-t border-base-300 pt-2">
|
|
<.link navigate="/algo" class="btn btn-xs btn-ghost justify-start gap-1.5">
|
|
<.icon name="hero-calculator" class="size-3.5" /> Scoring Algorithm
|
|
</.link>
|
|
<.link navigate="/submit" class="btn btn-xs btn-ghost justify-start gap-1.5">
|
|
<.icon name="hero-arrow-up-tray" class="size-3.5" /> Submit a QSO
|
|
</.link>
|
|
</div>
|
|
</div>
|
|
|
|
<%!-- Point detail panel (populated by JS on click) --%>
|
|
<div
|
|
id="detail-panel"
|
|
class="bg-neutral text-neutral-content shadow rounded-box border border-base-300 overflow-hidden"
|
|
style="display:none;"
|
|
>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<Layouts.flash_group flash={@flash} />
|
|
"""
|
|
end
|
|
end
|