Skip to content

JonathanTreffler/Quill-mathLive-blot

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

npm npm bundle size npm GitHub Lint Workflow Status GitHub CodeQL Workflow Status GitHub Demo Deploy Workflow Status GitHub GitHub last commit Maintenance

Quill-mathLive-blot

A Blot/Extension for Quill.js to embed editable formulas with mathLive.

Installation:

npm install quill-mathlive-blot

Usage:

  • import Quill
import mathLiveBlot from "quill-mathlive-blot";

// MathLive options can be modified before the initialisation.
// If changed later it only applies to mathLive Instances created after the change.
mathLiveBlot.options.virtualKeyboardMode = "off";

var quill = new Quill('#editor-container', {
	modules: {
		toolbar: {
			container: [
				['bold', 'italic', 'underline'],
				['mathLive']
			],
			handlers: {
				'mathLive': insert,
			}
		}
	},
	placeholder: '',
	theme: 'snow'
});

mathLiveBlot.register(Quill);

// This function gets called by the quill toolbar handler.
// It can also be called programmatically.
function insert() {
	let selection = quill.getSelection();
	// In this example a mathLive instance will start with the content "x"
	quill.insertEmbed(selection.index, "mathLive", "x");
}

Configuration:

Options can be set through the mathLiveBlot.options variable.

The default values are:

smartMode: true,
virtualKeyboardMode: "manual",
virtualKeyboardLayout: "qwertz",
virtualKeyboardTheme: "material",
virtualKeyboards: "all",
inlineShortcuts: {
	"minus": "-",
	"-": "-",
	"plus": "+",
	"/": "\\frac",
	"super 1": "^1",
	"super 2": "^2",
	"super 3": "^3",
	"super 4": "^4",
	"super 5": "^5",
	"super 6": "^6",
	"super 7": "^7",
	"super 8": "^8",
	"super 9": "^8",
},