var NecofsWaveCurrentDate=new Ext.form.DateField({ fieldLabel:'Date', emptyText:'-- Select a Date --', format:'Y-m-d', minValue :new Date().format('Y-m-d'), maxValue :new Date().add(Date.DAY, 5), value: new Date().format('Y-m-d'), //value :'2010-03-08', //emptyText: 'Select a date... ...', listeners:{ select:{ fn:function(){ NecofsWavestring = NecofsWaveCurrentDate.value+"T"+NecofsWaveCurrentTime.value; document.getElementById("NecofsWaveTime").innerHTML = "Time: "+NecofsWaveCurrentDate.value+" "+NecofsWaveCurrentTime.value+""; NecofsWaveHeightContoursOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWaveHeightFilledContoursOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWaveHeightImageOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWaveHeightInterpolatedOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWavePeriodContoursOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWavePeriodFilledContoursOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWavePeriodImageOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWavePeriodInterpolatedOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWaveWindBarbsOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWaveWindVectorsOverlays.mergeNewParams({'time': NecofsWavestring}); } } } }); var NecofsWaveCurrentTime = new Ext.form.TimeField({ fieldLabel:'Time', emptyText:'-- Select a Time --', increment: 60, format: 'H:i:s', value: new Date().format('H')+':00:00', listeners:{ select:{ fn:function(){ document.getElementById("NecofsWaveTime").innerHTML = "Time: "+NecofsWaveCurrentDate.value+" "+NecofsWaveCurrentTime.value+""; NecofsWavestring = NecofsWaveCurrentDate.value+"T"+NecofsWaveCurrentTime.value; NecofsWaveHeightContoursOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWaveHeightFilledContoursOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWaveHeightImageOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWaveHeightInterpolatedOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWavePeriodContoursOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWavePeriodFilledContoursOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWavePeriodImageOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWavePeriodInterpolatedOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWaveWindBarbsOverlays.mergeNewParams({'time': NecofsWavestring}); NecofsWaveWindVectorsOverlays.mergeNewParams({'time': NecofsWavestring}); } } } }); var NecofsWaveTime = { //xtype: 'fieldset', title: 'Time: '+NecofsWaveCurrentDate.value+' '+NecofsWaveCurrentTime.value+'', iconCls: 'clock', autoHeight: true, //layout: 'form', collapsed: true, // initially collapse the group collapsible: true, items: [{ // Use the default, automatic layout to distribute the controls evenly // across a single row xtype: 'checkboxgroup', //fieldLabel: 'Multi-Column (vertical)', columns: 1, items: [NecofsWaveCurrentDate,NecofsWaveCurrentTime,{ 'boxLabel':'Time Series', 'xtype':'checkbox', 'name':'NecofsWaveTimeSeries', 'id':'ckNecofsWaveTimeSeries', }] }] }; var NecofsWaveHeightContoursSettingValue =({ "(model)":"NecofsWave", "(name)": "Contours", "(type)": "contours", "(variable)":"Height", "Layers":1,"Color Scaling Max":1.5,"Case Sensitive":true,"Color Scaling Min":0,"Color Bar":true, "Color Map":'jet', }); var NecofsWaveHeightContoursAnimationValue =({ speed: 50, increase:3, unit:'hour' }); var NecofsWaveHeightFilledContoursSettingValue =({ "(model)":"NecofsWave", "(name)": "FilledContours", "(type)": "filledcontours", "(variable)":"Height", "Layers":1,"Case Sensitive":true,"Color Bar":true, "Color Scaling Max":'None',"Color Map":'jet',"Color Scaling Min":'None', }); var NecofsWaveHeightFilledContoursAnimationValue =({ speed: 50, increase:3, unit:'hour' }); var NecofsWaveHeightImageSettingValue =({ "(model)":"NecofsWave", "(name)": "Image", "(type)": "facets", "(variable)":"Height", "Layers":1,"Color Scaling Max":3.0,"Case Sensitive":true,"Color Scaling Min":0,"Color Bar":true, "Color Map":'jet', }); var NecofsWaveHeightImageAnimationValue =({ speed: 50, increase:3, unit:'hour' }); var NecofsWaveHeightInterpolatedSettingValue =({ "(model)":"NecofsWave", "(name)": "Interpolated", "(type)": "pcolor", "(variable)":"Height", "Layers":1,"Color Scaling Max":1.5,"Case Sensitive":true,"Color Scaling Min":0,"Color Bar":true, "Color Map":'jet', }); var NecofsWaveHeightInterpolatedAnimationValue =({ speed: 50, increase:3, unit:'hour' }); var NecofsWavePeriodContoursSettingValue =({ "(model)":"NecofsWave", "(name)": "Contours", "(type)": "contours", "(variable)":"Period", "Layers":1,"Case Sensitive":true,"Color Bar":true, "Color Scaling Max":'None',"Color Map":'jet',"Color Scaling Min":'None', }); var NecofsWavePeriodContoursAnimationValue =({ speed: 50, increase:3, unit:'hour' }); var NecofsWavePeriodFilledContoursSettingValue =({ "(model)":"NecofsWave", "(name)": "FilledContours", "(type)": "filledcontours", "(variable)":"Period", "Layers":1,"Case Sensitive":true,"Color Bar":true, "Color Scaling Max":'None',"Color Map":'jet',"Color Scaling Min":'None', }); var NecofsWavePeriodFilledContoursAnimationValue =({ speed: 50, increase:3, unit:'hour' }); var NecofsWavePeriodImageSettingValue =({ "(model)":"NecofsWave", "(name)": "Image", "(type)": "facets", "(variable)":"Period", "Layers":1,"Case Sensitive":true,"Color Bar":true, "Color Scaling Max":'None',"Color Map":'jet',"Color Scaling Min":'None', }); var NecofsWavePeriodImageAnimationValue =({ speed: 50, increase:3, unit:'hour' }); var NecofsWavePeriodInterpolatedSettingValue =({ "(model)":"NecofsWave", "(name)": "Interpolated", "(type)": "pcolor", "(variable)":"Period", "Layers":1,"Case Sensitive":true,"Color Bar":true, "Color Scaling Max":'None',"Color Map":'jet',"Color Scaling Min":'None', }); var NecofsWavePeriodInterpolatedAnimationValue =({ speed: 50, increase:3, unit:'hour' }); var NecofsWaveWindBarbsSettingValue =({ "(model)":"NecofsWave", "(name)": "Barbs", "(type)": "barbs", "(variable)":"Wind", "Layers":1,"Case Sensitive":true,"Color Bar":false, "Color Scaling Max":'None',"Color Map":'jet',"Color Scaling Min":'None', }); var NecofsWaveWindBarbsAnimationValue =({ speed: 50, increase:3, unit:'hour' }); var NecofsWaveWindVectorsSettingValue =({ "(model)":"NecofsWave", "(name)": "Vectors", "(type)": "vectors", "(variable)":"Wind", "Layers":1,"Case Sensitive":true,"Color Bar":false, "Arrow Size":'None',"Color Map":'jet',"Arrow Width":'None',"Color Scaling Max":'None',"Color Scaling Min":'None', }); var NecofsWaveWindVectorsAnimationValue =({ speed: 50, increase:3, unit:'hour' }); var NecofsWaveHeight = { //xtype: 'fieldset', title: 'Height', autoHeight: true, id: 'NecofsWaveHeight', //layout: 'form', iconCls: 'mapIcon', collapsed: true, // initially collapse the group collapsible: true, items: [{ // Use the default, automatic layout to distribute the controls evenly // across a single row xtype: 'checkboxgroup', //fieldLabel: 'Multi-Column (vertical)', columns: 2, items: [ {boxLabel: 'Contours',id:'ckNecofsWaveHeightContours'}, { xtype : "checkboxgroup", columns: 2, items:[{xtype : "button", text:'Off', iconCls:'film', handler: function(){ //var w = Ext.getCmp('mainTab'); //w.setActiveTab(0); //w.expand(); //w.collapsed ? w.expand() : w.collapse(); simple.getForm().setValues(NecofsWaveHeightContoursAnimationValue); //Ext.MessageBox.alert('Status', 'Changes saved successfully.'); if(document.getElementById("bdNecofsWaveHeightContoursAnimation").innerHTML=="On"){//OFF var result = getProSettingValue(false,'contours'); document.getElementById("bdNecofsWaveHeightContoursAnimation").innerHTML = "Off"; //simple.disable(); } else{//ON //simple.enable(); var result = getProSettingValue(true,'contours'); document.getElementById("bdNecofsWaveHeightContoursAnimation").innerHTML="On"; } propsGrid.setSource(NecofsWaveHeightContoursSettingValue); NecofsWaveHeightContoursOverlays.mergeNewParams({'styles':result}); Ext.MessageBox.alert('Status', result); }}, {xtype : "button",iconCls:'edit',id:'bdNecofsWaveHeightContoursSetting', handler: function(){ propsGrid.setSource(NecofsWaveHeightContoursSettingValue); } } ] }, {boxLabel: 'FilledContours',id:'ckNecofsWaveHeightFilledContours'}, { xtype : "checkboxgroup", columns: 2, items:[{xtype : "button", text:'Off', iconCls:'film', handler: function(){ //var w = Ext.getCmp('mainTab'); //w.setActiveTab(0); //w.expand(); //w.collapsed ? w.expand() : w.collapse(); simple.getForm().setValues(NecofsWaveHeightFilledContoursAnimationValue); //Ext.MessageBox.alert('Status', 'Changes saved successfully.'); if(document.getElementById("bdNecofsWaveHeightFilledContoursAnimation").innerHTML=="On"){//OFF var result = getProSettingValue(false,'filledcontours'); document.getElementById("bdNecofsWaveHeightFilledContoursAnimation").innerHTML = "Off"; //simple.disable(); } else{//ON //simple.enable(); var result = getProSettingValue(true,'filledcontours'); document.getElementById("bdNecofsWaveHeightFilledContoursAnimation").innerHTML="On"; } propsGrid.setSource(NecofsWaveHeightFilledContoursSettingValue); NecofsWaveHeightFilledContoursOverlays.mergeNewParams({'styles':result}); Ext.MessageBox.alert('Status', result); }}, {xtype : "button",iconCls:'edit',id:'bdNecofsWaveHeightFilledContoursSetting', handler: function(){ propsGrid.setSource(NecofsWaveHeightFilledContoursSettingValue); } } ] }, {boxLabel: 'Image',id:'ckNecofsWaveHeightImage'}, { xtype : "checkboxgroup", columns: 2, items:[{xtype : "button", text:'Off', iconCls:'film', handler: function(){ //var w = Ext.getCmp('mainTab'); //w.setActiveTab(0); //w.expand(); //w.collapsed ? w.expand() : w.collapse(); simple.getForm().setValues(NecofsWaveHeightImageAnimationValue); //Ext.MessageBox.alert('Status', 'Changes saved successfully.'); if(document.getElementById("bdNecofsWaveHeightImageAnimation").innerHTML=="On"){//OFF var result = getProSettingValue(false,'facets'); document.getElementById("bdNecofsWaveHeightImageAnimation").innerHTML = "Off"; //simple.disable(); } else{//ON //simple.enable(); var result = getProSettingValue(true,'facets'); document.getElementById("bdNecofsWaveHeightImageAnimation").innerHTML="On"; } propsGrid.setSource(NecofsWaveHeightImageSettingValue); NecofsWaveHeightImageOverlays.mergeNewParams({'styles':result}); Ext.MessageBox.alert('Status', result); }}, {xtype : "button",iconCls:'edit',id:'bdNecofsWaveHeightImageSetting', handler: function(){ propsGrid.setSource(NecofsWaveHeightImageSettingValue); } } ] }, {boxLabel: 'Interpolated',id:'ckNecofsWaveHeightInterpolated'}, { xtype : "checkboxgroup", columns: 2, items:[{xtype : "button", text:'Off', iconCls:'film', handler: function(){ //var w = Ext.getCmp('mainTab'); //w.setActiveTab(0); //w.expand(); //w.collapsed ? w.expand() : w.collapse(); simple.getForm().setValues(NecofsWaveHeightInterpolatedAnimationValue); //Ext.MessageBox.alert('Status', 'Changes saved successfully.'); if(document.getElementById("bdNecofsWaveHeightInterpolatedAnimation").innerHTML=="On"){//OFF var result = getProSettingValue(false,'pcolor'); document.getElementById("bdNecofsWaveHeightInterpolatedAnimation").innerHTML = "Off"; //simple.disable(); } else{//ON //simple.enable(); var result = getProSettingValue(true,'pcolor'); document.getElementById("bdNecofsWaveHeightInterpolatedAnimation").innerHTML="On"; } propsGrid.setSource(NecofsWaveHeightInterpolatedSettingValue); NecofsWaveHeightInterpolatedOverlays.mergeNewParams({'styles':result}); Ext.MessageBox.alert('Status', result); }}, {xtype : "button",iconCls:'edit',id:'bdNecofsWaveHeightInterpolatedSetting', handler: function(){ propsGrid.setSource(NecofsWaveHeightInterpolatedSettingValue); } } ] }, ], }] }; var NecofsWavePeriod = { //xtype: 'fieldset', title: 'Period', autoHeight: true, id: 'NecofsWavePeriod', //layout: 'form', iconCls: 'mapIcon', collapsed: true, // initially collapse the group collapsible: true, items: [{ // Use the default, automatic layout to distribute the controls evenly // across a single row xtype: 'checkboxgroup', //fieldLabel: 'Multi-Column (vertical)', columns: 2, items: [ {boxLabel: 'Contours',id:'ckNecofsWavePeriodContours'}, { xtype : "checkboxgroup", columns: 2, items:[{xtype : "button", text:'Off', iconCls:'film', handler: function(){ //var w = Ext.getCmp('mainTab'); //w.setActiveTab(0); //w.expand(); //w.collapsed ? w.expand() : w.collapse(); simple.getForm().setValues(NecofsWavePeriodContoursAnimationValue); //Ext.MessageBox.alert('Status', 'Changes saved successfully.'); if(document.getElementById("bdNecofsWavePeriodContoursAnimation").innerHTML=="On"){//OFF var result = getProSettingValue(false,'contours'); document.getElementById("bdNecofsWavePeriodContoursAnimation").innerHTML = "Off"; //simple.disable(); } else{//ON //simple.enable(); var result = getProSettingValue(true,'contours'); document.getElementById("bdNecofsWavePeriodContoursAnimation").innerHTML="On"; } propsGrid.setSource(NecofsWavePeriodContoursSettingValue); NecofsWavePeriodContoursOverlays.mergeNewParams({'styles':result}); Ext.MessageBox.alert('Status', result); }}, {xtype : "button",iconCls:'edit',id:'bdNecofsWavePeriodContoursSetting', handler: function(){ propsGrid.setSource(NecofsWavePeriodContoursSettingValue); } } ] }, {boxLabel: 'FilledContours',id:'ckNecofsWavePeriodFilledContours'}, { xtype : "checkboxgroup", columns: 2, items:[{xtype : "button", text:'Off', iconCls:'film', handler: function(){ //var w = Ext.getCmp('mainTab'); //w.setActiveTab(0); //w.expand(); //w.collapsed ? w.expand() : w.collapse(); simple.getForm().setValues(NecofsWavePeriodFilledContoursAnimationValue); //Ext.MessageBox.alert('Status', 'Changes saved successfully.'); if(document.getElementById("bdNecofsWavePeriodFilledContoursAnimation").innerHTML=="On"){//OFF var result = getProSettingValue(false,'filledcontours'); document.getElementById("bdNecofsWavePeriodFilledContoursAnimation").innerHTML = "Off"; //simple.disable(); } else{//ON //simple.enable(); var result = getProSettingValue(true,'filledcontours'); document.getElementById("bdNecofsWavePeriodFilledContoursAnimation").innerHTML="On"; } propsGrid.setSource(NecofsWavePeriodFilledContoursSettingValue); NecofsWavePeriodFilledContoursOverlays.mergeNewParams({'styles':result}); Ext.MessageBox.alert('Status', result); }}, {xtype : "button",iconCls:'edit',id:'bdNecofsWavePeriodFilledContoursSetting', handler: function(){ propsGrid.setSource(NecofsWavePeriodFilledContoursSettingValue); } } ] }, {boxLabel: 'Image',id:'ckNecofsWavePeriodImage'}, { xtype : "checkboxgroup", columns: 2, items:[{xtype : "button", text:'Off', iconCls:'film', handler: function(){ //var w = Ext.getCmp('mainTab'); //w.setActiveTab(0); //w.expand(); //w.collapsed ? w.expand() : w.collapse(); simple.getForm().setValues(NecofsWavePeriodImageAnimationValue); //Ext.MessageBox.alert('Status', 'Changes saved successfully.'); if(document.getElementById("bdNecofsWavePeriodImageAnimation").innerHTML=="On"){//OFF var result = getProSettingValue(false,'facets'); document.getElementById("bdNecofsWavePeriodImageAnimation").innerHTML = "Off"; //simple.disable(); } else{//ON //simple.enable(); var result = getProSettingValue(true,'facets'); document.getElementById("bdNecofsWavePeriodImageAnimation").innerHTML="On"; } propsGrid.setSource(NecofsWavePeriodImageSettingValue); NecofsWavePeriodImageOverlays.mergeNewParams({'styles':result}); Ext.MessageBox.alert('Status', result); }}, {xtype : "button",iconCls:'edit',id:'bdNecofsWavePeriodImageSetting', handler: function(){ propsGrid.setSource(NecofsWavePeriodImageSettingValue); } } ] }, {boxLabel: 'Interpolated',id:'ckNecofsWavePeriodInterpolated'}, { xtype : "checkboxgroup", columns: 2, items:[{xtype : "button", text:'Off', iconCls:'film', handler: function(){ //var w = Ext.getCmp('mainTab'); //w.setActiveTab(0); //w.expand(); //w.collapsed ? w.expand() : w.collapse(); simple.getForm().setValues(NecofsWavePeriodInterpolatedAnimationValue); //Ext.MessageBox.alert('Status', 'Changes saved successfully.'); if(document.getElementById("bdNecofsWavePeriodInterpolatedAnimation").innerHTML=="On"){//OFF var result = getProSettingValue(false,'pcolor'); document.getElementById("bdNecofsWavePeriodInterpolatedAnimation").innerHTML = "Off"; //simple.disable(); } else{//ON //simple.enable(); var result = getProSettingValue(true,'pcolor'); document.getElementById("bdNecofsWavePeriodInterpolatedAnimation").innerHTML="On"; } propsGrid.setSource(NecofsWavePeriodInterpolatedSettingValue); NecofsWavePeriodInterpolatedOverlays.mergeNewParams({'styles':result}); Ext.MessageBox.alert('Status', result); }}, {xtype : "button",iconCls:'edit',id:'bdNecofsWavePeriodInterpolatedSetting', handler: function(){ propsGrid.setSource(NecofsWavePeriodInterpolatedSettingValue); } } ] }, ], }] }; var NecofsWaveWind = { //xtype: 'fieldset', title: 'Wind', autoHeight: true, id: 'NecofsWaveWind', //layout: 'form', iconCls: 'mapIcon', collapsed: true, // initially collapse the group collapsible: true, items: [{ // Use the default, automatic layout to distribute the controls evenly // across a single row xtype: 'checkboxgroup', //fieldLabel: 'Multi-Column (vertical)', columns: 2, items: [ {boxLabel: 'Barbs',id:'ckNecofsWaveWindBarbs'}, { xtype : "checkboxgroup", columns: 2, items:[{xtype : "button", text:'Off', iconCls:'film', handler: function(){ //var w = Ext.getCmp('mainTab'); //w.setActiveTab(0); //w.expand(); //w.collapsed ? w.expand() : w.collapse(); simple.getForm().setValues(NecofsWaveWindBarbsAnimationValue); //Ext.MessageBox.alert('Status', 'Changes saved successfully.'); if(document.getElementById("bdNecofsWaveWindBarbsAnimation").innerHTML=="On"){//OFF var result = getProSettingValue(false,'barbs'); document.getElementById("bdNecofsWaveWindBarbsAnimation").innerHTML = "Off"; //simple.disable(); } else{//ON //simple.enable(); var result = getProSettingValue(true,'barbs'); document.getElementById("bdNecofsWaveWindBarbsAnimation").innerHTML="On"; } propsGrid.setSource(NecofsWaveWindBarbsSettingValue); NecofsWaveWindBarbsOverlays.mergeNewParams({'styles':result}); Ext.MessageBox.alert('Status', result); }}, {xtype : "button",iconCls:'edit',id:'bdNecofsWaveWindBarbsSetting', handler: function(){ propsGrid.setSource(NecofsWaveWindBarbsSettingValue); } } ] }, {boxLabel: 'Vectors',id:'ckNecofsWaveWindVectors'}, { xtype : "checkboxgroup", columns: 2, items:[{xtype : "button", text:'Off', iconCls:'film', handler: function(){ //var w = Ext.getCmp('mainTab'); //w.setActiveTab(0); //w.expand(); //w.collapsed ? w.expand() : w.collapse(); simple.getForm().setValues(NecofsWaveWindVectorsAnimationValue); //Ext.MessageBox.alert('Status', 'Changes saved successfully.'); if(document.getElementById("bdNecofsWaveWindVectorsAnimation").innerHTML=="On"){//OFF var result = getProSettingValue(false,'vectors'); document.getElementById("bdNecofsWaveWindVectorsAnimation").innerHTML = "Off"; //simple.disable(); } else{//ON //simple.enable(); var result = getProSettingValue(true,'vectors'); document.getElementById("bdNecofsWaveWindVectorsAnimation").innerHTML="On"; } propsGrid.setSource(NecofsWaveWindVectorsSettingValue); NecofsWaveWindVectorsOverlays.mergeNewParams({'styles':result}); Ext.MessageBox.alert('Status', result); }}, {xtype : "button",iconCls:'edit',id:'bdNecofsWaveWindVectorsSetting', handler: function(){ propsGrid.setSource(NecofsWaveWindVectorsSettingValue); } } ] }, ], }] };