Add MathML examples

[NiedziolkaMichal]

It is now possible to add MathML interactive examples. Anyone interested is welcome to contribute. Ideally, we would have examples for all of those elements:

• [ ] <math>
• [ ] <maction>
• [ ] <annotation>
• [ ] <annotation-xml>
• [ ] <menclose>
• [ ] <merror>
• [ ] <mfenced>
• [ ] <mfrac>
• [ ] <mi>
• [ ] <mmultiscripts>
• [ ] <mn>
• [ ] <mo>
• [ ] <mover>
• [ ] <mpadded>
• [ ] <mphantom>
• [ ] <mprescripts>
• [ ] <mroot>
• [ ] <mrow>
• [ ] <ms>
• [ ] <semantics>
• [ ] <mspace>
• [ ] <msqrt>
• [ ] <mstyle>
• [ ] <msub>
• [ ] <msup>
• [ ] <msubsup>
• [ ] <mtable>
• [ ] <mtd>
• [ ] <mtext>
• [ ] <mtr>
• [ ] <munder>
• [ ] <munderover>

MathML element examples should be placed in live-examples/mathml-examples/elements. Each example should be included in meta.json, where it should have the following structure:

    "ELEMENT_NAME": {
      "exampleCode": "./live-examples/mathml-examples/elements/ELEMENT_NAME.html",
      "fileName": "ELEMENT_NAME.html",
      "title": "MathML Demo: <ELEMENT_NAME>",
      "type": "mathml",
      "height": "EXAMPLE_HEIGHT",
      "tabs": "html"
    }

The value of EXAMPLE_HEIGHT might be tabbed-shorter, tabbed-standard, or tabbed-taller. The smallest possible height should be chosen, in which the vertical scrollbar is not shown.

@fred-wang

[yarusome]

Apart from the fact that a few elements listed here are deprecated / deferred to MathML 4 or have no visual effect, the crucial question is: In what form should these live examples be to make them useful?

Mathml markups are not like HTML ones in that one can make edits to the content enclosed by tags in HTML to see what differences they make, whereas even tiny edits to Mathml content can lead to semantically incorrect markups, e.g.

<mi>a</mi><mo>+</mo><mi>b</mi>

is correct, but

<mi>a</mi><mo>+</mo><mi>bc</mi>

is not. This is understandable as MathML contents are almost never manually authored.

Therefore, it seems better to provide some basic authoring tools to indirectly interact with these examples.

[GELO1234567]

May what date?

[bsmth]

Thanks a lot, since we are maintaining these examples in the content repo, it makes more sense to have the discussion there. We'll open a tracking issue or another follow up about this and we can discuss what makes sense to demo in an interactive example for all technologies. Thank you!

See https://github.com/mdn/interactive-examples/issues/2374