Added setting to control the scale of the energy lines

js/client/controllers/trajectory-controller.js

@@ -29,6 +29,7 @@ class TrajectoryController extends Controller {
         PubSub.subscribe('toggle-trajectory', (msg, value) => { this.toggleTrajectory(value); });
         PubSub.subscribe('export-trajectory', (msg, value) => { this.exportTrajectory(value); });
         PubSub.subscribe('change-trajectory-name', (msg, value) => { this.changeTrajectoryName(value); });
+        PubSub.subscribe('update-trajectory-settings', (msg, values) => { this.updateTrajectorySettings(values); });
 
         // Event handlers.
         PubSub.subscribe('change-trajectory', () => { this.trajectoryChange(); });
@@ -266,6 +267,12 @@ class TrajectoryController extends Controller {
         this._trajectory3D.update3DLocal();
     }
 
+    updateTrajectorySettings(values) {
+        console.log('trajectory settings');
+
+        this._trajectory3D.scaleEnergy(values.energyScale);
+    }
+
     /**
      * Inits the scan spy configuration.
      */

js/client/main/multi-layout.js

@@ -57,8 +57,8 @@ let config = {
             {
                 type:'component', 
                 isClosable: false,   
-                componentName: 'Configuration',
-                componentState: { text: 'Configuration' }
+                componentName: 'Trajectory Settings',
+                componentState: { text: 'Trajectory Settings' }
             },
             {
                 type:'component', 

js/client/views/3D/trajectory-view.js

@@ -27,14 +27,17 @@ class TrajectoryView3D extends View3D {
         this._energyViewGroup = this.createGroup(matrix.uMatrix_1);
         this._energyViewGroup.visible = false;
 
-        this._energyGroup = this.createEnergyGroup();
-        this._energyViewGroup.add(this._energyGroup);
+        this._energyScaleGroup = new THREE.Group();
+        this._energyViewGroup.add(this._energyScaleGroup);
+
+        this._energyTranslationGroup = new THREE.Group();
+        this._energyScaleGroup.add(this._energyTranslationGroup);
 
         // Create fake trajectory lines to visualize.
         this._hklLine = new TrajectoryLine(this._type, this._hklGroup, new THREE.Vector3(), new THREE.Vector3(), new THREE.Vector3(), 11);
         this._hklLine.setVisibility(false);
 
-        this._energyLine = new TrajectoryLine(this._type, this._energyGroup, new THREE.Vector3(), new THREE.Vector3(), new THREE.Vector3(), 11);
+        this._energyLine = new TrajectoryLine(this._type, this._energyTranslationGroup, new THREE.Vector3(), new THREE.Vector3(), new THREE.Vector3(), 11);
         this._energyLine.setVisibility(false);
         this._energyLine.type = 'q';
 
@@ -172,15 +175,6 @@ class TrajectoryView3D extends View3D {
         return group;
     }
 
-    /**
-     * The group for translation.
-     */
-    createEnergyGroup() {
-        let group = new THREE.Group();
-
-        return group;
-    }
-
     changePlane() {
         // First we reset the group matrix to identity.
         let inv = new THREE.Matrix4();
@@ -192,14 +186,19 @@ class TrajectoryView3D extends View3D {
         this._energyViewGroup.applyMatrix(matrix4);
     }
 
+    scaleEnergy(value) {
+        // Change the scale on the z direction to change the length of the energy lines.
+        this._energyScaleGroup.scale.z = value;
+    }
+
     update3DLocal() {
         // First we reset the group matrix to identity.
         let inv = new THREE.Matrix4();
-        inv.getInverse(this._energyGroup.matrix);
-        this._energyGroup.applyMatrix(inv);
+        inv.getInverse(this._energyTranslationGroup.matrix);
+        this._energyTranslationGroup.applyMatrix(inv);
 
         let dE = this.calculateDE();
-        this._energyGroup.translateZ(-scalarWorldToView(dE));
+        this._energyTranslationGroup.translateZ(-scalarWorldToView(dE));
     }
 
     setEnergyVisible(value) {
@@ -426,7 +425,7 @@ class TrajectoryView3D extends View3D {
             let energyStart = this.loadEnergyPoint(trajectory.start, bMatrix, uMatrix);
             let energyEnd = this.loadEnergyPoint(trajectory.end, bMatrix, uMatrix);
 
-            energyLine = new TrajectoryLine('q', this._energyGroup, 
+            energyLine = new TrajectoryLine('q', this._energyTranslationGroup, 
                 energyStart, 
                 energyEnd,
                 energyStart,
@@ -497,7 +496,7 @@ class TrajectoryView3D extends View3D {
             let energyStart = this.loadEnergyPoint(trajectory.start, bMatrix, uMatrix);
             let energyEnd = this.loadEnergyPoint(trajectory.end, bMatrix, uMatrix);
 
-            energyLine = new TrajectoryLine('q', this._energyGroup, 
+            energyLine = new TrajectoryLine('q', this._energyTranslationGroup, 
                 energyStart, 
                 energyEnd,
                 energyStart,

js/client/views/panels/trajectory-settings-view.js

+const viewManager = require('../../utils/view-manager');
+const PubSub = require('pubsub-js');
+
+class TrajectorySettingsPanelView {
+
+    constructor() {
+
+        let html = `
+        <div class='container' style='width:100%'>
+            <div class='row'>
+                <label class='col-sm-4' for='energyScale'>Energy Scale</label>
+                <input class='col-sm-4' type='text' name='energyScale' id='energyScale' />
+                <div class='col-sm-4'/>
+            </div>
+        </div>`;
+
+        // Using lambda function does not work here.
+        myLayout.registerComponent('Trajectory Settings', function(container, state) {
+            container.getElement().html(html);
+        });
+
+        viewManager.addView(this);
+    }
+
+    init() {
+
+        // Init energy scale with 1.0.
+        $('#energyScale').val(1.0);
+
+        // When the view is initialised, we can access to the html elements.
+        $("#energyScale").keypress((event) => {
+
+            if (event.which == 13 || event.keyCode == 13) {
+                PubSub.publish('update-trajectory-settings', this.getInputs());
+            }
+        });
+    }
+
+    render() {
+    }
+
+    /**
+     * Get grid inputs and store them into an object.
+     */
+    getInputs() {
+        return {
+            energyScale: parseFloat($("#energyScale").val())
+        };
+    }
+}
+
+module.exports = TrajectorySettingsPanelView;
\ No newline at end of file

js/client/views/reciprocal/reciprocal-view-3d.js

@@ -22,7 +22,7 @@ const SampleController = require('../../controllers/sample-controller');
 const ScatteringController = require('../../controllers/scattering-controller');
 const TrajectoryController = require('../../controllers/trajectory-controller');
 const UnitCellController = require('../../controllers/unitcell-controller');
-const ConfigurationController = require('../../controllers/configuration-controller');
+//const ConfigurationController = require('../../controllers/configuration-controller');
 
 const LatticeView3D = require('../3D/lattice-view');
 const PlaneView3D = require('../3D/plane-view');
@@ -31,6 +31,7 @@ const TrajectoryView3D = require('../3D/trajectory-view');
 
 const PlanePanelView = require('../panels/plane-view');
 const GridPanelView = require('../panels/grid-view');
+const TrajectorySettingsPanelView = require('../panels/trajectory-settings-view');
 const ExpDataPanelView = require('../panels/expdata-view');
 const PeaksPanelView = require('../panels/peaks-view');
 const SamplePanelView = require('../panels/sample-view');
@@ -38,7 +39,7 @@ const ScatteringPanelView = require('../panels/scattering-view');
 const TrajectoryPanelView = require('../panels/trajectory-view');
 const AnglesPanelView = require('../panels/angles-view');
 const AtomsPanelView = require('../panels/atoms-view');
-const ConfigurationPanelView = require('../panels/configuration-view');
+//const ConfigurationPanelView = require('../panels/configuration-view');
 
 const Constants = require('../../utils/constants');
 
@@ -83,10 +84,11 @@ class ReciprocalView3D {
         this._scatteringPanel = new ScatteringPanelView();
         this._planePanel = new PlanePanelView();
         this._gridPanel = new GridPanelView();
+        this._trajectorySettingsPanel = new TrajectorySettingsPanelView();
         this._samplePanel = new SamplePanelView();
         this._expDataPanel = new ExpDataPanelView();
         this._atomsPanel = new AtomsPanelView();
-        this._configPanel = new ConfigurationPanelView();
+        //this._configPanel = new ConfigurationPanelView();
         this._trajectoryPanel = new TrajectoryPanelView();
 
 
@@ -213,7 +215,7 @@ class ReciprocalView3D {
         // The sample controller is initialised after the unit cell because in case of a new client 
         // with the server having already a space group configured from a previous session, the atoms must be initialised before the space group.
         this._sampleController = new SampleController(this._samplePanel);
-        this._configController = new ConfigurationController(this._configPanel);
+        //this._configController = new ConfigurationController(this._configPanel);
         /////////////////////////////////
 
         let self = this;