├── .editorconfig ├── .eslintignore ├── .eslintrc.js ├── .github ├── CODEOWNERS ├── ISSUE_TEMPLATE │ └── bug-report.md ├── config.yml ├── dependabot.yml ├── pull_request_template.md └── workflows │ ├── cypress-Run-tests-with-npm-packages.yml │ ├── deploy-staging.yml │ ├── dismantle-staging.yml │ ├── jsdoc.yml │ ├── publish-wordpress.yml │ ├── publish.yml │ └── staging-cleanup.yml ├── .gitignore ├── .htmlvalidate.js ├── .htmlvalidateignore ├── .linkcheckerrc ├── .prettierrc ├── .vscode ├── extensions.json └── settings.json ├── CHANGES.md ├── LICENSE ├── README.md ├── babel.config.js ├── cypress.json ├── cypress ├── README.md ├── YYY-ZZZ.category.js ├── fixtures │ └── formulas.json ├── mathtype-web-app.png ├── modal.jpg ├── plugins │ └── index.js ├── support │ ├── commands.d.ts │ ├── commands.js │ ├── index.js │ ├── utils.js │ ├── validations.d.ts │ └── validations.js └── tests │ ├── e2e │ ├── STD-018.insertion.js │ ├── STD-026.modal.js │ └── STD-028.modal.js │ ├── sandbox │ └── .gitkeep │ ├── smoke │ ├── .gitkeep │ ├── STD-001.insertion.js │ ├── STD-002.insertion.js │ ├── STD-003.insertion.js │ ├── STD-004.images.js │ ├── STD-005.images.js │ ├── STD-007.images.js │ ├── STD-010.images.js │ ├── STD-011.modal.js │ ├── STD-012.modal.js │ ├── STD-014.insertion.js │ ├── STD-016.insertion.js │ ├── STD-017.insertion.js │ ├── STD-019.insertion.js │ ├── STD-020.modal.js │ ├── STD-021.modal.js │ ├── STD-022.modal.js │ └── STD-023.modal.js │ ├── ui │ └── .gitkeep │ └── validation │ └── .gitkeep ├── demos ├── html │ ├── ckeditor4 │ │ ├── babel.config.js │ │ ├── index.html │ │ ├── package.json │ │ ├── project.json │ │ ├── src │ │ │ ├── app.js │ │ │ └── static │ │ │ │ └── style.css │ │ └── webpack.config.js │ ├── ckeditor5 │ │ ├── babel.config.js │ │ ├── index.html │ │ ├── package.json │ │ ├── project.json │ │ ├── src │ │ │ ├── app.js │ │ │ └── static │ │ │ │ └── style.css │ │ └── webpack.config.js │ ├── froala │ │ ├── babel.config.js │ │ ├── index.html │ │ ├── package.json │ │ ├── project.json │ │ ├── src │ │ │ ├── app.js │ │ │ └── static │ │ │ │ └── style.css │ │ └── webpack.config.js │ ├── generic │ │ ├── babel.config.js │ │ ├── index.html │ │ ├── package.json │ │ ├── project.json │ │ ├── src │ │ │ ├── app.js │ │ │ └── static │ │ │ │ └── style.css │ │ └── webpack.config.js │ ├── tinymce5 │ │ ├── babel.config.js │ │ ├── index.html │ │ ├── package.json │ │ ├── project.json │ │ ├── src │ │ │ ├── app.js │ │ │ └── static │ │ │ │ └── style.css │ │ └── webpack.config.js │ ├── tinymce6 │ │ ├── babel.config.js │ │ ├── index.html │ │ ├── package.json │ │ ├── project.json │ │ ├── src │ │ │ ├── app.js │ │ │ └── static │ │ │ │ └── style.css │ │ └── webpack.config.js │ ├── tinymce7 │ │ ├── babel.config.js │ │ ├── index.html │ │ ├── package.json │ │ ├── project.json │ │ ├── src │ │ │ ├── app.js │ │ │ └── static │ │ │ │ └── style.css │ │ └── webpack.config.js │ └── viewer │ │ ├── index.html │ │ ├── package.json │ │ ├── project.json │ │ ├── src │ │ ├── app.js │ │ └── static │ │ │ └── style.css │ │ └── webpack.config.js └── vue │ └── ckeditor5 │ ├── .gitignore │ ├── README.md │ ├── env.d.ts │ ├── index.html │ ├── package.json │ ├── project.json │ ├── public │ └── favicon.ico │ ├── src │ ├── App.vue │ ├── assets │ │ └── css │ │ │ └── main.css │ └── main.ts │ ├── tsconfig.app.json │ ├── tsconfig.json │ ├── tsconfig.node.json │ └── vite.config.ts ├── docs ├── README.md ├── adr │ ├── 000-template.md │ ├── 001-Generate--RFC-compliant--UUIDs--Telemetry.md │ ├── 002-Longevity--senderId--sessionId--Telemetry.md │ ├── 003--use-shx-wrapper-for-shell-commands.md │ ├── 004-Support-for-Froala editor-major-versions.md │ ├── 005-Use-HTML-sanitizer-to-avoid-XSS-attacks.md │ ├── 006-use-expect-for-automating-tui-interaction.md │ └── 007-use-verdaccio-for-emulating-publishing-npm-packages.md ├── code-of-conduct │ └── README.md ├── contributing │ └── README.md ├── demos │ └── README.md ├── development │ ├── README.md │ ├── cicd │ │ └── README.md │ ├── compiling │ │ └── README.md │ ├── demos │ │ └── README.md │ ├── linting │ │ └── README.md │ ├── packaging │ │ └── README.md │ ├── testing │ │ └── README.md │ └── vscode │ │ ├── extensions.md │ │ └── settings.md ├── img │ ├── mathtype_logo.png │ └── wiris_plugin_example.png └── integration │ └── README.md ├── nx.json ├── package.json ├── packages ├── ckeditor4 │ ├── .gitignore │ ├── README.md │ ├── global.js │ ├── icons │ │ ├── cas.png │ │ ├── chem.png │ │ └── formula.png │ ├── package.json │ ├── plugin.src.js │ ├── project.json │ └── webpack.config.js ├── ckeditor5 │ ├── .gitignore │ ├── README.md │ ├── babel.config.js │ ├── dist │ │ ├── browser │ │ │ ├── index-content.css │ │ │ ├── index-editor.css │ │ │ ├── index.css │ │ │ ├── index.css.map │ │ │ ├── index.js │ │ │ ├── index.js.map │ │ │ ├── index.umd.js │ │ │ ├── index.umd.js.map │ │ │ └── telemeter_wasm_bg.wasm │ │ ├── index-content.css │ │ ├── index-editor.css │ │ ├── index.css │ │ ├── index.js │ │ └── index.js.map │ ├── package.json │ ├── project.json │ ├── scripts │ │ └── build-dist.mjs │ ├── src │ │ ├── commands.js │ │ ├── index.js │ │ ├── integration.js │ │ └── plugin.js │ └── theme │ │ └── icons │ │ ├── ckeditor5-chem.svg │ │ └── ckeditor5-formula.svg ├── devkit │ ├── .gitignore │ ├── .travis.yml │ ├── 282832d592f11e2b464c.wasm │ ├── README.md │ ├── babel.config.js │ ├── doc │ │ ├── changelog.md │ │ ├── conf.json │ │ ├── frameworks │ │ │ └── AngularJS │ │ │ │ ├── ckeditor │ │ │ │ └── ckeditor4.md │ │ │ │ ├── froala │ │ │ │ └── froala-2_9_5.md │ │ │ │ └── tinymce │ │ │ │ └── tinymce5.md │ │ └── src │ │ │ ├── conf.json │ │ │ ├── data.md │ │ │ ├── getting_started.md │ │ │ ├── htmleditors │ │ │ └── tinymce5 │ │ │ │ └── menu_item.md │ │ │ ├── readme.md │ │ │ ├── services.md │ │ │ ├── services_ckeditor4.md │ │ │ ├── services_ckeditor5.md │ │ │ ├── services_froala.md │ │ │ ├── services_generic.md │ │ │ └── services_tinymce.md │ ├── lang │ │ └── strings.json │ ├── package.json │ ├── project.json │ ├── scripts │ │ └── deploy │ │ │ └── moodle.sh │ ├── src │ │ ├── accessibility.js │ │ ├── backwardslib.js │ │ ├── configuration.js │ │ ├── constants.js │ │ ├── contentmanager.js │ │ ├── core.src.js │ │ ├── customeditors.js │ │ ├── editorlistener.js │ │ ├── event.js │ │ ├── global.js │ │ ├── image.js │ │ ├── integrationmodel.js │ │ ├── jsvariables.js │ │ ├── latex.js │ │ ├── listeners.js │ │ ├── mathml.js │ │ ├── md5.js │ │ ├── modal.js │ │ ├── parser.js │ │ ├── polyfills.js │ │ ├── popupmessage.js │ │ ├── serviceprovider.js │ │ ├── stringmanager.js │ │ ├── telemeter.js │ │ ├── test.js │ │ ├── textcache.js │ │ └── util.js │ ├── styles │ │ ├── icons │ │ │ ├── general │ │ │ │ ├── close_icon.svg │ │ │ │ ├── fulls_icon.svg │ │ │ │ ├── max_icon.svg │ │ │ │ ├── min_icon.svg │ │ │ │ ├── mins_icon.svg │ │ │ │ └── warn_icon.svg │ │ │ └── hover │ │ │ │ ├── close_icon_h.svg │ │ │ │ ├── fulls_icon_h.svg │ │ │ │ ├── max_icon_h.svg │ │ │ │ ├── min_icon_h.svg │ │ │ │ └── mins_icon_h.svg │ │ └── styles.css │ ├── telemeter-wasm │ │ ├── package.json │ │ ├── telemeter_wasm.d.ts │ │ ├── telemeter_wasm.js │ │ └── telemeter_wasm_bg.wasm │ ├── test │ │ ├── const.js │ │ └── mathml.test.js │ └── webpack.config.js ├── froala │ ├── .gitignore │ ├── README.md │ ├── global.js │ ├── icons │ │ ├── chem.png │ │ ├── css │ │ │ └── wirisplugin.css │ │ ├── font │ │ │ ├── wirisplugin.eot │ │ │ ├── wirisplugin.svg │ │ │ ├── wirisplugin.ttf │ │ │ ├── wirisplugin.woff │ │ │ └── wirisplugin.woff2 │ │ └── formula.png │ ├── package.json │ ├── project.json │ ├── webpack.config.js │ └── wiris.src.js ├── generic │ ├── .esdoc.json │ ├── .gitignore │ ├── README.md │ ├── data.md │ ├── documentation.md │ ├── getting_started.md │ ├── global.js │ ├── icons │ │ ├── cas.png │ │ ├── chem.png │ │ └── formula.png │ ├── package.json │ ├── project.json │ ├── services.md │ ├── styles.css │ ├── webpack.config.js │ └── wirisplugin-generic.src.js ├── res │ ├── README.md │ ├── demos │ │ ├── common.js │ │ ├── design.css │ │ ├── imports.js │ │ ├── index.html │ │ └── vite-imports.js │ ├── git-data.mjs │ ├── package.json │ └── webpack.config.js ├── tinymce5 │ ├── .gitignore │ ├── .npmignore │ ├── README.md │ ├── editor_plugin.src.js │ ├── global.js │ ├── package.json │ ├── project.json │ └── webpack.config.js ├── tinymce6 │ ├── .gitignore │ ├── README.md │ ├── editor_plugin.src.js │ ├── global.js │ ├── package.json │ ├── plugin.min.js.map │ ├── project.json │ └── webpack.config.js ├── tinymce7 │ ├── .gitignore │ ├── README.md │ ├── editor_plugin.src.js │ ├── global.js │ ├── package.json │ ├── plugin.min.js.map │ ├── project.json │ └── webpack.config.js ├── viewer │ ├── README.md │ ├── babel.config.js │ ├── docs │ │ └── spec.md │ ├── index.html │ ├── jest.config.js │ ├── package.json │ ├── project.json │ ├── src │ │ ├── app.ts │ │ ├── latex.ts │ │ ├── mathml.spec.ts │ │ ├── mathml.ts │ │ ├── properties.ts │ │ ├── retro.ts │ │ └── services.ts │ ├── tsconfig.json │ ├── typings │ │ └── module-name.d.ts │ └── webpack.config.js └── wordpress │ ├── .gitignore │ ├── README.md │ ├── VERSION │ ├── bin │ └── mathtype-wordpress-docker-start │ ├── docker-compose.yml │ ├── docker │ ├── Dockerfile │ └── apache2-foreground-custom │ ├── docs │ ├── build-backend │ │ └── README.md │ ├── build-plugin │ │ └── README.md │ ├── deploy │ │ └── README.md │ └── user-guide │ │ └── README.md │ ├── package.json │ ├── project.json │ ├── resources │ ├── database │ │ └── backup.sql │ └── functions.php │ ├── src │ ├── icons │ │ ├── cas.png │ │ ├── chem.png │ │ ├── formula.png │ │ └── tinymce3 │ │ │ ├── cas.png │ │ │ ├── chem.png │ │ │ └── formula.png │ └── tiny_mce_wiris.php │ └── webpack.config.js ├── scripts ├── createEnvFile.js ├── installCK5windows.js ├── publish.mjs └── services │ ├── executeTests.js │ └── paths.json ├── staging ├── branch │ ├── html │ │ └── index.html │ └── index.html └── root │ ├── index.html │ └── styles.css ├── terraform ├── .terraform.lock.hcl ├── aws.tf ├── backend.staging.conf ├── integrations.staging.tfvars └── variables.tf ├── tsconfig.app.json ├── tsconfig.base.json └── tsconfig.json /.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | **/dist/ 3 | webpack.config.js 4 | **/e2e/ 5 | output/** 6 | packages/generic/wirisplugin-generic.js 7 | packages/tinymce5/plugin.min.js 8 | packages/tinymce6/plugin.min.js 9 | packages/tinymce7/plugin.min.js 10 | packages/froala/wiris.js 11 | packages/ckeditor4/plugin.js 12 | packages/tinymce/editor_plugin.src.js 13 | packages/devkit/doc/templates/** 14 | packages/devkit/out/** 15 | packages/devkit/core.js 16 | packages/devkit/telemeter-wasm/** 17 | -------------------------------------------------------------------------------- /.github/CODEOWNERS: -------------------------------------------------------------------------------- 1 | # WIRIS INTEGRATIONS TEAM 2 | * @carla-at-wiris @jgonzalez-at-wiris @usantos-at-wiris @xjiang-at-wiris @ncornaglia-at-wiris 3 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/bug-report.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: "Bug report" 3 | about: "Report a bug that you have found in MathType Web." 4 | title: "" 5 | labels: type:bug 6 | assignees: "" 7 | --- 8 | 9 | ## Description 10 | 11 | _What does the bug consist in?_ 12 | 13 | ## Environment 14 | 15 | _Which version of MathType does this happen in?_ 16 | 17 | _What is the relevant software and their versions?_ 18 | 19 | - _Editor (CKEditor, Froala, TinyMCE, etc.)_ 20 | - _Framework (Angular, React, etc.)_ 21 | - _Browser (Chrome, Firefox, etc.)_ 22 | - _Operating System (Windows, macOS, Ubuntu, etc.)_ 23 | 24 | ## Steps to reproduce 25 | 26 | _What are the steps needed to reproduce the bug?_ 27 | _Please be specific._ 28 | 29 | ## Expected result 30 | 31 | _What is the expected outcome of the steps above?_ 32 | 33 | ## Actual result 34 | 35 | _What is the actual outcome of the steps above?_ 36 | 37 | ## Other details 38 | 39 | _Is there anything else to consider?_ 40 | -------------------------------------------------------------------------------- /.github/config.yml: -------------------------------------------------------------------------------- 1 | blank_issues_enabled: true 2 | contact_links: 3 | - name: Wiris Support 4 | url: mailto:support@wiris.com 5 | about: You can contact our Support team instead of opening an issue here. 6 | -------------------------------------------------------------------------------- /.github/dependabot.yml: -------------------------------------------------------------------------------- 1 | version: 2 2 | updates: 3 | - package-ecosystem: "npm" 4 | directory: "/" 5 | schedule: 6 | interval: "weekly" 7 | target-branch: "master" 8 | versioning-strategy: increase # Stategy that'll increase the version number in package.json instead of the package-lock.json 9 | reviewers: 10 | - "wiris/integrations" 11 | commit-message: 12 | prefix: "npm prod" # Prefix to PR title in updating dependencies 13 | prefix-development: "npm dev" # Prefix to PR title in updating devDependencies 14 | include: "scope" # It'll include all the reviews and changes proposal 15 | labels: 16 | - "type:dependencies" 17 | ignore: 18 | - dependency-name: "@ckeditor/ckeditor5-core" 19 | - dependency-name: "@ckeditor/ckeditor5-engine" 20 | - dependency-name: "@ckeditor/ckeditor5-widget" 21 | - dependency-name: "@ckeditor/ckeditor5-ui" 22 | - dependency-name: "@ckeditor/ckeditor5-alignment" 23 | - dependency-name: "@ckeditor/ckeditor5-basic-styles" 24 | - dependency-name: "@ckeditor/ckeditor5-editor-classic" 25 | - dependency-name: "@ckeditor/ckeditor5-essentials" 26 | - dependency-name: "@ckeditor/ckeditor5-paragraph" 27 | - dependency-name: "@ckeditor/ckeditor5-theme-lark" 28 | -------------------------------------------------------------------------------- /.github/pull_request_template.md: -------------------------------------------------------------------------------- 1 | ## Description 2 | 3 | > Please include a summary of the changes and the related issue. Please also include relevant motivation and context. List any dependencies that are required for this change. Include, if necessary, a description of the proposed solution and the reasoning behind it. 4 | 5 | - **Related Kanbanize Card:** [Link to KB-X](https://wiris.kanbanize.com/ctrl_board/2/cards/X/details/) 6 | - **Related GitHub Issue:** Closes #X (_Associated GitHub issue, if any_) 7 | 8 | ## Type of Change 9 | 10 | > Please delete options that are not relevant. 11 | 12 | - [ ] Feature (non-breaking change which adds functionality) 13 | - [ ] Bug fix (non-breaking change which fixes an issue) 14 | - [ ] Chore (non-breaking change that doesn't add any functionality) 15 | - [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected) 16 | - [ ] Documentation update (changes to documentation only) 17 | - [ ] Refactoring (non-breaking change that improves the code structure) 18 | 19 | ## Checklist 20 | 21 | - [ ] My code follows the style guidelines of this project ( Run `yarn lint` to check) 22 | - [ ] I have commented my code, particularly in hard-to-understand areas 23 | - [ ] I have made corresponding changes to the documentation (if applicable) 24 | - [ ] My changes generate no new warnings or errors 25 | - [ ] I have added tests that prove my fix is effective or that my feature works (if applicable) 26 | - [ ] New and existing unit tests pass locally with my changes 27 | 28 | ## How should be tested? (Manual or Automated Tests) 29 | 30 | > Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce,also list any relevant details for your test configuration. 31 | 32 | - **Manual tests:** I have tested this changes manually. 33 | -------------------------------------------------------------------------------- /.github/workflows/publish-wordpress.yml: -------------------------------------------------------------------------------- 1 | # Publishes the MathType integrations WordPress packages to AWS S3 2 | # 3 | # Jobs: 4 | # - Publish Wordpress 5 | # 6 | name: Publish WordPress 7 | 8 | # Controls when the action will run 9 | on: 10 | workflow_dispatch: 11 | inputs: 12 | publish_aws: 13 | description: | 14 | Whether to publish the generated artifacts to S3. 15 | Type `publish_aws` to do publish to S3, any other value otherwise. 16 | required: false 17 | default: "" 18 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | ## Integrations team 2 | 3 | # Reports for the jest tests 4 | **test-report.html 5 | 6 | # Exclude package-lock.json from the repo 7 | package-lock.json 8 | packages/*/yarn.lock 9 | 10 | # Cypress 11 | cypress/screenshots 12 | cypress/videos 13 | 14 | node_modules 15 | 16 | # Verdaccio 17 | /resources/publish/storage 18 | 19 | ## Generated by Nx 20 | .nx 21 | 22 | # compiled output 23 | dist 24 | /tmp 25 | /out-tsc 26 | !packages/ckeditor5/dist/ 27 | 28 | # dependencies 29 | /node_modules 30 | 31 | # IDEs and editors 32 | /.idea 33 | .project 34 | .classpath 35 | .c9/ 36 | *.launch 37 | .settings/ 38 | *.sublime-workspace 39 | 40 | # IDE - VSCode 41 | .vscode/* 42 | !.vscode/settings.json 43 | !.vscode/tasks.json 44 | !.vscode/launch.json 45 | !.vscode/extensions.json 46 | 47 | # misc 48 | /.sass-cache 49 | /connect.lock 50 | /coverage 51 | /libpeerconnection.log 52 | npm-debug.log 53 | yarn-error.log 54 | testem.log 55 | /typings 56 | 57 | # System Files 58 | .DS_Store 59 | Thumbs.db 60 | 61 | # Terraform files 62 | .terraformrc 63 | terraform.rc 64 | **/.terraform/* 65 | *.tfstate 66 | *.tfstate.* 67 | *.log 68 | 69 | app.*.json 70 | app.*.js 71 | 72 | **/environments/environment.prod.ts 73 | **/git-data.json 74 | .env 75 | 76 | # Ignores all .hot-update.js files 77 | **.hot-update.js 78 | 79 | # Ignore yarn.lock 80 | yarn.lock 81 | 82 | -------------------------------------------------------------------------------- /.htmlvalidate.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: ["htmlvalidate:recommended"], 3 | 4 | rules: { 5 | // Throws error if the closure is bad: wrong order, not closed, closed but 6 | // not initialyzed, etc. 7 | "close-order": "error", 8 | // Disables having some elements to be stricted with the closure for react html. 9 | // TODO: Study a better wat to do it in react apps and delete the rule. 10 | "void-style": "off", 11 | }, 12 | }; 13 | -------------------------------------------------------------------------------- /.htmlvalidateignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | packages/mathtype-html-integration-devkit/out/** -------------------------------------------------------------------------------- /.linkcheckerrc: -------------------------------------------------------------------------------- 1 | { 2 | "javadoc": true, 3 | "url-ignore": [ 4 | "github.com\/", 5 | ".html*#line", 6 | "api.html#DeviceProperties", 7 | "api.html#CoreProperties", 8 | "api.html#Listener", 9 | "api.html#EditionProperties", 10 | "api.html#IntegrationEnvironment", 11 | "api.html#ServiceProviderProperties", 12 | "api.html#ReturnObject", 13 | "api.html#CustomEditor", 14 | "api.html#IntegrationModelProperties" 15 | ] 16 | } -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "singleQuote": false, 3 | "tabWidth": 2, 4 | "printWidth": 120 5 | } 6 | -------------------------------------------------------------------------------- /.vscode/extensions.json: -------------------------------------------------------------------------------- 1 | { 2 | "recommendations": [ 3 | // LINTERS 4 | "dbaeumer.vscode-eslint", // ESLint 5 | "sonarsource.sonarlint-vscode", // SonarLint 6 | "davidanson.vscode-markdownlint", // Markdownlint 7 | 8 | // FORMATERS 9 | "esbenp.prettier-vscode", // Prettier 10 | 11 | // COMMENTS - COMMITS - TEXT 12 | "aaron-bond.better-comments", // Better Comments 13 | "vivaxy.vscode-conventional-commits", // Conventional Commits 14 | "streetsidesoftware.code-spell-checker", // Code Spell Checker 15 | 16 | // UTILITIES 17 | "usernamehw.errorlens", // ErrorLens 18 | "wallabyjs.console-ninja", // Console Ninja 19 | "ms-azuretools.vscode-docker", // Docker 20 | "ms-vsliveshare.vsliveshare", // Live Share 21 | "visualstudioexptteam.vscodeintellicode", // IntelliCode 22 | "thundergang.thunder-client", // Thunder Client 23 | 24 | // GITHUB 25 | "eamodio.gitlens", // GitLens 26 | "github.vscode-github-actions" // GitHub Actions 27 | ] 28 | } 29 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License 2 | 3 | Copyright (c) 2010-2020 WIRIS, http://www.wiris.com 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in 13 | all copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 21 | THE SOFTWARE. 22 | -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | [ 4 | "@babel/preset-env", 5 | { 6 | targets: { 7 | node: "current", 8 | }, 9 | }, 10 | ], 11 | ], 12 | }; 13 | -------------------------------------------------------------------------------- /cypress.json: -------------------------------------------------------------------------------- 1 | { 2 | "integrationFolder": "cypress/tests", 3 | "screenshotOnRunFailure": true, 4 | "env": { 5 | "FAIL_FAST_STRATEGY": "run", 6 | "FAIL_FAST_ENABLED": true 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /cypress/YYY-ZZZ.category.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: {Test.ID} Ex. INT-STD-014 4 | // Title: {Test.Title} Ex. User creates a new formula from scratch using MathType. 5 | // Document: {Test.URL} Ex. https://docs.google.com/document/d/1fiGsUwqNIsjiaJI0aGfH_aNX5OJKEHkfWtfvlQkEEFI/edit 6 | // Context: {Test.Type} - {Text.category} Ex. UI - Formula insertion/edition 7 | // Issue: {Test.Issue} Ex. KB-99999 8 | // *********************************************************** 9 | 10 | describe("Formula insertion/edition", () => { 11 | beforeEach(() => { 12 | // Load fixture data 13 | cy.fixture("formulas.json").as("formulas"); 14 | // and visit page. 15 | cy.visit("/"); 16 | // Eventually, clear the editor content: by default the editor could include a mathematical expression. 17 | cy.getTextEditor().clear(); 18 | }); 19 | 20 | it("User creates a new formula from scratch using MathType", function () { 21 | // Open a new MathType modal window clicking the button 22 | cy.clickButtonToOpenModal(); 23 | // then type a general formula inside the editor 24 | cy.typeInModal(this.formulas["formula-general"]); 25 | // and insert the formula at the beginning of the target element using the 'Insert' button. 26 | cy.clickModalButton("insert"); 27 | 28 | // Check the recently inserted formula 29 | // and validate is rendered succesfully using MathType services. 30 | cy.getFormula(0).isRendered(); 31 | }); 32 | }); 33 | -------------------------------------------------------------------------------- /cypress/fixtures/formulas.json: -------------------------------------------------------------------------------- 1 | { 2 | "formula-general": "x + y", 3 | "formula-general-alt-en": "x space plus space y", 4 | "formula-general-alt-es": "x espacio más espacio y", 5 | "formula-addition": " = z", 6 | "formula-total-alt-es": "x espacio más espacio y espacio igual espacio z", 7 | "text-alignment": "2222", 8 | "formula-alignment": "2+2", 9 | "latex-general": "$$\\cos^2(x)+\\sin^2(x)$$", 10 | "latex-general-alt-en": "cos squared left parenthesis x right parenthesis plus sin squared left parenthesis x right parenthesis", 11 | "latex-addition": "=log(e)", 12 | "quadratic": "x=-b±b2-4ac2a", 13 | "quadratic-accessible-en": "x equals fraction numerator negative b plus-or-minus square root of b squared minus 4 a c end root over denominator 2 a end fraction", 14 | "formula-drawn": [ 15 | { "x": 0, "y": 0 }, 16 | { "x": 0, "y": 1 }, 17 | { "x": 1, "y": 0 }, 18 | { "x": 1, "y": 1 } 19 | ] 20 | } 21 | -------------------------------------------------------------------------------- /cypress/mathtype-web-app.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/cypress/mathtype-web-app.png -------------------------------------------------------------------------------- /cypress/modal.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/cypress/modal.jpg -------------------------------------------------------------------------------- /cypress/plugins/index.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // This example plugins/index.js can be used to load plugins 4 | // 5 | // You can change the location of this file or turn off loading 6 | // the plugins file with the 'pluginsFile' configuration option. 7 | // 8 | // You can read more here: 9 | // https://on.cypress.io/plugins-guide 10 | // *********************************************************** 11 | 12 | // This function is called when a project is opened or re-opened (e.g. due to 13 | // the project's config changing) 14 | 15 | /** 16 | * @type {Cypress.PluginConfig} 17 | */ 18 | module.exports = (on, config) => { 19 | // `on` is used to hook into various events Cypress emits 20 | // `config` is the resolved Cypress config 21 | // eslint-disable-next-line global-require 22 | require("cypress-fail-fast/plugin")(on, config); 23 | return config; 24 | }; 25 | -------------------------------------------------------------------------------- /cypress/support/index.js: -------------------------------------------------------------------------------- 1 | // *********************************************************** 2 | // This example support/index.js is processed and 3 | // loaded automatically before your test files. 4 | // 5 | // This is a great place to put global configuration and 6 | // behavior that modifies Cypress. 7 | // 8 | // You can change the location of this file or turn off 9 | // automatically serving support files with the 10 | // 'supportFile' configuration option. 11 | // 12 | // You can read more here: 13 | // https://on.cypress.io/configuration 14 | // *********************************************************** 15 | 16 | // Import commands.js using ES2015 syntax: 17 | import "./commands"; 18 | import "./validations"; 19 | import "cypress-fail-fast"; 20 | 21 | // Alternatively you can use CommonJS syntax: 22 | // require('./commands') 23 | -------------------------------------------------------------------------------- /cypress/support/utils.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Create a selection in the document in the given field, at the given start and end positions. 3 | * @param field DOM element to make the selection in 4 | * @param start index of the character to start the selecion in 5 | * @param end index of the character to end the selection in 6 | */ 7 | function createSelection(field, start, end) { 8 | const el = field[0]; 9 | const document = el.ownerDocument; 10 | const range = document.createRange(); 11 | range.selectNodeContents(el); 12 | document.getSelection().removeAllRanges(range); 13 | if (start) range.setStart(el.firstChild, start); 14 | if (end) range.setEnd(el.firstChild, end); 15 | document.getSelection().addRange(range); 16 | } 17 | 18 | // eslint-disable-next-line import/prefer-default-export 19 | export { createSelection }; 20 | -------------------------------------------------------------------------------- /cypress/support/validations.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | 3 | declare namespace Cypress { 4 | interface Chainable { 5 | /** 6 | * Validate that the height of the given formula and the surrounding text is the same. 7 | * Must be applied to a father command. 8 | * @param subject the formula to apply this validation to 9 | * @param preview {default = false} whether to check aligment on the preview or on the text editor 10 | */ 11 | isAligned(subject: Element, preview?: boolean): Chainable; 12 | 13 | /** 14 | * Check that the given formula is rendered in the preview mode or the text editor area. 15 | * Must be applied to a father command. 16 | * @param subject the formula to apply this validation to 17 | * @param preview {default = false} whether to check aligment on the preview or on the text editor 18 | */ 19 | isRendered(subject: Element, preview?: boolean): Chainable; 20 | 21 | /** 22 | * Validates that Hand mode is activated. 23 | */ 24 | isHandModeOn(); 25 | 26 | /** 27 | * Validates that the ChemType modal is open. 28 | */ 29 | isChemTypeOn(); 30 | 31 | /** 32 | * Check that the text inside the modal matches the given text string. 33 | * @param text the text to match the modal content against 34 | */ 35 | modalTextEquals(text: string); 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /cypress/support/validations.js: -------------------------------------------------------------------------------- 1 | // eslint-disable-next-line no-unused-vars 2 | Cypress.Commands.add("isRendered", { prevSubject: "element" }, (subject, preview = false) => { 3 | cy.wrap(subject).should("be.visible"); 4 | }); 5 | -------------------------------------------------------------------------------- /cypress/tests/e2e/STD-018.insertion.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-018 4 | // Title: User writes a latex formula and visualizes it on preview. 5 | // Document: https://docs.google.com/document/d/1fiGsUwqNIsjiaJI0aGfH_aNX5OJKEHkfWtfvlQkEEFI/edit 6 | // Context: E2E / Insertion 7 | // Issue: KB-13069 8 | // *********************************************************** 9 | beforeEach(() => { 10 | // Load fixture data 11 | cy.fixture("formulas.json").as("formulas"); 12 | 13 | // Visit the page. 14 | cy.visit("/"); 15 | 16 | // Clear the editor content in order to reduce noise 17 | cy.getTextEditor().clear(); 18 | }); 19 | 20 | it("an inserted latex formula should be rendered on preview", function () { 21 | // Type the formula that matxes the previous inserted text on the mathtype modal 22 | cy.typeInTextEditor(this.formulas["latex-general"]); 23 | 24 | // // Click the update button 25 | // cy.get('#btn_update').click(); 26 | 27 | // // Assert that the vertical align is -4px, which means that is aligner vertically (base) to the previous writen 2222 28 | // cy.getFormula(0).isRendered().and('have.attr', 'alt', this.formulas['latex-general-alt-en']); 29 | }); 30 | -------------------------------------------------------------------------------- /cypress/tests/e2e/STD-026.modal.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-026 4 | // Title: Validate Hand formulas open Hand directly when edited 5 | // Document: https://docs.google.com/document/d/10nBVV0y3O5Eo7hEHtok8-s8zsZqVId7s_jwT5vziy7g/edit 6 | // Context: E2E / Modal 7 | // Issue: - 8 | // *********************************************************** 9 | beforeEach(() => { 10 | // Load fixtures 11 | cy.fixture("formulas.json").as("formulas"); 12 | 13 | // Visit page 14 | cy.visit("/"); 15 | 16 | // Clear the editor content in order to reduce noise 17 | cy.getTextEditor().clear(); 18 | }); 19 | 20 | it("Validate Hand formulas open Hand directly when edited", function () { 21 | // Click the MT button on the HTML editor toolbar 22 | cy.clickButtonToOpenModal(); 23 | 24 | // Switch to Hand editing mode by clicking the Hand icon in the MT modal window 25 | // Draw a formula 26 | // Instead of drawing the formula by hand, we type them in and let Hand transform them 27 | cy.typeInModal(this.formulas["formula-general"]); 28 | cy.clickModalButton("hand"); 29 | 30 | // Click the OK button in the MT modal window 31 | cy.clickModalButton("insert"); 32 | 33 | // Double-click the created Hand formula 34 | cy.getFormula(0).dblclick(); 35 | 36 | // MT modal window opens and Hand editing mode is already displayed with the formula 37 | cy.get("canvas").should("be.visible"); 38 | }); 39 | -------------------------------------------------------------------------------- /cypress/tests/e2e/STD-028.modal.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-028 4 | // Title: Validate switch between CT and MT, and viceversa 5 | // Document: https://docs.google.com/document/d/1PlqZUsfta5GMXXRq89oy50NTW5zBQCeUi8YBdO83Yug/edit 6 | // Context: E2E / Modal 7 | // Issue: - 8 | // *********************************************************** 9 | beforeEach(() => { 10 | // Load fixtures 11 | cy.fixture("formulas.json").as("formulas"); 12 | 13 | // Visit page 14 | cy.visit("/"); 15 | }); 16 | 17 | it("Validate switch between CT and MT, and viceversa", () => { 18 | // Click the MT icon in the HTML editor toolbar. 19 | cy.clickButtonToOpenModal(); 20 | 21 | // Click the CT icon in the HTML editor toolbar 22 | cy.clickButtonToOpenModal(true); 23 | 24 | // MT modal window changes to CT modal window. 25 | cy.get(".wrs_modal_title").eq(0).should("have.text", "ChemType"); 26 | 27 | // Click the MT icon in the HTML editor toolbar. 28 | cy.clickButtonToOpenModal(); 29 | 30 | // CT modal window changes to MT modal window. 31 | cy.get(".wrs_modal_title").eq(0).should("have.text", "MathType"); 32 | }); 33 | -------------------------------------------------------------------------------- /cypress/tests/sandbox/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/cypress/tests/sandbox/.gitkeep -------------------------------------------------------------------------------- /cypress/tests/smoke/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/cypress/tests/smoke/.gitkeep -------------------------------------------------------------------------------- /cypress/tests/smoke/STD-001.insertion.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-001 4 | // Title: Validate alignment of a formula after insertion. 5 | // Document: https://docs.google.com/document/d/1RTZlelOssfwWAqx-ilTvRatrEQoaFIpk6ErWa7xMwIw/edit 6 | // Context: UI / Insertion 7 | // Issue: KB-13069 8 | // *********************************************************** 9 | beforeEach(() => { 10 | // Load fixture data 11 | cy.fixture("formulas.json").as("formulas"); 12 | 13 | // Visit the page. 14 | cy.visit("/"); 15 | 16 | // Clear the editor content in order to reduce noise 17 | cy.getTextEditor().clear(); 18 | }); 19 | 20 | it("an inserted formula that looks like plain text should be aligned with the same plain text", function () { 21 | // Type the text plane on the text editor 22 | cy.typeInTextEditor(this.formulas["text-alignment"]); 23 | 24 | // Insert a new MathType formula from scratch on the editor 25 | cy.insertFormulaFromScratch(this.formulas["formula-alignment"]); 26 | 27 | // Assert that the vertical align is -4px, which means that is aligner vertically (base) to the previous writen 2222 28 | cy.getFormula(0).should("have.attr", "style").and("contain", "vertical-align: -4px"); 29 | }); 30 | -------------------------------------------------------------------------------- /cypress/tests/smoke/STD-002.insertion.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-002 4 | // Title: Validate alignment of a formula on preview. 5 | // Document: https://docs.google.com/document/d/1aAPzvAe8WEEXgZECLsmml07TG4l3Fdy3AlJiaFSp6Iw/edit 6 | // Context: UI / Insertion 7 | // Issue: KB-13069 8 | // *********************************************************** 9 | beforeEach(() => { 10 | // Load fixture data 11 | cy.fixture("formulas.json").as("formulas"); 12 | 13 | // Visit the page. 14 | cy.visit("/"); 15 | 16 | // Clear the editor content in order to reduce noise 17 | cy.getTextEditor().clear(); 18 | }); 19 | 20 | it("an inserted formula that looks like plain text should be aligned with the same plane text on preview", function () { 21 | // Type the text plane on the text editor 22 | cy.typeInTextEditor(this.formulas["text-alignment"]); 23 | 24 | // Insert a new MathType formula from scratch on the editor 25 | cy.insertFormulaFromScratch(this.formulas["formula-alignment"]); 26 | 27 | // // Click the update button 28 | // cy.get('#btn_update').click(); 29 | 30 | // // Assert that the vertical align is -4px, which means that is aligner vertically (base) to the previous writen 2222 31 | // cy.getFormula(1).should('have.attr', 'style').and('contain', 'vertical-align: -4px'); 32 | }); 33 | -------------------------------------------------------------------------------- /cypress/tests/smoke/STD-003.insertion.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-003 4 | // Title: Validate caret is placed after the inserted formula 5 | // Document: https://docs.google.com/document/d/1YjSGL5yfvdMQOrFrqL48tQ2vUgfxD6YNSUgqsH65xI8/edit 6 | // Context: UI / Insertion 7 | // Issue: - 8 | // *********************************************************** 9 | beforeEach(() => { 10 | // Load fixture data 11 | cy.fixture("formulas.json").as("formulas"); 12 | 13 | // Visit the page. 14 | cy.visit("/"); 15 | 16 | // Clear the editor content in order to reduce noise 17 | cy.getTextEditor().clear(); 18 | }); 19 | 20 | it("Validate Hand formulas open Hand directly when edited", function () { 21 | // Insert a new MathType formula from scratch on the editor 22 | cy.insertFormulaFromScratch(this.formulas["formula-general"]); 23 | 24 | // User types the string ‘wiris’ on the HTML editor 25 | cy.typeInTextEditor("wiris"); 26 | 27 | // The string wiris is written right after the formula 28 | cy.getTextEditor() 29 | .children() 30 | .first() // First paragraph 31 | .then(($p) => { 32 | // Get the second node inside the paragraph 33 | cy.wrap($p[0].childNodes[1].textContent); 34 | }) 35 | .should("eq", "wiris"); 36 | }); 37 | -------------------------------------------------------------------------------- /cypress/tests/smoke/STD-004.images.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-004 4 | // Title: Validate wiris formulas contain class with value Wirisformula. 5 | // Document: https://docs.google.com/document/d/1LCM0z-kmZKdwpSMnrosMsyRVmZ5Zg5TNw_-VEkYyZng/edit 6 | // Context: Integration / Image 7 | // Issue: KB-13069 8 | // *********************************************************** 9 | beforeEach(() => { 10 | // Load fixture data 11 | cy.fixture("formulas.json").as("formulas"); 12 | 13 | // Visit the page. 14 | cy.visit("/"); 15 | 16 | // Clear the editor content in order to reduce noise 17 | cy.getTextEditor().clear(); 18 | }); 19 | 20 | it("formula should have wirisformula class", function () { 21 | // Insert a new MathType formula from scratch on the editor 22 | cy.insertFormulaFromScratch(this.formulas["formula-general"]); 23 | 24 | // Get the formula by it's alt text and assert it has the Wirisformula class 25 | // We could find the formula by using getFormula, but internally, that looks for 26 | // .Wirisformula, so it defeats the purpose. That's why we use the alt instead. 27 | cy.get(`img[alt="${this.formulas["formula-general-alt-es"]}"]`).should("have.class", "Wirisformula"); 28 | }); 29 | -------------------------------------------------------------------------------- /cypress/tests/smoke/STD-005.images.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-005 4 | // Title: Validate formula height and width is correct. 5 | // Document: https://docs.google.com/document/d/167zTPA2JxtbPaxdCp8kBKIEHoRyjHZnIWYmOPLEEMY4/edit 6 | // Context: UI / Image 7 | // Issue: KB-13069 8 | // *********************************************************** 9 | beforeEach(() => { 10 | // Visit the page. 11 | cy.visit("/"); 12 | 13 | // Clear the editor content in order to reduce noise 14 | cy.getTextEditor().clear(); 15 | }); 16 | 17 | it("The inserted formula should have the correct width and height", () => { 18 | // Open the mathtype modal 19 | cy.clickButtonToOpenModal(); 20 | 21 | // Write a mathtype formula: x/3 22 | cy.typeInModal("{ctrl}/").type("x").type("{downarrow}3"); 23 | 24 | // Insert the written formula by clicking the insert button on the modal 25 | cy.clickModalButton("insert"); 26 | 27 | // Get the previous inserted formula 28 | cy.getFormula(0).then(($formula) => { 29 | const formula = $formula[0]; 30 | 31 | // Assert that the width and height are the ones writen in the test case for the inserted formula 32 | expect(formula.width).to.equal(18); 33 | expect(formula.height).to.equal(41); 34 | }); 35 | }); 36 | -------------------------------------------------------------------------------- /cypress/tests/smoke/STD-007.images.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-007 4 | // Title: Validate wiris formulas contain alt attribute. 5 | // Document: https://docs.google.com/document/d/1Sa83zG7-sRpS1WIPQNTLtaeUFrwqZVSpdTbrtnkZHVI/edit 6 | // Context: UI / Image 7 | // Issue: KB-13069 8 | // *********************************************************** 9 | beforeEach(() => { 10 | // Load fixture data 11 | cy.fixture("formulas.json").as("formulas"); 12 | 13 | // Visit the page. 14 | cy.visit("/"); 15 | 16 | // Clear the editor content in order to reduce noise 17 | cy.getTextEditor().clear(); 18 | }); 19 | 20 | it("A wiris formula should have the alt attribute", function () { 21 | // Insert a new MathType formula from scratch on the editor 22 | cy.insertFormulaFromScratch(this.formulas["formula-general"]); 23 | 24 | // Get the previous inserted formula 25 | cy.getFormula(0).should("have.attr", "alt"); 26 | }); 27 | -------------------------------------------------------------------------------- /cypress/tests/smoke/STD-010.images.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-010 4 | // Title: Validate the formula is the same on editing mode and on preview . 5 | // Document: https://docs.google.com/document/d/1bRxBBG_OLS_1HTGdOBRbHHIRJPZHboVJ2Zy68z80fyY/edit 6 | // Context: UI / Images 7 | // Issue: KB-13069 8 | // *********************************************************** 9 | beforeEach(() => { 10 | // Load fixture data 11 | cy.fixture("formulas.json").as("formulas"); 12 | 13 | // Visit the page. 14 | cy.visit("/"); 15 | 16 | // Clear the editor content in order to reduce noise 17 | cy.getTextEditor().clear(); 18 | }); 19 | 20 | it("an inserted formula should be the same on preview when this is updated", function () { 21 | // Insert a new MathType formula from scratch on the editor 22 | cy.insertFormulaFromScratch(this.formulas["formula-general"], true); 23 | 24 | // // Click the update button 25 | // cy.get('#btn_update').click(); 26 | 27 | // // Assert that the vertical align is -4px, which means that is aligner vertically (base) to the previous writen 2222 28 | // cy.getFormula(0).isRendered().and('have.attr', 'alt', this.formulas['formula-general-alt-es']); 29 | // cy.getFormula(1).isRendered().and('have.attr', 'alt', this.formulas['formula-general-alt-en']); 30 | }); 31 | -------------------------------------------------------------------------------- /cypress/tests/smoke/STD-011.modal.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-011 4 | // Title: Check Hand icon is visible. 5 | // Document: https://docs.google.com/document/d/12cxOZRwLVhE_Aby2Ckjjee2WWJcTuceOcXmuBgZBAlE/edit 6 | // Context: UI / Modal 7 | // Issue: KB-13069 8 | // *********************************************************** 9 | beforeEach(() => { 10 | // Visit the page. 11 | cy.visit("/"); 12 | }); 13 | 14 | it("Hand icon should be visible on the mathtype modal", () => { 15 | // Open the mathtype modal 16 | cy.clickButtonToOpenModal(); 17 | 18 | // Check that the hand button is visible on mathtype modal 19 | cy.get(".wrs_handWrapper > input").should("be.visible"); 20 | }); 21 | -------------------------------------------------------------------------------- /cypress/tests/smoke/STD-012.modal.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-011 4 | // Title: Check Minimize, Maximize, and Close icons are visible in the modal. 5 | // Document: https://docs.google.com/document/d/1soW156YvORb3TIumKmlIjhpRccme5c_YyQhVLypIh0s/edit 6 | // Context: UI / Modal 7 | // Issue: KB-13069 8 | // *********************************************************** 9 | describe("Resize modal icons are visible", () => { 10 | beforeEach(() => { 11 | // Visit the page. 12 | cy.visit("/"); 13 | 14 | // Open the mathtype modal 15 | cy.clickButtonToOpenModal(); 16 | }); 17 | 18 | it("minimize icon should be visible on mathtype modal", () => { 19 | // Check that minimize button is visible on mathtype modal 20 | cy.get(".wrs_modal_minimize_button").should("be.visible"); 21 | }); 22 | 23 | it("maximize icon should be visible on mathtype modal", () => { 24 | // Check that minimize button is visible on mathtype modal 25 | cy.get(".wrs_modal_maximize_button").should("be.visible"); 26 | }); 27 | 28 | it("close icon should be visible on mathtype modal", () => { 29 | // Check that minimize button is visible on mathtype modal 30 | cy.get(".wrs_modal_close_button").should("be.visible"); 31 | }); 32 | }); 33 | -------------------------------------------------------------------------------- /cypress/tests/smoke/STD-014.insertion.js: -------------------------------------------------------------------------------- 1 | /// 2 | 3 | beforeEach(() => { 4 | // Load fixtures 5 | cy.fixture("formulas.json").as("formulas"); 6 | 7 | // Visit page 8 | cy.visit("/"); 9 | 10 | // Clear the editor content in order to reduce noise 11 | cy.getTextEditor().clear(); 12 | }); 13 | 14 | it("User creates a new formula from scratch using MT", function () { 15 | // Insert a new MathType formula from scratch on the editor 16 | cy.insertFormulaFromScratch(this.formulas["formula-general"]); 17 | 18 | // MT editor modal window is closed. 19 | cy.get(".wrs_modal_dialogContainer").should("not.to.be.visible"); 20 | 21 | // The formula is inserted at the beginning of the HTML editor content and perfectly rendered 22 | cy.getFormula(0).isRendered(); 23 | }); 24 | -------------------------------------------------------------------------------- /cypress/tests/smoke/STD-016.insertion.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-016 4 | // Title: User edits a formula by Double-click and inserts it. 5 | // Document: https://docs.google.com/document/d/1bIZOmDigkvhMCpAcTf81nz3Wp252aZpyPol9AxY0OXY/edit 6 | // Context: E2E / Insertion 7 | // Issue: KB-13069 8 | // *********************************************************** 9 | beforeEach(() => { 10 | // Load fixture data 11 | cy.fixture("formulas.json").as("formulas"); 12 | 13 | // Visit the page. 14 | cy.visit("/"); 15 | 16 | // Clear the editor content in order to reduce noise 17 | cy.getTextEditor().clear(); 18 | }); 19 | 20 | it("should be able to edit an existing formula", { retries: 3 }, function () { 21 | // Insert a new MathType formula from scratch on the editor 22 | cy.insertFormulaFromScratch(this.formulas["formula-general"]); 23 | 24 | // Double-click the previous inserted formula to start editing it 25 | cy.getFormula(0).dblclick(); 26 | 27 | // Assert that the toolbar is visible so that we know the modal is fully loaded 28 | cy.get(".wrs_toolbar").should("be.visible"); 29 | 30 | // Wait for the formula clocked to be loaded 31 | cy.get(".wrs_container").invoke("text").should("contain", "y"); // .children().should('have.length.at.least', 9); 32 | 33 | // Modify the opened formula 34 | cy.get(".wrs_focusElement").click().type(this.formulas["formula-addition"]); 35 | // cy.typeInModal('{movetostart}{del}{del}{del}'); 36 | 37 | // Click the insert button on the mathtype modal to insert the previous edited formula 38 | cy.clickModalButton("insert"); 39 | 40 | // Expect the formula to be edited propertly 41 | cy.getFormula(0) 42 | .should("have.attr", "alt") 43 | .then((alt) => { 44 | expect(alt).to.equal(this.formulas["formula-total-alt-es"]); 45 | }); 46 | }); 47 | -------------------------------------------------------------------------------- /cypress/tests/smoke/STD-017.insertion.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-017 4 | // Title: User edits a formula and cancels the edition. 5 | // Document: https://docs.google.com/document/d/1CqlEq9p0oVrRhpXjaguehtA4LBl9157qSZ_vg0pdswM/edit 6 | // Context: E2E / Insertion 7 | // Issue: KB-13069 8 | // *********************************************************** 9 | 10 | beforeEach(() => { 11 | // Load fixture data 12 | cy.fixture("formulas.json").as("formulas"); 13 | 14 | // Visit the page. 15 | cy.visit("/"); 16 | 17 | // Clear the editor content in order to reduce noise 18 | cy.getTextEditor().clear(); 19 | }); 20 | 21 | it("should be able to edit and existing formula and cancel the edition", function () { 22 | // Insert a new MathType formula from scratch on the editor 23 | cy.insertFormulaFromScratch(this.formulas["formula-general"]); 24 | 25 | // Double-click the previous inserted formula to start editing it 26 | cy.getFormula(0).dblclick(); 27 | 28 | // Edit the opened formula by adding some other content (=y) 29 | cy.typeInModal(this.formulas["formula-addition"]); 30 | 31 | // Click the cancel button after editing the formula on the mathtype modal 32 | cy.clickModalButton("cancel"); 33 | 34 | // CLick the close button on the confirmation close mathtype modal the cancel all changes and close it 35 | cy.clickModalButton("confirmationClose"); 36 | 37 | // Assert the formula has no changes 38 | cy.getFormula(0) 39 | .should("have.attr", "alt") 40 | .then((alt) => { 41 | expect(alt).to.equal(this.formulas["formula-general-alt-es"]); 42 | }); 43 | 44 | // Verify the formula is propertly rendered 45 | cy.getFormula(0).isRendered(); 46 | }); 47 | -------------------------------------------------------------------------------- /cypress/tests/smoke/STD-019.insertion.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-019 4 | // Title: User edits a latex formula. 5 | // Document: https://docs.google.com/document/d/1tkYS_g5ZZcjIiUT-nMPv4G2AGlcumw9siTY_B1bFtkE/edit 6 | // Context: E2E / Insertion 7 | // Issue: KB-13069 8 | // *********************************************************** 9 | beforeEach(() => { 10 | // Load fixture data 11 | cy.fixture("formulas.json").as("formulas"); 12 | 13 | // Visit the page. 14 | cy.visit("/"); 15 | 16 | // Clear the editor content in order to reduce noise 17 | cy.getTextEditor().clear(); 18 | }); 19 | 20 | it("should be able to edit an existing latex formula", function () { 21 | // Write a latex formula on the text editor 22 | cy.typeInTextEditor(this.formulas["latex-general"]); 23 | 24 | // Edit the first latex formula with mathtype 25 | cy.editFormula(this.formulas["latex-addition"], { 26 | chem: false, 27 | latex: true, 28 | formulaId: 0, 29 | }); 30 | 31 | // Expect that the text editor contains the latex formula 32 | cy.getTextEditor().invoke("text").should("contain", "$$\\cos^2(x)+\\sin^2(x)=\\log(e)$$"); 33 | }); 34 | -------------------------------------------------------------------------------- /cypress/tests/smoke/STD-020.modal.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-020 4 | // Title: User opens MT and closes it via ESC 5 | // Document: https://docs.google.com/document/d/1v6NyWfvoFrgX7CWufN12_tCzyO9ITvX3HTAXTIYWCSQ/edit 6 | // Context: E2E / Modal 7 | // Issue: - 8 | // *********************************************************** 9 | beforeEach(() => { 10 | // Visit page 11 | cy.visit("/"); 12 | }); 13 | 14 | it("User opens MT and closes it via ESC", () => { 15 | // Click the MT button in the HTML editor toolbar 16 | cy.clickButtonToOpenModal(); 17 | 18 | // Press the ESC key 19 | cy.pressESCButton(); 20 | 21 | // MT editor modal window is closed 22 | cy.get(".wrs_modal_dialogContainer").should("not.be.visible"); 23 | }); 24 | -------------------------------------------------------------------------------- /cypress/tests/smoke/STD-021.modal.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-021 4 | // Title: Open and close the mathtype modal without adding any formula. 5 | // Document: https://docs.google.com/document/d/1MloNEApADlavZHfODqScyGCNUrZyMgiGYrPx46c4waQ/edit 6 | // Context: E2E / Modal 7 | // Issue: KB-13069 8 | // *********************************************************** 9 | beforeEach(() => { 10 | // Visit the page. 11 | cy.visit("/"); 12 | }); 13 | 14 | it("should be able to edit and existing formula and cancel the edition", () => { 15 | // Open the mathtype modal bu clicking the mathtype button 16 | cy.clickButtonToOpenModal(); 17 | 18 | // Click the cancel button on the mathtype modal to close the modal 19 | cy.clickModalButton("cancel"); 20 | 21 | // Verify the modal is closed 22 | cy.get(".wrs_focusElement").should("not.be.visible"); 23 | }); 24 | -------------------------------------------------------------------------------- /cypress/tests/smoke/STD-022.modal.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-022 4 | // Title: User opens MT, edits an equation and Cancels. Accepts the ‘are you sure you want to leave?’ dialog 5 | // Document: https://docs.google.com/document/d/11R4j3ZW0a50Lp02frqihtfZPeBFAYfN_xtqrs3AejdM/edit 6 | // Context: E2E / Modal 7 | // Issue: - 8 | // *********************************************************** 9 | beforeEach(() => { 10 | // Load fixtures 11 | cy.fixture("formulas.json").as("formulas"); 12 | 13 | // Visit page 14 | cy.visit("/"); 15 | 16 | // Clear the editor content in order to reduce noise 17 | cy.getTextEditor().clear(); 18 | }); 19 | 20 | it("User opens MT, edits an equation and Cancels. Accepts the ‘are you sure you want to leave?’ dialog", function () { 21 | // Click on the MT icon in the HTML editor toolbar 22 | cy.clickButtonToOpenModal(); 23 | 24 | // Type the formula 25 | cy.typeInModal(this.formulas["formula-general"]); 26 | 27 | // Click the Cancel button in the MT editor 28 | cy.clickModalButton("cancel"); 29 | 30 | // Click the Close button from the ‘Are you sure you want to leave?’ dialog 31 | cy.clickModalButton("confirmationClose"); 32 | 33 | // The MT editor modal window is closed and... 34 | cy.get(".wrs_modal_dialogContainer").should("not.to.be.visible"); 35 | 36 | // ... no formula is inserted to the HTML editor 37 | // We check for the 2nd formula, as currently the demos come with one formula by default 38 | // (So one .Wirisformula in the editor and one .Wirisformula in the preview) 39 | cy.get(".Wirisformula").eq(1).should("not.exist"); 40 | }); 41 | -------------------------------------------------------------------------------- /cypress/tests/smoke/STD-023.modal.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // Test case: INT-STD-023 4 | // Title: User opens MT, edits an equation and closes the modal via X button. Denies the ‘are you sure you want to leave?’ dialog and inserts the formula 5 | // Document: https://docs.google.com/document/d/1EaC9zB9eIADTk06j3TyPouOwzIp3AHael5zV39kOMyM/edit 6 | // Context: E2E / Modal 7 | // Issue: - 8 | // *********************************************************** 9 | beforeEach(() => { 10 | // Load fixtures 11 | cy.fixture("formulas.json").as("formulas"); 12 | 13 | // Visit page 14 | cy.visit("/"); 15 | 16 | // Clear the editor content in order to reduce noise 17 | cy.getTextEditor().clear(); 18 | }); 19 | 20 | it("User opens MT, edits an equation and closes the modal via X button. Denies the ‘are you sure you want to leave?’ dialog and inserts the formula", function () { 21 | // Click on the MT icon in the HTML editor toolbar 22 | cy.clickButtonToOpenModal(); 23 | 24 | // Type the formula 25 | cy.typeInModal(this.formulas["formula-general"]); 26 | 27 | // Click the ‘X’ button of the MT modal window in order to close it 28 | cy.clickModalButton("xClose"); 29 | 30 | // Click the Cancel button from the ‘Are you sure you want to leave?’ dialog 31 | cy.clickModalButton("confirmationCancel"); 32 | 33 | // Click the Insert button in the MT modal window 34 | cy.clickModalButton("insert"); 35 | 36 | // The formula is rendered in the HTML editor 37 | // We check for the 3rd formula, as currently the demos come with one formula by default 38 | // (So one .Wirisformula in the editor and one .Wirisformula in the preview) 39 | cy.getFormula(0).should("be.visible"); 40 | }); 41 | -------------------------------------------------------------------------------- /cypress/tests/ui/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/cypress/tests/ui/.gitkeep -------------------------------------------------------------------------------- /cypress/tests/validation/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/cypress/tests/validation/.gitkeep -------------------------------------------------------------------------------- /demos/html/ckeditor4/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | [ 4 | "@babel/preset-env", 5 | { 6 | targets: { 7 | node: "current", 8 | }, 9 | }, 10 | ], 11 | ], 12 | }; 13 | -------------------------------------------------------------------------------- /demos/html/ckeditor4/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Demo CKEditor 4 on HTML 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /demos/html/ckeditor4/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "demo-html-ckeditor4", 3 | "version": "1.1.0", 4 | "private": true, 5 | "description": "A simple html App integrating WIRIS MathType in a CKEditor4 rich text editor.", 6 | "main": "app.js", 7 | "scripts": { 8 | "prestart-remote": "yarn && yarn unlink @wiris/mathtype-ckeditor4 && yarn unlink @wiris/mathtype-html-integration-devkit && yarn install --force", 9 | "prestart": "yarn && yarn link @wiris/mathtype-ckeditor4 && yarn link @wiris/mathtype-html-integration-devkit" 10 | }, 11 | "author": "WIRIS Team (http://www.wiris.com)", 12 | "license": "MIT", 13 | "dependencies": { 14 | "@wiris/mathtype-ckeditor4": "*", 15 | "@wiris/mathtype-html-integration-devkit": "*", 16 | "ckeditor4": "^4.22.1" 17 | }, 18 | "devDependencies": { 19 | "@babel/core": "^7.24.4", 20 | "@babel/preset-env": "^7.24.4", 21 | "babel-loader": "^9.1.3", 22 | "copy-webpack-plugin": "^12.0.2", 23 | "css-loader": "^7.1.0", 24 | "html-loader": "^5.0.0", 25 | "style-loader": "^4.0.0", 26 | "resources": "file:../../../packages/res", 27 | "webpack": "^5.75.0", 28 | "webpack-cli": "^5.0.0", 29 | "webpack-dev-server": "^5.0.4" 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /demos/html/ckeditor4/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "html-ckeditor4", 3 | "$schema": "../../../node_modules/nx/schemas/project-schema.json", 4 | "sourceRoot": "demos/html/ckeditor4/src", 5 | "targets": { 6 | "prestart": { 7 | "executor": "nx:run-script", 8 | "options": { 9 | "script": "prestart" 10 | } 11 | }, 12 | "prestart-remote": { 13 | "executor": "nx:run-script", 14 | "options": { 15 | "script": "prestart-remote" 16 | } 17 | }, 18 | "build": { 19 | "executor": "@nx/webpack:webpack", 20 | "dependsOn": ["prestart"], 21 | "outputs": ["{options.outputPath}"], 22 | "options": { 23 | "main": "demos/html/ckeditor4/src/app.js", 24 | "outputPath": "dist", 25 | "tsConfig": "tsconfig.app.json", 26 | "generateIndexHtml": false, 27 | "index": "demos/html/ckeditor4/index.html", 28 | "webpackConfig": "demos/html/ckeditor4/webpack.config.js" 29 | } 30 | }, 31 | "start": { 32 | "executor": "@nx/webpack:dev-server", 33 | "dependsOn": ["prestart"], 34 | "options": { 35 | "buildTarget": "html-ckeditor4:build", 36 | "webpackConfig": "demos/html/ckeditor4/webpack.config.js" 37 | } 38 | }, 39 | "start-remote": { 40 | "executor": "@nx/webpack:dev-server", 41 | "dependsOn": ["prestart-remote"], 42 | "options": { 43 | "buildTarget": "html-ckeditor4:build", 44 | "webpackConfig": "demos/html/ckeditor4/webpack.config.js" 45 | } 46 | }, 47 | "lint": { 48 | "executor": "@nx/linter:eslint", 49 | "options": { 50 | "eslintConfig": "./.eslintrc.js", 51 | "lintFilePatterns": ["demos/html/ckeditor4/**/*.{ts,tsx,js,jsx}"] 52 | }, 53 | "outputs": ["{options.outputFile}"] 54 | } 55 | } 56 | } 57 | -------------------------------------------------------------------------------- /demos/html/ckeditor4/src/static/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: #e4e6e7; 3 | } 4 | 5 | .cke { 6 | background-color: #fff !important; 7 | border: 1px solid rgb(201, 201, 201) !important; 8 | border-radius: 10px !important; 9 | margin: 0 auto !important; 10 | max-width: 750px !important; 11 | min-height: 300px !important; 12 | width: 75% !important; 13 | } 14 | 15 | #cke_1_contents { 16 | min-height: 250px; 17 | } 18 | 19 | .cke:hover { 20 | box-shadow: 0 0 10px #7af78f; 21 | } 22 | 23 | .cke_inner { 24 | border-radius: 10px; 25 | } 26 | 27 | #cke_1_top, 28 | #cke_8, 29 | #cke_1_toolbox, 30 | #cke_editor_arialbl { 31 | border-top-left-radius: 10px; 32 | border-top-right-radius: 10px; 33 | } 34 | 35 | #cke_1_bottom { 36 | border-bottom-left-radius: 10px; 37 | border-bottom-right-radius: 10px; 38 | } 39 | -------------------------------------------------------------------------------- /demos/html/ckeditor5/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | [ 4 | "@babel/preset-env", 5 | { 6 | targets: { 7 | node: "current", 8 | }, 9 | }, 10 | ], 11 | ], 12 | }; 13 | -------------------------------------------------------------------------------- /demos/html/ckeditor5/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Demo CKEditor 5 on HTML 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /demos/html/ckeditor5/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "demo-html-ckeditor5", 3 | "version": "1.1.0", 4 | "private": true, 5 | "description": "A simple html App integrating WIRIS MathType in a CKEditor5 rich text editor.", 6 | "main": "app.js", 7 | "scripts": { 8 | "prestart-remote": "yarn && yarn unlink @wiris/mathtype-ckeditor5 && yarn unlink @wiris/mathtype-html-integration-devkit && yarn install --force", 9 | "prestart": "yarn && yarn link @wiris/mathtype-ckeditor5 && yarn link @wiris/mathtype-html-integration-devkit" 10 | }, 11 | "author": "WIRIS Team (http://www.wiris.com)", 12 | "license": "MIT", 13 | "dependencies": { 14 | "ckeditor5": ">=42.0.0", 15 | "@wiris/mathtype-ckeditor5": "*", 16 | "@wiris/mathtype-html-integration-devkit": "*" 17 | }, 18 | "devDependencies": { 19 | "@babel/core": "^7.24.4", 20 | "@babel/preset-env": "^7.24.4", 21 | "babel-loader": "^9.1.3", 22 | "css-loader": "^7.1.0", 23 | "html-loader": "^5.0.0", 24 | "postcss": "^8.0.0", 25 | "postcss-loader": "^8.0.0", 26 | "resources": "file:../../../packages/res", 27 | "style-loader": "^4.0.0", 28 | "webpack": "^5.75.0", 29 | "webpack-cli": "^5.0.0", 30 | "webpack-dev-server": "^5.0.4" 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /demos/html/ckeditor5/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "html-ckeditor5", 3 | "$schema": "../../../node_modules/nx/schemas/project-schema.json", 4 | "sourceRoot": "demos/html/ckeditor5/src", 5 | "targets": { 6 | "prestart": { 7 | "executor": "nx:run-script", 8 | "options": { 9 | "script": "prestart" 10 | } 11 | }, 12 | "prestart-remote": { 13 | "executor": "nx:run-script", 14 | "options": { 15 | "script": "prestart-remote" 16 | } 17 | }, 18 | "build": { 19 | "executor": "@nx/webpack:webpack", 20 | "dependsOn": ["prestart"], 21 | "outputs": ["{options.outputPath}"], 22 | "options": { 23 | "main": "demos/html/ckeditor5/src/app.js", 24 | "outputPath": "dist", 25 | "tsConfig": "tsconfig.app.json", 26 | "generateIndexHtml": false, 27 | "index": "demos/html/ckeditor5/index.html", 28 | "webpackConfig": "demos/html/ckeditor5/webpack.config.js" 29 | } 30 | }, 31 | "start": { 32 | "executor": "@nx/webpack:dev-server", 33 | "dependsOn": ["prestart"], 34 | "options": { 35 | "buildTarget": "html-ckeditor5:build", 36 | "webpackConfig": "demos/html/ckeditor5/webpack.config.js" 37 | } 38 | }, 39 | "start-remote": { 40 | "executor": "@nx/webpack:dev-server", 41 | "dependsOn": ["prestart-remote"], 42 | "options": { 43 | "buildTarget": "html-ckeditor5:build", 44 | "webpackConfig": "demos/html/ckeditor5/webpack.config.js" 45 | } 46 | }, 47 | "lint": { 48 | "executor": "@nx/linter:eslint", 49 | "options": { 50 | "eslintConfig": "./.eslintrc.js", 51 | "lintFilePatterns": ["demos/html/ckeditor5/**/*.{ts,tsx,js,jsx}"] 52 | }, 53 | "outputs": ["{options.outputFile}"] 54 | } 55 | } 56 | } 57 | -------------------------------------------------------------------------------- /demos/html/ckeditor5/src/static/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: #e4e6e7; 3 | } 4 | 5 | .ck-editor { 6 | background-color: #fff !important; 7 | border-radius: 10px !important; 8 | margin: 0 auto !important; 9 | max-width: 760px !important; 10 | width: 75% !important; 11 | } 12 | 13 | .ck-editor:hover { 14 | box-shadow: 0 0 10px #7af78f; 15 | } 16 | 17 | .ck-content { 18 | border-bottom-left-radius: 10px; 19 | border-bottom-right-radius: 10px; 20 | min-height: 250px; 21 | } 22 | 23 | .ck-rounded-corners, 24 | .ck.ck-editor__editable:not(.ck-editor__nested-editable), 25 | .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-rounded-corners { 26 | border-bottom-left-radius: 10px !important; 27 | border-bottom-right-radius: 10px !important; 28 | } 29 | -------------------------------------------------------------------------------- /demos/html/ckeditor5/webpack.config.js: -------------------------------------------------------------------------------- 1 | const path = require("path"); 2 | 3 | module.exports = (config, context) => { 4 | return { 5 | mode: "development", 6 | entry: { 7 | app: path.resolve(__dirname, "src/app.js"), 8 | }, 9 | output: { 10 | path: path.resolve(__dirname, "dist"), 11 | filename: "demo.js", 12 | }, 13 | devServer: { 14 | devMiddleware: { 15 | writeToDisk: true, 16 | }, 17 | static: { 18 | directory: path.join(__dirname, "./"), 19 | }, 20 | onListening: !config.devServer ? "" : config.devServer.onListening, 21 | open: true, 22 | port: 8002, 23 | hot: true, 24 | host: "0.0.0.0", 25 | }, 26 | // Set watch to true for dev purposes. 27 | watch: false, 28 | mode: "none", 29 | module: { 30 | rules: [ 31 | { 32 | test: /\.svg$/, 33 | type: "asset/source", 34 | }, 35 | { 36 | test: /\.js$/, 37 | exclude: /node_modules/, 38 | use: ["babel-loader"], 39 | }, 40 | { 41 | test: /\.css$/, 42 | use: [ 43 | { 44 | loader: "style-loader", 45 | options: { 46 | injectType: "singletonStyleTag", 47 | attributes: { 48 | "data-cke": true, 49 | }, 50 | }, 51 | }, 52 | "css-loader", 53 | ], 54 | }, 55 | { 56 | test: /\.html$/i, 57 | exclude: /node_modules/, 58 | loader: "html-loader", 59 | }, 60 | ], 61 | }, 62 | // Useful for debugging. 63 | devtool: "source-map", 64 | // By default webpack logs warnings if the bundle is bigger than 200kb. 65 | performance: { hints: false }, 66 | }; 67 | }; 68 | -------------------------------------------------------------------------------- /demos/html/froala/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | [ 4 | "@babel/preset-env", 5 | { 6 | targets: { 7 | node: "current", 8 | }, 9 | }, 10 | ], 11 | ], 12 | }; 13 | -------------------------------------------------------------------------------- /demos/html/froala/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Demo Froala on HTML 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /demos/html/froala/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "demo-html-froala", 3 | "version": "1.1.0", 4 | "private": true, 5 | "description": "A simple html App integrating WIRIS MathType in a Froala rich text editor.", 6 | "main": "app.js", 7 | "scripts": { 8 | "prestart-remote": "yarn && yarn unlink @wiris/mathtype-froala && yarn unlink @wiris/mathtype-html-integration-devkit && yarn install --force", 9 | "prestart": "yarn && yarn link @wiris/mathtype-froala && yarn link @wiris/mathtype-html-integration-devkit" 10 | }, 11 | "author": "WIRIS Team (https://www.wiris.com)", 12 | "license": "MIT", 13 | "dependencies": { 14 | "@wiris/mathtype-froala": "*", 15 | "@wiris/mathtype-html-integration-devkit": "*", 16 | "froala-editor": "^4.2.0" 17 | }, 18 | "devDependencies": { 19 | "copy-webpack-plugin": "^12.0.2", 20 | "css-loader": "^7.1.0", 21 | "html-loader": "^5.0.0", 22 | "style-loader": "^4.0.0", 23 | "wait-for-localhost": "^3.3.0", 24 | "webpack": "^5.75.0", 25 | "webpack-cli": "^5.0.0", 26 | "webpack-dev-server": "^5.0.4", 27 | "resources": "file:../../../packages/res" 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /demos/html/froala/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "html-froala", 3 | "$schema": "../../../node_modules/nx/schemas/project-schema.json", 4 | "sourceRoot": "demos/html/froala/src", 5 | "targets": { 6 | "prestart": { 7 | "executor": "nx:run-script", 8 | "options": { 9 | "script": "prestart" 10 | } 11 | }, 12 | "prestart-remote": { 13 | "executor": "nx:run-script", 14 | "options": { 15 | "script": "prestart-remote" 16 | } 17 | }, 18 | "build": { 19 | "executor": "@nx/webpack:webpack", 20 | "dependsOn": ["prestart"], 21 | "outputs": ["{options.outputPath}"], 22 | "options": { 23 | "main": "demos/html/froala/src/app.js", 24 | "outputPath": "dist", 25 | "tsConfig": "tsconfig.app.json", 26 | "generateIndexHtml": false, 27 | "index": "demos/html/froala/index.html", 28 | "webpackConfig": "demos/html/froala/webpack.config.js" 29 | } 30 | }, 31 | "start": { 32 | "executor": "@nx/webpack:dev-server", 33 | "dependsOn": ["prestart"], 34 | "options": { 35 | "buildTarget": "html-froala:build", 36 | "webpackConfig": "demos/html/froala/webpack.config.js" 37 | } 38 | }, 39 | "start-remote": { 40 | "executor": "@nx/webpack:dev-server", 41 | "dependsOn": ["prestart-remote"], 42 | "options": { 43 | "buildTarget": "html-froala:build", 44 | "webpackConfig": "demos/html/froala/webpack.config.js" 45 | } 46 | }, 47 | "lint": { 48 | "executor": "@nx/linter:eslint", 49 | "options": { 50 | "eslintConfig": "./.eslintrc.js", 51 | "lintFilePatterns": ["demos/html/froala/**/*.{ts,tsx,js,jsx}"] 52 | }, 53 | "outputs": ["{options.outputFile}"] 54 | } 55 | } 56 | } 57 | -------------------------------------------------------------------------------- /demos/html/froala/src/static/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: #e4e6e7; 3 | } 4 | 5 | .fr-wrapper { 6 | min-height: 200px; 7 | } 8 | -------------------------------------------------------------------------------- /demos/html/generic/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | [ 4 | "@babel/preset-env", 5 | { 6 | targets: { 7 | node: "current", 8 | }, 9 | }, 10 | ], 11 | ], 12 | }; 13 | -------------------------------------------------------------------------------- /demos/html/generic/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Demo Generic on HTML 5 | 6 | 7 | 8 | 9 | 10 |
11 |

MathType for Generic on HTML

12 |
13 |
    14 |
  • MathType:
  • 15 |
  • 16 |
  • 17 |
18 |
19 |
20 |
21 |
22 |
23 | 24 |
25 |
26 |
27 | UPDATE 30 |
31 |
32 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /demos/html/generic/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "demo-html-generic", 3 | "version": "1.1.0", 4 | "private": true, 5 | "description": "A simple html App integrating WIRIS MathType in a Generic integration.", 6 | "main": "app.js", 7 | "scripts": { 8 | "prestart-remote": "yarn && yarn unlink @wiris/mathtype-generic && yarn unlink @wiris/mathtype-html-integration-devkit && yarn install --force", 9 | "prestart": "yarn && yarn link @wiris/mathtype-generic && yarn link @wiris/mathtype-html-integration-devkit" 10 | }, 11 | "author": "WIRIS Team (https://www.wiris.com)", 12 | "license": "MIT", 13 | "dependencies": { 14 | "@wiris/mathtype-generic": "*", 15 | "@wiris/mathtype-html-integration-devkit": "*" 16 | }, 17 | "devDependencies": { 18 | "@babel/core": "^7.24.4", 19 | "@babel/preset-env": "^7.24.4", 20 | "babel-loader": "^9.1.3", 21 | "chokidar": "^3.5.2", 22 | "css-loader": "^7.1.0", 23 | "html-loader": "^5.0.0", 24 | "style-loader": "^4.0.0", 25 | "webpack": "^5.75.0", 26 | "webpack-cli": "^5.0.0", 27 | "webpack-dev-server": "^5.0.4", 28 | "resources": "file:../../../packages/res" 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /demos/html/generic/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "html-generic", 3 | "$schema": "../../../node_modules/nx/schemas/project-schema.json", 4 | "sourceRoot": "demos/html/generic/src", 5 | "targets": { 6 | "prestart": { 7 | "executor": "nx:run-script", 8 | "options": { 9 | "script": "prestart" 10 | } 11 | }, 12 | "prestart-remote": { 13 | "executor": "nx:run-script", 14 | "options": { 15 | "script": "prestart-remote" 16 | } 17 | }, 18 | "build": { 19 | "executor": "@nx/webpack:webpack", 20 | "dependsOn": ["prestart"], 21 | "outputs": ["{options.outputPath}"], 22 | "options": { 23 | "main": "demos/html/generic/src/app.js", 24 | "outputPath": "dist", 25 | "tsConfig": "tsconfig.app.json", 26 | "generateIndexHtml": false, 27 | "index": "demos/html/generic/index.html", 28 | "webpackConfig": "demos/html/generic/webpack.config.js" 29 | } 30 | }, 31 | "start": { 32 | "executor": "@nx/webpack:dev-server", 33 | "dependsOn": ["prestart"], 34 | "options": { 35 | "buildTarget": "html-generic:build", 36 | "webpackConfig": "demos/html/generic/webpack.config.js" 37 | } 38 | }, 39 | "start-remote": { 40 | "executor": "@nx/webpack:dev-server", 41 | "dependsOn": ["prestart-remote"], 42 | "options": { 43 | "buildTarget": "html-generic:build", 44 | "webpackConfig": "demos/html/generic/webpack.config.js" 45 | } 46 | }, 47 | "lint": { 48 | "executor": "@nx/linter:eslint", 49 | "options": { 50 | "eslintConfig": "./.eslintrc.js", 51 | "lintFilePatterns": ["demos/html/generic/**/*.{ts,tsx,js,jsx}"] 52 | }, 53 | "outputs": ["{options.outputFile}"] 54 | } 55 | } 56 | } 57 | -------------------------------------------------------------------------------- /demos/html/generic/src/app.js: -------------------------------------------------------------------------------- 1 | // Load scripts. 2 | import { wrsGetTargetHtml } from "@wiris/mathtype-generic/wirisplugin-generic.src"; 3 | import "@wiris/mathtype-generic/wirisplugin-generic"; 4 | import * as Generic from "resources/demos/common"; 5 | 6 | // Load styles. 7 | import "./static/style.css"; 8 | import "resources/demos/design.css"; 9 | 10 | // Generate scripts. 11 | const jsDemoImagesTransform = document.createElement("script"); 12 | jsDemoImagesTransform.type = "text/javascript"; 13 | jsDemoImagesTransform.src = "https://www.wiris.net/demo/plugins/app/WIRISplugins.js?viewer=image"; 14 | 15 | // Load generated scripts. 16 | document.head.appendChild(jsDemoImagesTransform); 17 | 18 | // Copy the editor content before initializing it. 19 | // Currently disabled by decision of QA. 20 | // Generic.copyContentFromxToy('editable', 'transform_content'); 21 | 22 | const editableDiv = document.getElementById("editable"); 23 | const toolbarDiv = document.getElementById("toolbar"); 24 | 25 | // Initialize the editor. 26 | window.wrs_int_init(editableDiv, toolbarDiv); 27 | 28 | document.onreadystatechange = function () { 29 | if (document.readyState === "interactive") { 30 | const versionWiris = WirisPlugin.currentInstance.version; //eslint-disable-line 31 | Generic.setEditorAndWirisVersion(0, versionWiris); 32 | editableDiv.innerHTML = Generic.editorContentImg; 33 | } 34 | }; 35 | 36 | // Add listener on click button to launch updateContent function. 37 | document.getElementById("btn_update").addEventListener("click", (e) => { 38 | e.preventDefault(); 39 | const innerHTMLEditor = wrsGetTargetHtml(editableDiv); 40 | Generic.updateContent(innerHTMLEditor, "transform_content"); //eslint-disable-line 41 | }); 42 | -------------------------------------------------------------------------------- /demos/html/generic/src/static/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: #e4e6e7; 3 | } 4 | 5 | .componentsToolbarEditable { 6 | background-color: #fff; 7 | border: 1px solid #c9c9c9; 8 | border-radius: 10px; 9 | margin: 0 auto; 10 | max-width: 750px; 11 | min-height: 300px; 12 | width: 75%; 13 | } 14 | 15 | [contenteditable] { 16 | outline: 0 solid transparent; 17 | } 18 | 19 | .componentsToolbarEditable:hover { 20 | box-shadow: 0 0 10px #7af78f; 21 | } 22 | 23 | #toolbar { 24 | background-color: #fff; 25 | border-radius: 11px; 26 | display: inline; 27 | } 28 | 29 | #editable { 30 | background-color: #fff; 31 | border-top: 1px solid #e6e6e6; 32 | padding: 2%; 33 | width: auto; 34 | } 35 | 36 | #editorIcon { 37 | background-color: #fff; 38 | border-radius: inherit; 39 | padding: 1.4% 1% 1.4% 2%; 40 | } 41 | 42 | #chemistryIcon { 43 | background-color: #fff; 44 | padding: 1.4% 1% 1.4% 1%; 45 | } 46 | 47 | #eq { 48 | text-align: center; 49 | } 50 | -------------------------------------------------------------------------------- /demos/html/tinymce5/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | [ 4 | "@babel/preset-env", 5 | { 6 | targets: { 7 | node: "current", 8 | }, 9 | }, 10 | ], 11 | ], 12 | }; 13 | -------------------------------------------------------------------------------- /demos/html/tinymce5/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Demo TinyMCE 5 on HTML 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /demos/html/tinymce5/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "demo-html-tinymce5", 3 | "version": "1.1.0", 4 | "private": true, 5 | "description": "A simple html App integrating WIRIS MathType in a TinyMCE5 rich text editor.", 6 | "main": "app.js", 7 | "scripts": { 8 | "prestart-remote": "yarn && yarn unlink @wiris/mathtype-tinymce5 && yarn unlink @wiris/mathtype-html-integration-devkit && yarn install --force", 9 | "prestart": "yarn && yarn link @wiris/mathtype-tinymce5 && yarn link @wiris/mathtype-html-integration-devkit" 10 | }, 11 | "author": "WIRIS Team (https://www.wiris.com)", 12 | "license": "MIT", 13 | "dependencies": { 14 | "@wiris/mathtype-html-integration-devkit": "*", 15 | "@wiris/mathtype-tinymce5": "*", 16 | "tinymce": "^5.7.1" 17 | }, 18 | "devDependencies": { 19 | "copy-webpack-plugin": "^12.0.2", 20 | "css-loader": "^7.1.0", 21 | "html-loader": "^5.0.0", 22 | "style-loader": "^4.0.0", 23 | "ts-loader": "^9.3.1", 24 | "webpack": "^5.75.0", 25 | "webpack-cli": "^5.0.0", 26 | "webpack-dev-server": "^5.0.4", 27 | "resources": "file:../../../packages/res" 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /demos/html/tinymce5/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "html-tinymce5", 3 | "$schema": "../../../node_modules/nx/schemas/project-schema.json", 4 | "sourceRoot": "demos/html/tinymce5/src", 5 | "targets": { 6 | "prestart": { 7 | "executor": "nx:run-script", 8 | "options": { 9 | "script": "prestart" 10 | } 11 | }, 12 | "prestart-remote": { 13 | "executor": "nx:run-script", 14 | "options": { 15 | "script": "prestart-remote" 16 | } 17 | }, 18 | "build": { 19 | "executor": "@nx/webpack:webpack", 20 | "dependsOn": ["prestart"], 21 | "outputs": ["{options.outputPath}"], 22 | "options": { 23 | "main": "demos/html/tinymce5/src/app.js", 24 | "outputPath": "dist", 25 | "tsConfig": "tsconfig.app.json", 26 | "generateIndexHtml": false, 27 | "index": "demos/html/tinymce5/index.html", 28 | "webpackConfig": "demos/html/tinymce5/webpack.config.js" 29 | } 30 | }, 31 | "start": { 32 | "executor": "@nx/webpack:dev-server", 33 | "dependsOn": ["prestart"], 34 | "options": { 35 | "buildTarget": "html-tinymce5:build", 36 | "webpackConfig": "demos/html/tinymce5/webpack.config.js" 37 | } 38 | }, 39 | "start-remote": { 40 | "executor": "@nx/webpack:dev-server", 41 | "dependsOn": ["prestart-remote"], 42 | "options": { 43 | "buildTarget": "html-tinymce5:build", 44 | "webpackConfig": "demos/html/tinymce5/webpack.config.js" 45 | } 46 | }, 47 | "lint": { 48 | "executor": "@nx/linter:eslint", 49 | "options": { 50 | "eslintConfig": "./.eslintrc.js", 51 | "lintFilePatterns": ["demos/html/tinymce5/**/*.{ts,tsx,js,jsx}"] 52 | }, 53 | "outputs": ["{options.outputFile}"] 54 | } 55 | } 56 | } 57 | -------------------------------------------------------------------------------- /demos/html/tinymce5/src/static/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: #e4e6e7; 3 | } 4 | 5 | .tox { 6 | background-color: #fff !important; 7 | border-radius: 10px; 8 | margin: 0 auto !important; 9 | max-width: 750px !important; 10 | width: 75% !important; 11 | min-height: 300px; 12 | } 13 | 14 | .tox:hover { 15 | box-shadow: 0 0 10px #7af78f; 16 | } 17 | 18 | .tox-silver-sink { 19 | display: none; 20 | } 21 | 22 | #editor_ifr { 23 | min-height: 200px; 24 | } 25 | -------------------------------------------------------------------------------- /demos/html/tinymce6/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | [ 4 | "@babel/preset-env", 5 | { 6 | targets: { 7 | node: "current", 8 | }, 9 | }, 10 | ], 11 | ], 12 | }; 13 | -------------------------------------------------------------------------------- /demos/html/tinymce6/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Demo TinyMCE 6 on HTML 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /demos/html/tinymce6/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "demo-html-tinymce6", 3 | "version": "1.1.0", 4 | "private": true, 5 | "description": "A simple html App integrating WIRIS MathType in a TinyMCE6 rich text editor.", 6 | "main": "app.js", 7 | "scripts": { 8 | "prestart-remote": "yarn && yarn unlink @wiris/mathtype-tinymce6 && yarn unlink @wiris/mathtype-html-integration-devkit && yarn install --force", 9 | "prestart": "yarn && yarn link @wiris/mathtype-tinymce6 && yarn link @wiris/mathtype-html-integration-devkit" 10 | }, 11 | "author": "WIRIS Team (https://www.wiris.com)", 12 | "license": "MIT", 13 | "dependencies": { 14 | "@wiris/mathtype-html-integration-devkit": "*", 15 | "@wiris/mathtype-tinymce6": "*", 16 | "tinymce": "^6.0.0" 17 | }, 18 | "devDependencies": { 19 | "copy-webpack-plugin": "^12.0.2", 20 | "css-loader": "^7.1.0", 21 | "html-loader": "^5.0.0", 22 | "style-loader": "^4.0.0", 23 | "webpack": "^5.75.0", 24 | "webpack-cli": "^5.0.0", 25 | "webpack-dev-server": "^5.0.4", 26 | "resources": "file:../../../packages/res" 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /demos/html/tinymce6/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "html-tinymce6", 3 | "$schema": "../../../node_modules/nx/schemas/project-schema.json", 4 | "sourceRoot": "demos/html/tinymce6/src", 5 | "targets": { 6 | "prestart": { 7 | "executor": "nx:run-script", 8 | "options": { 9 | "script": "prestart" 10 | } 11 | }, 12 | "prestart-remote": { 13 | "executor": "nx:run-script", 14 | "options": { 15 | "script": "prestart-remote" 16 | } 17 | }, 18 | "build": { 19 | "executor": "@nx/webpack:webpack", 20 | "dependsOn": ["prestart"], 21 | "outputs": ["{options.outputPath}"], 22 | "options": { 23 | "main": "demos/html/tinymce6/src/app.js", 24 | "outputPath": "dist", 25 | "tsConfig": "tsconfig.app.json", 26 | "generateIndexHtml": false, 27 | "index": "demos/html/tinymce6/index.html", 28 | "webpackConfig": "demos/html/tinymce6/webpack.config.js" 29 | } 30 | }, 31 | "start": { 32 | "executor": "@nx/webpack:dev-server", 33 | "dependsOn": ["prestart"], 34 | "options": { 35 | "buildTarget": "html-tinymce6:build", 36 | "webpackConfig": "demos/html/tinymce6/webpack.config.js" 37 | } 38 | }, 39 | "start-remote": { 40 | "executor": "@nx/webpack:dev-server", 41 | "dependsOn": ["prestart-remote"], 42 | "options": { 43 | "buildTarget": "html-tinymce6:build", 44 | "webpackConfig": "demos/html/tinymce6/webpack.config.js" 45 | } 46 | }, 47 | "lint": { 48 | "executor": "@nx/linter:eslint", 49 | "options": { 50 | "eslintConfig": "./.eslintrc.js", 51 | "lintFilePatterns": ["demos/html/tinymce6/**/*.{ts,tsx,js,jsx}"] 52 | }, 53 | "outputs": ["{options.outputFile}"] 54 | } 55 | } 56 | } 57 | -------------------------------------------------------------------------------- /demos/html/tinymce6/src/static/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: #e4e6e7; 3 | } 4 | 5 | .tox { 6 | background-color: #fff !important; 7 | border-radius: 10px; 8 | margin: 0 auto !important; 9 | max-width: 750px !important; 10 | width: 75% !important; 11 | } 12 | 13 | .tox:hover { 14 | box-shadow: 0 0 10px #7af78f; 15 | } 16 | 17 | #editor_ifr { 18 | min-height: 200px; 19 | } 20 | -------------------------------------------------------------------------------- /demos/html/tinymce7/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | [ 4 | "@babel/preset-env", 5 | { 6 | targets: { 7 | node: "current", 8 | }, 9 | }, 10 | ], 11 | ], 12 | }; 13 | -------------------------------------------------------------------------------- /demos/html/tinymce7/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Demo TinyMCE 7 on HTML 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /demos/html/tinymce7/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "demo-html-tinymce7", 3 | "version": "1.0.0", 4 | "private": true, 5 | "description": "A simple html App integrating WIRIS MathType in a TinyMCE7 rich text editor.", 6 | "main": "app.js", 7 | "scripts": { 8 | "prestart-remote": "yarn && yarn unlink @wiris/mathtype-tinymce7 && yarn unlink @wiris/mathtype-html-integration-devkit && yarn install --force", 9 | "prestart": "yarn && yarn link @wiris/mathtype-tinymce7 && yarn link @wiris/mathtype-html-integration-devkit" 10 | }, 11 | "author": "WIRIS Team (https://www.wiris.com)", 12 | "license": "MIT", 13 | "dependencies": { 14 | "@wiris/mathtype-html-integration-devkit": "*", 15 | "@wiris/mathtype-tinymce7": "*", 16 | "tinymce": "^7.7.0" 17 | }, 18 | "devDependencies": { 19 | "copy-webpack-plugin": "^12.0.2", 20 | "css-loader": "^7.1.0", 21 | "html-loader": "^5.0.0", 22 | "style-loader": "^4.0.0", 23 | "webpack": "^5.75.0", 24 | "webpack-cli": "^5.0.0", 25 | "webpack-dev-server": "^5.0.4", 26 | "resources": "file:../../../packages/res" 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /demos/html/tinymce7/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "html-tinymce7", 3 | "$schema": "../../../node_modules/nx/schemas/project-schema.json", 4 | "sourceRoot": "demos/html/tinymce7/src", 5 | "targets": { 6 | "prestart": { 7 | "executor": "nx:run-script", 8 | "options": { 9 | "script": "prestart" 10 | } 11 | }, 12 | "prestart-remote": { 13 | "executor": "nx:run-script", 14 | "options": { 15 | "script": "prestart-remote" 16 | } 17 | }, 18 | "build": { 19 | "executor": "@nx/webpack:webpack", 20 | "dependsOn": ["prestart"], 21 | "outputs": ["{options.outputPath}"], 22 | "options": { 23 | "main": "demos/html/tinymce7/src/app.js", 24 | "outputPath": "dist", 25 | "tsConfig": "tsconfig.app.json", 26 | "generateIndexHtml": false, 27 | "index": "demos/html/tinymce7/index.html", 28 | "webpackConfig": "demos/html/tinymce7/webpack.config.js" 29 | } 30 | }, 31 | "start": { 32 | "executor": "@nx/webpack:dev-server", 33 | "dependsOn": ["prestart"], 34 | "options": { 35 | "buildTarget": "html-tinymce7:build", 36 | "webpackConfig": "demos/html/tinymce7/webpack.config.js" 37 | } 38 | }, 39 | "start-remote": { 40 | "executor": "@nx/webpack:dev-server", 41 | "dependsOn": ["prestart-remote"], 42 | "options": { 43 | "buildTarget": "html-tinymce7:build", 44 | "webpackConfig": "demos/html/tinymce7/webpack.config.js" 45 | } 46 | }, 47 | "lint": { 48 | "executor": "@nx/linter:eslint", 49 | "options": { 50 | "eslintConfig": "./.eslintrc.js", 51 | "lintFilePatterns": ["demos/html/tinymce7/**/*.{ts,tsx,js,jsx}"] 52 | }, 53 | "outputs": ["{options.outputFile}"] 54 | } 55 | } 56 | } 57 | -------------------------------------------------------------------------------- /demos/html/tinymce7/src/static/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: #e4e6e7; 3 | } 4 | 5 | .tox { 6 | background-color: #fff !important; 7 | border-radius: 10px; 8 | margin: 0 auto !important; 9 | max-width: 750px !important; 10 | width: 75% !important; 11 | } 12 | 13 | .tox:hover { 14 | box-shadow: 0 0 10px #7af78f; 15 | } 16 | 17 | #editor_ifr { 18 | min-height: 200px; 19 | } 20 | -------------------------------------------------------------------------------- /demos/html/viewer/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "demo-html-viewer", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "", 6 | "scripts": { 7 | "prestart-remote": "yarn && yarn unlink @wiris/mathtype-viewer && yarn unlink @wiris/mathtype-html-integration-devkit && yarn install --force", 8 | "prestart": "yarn && yarn link @wiris/mathtype-viewer && yarn link @wiris/mathtype-html-integration-devkit", 9 | "start": "yarn serve" 10 | }, 11 | "keywords": [], 12 | "author": "", 13 | "license": "ISC", 14 | "dependencies": { 15 | "@wiris/mathtype-html-integration-devkit": "*", 16 | "@wiris/mathtype-viewer": "*" 17 | }, 18 | "devDependencies": { 19 | "serve": "^14.2.0", 20 | "resources": "file:../../../packages/res" 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /demos/html/viewer/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "html-viewer", 3 | "$schema": "../../../node_modules/nx/schemas/project-schema.json", 4 | "sourceRoot": "demos/html/viewer", 5 | "targets": { 6 | "prestart": { 7 | "executor": "nx:run-script", 8 | "options": { 9 | "script": "prestart" 10 | } 11 | }, 12 | "prestart-remote": { 13 | "executor": "nx:run-script", 14 | "options": { 15 | "script": "prestart-remote" 16 | } 17 | }, 18 | "start": { 19 | "executor": "@nx/webpack:dev-server", 20 | "dependsOn": ["prestart"], 21 | "options": { 22 | "buildTarget": "html-viewer:build", 23 | "webpackConfig": "demos/html/viewer/webpack.config.js" 24 | } 25 | }, 26 | "start-remote": { 27 | "executor": "@nx/web:file-server", 28 | "dependsOn": ["prestart-remote"], 29 | "options": { 30 | "buildTarget": "viewer:build" 31 | } 32 | }, 33 | "build": { 34 | "executor": "@nx/webpack:webpack", 35 | "dependsOn": ["viewer:build", "prestart"], 36 | "options": { 37 | "main": "demos/html/viewer/src/app.js", 38 | "outputPath": "dist", 39 | "tsConfig": "tsconfig.app.json", 40 | "generateIndexHtml": false, 41 | "index": "demos/html/viewer/index.html", 42 | "webpackConfig": "demos/html/viewer/webpack.config.js" 43 | } 44 | }, 45 | "lint": { 46 | "executor": "@nx/linter:eslint", 47 | "options": { 48 | "eslintConfig": "./.eslintrc.js", 49 | "lintFilePatterns": ["demos/html/viewer/**/*.{ts,tsx,js,jsx}"] 50 | }, 51 | "outputs": ["{options.outputFile}"] 52 | } 53 | } 54 | } 55 | -------------------------------------------------------------------------------- /demos/html/viewer/src/app.js: -------------------------------------------------------------------------------- 1 | import git from "resources/git-data.json"; 2 | import "./static/style.css"; 3 | 4 | document.addEventListener("DOMContentLoaded", () => { 5 | document.getElementById("content").value = document.getElementsByTagName("main")[0].innerHTML; 6 | document.getElementById("git_commit").innerText = git.hash; 7 | }); 8 | 9 | // Show the version number of the viewer 10 | fetch("node_modules/@wiris/mathtype-viewer/package.json") 11 | .then((response) => response.json()) 12 | .then(({ version }) => { 13 | document.getElementById("version").innerText = version; 14 | }); 15 | 16 | document.getElementById("viewer_form").addEventListener("submit", () => { 17 | event.preventDefault(); // eslint-disable-line no-restricted-globals 18 | // Accessing form data using the event object 19 | const formData = new FormData(event.target); // eslint-disable-line no-restricted-globals 20 | 21 | const config = { 22 | backendConfig: { 23 | wiriseditormathmlattribute: wiriseditormathmlattribute.value, 24 | wirispluginperformance: wirispluginperformance.checked ? "true" : "false", 25 | }, 26 | dpi: dpi.value, 27 | editorServicesExtension: "", 28 | editorServicesRoot: editorServicesRoot.value, 29 | element: element.value, 30 | lang: lang.value, 31 | viewer: viewer.value, 32 | zoom: zoom.value, 33 | }; 34 | 35 | window.viewer.properties.config = config; 36 | 37 | document.getElementsByTagName("main")[0].innerHTML = document.getElementById("content").value; 38 | window.com.wiris.js.JsPluginViewer.parseElement(document.getElementsByTagName("main")[0]); 39 | }); 40 | -------------------------------------------------------------------------------- /demos/html/viewer/src/static/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: sans-serif; 3 | } 4 | 5 | input[type="text"], 6 | select, 7 | textarea { 8 | width: 100%; 9 | padding: 12px 20px; 10 | margin: 8px 0; 11 | display: inline-block; 12 | border: 1px solid #ccc; 13 | border-radius: 4px; 14 | box-sizing: border-box; 15 | } 16 | 17 | textarea { 18 | height: 130px; 19 | } 20 | 21 | main { 22 | margin-left: 1em; 23 | } 24 | 25 | input[type="checkbox"] { 26 | height: 25px; 27 | width: 25px; 28 | text-align: center; 29 | padding: 10px; 30 | } 31 | 32 | button { 33 | width: 100%; 34 | background-color: #4caf50; 35 | color: white; 36 | font-weight: bold; 37 | margin-top: 1em; 38 | padding: 1em; 39 | border: none; 40 | border-radius: 4px; 41 | cursor: pointer; 42 | } 43 | 44 | form { 45 | float: right; 46 | border: 1px solid darkgrey; 47 | padding: 2em; 48 | margin: 1em; 49 | border-radius: 5px; 50 | max-width: 650px; 51 | box-shadow: lightgray 0 0 5px 5px; 52 | } 53 | 54 | .title { 55 | margin: 0; 56 | } 57 | 58 | .form-container { 59 | margin-top: 2em; 60 | display: grid; 61 | grid-template-columns: 1fr 1fr; 62 | grid-gap: 2em; 63 | } 64 | 65 | .checkbox-container { 66 | display: flex; 67 | align-items: center; 68 | gap: 1em; 69 | } 70 | 71 | .column { 72 | display: grid; 73 | grid-auto-rows: 1fr; 74 | grid-gap: 0.5em; 75 | } 76 | 77 | .mathml-container { 78 | float: left; 79 | } 80 | -------------------------------------------------------------------------------- /demos/html/viewer/webpack.config.js: -------------------------------------------------------------------------------- 1 | const path = require("path"); 2 | 3 | module.exports = (config, context) => { 4 | return { 5 | entry: { 6 | app: path.resolve(__dirname, "src/app.js"), 7 | }, 8 | output: { 9 | path: path.resolve(__dirname, "dist"), 10 | filename: "demo.js", 11 | }, 12 | devServer: { 13 | devMiddleware: { 14 | writeToDisk: true, 15 | }, 16 | static: { 17 | directory: path.join(__dirname, "./"), 18 | }, 19 | onListening: !config.devServer ? "" : config.devServer.onListening, 20 | open: true, 21 | port: 8009, 22 | hot: true, 23 | host: "0.0.0.0", 24 | }, 25 | // Set watch to true for dev purposes. 26 | watch: false, 27 | mode: "none", 28 | module: { 29 | rules: [ 30 | { 31 | // Rule to translate ES5 javascript files to ES6. 32 | test: /\.js$/, 33 | exclude: 34 | /node_modules\/(?!(@wiris\/mathtype-html-integration-devkit)\/).*/, 35 | use: { 36 | loader: "babel-loader", 37 | options: { 38 | presets: ["@babel/env"], 39 | }, 40 | }, 41 | }, 42 | { 43 | test: /\.css$/, 44 | use: ["style-loader", "css-loader"], 45 | }, 46 | { 47 | test: /\.(png|jpg|gif)$/i, 48 | type: "asset/inline", 49 | }, 50 | { 51 | // For the modal close, minimize, maximize icons 52 | test: /\.svg$/, 53 | type: "asset/source", 54 | }, 55 | { 56 | test: /\.html$/i, 57 | exclude: /node_modules/, 58 | loader: "html-loader", 59 | }, 60 | ], 61 | }, 62 | stats: { 63 | colors: true, 64 | }, 65 | experiments: { 66 | topLevelAwait: true, 67 | asyncWebAssembly: true, 68 | }, 69 | }; 70 | }; 71 | -------------------------------------------------------------------------------- /demos/vue/ckeditor5/.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | 10 | node_modules 11 | .DS_Store 12 | dist 13 | dist-ssr 14 | coverage 15 | *.local 16 | 17 | /cypress/videos/ 18 | /cypress/screenshots/ 19 | 20 | # Editor directories and files 21 | .vscode/* 22 | !.vscode/extensions.json 23 | .idea 24 | *.suo 25 | *.ntvs* 26 | *.njsproj 27 | *.sln 28 | *.sw? 29 | -------------------------------------------------------------------------------- /demos/vue/ckeditor5/env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /demos/vue/ckeditor5/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Vite App 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /demos/vue/ckeditor5/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "demo-vue-ckeditor5", 3 | "version": "0.0.0", 4 | "private": true, 5 | "scripts": { 6 | "prestart-remote": "yarn && yarn unlink @wiris/mathtype-ckeditor5 && yarn unlink @wiris/mathtype-html-integration-devkit && yarn install --force", 7 | "start-remote": "vite", 8 | "prestart": "yarn && yarn link @wiris/mathtype-ckeditor5 && yarn link @wiris/mathtype-html-integration-devkit", 9 | "start": "vite", 10 | "build": "run-p type-check build-only", 11 | "preview": "vite preview", 12 | "build-only": "vite build", 13 | "type-check": "vue-tsc --noEmit -p tsconfig.app.json --composite false" 14 | }, 15 | "dependencies": { 16 | "@ckeditor/ckeditor5-vue": "^5.1.0", 17 | "@ckeditor/vite-plugin-ckeditor5": "^0.1.3", 18 | "ckeditor5": ">=42.0.0", 19 | "@wiris/mathtype-ckeditor5": "*", 20 | "@wiris/mathtype-html-integration-devkit": "*", 21 | "vue": "^3.3.4" 22 | }, 23 | "devDependencies": { 24 | "@tsconfig/node18": "^2.0.1", 25 | "@types/node": "^18.16.17", 26 | "@vitejs/plugin-vue": "^4.2.3", 27 | "@vue/tsconfig": "^0.4.0", 28 | "npm-run-all": "^4.1.5", 29 | "resources": "file:../../../packages/res", 30 | "typescript": "~5.0.4", 31 | "vite": "^4.3.9", 32 | "vite-plugin-string": "^1.2.1", 33 | "vue-tsc": "^1.6.5" 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /demos/vue/ckeditor5/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vue-ckeditor5", 3 | "$schema": "../../../node_modules/nx/schemas/project-schema.json", 4 | "sourceRoot": "demos/vue/ckeditor5/src", 5 | "targets": { 6 | "start": { 7 | "executor": "nx:run-script", 8 | "options": { 9 | "script": "start" 10 | }, 11 | "outputs": ["{projectRoot}/dist/demo.js"] 12 | }, 13 | "start-remote": { 14 | "executor": "nx:run-script", 15 | "options": { 16 | "script": "start-remote" 17 | }, 18 | "outputs": ["{projectRoot}/dist/demo.js"] 19 | }, 20 | "build": { 21 | "executor": "nx:run-script", 22 | "options": { 23 | "script": "build" 24 | }, 25 | "outputs": ["{projectRoot}/dist/demo.js"] 26 | } 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /demos/vue/ckeditor5/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/demos/vue/ckeditor5/public/favicon.ico -------------------------------------------------------------------------------- /demos/vue/ckeditor5/src/assets/css/main.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: #e4e6e7; 3 | } 4 | 5 | .ck-editor { 6 | background-color: #fff !important; 7 | border-radius: 10px !important; 8 | margin: 0 auto !important; 9 | max-width: 760px !important; 10 | width: 100% !important; 11 | } 12 | 13 | .ck-editor:hover { 14 | box-shadow: 0 0 10px #7af78f; 15 | } 16 | 17 | .ck-content { 18 | border-bottom-left-radius: 10px; 19 | border-bottom-right-radius: 10px; 20 | min-height: 250px; 21 | } 22 | 23 | .ck-rounded-corners, 24 | .ck.ck-editor__editable:not(.ck-editor__nested-editable), 25 | .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-rounded-corners { 26 | border-bottom-left-radius: 10px !important; 27 | border-bottom-right-radius: 10px !important; 28 | } 29 | -------------------------------------------------------------------------------- /demos/vue/ckeditor5/src/main.ts: -------------------------------------------------------------------------------- 1 | import { createApp } from "vue"; 2 | import App from "./App.vue"; 3 | import CKEditor from "@ckeditor/ckeditor5-vue"; 4 | import "./assets/css/main.css"; 5 | 6 | createApp(App).use(CKEditor).mount("#editor"); 7 | -------------------------------------------------------------------------------- /demos/vue/ckeditor5/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "@vue/tsconfig/tsconfig.dom.json", 3 | "include": ["env.d.ts", "src/**/*", "src/**/*.vue"], 4 | "exclude": ["src/**/__tests__/*"], 5 | "compilerOptions": { 6 | "composite": true, 7 | "baseUrl": ".", 8 | "paths": { 9 | "@/*": ["./src/*"] 10 | } 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /demos/vue/ckeditor5/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "files": [], 3 | "references": [ 4 | { 5 | "path": "./tsconfig.node.json" 6 | }, 7 | { 8 | "path": "./tsconfig.app.json" 9 | } 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /demos/vue/ckeditor5/tsconfig.node.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "@tsconfig/node18/tsconfig.json", 3 | "include": ["vite.config.*", "vitest.config.*", "nightwatch.conf.*", "playwright.config.*"], 4 | "compilerOptions": { 5 | "composite": true, 6 | "module": "ESNext", 7 | "types": ["node"] 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /demos/vue/ckeditor5/vite.config.ts: -------------------------------------------------------------------------------- 1 | import { fileURLToPath, URL } from "node:url"; 2 | import { defineConfig } from "vite"; 3 | import vue from "@vitejs/plugin-vue"; 4 | 5 | export default defineConfig({ 6 | base: "./", 7 | plugins: [vue()], 8 | resolve: { 9 | alias: { 10 | "@": fileURLToPath(new URL("./src", import.meta.url)), 11 | }, 12 | }, 13 | optimizeDeps: { 14 | exclude: ["@wiris/mathtype-html-integration-devkit", "resources"], 15 | }, 16 | }); 17 | -------------------------------------------------------------------------------- /docs/adr/002-Longevity--senderId--sessionId--Telemetry.md: -------------------------------------------------------------------------------- 1 | # 002. Longevity of senderId and sessionId in Telemetry 2 | 3 | Date: 2020-06-26 4 | 5 | ## Status 6 | 7 | ACCEPTED 8 | 9 | ## Summary 10 | 11 | _When sending Telemetry data_ 12 | _session & sender ids are used._ 13 | _The Telemetry documentation does not specify the longevity of these ids._ 14 | _We have decided to extend the sender id to last between page loads_ 15 | _and the session id to last exactly one page load._ 16 | 17 | ## Context (Discussion) 18 | 19 | Reading the Telemetry documentation proposed by the Data Science team, we have 20 | encountered that the sender and session ids are not concretely defined for each 21 | product. 22 | 23 | In the case of MathType web, there could be various interpretations, e.g. 24 | 25 | - senderId: changes on page load. 26 | - sessionId: changes on opening MathType. 27 | 28 | ## Decision 29 | 30 | We asked the Data Science team and finally settled on the following interpretation: 31 | 32 | - senderId: ideally lasts for ever. In practice, should at least last in a same web session, across page loads. 33 | - sessionId: changes on page load. 34 | 35 | ### Pros and Cons of the Options 36 | 37 | #### Change senderId on page load and sessionId on opening MathType 38 | 39 | - Bad, because it does not truly identify individual users. 40 | 41 | #### Keep senderId and change sessionId on page load 42 | 43 | - Good, because it better represents individual users. 44 | - Bad, because it's hard to keep permanent data on the client's browser. 45 | 46 | ## Consequences (Results) 47 | 48 | We intend to use some form of local storage (e.g. cookies) to keep the assigned 49 | senderId of each client on their computer. 50 | 51 | This doesn't take into account e.g. using different browsers or not keeping cookies, 52 | but it should be good enough to cover most of the cases. 53 | -------------------------------------------------------------------------------- /docs/development/README.md: -------------------------------------------------------------------------------- 1 | # Development guide 2 | 3 | [MathType Web Integrations](../../README.md) → [Documentation](../README.md) → Development guide 4 | 5 | - [Compiling the packages](compiling/README.md) 6 | - [Trying out the demos in development mode](demos/README.md) 7 | - [Linting](linting/README.md) 8 | - [Testing](testing/README.md) 9 | - [CI/CD](cicd/README.md) 10 | - [Packaging](packaging/README.md) 11 | -------------------------------------------------------------------------------- /docs/development/packaging/README.md: -------------------------------------------------------------------------------- 1 | # Packaging 2 | 3 | [MathType Web Integrations](../../../README.md) → [Documentation](../../README.md) → [Development guide](../README.md) → Packaging 4 | 5 | Each editor plugin that is distributed built (e.g. those that include a `webpack.config.js` file) must have a `prepack` [npm lifecycle script](https://docs.npmjs.com/misc/scripts), which is run BEFORE a tarball is packed (on `yarn pack`, `yarn publish`, and when installing git dependencies). 6 | 7 | This script should build the package (generally by calling `yarn run build`). 8 | As a special case, the TinyMCE plugins call the `services/compile.js` script because they need to have the source replaced before building. 9 | -------------------------------------------------------------------------------- /docs/development/testing/README.md: -------------------------------------------------------------------------------- 1 | # Testing 2 | 3 | [MathType Web Integrations](../../../README.md) → [Documentation](../../README.md) → [Development guide](../README.md) → Testing 4 | 5 | This project uses [Cypress][Cypress] to run integration and validation tests in order to cover all published packages. 6 | 7 | [Cypress]: https://www.cypress.io/ 8 | 9 | ## Table of contents 10 | 11 | - [Run all tests at once](#run-all-tests-at-once) 12 | - [Run all the tests for a specific demo](#run-all-the-tests-for-a-specific-demo) 13 | 14 | ## Before you begin 15 | 16 | Linux users will need to install `net-tools` to use Cypress. 17 | 18 | ```bash 19 | $ sudo apt install net-tools 20 | ``` 21 | 22 | Also, you will need to allow non-local connections to control the X server on your computer. 23 | 24 | Run this command: 25 | 26 | ```bash 27 | $ xhost local:root 28 | ``` 29 | 30 | > This has to be executed once after each reboot 31 | 32 | ## Run all tests at once 33 | 34 | Before running the tests you will need to build all package and start all demos. 35 | 36 | All tests can be run with the commands: 37 | 38 | ```sh 39 | $ nx run-many --target=start --all --parallel 40 | $ nx run-many --target=test --all --parallel 41 | ``` 42 | 43 | ## Run all the tests for a specific demo 44 | 45 | You can run all tests for a specific demo with the `nx test ` command. 46 | 47 | Before running the tests you will need to build the package and start a demo. For example to run all tests on the `ckeditor5` demo run: 48 | 49 | ``` 50 | $ nx start html-ckeditor5 51 | $ nx test ckeditor5 52 | ``` 53 | -------------------------------------------------------------------------------- /docs/img/mathtype_logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/docs/img/mathtype_logo.png -------------------------------------------------------------------------------- /docs/img/wiris_plugin_example.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/docs/img/wiris_plugin_example.png -------------------------------------------------------------------------------- /docs/integration/README.md: -------------------------------------------------------------------------------- 1 | # Integrating MathType in your website 2 | 3 | [MathType Web Integrations](../../README.md) → [Documentation](../README.md) → Integrating MathType in your website 4 | 5 | To integrate MathType on your website, take a look at the [demos](../demos/README.md) we have prepared. 6 | In the case of Vue, each of the demos contains a README.md file explaining how MathType has been integrated. 7 | -------------------------------------------------------------------------------- /nx.json: -------------------------------------------------------------------------------- 1 | { 2 | "targetDefaults": { 3 | "build": { 4 | "dependsOn": ["^build"], 5 | "inputs": ["production", "^production"] 6 | }, 7 | "lint": { 8 | "inputs": ["default", "{workspaceRoot}/.eslintrc.js"], 9 | "cache": true 10 | }, 11 | "test": { 12 | "inputs": ["default", "^production"], 13 | "cache": true 14 | }, 15 | "e2e": { 16 | "cache": true 17 | } 18 | }, 19 | "extends": "@nx/workspace/presets/core.json", 20 | "tasksRunnerOptions": { 21 | "default": { 22 | "options": { 23 | "runtimeCacheInputs": ["echo $SERVICE_PROVIDER_URI", "echo $SERVICE_PROVIDER_SERVER"] 24 | } 25 | } 26 | }, 27 | "namedInputs": { 28 | "default": ["{projectRoot}/**/*", "sharedGlobals"], 29 | "sharedGlobals": ["{workspaceRoot}/babel.config.js"], 30 | "production": ["default", "!{projectRoot}/.eslintrc.js"] 31 | }, 32 | "nxCloudAccessToken": "MmY2Mjc3ZWYtOTlhZC00Mjg4LWE4MjQtYjU0MGJkYzdlNjk1fHJlYWQtd3JpdGU=", 33 | "defaultBase": "main" 34 | } 35 | -------------------------------------------------------------------------------- /packages/ckeditor4/.gitignore: -------------------------------------------------------------------------------- 1 | plugin.js -------------------------------------------------------------------------------- /packages/ckeditor4/global.js: -------------------------------------------------------------------------------- 1 | import Core from "@wiris/mathtype-html-integration-devkit/src/core.src"; 2 | import Parser from "@wiris/mathtype-html-integration-devkit/src/parser"; 3 | import Util from "@wiris/mathtype-html-integration-devkit/src/util"; 4 | import Image from "@wiris/mathtype-html-integration-devkit/src/image"; 5 | import Configuration from "@wiris/mathtype-html-integration-devkit/src/configuration"; 6 | import Listeners from "@wiris/mathtype-html-integration-devkit/src/listeners"; 7 | import "@wiris/mathtype-html-integration-devkit/src/backwardslib"; 8 | import "@wiris/mathtype-html-integration-devkit/src/polyfills"; 9 | import IntegrationModel from "@wiris/mathtype-html-integration-devkit/src/integrationmodel"; 10 | import Latex from "@wiris/mathtype-html-integration-devkit/src/latex"; 11 | import Test from "@wiris/mathtype-html-integration-devkit/src/test"; 12 | import { CKEditor4Integration, instances, currentInstance } from "./plugin.src"; 13 | 14 | // Expose WirisPlugin variable to the window. 15 | window.WirisPlugin = { 16 | Core, 17 | Parser, 18 | Image, 19 | Util, 20 | Configuration, 21 | Listeners, 22 | IntegrationModel, 23 | currentInstance, 24 | instances, 25 | CKEditor4Integration, 26 | Latex, 27 | Test, 28 | }; 29 | -------------------------------------------------------------------------------- /packages/ckeditor4/icons/cas.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/ckeditor4/icons/cas.png -------------------------------------------------------------------------------- /packages/ckeditor4/icons/chem.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/ckeditor4/icons/chem.png -------------------------------------------------------------------------------- /packages/ckeditor4/icons/formula.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/ckeditor4/icons/formula.png -------------------------------------------------------------------------------- /packages/ckeditor4/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@wiris/mathtype-ckeditor4", 3 | "version": "8.13.1", 4 | "description": "MathType Web for CKEditor4 editor", 5 | "keywords": [ 6 | "chem", 7 | "chemistry", 8 | "chemtype", 9 | "ckeditor", 10 | "ckeditor4", 11 | "editor", 12 | "equation", 13 | "latex", 14 | "math", 15 | "mathml", 16 | "maths", 17 | "mathtype", 18 | "wiris" 19 | ], 20 | "repository": "https://github.com/wiris/html-integrations/tree/master/packages/ckeditor4", 21 | "homepage": "https://www.wiris.com/?utm_source=npmjs&utm_medium=referral", 22 | "bugs": { 23 | "email": "support@wiris.com" 24 | }, 25 | "license": "MIT", 26 | "author": "WIRIS Team (https://www.wiris.com/?utm_source=npmjs&utm_medium=referral)", 27 | "main": "plugin.js", 28 | "scripts": { 29 | "build": "webpack --mode production", 30 | "build-dev": "webpack --mode development", 31 | "clean": "shx rm -f plugin.js", 32 | "prepack": "yarn && npm run build" 33 | }, 34 | "dependencies": { 35 | "@wiris/mathtype-html-integration-devkit": "1.17.8" 36 | }, 37 | "devDependencies": { 38 | "@babel/core": "^7.24.4", 39 | "@babel/preset-env": "^7.24.4", 40 | "babel-loader": "^9.1.3", 41 | "css-loader": "^7.1.0", 42 | "shx": "^0.3.4", 43 | "style-loader": "^4.0.0", 44 | "terser-webpack-plugin": "^5.3.10" 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /packages/ckeditor4/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ckeditor4", 3 | "$schema": "../../node_modules/nx/schemas/project-schema.json", 4 | "sourceRoot": "package/ckeditor4/src", 5 | "targets": { 6 | "build": { 7 | "executor": "@nx/webpack:webpack", 8 | "dependsOn": [], 9 | "outputs": ["{options.outputPath}"], 10 | "options": { 11 | "main": "demos/packages/ckeditor4/global.js", 12 | "outputPath": "dist", 13 | "tsConfig": "tsconfig.app.json", 14 | "generateIndexHtml": false, 15 | "index": " ", 16 | "webpackConfig": "packages/ckeditor4/webpack.config.js" 17 | } 18 | }, 19 | "start": { 20 | "executor": "@nx/webpack:dev-server", 21 | "options": { 22 | "buildTarget": "ckeditor4:build", 23 | "webpackConfig": "packages/ckeditor4/webpack.config.js" 24 | } 25 | }, 26 | "test": { 27 | "executor": "@nx/cypress:cypress", 28 | "dependsOn": ["build"], 29 | "options": { 30 | "baseUrl": "http://localhost:8001", 31 | "cypressConfig": "./cypress.json" 32 | } 33 | }, 34 | "lint": { 35 | "executor": "@nx/linter:eslint", 36 | "options": { 37 | "eslintConfig": "./.eslintrc.js", 38 | "lintFilePatterns": ["packages/ckeditor4/**/*.{ts,tsx,js,jsx}"] 39 | }, 40 | "outputs": ["{options.outputFile}"] 41 | } 42 | } 43 | } 44 | -------------------------------------------------------------------------------- /packages/ckeditor5/.gitignore: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /packages/ckeditor5/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | [ 4 | "@babel/preset-env", 5 | { 6 | targets: { 7 | node: "current", 8 | }, 9 | }, 10 | ], 11 | ], 12 | }; 13 | -------------------------------------------------------------------------------- /packages/ckeditor5/dist/browser/index-content.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/ckeditor5/dist/browser/index-content.css -------------------------------------------------------------------------------- /packages/ckeditor5/dist/browser/telemeter_wasm_bg.wasm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/ckeditor5/dist/browser/telemeter_wasm_bg.wasm -------------------------------------------------------------------------------- /packages/ckeditor5/dist/index-content.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/ckeditor5/dist/index-content.css -------------------------------------------------------------------------------- /packages/ckeditor5/dist/index-editor.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/ckeditor5/dist/index-editor.css -------------------------------------------------------------------------------- /packages/ckeditor5/dist/index.css: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/ckeditor5/dist/index.css -------------------------------------------------------------------------------- /packages/ckeditor5/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@wiris/mathtype-ckeditor5", 3 | "version": "8.13.1", 4 | "description": "MathType Web for CKEditor5 editor", 5 | "keywords": [ 6 | "chem", 7 | "chemistry", 8 | "chemtype", 9 | "ckeditor", 10 | "ckeditor5", 11 | "editor", 12 | "equation", 13 | "latex", 14 | "math", 15 | "mathml", 16 | "maths", 17 | "mathtype", 18 | "wiris" 19 | ], 20 | "repository": "https://github.com/wiris/html-integrations/tree/master/packages/ckeditor5", 21 | "homepage": "https://www.wiris.com/", 22 | "bugs": { 23 | "email": "support@wiris.com" 24 | }, 25 | "license": "MIT", 26 | "author": "WIRIS Team (http://www.wiris.com)", 27 | "files": [ 28 | "dist", 29 | "src", 30 | "icons", 31 | "theme", 32 | "lang" 33 | ], 34 | "main": "src/plugin.js", 35 | "type": "module", 36 | "exports": { 37 | ".": "./src/plugin.js", 38 | "./dist/*": "./dist/*", 39 | "./browser/*": null, 40 | "./src/*": "./src/*", 41 | "./theme/*": "./theme/*", 42 | "./package.json": "./package.json" 43 | }, 44 | "scripts": { 45 | "set-telemeter": "cp ../devkit/telemeter-wasm/telemeter_wasm_bg.wasm dist/browser/telemeter_wasm_bg.wasm", 46 | "build": "node ./scripts/build-dist.mjs && npm run set-telemeter", 47 | "build:dist": "node ./scripts/build-dist.mjs && npm run set-telemeter", 48 | "prepare": "npm run build:dist" 49 | }, 50 | "dependencies": { 51 | "@wiris/mathtype-html-integration-devkit": "1.17.8" 52 | }, 53 | "devDependencies": { 54 | "@ckeditor/ckeditor5-dev-build-tools": "^42.1.0" 55 | }, 56 | "peerDependencies": { 57 | "ckeditor5": ">=43.0.0" 58 | } 59 | } 60 | -------------------------------------------------------------------------------- /packages/ckeditor5/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ckeditor5", 3 | "$schema": "../../node_modules/nx/schemas/project-schema.json", 4 | "targets": { 5 | "test": { 6 | "executor": "@nx/cypress:cypress", 7 | "options": { 8 | "baseUrl": "http://localhost:8002", 9 | "cypressConfig": "./cypress.json" 10 | } 11 | }, 12 | "lint": { 13 | "executor": "@nx/linter:eslint", 14 | "options": { 15 | "eslintConfig": "./.eslintrc.js", 16 | "lintFilePatterns": ["packages/ckeditor5/**/*.{ts,tsx,js,jsx}"] 17 | }, 18 | "outputs": ["{options.outputFile}"] 19 | } 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /packages/ckeditor5/scripts/build-dist.mjs: -------------------------------------------------------------------------------- 1 | /** 2 | * @license Copyright (c) 2020-2024, CKSource Holding sp. z o.o. All rights reserved. 3 | * For licensing, see LICENSE.md. 4 | */ 5 | 6 | /* eslint-env node */ 7 | 8 | import { createRequire } from "module"; 9 | import upath from "upath"; 10 | import chalk from "chalk"; 11 | import { build } from "@ckeditor/ckeditor5-dev-build-tools"; 12 | 13 | function dist(path) { 14 | return upath.join("dist", path); 15 | } 16 | 17 | (async () => { 18 | /** 19 | * Step 1 20 | */ 21 | console.log(chalk.cyan("1/2: Generating NPM build...")); 22 | 23 | const require = createRequire(import.meta.url); 24 | const pkg = require(upath.resolve(process.cwd(), "./package.json")); 25 | 26 | await build({ 27 | input: "src/index.js", 28 | output: dist("./index.js"), 29 | external: [ 30 | "ckeditor5", 31 | "ckeditor5-premium-features", 32 | ...Object.keys({ 33 | ...pkg.dependencies, 34 | ...pkg.peerDependencies, 35 | }), 36 | ], 37 | clean: true, 38 | sourceMap: true, 39 | translations: "**/*.po", 40 | }); 41 | 42 | /** 43 | * Step 2 44 | */ 45 | console.log(chalk.cyan("2/2: Generating browser build...")); 46 | 47 | await build({ 48 | input: "src/index.js", 49 | output: dist("browser/index.js"), 50 | sourceMap: true, 51 | minify: false, 52 | browser: true, 53 | name: "@wiris/mathtype-ckeditor5", 54 | external: ["ckeditor5", "ckeditor5-premium-features"], 55 | }); 56 | })(); 57 | -------------------------------------------------------------------------------- /packages/ckeditor5/src/index.js: -------------------------------------------------------------------------------- 1 | import MathType from "./plugin.js"; 2 | import CKEditor5Integration from "./integration.js"; 3 | import { MathTypeCommand, ChemTypeCommand } from "./commands.js"; 4 | 5 | export default MathType; 6 | export { CKEditor5Integration, MathTypeCommand, ChemTypeCommand }; 7 | -------------------------------------------------------------------------------- /packages/ckeditor5/theme/icons/ckeditor5-chem.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 8 | 12 | 13 | -------------------------------------------------------------------------------- /packages/ckeditor5/theme/icons/ckeditor5-formula.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 10 | 12 | 15 | 16 | 17 | 20 | 21 | 22 | 23 | 24 | 26 | 27 | 28 | 29 | -------------------------------------------------------------------------------- /packages/devkit/.gitignore: -------------------------------------------------------------------------------- 1 | core.js 2 | node_modules 3 | doc/templates 4 | out 5 | moodle-atto_wiris/ 6 | moodle-tinymce_tiny_mce_wiris/ -------------------------------------------------------------------------------- /packages/devkit/.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | node_js: 3 | - "8" 4 | cache: 5 | - node_modules 6 | env: 7 | global: 8 | - secure: URTZgBumQl9SO2OQi8uKz46f39d6VJ1QL1Gkp3L6crCBb8h8pSkR/+ASdEFyXJ+veA7J5df3PVgLwOVRYNmv6Imhc6oVPQYam5fKOXvhqHUZKFp5bAZFVGeh0d5KrHTo86ExoGxBQ37S/0I0obakIQpqje6A0EU3f+D9bGaNE9vStvQ/o8ENd1XtZ7x57AWRaU8guEjbys7QIxIydf+8kDvGFBEas8fq3W9T+VjpNIId/nmv90gyB8PirwCt/IpZuRw8G4EA6MzmYM1peqFOsttL6ozRrVlH4MVwxkDymdIdhNSZN6DJXQwxcZ7rmL1dh2EcEzJ+yURyKU6JqKIDxNygOY4PtX3JpAv2sLJqreaEg0m94yx6RTlV5HnqGXtdbAEd4go7MfsGrZRBJGFMClsUutWlRecPiZ5u9PwnV+ovo38gEnrkED5cljS9CqQSA+MKC7RADpSqJsBo6hfJUPw0JDenX+CepJArlUqwDujtUtKsvKy9aG2kTGy61imsJru+Crjvx3JUskf2dGctbJHndbNm69CVEbgkSC2W53PrSA1D6qcsyuEkPccxWLosjGKKx5rOsZXjdRaU5157FOzJVip0eWFCJdTxRM8Yh7WK6CNe5X/PfIfOtoSW6CPd57XiYdbr6QSKfQNHsQ+3uOGuSpy5Q6VzvEMl4dLiub8= 9 | install: 10 | - npm install 11 | script: 12 | - npm run lint 13 | - export BRANCH=$(if [ "$TRAVIS_PULL_REQUEST" == "false" ]; then echo $TRAVIS_BRANCH; else echo $TRAVIS_PULL_REQUEST_BRANCH; fi) 14 | deploy: 15 | skip_cleanup: true 16 | provider: script 17 | script: bash scripts/deploy/moodle.sh 18 | on: 19 | all_branches: true 20 | -------------------------------------------------------------------------------- /packages/devkit/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | [ 4 | "@babel/preset-env", 5 | { 6 | targets: { 7 | node: "current", 8 | }, 9 | }, 10 | ], 11 | ], 12 | }; 13 | -------------------------------------------------------------------------------- /packages/devkit/doc/changelog.md: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/devkit/doc/changelog.md -------------------------------------------------------------------------------- /packages/devkit/doc/conf.json: -------------------------------------------------------------------------------- 1 | { 2 | "tags": { 3 | "allowUnknownTags": true 4 | }, 5 | "source": { 6 | "include": ["src"], 7 | "includePattern": ".+\\.js(doc|x)?$", 8 | "excludePattern": "(^|\\/|\\\\)_" 9 | }, 10 | 11 | "plugins": ["../../../node_modules/jsdoc-export-default-interop/dist/index", "plugins/markdown"], 12 | "templates": { 13 | "cleverLinks": false, 14 | "monospaceLinks": false, 15 | "default": { 16 | "outputSourceFiles": true 17 | } 18 | }, 19 | "opts": { 20 | "recurse": true, 21 | "tutorials": "doc/src/", 22 | "template": "doc/templates/mathtype-integration-jsdoc-theme", 23 | "changelog": "doc/changelog.md", 24 | "readme": "doc/src/readme.md" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /packages/devkit/doc/src/conf.json: -------------------------------------------------------------------------------- 1 | { 2 | "getting_started": { 3 | "title": "Getting Started" 4 | }, 5 | "data": { 6 | "title": "Parsing Data" 7 | }, 8 | "services": { 9 | "title": "Services overview", 10 | "children": [ 11 | "services_generic", 12 | "services_tinymce", 13 | "services_froala", 14 | "services_ckeditor4", 15 | "services_ckeditor5", 16 | "menu_item" 17 | ] 18 | }, 19 | "services_generic": { 20 | "title": "Generic Editor services" 21 | }, 22 | "services_tinymce": { 23 | "title": "TinyMCE services" 24 | }, 25 | "services_froala": { 26 | "title": "Froala services" 27 | }, 28 | "services_ckeditor4": { 29 | "title": "CKEditor 4 services" 30 | }, 31 | "services_ckeditor5": { 32 | "title": "CKEditor 5 services" 33 | }, 34 | "menu_item": { 35 | "title": "TinyMCE 5 services" 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /packages/devkit/doc/src/htmleditors/tinymce5/menu_item.md: -------------------------------------------------------------------------------- 1 | # Menu Item 2 | 3 | TinyMCE5 allows to define a list of items in the menu bar. This behavior can be configured through [menu](https://www.tiny.cloud/docs/configure/editor-appearance/#menu) and [menubar](https://www.tiny.cloud/docs/configure/editor-appearance/#menubar) configuration properties. 4 | 5 | ## Display MathType and ChemType as menu items 6 | 7 | Update the TinyMCE configuration with the following parameters: 8 | 9 | ```js 10 | { 11 | ... 12 | menu: { 13 | mathtype: { 14 | title: 'Wiris', items: 'tiny_mce_wiris_formulaEditor tiny_mce_wiris_formulaEditorChemistry' 15 | } 16 | }, 17 | menubar : 'mathtype', 18 | plugins: 'tiny_mce_wiris', 19 | ... 20 | } 21 | ``` 22 | -------------------------------------------------------------------------------- /packages/devkit/doc/src/readme.md: -------------------------------------------------------------------------------- 1 | ## MathType JavaScript documentation 2 | 3 | ### API 4 | 5 | - [Api Reference](api.html) 6 | 7 | ### Tutorials 8 | 9 | - [Parsing Data](tutorial-data.html) 10 | - [Getting Started](tutorial-getting_started.html) 11 | - [Services overview](tutorial-services.html) 12 | - [Generic editor services](tutorial-services_generic.html) 13 | - [TinyMCE services](tutorial-services_tinymce.html) 14 | - [Froala services](tutorial-services_froala.html) 15 | - [CKEditor 4 services](tutorial-services_ckeditor4.html) 16 | - [CKEditor 5 services](tutorial-services_ckeditor5.html) 17 | -------------------------------------------------------------------------------- /packages/devkit/doc/src/services.md: -------------------------------------------------------------------------------- 1 | This npm module uses services remotely hosted to render MathML data. However, it is strongly recommended to install these services in your backend. This will allow you, among other things, to customize the backend service and store locally the images generated by MathType. 2 | 3 | MathType integration services are available for the following technologies: Java, PHP, .NET and Ruby on Rails. You can download the appropiate services from the [Wiris MathType store](https://store.wiris.com/en/products/downloads/mathtype/integrations). 4 | -------------------------------------------------------------------------------- /packages/devkit/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@wiris/mathtype-html-integration-devkit", 3 | "version": "1.17.8", 4 | "description": "Allows to integrate MathType Web into any JavaScript HTML WYSIWYG rich text editor.", 5 | "keywords": [ 6 | "chem", 7 | "chemistry", 8 | "chemtype", 9 | "editor", 10 | "equation", 11 | "latex", 12 | "math", 13 | "mathml", 14 | "maths", 15 | "mathtype", 16 | "wiris" 17 | ], 18 | "repository": "https://github.com/wiris/html-integrations/tree/master/packages/devkit", 19 | "homepage": "https://www.wiris.com/?utm_source=npmjs&utm_medium=referral", 20 | "bugs": { 21 | "email": "support@wiris.com" 22 | }, 23 | "license": "MIT", 24 | "author": "WIRIS Team (https://www.wiris.com)", 25 | "main": "core.src.js", 26 | "scripts": { 27 | "prebuild-jsdoc": "rm -rf doc/templates/mathtype-integration-jsdoc-theme && git clone https://github.com/wiris/mathtype-integration-jsdoc-theme.git doc/templates/mathtype-integration-jsdoc-theme", 28 | "build-jsdoc": "jsdoc -c doc/conf.json --verbose", 29 | "build": "webpack --mode production", 30 | "build-dev": "webpack --mode development", 31 | "clean": "shx rm -f core.js" 32 | }, 33 | "devDependencies": { 34 | "@babel/core": "^7.24.4", 35 | "@babel/preset-env": "^7.24.4", 36 | "babel-loader": "^9.1.3", 37 | "css-loader": "^7.1.0", 38 | "jsdoc": "^3.6.6", 39 | "jsdoc-export-default-interop": "^0.3.1", 40 | "shx": "^0.3.4", 41 | "style-loader": "^4.0.0", 42 | "terser-webpack-plugin": "^5.3.10", 43 | "webpack": "^5.75.0", 44 | "webpack-cli": "^5.0.0" 45 | }, 46 | "dependencies": { 47 | "dompurify": "^3.0.10", 48 | "uuid": "^8.3.2" 49 | } 50 | } 51 | -------------------------------------------------------------------------------- /packages/devkit/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "devkit", 3 | "$schema": "../../node_modules/nx/schemas/project-schema.json", 4 | "targets": { 5 | "lint": { 6 | "executor": "@nx/linter:eslint", 7 | "options": { 8 | "eslintConfig": "./.eslintrc.js", 9 | "lintFilePatterns": ["packages/devkit/**/*.{ts,tsx,js,jsx}"] 10 | }, 11 | "outputs": ["{options.outputFile}"] 12 | } 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /packages/devkit/src/event.js: -------------------------------------------------------------------------------- 1 | export default class Event { 2 | /** 3 | * @classdesc 4 | * This class represents a custom event. Events should be fired by the {@link Listener} class. 5 | * 6 | * ```js 7 | * let customEvent = new Event(); 8 | * customEvent.properties = {}; 9 | * 10 | * let listeners = new Listeners(); 11 | * listeners.newListener(eventName, callback); 12 | * 13 | * listeners.fire(eventName, customEvent) * 14 | * ``` 15 | * @constructs 16 | */ 17 | constructor() { 18 | /** 19 | * Indicates if the event should be cancelled. 20 | * @type {Boolean} 21 | */ 22 | 23 | this.cancelled = false; 24 | /** 25 | * Indicates if the event should be prevented. 26 | * @type {Boolean} 27 | */ 28 | this.defaultPrevented = false; 29 | } 30 | 31 | /** 32 | * Cancels the event. 33 | */ 34 | cancel() { 35 | this.cancelled = true; 36 | } 37 | 38 | /** 39 | * Prevents the default action. 40 | */ 41 | preventDefault() { 42 | this.defaultPrevented = true; 43 | } 44 | } 45 | -------------------------------------------------------------------------------- /packages/devkit/src/global.js: -------------------------------------------------------------------------------- 1 | import Core from "./core.src"; 2 | import Parser from "./parser"; 3 | import Util from "./util"; 4 | import Image from "./image"; 5 | import Configuration from "./configuration"; 6 | import Listeners from "./listeners"; 7 | import IntegrationModel from "./integrationmodel"; 8 | import MathML from "./mathml"; 9 | import Latex from "./latex"; 10 | import Test from "./test"; 11 | 12 | // Expose WirisPlugin variable to the window. 13 | window.WirisPlugin = { 14 | Core, 15 | Parser, 16 | Image, 17 | MathML, 18 | Util, 19 | Configuration, 20 | Listeners, 21 | IntegrationModel, 22 | Latex, 23 | Test, 24 | }; 25 | -------------------------------------------------------------------------------- /packages/devkit/src/jsvariables.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Represents the configuration properties generated from the frontend (JavaScript variables). 3 | * @type {Object} 4 | * @property {string} imageClassName - Default MathType formula image class. 5 | * @property {string} imageClassName - Default MathType CAS image class. 6 | * @ignore 7 | */ 8 | const jsProperties = { 9 | imageCustomEditorName: "data-custom-editor", 10 | imageClassName: "Wirisformula", 11 | CASClassName: "Wiriscas", 12 | }; 13 | export default jsProperties; 14 | -------------------------------------------------------------------------------- /packages/devkit/src/listeners.js: -------------------------------------------------------------------------------- 1 | /** 2 | * This object represents a custom listener. 3 | * @typedef {Object} Listener 4 | * @property {String} Listener.eventName - The listener name. 5 | * @property {Function} Listener.callback - The listener callback function. 6 | */ 7 | 8 | export default class Listeners { 9 | /** 10 | * @classdesc 11 | * This class represents a custom listeners manager. 12 | * @constructs 13 | */ 14 | constructor() { 15 | /** 16 | * Array containing all custom listeners. 17 | * @type {Object[]} 18 | */ 19 | this.listeners = []; 20 | } 21 | 22 | /** 23 | * Add a listener to Listener class. 24 | * @param {Object} listener - A listener object. 25 | */ 26 | add(listener) { 27 | this.listeners.push(listener); 28 | } 29 | 30 | /** 31 | * Fires MathType event listeners 32 | * @param {String} eventName - event name 33 | * @param {Event} event - event object. 34 | * @return {boolean} false if event has been prevented. true otherwise. 35 | */ 36 | fire(eventName, event) { 37 | for (let i = 0; i < this.listeners.length && !event.cancelled; i += 1) { 38 | if (this.listeners[i].eventName === eventName) { 39 | // Calling listener. 40 | this.listeners[i].callback(event); 41 | } 42 | } 43 | return event.defaultPrevented; 44 | } 45 | 46 | /** 47 | * Creates a new listener object. 48 | * @param {string} eventName - Event name. 49 | * @param {Object} callback - Callback function. 50 | * @returns {object} the listener object. 51 | */ 52 | static newListener(eventName, callback) { 53 | const listener = {}; 54 | listener.eventName = eventName; 55 | listener.callback = callback; 56 | return listener; 57 | } 58 | } 59 | -------------------------------------------------------------------------------- /packages/devkit/src/telemeter.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable-next-line */ 2 | import init, { Telemeter as TelemeterWASM } from "../telemeter-wasm"; 3 | 4 | /** 5 | * @classdesc 6 | * This class implements the @wiris/telemeter-wasm. A utility that helps our Solutions to send the data 7 | * to Telemetry in a more comfortable and homogeneous way. 8 | */ 9 | export default class Telemeter { 10 | /** 11 | * Inits Telemeter class. 12 | * The parameters structures are defiended on {@link [Telemeter API](https://github.com/wiris/telemeter/blob/main/docs/USAGE.md#telemeter-api)} 13 | * @param {Object} telemeterAttributes.solution - The product that send data to Telemetry. 14 | * @param {Object} telemeterAttributes.hosts - Data about the environment where solution is integrated. 15 | * @param {Object} telemeterAttributes.config - Configuration parameters. 16 | */ 17 | static init(telemeterAttributes) { 18 | if (!this.telemeter && !this.waitingForInit) { 19 | this.waitingForInit = true; 20 | init(telemeterAttributes.url) 21 | .then(() => { 22 | this.telemeter = new TelemeterWASM( 23 | telemeterAttributes.solution, 24 | telemeterAttributes.hosts, 25 | telemeterAttributes.config, 26 | ); 27 | }) 28 | .catch((error) => { 29 | console.log(error); 30 | }) 31 | .finally(() => (this.waitingForInit = false)); 32 | } 33 | } 34 | 35 | /** 36 | * Closes the Telemetry Session. After calling this method no data will be added to the Telemetry Session. 37 | */ 38 | static async finish() { 39 | if (!this.telemeter) return; 40 | 41 | try { 42 | const local_telemeter = this.telemeter; 43 | this.telemeter = undefined; 44 | await local_telemeter.finish(); 45 | } catch (e) { 46 | console.error(e); 47 | } 48 | } 49 | } 50 | -------------------------------------------------------------------------------- /packages/devkit/src/test.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable no-console */ 2 | 3 | import ServiceProvider from "./serviceprovider"; 4 | 5 | export default class Test { 6 | static init() { 7 | Test.testServices(); 8 | } 9 | 10 | static testServices() { 11 | let data; 12 | console.log("Testing configuration service..."); 13 | console.log(ServiceProvider.getService("configurationjs", "", "get")); 14 | console.log("Testing showimage service..."); 15 | data = []; 16 | data.mml = 'x2'; 17 | console.log(ServiceProvider.getService("showimage", data)); 18 | console.log("Testing createimage service..."); 19 | data = []; 20 | data.mml = 'x2'; 21 | console.log(ServiceProvider.getService("createimage", data, "post")); 22 | console.log("Testing MathML2Latex service..."); 23 | data = []; 24 | data.service = "mathml2latex"; 25 | data.mml = 'x2'; 26 | console.log(ServiceProvider.getService("service", data)); 27 | console.log("Testing Latex2MathML service..."); 28 | data = []; 29 | data.service = "latex2mathml"; 30 | data.latex = "x^2"; 31 | console.log(ServiceProvider.getService("service", data)); 32 | console.log("Testing Mathml2Accesible service..."); 33 | data = []; 34 | data.service = "mathml2accessible"; 35 | data.mml = 'x2'; 36 | console.log(ServiceProvider.getService("service", data)); 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /packages/devkit/src/textcache.js: -------------------------------------------------------------------------------- 1 | export default class TextCache { 2 | /** 3 | * @classdesc 4 | * This class represent a client-side text cache class. Contains pairs of 5 | * strings (key/value) which can be retrieved in any moment. Usually used 6 | * to store AJAX responses for text services like mathml2latex 7 | * (c.f {@link Latex} class) or mathml2accessible (c.f {@link Accessibility} class). 8 | * @constructs 9 | */ 10 | constructor() { 11 | /** 12 | * Cache array property storing the cache entries. 13 | * @type {Array.} 14 | */ 15 | this.cache = []; 16 | } 17 | 18 | /** 19 | * This method populates a key/value pair into the {@link this.cache} property. 20 | * @param {String} key - Cache key, usually the service string parameter. 21 | * @param {String} value - Cache value, usually the service response. 22 | */ 23 | populate(key, value) { 24 | this.cache[key] = value; 25 | } 26 | 27 | /** 28 | * Returns the cache value associated to certain cache key. 29 | * @param {String} key - Cache key, usually the service string parameter. 30 | * @return {String} value - Cache value, if exists. False otherwise. 31 | */ 32 | get(key) { 33 | if (Object.prototype.hasOwnProperty.call(this.cache, key)) { 34 | return this.cache[key]; 35 | } 36 | return false; 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /packages/devkit/styles/icons/general/close_icon.svg: -------------------------------------------------------------------------------- 1 | 2 | 14 | 16 | 17 | 19 | image/svg+xml 20 | 22 | 23 | 24 | 25 | 26 | 28 | 47 | 48 | -------------------------------------------------------------------------------- /packages/devkit/styles/icons/general/max_icon.svg: -------------------------------------------------------------------------------- 1 | 2 | 14 | 16 | 17 | 19 | image/svg+xml 20 | 22 | 23 | 24 | 25 | 26 | 28 | 42 | 43 | -------------------------------------------------------------------------------- /packages/devkit/styles/icons/general/min_icon.svg: -------------------------------------------------------------------------------- 1 | 2 | 14 | 16 | 17 | 19 | image/svg+xml 20 | 22 | 23 | 24 | 25 | 26 | 28 | 42 | 43 | -------------------------------------------------------------------------------- /packages/devkit/styles/icons/general/warn_icon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /packages/devkit/styles/icons/hover/fulls_icon_h.svg: -------------------------------------------------------------------------------- 1 | 2 | 14 | 16 | 17 | 19 | image/svg+xml 20 | 22 | 23 | 24 | 25 | 26 | 28 | 46 | 47 | -------------------------------------------------------------------------------- /packages/devkit/styles/icons/hover/max_icon_h.svg: -------------------------------------------------------------------------------- 1 | 2 | 14 | 16 | 17 | 19 | image/svg+xml 20 | 22 | 23 | 24 | 25 | 26 | 28 | 42 | 43 | -------------------------------------------------------------------------------- /packages/devkit/styles/icons/hover/min_icon_h.svg: -------------------------------------------------------------------------------- 1 | 2 | 14 | 16 | 17 | 19 | image/svg+xml 20 | 22 | 23 | 24 | 25 | 26 | 28 | 42 | 43 | -------------------------------------------------------------------------------- /packages/devkit/telemeter-wasm/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@wiris/telemeter-wasm", 3 | "collaborators": [ 4 | "WIRIS " 5 | ], 6 | "description": "Client for Telemetry", 7 | "version": "1.1.3", 8 | "files": [ 9 | "telemeter_wasm_bg.wasm", 10 | "telemeter_wasm.js", 11 | "telemeter_wasm.d.ts" 12 | ], 13 | "module": "telemeter_wasm.js", 14 | "types": "telemeter_wasm.d.ts", 15 | "sideEffects": [ 16 | "./snippets/*" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /packages/devkit/telemeter-wasm/telemeter_wasm_bg.wasm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/devkit/telemeter-wasm/telemeter_wasm_bg.wasm -------------------------------------------------------------------------------- /packages/devkit/test/mathml.test.js: -------------------------------------------------------------------------------- 1 | import MathML from "../src/mathml"; 2 | 3 | const constants = require("./const"); 4 | 5 | test("Validate Math Hand formula", () => { 6 | expect(MathML.removeSemantics(constants.mathHand)).toBe(constants.mathHandValid); 7 | }); 8 | 9 | test("Validate Chem Hand formula", () => { 10 | expect(MathML.removeSemantics(constants.chemHand)).toBe(constants.chemHandValid); 11 | }); 12 | 13 | test("Validate Math not Hand formula", () => { 14 | expect(MathML.removeSemantics(constants.mathNoMrow)).toBe(constants.mathNoMrowValid); 15 | }); 16 | 17 | test("Validate Chem not Hand formula", () => { 18 | expect(MathML.removeSemantics(constants.chemNoMrow)).toBe(constants.chemNoMrowValid); 19 | }); 20 | 21 | test("Validate Multiple semantics Hand formula 01", () => { 22 | expect(MathML.removeSemantics(constants.semantics01)).toBe(constants.semanticsValid01); 23 | }); 24 | 25 | test("Validate Multiple semantics Hand formula 02", () => { 26 | expect(MathML.removeSemantics(constants.semantics02)).toBe(constants.semanticsValid02); 27 | }); 28 | 29 | test("Validate Multiple semantics Hand formula 03", () => { 30 | expect(MathML.removeSemantics(constants.semantics03)).toBe(constants.semanticsValid03); 31 | }); 32 | 33 | test("Validate Multiple semantics Hand formula 04", () => { 34 | expect(MathML.removeSemantics(constants.semantics04)).toBe(constants.semanticsValid04); 35 | }); 36 | 37 | test("Validate formula without annotation and semantics", () => { 38 | expect(MathML.removeSemantics(constants.noSemanticsNoAnnotation)).toBe(constants.noSemanticsNoAnnotation); 39 | }); 40 | -------------------------------------------------------------------------------- /packages/devkit/webpack.config.js: -------------------------------------------------------------------------------- 1 | const path = require("path"); 2 | const TerserPlugin = require("terser-webpack-plugin"); 3 | 4 | module.exports = { 5 | entry: { 6 | app: "./src/global.js", 7 | }, 8 | output: { 9 | path: path.resolve(__dirname, ""), 10 | filename: "core.js", 11 | globalObject: "this", 12 | }, 13 | // Set watch to true for dev purposes. 14 | watch: false, 15 | optimization: { 16 | minimize: true, 17 | minimizer: [ 18 | new TerserPlugin({ 19 | // These options prevent Terser from generating a LICENSE.txt file 20 | terserOptions: { 21 | format: { 22 | comments: false, 23 | }, 24 | }, 25 | extractComments: false, 26 | }), 27 | ], 28 | }, 29 | module: { 30 | rules: [ 31 | { 32 | // Rule to translate ES5 javascript files to ES6. 33 | test: /\.js$/, 34 | exclude: /node_modules/, 35 | use: { 36 | loader: "babel-loader", 37 | options: { 38 | presets: ["@babel/env"], 39 | }, 40 | }, 41 | }, 42 | { 43 | test: /\.css$/, 44 | use: ["style-loader", "css-loader"], 45 | }, 46 | { 47 | test: /\.wasm$/, 48 | type: "asset/inline", 49 | }, 50 | { 51 | // For the modal close, minimize, maximize icons 52 | test: /styles\/icons\/[^\/]+\/[^\/]+\.svg$/, 53 | type: "asset/source", 54 | }, 55 | { 56 | test: /\.(png|ttf|otf|eot|svg|woff(2)?)(.*)?$/, 57 | exclude: /styles\/icons\/[^\/]+\/[^\/]+\.svg$/, 58 | type: "asset/inline", 59 | }, 60 | ], 61 | }, 62 | experiments: { 63 | topLevelAwait: true, 64 | asyncWebAssembly: true, 65 | }, 66 | stats: { 67 | colors: true, 68 | }, 69 | }; 70 | -------------------------------------------------------------------------------- /packages/froala/.gitignore: -------------------------------------------------------------------------------- 1 | wiris.js -------------------------------------------------------------------------------- /packages/froala/global.js: -------------------------------------------------------------------------------- 1 | // Import variables needed to expose to the window 2 | import Core from "@wiris/mathtype-html-integration-devkit/src/core.src"; 3 | import Parser from "@wiris/mathtype-html-integration-devkit/src/parser"; 4 | import Util from "@wiris/mathtype-html-integration-devkit/src/util"; 5 | import Image from "@wiris/mathtype-html-integration-devkit/src/image"; 6 | import Configuration from "@wiris/mathtype-html-integration-devkit/src/configuration"; 7 | import Listeners from "@wiris/mathtype-html-integration-devkit/src/listeners"; 8 | import IntegrationModel from "@wiris/mathtype-html-integration-devkit/src/integrationmodel"; 9 | import Latex from "@wiris/mathtype-html-integration-devkit/src/latex"; 10 | import Test from "@wiris/mathtype-html-integration-devkit/src/test"; 11 | import { FroalaIntegration, instances, currentInstance } from "./wiris.src"; 12 | 13 | // Import files needed for the plugin in order to work propertly 14 | import "@wiris/mathtype-html-integration-devkit/src/backwardslib"; 15 | import "@wiris/mathtype-html-integration-devkit/src/polyfills"; 16 | import "./icons/css/wirisplugin.css"; 17 | 18 | // Expose WirisPlugin variable to the window. 19 | window.WirisPlugin = { 20 | Core, 21 | Parser, 22 | Image, 23 | Util, 24 | Configuration, 25 | Listeners, 26 | IntegrationModel, 27 | currentInstance, 28 | instances, 29 | FroalaIntegration, 30 | Latex, 31 | Test, 32 | }; 33 | -------------------------------------------------------------------------------- /packages/froala/icons/chem.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/froala/icons/chem.png -------------------------------------------------------------------------------- /packages/froala/icons/font/wirisplugin.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/froala/icons/font/wirisplugin.eot -------------------------------------------------------------------------------- /packages/froala/icons/font/wirisplugin.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Copyright (C) 2017 by original authors @ wirisplugin.com 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /packages/froala/icons/font/wirisplugin.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/froala/icons/font/wirisplugin.ttf -------------------------------------------------------------------------------- /packages/froala/icons/font/wirisplugin.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/froala/icons/font/wirisplugin.woff -------------------------------------------------------------------------------- /packages/froala/icons/font/wirisplugin.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/froala/icons/font/wirisplugin.woff2 -------------------------------------------------------------------------------- /packages/froala/icons/formula.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/froala/icons/formula.png -------------------------------------------------------------------------------- /packages/froala/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@wiris/mathtype-froala", 3 | "version": "8.13.1", 4 | "description": "MathType Web for Froala Editor", 5 | "keywords": [ 6 | "chem", 7 | "chemistry", 8 | "chemtype", 9 | "editor", 10 | "equation", 11 | "froala", 12 | "froala3", 13 | "froala4", 14 | "latex", 15 | "math", 16 | "mathml", 17 | "maths", 18 | "mathtype", 19 | "wiris" 20 | ], 21 | "repository": "https://github.com/wiris/html-integrations/tree/master/packages/froala", 22 | "homepage": "https://www.wiris.com/?utm_source=npmjs&utm_medium=referral", 23 | "bugs": { 24 | "email": "support@wiris.com" 25 | }, 26 | "license": "MIT", 27 | "author": "WIRIS Team (https://www.wiris.com/?utm_source=npmjs&utm_medium=referral)", 28 | "main": "wiris.js", 29 | "scripts": { 30 | "build": "webpack --mode production", 31 | "build-dev": "webpack --mode development", 32 | "clean": "shx rm -f wiris.js", 33 | "prepack": "yarn && npm run build" 34 | }, 35 | "dependencies": { 36 | "@wiris/mathtype-html-integration-devkit": "1.17.8" 37 | }, 38 | "devDependencies": { 39 | "@babel/core": "^7.24.4", 40 | "@babel/preset-env": "^7.24.4", 41 | "babel-loader": "^9.1.3", 42 | "css-loader": "^7.1.0", 43 | "shx": "^0.3.4", 44 | "style-loader": "^4.0.0", 45 | "terser-webpack-plugin": "^5.3.10" 46 | } 47 | } 48 | -------------------------------------------------------------------------------- /packages/froala/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "froala", 3 | "$schema": "../../node_modules/nx/schemas/project-schema.json", 4 | "sourceRoot": "package/froala/src", 5 | "targets": { 6 | "build": { 7 | "executor": "@nx/webpack:webpack", 8 | "dependsOn": [], 9 | "outputs": ["{options.outputPath}"], 10 | "options": { 11 | "main": "demos/packages/froala/global.js", 12 | "outputPath": "dist", 13 | "tsConfig": "tsconfig.app.json", 14 | "generateIndexHtml": false, 15 | "index": " ", 16 | "webpackConfig": "packages/froala/webpack.config.js" 17 | } 18 | }, 19 | "start": { 20 | "executor": "@nx/webpack:dev-server", 21 | "options": { 22 | "buildTarget": "froala:build", 23 | "webpackConfig": "packages/froala/webpack.config.js" 24 | } 25 | }, 26 | "test": { 27 | "executor": "@nx/cypress:cypress", 28 | "dependsOn": ["build"], 29 | "options": { 30 | "baseUrl": "http://localhost:8004", 31 | "cypressConfig": "./cypress.json" 32 | } 33 | }, 34 | "lint": { 35 | "executor": "@nx/linter:eslint", 36 | "options": { 37 | "eslintConfig": "./.eslintrc.js", 38 | "lintFilePatterns": ["packages/froala/**/*.{ts,tsx,js,jsx}"] 39 | }, 40 | "outputs": ["{options.outputFile}"] 41 | } 42 | } 43 | } 44 | -------------------------------------------------------------------------------- /packages/generic/.esdoc.json: -------------------------------------------------------------------------------- 1 | { 2 | "source": ".", 3 | "destination": "./docs", 4 | "includes": ["\\.js$", "/core/src"], 5 | "excludes": [ 6 | "backwardslib.js", 7 | "cas.js", 8 | "core.js", 9 | "display.js", 10 | "generic_demo.js", 11 | "global.js", 12 | "jsvariables.js", 13 | "md5.js", 14 | "polyfills.js", 15 | "node_modules", 16 | "lang", 17 | "integration/", 18 | "docs", 19 | "out", 20 | "wirisplugin-generic.js", 21 | "webpack.config.js", 22 | "editor_plugin.src.js", 23 | ".external-ecmascript.js" 24 | ], 25 | "plugins": [ 26 | { 27 | "name": "esdoc-standard-plugin", 28 | "option": { 29 | "lint": { "enable": true }, 30 | "coverage": { "enable": true }, 31 | "accessor": { 32 | "access": ["public", "protected", "private"], 33 | "autoPrivate": true 34 | }, 35 | "undocumentIdentifier": { "enable": true }, 36 | "unexportedIdentifier": { "enable": false }, 37 | "typeInference": { "enable": true }, 38 | "brand": { 39 | "title": "My Library", 40 | "description": "this is awesome library", 41 | "site": "http://my-library.org", 42 | "author": "https://twitter.com/foo", 43 | "image": "http://my-library.org/logo.png" 44 | }, 45 | "manual": { 46 | "files": ["./getting_started.md", "./data.md", "./services.md", "./documentation.md"] 47 | } 48 | } 49 | }, 50 | { 51 | "name": "esdoc-inject-style-plugin", 52 | "option": { 53 | "enable": true, 54 | "styles": ["./styles.css"] 55 | } 56 | } 57 | ] 58 | } 59 | -------------------------------------------------------------------------------- /packages/generic/.gitignore: -------------------------------------------------------------------------------- 1 | wirisplugin-generic.js -------------------------------------------------------------------------------- /packages/generic/documentation.md: -------------------------------------------------------------------------------- 1 | # Documentation 2 | 3 | To find out more information about MathType, please go to the following documentation: 4 | 5 | - [MathType documentation](http://docs.wiris.com/en/mathtype/mathtype_web/start) 6 | - [Introductory tutorials](http://docs.wiris.com/en/mathtype/mathtype_web/intro_tutorials) 7 | - [Service customization](http://docs.wiris.com/en/mathtype/mathtype_web/integrations/config-table) 8 | - [Testing](http://docs.wiris.com/en/mathtype/mathtype_web/integrations/html/plugins-test) 9 | -------------------------------------------------------------------------------- /packages/generic/global.js: -------------------------------------------------------------------------------- 1 | import Core from "@wiris/mathtype-html-integration-devkit/src/core.src"; 2 | import Parser from "@wiris/mathtype-html-integration-devkit/src/parser"; 3 | import Util from "@wiris/mathtype-html-integration-devkit/src/util"; 4 | import Image from "@wiris/mathtype-html-integration-devkit/src/image"; 5 | import Configuration from "@wiris/mathtype-html-integration-devkit/src/configuration"; 6 | import Listeners from "@wiris/mathtype-html-integration-devkit/src/listeners"; 7 | import IntegrationModel from "@wiris/mathtype-html-integration-devkit/src/integrationmodel"; 8 | import Latex from "@wiris/mathtype-html-integration-devkit/src/latex"; 9 | import Test from "@wiris/mathtype-html-integration-devkit/src/test"; 10 | /** Don't delete this - non used - imports. */ 11 | import "@wiris/mathtype-html-integration-devkit/src/backwardslib"; 12 | import "@wiris/mathtype-html-integration-devkit/src/polyfills"; 13 | import MathML from "@wiris/mathtype-html-integration-devkit/src/mathml"; 14 | import GenericIntegration, { currentInstance } from "./wirisplugin-generic.src"; 15 | 16 | Configuration.set("parseModes", "latex"); 17 | 18 | // Expose WirisPlugin variable to the window. 19 | window.WirisPlugin = { 20 | Core, 21 | Parser, 22 | Image, 23 | Util, 24 | MathML, 25 | Configuration, 26 | Listeners, 27 | IntegrationModel, 28 | currentInstance, 29 | Latex, 30 | GenericIntegration, 31 | Test, 32 | }; 33 | -------------------------------------------------------------------------------- /packages/generic/icons/cas.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/generic/icons/cas.png -------------------------------------------------------------------------------- /packages/generic/icons/chem.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/generic/icons/chem.png -------------------------------------------------------------------------------- /packages/generic/icons/formula.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/generic/icons/formula.png -------------------------------------------------------------------------------- /packages/generic/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@wiris/mathtype-generic", 3 | "version": "8.13.1", 4 | "description": "MathType Web for a generic HTML editor", 5 | "keywords": [ 6 | "chem", 7 | "chemistry", 8 | "chemtype", 9 | "editor", 10 | "equation", 11 | "latex", 12 | "math", 13 | "mathml", 14 | "maths", 15 | "mathtype", 16 | "wiris" 17 | ], 18 | "repository": "https://github.com/wiris/html-integrations/tree/master/packages/generic", 19 | "homepage": "http://www.wiris.com/?utm_source=npmjs&utm_medium=referral", 20 | "bugs": { 21 | "email": "support@wiris.com" 22 | }, 23 | "license": "MIT", 24 | "author": "WIRIS Team (http://www.wiris.com/?utm_source=npmjs&utm_medium=referral)", 25 | "main": "wirisplugin-generic.js", 26 | "scripts": { 27 | "build": "webpack --mode production", 28 | "build-dev": "webpack --mode development", 29 | "clean": "shx rm -f wirisplugin-generic.js", 30 | "prepack": "yarn && npm run build" 31 | }, 32 | "dependencies": { 33 | "@wiris/mathtype-html-integration-devkit": "1.17.8" 34 | }, 35 | "devDependencies": { 36 | "@babel/core": "^7.24.4", 37 | "@babel/preset-env": "^7.24.4", 38 | "babel-loader": "^9.1.3", 39 | "css-loader": "^7.1.0", 40 | "shx": "^0.3.4", 41 | "style-loader": "^4.0.0", 42 | "terser-webpack-plugin": "^5.3.10" 43 | } 44 | } 45 | -------------------------------------------------------------------------------- /packages/generic/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "generic", 3 | "$schema": "../../node_modules/nx/schemas/project-schema.json", 4 | "sourceRoot": "package/generic/src", 5 | "targets": { 6 | "build": { 7 | "executor": "@nx/webpack:webpack", 8 | "dependsOn": [], 9 | "outputs": ["{options.outputPath}"], 10 | "options": { 11 | "main": "demos/packages/generic/global.js", 12 | "outputPath": "dist", 13 | "tsConfig": "tsconfig.app.json", 14 | "generateIndexHtml": false, 15 | "index": " ", 16 | "webpackConfig": "packages/generic/webpack.config.js" 17 | } 18 | }, 19 | "start": { 20 | "executor": "@nx/webpack:dev-server", 21 | "options": { 22 | "buildTarget": "generic:build", 23 | "webpackConfig": "packages/generic/webpack.config.js" 24 | } 25 | }, 26 | "test": { 27 | "executor": "@nx/cypress:cypress", 28 | "dependsOn": ["build"], 29 | "options": { 30 | "baseUrl": "http://localhost:8007", 31 | "cypressConfig": "./cypress.json" 32 | } 33 | }, 34 | "lint": { 35 | "executor": "@nx/linter:eslint", 36 | "options": { 37 | "eslintConfig": "./.eslintrc.js", 38 | "lintFilePatterns": ["packages/generic/**/*.{ts,tsx,js,jsx}"] 39 | }, 40 | "outputs": ["{options.outputFile}"] 41 | } 42 | } 43 | } 44 | -------------------------------------------------------------------------------- /packages/generic/styles.css: -------------------------------------------------------------------------------- 1 | header { 2 | background-color: #f26a54 !important; 3 | } 4 | 5 | nav.navigation { 6 | font-family: consolas, "Liberation Mono", courier, monospace; 7 | line-height: 1.2; 8 | } 9 | -------------------------------------------------------------------------------- /packages/res/README.md: -------------------------------------------------------------------------------- 1 | # Resources folder 2 | 3 | Resource folder containing files and functions common among more than one demo. It may also contain other files that are commonly used in different places in the project 4 | 5 | The main goal of this package is to mantain the demos inside the mono-repo project independent of each other and the folders in this repository. 6 | 7 | ## File manifest 8 | 9 | ```bash 10 | resources 11 | ├── demos 12 | │ ├── common_file-1 13 | │ ├── common_file-2 14 | | ├── ... 15 | | └── common_file-m 16 | ├── webpack 17 | ├── ... 18 | ├── package.json 19 | └── README.md 20 | ``` 21 | 22 | - The folder srtucture accepts new folders with other files that can be used anywhere in the project. 23 | - The webpack file is necessary specify the loaders needed to import specific type of files. 24 | -------------------------------------------------------------------------------- /packages/res/demos/imports.js: -------------------------------------------------------------------------------- 1 | // Import styles. 2 | import "./design.css"; 3 | 4 | // Export generic functions. 5 | // eslint-disable-next-line import/extensions 6 | export * from "./common.js"; 7 | 8 | // Display html content. 9 | // We force the use of html-loader, for angular and react applications. 10 | const htmlModule = require("html-loader!./index.html"); 11 | 12 | // Since html-loader versions 2.0.0, it returns a module with its default valude beeing the html. 13 | const htmlBody = htmlModule.default; 14 | document.body.innerHTML = htmlBody; 15 | 16 | // Generate scripts. 17 | const jsDemoImagesTransform = document.createElement("script"); 18 | jsDemoImagesTransform.type = "text/javascript"; 19 | jsDemoImagesTransform.src = "https://www.wiris.net/demo/plugins/app/WIRISplugins.js?viewer=image"; 20 | 21 | // Load generated scripts. 22 | document.head.appendChild(jsDemoImagesTransform); 23 | -------------------------------------------------------------------------------- /packages/res/demos/index.html: -------------------------------------------------------------------------------- 1 |
2 |

 

3 |
4 |
    5 |
  • 6 |
  • Mathtype:
  • 7 |
  • 8 |
  • 9 |
10 |
11 |
12 |
13 | 14 |
15 |
16 | UPDATE 19 |
20 |
21 | -------------------------------------------------------------------------------- /packages/res/demos/vite-imports.js: -------------------------------------------------------------------------------- 1 | // Import styles. 2 | import "./design.css"; 3 | import indexString from "./index.html?raw"; 4 | 5 | // Export generic functions. 6 | // eslint-disable-next-line import/extensions 7 | export * from "./common.js"; 8 | 9 | // Display html content. 10 | document.body.innerHTML = indexString; 11 | 12 | // Generate scripts. 13 | const jsDemoImagesTransform = document.createElement("script"); 14 | jsDemoImagesTransform.type = "text/javascript"; 15 | jsDemoImagesTransform.src = "https://www.wiris.net/demo/plugins/app/WIRISplugins.js?viewer=image"; 16 | 17 | // Load generated scripts. 18 | document.head.appendChild(jsDemoImagesTransform); 19 | -------------------------------------------------------------------------------- /packages/res/git-data.mjs: -------------------------------------------------------------------------------- 1 | import { execSync } from "child_process"; 2 | import * as fs from "fs"; 3 | import path from "path"; 4 | import { fileURLToPath } from "url"; 5 | 6 | let x1 = "unknown", 7 | x2 = "unknown"; 8 | 9 | // Retrieve GitHub branch and commit hash 10 | x1 = execSync("git rev-parse --abbrev-ref HEAD").toString().trim(); 11 | x2 = execSync("git rev-parse --short HEAD").toString().trim(); 12 | 13 | // Converting JS object to JSON string 14 | var jsonData = JSON.stringify({ branch: x1, hash: x2 }); 15 | 16 | // Get current directory. 17 | const __filename = fileURLToPath(import.meta.url); 18 | const __dirname = path.dirname(__filename); 19 | 20 | // Write data in json file. 21 | fs.writeFile(path.join(__dirname, "git-data.json"), jsonData, (err) => { 22 | // In case of a error throw err. 23 | if (err) throw err; 24 | }); 25 | -------------------------------------------------------------------------------- /packages/res/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "mathtype-demos-resources", 3 | "version": "1.0.0", 4 | "private": true, 5 | "description": "Package to store demos common files", 6 | "author": "carla@wiris.com", 7 | "license": "ISC", 8 | "dependencies": { 9 | "html-loader": "^5.0.0", 10 | "webpack": "^5.75.0", 11 | "webpack-cli": "^5.0.0" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /packages/res/webpack.config.js: -------------------------------------------------------------------------------- 1 | const path = require("path"); 2 | 3 | module.exports = { 4 | // Set watch to true for dev purposes. 5 | watch: false, 6 | module: { 7 | rules: [ 8 | { 9 | test: /\.(png|jpg|gif)$/i, 10 | type: "asset/inline", 11 | }, 12 | { 13 | test: /\.html$/i, 14 | exclude: /node_modules/, 15 | loader: "html-loader", 16 | options: { 17 | minimize: true, 18 | removeComments: true, 19 | }, 20 | }, 21 | ], 22 | }, 23 | stats: { 24 | colors: true, 25 | }, 26 | }; 27 | -------------------------------------------------------------------------------- /packages/tinymce5/.gitignore: -------------------------------------------------------------------------------- 1 | plugin.min.js 2 | -------------------------------------------------------------------------------- /packages/tinymce5/.npmignore: -------------------------------------------------------------------------------- 1 | # This file left empty on purpose so npm doesn't use .gitignore as a replacement of .npmignore. -------------------------------------------------------------------------------- /packages/tinymce5/global.js: -------------------------------------------------------------------------------- 1 | import Core from "@wiris/mathtype-html-integration-devkit/src/core.src"; 2 | import Parser from "@wiris/mathtype-html-integration-devkit/src/parser"; 3 | import Util from "@wiris/mathtype-html-integration-devkit/src/util"; 4 | import Image from "@wiris/mathtype-html-integration-devkit/src/image"; 5 | import Configuration from "@wiris/mathtype-html-integration-devkit/src/configuration"; 6 | import Listeners from "@wiris/mathtype-html-integration-devkit/src/listeners"; 7 | import IntegrationModel from "@wiris/mathtype-html-integration-devkit/src/integrationmodel"; 8 | import Latex from "@wiris/mathtype-html-integration-devkit/src/latex"; 9 | import "@wiris/mathtype-html-integration-devkit/src/backwardslib"; 10 | import Test from "@wiris/mathtype-html-integration-devkit/src/test"; 11 | import { TinyMceIntegration, currentInstance, instances } from "./editor_plugin.src"; 12 | 13 | // Expose WirisPlugin variable to the window. 14 | window.WirisPlugin = { 15 | Core, 16 | Parser, 17 | Image, 18 | Util, 19 | Configuration, 20 | Listeners, 21 | IntegrationModel, 22 | currentInstance, 23 | instances, 24 | TinyMceIntegration, 25 | Latex, 26 | Test, 27 | }; 28 | -------------------------------------------------------------------------------- /packages/tinymce5/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@wiris/mathtype-tinymce5", 3 | "version": "8.13.1", 4 | "description": "MathType Web for TinyMCE5 editor", 5 | "keywords": [ 6 | "chem", 7 | "chemistry", 8 | "chemtype", 9 | "editor", 10 | "equation", 11 | "latex", 12 | "math", 13 | "mathml", 14 | "maths", 15 | "mathtype", 16 | "tinymce", 17 | "tinymce5", 18 | "wiris" 19 | ], 20 | "repository": "https://github.com/wiris/html-integrations/tree/master/packages/tinymce5s", 21 | "homepage": "http://www.wiris.com/?utm_source=npmjs&utm_medium=referral", 22 | "bugs": { 23 | "email": "support@wiris.com" 24 | }, 25 | "license": "MIT", 26 | "author": "WIRIS Team (http://www.wiris.com/?utm_source=npmjs&utm_medium=referral)", 27 | "main": "plugin.min.js", 28 | "scripts": { 29 | "build": "webpack --mode production", 30 | "build-dev": "webpack --mode development", 31 | "clean": "shx rm -f plugin.min.js", 32 | "prepack": "yarn && npm run build" 33 | }, 34 | "dependencies": { 35 | "@wiris/mathtype-html-integration-devkit": "1.17.8" 36 | }, 37 | "devDependencies": { 38 | "@babel/core": "^7.24.4", 39 | "@babel/preset-env": "^7.24.4", 40 | "babel-loader": "^9.1.3", 41 | "css-loader": "^7.1.0", 42 | "shx": "^0.3.4", 43 | "style-loader": "^4.0.0", 44 | "terser-webpack-plugin": "^5.3.10" 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /packages/tinymce5/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "tinymce5", 3 | "$schema": "../../node_modules/nx/schemas/project-schema.json", 4 | "sourceRoot": "package/tinymce5/src", 5 | "targets": { 6 | "build": { 7 | "executor": "@nx/webpack:webpack", 8 | "dependsOn": [], 9 | "outputs": ["{options.outputPath}"], 10 | "options": { 11 | "main": "demos/packages/tinymce5/global.js", 12 | "outputPath": "dist", 13 | "tsConfig": "tsconfig.app.json", 14 | "generateIndexHtml": false, 15 | "index": " ", 16 | "webpackConfig": "packages/tinymce5/webpack.config.js" 17 | } 18 | }, 19 | "start": { 20 | "executor": "@nx/webpack:dev-server", 21 | "options": { 22 | "buildTarget": "tinymce5:build", 23 | "webpackConfig": "packages/tinymce5/webpack.config.js" 24 | } 25 | }, 26 | "test": { 27 | "executor": "@nx/cypress:cypress", 28 | "dependsOn": ["build"], 29 | "options": { 30 | "baseUrl": "http://localhost:8006", 31 | "cypressConfig": "./cypress.json" 32 | } 33 | }, 34 | "lint": { 35 | "executor": "@nx/linter:eslint", 36 | "options": { 37 | "eslintConfig": "./.eslintrc.js", 38 | "lintFilePatterns": ["packages/tinymce5/**/*.{ts,tsx,js,jsx}"] 39 | }, 40 | "outputs": ["{options.outputFile}"] 41 | } 42 | } 43 | } 44 | -------------------------------------------------------------------------------- /packages/tinymce6/.gitignore: -------------------------------------------------------------------------------- 1 | plugin.min.js 2 | -------------------------------------------------------------------------------- /packages/tinymce6/global.js: -------------------------------------------------------------------------------- 1 | import Core from "@wiris/mathtype-html-integration-devkit/src/core.src"; 2 | import Parser from "@wiris/mathtype-html-integration-devkit/src/parser"; 3 | import Util from "@wiris/mathtype-html-integration-devkit/src/util"; 4 | import Image from "@wiris/mathtype-html-integration-devkit/src/image"; 5 | import Configuration from "@wiris/mathtype-html-integration-devkit/src/configuration"; 6 | import Listeners from "@wiris/mathtype-html-integration-devkit/src/listeners"; 7 | import IntegrationModel from "@wiris/mathtype-html-integration-devkit/src/integrationmodel"; 8 | import Latex from "@wiris/mathtype-html-integration-devkit/src/latex"; 9 | import "@wiris/mathtype-html-integration-devkit/src/backwardslib"; 10 | import Test from "@wiris/mathtype-html-integration-devkit/src/test"; 11 | import { TinyMceIntegration, currentInstance, instances } from "./editor_plugin.src"; 12 | 13 | // Expose WirisPlugin variable to the window. 14 | window.WirisPlugin = { 15 | Core, 16 | Parser, 17 | Image, 18 | Util, 19 | Configuration, 20 | Listeners, 21 | IntegrationModel, 22 | currentInstance, 23 | instances, 24 | TinyMceIntegration, 25 | Latex, 26 | Test, 27 | }; 28 | -------------------------------------------------------------------------------- /packages/tinymce6/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@wiris/mathtype-tinymce6", 3 | "version": "8.13.1", 4 | "description": "MathType Web for TinyMCE6 editor", 5 | "keywords": [ 6 | "chem", 7 | "chemistry", 8 | "chemtype", 9 | "editor", 10 | "equation", 11 | "latex", 12 | "math", 13 | "mathml", 14 | "maths", 15 | "mathtype", 16 | "tinymce", 17 | "tinymce5", 18 | "wiris" 19 | ], 20 | "repository": "https://github.com/wiris/html-integrations/tree/master/packages/tinymce6", 21 | "homepage": "www.wiris.com/?utm_source=npmjs&utm_medium=referral", 22 | "bugs": { 23 | "email": "support@wiris.com" 24 | }, 25 | "license": "MIT", 26 | "author": "WIRIS Team (www.wiris.com/?utm_source=npmjs&utm_medium=referral)", 27 | "main": "plugin.min.js", 28 | "scripts": { 29 | "build": "webpack --mode production", 30 | "build-dev": "webpack --mode development", 31 | "clean": "shx rm -f plugin.min.js", 32 | "prepack": "yarn && npm run build" 33 | }, 34 | "dependencies": { 35 | "@wiris/mathtype-html-integration-devkit": "1.17.8" 36 | }, 37 | "devDependencies": { 38 | "@babel/core": "^7.24.4", 39 | "@babel/preset-env": "^7.24.4", 40 | "babel-loader": "^9.1.3", 41 | "css-loader": "^7.1.0", 42 | "shx": "^0.3.4", 43 | "style-loader": "^4.0.0", 44 | "terser-webpack-plugin": "^5.3.10" 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /packages/tinymce6/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "tinymce6", 3 | "$schema": "../../node_modules/nx/schemas/project-schema.json", 4 | "sourceRoot": "package/tinymce6/src", 5 | "targets": { 6 | "build": { 7 | "executor": "@nx/webpack:webpack", 8 | "dependsOn": [], 9 | "outputs": ["{options.outputPath}"], 10 | "options": { 11 | "main": "demos/packages/tinymce6/global.js", 12 | "outputPath": "dist", 13 | "tsConfig": "tsconfig.app.json", 14 | "generateIndexHtml": false, 15 | "index": " ", 16 | "webpackConfig": "packages/tinymce6/webpack.config.js" 17 | } 18 | }, 19 | "start": { 20 | "executor": "@nx/webpack:dev-server", 21 | "options": { 22 | "buildTarget": "tinymce6:build", 23 | "webpackConfig": "packages/tinymce6/webpack.config.js" 24 | } 25 | }, 26 | "test": { 27 | "executor": "@nx/cypress:cypress", 28 | "dependsOn": ["build"], 29 | "options": { 30 | "baseUrl": "http://localhost:8008", 31 | "cypressConfig": "./cypress.json" 32 | } 33 | }, 34 | "lint": { 35 | "executor": "@nx/linter:eslint", 36 | "options": { 37 | "eslintConfig": "./.eslintrc.js", 38 | "lintFilePatterns": ["packages/tinymce6/**/*.{ts,tsx,js,jsx}"] 39 | }, 40 | "outputs": ["{options.outputFile}"] 41 | } 42 | } 43 | } 44 | -------------------------------------------------------------------------------- /packages/tinymce7/.gitignore: -------------------------------------------------------------------------------- 1 | plugin.min.js 2 | -------------------------------------------------------------------------------- /packages/tinymce7/global.js: -------------------------------------------------------------------------------- 1 | import Core from "@wiris/mathtype-html-integration-devkit/src/core.src"; 2 | import Parser from "@wiris/mathtype-html-integration-devkit/src/parser"; 3 | import Util from "@wiris/mathtype-html-integration-devkit/src/util"; 4 | import Image from "@wiris/mathtype-html-integration-devkit/src/image"; 5 | import Configuration from "@wiris/mathtype-html-integration-devkit/src/configuration"; 6 | import Listeners from "@wiris/mathtype-html-integration-devkit/src/listeners"; 7 | import IntegrationModel from "@wiris/mathtype-html-integration-devkit/src/integrationmodel"; 8 | import Latex from "@wiris/mathtype-html-integration-devkit/src/latex"; 9 | import "@wiris/mathtype-html-integration-devkit/src/backwardslib"; 10 | import Test from "@wiris/mathtype-html-integration-devkit/src/test"; 11 | import { TinyMceIntegration, currentInstance, instances } from "./editor_plugin.src"; 12 | 13 | // Expose WirisPlugin variable to the window. 14 | window.WirisPlugin = { 15 | Core, 16 | Parser, 17 | Image, 18 | Util, 19 | Configuration, 20 | Listeners, 21 | IntegrationModel, 22 | currentInstance, 23 | instances, 24 | TinyMceIntegration, 25 | Latex, 26 | Test, 27 | }; 28 | -------------------------------------------------------------------------------- /packages/tinymce7/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@wiris/mathtype-tinymce7", 3 | "version": "8.13.1", 4 | "description": "MathType Web for TinyMCE7 editor", 5 | "keywords": [ 6 | "chem", 7 | "chemistry", 8 | "chemtype", 9 | "editor", 10 | "equation", 11 | "latex", 12 | "math", 13 | "mathml", 14 | "maths", 15 | "mathtype", 16 | "tinymce", 17 | "tinymce7", 18 | "wiris" 19 | ], 20 | "repository": "https://github.com/wiris/html-integrations/tree/master/packages/tinymce7", 21 | "homepage": "www.wiris.com/?utm_source=npmjs&utm_medium=referral", 22 | "bugs": { 23 | "email": "support@wiris.com" 24 | }, 25 | "license": "MIT", 26 | "author": "WIRIS Team (www.wiris.com/?utm_source=npmjs&utm_medium=referral)", 27 | "main": "plugin.min.js", 28 | "scripts": { 29 | "build": "webpack --mode production", 30 | "build-dev": "webpack --mode development", 31 | "clean": "shx rm -f plugin.min.js", 32 | "prepack": "yarn && npm run build" 33 | }, 34 | "dependencies": { 35 | "@wiris/mathtype-html-integration-devkit": "1.17.8" 36 | }, 37 | "devDependencies": { 38 | "@babel/core": "^7.24.4", 39 | "@babel/preset-env": "^7.24.4", 40 | "babel-loader": "^9.1.3", 41 | "css-loader": "^7.1.0", 42 | "shx": "^0.3.4", 43 | "style-loader": "^4.0.0", 44 | "terser-webpack-plugin": "^5.3.10" 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /packages/tinymce7/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "tinymce7", 3 | "$schema": "../../node_modules/nx/schemas/project-schema.json", 4 | "sourceRoot": "package/tinymce7/src", 5 | "targets": { 6 | "build": { 7 | "executor": "@nx/webpack:webpack", 8 | "dependsOn": [], 9 | "outputs": ["{options.outputPath}"], 10 | "options": { 11 | "main": "demos/packages/tinymce7/global.js", 12 | "outputPath": "dist", 13 | "tsConfig": "tsconfig.app.json", 14 | "generateIndexHtml": false, 15 | "index": " ", 16 | "webpackConfig": "packages/tinymce7/webpack.config.js" 17 | } 18 | }, 19 | "start": { 20 | "executor": "@nx/webpack:dev-server", 21 | "options": { 22 | "buildTarget": "tinymce7:build", 23 | "webpackConfig": "packages/tinymce7/webpack.config.js" 24 | } 25 | }, 26 | "lint": { 27 | "executor": "@nx/linter:eslint", 28 | "options": { 29 | "eslintConfig": "./.eslintrc.js", 30 | "lintFilePatterns": ["packages/tinymce7/**/*.{ts,tsx,js,jsx}"] 31 | }, 32 | "outputs": ["{options.outputFile}"] 33 | } 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /packages/viewer/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | [ 4 | "@babel/preset-env", 5 | { 6 | targets: { 7 | node: "current", 8 | }, 9 | }, 10 | ], 11 | "@babel/preset-typescript", 12 | ], 13 | }; 14 | -------------------------------------------------------------------------------- /packages/viewer/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Testing Viewer MathML 5 | 6 | 7 | 8 | 14 | 15 | 16 |

17 | 2+2=4 18 |

19 |

$$4 - 2 = 2$$

20 | 21 | 22 | -------------------------------------------------------------------------------- /packages/viewer/jest.config.js: -------------------------------------------------------------------------------- 1 | /** @type {import('ts-jest').JestConfigWithTsJest} */ 2 | module.exports = { 3 | testEnvironment: "jsdom", 4 | }; 5 | -------------------------------------------------------------------------------- /packages/viewer/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@wiris/mathtype-viewer", 3 | "version": "8.13.1", 4 | "description": "", 5 | "main": "app.js", 6 | "scripts": { 7 | "build": "webpack --mode production", 8 | "build-dev": "webpack --mode development", 9 | "serve": "webpack serve", 10 | "prepack": "yarn && npm run build" 11 | }, 12 | "keywords": [ 13 | "typescript", 14 | "course" 15 | ], 16 | "author": "Integrations", 17 | "license": "ISC", 18 | "dependencies": { 19 | "@wiris/mathtype-html-integration-devkit": "1.17.8" 20 | }, 21 | "devDependencies": { 22 | "@babel/preset-typescript": "^7.24.1", 23 | "@types/jest": "^29.5.12", 24 | "babel-jest": "^29.7.0", 25 | "babel-loader": "^9.1.3", 26 | "jest": "^29.7.0", 27 | "jest-environment-jsdom": "^29.7.0", 28 | "lite-server": "^2.5.4", 29 | "ts-loader": "^9.4.2", 30 | "webpack": "^5.75.0", 31 | "webpack-cli": "^5.0.0", 32 | "webpack-dev-server": "^5.0.4" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /packages/viewer/project.json: -------------------------------------------------------------------------------- 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": ["{options.outputPath}"] 13 | }, 14 | "build-dev": { 15 | "executor": "nx:run-script", 16 | "options": { 17 | "script": "build-dev", 18 | "outputPath": "packages/viewer/dist" 19 | }, 20 | "outputs": ["{options.outputPath}"] 21 | }, 22 | "lint": { 23 | "executor": "@nx/linter:eslint", 24 | "options": { 25 | "eslintConfig": "./.eslintrc.js", 26 | "lintFilePatterns": ["demos/html/viewer/**/*.{ts,tsx,js,jsx}"] 27 | }, 28 | "outputs": ["{options.outputFile}"] 29 | } 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /packages/viewer/typings/module-name.d.ts: -------------------------------------------------------------------------------- 1 | declare module "Parser"; 2 | declare module "@wiris/mathtype-html-integration-devkit/src/parser"; 3 | -------------------------------------------------------------------------------- /packages/viewer/webpack.config.js: -------------------------------------------------------------------------------- 1 | const path = require("path"); 2 | 3 | module.exports = (config, context) => { 4 | return { 5 | entry: "./src/app.ts", 6 | mode: "none", 7 | module: { 8 | rules: [ 9 | { 10 | test: /\.tsx?$/, 11 | use: "ts-loader", 12 | exclude: /node_modules/, 13 | }, 14 | { 15 | test: /\.js$/, 16 | exclude: /node_modules/, 17 | use: ["babel-loader"], 18 | }, 19 | ], 20 | }, 21 | resolve: { 22 | extensions: [".tsx", ".ts", ".js"], 23 | }, 24 | output: { 25 | filename: "WIRISplugins.js", 26 | path: path.resolve(__dirname, "dist"), 27 | }, 28 | devServer: { 29 | devMiddleware: { 30 | writeToDisk: true, 31 | }, 32 | static: "./", 33 | hot: true, 34 | port: 8001, 35 | open: true, 36 | }, 37 | optimization: { 38 | minimize: true, // enabling this reduces file size and readability 39 | }, 40 | }; 41 | }; 42 | -------------------------------------------------------------------------------- /packages/wordpress/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | package-lock.json 3 | build -------------------------------------------------------------------------------- /packages/wordpress/README.md: -------------------------------------------------------------------------------- 1 | # Wiris WordPress Docker 2 | 3 | Wiris WordPress plugin allows WordPress pages to render MathML using MathType. 4 | 5 | > This is a dockerized development environment of Wiris' MathType for WordPress integration. 6 | 7 | ## Table of contents 8 | 9 | - [Requirements](#requirement) 10 | - [Structure](#structure) 11 | - [Next Steps](#next-steps) 12 | 13 | ## Requirements 14 | 15 | Install these on your computer: 16 | 17 | - Git. 18 | - [Docker](https://docs.docker.com) and [Docker Compose](https://docs.docker.com/compose/) installed. 19 | 20 | > **Tip**: Check the excellent [tutorial on how to install Docker on Ubuntu](https://www.digitalocean.com/community/tutorials/how-to-install-and-use-docker-on-ubuntu-20-04) from the folks at Digital Ocean. 21 | 22 | ## Structure 23 | 24 | - `build` 25 | - `docs`. The main documentation for the project. 26 | - `wordpress-wiris-plugin`. Plugin source code 27 | 28 | ## Next steps 29 | 30 | - [Install and start WordPress with MathType and Docker](docs/deploy/README.md) 31 | - [Build MathType Plugin](docs/build-plugin/README.md) 32 | - [Usage of the backend services](docs/build-backend/README.md) 33 | - [Users guide](docs/user-guide/README.md) 34 | -------------------------------------------------------------------------------- /packages/wordpress/VERSION: -------------------------------------------------------------------------------- 1 | 8.3.0.1455 -------------------------------------------------------------------------------- /packages/wordpress/bin/mathtype-wordpress-docker-start: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | echo 'Creating docker' 3 | docker compose up -d 4 | 5 | echo 'Waiting a bit' 6 | sleep 1s 7 | 8 | echo 'Restoring DB' 9 | # Execute the command inside the container 10 | docker exec -i wordpress-mysql-1 sh -c 'exec mysql -uroot -p"root" -h 127.0.0.1' < resources/database/backup.sql 11 | -------------------------------------------------------------------------------- /packages/wordpress/docker-compose.yml: -------------------------------------------------------------------------------- 1 | version: "3.1" 2 | services: 3 | wordpress: 4 | container_name: wiris-wordpress 5 | build: ./docker 6 | ports: 7 | - 8080:80 8 | environment: 9 | WORDPRESS_DB_HOST: mysql 10 | WORDPRESS_DB_USER: root 11 | WORDPRESS_DB_PASSWORD: root 12 | WORDPRESS_DB_NAME: wordpress 13 | links: 14 | - mysql:mysql 15 | volumes: 16 | - ${WORDPRESS_WWWROOT:-/var/www}/wordpress:/var/www/html 17 | - ./src/tiny_mce_wiris.php:/wiris/wp-content/plugins/tiny_mce_wiris.php 18 | - ./build/plugin.js:/wiris/wp-includes/js/tinymce/plugins/tiny_mce_wiris/plugin.js 19 | - ./build/plugin.min.js:/wiris/wp-includes/js/tinymce/plugins/tiny_mce_wiris/plugin.min.js 20 | - ./src/icons:/wiris/wp-includes/js/tinymce/plugins/tiny_mce_wiris/icons 21 | - ./resources/functions.php:/wiris/wp-content/themes/twentytwentytwo/functions.php 22 | mysql: 23 | image: mysql:8.0.13 24 | command: --default-authentication-plugin=mysql_native_password 25 | environment: 26 | MYSQL_DATABASE: wordpress 27 | MYSQL_ROOT_PASSWORD: root 28 | volumes: 29 | - ~/docker/mysql-data:/var/lib/mysql 30 | -------------------------------------------------------------------------------- /packages/wordpress/docker/Dockerfile: -------------------------------------------------------------------------------- 1 | # Situation: the wordpress:* images have an entrypoint script that: 2 | # 1. Checks what CMD is being run. If it starts with apache2, then it downloads the WordPress distribution. 3 | # 2. Runs the CMD normally. 4 | # We want to copy some Wiris files into the distribution. 5 | # Unfortunately, if we use straight up volumes, these files can be overwritten by the entrypoint. 6 | # We need to copy files AFTER the WordPress distribution has been downloaded but also run the origina CMD, apache2-foreground. 7 | # This solution creates a wrapper called apache2-foreground-custom, which given its name triggers the download of WordPress, 8 | # but internally first copies the Wiris files and then runs the actual apache2-foreground. 9 | 10 | FROM wordpress:php8.0-apache 11 | 12 | # Copy the faux apache2-foreground into the image 13 | COPY apache2-foreground-custom /bin/apache2-foreground-custom 14 | 15 | # Tell docker to run apache2-foreground-custom instead of apache2-foreground 16 | CMD ["apache2-foreground-custom"] 17 | -------------------------------------------------------------------------------- /packages/wordpress/docker/apache2-foreground-custom: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | # Copy custom wiris files inside of WordPress distribution 4 | cp -r /wiris/* /var/www/html 5 | 6 | # Run apache2-foreground normally and pass all arguments on 7 | apache2-foreground "$@" 8 | -------------------------------------------------------------------------------- /packages/wordpress/docs/build-backend/README.md: -------------------------------------------------------------------------------- 1 | # Build WordPress MathType back-end 2 | 3 | The WordPress MathType plugin can be build with a php back-end service. 4 | 5 | ## Add the server-side code 6 | 7 | 1. Navigate to https://store.wiris.com/en/products/downloads/mathtype/integrations. 8 | 2. Go to the `MathType MathType for TinyMCE 5` section. 9 | 3. Download the integration for the `PHP Servers`. 10 | 4. Unzip the downloaded file. 11 | 5. Copy to `wp-includes/js/tinymce/plugins/tiny_mce_wiris`: 12 | - The integration folder. 13 | - The configuration.ini file. 14 | 15 | ## Update the server-side code 16 | 17 | 1. Go to the `webpack.config.js`. 18 | 2. Replace the plugins section of the config variable for the commented section with the title `Use the local integration services`. 19 | 20 | > To go back to using the cloud services, replace the plugins section of the config variable for the commented section with the title `Use the cloud integration services`. 21 | 22 | 3. Update the code to use the back-end local services, using the following commands: 23 | 24 | ```sh 25 | html-integrations$ yarn install 26 | html-integrations$ nx build wordpress 27 | ``` 28 | 29 | > This will also automatically update the code on the Docker containers, if they're up. 30 | 31 | 4. Replace the `plugin.js` and `plugin.min.js` from `wp-includes/js/tinymce/plugins/tiny_mce_wiris` with the ones on the `mathtype-wordpress/build` folder. 32 | -------------------------------------------------------------------------------- /packages/wordpress/docs/build-plugin/README.md: -------------------------------------------------------------------------------- 1 | # Build WordPress MathType plugin 2 | 3 | The WordPress MathType plugin is an integration for TinyMCE 4.x. 4 | 5 | ## Build folder structure 6 | 7 | - `icons`. Set of images for the toolbar MathType and ChemType buttons. 8 | - `plugin.js`. The not minified compiled file, for debugging purposes. 9 | - `plugin.min.js` Compiled file that'll be used for the integration. 10 | 11 | ## Update the client-side code 12 | 13 | The client-side source code is located inside the folder: 14 | 15 | ``` 16 | packages/tinymce5/ 17 | ``` 18 | 19 | To update new changes, use the following commands: 20 | 21 | ```sh 22 | html-integrations$ yarn 23 | html-integrations$ nx build wordpress 24 | ``` 25 | 26 | > This will also automatically update the code on the Docker containers, if they're up. 27 | -------------------------------------------------------------------------------- /packages/wordpress/docs/deploy/README.md: -------------------------------------------------------------------------------- 1 | # Deploy WordPress with MathType and Docker 2 | 3 | Follow these instructions to set up your WordPress Docker container with the MathType plugin installed. 4 | 5 | ### 01. Create the build 6 | 7 | On the root folder, run the following commands to build the JS: 8 | 9 | ``` 10 | yarn 11 | nx build wordpress 12 | ``` 13 | 14 | ### 02. Run the Docker Image 15 | 16 | 1. Set the wordpress volume path: 17 | 18 | ```bash 19 | export WORDPRESS_WWWROOT="/var/www" 20 | ``` 21 | 22 | 2. On the root folder, build a docker container using the command: 23 | 24 | ```sh 25 | nx start wordpress 26 | ``` 27 | 28 | This will start a Docker with WordPress and MathType on [localhost:8080](http://localhost:8080/). 29 | 30 | > The code will be stored locally at `/wordpress`. 31 | 32 | ### 03. Login as admin 33 | 34 | 1. Navigate to admin dashboard [localhost:8080/wp-admin](http://localhost:8080/wp-admin). 35 | 2. Log in as admin: 36 | - **Username:** admin 37 | - **Passowrd:** admin 38 | 39 | ### 04. Use MathType for WordPress 40 | 41 | 1. On the admin dashboard, go to the 'Pages > all pages' and edit the MathType Sample page. 42 | 2. Click the `add block` button on your document. 43 | 3. Select the `classic` option. This will create a TinyMCE Classic editor. 44 | 4. Inside the `Classic block`, there'll be the MT/CT buttons on the toolbar ready to use. 45 | 46 | ### 04. Stop the docker image and WordPress 47 | 48 | On the root folder, take down all the docker containers for WordPress with the following command: 49 | 50 | ```sh 51 | nx stop wordpress 52 | ``` 53 | -------------------------------------------------------------------------------- /packages/wordpress/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@wiris/mathtype-wordpress", 3 | "version": "8.3.0", 4 | "description": "MathType for TinyMCE on WordPress", 5 | "keywords": [ 6 | "chem", 7 | "chemistry", 8 | "chemtype", 9 | "editor", 10 | "equation", 11 | "latex", 12 | "math", 13 | "mathml", 14 | "maths", 15 | "mathtype", 16 | "tinymce", 17 | "tinymce5", 18 | "wiris" 19 | ], 20 | "repository": "https://github.com/wiris/html-integrations/tree/master/packages/tinymce5", 21 | "homepage": "http://www.wiris.com/?utm_source=npmjs&utm_medium=referral", 22 | "bugs": { 23 | "email": "support@wiris.com" 24 | }, 25 | "license": "MIT", 26 | "author": "WIRIS Team (http://www.wiris.com/?utm_source=npmjs&utm_medium=referral)", 27 | "main": "plugin.min.js", 28 | "scripts": { 29 | "build": "webpack --mode production", 30 | "build-dev": "webpack --mode development", 31 | "start": "./bin/mathtype-wordpress-docker-start", 32 | "stop": "docker compose down", 33 | "clean": "shx rm -f build/plugin.js build/plugin.min.js", 34 | "prepack": "npm install && npm run build" 35 | }, 36 | "dependencies": { 37 | "@wiris/mathtype-html-integration-devkit": "^1.16.2" 38 | }, 39 | "devDependencies": { 40 | "@babel/core": "^7.24.4", 41 | "@babel/preset-env": "^7.24.4", 42 | "babel-loader": "^9.1.3", 43 | "css-loader": "^7.1.0", 44 | "shx": "^0.3.4", 45 | "style-loader": "^4.0.0", 46 | "terser-webpack-plugin": "^5.3.10" 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /packages/wordpress/project.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "wordpress", 3 | "$schema": "../../node_modules/nx/schemas/project-schema.json", 4 | "sourceRoot": "package/wordpress/src", 5 | "targets": { 6 | "build": { 7 | "executor": "nx:run-script", 8 | "options": { 9 | "script": "build" 10 | } 11 | }, 12 | "build-dev": { 13 | "executor": "nx:run-script", 14 | "options": { 15 | "script": "build-dev" 16 | } 17 | }, 18 | "start": { 19 | "dependsOn": ["build"], 20 | "executor": "nx:run-script", 21 | "options": { 22 | "script": "start" 23 | } 24 | }, 25 | "stop": { 26 | "dependsOn": ["start"], 27 | "executor": "nx:run-script", 28 | "options": { 29 | "script": "stop" 30 | } 31 | }, 32 | "test": { 33 | "executor": "@nx/cypress:cypress", 34 | "dependsOn": ["build"], 35 | "options": { 36 | "baseUrl": "http://localhost:8080", 37 | "cypressConfig": "./cypress.json" 38 | } 39 | }, 40 | "lint": { 41 | "executor": "@nx/linter:eslint", 42 | "options": { 43 | "eslintConfig": "./.eslintrc.js", 44 | "lintFilePatterns": ["packages/wordpress/**/*.{ts,tsx,js,jsx}"] 45 | }, 46 | "outputs": ["{options.outputFile}"] 47 | } 48 | } 49 | } 50 | -------------------------------------------------------------------------------- /packages/wordpress/src/icons/cas.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/wordpress/src/icons/cas.png -------------------------------------------------------------------------------- /packages/wordpress/src/icons/chem.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/wordpress/src/icons/chem.png -------------------------------------------------------------------------------- /packages/wordpress/src/icons/formula.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/wordpress/src/icons/formula.png -------------------------------------------------------------------------------- /packages/wordpress/src/icons/tinymce3/cas.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/wordpress/src/icons/tinymce3/cas.png -------------------------------------------------------------------------------- /packages/wordpress/src/icons/tinymce3/chem.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/wordpress/src/icons/tinymce3/chem.png -------------------------------------------------------------------------------- /packages/wordpress/src/icons/tinymce3/formula.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/wiris/html-integrations/5528076972518fa63c1b9c64b4944a50e63dd97e/packages/wordpress/src/icons/tinymce3/formula.png -------------------------------------------------------------------------------- /packages/wordpress/src/tiny_mce_wiris.php: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /scripts/createEnvFile.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Create environment.prod.ts file for the Angular + Froala demo. 3 | * 4 | * This script is run on the deploy-staging workflow in order to 5 | * set the Froala Key from GitHub secret on staging demo. 6 | */ 7 | 8 | const fs = require("fs"); 9 | 10 | const dir = "./demos/angular/froala/src/environments"; 11 | const prodFile = "environment.prod.ts"; 12 | 13 | const content = `export const environment = { production: true, froalaKey: "${process.env.FROALA_API_KEY || ""}" }`; 14 | 15 | fs.access(dir, fs.constants.F_OK, (err) => { 16 | if (err) { 17 | // Create environments folder on angular demo If doesn't exist 18 | fs.mkdir(dir, { recursive: true }, (err) => { 19 | if (err) throw err; 20 | }); 21 | } 22 | 23 | // Create environment.prod.ts with the froalaKey. 24 | try { 25 | fs.writeFileSync(dir + "/" + prodFile, content); 26 | } catch (err) { 27 | process.exit(1); 28 | } 29 | }); 30 | -------------------------------------------------------------------------------- /scripts/installCK5windows.js: -------------------------------------------------------------------------------- 1 | const { exec } = require("child_process"); 2 | const { emitWarning } = require("process"); 3 | 4 | const pack = () => 5 | new Promise((resolve, reject) => { 6 | exec("cd packages/mathtype-ckeditor5/ && npm pack --quiet ", (err, stdout, stderr) => { 7 | if (err) { 8 | reject(err); 9 | } 10 | // eslint-disable-next-line no-console 11 | console.log({ dout: stdout, derr: stderr }); 12 | resolve({ dout: stdout, derr: stderr }); 13 | }); 14 | }); 15 | 16 | const installMathtype = (path) => 17 | new Promise((resolve, reject) => { 18 | exec( 19 | `cd demos/html/ckeditor5 && npm install ../../../packages/mathtype-ckeditor5/${path}`, 20 | (err, stdout, stderr) => { 21 | if (err) { 22 | reject(err); 23 | } 24 | // eslint-disable-next-line no-console 25 | console.log({ dout: stdout, derr: stderr }); 26 | resolve({ dout: stdout, derr: stderr }); 27 | }, 28 | ); 29 | }); 30 | 31 | const sequenceExecution = () => 32 | Promise.resolve( 33 | pack().then((packOut) => { 34 | installMathtype(packOut.dout); 35 | }), 36 | ); 37 | 38 | // This file is being executed as a script. 39 | if (!module.parent) { 40 | // Process args 41 | const args = process.argv.slice(2); 42 | 43 | // Log a warning if there are more than 0 arguments 44 | if (args.length > 0) { 45 | emitWarning("No parameters needed, all the additional parameters will be ignored."); 46 | } 47 | 48 | // Execute all the tests and resolve when finished 49 | sequenceExecution(); 50 | } else { 51 | // This file is being imported as a module. 52 | module.exports = sequenceExecution; 53 | } 54 | -------------------------------------------------------------------------------- /staging/branch/html/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Demos %BRANCH% / HTML 6 | 7 | 8 | 9 |

All demos / Branch %BRANCH% / HTML

10 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /staging/branch/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Demos %BRANCH% 6 | 7 | 8 | 9 |

All demos / Branch %BRANCH%

10 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /staging/root/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | All demos 6 | 7 | 19 | 20 | 21 |

All demos

22 | 28 | 29 | 30 | -------------------------------------------------------------------------------- /staging/root/styles.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: sans-serif; 3 | } 4 | 5 | h2 { 6 | margin: 5px; 7 | } 8 | 9 | section { 10 | background-color: #7eff83; 11 | border: 1px solid #7eff83; 12 | border-radius: 15px; 13 | padding: 10px; 14 | margin: 5px; 15 | } 16 | -------------------------------------------------------------------------------- /terraform/.terraform.lock.hcl: -------------------------------------------------------------------------------- 1 | # This file is maintained automatically by "terraform init". 2 | # Manual edits may be lost in future updates. 3 | 4 | provider "registry.terraform.io/hashicorp/aws" { 5 | version = "4.33.0" 6 | constraints = ">= 2.7.0, ~> 4.0" 7 | hashes = [ 8 | "h1:2MWU+HIKKivfhY8dAU1cR0xxwlzNrWOZEQs8BApQ/Ao=", 9 | "zh:421b24e21d7fac4d65d97438d2c0a4effe71d3a1bd15820d6fde2879e49fe817", 10 | "zh:4378a84ca8e2a6990f47abc24367b801e884be928671b37ad7b8e7b656f73e48", 11 | "zh:54e0d7884edf3cefd096715794d32b6532138dca905f0b2fe84fb2117594293c", 12 | "zh:6269a7d0312057db5ded669e9f7f9bd80fb6dcb549b50d8d7f3f3b2a0361b8a5", 13 | "zh:67f57d16aa3db493a3174c3c5f30385c7af9767c4e3cdca14e5a4bf384ff59d9", 14 | "zh:7d4d4a1d963e431ffdc3348e3a578d3ba0fa782b1f4bf55fd5c0e527d24fed81", 15 | "zh:9b12af85486a96aedd8d7984b0ff811a4b42e3d88dad1a3fb4c0b580d04fa425", 16 | "zh:cd8e3d32485acb49c1b06f63916fec8e73a4caa6cf88ae9c4bf236d6f5d9b914", 17 | "zh:d586fd01195bd3775346495e61806e79b6012e745dc05e31a30b958acf968abe", 18 | "zh:d76122060f25ab87887a743096a42d47ba091c2c019ac13ce6b3973b2babe5a3", 19 | "zh:e917d36fe18eddc42ec743b3152b4dcb4853b75ea7a679abd19bdf271bc48221", 20 | "zh:eb780860d5c04f43a018aef564e76a2d84e9aa68984fa1f968ca8c09d23a611a", 21 | ] 22 | } 23 | -------------------------------------------------------------------------------- /terraform/backend.staging.conf: -------------------------------------------------------------------------------- 1 | bucket = "wiris-static-website-staging-terraform-state" 2 | key = "integrations-html-staging-state" 3 | region = "us-east-1" 4 | -------------------------------------------------------------------------------- /terraform/integrations.staging.tfvars: -------------------------------------------------------------------------------- 1 | # CAUTION: This file is under version control and is added in the git repository. 2 | # Use this file only to set non-sensible data. 3 | # If you need to set Terraform environment variables with sensible data, please, use TF_VAR_ or -var flag. 4 | # https://www.terraform.io/docs/language/values/variables.html 5 | 6 | project = "html-integrations" 7 | dns_zone = "wiris.kitchen" 8 | fqdn = "integrations.wiris.kitchen" 9 | environment = "staging" 10 | team = "Integrations" 11 | region = "eu-west-2" 12 | repo = "https://github.com/wiris/html-integrations/" 13 | bucket_name = "wiris-integrations-staging-html" 14 | is_staging = false # If enviroment is not staging change it to true. 15 | -------------------------------------------------------------------------------- /terraform/variables.tf: -------------------------------------------------------------------------------- 1 | # Use inputs variable to set default values to Terraform variables. 2 | # Set the Terraform variables values using .tfvars files and adding that file as -var-file flag parameter: 3 | # $ terraform plan -var-file staging.tfvars 4 | 5 | variable "environment" { 6 | description = "The environment where to mount the infrastructure." 7 | type = string 8 | 9 | validation { 10 | condition = can(regex("staging|production", var.environment)) 11 | error_message = "The 'environment' input variable MUST be one of the following strings: \"staging\" or \"production\". Use -var-file flag or TF_VAR_ environment variable." 12 | } 13 | } 14 | 15 | variable "dns_zone" { 16 | description = "The domain to use as route53 zone" 17 | type = string 18 | } 19 | 20 | variable "fqdn" { 21 | description = "The subdomain to use as route53 zone" 22 | type = string 23 | } 24 | 25 | variable "project" { 26 | description = "" 27 | type = string 28 | } 29 | 30 | variable "bucket_name" { 31 | description = "" 32 | type = string 33 | } 34 | 35 | variable "team" { 36 | description = "" 37 | type = string 38 | } 39 | 40 | variable "region" { 41 | description = "" 42 | type = string 43 | } 44 | 45 | variable "repo" { 46 | description = "" 47 | type = string 48 | } 49 | 50 | variable "is_staging" { 51 | type = bool 52 | } 53 | 54 | variable "function_name" { 55 | description = "" 56 | default = "basic_auth" 57 | type = string 58 | } 59 | -------------------------------------------------------------------------------- /tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "baseUrl": ".", 5 | "outDir": "../../dist/out-tsc", 6 | "types": ["node"] 7 | }, 8 | "exclude": ["**/*.spec.js"], 9 | "include": ["**/*.js"] 10 | } 11 | -------------------------------------------------------------------------------- /tsconfig.base.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "rootDir": ".", 5 | "sourceMap": true, 6 | "declaration": false, 7 | "moduleResolution": "node", 8 | "emitDecoratorMetadata": true, 9 | "experimentalDecorators": true, 10 | "importHelpers": true, 11 | "target": "es2015", 12 | "module": "esnext", 13 | "lib": ["es2017", "dom"], 14 | "skipLibCheck": true, 15 | "skipDefaultLibCheck": true, 16 | "baseUrl": ".", 17 | "paths": {} 18 | }, 19 | "exclude": ["node_modules", "tmp"] 20 | } 21 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.base.json", 3 | "files": [], 4 | "include": [], 5 | "references": [ 6 | { 7 | "path": "./tsconfig.app.json" 8 | } 9 | ] 10 | } 11 | --------------------------------------------------------------------------------