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.