Implement a new visual Function editor

[3top1a]

I have implemented a new function editor mirroring the appearance of the tool's summary page.
It is more intuitive, cleaner and visual.
Adding a new item also shows suggested items, determined by EDAM constraints.
The old editor has been retained but hidden in an accordion.

This work has been done under ELIXIR-CZ with the supervision of Tomáš Raček (@krab1k).

[magnuspalmblad]

Nice work!

[veitveit]

Wow, this is nice! We will look into it.

[anitamnd]

Hi @3top1a!
Thank you for the great work. Your approach does make function editing more intuitive. The suggested items are also a great improvement.

We have some suggestions:

• Could you make it so that the old editor appears only on smaller screen size/resolution like those on mobile phones, while the new editor shows up on larger screens?
• Would it be easy to show tooltips on the EDAM terms in the editor?
• We would like for the command and note boxes to be a bit smaller, and also emphasize that these are optional fields. I think keeping them both at the bottom would be easier.
• Can you make the pull request into the develop branch instead of master?

Let me know if this is something you can do. You can also email me at [email protected] if you want to discuss these in more detail.

Thanks again for your input! Looking forward to hearing from you.

[3top1a]

Hi @3top1a! Thank you for the great work. Your approach does make function editing more intuitive. The suggested items are also a great improvement.

We have some suggestions:

* Could you make it so that the old editor appears only on smaller screen size/resolution like those on mobile phones, while the new editor shows up on larger screens?

* Would it be easy to show tooltips on the EDAM terms in the editor?

* We would like for the command and note boxes to be a bit smaller, and also emphasize that these are optional fields. I think keeping them both at the bottom would be easier.

* Can you make the pull request into the develop branch instead of master?

Let me know if this is something you can do. You can also email me at [email protected] if you want to discuss these in more detail.

Thanks again for your input! Looking forward to hearing from you.

Hi,

• This new editor uses the same CSS and HTML as the tool overview, which hides itself on mobile resolutions. Once I make both work on mobile resolutions the old editor will be ready for deprecation.
• I'm sorry if I don't understand your question, however tooltips containing what? On the overview page the tooltips only show "Tool operation : click to find more tools with this operation.", and I added "Click to remove" tooltips in the editor to reflect their function.
• Sure, that makes sense, I will do that.
• develop is three commits behind master.

[krab1k]

Hi @veitveit @anitamnd! Is there anything we can do to improve this PR to be merged? Do you have any comments on the code quality? Thank you for the review!

[veitveit]

Hi @krab1k @3top1a ,

Thanks again for the great work and sorry for the delayed response.

We are testing the features and very happy with them but still have a few little questions. Also, the code quality is good!

Mobile solution: This would be super-useful. Do you have a potential time when this will be finished? We would prefer to wait for it before merging all changes into master.

Tooltips: Sorry the the lack in explanation. We meant to see the tooltips with more information about the EDAM term when browsing the EDAM terms. Like here:

develop vs master: I just merged the 3 very minor changes into develop.

[3top1a]

Hi @krab1k @3top1a ,

Thanks again for the great work and sorry for the delayed response.

We are testing the features and very happy with them but still have a few little questions. Also, the code quality is good!

Mobile solution: This would be super-useful. Do you have a potential time when this will be finished? We would prefer to wait for it before merging all changes into master.

Tooltips: Sorry the the lack in explanation. We meant to see the tooltips with more information about the EDAM term when browsing the EDAM terms. Like here:

develop vs master: I just merged the 3 very minor changes into develop.

Hi,

I would like to get both done within the next two weeks.
By fixing the mobile editor it will also fix the operation view not showing on mobile.

Thank you for your response, I will keep in touch.

[3top1a]

Tooltips displaying the term's definition have been added.

[veitveit]

@3top1a Nice! If it is not too much work, maybe also add a line with the synonyms? But no worries if this gets to complicated.

[3top1a]

@veitveit Hi, since you deleted the develop branch, this PR was automatically closed, could you reopen it into the master branch? If that's not possible, I'll make a new PR.

[veitveit]

Sorry, that was not intended! The develop branch is there again.

[3top1a]

@3top1a Nice! If it is not too much work, maybe also add a line with the synonyms? But no worries if this gets to complicated.

Hi,

the space was too small to add synonyms, I did however add a link to the EDAM browser.

The mobile view is now fully functional.

The changes also work on the tool view on mobile.

[anitamnd]

@3top1a we have uploaded your version to https://bio-tools-dev.sdu.dk/.
Currently testing it and everything seems to work great. The link to EDAM browser is a good alternative for the synonyms.
We will try to get this into production later this week.
Thank you for all the great work!