@wiris/mathtype-viewer 1.0.1 → 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/WIRISplugins.js +7744 -0
- package/dist/app.d.ts +2 -0
- package/dist/app.d.ts.map +1 -0
- package/dist/latex.d.ts +3 -0
- package/dist/latex.d.ts.map +1 -0
- package/dist/mathml.d.ts +3 -0
- package/dist/mathml.d.ts.map +1 -0
- package/dist/properties.d.ts +41 -0
- package/dist/properties.d.ts.map +1 -0
- package/dist/retro.d.ts +3 -0
- package/dist/retro.d.ts.map +1 -0
- package/dist/services.d.ts +16 -0
- package/dist/services.d.ts.map +1 -0
- package/dist/utils.d.ts +3 -0
- package/dist/utils.d.ts.map +1 -0
- package/docs/spec.md +73 -0
- package/index.html +1 -1
- package/package.json +3 -3
- package/project.json +29 -0
- package/src/app.ts +14 -8
- package/src/latex.ts +10 -8
- package/src/mathml.ts +17 -13
- package/src/properties.ts +53 -61
- package/src/retro.ts +255 -0
- package/src/utils.ts +45 -0
- package/typings/module-name.d.ts +2 -0
package/dist/app.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"app.d.ts","sourceRoot":"","sources":["../src/app.ts"],"names":[],"mappings":""}
|
package/dist/latex.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"latex.d.ts","sourceRoot":"","sources":["../src/latex.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAY1C,wBAAsB,WAAW,CAAC,UAAU,EAAE,UAAU,EAAE,IAAI,EAAE,WAAW,iBAW1E"}
|
package/dist/mathml.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"mathml.d.ts","sourceRoot":"","sources":["../src/mathml.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAmB1C,wBAAsB,YAAY,CAAC,UAAU,EAAE,UAAU,EAAE,IAAI,EAAE,WAAW,GAAG,OAAO,CAAC,IAAI,CAAC,CA8B3F"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
declare type Viewer = 'none' | 'image' | 'mathml' | 'latex';
|
|
2
|
+
declare type Wirispluginperformance = 'true' | 'false';
|
|
3
|
+
export declare type Config = {
|
|
4
|
+
editorServicesRoot?: string;
|
|
5
|
+
editorServicesExtension?: string;
|
|
6
|
+
backendConfig?: {
|
|
7
|
+
wirispluginperformance?: Wirispluginperformance;
|
|
8
|
+
wiriseditormathmlattribute?: string;
|
|
9
|
+
};
|
|
10
|
+
dpi?: number;
|
|
11
|
+
element?: string;
|
|
12
|
+
lang?: string;
|
|
13
|
+
viewer?: Viewer;
|
|
14
|
+
zoom?: number;
|
|
15
|
+
};
|
|
16
|
+
export declare class Properties {
|
|
17
|
+
render: () => Promise<void>;
|
|
18
|
+
config: Config;
|
|
19
|
+
private new;
|
|
20
|
+
static generate(): Promise<Properties>;
|
|
21
|
+
get editorServicesRoot(): string;
|
|
22
|
+
set editorServicesRoot(editorServicesRoot: string);
|
|
23
|
+
get editorServicesExtension(): string;
|
|
24
|
+
set editorServicesExtension(editorServicesExtension: string);
|
|
25
|
+
get lang(): string;
|
|
26
|
+
set lang(lang: string);
|
|
27
|
+
get viewer(): Viewer;
|
|
28
|
+
set viewer(viewer: Viewer);
|
|
29
|
+
get dpi(): number;
|
|
30
|
+
set dpi(dpi: number);
|
|
31
|
+
get zoom(): number;
|
|
32
|
+
set zoom(zoom: number);
|
|
33
|
+
get element(): string;
|
|
34
|
+
set element(element: string);
|
|
35
|
+
get wirispluginperformance(): Wirispluginperformance;
|
|
36
|
+
set wirispluginperformance(wirispluginperformance: Wirispluginperformance);
|
|
37
|
+
get wiriseditormathmlattribute(): string;
|
|
38
|
+
set wiriseditormathmlattribute(wiriseditormathmlattribute: string);
|
|
39
|
+
}
|
|
40
|
+
export {};
|
|
41
|
+
//# sourceMappingURL=properties.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"properties.d.ts","sourceRoot":"","sources":["../src/properties.ts"],"names":[],"mappings":"AAGA,aAAK,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AACpD,aAAK,sBAAsB,GAAG,MAAM,GAAG,OAAO,CAAC;AAK/C,oBAAY,MAAM,GAAG;IACnB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,aAAa,CAAC,EAAE;QACd,sBAAsB,CAAC,EAAE,sBAAsB,CAAC;QAChD,0BAA0B,CAAC,EAAE,MAAM,CAAC;KACrC,CAAC;IACF,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAsBF,qBAAa,UAAU;IAErB,MAAM,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAkB;IAG7C,MAAM,EAAE,MAAM,CAAiB;IAM/B,OAAO,CAAC,GAAG;WAKE,QAAQ,IAAI,OAAO,CAAC,UAAU,CAAC;IAmD5C,IAAI,kBAAkB,IAAI,MAAM,CAG/B;IAED,IAAI,kBAAkB,CAAC,kBAAkB,EAAE,MAAM,EAGhD;IAED,IAAI,uBAAuB,IAAI,MAAM,CAGpC;IAED,IAAI,uBAAuB,CAAC,uBAAuB,EAAE,MAAM,EAG1D;IAWD,IAAI,IAAI,IAAI,MAAM,CAMjB;IAED,IAAI,IAAI,CAAC,IAAI,EAAE,MAAM,EAGpB;IAQD,IAAI,MAAM,IAAI,MAAM,CAGnB;IAED,IAAI,MAAM,CAAC,MAAM,EAAE,MAAM,EAGxB;IAQD,IAAI,GAAG,IAAI,MAAM,CAGhB;IAED,IAAI,GAAG,CAAC,GAAG,EAAE,MAAM,EAGlB;IAQD,IAAI,IAAI,IAAI,MAAM,CAGjB;IAED,IAAI,IAAI,CAAC,IAAI,EAAE,MAAM,EAGpB;IAQD,IAAI,OAAO,IAAI,MAAM,CAGpB;IAED,IAAI,OAAO,CAAC,OAAO,EAAE,MAAM,EAG1B;IAQD,IAAI,sBAAsB,IAAI,sBAAsB,CAGnD;IAED,IAAI,sBAAsB,CAAC,sBAAsB,EAAE,sBAAsB,EAGxE;IAQD,IAAI,0BAA0B,IAAI,MAAM,CAGvC;IAED,IAAI,0BAA0B,CAAC,0BAA0B,EAAE,MAAM,EAGhE;CACF"}
|
package/dist/retro.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"retro.d.ts","sourceRoot":"","sources":["../src/retro.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAQ1C,wBAAgB,mBAAmB,CAAC,UAAU,EAAE,UAAU,EAAE,CAAC,EAAE,MAAM,QAmBpE"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
declare enum MethodType {
|
|
2
|
+
Post = "POST",
|
|
3
|
+
Get = "GET"
|
|
4
|
+
}
|
|
5
|
+
export declare class StatusError extends Error {
|
|
6
|
+
constructor(message: any);
|
|
7
|
+
}
|
|
8
|
+
export declare function processJsonResponse(response: Promise<Response>): Promise<any>;
|
|
9
|
+
export declare function callService(query: object, serviceName: string, method: MethodType, serverURL: string, extension: string): Promise<any>;
|
|
10
|
+
export declare function mathml2accessible(mml: string, lang: string, url: string, extension: string): Promise<any>;
|
|
11
|
+
export declare function showImage(mml: string, lang: string, url: string, extension: string): Promise<any>;
|
|
12
|
+
export declare function createImage(mml: string, lang: string, url: string, extension: string): Promise<any>;
|
|
13
|
+
export declare function latexToMathml(latex: string, url: string, extension: string): Promise<any>;
|
|
14
|
+
export declare function configurationJson(variablekeys: string[], url: string, extension: string): Promise<any>;
|
|
15
|
+
export {};
|
|
16
|
+
//# sourceMappingURL=services.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"services.d.ts","sourceRoot":"","sources":["../src/services.ts"],"names":[],"mappings":"AAEA,aAAK,UAAU;IACb,IAAI,SAAS;IACb,GAAG,QAAQ;CACZ;AAKD,qBAAa,WAAY,SAAQ,KAAK;gBACxB,OAAO,KAAA;CAIpB;AAUD,wBAAsB,mBAAmB,CAAC,QAAQ,EAAE,OAAO,CAAC,QAAQ,CAAC,GAAG,OAAO,CAAC,GAAG,CAAC,CAanF;AAUD,wBAAsB,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAI,OAAO,CAAC,GAAG,CAAC,CAyB7I;AAUD,wBAAsB,iBAAiB,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAI,OAAO,CAAC,GAAG,CAAC,CAahH;AAUD,wBAAsB,SAAS,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,OAAO,CAAC,GAAG,CAAC,CAyBvG;AAUD,wBAAsB,WAAW,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,OAAO,CAAC,GAAG,CAAC,CAUzG;AASD,wBAAsB,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,OAAO,CAAC,GAAG,CAAC,CAQ/F;AAQD,wBAAsB,iBAAiB,CAAC,YAAY,EAAE,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAI,OAAO,CAAC,GAAG,CAAC,CAO7G"}
|
package/dist/utils.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAoBA,wBAAgB,yBAAyB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAoB9D;AAID,eAAO,MAAM,aAAa,UAAqG,CAAC"}
|
package/docs/spec.md
CHANGED
|
@@ -116,3 +116,76 @@ The following table contains a specification of each of the properties.
|
|
|
116
116
|
| lang | The language for the alt text. | Frontend | | en |
|
|
117
117
|
| dpi | Resolution in dots per inch of the generated image. This feature scales the formula with a factor of dpi/96. | Frontend | Positive integer | 96 |
|
|
118
118
|
| zoom | The scale of the generated image. | Frontend | Positive floating point number | 1 |
|
|
119
|
+
|
|
120
|
+
|
|
121
|
+
## API
|
|
122
|
+
|
|
123
|
+
The viewer exposes an API to the global window object with utilities related to rendering formulas.
|
|
124
|
+
This API is obsolete and will eventually be removed or replaced by a newer API.
|
|
125
|
+
|
|
126
|
+
All of the following methods are exposed inside of `window.com.wiris.js.JsPluginViewer` whenever the script is included in the page.
|
|
127
|
+
|
|
128
|
+
- `parseSafeMathMLElement`.
|
|
129
|
+
Render all the formulas written in SafeMathML inside the given element.
|
|
130
|
+
|
|
131
|
+
This method is deprecated.
|
|
132
|
+
There is currently no replacement for rendering SafeMathML formulas.
|
|
133
|
+
Please consider using {@link renderLatex} or {@link renderMathML}.
|
|
134
|
+
|
|
135
|
+
Parameters:
|
|
136
|
+
- {`HTMLElement`} `element` - Element wherein to render SafeMathML formulas.
|
|
137
|
+
- `asynchronously` - Currently ignored, only included for retrocompatibility purposes.
|
|
138
|
+
- `callbackFunc` - Currently ignored, only included for retrocompatibility purposes.
|
|
139
|
+
|
|
140
|
+
Return: `void`.
|
|
141
|
+
|
|
142
|
+
- `parseDocument`.
|
|
143
|
+
Render all the formulas in the document.
|
|
144
|
+
|
|
145
|
+
This method is deprecated.
|
|
146
|
+
Please consider using `renderMathML`.
|
|
147
|
+
|
|
148
|
+
Parameters:
|
|
149
|
+
- `asynchronously` - Currently ignored, only included for retrocompatibility purposes.
|
|
150
|
+
- `callbackFunc` - Currently ignored, only included for retrocompatibility purposes.
|
|
151
|
+
- `safeXml` - Currently ignored, only included for retrocompatibility purposes.
|
|
152
|
+
|
|
153
|
+
Return: `Promise<void>`.
|
|
154
|
+
|
|
155
|
+
- `parseElement`.
|
|
156
|
+
Render all the formulas inside the given element.
|
|
157
|
+
|
|
158
|
+
This method is deprecated.
|
|
159
|
+
Please consider using `renderMathML`.
|
|
160
|
+
|
|
161
|
+
Parameters:
|
|
162
|
+
- {`HTMLElement`} `element` - Element wherein to render formulas.
|
|
163
|
+
- `asynchronously` - Currently ignored, only included for retrocompatibility purposes.
|
|
164
|
+
- `callbackFunc` - Currently ignored, only included for retrocompatibility purposes.
|
|
165
|
+
|
|
166
|
+
Return: `Promise<void>`.
|
|
167
|
+
|
|
168
|
+
- `parseLatexDocument`.
|
|
169
|
+
Convert all the LaTeX formulas in the document to MathML.t
|
|
170
|
+
|
|
171
|
+
This method is deprecated.
|
|
172
|
+
Please consider using `renderLatex`.
|
|
173
|
+
|
|
174
|
+
Parameters:
|
|
175
|
+
- `asynchronously` - Currently ignored, only included for retrocompatibility purposes.
|
|
176
|
+
- `callbackFunc` - Currently ignored, only included for retrocompatibility purposes.
|
|
177
|
+
|
|
178
|
+
Return: `Promise<void>`.
|
|
179
|
+
|
|
180
|
+
- `parseLatexElement`.
|
|
181
|
+
Convert all the LaTeX formulas inside the given element to MathML.
|
|
182
|
+
|
|
183
|
+
This method is deprecated.
|
|
184
|
+
Please consider using `renderLatex`.
|
|
185
|
+
|
|
186
|
+
Parameters:
|
|
187
|
+
- {`HTMLElement`} `element` - Element wherein to convert formulas.
|
|
188
|
+
- `asynchronously` - Currently ignored, only included for retrocompatibility purposes.
|
|
189
|
+
- `callbackFunc` - Currently ignored, only included for retrocompatibility purposes.
|
|
190
|
+
|
|
191
|
+
Return: `Promise<void>`.
|
package/index.html
CHANGED
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
<script src="dist/WIRISplugins.js?viewer=image" defer></script>
|
|
8
8
|
<script>
|
|
9
9
|
window.document.addEventListener('viewerLoaded', () => {
|
|
10
|
-
// window.viewer.
|
|
10
|
+
// window.viewer.properties can be modified here
|
|
11
11
|
// Changes are reflected live
|
|
12
12
|
});
|
|
13
13
|
</script>
|
package/package.json
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wiris/mathtype-viewer",
|
|
3
|
-
"version": "1.0
|
|
3
|
+
"version": "1.1.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "app.js",
|
|
6
6
|
"scripts": {
|
|
7
7
|
"build": "webpack",
|
|
8
8
|
"serve": "webpack serve",
|
|
9
|
-
"prepack": "
|
|
9
|
+
"prepack": "yarn && npm run build"
|
|
10
10
|
},
|
|
11
11
|
"keywords": [
|
|
12
12
|
"typescript",
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
"author": "Integrations",
|
|
16
16
|
"license": "ISC",
|
|
17
17
|
"dependencies": {
|
|
18
|
-
"@wiris/mathtype-html-integration-devkit": "1.
|
|
18
|
+
"@wiris/mathtype-html-integration-devkit": "1.13.0"
|
|
19
19
|
},
|
|
20
20
|
"devDependencies": {
|
|
21
21
|
"babel-loader": "^9.1.2",
|
package/project.json
ADDED
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "viewer",
|
|
3
|
+
"$schema": "../../node_modules/nx/schemas/project-schema.json",
|
|
4
|
+
"sourceRoot": "packages/viewer/src",
|
|
5
|
+
"targets": {
|
|
6
|
+
"build": {
|
|
7
|
+
"executor": "nx:run-script",
|
|
8
|
+
"options": {
|
|
9
|
+
"script": "build",
|
|
10
|
+
"outputPath": "packages/viewer/dist"
|
|
11
|
+
},
|
|
12
|
+
"outputs": [
|
|
13
|
+
"{options.outputPath}"
|
|
14
|
+
]
|
|
15
|
+
},
|
|
16
|
+
"lint": {
|
|
17
|
+
"executor": "@nx/linter:eslint",
|
|
18
|
+
"options": {
|
|
19
|
+
"eslintConfig": "./.eslintrc.js",
|
|
20
|
+
"lintFilePatterns": [
|
|
21
|
+
"demos/html/viewer/**/*.{ts,tsx,js,jsx}"
|
|
22
|
+
]
|
|
23
|
+
},
|
|
24
|
+
"outputs": [
|
|
25
|
+
"{options.outputFile}"
|
|
26
|
+
]
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
}
|
package/src/app.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { Properties } from './properties';
|
|
2
2
|
import { renderLatex } from './latex';
|
|
3
3
|
import { renderMathML } from './mathml';
|
|
4
|
+
import { bypassEncapsulation } from './retro';
|
|
4
5
|
|
|
5
6
|
// This should be the only code executed outside of a function
|
|
6
7
|
// and the only code containing browser globals (e.g. window)
|
|
@@ -12,9 +13,12 @@ main(window);
|
|
|
12
13
|
* @param {Window} w - The window instance of the browser.
|
|
13
14
|
*/
|
|
14
15
|
async function main(w: Window): Promise<void> {
|
|
16
|
+
|
|
17
|
+
const properties: Properties = await Properties.generate();
|
|
18
|
+
|
|
15
19
|
// Expose the globals to the browser
|
|
16
20
|
(w as any).viewer = {
|
|
17
|
-
|
|
21
|
+
properties,
|
|
18
22
|
};
|
|
19
23
|
|
|
20
24
|
const document = w.document;
|
|
@@ -25,11 +29,11 @@ async function main(w: Window): Promise<void> {
|
|
|
25
29
|
* @param {Document} document - The DOM document in which to search for the rendering root.
|
|
26
30
|
* @param {MutationObserver} observer - Mutation observer to activate or reactivate every time the rendering root changes.
|
|
27
31
|
*/
|
|
28
|
-
|
|
29
|
-
const element: HTMLElement = document.querySelector(
|
|
32
|
+
properties.render = async () => {
|
|
33
|
+
const element: HTMLElement = document.querySelector(properties.element);
|
|
30
34
|
if (element) {
|
|
31
|
-
await renderLatex(element);
|
|
32
|
-
await renderMathML(element);
|
|
35
|
+
await renderLatex(properties, element);
|
|
36
|
+
await renderMathML(properties, element);
|
|
33
37
|
}
|
|
34
38
|
};
|
|
35
39
|
|
|
@@ -37,14 +41,14 @@ async function main(w: Window): Promise<void> {
|
|
|
37
41
|
// Renders formulas and sets observer
|
|
38
42
|
const start = async () => {
|
|
39
43
|
// First render
|
|
40
|
-
|
|
44
|
+
properties.render();
|
|
41
45
|
|
|
42
46
|
// Callback called every time there is a mutation in the watched DOM element
|
|
43
47
|
new MutationObserver(async (mutationList, observer) => {
|
|
44
48
|
for (const mutation of mutationList) {
|
|
45
49
|
for (const node of mutation.addedNodes) {
|
|
46
50
|
if (node instanceof HTMLElement) {
|
|
47
|
-
await
|
|
51
|
+
await properties.render();
|
|
48
52
|
}
|
|
49
53
|
}
|
|
50
54
|
}
|
|
@@ -67,7 +71,9 @@ async function main(w: Window): Promise<void> {
|
|
|
67
71
|
start();
|
|
68
72
|
}
|
|
69
73
|
|
|
74
|
+
// Expose the old Viewer API as a global
|
|
75
|
+
bypassEncapsulation(properties, w);
|
|
76
|
+
|
|
70
77
|
// Dispatch an event notifying that the viewer has been loaded
|
|
71
78
|
document.dispatchEvent(new Event('viewerLoaded'));
|
|
72
|
-
|
|
73
79
|
}
|
package/src/latex.ts
CHANGED
|
@@ -8,26 +8,28 @@ interface LatexPosition {
|
|
|
8
8
|
|
|
9
9
|
/**
|
|
10
10
|
* Parse the DOM looking for LaTeX nodes and replaces them with the corresponding rendered images.
|
|
11
|
+
* @param {Properties} properties - Properties of the viewer.
|
|
11
12
|
* @param {HTMLElement} root - Any DOM element that can contain MathML.
|
|
12
13
|
*/
|
|
13
|
-
export async function renderLatex(root: HTMLElement) {
|
|
14
|
+
export async function renderLatex(properties: Properties, root: HTMLElement) {
|
|
14
15
|
|
|
15
|
-
if (
|
|
16
|
+
if (properties.viewer !== 'image' && properties.viewer !== 'latex') {
|
|
16
17
|
return;
|
|
17
18
|
}
|
|
18
19
|
|
|
19
20
|
const latexNodes = findLatexTextNodes(root);
|
|
20
21
|
|
|
21
22
|
for (const latexNode of latexNodes) {
|
|
22
|
-
await replaceLatexInTextNode(latexNode);
|
|
23
|
+
await replaceLatexInTextNode(properties, latexNode);
|
|
23
24
|
}
|
|
24
25
|
}
|
|
25
26
|
|
|
26
27
|
/**
|
|
27
28
|
* Replace LaTeX instances with MathML inside a given node.
|
|
29
|
+
* @param {Properties} properties - Properties of the viewer.
|
|
28
30
|
* @param {Node} node - Text node in which to search and replace LaTeX instances.
|
|
29
31
|
*/
|
|
30
|
-
async function replaceLatexInTextNode(node: Node) {
|
|
32
|
+
async function replaceLatexInTextNode(properties: Properties, node: Node) {
|
|
31
33
|
const textContent: string = node.textContent || '';
|
|
32
34
|
let pos: number = 0;
|
|
33
35
|
|
|
@@ -44,7 +46,7 @@ async function replaceLatexInTextNode(node: Node) {
|
|
|
44
46
|
// Get LaTeX text.
|
|
45
47
|
const latex = textContent.substring(nextLatexPosition.start + '$$'.length, nextLatexPosition.end);
|
|
46
48
|
// Convert LaTeX to mathml.
|
|
47
|
-
const response = await latexToMathml(latex,
|
|
49
|
+
const response = await latexToMathml(latex, properties.editorServicesRoot, properties.editorServicesExtension);
|
|
48
50
|
// Insert mathml node.
|
|
49
51
|
const fragment = document.createRange().createContextualFragment(response.text);
|
|
50
52
|
|
|
@@ -95,7 +97,7 @@ function findLatexTextNodes(root: any): Node[] {
|
|
|
95
97
|
* @
|
|
96
98
|
*/
|
|
97
99
|
function getNextLatexPos(pos: number, text: string): LatexPosition {
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
100
|
+
const firstLatexTags = text.indexOf('$$', pos);
|
|
101
|
+
const secondLatexTags = firstLatexTags == -1 ? -1 : text.indexOf('$$', firstLatexTags + '$$'.length);
|
|
102
|
+
return firstLatexTags != -1 && secondLatexTags != -1 ? {'start': firstLatexTags, 'end': secondLatexTags} : null;
|
|
101
103
|
}
|
package/src/mathml.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { Properties } from "./properties";
|
|
2
2
|
import { showImage, createImage, mathml2accessible, processJsonResponse } from './services';
|
|
3
|
+
import { htmlEntitiesToXmlEntities, corruptMathML } from './utils';
|
|
3
4
|
|
|
4
5
|
/**
|
|
5
6
|
* Data obtained when rendering image. Data needed to set the formula image parameters.
|
|
@@ -13,25 +14,26 @@ interface FormulaData {
|
|
|
13
14
|
|
|
14
15
|
/**
|
|
15
16
|
* Parse the DOM looking for <math> elements and replace them with the corresponding rendered images within the given element.
|
|
17
|
+
* @param {Properties} properties - Properties of the viewer.
|
|
16
18
|
* @param {HTMLElement} root - Any DOM element that can contain MathML.
|
|
17
19
|
*/
|
|
18
|
-
export async function renderMathML(root: HTMLElement): Promise<void> {
|
|
20
|
+
export async function renderMathML(properties: Properties, root: HTMLElement): Promise<void> {
|
|
19
21
|
|
|
20
|
-
if (
|
|
22
|
+
if (properties.viewer !== 'image' && properties.viewer !== 'mathml') {
|
|
21
23
|
return;
|
|
22
24
|
}
|
|
23
25
|
|
|
24
26
|
for(const mathElement of [...root.getElementsByTagName('math')]) {
|
|
25
|
-
const mml = mathElement.outerHTML;
|
|
27
|
+
const mml = htmlEntitiesToXmlEntities(mathElement.outerHTML);
|
|
26
28
|
|
|
27
29
|
let result;
|
|
28
30
|
|
|
29
|
-
if (
|
|
31
|
+
if (properties.wirispluginperformance === 'true') {
|
|
30
32
|
// Transform mml to img.
|
|
31
|
-
result = await showImage(mml,
|
|
33
|
+
result = await showImage(mml, properties.lang, properties.editorServicesRoot, properties.editorServicesExtension);
|
|
32
34
|
} else {
|
|
33
35
|
// createimage returns the URL to showimage of the corresponding image
|
|
34
|
-
let url = await createImage(mml,
|
|
36
|
+
let url = await createImage(mml, properties.lang, properties.editorServicesRoot, properties.editorServicesExtension);
|
|
35
37
|
// This line is necessary due to a bug in how the services interoperate.
|
|
36
38
|
// TODO fix the causing bug
|
|
37
39
|
url = url.replace('pluginsapp', 'plugins/app');
|
|
@@ -39,7 +41,7 @@ export async function renderMathML(root: HTMLElement): Promise<void> {
|
|
|
39
41
|
}
|
|
40
42
|
|
|
41
43
|
// Set img properties.
|
|
42
|
-
const img = await setImageProperties(result, mml
|
|
44
|
+
const img = await setImageProperties(properties, result, mml);
|
|
43
45
|
// const fragment = document.createRange().createContextualFragment(data.result.content);
|
|
44
46
|
|
|
45
47
|
// Replace the MathML for the generated formula image.
|
|
@@ -49,12 +51,12 @@ export async function renderMathML(root: HTMLElement): Promise<void> {
|
|
|
49
51
|
|
|
50
52
|
/**
|
|
51
53
|
* Returns an image formula containing all MathType properties.
|
|
54
|
+
* @param {Properties} properties - Properties of the viewer.
|
|
52
55
|
* @param {FormulaData} data - Object containing image values.
|
|
53
56
|
* @param {string} mml - The MathML of the formula image beeing created.
|
|
54
|
-
* @param {string} wiriseditormathmlattribute - The name of the HTML attribute to store the MathML in.
|
|
55
57
|
* @returns {Promise<HTMLImageElement>} - Formula image.
|
|
56
58
|
*/
|
|
57
|
-
async function setImageProperties(
|
|
59
|
+
async function setImageProperties(properties: Properties, data: FormulaData, mml: string): Promise<HTMLImageElement> {
|
|
58
60
|
|
|
59
61
|
// Create imag element.
|
|
60
62
|
let img = document.createElement('img');
|
|
@@ -63,7 +65,7 @@ async function setImageProperties(data: FormulaData, mml: string, wiriseditormat
|
|
|
63
65
|
img.src = `data:image/svg+xml;charset=utf8,${encodeURIComponent(data.content)}`;
|
|
64
66
|
|
|
65
67
|
// Set other image properties.
|
|
66
|
-
img.setAttribute(wiriseditormathmlattribute, mml);
|
|
68
|
+
img.setAttribute(properties.wiriseditormathmlattribute, mml);
|
|
67
69
|
img.setAttribute('class', 'Wirisformula');
|
|
68
70
|
img.setAttribute('role', 'math');
|
|
69
71
|
|
|
@@ -74,9 +76,11 @@ async function setImageProperties(data: FormulaData, mml: string, wiriseditormat
|
|
|
74
76
|
img.width = +data.width;
|
|
75
77
|
}
|
|
76
78
|
|
|
77
|
-
// Set the alt text.
|
|
78
|
-
|
|
79
|
-
|
|
79
|
+
// Set the alt text whenever there's a translation for the characters and MathML on the mml.
|
|
80
|
+
if (!corruptMathML.some(corruptMathML => mml.includes(corruptMathML))) {
|
|
81
|
+
const { text } = await mathml2accessible(mml, properties.lang, properties.editorServicesRoot, properties.editorServicesExtension);
|
|
82
|
+
img.alt = text;
|
|
83
|
+
}
|
|
80
84
|
|
|
81
85
|
return img;
|
|
82
86
|
|