update

guiapp/src/App.vue

@@ -5,58 +5,6 @@
 import { defineComponent } from 'vue';
 import { useStore } from 'src/store'
 
-
-// const fs = require("fs");
-// const compiled = new WebAssembly.Module("./nmiejs.wasm"));
-// const imports = {};
-// Object.defineProperty(module, "exports", {
-//   get: () => new WebAssembly.Instance(compiled, imports).exports
-// });
-
-
-// import VueWasm from 'vue-wasm';
-// import nmiejs from './nmiejs.wasm';
-// const nmieModule = require("./nmiejs.wasm");
-//
-// const nmiejs = nmieModule().then(({ instance }:any) => {
-//   return instance.exports
-// });
-//
-// const nmie = new nmiejs.nmie();
-
-
-// import nmiejs from './nmiejs.js';
-// // Test nmiejs if working
-// void (async () => {
-//   const module = await nmiejs();
-//   const nmie = new module.nmie();
-//   nmie.ClearTarget();
-//   let R = 100.0;
-//   let reN = 4.0;
-//   let imN = 0.01;
-//   nmie.AddTargetLayerReIm(R, reN, imN)
-//   nmie.SetModeNmaxAndType(-1, -1);
-//   let WL = 800;
-//   nmie.SetWavelength(WL);
-//   nmie.RunMieCalculation();
-//   console.log(nmie.GetQsca());
-//   // outer_arc_points, radius_points, from_Rho, to_Rho,
-//   // from_Theta, to_Theta, from_Phi, to_Phi, isIgnoreAvailableNmax
-//   nmie.RunFieldCalculationPolar(2, 2, 0.1, 1.5, 0, 3.1415, 0, 3.1415, 0);
-//   console.log('Field Eabs:', nmie.GetFieldEabs());
-//
-//
-// })();
-
-// const extractModule = async (module) => {
-//   const { instance } = await module();
-//   return instance.exports;
-// };
-// const nmie = extractModule(nmieModule);
-// const nmie = nmieModule().then(({ instance }) => {
-//   return instance.exports
-// });
-
 export default defineComponent({
   name: 'App',
   setup(){

guiapp/src/components/GetParticleParameters.vue

@@ -87,11 +87,13 @@
                class="row justify-xs-center justify-sm-start items-baseline">
 
         <div class="col-auto"> <input-with-units
+            v-model:is-showing-help="isShowingHelpForInputWithUnits"
             v-model:input-result="layer.n"
             :initial-expression="layer.n.toString()"
             title="Re(n)"
         /></div>
         <div class="col-auto"> <input-with-units
+            v-model:is-showing-help="isShowingHelpForInputWithUnits"
             v-model:input-result="layer.k"
             :initial-expression="layer.k.toString()"
             title="Im(n)"

guiapp/src/components/RunSimulationSpectrum.vue

@@ -2,9 +2,10 @@
   <div class="row items-baseline">
     <div class="col-xs-12 col-sm-auto text-weight-bold text-center q-px-md q-py-sm">
         <q-btn :loading="isRunning"
+               :disable="isRunning||!isNmieLoaded"
                color="primary"
                no-caps
-               label="Run simulation"
+               :label="isNmieLoaded ? 'Run simulation' : 'Loading...'"
                @click="runSimulation"
       />
     </div>
@@ -34,7 +35,6 @@ export default defineComponent({
   setup() {
     const $store = useStore()
 
-    const isRunning = ref(false)
 
     const numberOfModesToPlot = computed({
       get: () => $store.state.simulationSetup.gui.numberOfModesToPlot,
@@ -44,6 +44,15 @@ export default defineComponent({
       }
     })
 
+    const isNmieLoaded = computed(()=>{ return $store.state.simulationSetup.isNmieLoaded })
+    const isRunning = computed({
+      get: ()=> $store.state.simulationSetup.isNmieRunning,
+      set: val => {
+        val ? $store.commit('simulationSetup/markNmieAsRunning') : $store.commit('simulationSetup/markNmieAsFinished')
+      }
+    })
+
+
     function runSimulation() {
       isRunning.value = true
 // simulate a delay
@@ -55,7 +64,7 @@ export default defineComponent({
 
     return { flexRowTitleStyle,
       numberOfModesToPlot, runSimulation,
-      isRunning
+      isRunning, isNmieLoaded
       }
   },
 })

guiapp/src/store/simulation-setup/actions.ts

@@ -11,6 +11,12 @@ const actions: ActionTree<simulationSetupStateInterface, StateInterface> = {
     const nmie = new module.nmie()
     commit('setNmie', nmie)
     if (state.nmie) {
+      // setTimeout(()=>{
+      commit('markNmieAsLoaded')
+      // },3000)
+    }
+    if (state.nmie && !state.isNmieRunning) {
+      commit('markNmieAsRunning')
       state.nmie.ClearTarget()
       const R = 100.0
       const reN = 4.0
@@ -27,6 +33,9 @@ const actions: ActionTree<simulationSetupStateInterface, StateInterface> = {
           0.1, 1.5, 0, 3.1415, 0, 3.1415,
           0)
       console.log('Field Eabs:', state.nmie.GetFieldEabs())
+      // setTimeout(()=>{
+      commit('markNmieAsFinished')
+      // },3000)
     }
 
   }

guiapp/src/store/simulation-setup/mutations.ts

@@ -8,6 +8,9 @@ const mutation: MutationTree<sssi> = {
            newVal: import('src/nmiejs').nmie_class) {
     state.nmie = markRaw(newVal)
   },
+  markNmieAsLoaded  (state: sssi) {state.isNmieLoaded  = true },
+  markNmieAsRunning (state: sssi) {state.isNmieRunning = true },
+  markNmieAsFinished(state: sssi) {state.isNmieRunning = false},
 
   setCurrentState (state: sssi,
                    newVal: simulationSetup) {

guiapp/src/store/simulation-setup/state.ts

@@ -22,6 +22,8 @@ export interface simulationSetupStateInterface {
   gui: simulationSetup
   current: simulationSetup
   nmie: import('src/nmiejs').nmie_class|undefined
+  isNmieLoaded: boolean
+  isNmieRunning: boolean
 }
 
 function setupFactory(hostIndex = 1,
@@ -48,11 +50,14 @@ function state(): simulationSetupStateInterface {
   const library = new Map<string,simulationSetup>()
   library.set('default', cloneDeep(gui))
   const nmie = undefined
+  const isNmieLoaded = false
+  const isNmieRunning = false
   return {
     library,
     gui, // simulation setup config as shown in GUI
     current, // simulation setup used for the latest simulation
-    nmie
+    nmie,
+    isNmieLoaded, isNmieRunning
   }
 };