Extend Design Capabilities with Canvas and Text Elements.

[DirectiveCreator]

### What is your idea?

The idea is to introduce new design features in MML (Metamarkup Language) in the form of a <m-canvas> and <m-text> tag.

These tags would have more extensive customizable options than the currently available <m-label>, <m-video>, <m-image> tags, and they would preferably support native HTML/CSS display, bringing about a significant increase in functionality, this includes but not limited to streaming video/shaders/web feeds and more.

While direct HTML could pose potential security and performance issues, these tags could be designed to display HTML/CSS content without running any scripts, mitigating these risks.

### Why is it important?

The <m-label> and <m-image> tags, as it currently stands, lack options that developers might find beneficial, such as various font style options, color options, and others.

By implementing these new tags, we would be offering developers more freedom and flexibility in the design of their MML documents, allowing for richer, more varied designs and more engaging user experiences.

### What do you propose?

The proposal involves implementing the <m-canvas> and <m-text> tags within the MML framework. These tags would support a wider range of style options, allowing developers to apply more sophisticated design principles to their work.

Key features could include:

<m-canvas> : A tag intended to create a space in which HTML/CSS content can be rendered, but without running any scripts, ensuring the maintenance of security and performance standards.

<m-text>: A tag specifically designed for text display, offering more customization options than the <m-label> tag currently does, such as different font styles, color options, bold, italic and other text-specific styles.

By introducing these tags, we would be significantly expanding the capabilities of MML, opening up new possibilities for developers and improving the overall quality of user experiences.

[MarcusLongmuir]

This is a cool idea. Since you raised this we've now got some examples in the MML Playground that draw to canvas and use that as the src of an m-image tag. E.g.: https://github.com/mml-io/mml-playground/blob/782c5078bbce4575c59c2ef8711920b0b35d6bfc/packages/server/examples/collision-events.html#L167

I think @TheCodeTherapy also has some examples of rendering HTML using a similar approach (rasterizing to canvas). I think I'd lean towards seeing how far we can bend the existing elements and see what we find wanting, but I definitely expect we'll want to add things to make this simpler and more efficient.

[DirectiveCreator]

I think being able to draw to a canvas is perfect and pretty much covers all of the above.