arnog / mathlive

A web component for easy math input
https://cortexjs.io/mathlive
MIT License
1.26k stars 260 forks source link

How can I switch the layers in a same layout on Mathlive ver 0.98.6 ? #2389

Closed lzrgueen closed 3 weeks ago

lzrgueen commented 4 weeks ago

Description Hello, I am using the Vue.js and I imported mathlive ver 0.98.6, I tried to search on the official docs and past issues, and here is my layout code:

mathVirtualKeyboard.layouts = [
  {
    label: "minimal",
    tooltip: "Only the essential",
    layers: [
      {
        // First layer
        label: 'layer-1',
        style: ".digit { background: blue; color: white }",
        rows: [
          [
            '+',
            '-',
            '\\times',
            '\\frac{#@}{#?}',
            '=',
            '.',
            '(',
            ')',
            '\\sqrt{#0}',
            '#@^{#?}',
          ],
          [
            { class: 'digit', latex: '1' },
            { class: 'digit', latex: '2' },
            { class: 'digit', latex: '3' },
            { class: 'digit', latex: '4' },
            { class: 'digit', latex: '5' },
            { class: 'digit', latex: '6' },
            { class: 'digit', latex: '7' },
            { class: 'digit', latex: '8' },
            { class: 'digit', latex: '9' },
            { class: 'digit', latex: '0' },
            { latex: '\\rightarrow', insert: '', command: 'switchKeyboardLayer', layer: 'layer-2' },
          ],
        ],
      },
      {
        // Second layer
        label: 'layer-2',
        style: ".operator { background: green; color: white }",
        rows: [
          [
            '\\sin',
            '\\cos',
            '\\tan',
            '\\log',
            '\\ln',
            '\\pi',
            '\\infty',
            '\\int',
            '\\sum',
            '\\prod',
          ],
          [
            { latex: '\\leftarrow', insert: '', command: 'switchKeyboardLayer', layer: 'layer-1' },
            { class: 'operator', latex: '\\alpha' },
            { class: 'operator', latex: '\\beta' },
            { class: 'operator', latex: '\\gamma' },
            { class: 'operator', latex: '\\delta' },
            { class: 'operator', latex: '\\epsilon' },
            { class: 'operator', latex: '\\zeta' },
            { class: 'operator', latex: '\\eta' },
            { class: 'operator', latex: '\\theta' },
            { class: 'operator', latex: '\\lambda' },
          ],
        ],
      },
    ],
  },
  "alphabetic",
];

So the desired behavioris that when I tried to click on the left and right button, the layers should be switched, but nothing happens instead. Could somebody please do me a favour and tells me where I am wrong? Thanks for your help

arnog commented 4 weeks ago

Two changes needed:

lzrgueen commented 4 weeks ago

Thanks a lot, I'll have a try

lzrgueen commented 3 weeks ago

This works, thank u so much!