Introductory Tasks for CyberGIS Compute

[vai67]

I added the loading page, fixed the HPC dropdown, added parameters, made the tabs clickable.

[alexandermichels]

Great work so far!

I can see how me hard-coding some settings was confusing and I apologize. I did that just to get the basic idea demoed, but hopefully these comments give you a better idea of what we are trying to accomplish. Please feel free to reach out with any issues you run into!

[alexandermichels]

I believe changing these to 100% instead of vh/vw should make the loading screen fit correctly. Try that out and lmk.

[alexandermichels]

I originally hard-coded some parameters to get the basics working, but that's not actually how CyberGIS-Compute works. Every model has its own set of parameters.

If you visit https://cgjobsup-test.cigi.illinois.edu/v2/git you can see the list of models and the details under "param_rules" so you need to get the list of parameters dynamically based on the job that is selected in the dropdown.

[alexandermichels]

Similarly, the slurm input parameters is specified for each job under slurm_input_rules.

[alexandermichels]

This is one solution to the problem, but this would require that we manually update the list every time. Instead, we should get this from the https://cgjobsup-test.cigi.illinois.edu/v2/git data.

[alexandermichels]

Because we are rendering the parameters dynamically, we will have to re-thinking how to update this based on the job.

Additionally, note that not all jobs are text box inputs. The param_rules and slurm_rules have a few different ways that data can be input including Integer Slider (max, min, default value, step) and String Option (a dropdown of options). This section of the SDK code shows the basic logic used: https://github.com/cybergis/cybergis-compute-python-sdk/blob/v2/cybergis_compute_client/UI.py#L381

For the SLURM parameters this gives the types: https://github.com/cybergis/cybergis-compute-python-sdk/blob/v2/cybergis_compute_client/UI.py#L59

[alexandermichels]

Great work so far! The UI is really starting to look good. Testing out the UI, there are a few more tasks to complete to better match the Python UI:

• Alphabetize the lists of jobs (and all dropdowns) to make them easier to read
• When the user clicks "Submit" can we automatically switch to the "Your Job Status" tab?
• When the user clicks "Submit" can we grey out/disable the button so they don't accidentally submit the same job multiple times? We can also have a "Submit New Job" button that resets everything (or just refreshes the page). The Python UI has a similar functionality.
• Many of the jobs have default values for the HPC, parameters, etc. Let's make sure those defaults are being set in the UI and in the variables passed to the API. For example, if you submit the hello_world job without touching the parameters, it sets those parameters to an empty string rather than using the default values (e.g., https://github.com/cybergis/cybergis-compute-hello-world/blob/main/manifest.json#L29)
• If the model selected in the dropdown does not have Parameters or does not request data upload (e.g., https://github.com/cybergis/cybergis-compute-hello-world/blob/main/manifest.json#L22), do no render those accordion sections.
• Better format the results on the Job Status tab to make it more readable. One example is from the Python UI, but the main goal is a readable and nice layout, doesn't have to be exactly the same.
• Add tooltips in a few places to help explain elements of the UI.
• We are open to any ideas that will make the UI/layout more aesthetically pleasing, so any styling/UI optimization you can think of is welcome!
• Add an "About" tab that provides a quick overview of what CyberGIS-Compute is and refers to our documentation website: https://cybergis.github.io/cybergis-compute-python-sdk/