@geode/opengeodeweb-front 10.20.0-rc.2 → 10.20.0-rc.4

package/app/components/ViewToolbar.vue

@@ -50,6 +50,12 @@ const camera_options = computed(() => [
     tooltip: "Highlight on hover",
     icon: "mdi-cursor-default-click",
     color: hybridViewerStore.is_hover_highlight ? "primary" : undefined,
+    action: hybridViewerStore.is_hover_highlight
+      ? () => {
+          hybridViewerStore.is_hover_highlight = false;
+          hybridViewerStore.clearHoverHighlight();
+        }
+      : undefined,
     menu: [
       {
         title: "Cells",
@@ -138,7 +144,11 @@ const camera_options = computed(() => [
   <v-container :class="[$style.floatToolbar, 'pa-0', 'view-toolbar']" width="auto">
     <v-row v-for="camera_option in camera_options" :key="camera_option.icon" dense>
       <v-col>
-        <v-menu v-if="camera_option.menu" location="start" :close-on-content-click="false">
+        <v-menu
+          v-if="camera_option.menu && !camera_option.action"
+          location="start"
+          :close-on-content-click="false"
+        >
           <template #activator="{ props }">
             <ActionButton
               v-bind="props"

package/app/components/Viewer/Ui.vue

@@ -3,6 +3,7 @@ import OverlappingObjectsPicker from "@ogw_front/components/Viewer/OverlappingOb
 import ViewerContextMenu from "@ogw_front/components/Viewer/ContextMenu/ContextMenu";
 import ViewerObjectTreeLayout from "@ogw_front/components/Viewer/ObjectTree/Layout";
 import { getCurrentInstance } from "vue";
+import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer";
 import { useMenuStore } from "@ogw_front/stores/menu";
 import { useOverlappingPicker } from "@ogw_front/composables/use_overlapping_picker";
 import { useViewerStore } from "@ogw_front/stores/viewer";
@@ -16,6 +17,18 @@ const { displayMenu, containerWidth, containerHeight } = defineProps({
 const emit = defineEmits(["show-menu"]);
 const menuStore = useMenuStore();
 const viewerStore = useViewerStore();
+const hybridViewerStore = useHybridViewerStore();
+
+function stopHoverHighlight() {
+  hybridViewerStore.is_hover_highlight = false;
+  hybridViewerStore.clearHoverHighlight();
+}
+
+onKeyStroke("Escape", () => {
+  if (hybridViewerStore.is_hover_highlight) {
+    stopHoverHighlight();
+  }
+});
 
 const {
   displayIntermediate,
@@ -91,6 +104,29 @@ defineExpose({ get_viewer_id });
       </v-chip>
     </div>
   </v-fade-transition>
+
+  <v-fade-transition>
+    <div
+      v-if="hybridViewerStore.is_hover_highlight"
+      class="picking-message-container d-flex justify-center w-100 pa-4"
+    >
+      <v-chip
+        color="primary"
+        elevation="8"
+        size="large"
+        variant="flat"
+        class="pick-pulse"
+        style="pointer-events: auto"
+        @click="stopHoverHighlight"
+      >
+        Highlight active ({{
+          hybridViewerStore.hover_highlight_field_type === "CELL" ? "Cells" : "Points"
+        }}) &middot; Esc to stop
+        <v-divider vertical class="mx-2 my-1" opacity="0.3" />
+        <v-icon icon="mdi-close" size="small" />
+      </v-chip>
+    </div>
+  </v-fade-transition>
 </template>
 
 <style scoped>

package/app/components/csv-preview/CsvPreviewer.vue

@@ -35,7 +35,7 @@ function autoDetectSeparator(content) {
     .slice(0, MAX_CONTENT_SLICE)
     .split(/\r?\n/u)
     .slice(0, MAX_LINES_FOR_DETECTION);
-  const candidates = [",", ";", "\t", "|"];
+  const candidates = [",", ";", "\t", "|", " "];
   let best = ",";
   let maxCount = -1;
 
@@ -132,12 +132,23 @@ const computedResult = computed(() => {
     firstRow: firstRow.value,
     headerRow: headerRow.value,
     separator: separator.value,
-    xColumn: xIndex === -1 ? 0 : xIndex,
-    yColumn: yIndex === -1 ? 1 : yIndex,
-    zColumn: zIndex === -1 ? 2 : zIndex,
+    xColumn: xIndex,
+    yColumn: yIndex,
+    zColumn: zIndex,
   };
 });
 
+const isFormValid = computed(
+  () =>
+    separator.value !== "" &&
+    separator.value !== undefined &&
+    headerRow.value !== undefined &&
+    firstRow.value !== undefined &&
+    xColumn.value !== undefined &&
+    yColumn.value !== undefined &&
+    zColumn.value !== undefined,
+);
+
 watch([separator, headerRow, firstRow], () => {
   parseContent();
   xColumn.value = undefined;
@@ -232,7 +243,7 @@ function onConfirm() {
           color="primary"
           class="text-none px-8 rounded-lg font-weight-bold"
           @click="onConfirm"
-          :disabled="!previewHeaders.length"
+          :disabled="!previewHeaders.length || !isFormValid"
         >
           Confirm
         </v-btn>

package/app/components/csv-preview/CsvSettings.vue

@@ -22,12 +22,42 @@ const separators = [
   { title: "Comma (,)", value: "," },
   { title: "Semicolon (;)", value: ";" },
   { title: "Tab (\\t)", value: "\t" },
+  { title: "Space ( )", value: " " },
   { title: "Pipe (|)", value: "|" },
+  { title: "Custom", value: "custom" },
 ];
 
-const internalSeparator = computed({
-  get: () => separator,
-  set: (value) => emit("update:separator", value),
+const selectedType = ref(",");
+const customValue = ref("");
+
+watch(
+  () => separator,
+  (newVal) => {
+    const predefined = separators.find((sep) => sep.value === newVal && sep.value !== "custom");
+    if (predefined) {
+      selectedType.value = predefined.value;
+    } else {
+      selectedType.value = "custom";
+      if (customValue.value !== newVal) {
+        customValue.value = newVal || "";
+      }
+    }
+  },
+  { immediate: true },
+);
+
+watch(selectedType, (newVal) => {
+  if (newVal === "custom") {
+    emit("update:separator", customValue.value);
+  } else {
+    emit("update:separator", newVal);
+  }
+});
+
+watch(customValue, (newVal) => {
+  if (selectedType.value === "custom") {
+    emit("update:separator", newVal);
+  }
 });
 
 const internalHeaderRow = computed({
@@ -61,8 +91,10 @@ const internalZColumn = computed({
     <div class="text-overline mb-4 text-primary font-weight-bold">Parser Settings</div>
 
     <v-select
-      v-model="internalSeparator"
+      v-model="selectedType"
       :items="separators"
+      item-title="title"
+      item-value="value"
       label="Separator"
       variant="outlined"
       density="compact"
@@ -71,8 +103,8 @@ const internalZColumn = computed({
     />
 
     <v-text-field
-      v-if="!separators.find((s) => s.value === separator)"
-      v-model="internalSeparator"
+      v-if="selectedType === 'custom'"
+      v-model="customValue"
       label="Custom Separator"
       variant="outlined"
       density="compact"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@geode/opengeodeweb-front",
-  "version": "10.20.0-rc.2",
+  "version": "10.20.0-rc.4",
   "description": "OpenSource Vue/Nuxt/Pinia/Vuetify framework for web applications",
   "homepage": "https://github.com/Geode-solutions/OpenGeodeWeb-Front",
   "bugs": {