2

In the following link, is a code where I'm trying to build a simple Google Earth Engine app where a button control's a selector's status. The button when clicked, it should check whether a predefined list of dates is empty or not and reflect that on the selector's condition. In order to achieve this goal, an if-statement is used but it's not working properly (line 52-55). It always return as if the condition is false even if it's true.

https://code.earthengine.google.com/e498bf6f86dd1a8413e0e19e42d561e5

Here is a snippet of interest from the code:

//Create selector
var av_dates = ui.Select({placeholder: "",style: SELECT_STYLE});
av_dates.setDisabled(1) //Initally disabled


//var dates =[ee.Date(Date.now()).format('YYYY-MM-dd').getInfo()] 
var dates =[]
print('Dates length' , ee.Number(dates.length))
print('Condition status' , ee.Algorithms.IsEqual(ee.Number(dates.length), 0))


//Create button which controls selector's status
var CloudButton = ui.Button({label: 'Check availabel dates', 
style:BUTTON_STYLE,
onClick:function() {
  ee.Algorithms.If(ee.Algorithms.IsEqual(ee.Number(dates.length), 0), 
    av_dates.setDisabled(1) && av_dates.setPlaceholder('Non!'), // if no dates availabel then leave selector disabled
    av_dates.setDisabled(0) && av_dates.items().reset(dates) //otherwise show available dates and show the first one in the list
    && av_dates.setPlaceholder(dates[0]))
}
})

Why if statement is not working properly? It always act like the case is false!

Update:
According to Gennadii Donchyts insightful answer, I have modified the code accordingly from server-side to client-side so it does the job as expected as shown below:

//Create selector
var av_dates = ui.Select({placeholder: "",style: SELECT_STYLE});
av_dates.setDisabled(1) //Initially disabled


//var dates =[ee.Date(Date.now()).format('YYYY-MM-dd').getInfo()] //For testing purposes
var dates =[]
print('Dates length' , dates.length)
print('Condition status' , dates.length == 0)


//Create button which controls selector's status
var CloudButton = ui.Button({label: 'Check availabel dates', 
style:BUTTON_STYLE,
onClick:function() {
if (dates.length == 0) {
  av_dates.setDisabled(1) && av_dates.setPlaceholder('Non!') // if no dates availabel then leave selector disabled
} else {
  av_dates.setDisabled(0) && av_dates.items().reset(dates) //otherwise show available dates and show the first one in the list
  && av_dates.setPlaceholder(dates[0])
}}
})
infoPanel.insert(1,CloudButton)
infoPanel.insert(2, av_dates)

1 Answer 1

2

You're mixing server-side and client-side EE code. ee.Algorithms.If() is a server-side function and widget.setDisabled() is a client-side code: https://developers.google.com/earth-engine/guides/client_server. The dates variable is declared and defined client-side, so there is no need to use ee.Algorithms.If() on it, just use a normal JavaScript if(). There is actually no need to use any server-side code in your example code. When you will be calling server-side code, like querying image collections, you can pull results from the server to the client by calling evaluate(), like in the following example: https://code.earthengine.google.com/b5cc14f8e2243860fa288de4656f7a2e

enter image description here

There is also a need to take care of the control flow when mixing client and server code in the Code Editor, so you have to keep in mind that different callbacks may run at different times and not just top-down.

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.