mirror of
https://github.com/DJ2LS/FreeDATA
synced 2024-05-14 08:04:33 +00:00
timeout indicator now functional
This commit is contained in:
DJ2LS
parent
87388268e3
commit
43cd15ecc6
6 changed files with 181 additions and 122 deletions
|
|
@ -44,7 +44,12 @@ function chatSelected(callsign){
|
|||
<div class="row">
|
||||
<div class="col-9">{{item}}</div>
|
||||
<div class="col-3">
|
||||
<button class="btn btn-sm btn-outline-danger ms-2" @click="deleteChat(item)"><i class="bi bi-trash"></i></button>
|
||||
|
||||
<button class="btn btn-sm btn-outline-danger ms-2" @click="deleteChat(item)"><i class="bi bi-trash"></i></button>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
|
|
|||
|
|
@ -137,118 +137,136 @@ const scatterChartData = computed(() => ({
|
|||
]
|
||||
}
|
||||
));
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="card mb-1">
|
||||
<div class="card-header p-1">
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-11">
|
||||
<div
|
||||
class="btn-group"
|
||||
role="group"
|
||||
>
|
||||
|
||||
<div class="list-group list-group-horizontal" id="list-tab" role="tablist">
|
||||
<a class="py-1 list-group-item list-group-item-action" id="list-waterfall-list" data-bs-toggle="list" href="#list-waterfall" role="tab" aria-controls="list-waterfall" v-bind:class="{ 'active' : settings.spectrum === 'waterfall'}" @click="selectStatsControl($event)"><strong><i class="bi bi-water" ></i></strong></a>
|
||||
<a class="py-1 list-group-item list-group-item-action" id="list-scatter-list" data-bs-toggle="list" href="#list-scatter" role="tab" aria-controls="list-scatter" v-bind:class="{ 'active' : settings.spectrum === 'scatter'}" @click="selectStatsControl($event)"><strong><i class="bi bi-border-outer" ></i></strong></a>
|
||||
<a class="py-1 list-group-item list-group-item-action" id="list-chart-list" data-bs-toggle="list" href="#list-chart" role="tab" aria-controls="list-chart" v-bind:class="{ 'active' : settings.spectrum === 'chart'}" @click="selectStatsControl($event)"><strong><i class="bi bi-graph-up-arrow" ></i></strong></a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div
|
||||
class="btn-group"
|
||||
role="group"
|
||||
aria-label="Busy indicators"
|
||||
>
|
||||
<button
|
||||
class="btn btn-sm ms-2 disabled"
|
||||
type="button"
|
||||
data-bs-placement="top"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-trigger="hover"
|
||||
data-bs-html="true"
|
||||
v-bind:class="{ 'btn-warning' : state.channel_busy === 'True', 'btn-outline-secondary' : state.channel_busy === 'False'}"
|
||||
title="Channel busy state: <strong class='text-success'>not busy</strong> / <strong class='text-danger'>busy </strong>"
|
||||
>
|
||||
busy
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-sm disabled"
|
||||
type="button"
|
||||
data-bs-placement="top"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-trigger="hover"
|
||||
data-bs-html="true"
|
||||
title="Recieving data: illuminates <strong class='text-success'>green</strong> if receiving codec2 data"
|
||||
v-bind:class="{ 'btn-success' : state.is_codec2_traffic === 'True', 'btn-outline-secondary' : state.is_codec2_traffic === 'False'}"
|
||||
>
|
||||
signal
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-1 text-end">
|
||||
<button
|
||||
type="button"
|
||||
id="openHelpModalWaterfall"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#waterfallHelpModal"
|
||||
class="btn m-0 p-0 border-0"
|
||||
>
|
||||
<i
|
||||
class="bi bi-question-circle"
|
||||
style="font-size: 1rem"
|
||||
></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body p-1" style="height: 200px">
|
||||
|
||||
|
||||
<div class="tab-content" id="nav-stats-tabContent">
|
||||
<div class="tab-pane fade" v-bind:class="{ 'show active' : settings.spectrum === 'waterfall'}" id="list-waterfall" role="stats_tabpanel" aria-labelledby="list-waterfall-list"><canvas
|
||||
id="waterfall"
|
||||
style="position: relative; z-index: 2"
|
||||
class="force-gpu"
|
||||
></canvas></div>
|
||||
<div class="tab-pane fade" v-bind:class="{ 'show active' : settings.spectrum === 'scatter'}" id="list-scatter" role="tabpanel" aria-labelledby="list-scatter-list">
|
||||
|
||||
<Line :data="scatterChartData" :options="scatterChartOptions" />
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<div class="tab-pane fade" v-bind:class="{ 'show active' : settings.spectrum === 'chart'}" id="list-chart" role="tabpanel" aria-labelledby="list-chart-list">
|
||||
|
||||
<Line :data="transmissionSpeedChartData" :options="transmissionSpeedChartOptions" />
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!--278px-->
|
||||
|
||||
|
||||
|
||||
<div class="card mb-1">
|
||||
<div class="card-header p-1">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-11">
|
||||
<div class="btn-group" role="group">
|
||||
<div
|
||||
class="list-group list-group-horizontal"
|
||||
id="list-tab"
|
||||
role="tablist"
|
||||
>
|
||||
<a
|
||||
class="py-1 list-group-item list-group-item-action"
|
||||
id="list-waterfall-list"
|
||||
data-bs-toggle="list"
|
||||
href="#list-waterfall"
|
||||
role="tab"
|
||||
aria-controls="list-waterfall"
|
||||
v-bind:class="{ 'active' : settings.spectrum === 'waterfall'}"
|
||||
@click="selectStatsControl($event)"
|
||||
><strong><i class="bi bi-water"></i></strong
|
||||
></a>
|
||||
<a
|
||||
class="py-1 list-group-item list-group-item-action"
|
||||
id="list-scatter-list"
|
||||
data-bs-toggle="list"
|
||||
href="#list-scatter"
|
||||
role="tab"
|
||||
aria-controls="list-scatter"
|
||||
v-bind:class="{ 'active' : settings.spectrum === 'scatter'}"
|
||||
@click="selectStatsControl($event)"
|
||||
><strong><i class="bi bi-border-outer"></i></strong
|
||||
></a>
|
||||
<a
|
||||
class="py-1 list-group-item list-group-item-action"
|
||||
id="list-chart-list"
|
||||
data-bs-toggle="list"
|
||||
href="#list-chart"
|
||||
role="tab"
|
||||
aria-controls="list-chart"
|
||||
v-bind:class="{ 'active' : settings.spectrum === 'chart'}"
|
||||
@click="selectStatsControl($event)"
|
||||
><strong><i class="bi bi-graph-up-arrow"></i></strong
|
||||
></a>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<div class="btn-group" role="group" aria-label="Busy indicators">
|
||||
<button
|
||||
class="btn btn-sm ms-2 disabled"
|
||||
type="button"
|
||||
data-bs-placement="top"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-trigger="hover"
|
||||
data-bs-html="true"
|
||||
v-bind:class="{ 'btn-warning' : state.channel_busy === 'True', 'btn-outline-secondary' : state.channel_busy === 'False'}"
|
||||
title="Channel busy state: <strong class='text-success'>not busy</strong> / <strong class='text-danger'>busy </strong>"
|
||||
>
|
||||
busy
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-sm disabled"
|
||||
type="button"
|
||||
data-bs-placement="top"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-trigger="hover"
|
||||
data-bs-html="true"
|
||||
title="Recieving data: illuminates <strong class='text-success'>green</strong> if receiving codec2 data"
|
||||
v-bind:class="{ 'btn-success' : state.is_codec2_traffic === 'True', 'btn-outline-secondary' : state.is_codec2_traffic === 'False'}"
|
||||
>
|
||||
signal
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-1 text-end">
|
||||
<button
|
||||
type="button"
|
||||
id="openHelpModalWaterfall"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#waterfallHelpModal"
|
||||
class="btn m-0 p-0 border-0"
|
||||
>
|
||||
<i class="bi bi-question-circle" style="font-size: 1rem"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body p-1" style="height: 200px">
|
||||
<div class="tab-content" id="nav-stats-tabContent">
|
||||
<div
|
||||
class="tab-pane fade"
|
||||
v-bind:class="{ 'show active' : settings.spectrum === 'waterfall'}"
|
||||
id="list-waterfall"
|
||||
role="stats_tabpanel"
|
||||
aria-labelledby="list-waterfall-list"
|
||||
>
|
||||
<canvas
|
||||
id="waterfall"
|
||||
style="position: relative; z-index: 2"
|
||||
class="force-gpu"
|
||||
></canvas>
|
||||
</div>
|
||||
<div
|
||||
class="tab-pane fade"
|
||||
v-bind:class="{ 'show active' : settings.spectrum === 'scatter'}"
|
||||
id="list-scatter"
|
||||
role="tabpanel"
|
||||
aria-labelledby="list-scatter-list"
|
||||
>
|
||||
<Line :data="scatterChartData" :options="scatterChartOptions" />
|
||||
</div>
|
||||
<div
|
||||
class="tab-pane fade"
|
||||
v-bind:class="{ 'show active' : settings.spectrum === 'chart'}"
|
||||
id="list-chart"
|
||||
role="tabpanel"
|
||||
aria-labelledby="list-chart-list"
|
||||
>
|
||||
<Line
|
||||
:data="transmissionSpeedChartData"
|
||||
:options="transmissionSpeedChartOptions"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--278px-->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -249,10 +249,10 @@ const settings = useSettingsStore(pinia);
|
|||
aria-valuemax="100"
|
||||
></div>
|
||||
<p
|
||||
class="justify-content-center mt-2 d-flex position-absolute w-100"
|
||||
class="justify-content-center m-0 d-flex position-absolute w-100"
|
||||
|
||||
>
|
||||
---
|
||||
{{state.arq_seconds_until_finish}}s left
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
|
@ -262,11 +262,19 @@ const settings = useSettingsStore(pinia);
|
|||
class="progress-bar progress-bar-striped bg-warning"
|
||||
id="transmission_timeleft"
|
||||
role="progressbar"
|
||||
:style="{ width: state.arq_transmission_percent + '%' }"
|
||||
aria-valuenow="1"
|
||||
:style="{ width: state.arq_seconds_until_timeout_percent + '%' }"
|
||||
aria-valuenow="0"
|
||||
aria-valuemin="0"
|
||||
aria-valuemax="100"
|
||||
></div>
|
||||
>
|
||||
|
||||
<p
|
||||
class="justify-content-center m-0 d-flex position-absolute w-100"
|
||||
|
||||
>
|
||||
timeout in: {{state.arq_seconds_until_timeout}}s
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -226,7 +226,7 @@ export function newMessage(dxcallsign, chatmessage, chatFile, chatFileName, chat
|
|||
|
||||
|
||||
|
||||
|
||||
// function for creating a list, accessible by callsign
|
||||
function sortChatList(){
|
||||
|
||||
// Create an empty object to store the reordered data dynamically
|
||||
|
|
@ -246,6 +246,26 @@ function sortChatList(){
|
|||
return reorderedData
|
||||
}
|
||||
|
||||
// function for creating a list, accessible by callsign
|
||||
function sortBeaconList(){
|
||||
|
||||
// Create an empty object to store the reordered data dynamically
|
||||
var reorderedData = {};
|
||||
var jsonObjects = chat.unsorted_beacon_list
|
||||
// Iterate through the list of JSON objects and reorder them dynamically
|
||||
jsonObjects.forEach(obj => {
|
||||
var dxcallsign = obj.dxcallsign;
|
||||
if (dxcallsign) {
|
||||
if (!reorderedData[dxcallsign]) {
|
||||
reorderedData[dxcallsign] = [];
|
||||
}
|
||||
reorderedData[dxcallsign].push(obj);
|
||||
}
|
||||
});
|
||||
//console.log(reorderedData["DJ2LS-0"])
|
||||
return reorderedData
|
||||
}
|
||||
|
||||
//repeat a message
|
||||
export function repeatMessageTransmission(id){
|
||||
console.log(id)
|
||||
|
|
@ -295,12 +315,18 @@ export async function updateAllChat() {
|
|||
})
|
||||
.then(async function (result) {
|
||||
for (var item of result.docs) {
|
||||
chat.callsign_list.add(item.dxcallsign)
|
||||
chat.unsorted_chat_list.push(item)
|
||||
if(item.type === 'beacon'){
|
||||
chat.callsign_list.add(item.dxcallsign)
|
||||
chat.unsorted_beacon_list.push(item)
|
||||
} else {
|
||||
chat.callsign_list.add(item.dxcallsign)
|
||||
chat.unsorted_chat_list.push(item)
|
||||
}
|
||||
}
|
||||
|
||||
chat.sorted_chat_list = sortChatList()
|
||||
|
||||
console.log(chat.unsorted_beacon_list)
|
||||
console.log(chat.sorted_beacon_list)
|
||||
|
||||
console.log(chat.sorted_chat_list["EI7IG-0"])
|
||||
|
||||
|
|
|
|||
|
|
@ -243,7 +243,6 @@ client.on("data", function (socketdata) {
|
|||
arq_n_arq_frames_per_data_frame:
|
||||
data["arq_n_arq_frames_per_data_frame"],
|
||||
arq_bytes_per_minute: data["arq_bytes_per_minute"],
|
||||
arq_seconds_until_finish: data["arq_seconds_until_finish"],
|
||||
arq_compression_factor: data["arq_compression_factor"],
|
||||
routing_table: data["routing_table"],
|
||||
mesh_signalling_table: data["mesh_signalling_table"],
|
||||
|
|
|
|||
|
|
@ -25,11 +25,14 @@ export const useChatStore = defineStore('chatStore', () => {
|
|||
var sorted_chat_list = ref()
|
||||
var unsorted_chat_list = ref([])
|
||||
|
||||
var sorted_beacon_list = ref()
|
||||
var unsorted_beacon_list = ref([])
|
||||
|
||||
var chartSpeedPER0 = ref()
|
||||
var chartSpeedPER25 = ref()
|
||||
var chartSpeedPER75 = ref()
|
||||
|
||||
var beaconDataArray = ref([-3, 10, 8, 5, 3, 0, -5, 10, 8, 5, 3, 0, -5, 10, 8, 5, 3, 0, -5, 10, 8, 5, 3, 0, -5])
|
||||
var beaconLabelArray = ref(['18:10', '19:00', '23:00', '01:13', '04:25', '08:15', '09:12', '18:10', '19:00', '23:00', '01:13', '04:25', '08:15', '09:12', '18:10', '19:00', '23:00', '01:13', '04:25', '08:15', '09:12', '01:13', '04:25', '08:15', '09:12'])
|
||||
return {selectedCallsign, inputText, chat_filter, callsign_list, sorted_chat_list, unsorted_chat_list, inputFileName, inputFileSize, inputFileType, inputFile, chartSpeedPER0, chartSpeedPER25, chartSpeedPER75, beaconDataArray, beaconLabelArray };
|
||||
return {selectedCallsign, inputText, chat_filter, callsign_list, sorted_chat_list, unsorted_chat_list, inputFileName, inputFileSize, inputFileType, inputFile, chartSpeedPER0, chartSpeedPER25, chartSpeedPER75, beaconDataArray, beaconLabelArray , unsorted_beacon_list, sorted_beacon_list };
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in a new issue