Merge pull request #57 from Brennaser/main

Add Ion Gauges

src/components/Hendi.jsx

@@ -8,10 +8,12 @@ function Hendi({ id, seeOutside }) {
       <div >
         <div className={`hendi-box ${!seeOutside ? '' : 'transparent'}`}>
           {/* These SVGs are for example/placeholder purposes */}
-          <SVGComponent style={{top:'0'}} className='click-through' part='base' />
+          {/* <SVGComponent style={{top:'0'}} className='click-through' part='base' />
           <SVGComponent style={{top:'0'}} className='click-through' part='sourcechamber' click={() => {}}/> 
           <SVGComponent style={{top:'0'}} className='click-through' part='dopingchamber' />
-          <SVGComponent style={{top:'0'}} className='click-through' part='detectionchamber'/>
+          <SVGComponent style={{top:'0'}} className='click-through' part='detectionchamber'/> */}
+          <SVGComponent style={{top:'0', stroke:'#fff0'}} className='click-through' part='laserexterior' /> 
+
         </div>
         <div className={`hendi-box ${seeOutside ? '' : 'transparent'}`} id={id}> 
           <SVGComponent style={{top:'0', stroke:'#fff0'}} className='click-through' part='laserexterior' /> 
@@ -24,6 +26,9 @@ function Hendi({ id, seeOutside }) {
           <SVGComponent style={{top:'0'}} className='click-through' part='sourcechamber' />
           <SVGComponent style={{top:'0'}} className='click-through' part='dopingchamber' />
           <SVGComponent style={{top:'0'}} className='click-through' part='detectionchamber'/>
+          <SVGComponent style={{top:'0'}} className='click-through' part='iongaugesource' />
+          <SVGComponent style={{top:'0'}} className='click-through' part='iongaugedope' />
+          <SVGComponent style={{top:'0'}} className='click-through' part='iongaugedetection' />
         </div>
       </div>
     );

src/components/SVGLibrary.js

@@ -8,6 +8,10 @@ import {ReactComponent as BaseSVG} from './svgs/hendi-not-clickable.svg';
 import {ReactComponent as SourceChamberSVG} from './svgs/hendi-source-chamber.svg';
 import {ReactComponent as DopingChamberSVG} from './svgs/hendi-doping-chamber.svg';
 import {ReactComponent as DetectionChamberSVG} from './svgs/hendi-detection-chamber.svg';
+import {ReactComponent as IonGauge3SVG} from './svgs/hendi-ion-gauge-3.svg';
+import {ReactComponent as IonGauge2SVG} from './svgs/hendi-ion-gauge-2.svg';
+import {ReactComponent as IonGauge1SVG} from './svgs/hendi-ion-gauge-1.svg';
+
 
 export const svgParts = {
     'laserexterior': LaserbeamExteriorSVG,
@@ -19,7 +23,10 @@ export const svgParts = {
     'rpump': RotarySVG,
     'sourcechamber': SourceChamberSVG,
     'dopingchamber': DopingChamberSVG,
-    'detectionchamber': DetectionChamberSVG
+    'detectionchamber': DetectionChamberSVG,
+    'iongaugesource': IonGauge3SVG,
+    'iongaugedope': IonGauge2SVG,
+    'iongaugedetection': IonGauge1SVG
 
 }
 
@@ -61,6 +68,18 @@ export const toolTips = {
         header: 'Detection Chamber',
         text: 'Houses a mass spectrometer which is used to detect helium nanodroplets.',
     },
+    'iongaugesource': {
+        header: 'Ion Gauge',
+        text: 'Pressure of the Source Chamber. It is relatively high due to the large amount of helium that flows through the nozzle.',
+    },
+    'iongaugedope': {
+        header: 'Ion Gauge',
+        text: 'Pressure of the Doping Chamber.',
+    },
+    'iongaugedetection': {
+        header: 'Ion Gauge',
+        text: 'Pressure of the Detection Chamber, which is similar to that maintained at CERN (close to the vacuum found on the Moons surface).',
+    },
     'base': {
         header: '',
         text: '',