Source: modelviewer/display/SelectNavigation.js

  1. /**
  2.  * @module meteoJS/modelviewer/display/selectNavigation
  3.  */
  4. import $ from 'jquery';
  5. import Simple from './Simple.js';
  7. /**
  8.  * @classdesc 
  9.  */
  10. export class SelectNavigation extends Simple {
  11.   
  12.   constructor({ ignoreVariableCollections = [],
  13.     selectCaption = false,
  14.     navigationClass = undefined,
  15.     selectDivClass = undefined,
  16.     selectClass = undefined } = {}) {
  17.     super();
  18.     
  19.     this.options = {
  20.       ignoreVariableCollections: new Set(ignoreVariableCollections),
  21.       selectCaption,
  22.       navigationClass,
  23.       selectDivClass,
  24.       selectClass
  25.     };
  26.     
  27.     /**
  28.      * @type undefined|jQuery
  29.      * @private
  30.      */
  31.     this.navigationNode = undefined;
  32.     
  33.     /**
  34.      * @type Map<module:meteoJS/modelviewer/variableCollection.variableCollection,jQuery>
  35.      * @private
  36.      */
  37.     this.selectNodes = new Map();
  38.   }
  39.   
  40.   /**
  41.    * @override
  42.    */
  43.   onInit() {
  44.     if (this.parentNode === undefined)
  45.       return;
  46.     this.navigationNode = $('<div>').addClass(this.options.navigationClass);
  47.     this.resourceNode = $('<div>');
  48.     $(this.parentNode).empty().append(this.navigationNode, this.resourceNode);
  49.     if (this.modelviewer !== undefined)
  50.       this.modelviewer.resources.variableCollections
  51.         .filter(collection => !this.options.ignoreVariableCollections.has(collection) && collection.count > 0)
  52.         .forEach(collection => this._appendSelectNode(collection));
  53.     this._changeSelected();
  54.   }
  55.   
  56.   onChangeVisibleResource({ variable } = {}) {
  57.     super.onChangeVisibleResource({ variable });
  58.     this._changeSelected();
  59.   }
  60.   
  61.   onAppendVariable(variable) {
  62.     if (this.selectNodes.has(variable.variableCollection))
  63.       this._appendOptionNode(this.selectNodes.get(variable.variableCollection), variable);
  64.     else
  65.       this._appendSelectNode(variable.variableCollection);
  66.     this._changeSelected();
  67.   }
  68.   
  69.   _appendSelectNode(variableCollection) {
  70.     let selectNode = $('<select>').addClass(this.options.selectClass);
  71.     selectNode.on('change', () => {
  72.       let variable = variableCollection.getItemById(selectNode.val());
  73.       this.container.exchangeDisplayVariable = [ variable ];
  74.     });
  75.     if (this.options.selectCaption) {
  76.       let captionOption = $('<option>').text(variableCollection.name).attr('disabled', 'disabled').prop('selected', 'selected');
  77.       selectNode.append(captionOption);
  78.     }
  79.     variableCollection.variables.forEach(variable => {
  80.       this._appendOptionNode(selectNode, variable);
  81.     });
  82.     this.navigationNode.append($('<div>').addClass(this.options.selectDivClass).append(selectNode));
  83.     this.selectNodes.set(variableCollection, selectNode);
  84.   }
  85.   
  86.   _appendOptionNode(selectNode, variable) {
  87.     let option =
  88.       $('<option>')
  89.         .attr('value', variable.id)
  90.         .text(variable.name)
  91.         .addClass(this.options.optionsClass);
  92.     selectNode.append(option);
  93.   }
  94.   
  95.   _changeSelected() {
  96.     for (let variableCollection of this.selectNodes.keys()) {
  97.       if (!this.selectNodes.has(variableCollection))
  98.         continue;
  99.       let variable = this.container.visibleResource.getVariableByVariableCollection(variableCollection);
  100.       this.selectNodes.get(variableCollection).val(variable.id);
  101.     }
  102.   }
  103. }
  104. export default SelectNavigation;