@geode/opengeodeweb-front 0.0.23 → 1.0.0-rc.2

package/.github/workflows/CD.yml

@@ -8,16 +8,9 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v3
-      # Setup .npmrc file to publish to npm
-      - uses: actions/setup-node@v3
-        with:
-          node-version: '16.x'
-          registry-url: 'https://registry.npmjs.org'
-      - run: npm ci
-      - run: |
-          git config --global user.email "contact@geode-solutions.com"
-          git config --global user.name "Geode-solutions"
-      - run: npm version patch
-      - run: npm publish --access public 
+      - name: Semantic Release
+        uses: cycjimmy/semantic-release-action@v3
+        id: semantic
         env:
-          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
+          GITHUB_TOKEN: ${{ github.token }}
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}

package/.releaserc

@@ -0,0 +1,12 @@
+{
+  branches: [
+    { name: "master" },
+    { name: "next", channel: "next", prerelease: "rc" }
+  ],
+  plugins: [
+    '@semantic-release/commit-analyzer', 
+    '@semantic-release/release-notes-generator', 
+    '@semantic-release/github',
+    '@semantic-release/npm'
+  ]
+}

package/components/CrsSelector.vue

@@ -29,12 +29,12 @@ watch(selected_crs, (new_value) => {
   set_crs(crs)
 })
 
-function set_crs (crs_value) {
+function set_crs(crs_value) {
   stepper_tree[variable_to_update] = crs_value
   stepper_tree[variable_to_increment]++
 }
 
-function get_selected_crs (crs_code) {
+function get_selected_crs(crs_code) {
   for (let i = 0; i <= crs_list.value.length; i++) {
     if (crs_list.value[i]['code'] == crs_code) {
       return crs_list.value[i]
@@ -42,7 +42,7 @@ function get_selected_crs (crs_code) {
   }
 }
 
-async function get_crs_table () {
+async function get_crs_table() {
   let params = new FormData()
   params.append('geode_object', geode_object)
   toggle_loading()

package/components/RemoteRenderingView.client.vue

@@ -1,7 +1,10 @@
 <template>
-  <v-col v-element-size="resize" style="overflow: hidden; position: relative; z-index: 1; height: 100%; width: 100%"
-    ref="viewer" class="viewer" @click="get_x_y" @keydown.esc="app_store.toggle_picking_mode(false)">
-  </v-col>
+  <div style="position: relative;">
+    <view-toolbar />
+    <v-col v-element-size="resize" style="overflow: hidden; position: relative; z-index: 0; height: 100%; width: 100%"
+      ref="viewer" @click="get_x_y" @keydown.esc="app_store.toggle_picking_mode(false)">
+    </v-col>
+  </div>
 </template>
 
 <script setup>
@@ -10,8 +13,10 @@ import { useElementSize } from '@vueuse/core'
 
 const viewer_store = use_viewer_store()
 const { picking_mode } = storeToRefs(viewer_store)
+const websocket_store = use_websocket_store()
+const { client, is_client_created } = storeToRefs(websocket_store)
 
-function get_x_y (event) {
+function get_x_y(event) {
   if (picking_mode.value === true) {
     const { offsetX, offsetY } = event
     viewer_store.set_picked_point(offsetX, offsetY)
@@ -19,14 +24,13 @@ function get_x_y (event) {
 }
 
 const props = defineProps({
-  viewId: { type: String, default: '-1' },
-  client: { type: Object, required: true }
+  viewId: { type: String, default: '-1' }
 })
 
 const viewer = ref(null)
 const { width, height } = useElementSize(viewer)
 
-function resize () {
+function resize() {
   view.getCanvasView().setSize(1, 1)
   view.resize();
 }
@@ -41,7 +45,7 @@ watch(width, value => {
 watch(height, value => {
   resize()
 })
-const { client, viewId } = toRefs(props)
+const { viewId } = toRefs(props)
 const connected = ref(false)
 
 const view = vtkRemoteView.newInstance({ rpcWheelEvent: 'viewport.mouse.zoom.wheel' })
@@ -72,16 +76,13 @@ onMounted(async () => {
   }
 })
 
-function connect () {
+function connect() {
+  if (!is_client_created.value) { return }
+  console.log('connecting', client.value)
   const session = client.value.getConnection().getSession()
   view.setSession(session)
   view.setViewId(viewId.value)
   connected.value = true
   view.render()
 }
-function handleClick (event) {
-  onClick(event)
-}
-
-
 </script>

package/components/ViewToolbar.vue

@@ -0,0 +1,30 @@
+<template>
+    <v-row dense :class="[$style.floatToolbar, 'flex-column']">
+        <v-col>
+            <v-tooltip location="left">
+                Reset camera
+                <template #activator="{ props }">
+                    <v-btn @click.stop=reset_camera icon="mdi-crop-free" density="comfortable" v-bind="props" />
+                </template>
+            </v-tooltip>
+        </v-col>
+    </v-row>
+</template>
+
+<script setup>
+const viewer_store = use_viewer_store()
+function reset_camera() {
+    viewer_store.reset_camera()
+}
+</script>
+
+<style module>
+.floatToolbar {
+    position: absolute;
+    z-index: 2;
+    right: 20px;
+    top: 20px;
+    background-color: rgba(0, 0, 0, 0.4);
+    border-radius: 16px;
+}
+</style>

package/package.json

@@ -1,29 +1,24 @@
 {
   "name": "@geode/opengeodeweb-front",
-  "private": false,
   "scripts": {
-    "release:major": "npm version $(semver $npm_package_version -i major) && npm publish --tag latest",
-    "release:minor": "npm version $(semver $npm_package_version -i minor) && npm publish --tag latest",
-    "release:patch": "npm version $(semver $npm_package_version -i patch) && npm publish --tag latest",
-    "release:beta": "npm version $(semver $npm_package_version -i prerelease --preid $(npm whoami) ) && npm publish --tag rc",
     "lint": "eslint --fix --ext .js,.vue --ignore-path .gitignore ."
   },
   "devDependencies": {
-    "nuxt": "^3.6.5",
     "eslint": "^8.47.0",
     "eslint-plugin-import": "^2.28.1",
     "eslint-plugin-nuxt": "^4.0.0",
     "eslint-plugin-prettier": "^5.0.0",
     "eslint-plugin-prettier-vue": "^4.2.0",
     "eslint-plugin-vue": "^9.17.0",
-    "eslint-plugin-vuetify": "^2.0.5"
+    "eslint-plugin-vuetify": "^2.0.5",
+    "nuxt": "^3.6.5"
   },
   "overrides": {
     "vue": "latest"
   },
   "description": "OpenSource Vue/Vuetify framework for web applications",
   "type": "module",
-  "version": "0.0.23",
+  "version": "1.0.0-rc.2",
   "main": "./nuxt.config.js",
   "dependencies": {
     "@kitware/vtk.js": "^28.8.0",
@@ -44,14 +39,17 @@
     "type": "git",
     "url": "git+https://github.com/Geode-solutions/OpenGeodeWeb-Front.git"
   },
-  "keywords": [
-    "vue",
-    "vuetify"
-  ],
-  "author": "@geode",
+  "author": {
+    "name": "Geode-solutions",
+    "email": "contact@geode-solutions.com",
+    "url": "https://geode-solutions.com/"
+  },
   "license": "MIT",
   "bugs": {
     "url": "https://github.com/Geode-solutions/OpenGeodeWeb-Front/issues"
   },
-  "homepage": "https://github.com/Geode-solutions/OpenGeodeWeb-Front#readme"
+  "homepage": "https://github.com/Geode-solutions/OpenGeodeWeb-Front",
+  "publishConfig": {
+    "access": "public"
+  }
 }

package/protocols/vtk.js

@@ -1,13 +1,20 @@
 /* eslint-disable arrow-body-style */
-export default function createMethods (session) {
+function createMethods (session) {
   return {
     create_object_pipeline: (params) => session.call('create_object_pipeline', [params]),
     create_visualization: () => session.call('create_visualization', []),
     reset: () => session.call('reset'),
     reset_camera: () => session.call('reset_camera', []),
     toggle_object_visibility: (params) => session.call('toggle_object_visibility', [params]),
+    toggle_edge_visibility: (params) => session.call('toggle_edge_visibility', [params]),
+    toggle_point_visibility: (params) => session.call('toggle_point_visibility', [params]),
+    set_color: (params) => session.call('set_color', [params]),
+    set_vertex_attribute: (params) => session.call('set_vertex_attribute', [params]),
+    point_size: (params) => session.call('point_size', [params]),
     apply_textures: (params) => session.call('apply_textures', [params]),
     get_point_position: (params) => session.call('get_point_position', [params]),
     update_data: (params) => session.call('update_data', [params])
   };
 }
+
+export default createMethods

package/stores/cloud.js

@@ -1,5 +1,4 @@
 import { defineStore } from 'pinia'
-import { use_errors_store } from './errors'
 
 export const use_cloud_store = defineStore('cloud', {
   state: () => ({
@@ -52,7 +51,7 @@ export const use_cloud_store = defineStore('cloud', {
       const errors_store = use_errors_store()
       const config = useRuntimeConfig()
       const public_runtime_config = config.public
-      const { data, error } = await useFetch(`${public_runtime_config.GEODE_PROTOCOL}://${public_runtime_config.API_URL}:${public_runtime_config.GEODE_PORT}/${public_runtime_config.SITE_BRANCH}/tools/createbackend`, { method: 'POST' })
+      const { data, error } = await useFetch(`${public_runtime_config.GEODE_PROTOCOL}://${public_runtime_config.API_URL}:${public_runtime_config.GEODE_PORT}${public_runtime_config.SITE_BRANCH}/tools/createbackend`, { method: 'POST' })
       if (data.value !== null) {
         this.ID = data.value.ID
         localStorage.setItem('ID', data.value.ID)

package/stores/viewer.js

@@ -6,17 +6,17 @@ export const use_viewer_store = defineStore('viewer', {
     picked_point: { x: null, y: null }
   }),
   actions: {
-    toggle_picking_mode (value) {
+    toggle_picking_mode(value) {
       this.picking_mode = value
     },
-    async set_picked_point (x, y) {
+    async set_picked_point(x, y) {
       const response = await get_point_position({ x, y })
       const { x: world_x, y: world_y } = response
       this.picked_point.x = world_x
       this.picked_point.y = world_y
       this.picking_mode = false
     },
-    async create_object_pipeline (params) {
+    async create_object_pipeline(params) {
       const websocket_store = use_websocket_store()
       if (websocket_store.client) {
         use_websocket_store().client
@@ -25,7 +25,16 @@ export const use_viewer_store = defineStore('viewer', {
           .catch(console.error);
       }
     },
-    async toggle_object_visibility (params) {
+    async reset_camera() {
+      const websocket_store = use_websocket_store()
+      if (websocket_store.client) {
+        use_websocket_store().client
+          .getRemote()
+          .vtk.reset_camera()
+          .catch(console.error);
+      }
+    },
+    async toggle_object_visibility(params) {
       const websocket_store = use_websocket_store()
       if (websocket_store.client) {
         use_websocket_store().client
@@ -34,7 +43,52 @@ export const use_viewer_store = defineStore('viewer', {
           .catch(console.error);
       }
     },
-    async apply_textures (params) {
+    async toggle_edge_visibility(params) {
+      const websocket_store = use_websocket_store()
+      if (websocket_store.client) {
+        use_websocket_store().client
+          .getRemote()
+          .vtk.toggle_edge_visibility(params)
+          .catch(console.error);
+      }
+    },
+    async toggle_point_visibility(params) {
+      const websocket_store = use_websocket_store()
+      if (websocket_store.client) {
+        use_websocket_store().client
+          .getRemote()
+          .vtk.toggle_point_visibility(params)
+          .catch(console.error);
+      }
+    },
+    async point_size(params) {
+      const websocket_store = use_websocket_store()
+      if (websocket_store.client) {
+        use_websocket_store().client
+          .getRemote()
+          .vtk.point_size(params)
+          .catch(console.error);
+      }
+    },
+    async set_color(params) {
+      const websocket_store = use_websocket_store()
+      if (websocket_store.client) {
+        use_websocket_store().client
+          .getRemote()
+          .vtk.set_color(params)
+          .catch(console.error);
+      }
+    },
+    async set_vertex_attribute(params) {
+      const websocket_store = use_websocket_store()
+      if (websocket_store.client) {
+        use_websocket_store().client
+          .getRemote()
+          .vtk.set_vertex_attribute(params)
+          .catch(console.error);
+      }
+    },
+    async apply_textures(params) {
       const websocket_store = use_websocket_store()
       if (websocket_store.client) {
         websocket_store.$patch({ busy: true })
@@ -42,11 +96,10 @@ export const use_viewer_store = defineStore('viewer', {
           .getRemote()
           .vtk.apply_textures(params)
           .catch(console.error);
-
         websocket_store.$patch({ busy: false })
       }
     },
-    async get_point_position (params) {
+    async get_point_position(params) {
       const websocket_store = use_websocket_store()
       if (websocket_store.client) {
         websocket_store.$patch({ busy: true })
@@ -54,12 +107,11 @@ export const use_viewer_store = defineStore('viewer', {
           .getRemote()
           .vtk.get_point_position(params)
           .catch(console.error);
-        console.log('response', response)
         websocket_store.$patch({ busy: false })
         return response
       }
     },
-    async update_data (params) {
+    async update_data(params) {
       const websocket_store = use_websocket_store()
       if (websocket_store.client) {
         websocket_store.$patch({ busy: true })
@@ -67,12 +119,11 @@ export const use_viewer_store = defineStore('viewer', {
           .getRemote()
           .vtk.update_data(params)
           .catch(console.error);
-        console.log('response', response)
         websocket_store.$patch({ busy: false })
         return response
       }
     },
-    async reset () {
+    async reset() {
       const websocket_store = use_websocket_store()
       if (websocket_store.client) {
         websocket_store.$patch({ busy: true })
@@ -80,7 +131,6 @@ export const use_viewer_store = defineStore('viewer', {
           .getRemote()
           .vtk.reset()
           .catch(console.error);
-        console.log('response', response)
         websocket_store.$patch({ busy: false })
         return response
       }