@@ -3,6 +3,13 @@ import './AdvancedPanel.css';
33
44function AdvancedPanel ( { showAdvanced, setShowAdvanced, params, setParams } ) {
55 const handleParamChange = ( key , value ) => {
6+ setParams ( {
7+ ...params ,
8+ [ key ] : value === '' ? null : value ,
9+ } ) ;
10+ } ;
11+
12+ const handleNumericChange = ( key , value ) => {
613 setParams ( {
714 ...params ,
815 [ key ] : value === '' ? null : parseFloat ( value ) ,
@@ -21,77 +28,32 @@ function AdvancedPanel({ showAdvanced, setShowAdvanced, params, setParams }) {
2128 { showAdvanced && (
2229 < div className = "advanced-content" >
2330 < p className = "advanced-help" >
24- Leave blank to use automatic (Otsu) thresholding.
25- Adjust these values to fine-tune water detection.
31+ Fine-tune detection settings for specific scenarios.
2632 </ p >
2733
2834 < div className = "param-group" >
2935 < label >
30- < span className = "param-label" > VV Threshold (dB)</ span >
31- < span className = "param-value" >
32- { params . vv_threshold ?? 'Auto' }
33- </ span >
34- </ label >
35- < input
36- type = "range"
37- min = "-25"
38- max = "-5"
39- step = "0.5"
40- value = { params . vv_threshold ?? - 15 }
41- onChange = { ( e ) => handleParamChange ( 'vv_threshold' , e . target . value ) }
42- />
43- < button
44- className = "reset-btn"
45- onClick = { ( ) => handleParamChange ( 'vv_threshold' , '' ) }
46- >
47- Reset
48- </ button >
49- </ div >
50-
51- < div className = "param-group" >
52- < label >
53- < span className = "param-label" > VH Threshold (dB)</ span >
36+ < span className = "param-label" > End Date (optional)</ span >
5437 < span className = "param-value" >
55- { params . vh_threshold ?? - 20 }
38+ { params . start_date || 'Latest available' }
5639 </ span >
5740 </ label >
5841 < input
59- type = "range"
60- min = "-30"
61- max = "-10"
62- step = "0.5"
63- value = { params . vh_threshold ?? - 20 }
64- onChange = { ( e ) => handleParamChange ( 'vh_threshold' , e . target . value ) }
65- />
66- < button
67- className = "reset-btn"
68- onClick = { ( ) => handleParamChange ( 'vh_threshold' , '' ) }
69- >
70- Reset
71- </ button >
72- </ div >
73-
74- < div className = "param-group" >
75- < label >
76- < span className = "param-label" > VV-VH Difference</ span >
77- < span className = "param-value" >
78- { params . vv_vh_diff ?? 8 }
79- </ span >
80- </ label >
81- < input
82- type = "range"
83- min = "0"
84- max = "15"
85- step = "0.5"
86- value = { params . vv_vh_diff ?? 8 }
87- onChange = { ( e ) => handleParamChange ( 'vv_vh_diff' , e . target . value ) }
42+ type = "date"
43+ value = { params . start_date || '' }
44+ max = { new Date ( ) . toISOString ( ) . split ( 'T' ) [ 0 ] }
45+ onChange = { ( e ) => handleParamChange ( 'start_date' , e . target . value ) }
46+ style = { { width : '100%' , padding : '8px' , fontSize : '14px' } }
8847 />
8948 < button
9049 className = "reset-btn"
91- onClick = { ( ) => handleParamChange ( 'vv_vh_diff ' , '' ) }
50+ onClick = { ( ) => handleParamChange ( 'start_date ' , '' ) }
9251 >
9352 Reset
9453 </ button >
54+ < p style = { { fontSize : '12px' , color : '#666' , margin : '4px 0 0 0' } } >
55+ Searches for latest image on or before this date
56+ </ p >
9557 </ div >
9658
9759 < div className = "param-group" >
@@ -107,7 +69,7 @@ function AdvancedPanel({ showAdvanced, setShowAdvanced, params, setParams }) {
10769 max = "15"
10870 step = "1"
10971 value = { params . slope_max ?? 5 }
110- onChange = { ( e ) => handleParamChange ( 'slope_max' , e . target . value ) }
72+ onChange = { ( e ) => handleNumericChange ( 'slope_max' , e . target . value ) }
11173 />
11274 < button
11375 className = "reset-btn"
@@ -130,7 +92,7 @@ function AdvancedPanel({ showAdvanced, setShowAdvanced, params, setParams }) {
13092 max = "500"
13193 step = "10"
13294 value = { params . min_area_pixels ?? 100 }
133- onChange = { ( e ) => handleParamChange ( 'min_area_pixels' , e . target . value ) }
95+ onChange = { ( e ) => handleNumericChange ( 'min_area_pixels' , e . target . value ) }
13496 />
13597 < button
13698 className = "reset-btn"
@@ -143,15 +105,12 @@ function AdvancedPanel({ showAdvanced, setShowAdvanced, params, setParams }) {
143105 < button
144106 className = "reset-all-btn"
145107 onClick = { ( ) => setParams ( {
146- vv_threshold : null ,
147- vh_threshold : null ,
148- vv_vh_diff : null ,
108+ start_date : null ,
149109 slope_max : null ,
150110 min_area_pixels : null ,
151- texture_window : null ,
152111 } ) }
153112 >
154- Reset All to Auto
113+ Reset All to Defaults
155114 </ button >
156115 </ div >
157116 ) }
0 commit comments