Skip to content

General overhaul of the web interface #163

Open
@cardillan

Description

@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.

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or requesthelp wantedExtra attention is needed

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions