tweakpane-latex
TypeScript icon, indicating that this package has built-in type declarations

0.1.2 • Public • Published

tweakpane-latex

This is an latex plugin for Tweakpane. Basically allows you to write natural text, markdown, and latex for descriptions etc.

This implementation is heavily based on the doersino's infodump plugin. It's just that his doesn't have latex.

Installation

Browser

Download the most recent release from here.

<script src="tweakpane.min.js"></script>
<script src="tweakpane-latex.min.js"></script>
<script>
  const pane = new Tweakpane.Pane();
  pane.registerPlugin(TweakpaneLatexPlugin);
</script>

Package

npm i tweakpane-latex

then

import {Pane} from 'tweakpane';
import * as LatexPlugin from 'tweakpane-latex';

const pane = new Pane();
pane.registerPlugin(LatexPlugin);

Usage

No parsing

pane.addBlade({
  view: "latex",
  content: "No parsing",
});

No parsing + border

pane.addBlade({
  view: "latex",
  content: "No parsing + border",
  border: true,
});

Latex only. This uses Katex and the settings from latexSettings will be passed into katex's options

pane.addBlade({
  view: "latex",
  content: "\\begin{equation} \\int e^{-x^2} dx \\end{equation}",
  latex: true,
  latexSettings: {} // optional
});

Markdown. This uses markedjs and a katex extension so you have both Markdown + Latex. The settings you pass into latexSettings will be passed into katex's options like above. The settings you pass into markedSettings will be passed into marked.js's options

pane.addBlade({
      view: "latex",
      markdown: true,
      markdownSettings: {} // optional
      content: `
        # Header

        $$\\int x^2 dx$$

        [a link](http://www.google.com).
      `
})

Development

Quick start

Clone this repository, then:

  • Install dependencies:

    $ npm install
    
  • Build source codes and watch changes:

    $ npm start
    
  • Open test/browser.html to see the result or run npm run budo for a commonjs environment version

  • Cutting a release:

    $ npm run assets
    

    Then upload the resulting ZIP file to GitHub.

File structure

|- src
|  |- sass ............ Plugin CSS
|  |- index.ts ........ Entrypoint
|  |- plugin.ts ....... Plugin
|  |- controller.ts ... Controller for the custom view
|  `- view.ts ......... Custom view
|- dist ............... Compiled files
`- test
   `- browser.html .... Plugin lab

Package Sidebar

Install

npm i tweakpane-latex

Weekly Downloads

0

Version

0.1.2

License

MIT

Unpacked Size

948 kB

Total Files

11

Last publish

Collaborators

  • curtisjjhu