Re: [las_users] Reload depth selector when switching z-axis

[Bastian Kern <bkern@xxxxxxxxxxxxxxxxx>]

Hi all,

here the solution:
1.) I extended the [...]WebContent/productserver/templates/V7UI.vm with two <div>-s with ids: "Viewmode" and "Pressure".

2.) I extended the [...]WebContent/JavaScript/ui/LASUI.js like this:

  -- added two Widgets:

    this.refs = {
    [...]
      "ViewModeWidget" : {"widgetType":null},
      "PressureWidget" : {"widgetType":null},
    [...]
    }

  -- created a selector with entries "Pressure"/"Depth" and bound it to an event handler. It is rendered in the <div id="Viewmode"></div>.
     And an input element for the pressure, rendered in <div id="Pressure"></div>:

    LASUI.prototype.initZConstraint = function (mode, reset) {
    [...]
      this.refs.ViewModeWidget.menu = [document.createElement("SELECT"),document.createElement("SELECT")];
      [...]
      this.refs.ViewModeWidget[this.refs.ViewModeWidget.widgetType][0].onchange=this.handleViewModeChange.LASBind(this);
      [...]
      this.refs.PressureWidget.arange = [document.createElement("INPUT"),document.createElement("INPUT")];
      this.refs.PressureWidget.widgetType = "arange";
      for(var m=0;m<this.refs.PressureWidget[this.refs.PressureWidget.widgetType].length;m++) {
        this.refs.PressureWidget[this.refs.PressureWidget.widgetType][m].className = "LASTextInputNode";
        this.refs.PressureWidget[this.refs.PressureWidget.widgetType][m].type = "text";
        this.refs.PressureWidget[this.refs.PressureWidget.widgetType][m].name = "pressurelevel";
        this.refs.PressureWidget[this.refs.PressureWidget.widgetType][m].value = "500";
        this.refs.PressureWidget[this.refs.PressureWidget.widgetType][m].onchange=this.handleDepthRangeChange.LASBind(this);
      }

  -- The event handler hides the depth/pressure element, which is not needed:

    LASUI.prototype.handleViewModeChange = function (evt) {
      if(!this.updating) {
        this.pressure = !this.pressure
        if (this.pressure) {
          document.getElementById("Depth").style.display="none";
          document.getElementById("Pressure").style.display="";
        }
        else {
          document.getElementById("Depth").style.display="";
          document.getElementById("Pressure").style.display="none";
        }
      this.makeRequest();
      }
    }

  -- When makeRequest() is called and the this.pressure variable is true, an init_script is added to the xml request and the pressure value is used (instead 
of the depth value):

    if (this.pressure) {
      this.request.setProperty("ferret","hz_var", this.state.variable);
      this.request.setProperty("ferret","init_script","hybrid2pressinit");
    }

    [...]
    if(this.state.view[type].indexOf('z')>=0||this.state.variables[this.state.dataset].grid_type=="scattered") {
      this.request.addRange('z',this.refs.PressureWidget[this.refs.PressureWidget.widgetType]
[0].value,this.refs.PressureWidget[this.refs.PressureWidget.widgetType][1].value); 
    }
    else {
      this.request.addRange('z',this.refs.PressureWidget[this.refs.PressureWidget.widgetType][0].value); 
    }



3.) The init-script:

  set data ($data_url)

  set mem/size=80

  ! calculate pressure levels
  LET PRESS = (HYAM + HYBM * APS[k=1])/100

  ! define new z-axis of pressure levels
  DEFINE AXIS/Z/FROM_DATA/NAME=PAX/depth/units=hPa ((HYAM[d=1] + HYBM[d=1] * 101325.)/100)

  ! output variable is variable from input with new z-axis
  let ($data_var)_P = ZAXREPLACE(($data_var), press[d=1], Z[gz=pax])
  define symbol data_var = ($data_var)_P

Perhaps this helps someone ;-)
Bastian

Attachment: LASUI.js
Description: JavaScript source