mirror of
https://github.com/DJ2LS/FreeDATA
synced 2024-05-14 08:04:33 +00:00
More grid work
This commit is contained in:
Mashintime
parent
fbc4e807cf
commit
5c6f486efd
4 changed files with 333 additions and 6 deletions
|
|
@ -12,8 +12,8 @@ import active_heard_stations from "./grid_active_heard_stations.vue";
|
|||
import mini_heard_stations from "./grid_active_heard_stations_mini.vue";
|
||||
import active_stats from "./grid_active_stats.vue";
|
||||
import active_audio_level from "./grid_active_audio.vue";
|
||||
import active_rig_control from "./main_active_rig_control.vue";
|
||||
import active_broadcats from "./main_active_broadcasts.vue";
|
||||
import active_rig_control from "./grid_active_rig_control.vue";
|
||||
import active_broadcats from "./grid_active_broadcasts.vue";
|
||||
import s_meter from "./grid_s-meter.vue";
|
||||
import dbfs_meter from "./grid_dbfs.vue";
|
||||
import { stateDispatcher } from "../js/eventHandler";
|
||||
|
|
@ -46,16 +46,16 @@ const gridWidgets = [
|
|||
{ x: 0, y: 0, w: 4, h: 35 },
|
||||
"Stats (waterfall, etc)",
|
||||
),
|
||||
new gridWidget(active_audio_level, { x: 0, y: 0, w: 5, h: 11 }, "Audio"),
|
||||
new gridWidget(active_audio_level, { x: 0, y: 0, w: 4, h: 13 }, "Audio"),
|
||||
new gridWidget(
|
||||
active_rig_control,
|
||||
{ x: 0, y: 0, w: 6, h: 12 },
|
||||
"Rig control",
|
||||
),
|
||||
new gridWidget(active_broadcats, { x: 1, y: 1, w: 5, h: 12 }, "Broadcats"),
|
||||
new gridWidget(active_broadcats, { x: 1, y: 1, w: 4, h: 12 }, "Broadcats"),
|
||||
new gridWidget(
|
||||
mini_heard_stations,
|
||||
{ x: 1, y: 1, w: 2, h: 27 },
|
||||
{ x: 1, y: 1, w: 3, h: 27 },
|
||||
"Mini Heard stations",
|
||||
),
|
||||
new gridWidget(
|
||||
|
|
|
|||
95
gui/src/components/grid_active_broadcasts.vue
Normal file
95
gui/src/components/grid_active_broadcasts.vue
Normal file
|
|
@ -0,0 +1,95 @@
|
|||
<script setup lang="ts">
|
||||
|
||||
import { setActivePinia } from "pinia";
|
||||
import pinia from "../store/index";
|
||||
setActivePinia(pinia);
|
||||
|
||||
import { settingsStore as settings} from "../store/settingsStore.js";
|
||||
|
||||
import { useStateStore } from "../store/stateStore.js";
|
||||
const state = useStateStore(pinia);
|
||||
|
||||
import { sendModemCQ, sendModemPing, setModemBeacon } from "../js/api.js";
|
||||
|
||||
function transmitPing() {
|
||||
sendModemPing((<HTMLInputElement>document.getElementById("dxCall")).value);
|
||||
}
|
||||
|
||||
function startStopBeacon() {
|
||||
if (state.beacon_state === true) {
|
||||
setModemBeacon(false);
|
||||
}
|
||||
else {
|
||||
setModemBeacon(true);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<div class="card h-100">
|
||||
<div class="card-header">
|
||||
<div>
|
||||
<div>
|
||||
<i class="bi bi-broadcast" style="font-size: 1.2rem"></i>
|
||||
<strong>Broadcasts</strong>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body overflow-auto">
|
||||
<div>
|
||||
<div >
|
||||
<div class="input-group input-group-sm mb-0">
|
||||
<input
|
||||
type="text"
|
||||
class="form-control"
|
||||
style="max-width: 6rem; text-transform: uppercase"
|
||||
placeholder="DXcall"
|
||||
pattern="[A-Z]*"
|
||||
id="dxCall"
|
||||
maxlength="11"
|
||||
aria-label="Input group"
|
||||
aria-describedby="btnGroupAddon"
|
||||
/>
|
||||
<button
|
||||
class="btn btn-sm btn-outline-secondary ms-1"
|
||||
id="sendPing"
|
||||
type="button"
|
||||
data-bs-placement="bottom"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-trigger="hover"
|
||||
data-bs-html="false"
|
||||
title="Send a ping request to a remote station"
|
||||
@click="transmitPing()"
|
||||
>
|
||||
Ping
|
||||
</button>
|
||||
|
||||
<button
|
||||
class="btn btn-sm btn-outline-secondary ms-1"
|
||||
id="sendCQ"
|
||||
type="button"
|
||||
title="Send a CQ to the world"
|
||||
@click="sendModemCQ()"
|
||||
>
|
||||
Call CQ
|
||||
</button>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
id="startBeacon"
|
||||
class="btn btn-sm ms-1"
|
||||
@click="startStopBeacon()"
|
||||
v-bind:class="{
|
||||
'btn-success': state.beacon_state === true,
|
||||
'btn-outline-secondary': state.beacon_state === false,
|
||||
}"
|
||||
title="Toggle beacon mode. The interval can be set in settings. While sending a beacon, you can receive ping requests and open a datachannel. If a datachannel is opened, the beacon pauses."
|
||||
>
|
||||
<i class="bi bi-soundwave"></i> Toggle beacon
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end of row-->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
232
gui/src/components/grid_active_rig_control.vue
Normal file
232
gui/src/components/grid_active_rig_control.vue
Normal file
|
|
@ -0,0 +1,232 @@
|
|||
<script setup lang="ts">
|
||||
import { setActivePinia } from "pinia";
|
||||
import pinia from "../store/index";
|
||||
setActivePinia(pinia);
|
||||
|
||||
import { useStateStore } from "../store/stateStore.js";
|
||||
const state = useStateStore(pinia);
|
||||
|
||||
function updateFrequencyAndApply(frequency) {
|
||||
state.new_frequency = frequency;
|
||||
set_frequency(state.new_frequency);
|
||||
}
|
||||
|
||||
function set_hamlib_frequency_manually() {
|
||||
set_frequency(state.new_frequency);
|
||||
}
|
||||
|
||||
function set_hamlib_mode() {
|
||||
set_mode(state.mode);
|
||||
}
|
||||
|
||||
function set_hamlib_rf_level() {
|
||||
set_rf_level(state.rf_level);
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="card h-100">
|
||||
<div class="card-header">
|
||||
<i class="bi bi-house-door" style="font-size: 1.2rem"></i>
|
||||
<strong>Radio control</strong>
|
||||
</div>
|
||||
|
||||
<div class="card-body overflow-auto">
|
||||
<div class="input-group input-group-sm bottom-0 m-0">
|
||||
<div class="me-2">
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="input-group-text">QRG</span>
|
||||
<span class="input-group-text">{{ state.frequency }} Hz</span>
|
||||
|
||||
<!-- Dropdown Button -->
|
||||
<button
|
||||
v-bind:class="{
|
||||
disabled: state.hamlib_status === 'disconnected',
|
||||
}"
|
||||
class="btn btn-secondary dropdown-toggle"
|
||||
type="button"
|
||||
id="dropdownMenuButton"
|
||||
data-bs-toggle="dropdown"
|
||||
aria-expanded="false"
|
||||
></button>
|
||||
|
||||
<!-- Dropdown Menu -->
|
||||
<ul class="dropdown-menu" aria-labelledby="dropdownMenuButton" style="z-index: 50;">
|
||||
<li>
|
||||
<div class="input-group p-1">
|
||||
<span class="input-group-text">frequency</span>
|
||||
|
||||
<input
|
||||
v-model="state.new_frequency"
|
||||
style="max-width: 8rem"
|
||||
pattern="[0-9]*"
|
||||
type="text"
|
||||
class="form-control form-control-sm"
|
||||
v-bind:class="{
|
||||
disabled: state.hamlib_status === 'disconnected',
|
||||
}"
|
||||
placeholder="Type frequency..."
|
||||
aria-label="Frequency"
|
||||
/>
|
||||
<button
|
||||
class="btn btn-sm btn-outline-success"
|
||||
type="button"
|
||||
@click="set_hamlib_frequency_manually"
|
||||
v-bind:class="{
|
||||
disabled: state.hamlib_status === 'disconnected',
|
||||
}"
|
||||
>
|
||||
<i class="bi bi-check-square"></i>
|
||||
</button>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<!-- Dropdown Divider -->
|
||||
<li><hr class="dropdown-divider" /></li>
|
||||
<!-- Dropdown Items -->
|
||||
<li>
|
||||
<a
|
||||
class="dropdown-item"
|
||||
href="#"
|
||||
@click="updateFrequencyAndApply(50616000)"
|
||||
><strong>50616 kHz</strong>
|
||||
<span class="badge bg-secondary">6m | USB</span>
|
||||
<span class="badge bg-info">EU | US</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="dropdown-item"
|
||||
href="#"
|
||||
@click="updateFrequencyAndApply(50308000)"
|
||||
><strong>50308 kHz</strong>
|
||||
<span class="badge bg-secondary">6m | USB</span>
|
||||
<span class="badge bg-info">US</span></a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="dropdown-item"
|
||||
href="#"
|
||||
@click="updateFrequencyAndApply(28093000)"
|
||||
><strong>28093 kHz</strong>
|
||||
<span class="badge bg-secondary">10m | USB</span>
|
||||
<span class="badge bg-info">EU | US</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="dropdown-item"
|
||||
href="#"
|
||||
@click="updateFrequencyAndApply(27265000)"
|
||||
><strong>27265 kHz</strong>
|
||||
<span class="badge bg-secondary">11m | USB</span>
|
||||
<span class="badge bg-dark">Ch 26</span></a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="dropdown-item"
|
||||
href="#"
|
||||
@click="updateFrequencyAndApply(27245000)"
|
||||
><strong>27245 kHz</strong>
|
||||
<span class="badge bg-secondary">11m | USB</span>
|
||||
<span class="badge bg-dark">Ch 25</span></a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="dropdown-item"
|
||||
href="#"
|
||||
@click="updateFrequencyAndApply(24908000)"
|
||||
><strong>24908 kHz</strong>
|
||||
<span class="badge bg-secondary">12m | USB</span>
|
||||
<span class="badge bg-info">EU | US</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="dropdown-item"
|
||||
href="#"
|
||||
@click="updateFrequencyAndApply(21093000)"
|
||||
><strong>21093 kHz</strong>
|
||||
<span class="badge bg-secondary">15m | USB</span>
|
||||
<span class="badge bg-info">EU | US</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="dropdown-item"
|
||||
href="#"
|
||||
@click="updateFrequencyAndApply(14093000)"
|
||||
><strong>14093 kHz</strong>
|
||||
<span class="badge bg-secondary">20m | USB</span>
|
||||
<span class="badge bg-info">EU | US</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="dropdown-item"
|
||||
href="#"
|
||||
@click="updateFrequencyAndApply(7053000)"
|
||||
><strong>7053 kHz</strong>
|
||||
<span class="badge bg-secondary">40m | USB</span>
|
||||
<span class="badge bg-info">EU | US</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="me-2">
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="input-group-text">Mode</span>
|
||||
<select
|
||||
class="form-control"
|
||||
v-model="state.mode"
|
||||
@click="set_hamlib_mode()"
|
||||
v-bind:class="{
|
||||
disabled: state.hamlib_status === 'disconnected',
|
||||
}"
|
||||
>
|
||||
<option value="USB">USB</option>
|
||||
<option value="LSB">LSB</option>
|
||||
<option value="PKTUSB">PKT-U</option>
|
||||
<option value="PKTLSB">PKT-L</option>
|
||||
<option value="AM">AM</option>
|
||||
<option value="FM">FM</option>
|
||||
<option value="PKTFM">PKTFM</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="me-2">
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="input-group-text">% Power</span>
|
||||
<select
|
||||
class="form-control"
|
||||
v-model="state.rf_level"
|
||||
@click="set_hamlib_rf_level()"
|
||||
v-bind:class="{
|
||||
disabled: state.hamlib_status === 'disconnected',
|
||||
}"
|
||||
>
|
||||
<option value="0">-</option>
|
||||
<option value="10">10</option>
|
||||
<option value="20">20</option>
|
||||
<option value="30">30</option>
|
||||
<option value="40">40</option>
|
||||
<option value="50">50</option>
|
||||
<option value="60">60</option>
|
||||
<option value="70">70</option>
|
||||
<option value="80">80</option>
|
||||
<option value="90">90</option>
|
||||
<option value="100">100</option>
|
||||
</select>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -36,7 +36,7 @@ export const useStateStore = defineStore("stateStore", () => {
|
|||
|
||||
var arq_session_state = ref("");
|
||||
var arq_state = ref("");
|
||||
var beacon_state = ref("False");
|
||||
var beacon_state = ref(false);
|
||||
|
||||
var audio_recording = ref(false);
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue