Skip to content

Commit

Permalink
#190 #191 #195
Browse files Browse the repository at this point in the history
  • Loading branch information
@cugarteblair
cugarteblair committed Dec 17, 2024
1 parent 35da6b1 commit 76815b5
Show file tree
Hide file tree
Showing 14 changed files with 174 additions and 227 deletions.
8 changes: 4 additions & 4 deletions web-client/src/App.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,9 +68,9 @@ onMounted(() => {
checkUnsupported();
});
const mapButtonClick = () => {
console.log('Map button clicked');
router.push('/map');
const requestButtonClick = () => {
console.log('Request button clicked');
router.push('/request');
};
const recordButtonClick = () => {
Expand Down Expand Up @@ -115,7 +115,7 @@ const handleVersionButtonClick = () => {
</div>
<header class="app-header">
<SrAppBar
@map-button-click="mapButtonClick"
@request-button-click="requestButtonClick"
@record-button-click="recordButtonClick"
@analysis-button-click="analysisButtonClick"
@about-button-click="aboutButtonClick"
Expand Down
2 changes: 1 addition & 1 deletion web-client/src/components/SrAnalysisMap.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@
const computedLoadMsg = computed(() => {
const currentRowsFormatted = numberFormatter.format(mapStore.getCurrentRows());
const totalRowsFormatted = numberFormatter.format(mapStore.getTotalRows());
if (mapStore.getCurRowsProcessed() != mapStore.getTotalRows()) {
if (mapStore.getCurrentRows() != mapStore.getTotalRows()) {
return `${loadStateStr.value} ${computedFunc.value} ${currentRowsFormatted} out of ${totalRowsFormatted}`;
} else {
return `${loadStateStr.value} ${computedFunc.value} (${currentRowsFormatted})`;
Expand Down
53 changes: 50 additions & 3 deletions web-client/src/components/SrAnalyzeOptSidebar.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@ import { useMapStore } from '@/stores/mapStore';
import { useAtlChartFilterStore } from '@/stores/atlChartFilterStore';
import { useRequestsStore } from '@/stores/requestsStore';
import { useDeckStore } from '@/stores/deckStore';
import { useDebugStore } from '@/stores/debugStore';
import { updateCycleOptions, updateRgtOptions, updatePairOptions, updateScOrientOptions, updateTrackOptions } from '@/utils/SrDuckDbUtils';
import { getDetailsFromSpotNumber } from '@/utils/spotUtils';
import { debounce } from "lodash";
Expand All @@ -25,12 +24,13 @@ import { useToast } from 'primevue/usetoast';
import { useSrToastStore } from "@/stores/srToastStore";
import SrEditDesc from './SrEditDesc.vue';
import SrScatterPlotOptions from "./SrScatterPlotOptions.vue";
import Fieldset from 'primevue/fieldset';
import MultiSelect from 'primevue/multiselect';
import { useChartStore } from '@/stores/chartStore';
import { refreshScatterPlot,updateChartStore } from '@/utils/plotUtils';
import { updateWhereClause } from '@/utils/SrMapUtils';
import { db as indexedDb } from "@/db/SlideRuleDb";
import SrCustomTooltip from './SrCustomTooltip.vue';
import Button from 'primevue/button';
const requestsStore = useRequestsStore();
const atlChartFilterStore = useAtlChartFilterStore();
Expand Down Expand Up @@ -62,7 +62,7 @@ const spotPatternBriefStr = "fields related to spots and beams patterns";
const props = defineProps({
startingReqId: Number,
});
const tooltipRef = ref();
const defaultReqIdMenuItemIndex = ref(0);
const selectedReqId = ref({name:'0', value:'0'});
const selectedElevationColorMap = ref({name:'viridis', value:'viridis'});
Expand Down Expand Up @@ -487,6 +487,40 @@ const getCnt = computed(() => {
const tooltipTextStr = computed(() => {
return "Has " + getCnt.value + " records and is " + getSize.value + " in size";
});
const exportButtonClick = async () => {
let req_id = 0;
try {
req_id = Number(selectedReqId.value.value);
const fileName = await db.getFilename(req_id);
const opfsRoot = await navigator.storage.getDirectory();
const folderName = 'SlideRule';
const directoryHandle = await opfsRoot.getDirectoryHandle(folderName, { create: false });
const fileHandle = await directoryHandle.getFileHandle(fileName, {create:false});
const file = await fileHandle.getFile();
const url = URL.createObjectURL(file);
// Create a download link and click it programmatically
const a = document.createElement('a');
a.href = url;
a.download = fileName;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
// Revoke the object URL
URL.revokeObjectURL(url);
const msg = `File ${fileName} exported successfully!`;
console.log(msg);
alert(msg);
} catch (error) {
console.error(`Failed to expport req_id:${req_id}`, error);
alert(`Failed to export file for req_id:${req_id}`);
throw error;
}
};
</script>

<template>
Expand All @@ -504,6 +538,19 @@ const tooltipTextStr = computed(() => {
:defaultOptionIndex="Number(defaultReqIdMenuItemIndex)"
:tooltipText=tooltipTextStr
/>
<SrCustomTooltip ref="tooltipRef"/>
<Button
icon="pi pi-file-export"
@mouseover="tooltipRef.showTooltip($event, 'Export the current request')"
@mouseleave="tooltipRef.hideTooltip()"
@click="exportButtonClick"
rounded
aria-label="Export"
size="small"
severity="text"
variant="text"
>
</Button>
<MultiSelect
v-if=hasOverlayedReqs
v-model="selectedOverlayedReqIds"
Expand Down
12 changes: 6 additions & 6 deletions web-client/src/components/SrAppBar.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,11 +37,11 @@ const toggleDocsMenu = (event: Event) => {
docsMenu.value?.toggle(event);
};
const emit = defineEmits(['version-button-click','map-button-click', 'popular-button-click', 'record-button-click', 'analysis-button-click', 'about-button-click']);
const emit = defineEmits(['version-button-click','request-button-click', 'popular-button-click', 'record-button-click', 'analysis-button-click', 'about-button-click']);
const handleMapButtonClick = () => {
emit('map-button-click');
const handleRequestButtonClick = () => {
emit('request-button-click');
};
const handleRecordButtonClick = () => {
emit('record-button-click');
Expand Down Expand Up @@ -105,7 +105,7 @@ const mobileMenuItems = [
{
label: 'Map',
icon: 'pi pi-sliders-h',
command: handleMapButtonClick
command: handleRequestButtonClick
},
{
label: 'Record',
Expand Down Expand Up @@ -163,9 +163,9 @@ onMounted(() => {
</Button>
</div>
<div class="right-content">
<Button icon="pi pi-sliders-h" label="Map"
<Button icon="pi pi-sliders-h" label="Request"
class="p-button-rounded p-button-text desktop-only"
@click="handleMapButtonClick"></Button>
@click="handleRequestButtonClick"></Button>
<Button icon="pi pi-list" label="Record"
class="p-button-rounded p-button-text desktop-only"
@click="handleRecordButtonClick"></Button>
Expand Down
26 changes: 6 additions & 20 deletions web-client/src/components/SrMap.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@
import { useToast } from "primevue/usetoast";
import { findSrViewKey } from "@/composables/SrViews";
import { useProjectionNames } from "@/composables/SrProjections";
import { duckDbReadAndUpdateElevationData } from '@/utils/SrDuckDbUtils';
import { srProjections } from "@/composables/SrProjections";
import proj4 from 'proj4';
import { register } from 'ol/proj/proj4';
Expand All @@ -25,7 +24,7 @@
import { clearPolyCoords, drawGeoJson, enableTagDisplay, disableTagDisplay, dumpMapLayers } from "@/utils/SrMapUtils";
import { onActivated } from "vue";
import { onDeactivated } from "vue";
import { initDeck,checkAreaOfConvexHullWarning } from "@/utils/SrMapUtils";
import { checkAreaOfConvexHullWarning } from "@/utils/SrMapUtils";
import { toLonLat } from 'ol/proj';
import { useReqParamsStore } from "@/stores/reqParamsStore";
import { convexHull, isClockwise } from "@/composables/SrTurfUtils";
Expand Down Expand Up @@ -484,11 +483,7 @@
// const plink = mapStore.plink as any;
// map.addControl(plink);
// }
if(mapStore.getCurrentReqId() > 0){
await updateThisMapView("SrMap onMounted",true);
} else {
await updateThisMapView("SrMap onMounted",false);
}
await updateThisMapView("SrMap onMounted");
} else {
console.log("SrMap Error:map is null");
}
Expand Down Expand Up @@ -549,7 +544,7 @@
}
};
const updateThisMapView = async (reason:string,restoreCurrReq:boolean) => {
const updateThisMapView = async (reason:string) => {
console.log(`****** SrMap updateThisMapView for ${reason} ******`);
const map = mapRef.value?.map;
try{
Expand All @@ -565,16 +560,7 @@
// });
map.addLayer(drawVectorLayer);
addLayersForCurrentView(map,srViewObj.projectionName);
if(restoreCurrReq){
const reqId = mapStore.getCurrentReqId();
if(reqId > 0){
await zoomMapForReqIdUsingView(map, mapStore.getCurrentReqId(),srViewKey.value);
initDeck(map);
await duckDbReadAndUpdateElevationData(reqId);
}
} else {
initDeck(map);
}
// dumpMapLayers(map, 'SrMap updateThisMapView initDeck');
// Permalink
Expand Down Expand Up @@ -619,7 +605,7 @@
const map = mapRef.value?.map;
try{
if(map){
await updateThisMapView("handleUpdateSrView",true);
await updateThisMapView("handleUpdateSrView");
} else {
console.error("SrMap Error:map is null");
}
Expand All @@ -637,7 +623,7 @@
const map = mapRef.value?.map;
try{
if(map){
await updateThisMapView("handleUpdateBaseLayer",true);
await updateThisMapView("handleUpdateBaseLayer");
} else {
console.error("SrMap Error:map is null");
}
Expand Down
105 changes: 39 additions & 66 deletions web-client/src/components/SrRunControl.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@
import { onMounted,onBeforeUnmount,ref } from 'vue';
import ProgressSpinner from 'primevue/progressspinner';
import { useMapStore } from '@/stores/mapStore';
import { db } from '@/db/SlideRuleDb';
import { useRequestsStore } from "@/stores/requestsStore";
import { useCurReqSumStore } from '@/stores/curReqSumStore';
import { processRunSlideRuleClicked, processAbortClicked } from "@/utils/workerDomUtils";
Expand Down Expand Up @@ -65,45 +64,45 @@
toast.add({ severity: 'warn', summary: 'No Requests Found', detail: 'Please create a request first', life: srToastStore.getLife() });
}
};
const analysisButtonClick = async () => {
if (atlChartFilterStore.getReqId()) {
router.push(`/analyze/${atlChartFilterStore.getReqId()}`);
} else {
goToAnalysisForCurrent();
}
};
const exportButtonClick = async () => {
let req_id = 0;
try {
req_id = await getActiveReqId();
const fileName = await db.getFilename(req_id);
const opfsRoot = await navigator.storage.getDirectory();
const folderName = 'SlideRule';
const directoryHandle = await opfsRoot.getDirectoryHandle(folderName, { create: false });
const fileHandle = await directoryHandle.getFileHandle(fileName, {create:false});
const file = await fileHandle.getFile();
const url = URL.createObjectURL(file);
// Create a download link and click it programmatically
const a = document.createElement('a');
a.href = url;
a.download = fileName;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
// Revoke the object URL
URL.revokeObjectURL(url);
const msg = `File ${fileName} exported successfully!`;
console.log(msg);
alert(msg);
} catch (error) {
console.error(`Failed to expport req_id:${req_id}`, error);
alert(`Failed to export file for req_id:${req_id}`);
throw error;
}
};
// const analysisButtonClick = async () => {
// if (atlChartFilterStore.getReqId()) {
// router.push(`/analyze/${atlChartFilterStore.getReqId()}`);
// } else {
// goToAnalysisForCurrent();
// }
// };
// const exportButtonClick = async () => {
// let req_id = 0;
// try {
// req_id = await getActiveReqId();
// const fileName = await db.getFilename(req_id);
// const opfsRoot = await navigator.storage.getDirectory();
// const folderName = 'SlideRule';
// const directoryHandle = await opfsRoot.getDirectoryHandle(folderName, { create: false });
// const fileHandle = await directoryHandle.getFileHandle(fileName, {create:false});
// const file = await fileHandle.getFile();
// const url = URL.createObjectURL(file);
// // Create a download link and click it programmatically
// const a = document.createElement('a');
// a.href = url;
// a.download = fileName;
// document.body.appendChild(a);
// a.click();
// document.body.removeChild(a);
// // Revoke the object URL
// URL.revokeObjectURL(url);
// const msg = `File ${fileName} exported successfully!`;
// console.log(msg);
// alert(msg);
// } catch (error) {
// console.error(`Failed to expport req_id:${req_id}`, error);
// alert(`Failed to export file for req_id:${req_id}`);
// throw error;
// }
// };
</script>
<template>
<div class="sr-run-abort-panel">
Expand All @@ -114,32 +113,6 @@
<ProgressSpinner animationDuration="1.25s" style="width: 2rem; height: 2rem"/>
<span class="loading-percentage">{{ useCurReqSumStore().getPercentComplete() }}%</span>
</div>
<Button
v-if=computedDataLoaded
icon="pi pi-chart-line"
@mouseover="tooltipRef.showTooltip($event, 'Analyze the current request')"
@mouseleave="tooltipRef.hideTooltip()"
@click="analysisButtonClick"
rounded
aria-label="Analyze"
size="small"
severity="text"
variant="text"
>
</Button>
<Button
v-if=computedDataLoaded
icon="pi pi-file-export"
@mouseover="tooltipRef.showTooltip($event, 'Export the current request')"
@mouseleave="tooltipRef.hideTooltip()"
@click="exportButtonClick"
rounded
aria-label="Export"
size="small"
severity="text"
variant="text"
>
</Button>
<SrCustomTooltip ref="tooltipRef"/>

<Button
Expand Down
8 changes: 4 additions & 4 deletions web-client/src/router/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ const router = createRouter({
{
path: '/',
name: 'home',
component: () => import('@/views/MapView.vue')
component: () => import('@/views/RequestView.vue')
},
{
path: '/about',
Expand All @@ -34,9 +34,9 @@ const router = createRouter({
component: () => import('@/views/RecordView.vue')
},
{
path: '/map',
name: 'map',
component: () => import('@/views/MapView.vue')
path: '/request',
name: 'request',
component: () => import('@/views/RequestView.vue')
},
{
path: '/analyze/:id',
Expand Down
Loading

0 comments on commit 76815b5

Please sign in to comment.