Improve editor

[VictorVelarde]

Changes include:

Aesthetic/UI

• [ ] Migrate to Airship for layout and components.
• [ ] Font: use a monospace, à la Inside blog.

Left panel

• [ ] Header + developers website
• [ ] Define user
• [ ] Sources
  • Dataset
  • SQL, with default query when selected
• [ ] Basemaps
  • Dark Matter
  • Positron
  • Voyager
• [ ] Examples drop-down + next/prev buttons
• [ ] Share
  • Copy URL for the current state
  • Create Gist/bl.ock

Map

• [ ] Matching font with the rest of the UI
• [ ] Center + zoom information
• [ ] Feature count information
• [ ] Remove full screen mode

Viz editor

• [ ] Reset current viz button
• [ ] Integrate an existing code editor for better interoperability: tabs, auto-closing brackets, etc.

Examples

• [ ] Remove comples examples
• [ ] Include some examples from the developers' website
• [ ] Default map: simple but showing relevant features

Feedback

• [ ] Error feedback
• [ ] Remove current debugging information

[Algunenano]

One thing that would make my life easier is the option of not using basemaps in editor. Sometimes it's hard to compare different tiles or see certain features because of the noise introduced by the basemap / basemap tags.

Should I open a different issue?

[VictorVelarde]

Good idea!. I think that could fit in this issue.

What do you think about a "None" option in the Basemaps, with a default white color?

[Algunenano]

What do you think about a "None" option in the Basemaps, with a default white color?

Seems good. Maybe it'd be better to be called "White" in case we need a different color in the future.

[makella]

as just discussed with @VictorVelarde we are reading in VL via http not https in the Editor: <script src="http://libs.cartocdn.com/carto-vl/v${carto.version}/carto-vl.js"></script>

Adding a to-do which will impact the "Create gist" output:

• [ ] Retrieve CARTO VL js via https not http

[elenatorro]

Integrate an existing code editor for better interoperability:

I think we should discuss also about adding a syntax highlighter, which I guess is one of the purposes of this task. I know @IagoLast did something in December, it'd be great to integrate these rules into the Monaco Editor, a tool we've already mentioned in the past, that can be very useful for the code editor.