General overhaul of the web interface

[cardillan]

It would be nice if the web interface resembled a modern development environment.

The general layout might look like this:

                                TOOLBAR
-----------------------------------------------------------------------------
                                               |
                                               |
                                               | 
                                               |       Primary output
                                               |
                Source code                    |
                                               |-----------------------------
                                               | Tab | Tab | ...
                                               |-----------------------------
                                               |
                                               |      Auxiliary output
                                               |
-----------------------------------------------------------------------------

    Error messages (only shown when present)                                               

-----------------------------------------------------------------------------
                                 FOOTER

• A "toolbar" on the top containing
  • a logo or a title
  • tool selection (Mindcode compiler, Schemacode compiler, Schemacode decompiler)
  • the buttons (compile, compile and run, copy to clipboard, send to Mlog)
  • settings
  • optimization levels
  • port number for MlogWatcher integration
  • maybe more in the future
  • selection of examples
• Main area split as illustrated above (all these element need to allow scrolling over the contained text)
  • source panel on the left
  • outputs on the right (not all outputs shown for every tool)
  • main output (mlog code, compiled/decompiled schematics)
  • auxiliary outputs - maybe with a tab for each output type?
    • text output via Mindustry Logic text buffer (potentially with support for colors)
    • graphical output in case Graphics emulation gets implemented - a tab per display, a list of images in each tab
    • compiler messages/warnings (may contain clickable links to a location in the source code or to documentation)
  • Error messages (shown if present, may contain clickable links to a location in the source code or to documentation)
• Footer (maybe?)
  • version
  • links to project page and documentation

The proposed design not set in stone. Maybe the display of tool outputs might be designed differently, as Mindcode doesn't offer on-the-fly compilation.

Other ideas and comments are welcome.