@wiris/mathtype-viewer 1.0.0 → 1.1.0

package/src/properties.ts

@@ -1,7 +1,7 @@
 import { configurationJson, StatusError } from './services';
 
 // Helper types for Config below
-type Viewer = 'image' | 'none';
+type Viewer = 'none' | 'image' | 'mathml' | 'latex';
 type Wirispluginperformance = 'true' | 'false';
 
 /**
@@ -41,20 +41,25 @@ const defaultValues: Config = {
 /**
  * This class will handle the parameters defined by the user.
  */
-export abstract class Properties {
+export class Properties {
 
-  static render: () => Promise<void> = async () => {};
+  render: () => Promise<void> = async () => {};
 
-  // Flag for the static parameters that access the backend.
-  private static backendObtained: boolean = false;
+  // Get URL properties (retrocompatibility).
+  config: Config = defaultValues;
 
-  private static waitForBackend() {
-    while (!this.backendObtained);
-  }
+  /**
+   * Do not use this method. Instead, use {@link Properties.generate}.
+   * Constructors cannot be async so we make it private and force instantiation through an alternative static method.
+   */
+  private new() {}
 
-  // Get URL properties (retrocompatibility).
-  static config: Config = defaultValues;
-  static {
+  /**
+   * Creates and sets up a new instance of class Properties
+   */
+  static async generate(): Promise<Properties> {
+
+    const instance = new Properties();
 
     // Get URL parameters from <script>
     const pluginName = 'WIRISplugins.js';
@@ -67,69 +72,58 @@ export abstract class Properties {
       const urlParams = new URLSearchParams(params);
 
       if (urlParams.get('dpi') !== null && urlParams.get('dpi') !== undefined) {
-        this.config.dpi = +urlParams.get('dpi');
+        instance.config.dpi = +urlParams.get('dpi');
       }
       if (urlParams.get('element') !== null && urlParams.get('element') !== undefined) {
-        this.config.element = urlParams.get('element');
+        instance.config.element = urlParams.get('element');
       }
       if (urlParams.get('lang') !== null && urlParams.get('lang') !== undefined) {
-        this.config.lang = urlParams.get('lang');
+        instance.config.lang = urlParams.get('lang');
       }
       if (urlParams.get('viewer') !== null && urlParams.get('viewer') !== undefined) {
-        this.config.viewer = (urlParams.get('viewer') as Viewer);
+        instance.config.viewer = (urlParams.get('viewer') as Viewer);
       }
       if (urlParams.get('zoom') !== null && urlParams.get('zoom') !== undefined) {
-        this.config.zoom = +urlParams.get('zoom');
+        instance.config.zoom = +urlParams.get('zoom');
       }
 
     }
 
     // Get backend parameters calling the configurationjson service
-    (async () => {
-      try {
-        this.config.backendConfig = await configurationJson(
-          ['wirispluginperformance', 'wiriseditormathmlattribute'],
-          Properties.editorServicesRoot,
-          Properties.editorServicesExtension,
-        );
-      } catch(e) {
-        if (e instanceof StatusError) {
-          // Do nothing; leave default values.
-          console.error(e);
-        } else {
-          throw e;
-        }
-      } finally {
-        // Stop looking for the backend (even if the request fails)
-        this.backendObtained = true;
+    try {
+      instance.config.backendConfig = await configurationJson(
+        ['wirispluginperformance', 'wiriseditormathmlattribute'],
+        instance.editorServicesRoot,
+        instance.editorServicesExtension,
+      );
+    } catch(e) {
+      if (e instanceof StatusError) {
+        // Do nothing; leave default values.
+        console.error(e);
+      } else {
+        throw e;
       }
-    })();
-
-  }
+    }
 
-  /**
-   * Set the config values manually.
-   */
-  static init(config: Config) {
-    Properties.config = {...defaultValues, ...config};
+    return instance;
   }
 
-  static get editorServicesRoot(): string {
+  get editorServicesRoot(): string {
     return this.config.editorServicesRoot ||
       defaultValues.editorServicesRoot;
   }
 
-  static set editorServicesRoot(editorServicesRoot: string) {
+  set editorServicesRoot(editorServicesRoot: string) {
     this.config.editorServicesRoot = editorServicesRoot;
     this.render();
   }
 
-  static get editorServicesExtension(): string {
+  get editorServicesExtension(): string {
     return this.config.editorServicesExtension ||
       defaultValues.editorServicesExtension;
   }
 
-  static set editorServicesExtension(editorServicesExtension: string) {
+  set editorServicesExtension(editorServicesExtension: string) {
     this.config.editorServicesExtension = editorServicesExtension;
     this.render();
   }
@@ -143,7 +137,7 @@ export abstract class Properties {
    * - English, by default.
    * @returns {string} Encoded language string.
    */
-  static get lang(): string {
+  get lang(): string {
     const configLang = (this.config.lang === 'inherit') ? null : this.config.lang;
     return configLang ||
       document.getElementsByTagName('html')[0].lang ||
@@ -151,7 +145,7 @@ export abstract class Properties {
       defaultValues.lang;
   }
 
-  static set lang(lang: string) {
+  set lang(lang: string) {
     this.config.lang = lang;
     this.render();
   }
@@ -162,12 +156,12 @@ export abstract class Properties {
    * - The viewer parameter set in the <script> (WIRISplugin.js?viewer=...)
    * - none, by default.
    */
-  static get viewer(): Viewer {
+  get viewer(): Viewer {
     return this.config.viewer ||
       defaultValues.viewer;
   }
 
-  static set viewer(viewer: Viewer) {
+  set viewer(viewer: Viewer) {
     this.config.viewer = viewer;
     this.render();
   }
@@ -178,12 +172,12 @@ export abstract class Properties {
    * - The dpi parameter set in the <script> (WIRISplugin.js?dpi=...)
    * - 96, by default.
    */
-  static get dpi(): number {
+  get dpi(): number {
     return this.config.dpi ||
       defaultValues.dpi;
   }
 
-  static set dpi(dpi: number) {
+  set dpi(dpi: number) {
     this.config.dpi = dpi;
     this.render();
   }
@@ -194,12 +188,12 @@ export abstract class Properties {
    * - The zoom parameter set in the <script> (WIRISplugin.js?zoom=...)
    * - 1, by default.
    */
-  static get zoom(): number {
+  get zoom(): number {
     return this.config.zoom ||
       defaultValues.zoom;
   }
 
-  static set zoom(zoom: number) {
+  set zoom(zoom: number) {
     this.config.zoom = zoom;
     this.render();
   }
@@ -210,12 +204,12 @@ export abstract class Properties {
    * - The zoom parameter set in the <script> (WIRISplugin.js?element=...)
    * - 'body', by default.
    */
-  static get element(): string {
+  get element(): string {
     return this.config.element ||
       defaultValues.element;
   }
 
-  static set element(element: string) {
+  set element(element: string) {
     this.config.element = element;
     this.render();
   }
@@ -226,13 +220,12 @@ export abstract class Properties {
    * - The backend configuration of the parameter.
    * - true, by default.
    */
-  static get wirispluginperformance(): Wirispluginperformance {
-    this.waitForBackend();
+  get wirispluginperformance(): Wirispluginperformance {
     return this.config.backendConfig.wirispluginperformance ||
       defaultValues.backendConfig.wirispluginperformance;
   }
 
-  static set wirispluginperformance(wirispluginperformance: Wirispluginperformance) {
+  set wirispluginperformance(wirispluginperformance: Wirispluginperformance) {
     this.config.backendConfig.wirispluginperformance = wirispluginperformance;
     this.render();
   }
@@ -243,13 +236,12 @@ export abstract class Properties {
    * - The backend configuration of the parameter.
    * - data-mathml, by default.
    */
-  static get wiriseditormathmlattribute(): string {
-    this.waitForBackend();
+  get wiriseditormathmlattribute(): string {
     return this.config.backendConfig.wiriseditormathmlattribute ||
       defaultValues.backendConfig.wiriseditormathmlattribute;
   }
 
-  static set wiriseditormathmlattribute(wiriseditormathmlattribute: string) {
+  set wiriseditormathmlattribute(wiriseditormathmlattribute: string) {
     this.config.backendConfig.wiriseditormathmlattribute = wiriseditormathmlattribute;
     this.render();
   }

package/src/retro.ts

@@ -0,0 +1,255 @@
+import { renderLatex } from "./latex";
+import { renderMathML } from "./mathml";
+import { Properties } from "./properties";
+
+/**
+ * Exposes the {@link JsPluginViewer} singleton instance as window.com.wiris.js.JsPluginViewer.
+ * @param {Properties} properties - Properties of the viewer.
+ * @param {Window} w - Instance of the global window.
+ * @deprecated Consider using {@link renderLatex} or {@link renderMathML}.
+ */
+export function bypassEncapsulation(properties: Properties, w: Window) {
+  const wany = w as any;
+
+  if (typeof wany.com === 'undefined') {
+    wany.com = {};
+  }
+
+  if (typeof wany.com.wiris === 'undefined') {
+    wany.com.wiris = {};
+  }
+
+  if (typeof wany.com.wiris.js === 'undefined') {
+    wany.com.wiris.js = {};
+  }
+
+  if (typeof wany.com.wiris.js.JsPluginViewer === 'undefined') {
+    wany.com.wiris.js.JsPluginViewer = JsPluginViewer.getInstance();
+    JsPluginViewer.properties = properties;
+  }
+}
+
+/**
+ * This class is a compatibility layer with the old Viewer.
+ * See haxe/src-haxe/com/wiris/js/JsPluginViewer.hx in in the repo wiris/plugins previous to commit df1248a.
+ *
+ * WARNING: the methods in this class may contain direct references to globals such as window and document.
+ *
+ * @deprecated Consider using {@link renderLatex} or {@link renderMathML}.
+ */
+class JsPluginViewer {
+  static instance: JsPluginViewer;
+  static properties: Properties;
+
+  static getInstance(): JsPluginViewer {
+    if (JsPluginViewer.instance == null) {
+      JsPluginViewer.instance = new JsPluginViewer();
+    }
+
+    return JsPluginViewer.instance;
+  }
+
+  /**
+   * Render all the formulas written in SafeMathML inside the given element.
+   * @param {HTMLElement} element - Element wherein to render SafeMathML formulas.
+   * @param asynchronously - Currently ignored, only included for retrocompatibility purposes.
+   * @param callbackFunc - Currently ignored, only included for retrocompatibility purposes.
+   * @deprecated There is currently no replacement for rendering SafeMathML formulas.
+   * Please consider using {@link renderLatex} or {@link renderMathML}.
+   */
+  parseSafeMathMLElement(element: HTMLElement, asynchronously?: boolean, callbackFunc?: () => void): void {
+    var mathmlPositions = [];
+    JsPluginViewer.getMathMLPositionsAtElementAndChildren(element, mathmlPositions);
+    for (let i = 0; i < mathmlPositions.length; i++) {
+      var mathmlPosition = mathmlPositions[i];
+      var newNode = document.createElement("math");
+      mathmlPosition.nextElement.parentNode.insertBefore(newNode, mathmlPosition.nextElement);
+      newNode.outerHTML = JsPluginViewer.decodeSafeMathML(mathmlPosition.safeMML);
+    }
+  }
+
+  /**
+   * Render all the formulas in the document.
+   * @param asynchronously - Currently ignored, only included for retrocompatibility purposes.
+   * @param callbackFunc - Currently ignored, only included for retrocompatibility purposes.
+   * @param safeXml - Currently ignored, only included for retrocompatibility purposes.
+   * @deprecated Please consider using {@link renderMathML}.
+   */
+  async parseDocument(asynchronously?: boolean, callbackFunc?: () => void, safeXml?: boolean): Promise<void> {
+    return renderMathML(JsPluginViewer.properties, document.documentElement);
+  }
+
+  /**
+   * Render all the formulas inside the given element.
+   * @param {HTMLElement} element - Element wherein to render formulas.
+   * @param asynchronously - Currently ignored, only included for retrocompatibility purposes.
+   * @param callbackFunc - Currently ignored, only included for retrocompatibility purposes.
+   * @deprecated Please consider using {@link renderMathML}.
+   */
+  async parseElement(element: HTMLElement, asynchronously?: boolean, callbackFunc?: () => void): Promise<void> {
+    return renderMathML(JsPluginViewer.properties, element);
+  }
+
+  /**
+   * Convert all the LaTeX formulas in the document to MathML.
+   * @param asynchronously - Currently ignored, only included for retrocompatibility purposes.
+   * @param callbackFunc - Currently ignored, only included for retrocompatibility purposes.
+   * @deprecated Please consider using {@link renderLatex}.
+   */
+  async parseLatexDocument(asynchronously?: boolean, callbackFunc?: () => void): Promise<void> {
+    return renderLatex(JsPluginViewer.properties, document.documentElement);
+  }
+
+  /**
+   * Convert all the LaTeX formulas inside the given element to MathML.
+   * @param {HTMLElement} element - Element wherein to convert formulas.
+   * @param asynchronously - Currently ignored, only included for retrocompatibility purposes.
+   * @param callbackFunc - Currently ignored, only included for retrocompatibility purposes.
+   * @deprecated Please consider using {@link renderLatex}.
+   */
+  async parseLatexElement(element: HTMLElement, asynchronously?: boolean, callbackFunc?: () => void): Promise<void> {
+    return renderLatex(JsPluginViewer.properties, element);
+  }
+
+  private static decodeSafeMathML(input: string): string {
+    var safeXMLCharactersEntities = JsCharacters.getSafeXMLCharactersEntities();
+    var xmlCharacters = JsCharacters.getXMLCharacters();
+    var safeXMLCharacters = JsCharacters.getSafeXMLCharacters();
+
+    var tagOpenerEntity = safeXMLCharactersEntities.tagOpener;
+    var tagCloserEntity = safeXMLCharactersEntities.tagCloser;
+    var doubleQuoteEntity = safeXMLCharactersEntities.doubleQuote;
+    var realDoubleQuoteEntity = safeXMLCharactersEntities.realDoubleQuote;
+
+
+    // Important to not change function parameter.
+    var inputCopy = input.slice();
+
+    // Decoding entities.
+    inputCopy = inputCopy.split(tagOpenerEntity).join(safeXMLCharacters.tagOpener);
+    inputCopy = inputCopy.split(tagCloserEntity).join(safeXMLCharacters.tagCloser);
+    inputCopy = inputCopy.split(doubleQuoteEntity).join(safeXMLCharacters.doubleQuote);
+    inputCopy = inputCopy.split(realDoubleQuoteEntity).join(safeXMLCharacters.realDoubleQuote);
+
+    var tagOpener = safeXMLCharacters.tagOpener;
+    var tagCloser = safeXMLCharacters.tagCloser;
+    var doubleQuote = safeXMLCharacters.doubleQuote;
+    var realDoubleQuote = safeXMLCharacters.realDoubleQuote;
+    var ampersand = safeXMLCharacters.ampersand;
+    var quote = safeXMLCharacters.quote;
+
+    // Decoding characters.
+    inputCopy = inputCopy.split(tagOpener).join(xmlCharacters.tagOpener);
+    inputCopy = inputCopy.split(tagCloser).join(xmlCharacters.tagCloser);
+    inputCopy = inputCopy.split(doubleQuote).join(xmlCharacters.doubleQuote);
+    inputCopy = inputCopy.split(ampersand).join(xmlCharacters.ampersand);
+    inputCopy = inputCopy.split(quote).join(xmlCharacters.quote);
+
+    // We are replacing $ by & when its part of an entity for retrocompatibility.
+    // Now, the standard is replace § by &.
+    var returnValue = '';
+    var currentEntity = null;
+
+    var i = 0;
+    while (i < inputCopy.length) {
+      var character = inputCopy.charAt(i);
+      if (currentEntity == null) {
+        if (character == '$') {
+          currentEntity = '';
+        } else {
+          returnValue += character;
+        }
+      } else if (character == ';') {
+        returnValue += '&' + currentEntity;
+        currentEntity = null;
+      } else if (character.match(/([a-zA-Z0-9#._-] | '-')/)) { // Character is part of an entity.
+        currentEntity += character;
+      } else {
+        returnValue += '$' + 'currentEntity'; // Is not an entity.
+        currentEntity = null;
+        i -= 1; // Parse again the current character.
+      }
+      i++;
+    }
+
+    return returnValue;
+  }
+
+  private static getMathMLPositionsAtElementAndChildren(element: Node, mathmlPositions) {
+    JsPluginViewer.getMathMLPositionsAtNode(element, mathmlPositions);
+    // Copy current children because DOM will be changed and element.childNodes won't be
+    // consistent on call getMathMLPositionsAtElementAndChildren().
+    var childNodes = Array.from(element.childNodes);
+    if (childNodes.length > 0) {
+      for (let i = 0; i < childNodes.length; i++) {
+        var child = childNodes[i];
+        JsPluginViewer.getMathMLPositionsAtElementAndChildren(child, mathmlPositions);
+      }
+    }
+  }
+
+  private static getMathMLPositionsAtNode(node: Node, mathmlPositions) {
+    var safeXMLCharacters = JsCharacters.getSafeXMLCharacters();
+    if(node.nodeType == 3) {
+      var startMathmlTag = safeXMLCharacters.tagOpener + "math";
+      var endMathmlTag = safeXMLCharacters.tagOpener + "/math" + safeXMLCharacters.tagCloser;
+      var start = node.textContent.indexOf(startMathmlTag);
+      var end = 0;
+      while(start != -1) {
+        end = node.textContent.indexOf(endMathmlTag,start + startMathmlTag.length);
+
+        if(end == -1) break;
+
+        var nextMathML = node.textContent.indexOf(startMathmlTag,end + endMathmlTag.length);
+
+        if(nextMathML >= 0 && end > nextMathML) break;
+
+        var safeMathml = node.textContent.substring(start,end + endMathmlTag.length);
+
+        node.textContent = node.textContent.substring(0,start) + node.textContent.substring(end + endMathmlTag.length);
+        node = (node as Text).splitText(start);
+        start = node.textContent.indexOf(startMathmlTag);
+
+        mathmlPositions.push({
+          safeMML: safeMathml,
+          nextElement: node
+        });
+      }
+    }
+  }
+
+}
+
+class JsCharacters {
+  static getSafeXMLCharactersEntities(): any {
+    return {
+      tagOpener: '&laquo;',
+      tagCloser: '&raquo;',
+      doubleQuote: '&uml;',
+      realDoubleQuote: '&quot;',
+    };
+  }
+
+  static getXMLCharacters(): any {
+    return {
+      id: 'xmlCharacters',
+      tagOpener: '<', // Hex: \x3C.
+      tagCloser: '>', // Hex: \x3E.
+      doubleQuote: '"', // Hex: \x22.
+      ampersand: '&', // Hex: \x26.
+      quote: '\'', // Hex: \x27.
+    };
+  }
+
+  static getSafeXMLCharacters(): any {
+    return {
+      id: 'safeXmlCharacters',
+      tagOpener: '«', // Hex: \xAB.
+      tagCloser: '»', // Hex: \xBB.
+      doubleQuote: '¨', // Hex: \xA8.
+      ampersand: '§', // Hex: \xA7.
+      quote: '`', // Hex: \x60.
+      realDoubleQuote: '¨',
+    };
+  }
+}

package/src/utils.ts

@@ -0,0 +1,45 @@
+/**
+ * Takes a string possibly containing encoded entities (e.g.    ) and
+ * returns the same string with these replaced by the UTF-8 characters they represent
+ * @param {string} text - the string with encoded entities
+ * @returns the same string with the entities decoded
+ */
+function decodeEntities(text: string): string {
+  const element = document.createElement('textarea');
+  element.innerHTML = text;
+  return element.value;
+}
+
+/**
+ * Takes a string possibly containing encoded named HTML entities (e.g.  ) and
+ * returns the same string with these replaced by the encoding that uses numbers (e.g.  ).
+ * By its implementation, this method also possibly encodes special characters that were
+ * previously unencoded.
+ * @param {string} text - the string with encoded entities
+ * @returns the same string with the entities decoded
+ */
+export function htmlEntitiesToXmlEntities(text: string): string {
+  text = decodeEntities(text);
+
+  // Replaces the < & > characters to its HTMLEntity to avoid render issues.
+  text = text.split('"<"').join('"&lt;"')
+    .split('">"')
+    .join('"&gt;"')
+    .split('><<')
+    .join('>&lt;<');
+
+  let result = '';
+  for (let i = 0; i < text.length; i++) {
+    const character = text.charAt(i);
+    if (text.charCodeAt(i) > 128) {
+      result += '&#' + text.charCodeAt(i) + ';';
+    } else {
+      result += character;
+    }
+  }
+  return result;
+}
+
+// Set of mathml and characters which don't have an accessible text associated
+// and can not be translated or transformed to LaTeX.
+export const corruptMathML = ['⟦', '&#10214;', '⟧', '&#10215;', 'mscarries', 'mscarry', 'msgroup', 'mstack', 'msline', 'msrow'];

package/typings/module-name.d.ts

@@ -0,0 +1,2 @@
+declare module "Parser";
+declare module '@wiris/mathtype-html-integration-devkit/src/parser';