diff --git a/.gitignore b/.gitignore index c3d3c1a1..21a52a85 100644 --- a/.gitignore +++ b/.gitignore @@ -49,4 +49,6 @@ Thumbs.db *.wmv **/build/**/* -.vscode \ No newline at end of file +.vscode + +*/test/playground/dist \ No newline at end of file diff --git a/README.md b/README.md index 5be5b197..604b94aa 100644 --- a/README.md +++ b/README.md @@ -1,8 +1,12 @@ -# wisemapping-frontend +# WiseMapping Frond End -This is a WIP migration from [legacy wisemapping](https://bitbucket.org/wisemapping/wisemapping-open-source/) into a modern web development project with multiple improvements. +WiseMapping Frond End is part of the [MindMap Open Source Project](http://www.wisemapping.org). The first release of WiseMapping was in 2010 and there was not mayor update on the architecture. In 2021, a major change started with the goal to provide a visual and technology refresh of the project. -This monorepo uses lerna and contains all the packages that compose the wisemapping frontend. +WiseMapping Front extracts all the UI related aspects in this repository. You will find three major modules: + +* Web2D: Lighway abstraction over SVG for chart renderding. +* Mindplot: Pure vanilla ES6 classes responsible for providing mindmap rendering and edition capabilities. +* Webapp: REACT application that encompass the whole midnmap adminitraction experience. ## Getting started @@ -18,7 +22,7 @@ Please refer to each package's Readme.md for anything specific to the package. If you want to contribute, please check out [CONTRIBUTING.md](./CONTRIBUTING.md). -## Scripts +## Useful scripts Each package might provide the following scripts. You can run these for all packages by running it from the root folder. Alternatively you can run it for a specific package by passing the `--scope` option. diff --git a/bitbucket-pipelines.yml b/bitbucket-pipelines.yml index bd690ee3..3fd78c62 100644 --- a/bitbucket-pipelines.yml +++ b/bitbucket-pipelines.yml @@ -7,24 +7,24 @@ image: cypress/included:8.4.1 pipelines: - default: - - parallel: - - step: - name: Build and test - caches: - - node - - npm - - cypress - script: - - export CYPRESS_imageSnaphots="true" - - yarn install - - yarn bootstrap - - yarn build - - yarn lint - - yarn test - artifacts: - - packages/**/cypress/snapshots/**/__diff_output__/*.diff.png + branches: + '{master,develop}': + - step: + name: Build and test + caches: + - node + - npm + - cypress + script: + - export CYPRESS_imageSnaphots="true" + - yarn install + - yarn bootstrap + - yarn build + - yarn lint + - yarn test + artifacts: + - packages/**/cypress/snapshots/**/__diff_output__/*.diff.png definitions: caches: npm: $HOME/.npm - cypress: $HOME/.cache/Cypress \ No newline at end of file + cypress: $HOME/.cache/Cypress diff --git a/dist/app.bundle.js b/dist/app.bundle.js new file mode 120000 index 00000000..f2a3cf8e --- /dev/null +++ b/dist/app.bundle.js @@ -0,0 +1 @@ +../packages/webapp/dist/app.bundle.js \ No newline at end of file diff --git a/dist/app.bundle.js.map b/dist/app.bundle.js.map new file mode 120000 index 00000000..28bc2016 --- /dev/null +++ b/dist/app.bundle.js.map @@ -0,0 +1 @@ +../packages/webapp/dist/app.bundle.js.map \ No newline at end of file diff --git a/dist/loader.js b/dist/loader.js new file mode 120000 index 00000000..dbe817ac --- /dev/null +++ b/dist/loader.js @@ -0,0 +1 @@ +../packages/mindplot/dist/loader.js \ No newline at end of file diff --git a/dist/loader.js.map b/dist/loader.js.map new file mode 120000 index 00000000..6c712459 --- /dev/null +++ b/dist/loader.js.map @@ -0,0 +1 @@ +../packages/mindplot/dist/loader.js.map \ No newline at end of file diff --git a/dist/vendors.bundle.js b/dist/vendors.bundle.js new file mode 120000 index 00000000..147ef093 --- /dev/null +++ b/dist/vendors.bundle.js @@ -0,0 +1 @@ +../packages/webapp/dist/vendors.bundle.js \ No newline at end of file diff --git a/dist/vendors.bundle.js.map b/dist/vendors.bundle.js.map new file mode 120000 index 00000000..d0cf1e4d --- /dev/null +++ b/dist/vendors.bundle.js.map @@ -0,0 +1 @@ +../packages/webapp/dist/vendors.bundle.js.map \ No newline at end of file diff --git a/docker-compose.snapshots.update.yml b/docker-compose.snapshots.update.yml index 13ff636a..8eab2a22 100644 --- a/docker-compose.snapshots.update.yml +++ b/docker-compose.snapshots.update.yml @@ -3,7 +3,7 @@ services: e2e: image: cypress/included:8.4.1 container_name: wisemapping-integration-tests - entrypoint: '/bin/sh -c "yarn install && yarn bootstrap && yarn test:integration"' + entrypoint: '/bin/sh -c "yarn install && yarn bootstrap && yarn build && yarn test:integration"' working_dir: /e2e environment: - CYPRESS_imageSnaphots=true @@ -16,7 +16,6 @@ services: - node-modules-mindplot:/e2e/packages/mindplot/node_modules - node-modules-web2d:/e2e/packages/web2d/node_modules - node-modules-webapp:/e2e/packages/webapp/node_modules - - node-modules-webcomponent:/e2e/packages/webcomponent/node_modules - cypress-binary-cache:/root/.cache/Cypress volumes: node-modules: {} @@ -25,5 +24,4 @@ volumes: node-modules-mindplot: {} node-modules-web2d: {} node-modules-webapp: {} - node-modules-webcomponent: {} cypress-binary-cache: {} diff --git a/docker-compose.snapshots.yml b/docker-compose.snapshots.yml index 76af0667..2f498c27 100644 --- a/docker-compose.snapshots.yml +++ b/docker-compose.snapshots.yml @@ -3,7 +3,7 @@ services: e2e: image: cypress/included:8.4.1 container_name: wisemapping-integration-tests - entrypoint: '/bin/sh -c "yarn install && yarn bootstrap && yarn test:integration"' + entrypoint: '/bin/sh -c "yarn bootstrap && yarn build && yarn test:integration"' working_dir: /e2e environment: - CYPRESS_imageSnaphots=true @@ -15,7 +15,6 @@ services: - node-modules-mindplot:/e2e/packages/mindplot/node_modules - node-modules-web2d:/e2e/packages/web2d/node_modules - node-modules-webapp:/e2e/packages/webapp/node_modules - - node-modules-webcomponent:/e2e/packages/webcomponent/node_modules - cypress-binary-cache:/root/.cache/Cypress volumes: node-modules: {} @@ -24,5 +23,4 @@ volumes: node-modules-mindplot: {} node-modules-web2d: {} node-modules-webapp: {} - node-modules-webcomponent: {} cypress-binary-cache: {} diff --git a/lang/en.json b/lang/en.json deleted file mode 100644 index ce471db5..00000000 --- a/lang/en.json +++ /dev/null @@ -1,87 +0,0 @@ -{ - "footer.aboutus": { - "defaultMessage": "About Us" - }, - "footer.contactus": { - "defaultMessage": "Contact Us" - }, - "footer.donations": { - "defaultMessage": "PayPal Donations" - }, - "footer.faq": { - "defaultMessage": "F.A.Q." - }, - "footer.feedback": { - "defaultMessage": "Feedback" - }, - "footer.opensource": { - "defaultMessage": "Open Source" - }, - "footer.termsandconditions": { - "defaultMessage": "Term And Conditions" - }, - "header.donthaveaccount": { - "defaultMessage": "Don't have an account ?" - }, - "header.haveaccount": { - "defaultMessage": "Already have an account?" - }, - "login.email": { - "defaultMessage": "Email" - }, - "login.error": { - "defaultMessage": "The login.email address or login.password you entered is not valid." - }, - "login.forgotpwd": { - "defaultMessage": "Forgot Password ?" - }, - "login.hsqldbcofig": { - "defaultMessage": "Although HSQLDB is bundled with WiseMapping by default during the installation, we do not recommend this database for production use. Please consider using MySQL 5.7 instead. You can find more information how to configure MySQL", - "description": "Missing production database configured" - }, - "login.loginto": { - "defaultMessage": "Log Into Your Account" - }, - "login.password": { - "defaultMessage": "Password" - }, - "login.remberme": { - "defaultMessage": "Remember me" - }, - "login.signin": { - "defaultMessage": "Sign In" - }, - "login.signup": { - "defaultMessage": "Sign Up" - }, - "login.userinactive": { - "defaultMessage": "Sorry, your account has not been activated yet. You'll receive a notification login.email when it becomes active. Stay tuned!." - }, - "login.welcome": { - "defaultMessage": "Welcome" - }, - "registration.become": { - "defaultMessage": "Become a member of our comunity" - }, - "registration.email": { - "defaultMessage": "Email" - }, - "registration.firstname": { - "defaultMessage": "First Name" - }, - "registration.lastname": { - "defaultMessage": "Last Name" - }, - "registration.password": { - "defaultMessage": "Password" - }, - "registration.register": { - "defaultMessage": "Register" - }, - "registration.signup": { - "defaultMessage": "Signing up is free and just take a moment" - }, - "registration.termandconditions": { - "defaultMessage": "Terms of Service: Please check the WiseMapping Account information you've entered above, and review the Terms of Service here. By clicking on 'Register' below you are agreeing to the Terms of Service above and the Privacy Policy" - } -} \ No newline at end of file diff --git a/package.json b/package.json index a016a9e0..0a6cd91b 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "wisemapping-font-end", + "name": "wisemapping-front-end", "scripts": { "bootstrap": "lerna bootstrap", "build": "lerna run build", @@ -44,5 +44,6 @@ }, "homepage": "http://localhost:8080/react", "license": "https://wisemapping.atlassian.net/wiki/spaces/WS/pages/524357/WiseMapping+Public+License+Version+1.0+WPL", - "version": "0.4.0" + "version": "0.4.0", + "dependencies": {} } diff --git a/packages/core-js/src/index.js b/packages/core-js/src/index.js index 651c773b..1cbb3ff5 100644 --- a/packages/core-js/src/index.js +++ b/packages/core-js/src/index.js @@ -16,21 +16,6 @@ * limitations under the License. */ -export const innerXML = function (node) { - // summary: - // Implementation of MS's innerXML function. - if ($defined(node.innerXML)) { - return node.innerXML; - // string - } else if ($defined(node.xml)) { - return node.xml; - // string - } else if ($defined(XMLSerializer)) { - return new XMLSerializer().serializeToString(node); - // string - } -}; - /** * Cross-browser implementation of creating an XML document object. */ @@ -61,7 +46,7 @@ export const createDocument = function () { obj - object to inspect */ - export const $defined = function (obj) { +export const $defined = function (obj) { return obj != undefined; }; diff --git a/packages/core-js/webpack.common.js b/packages/core-js/webpack.common.js index 30fde1f0..d8837887 100644 --- a/packages/core-js/webpack.common.js +++ b/packages/core-js/webpack.common.js @@ -28,5 +28,8 @@ module.exports = { resolve: { extensions: ['.js'], }, - plugins: [new CleanWebpackPlugin()], + plugins: [new CleanWebpackPlugin({ + dangerouslyAllowCleanPatternsOutsideProject: true, + dry: false, + })], }; diff --git a/packages/editor/.babelrc b/packages/editor/.babelrc new file mode 100644 index 00000000..fbd6da0e --- /dev/null +++ b/packages/editor/.babelrc @@ -0,0 +1,6 @@ +{ + "presets": [ + "@babel/preset-env", + "@babel/preset-react" + ] +} \ No newline at end of file diff --git a/packages/editor/.gitignore b/packages/editor/.gitignore new file mode 100644 index 00000000..c96f2fe9 --- /dev/null +++ b/packages/editor/.gitignore @@ -0,0 +1,4 @@ +cypress/screenshots +cypress/videos +cypress/downloads +cypress/snapshots/*/__diff_output__ \ No newline at end of file diff --git a/packages/editor/README.md b/packages/editor/README.md new file mode 100644 index 00000000..9a81c0ce --- /dev/null +++ b/packages/editor/README.md @@ -0,0 +1,28 @@ +# Editor + +React Component for the wisemapping editor. + +## Usage + +This is a work in progress and for now mindplot needs to be instantiated using the initCallback prop. Check `test/playground/map-render` for some usage examples. + + import Editor from `@wisemapping/editor`; + + ReactDOM.render( + console.log('action called:', action)} + initCallback={initialization} + />, + document.getElementById('root'), + ); + + +## i18n + +Messages are translated in the `lang` folder, and then compiled to `src/compiled-lang` using the following command: + + yarn compile lang/de.json --ast --out-file src/compiled-lang/de.json diff --git a/packages/editor/cypress.json b/packages/editor/cypress.json new file mode 100644 index 00000000..eb4dad54 --- /dev/null +++ b/packages/editor/cypress.json @@ -0,0 +1,6 @@ +{ + "video": false, + "videoUploadOnPasses": false, + "baseUrl": "http://localhost:8081" + } + \ No newline at end of file diff --git a/packages/editor/cypress/fixtures/example.json b/packages/editor/cypress/fixtures/example.json new file mode 100644 index 00000000..02e42543 --- /dev/null +++ b/packages/editor/cypress/fixtures/example.json @@ -0,0 +1,5 @@ +{ + "name": "Using fixtures to represent data", + "email": "hello@cypress.io", + "body": "Fixtures are a great way to mock data for responses to routes" +} diff --git a/packages/editor/cypress/integration/playground.test.js b/packages/editor/cypress/integration/playground.test.js new file mode 100644 index 00000000..34e19eb8 --- /dev/null +++ b/packages/editor/cypress/integration/playground.test.js @@ -0,0 +1,22 @@ +context('Playground', () => { + it('viewmode page should match its snapshot', () => { + ['welcome', 'sample1', 'sample2', 'sample3', 'sample4', 'sample5', 'sample6', 'complex', 'img-support', 'icon-sample'].forEach((mapId) => { + cy.visit(`/viewmode.html?id=${mapId}`); + cy.get('#mindplot.ready').should('exist'); + cy.matchImageSnapshot(`viewmode-${mapId}`); + }); + }); + it('the playground container.html page should match its snapshot', () => { + cy.visit('/container.html'); + cy.getIframeBody() + .find('#mindplot.ready') + .should('exist'); + cy.matchImageSnapshot('container'); + }); + it('the playground editor.html page should match its snapshot', () => { + cy.visit('/editor.html'); + cy.get('#mindplot.ready').should('exist'); + // TODO: why is the editor appearing twice in the snapshot? + cy.matchImageSnapshot('editor'); + }); +}); diff --git a/packages/editor/cypress/integration/relationship.test.js b/packages/editor/cypress/integration/relationship.test.js new file mode 100644 index 00000000..fc567502 --- /dev/null +++ b/packages/editor/cypress/integration/relationship.test.js @@ -0,0 +1,16 @@ +context('Relationship Topics', () => { + beforeEach(() => { + cy.visit('/editor.html'); + cy.reload(); + cy.get('[test-id="30-11-relationship"]').click({ force: true }); + }); + + it('Change shape relationship', () => { + cy.get('[test-id="control-56"]').trigger('mousedown', { force: true }); + cy.get('body').trigger('mousemove', { clientX: 500, clientY: 200 }); + cy.get('body').trigger('mouseup'); + cy.matchImageSnapshot('changeShapeRealtionship'); + + cy.get('[test-id="control-56"]').invoke('attr', 'cy').should('eq', '-131.75'); + }); +}); diff --git a/packages/editor/cypress/integration/topicFontChange.test.js b/packages/editor/cypress/integration/topicFontChange.test.js new file mode 100644 index 00000000..029df1a1 --- /dev/null +++ b/packages/editor/cypress/integration/topicFontChange.test.js @@ -0,0 +1,67 @@ +context('Edit Topic', () => { + // TODO: review why click({force: true}) is needed in these tests + // also, why is the element outside the viewport in screenshots? + beforeEach(() => { + cy.visit('/editor.html'); + cy.reload(); + cy.get('[test-id=1]').click(); + }); + + it('Change Main Topic Text', () => { + cy.get('body').type('New Title Main Topic{enter}'); + cy.get('[test-id=1] > text > tspan').should('have.text', 'New Title Main Topic'); + cy.matchImageSnapshot('changeMainTopicText'); + }); + + it('Change Font Size', () => { + cy.get('#fontSizeTip').click(); + cy.get('.popover #small').click({ force: true }); + + cy.get('[test-id=1] > text').invoke('attr', 'font-size').should('eq', '8.0625'); + cy.matchImageSnapshot('changeFontSizeSmall'); + + cy.get('#fontSizeTip').click(); + cy.get('.popover #normal').click({ force: true }); + + cy.get('[test-id=1] > text').invoke('attr', 'font-size').should('eq', '10.75'); + cy.matchImageSnapshot('changeFontSizeNormal'); + + cy.get('#fontSizeTip').click(); + cy.get('.popover #large').click({ force: true }); + + cy.get('[test-id=1] > text').invoke('attr', 'font-size').should('eq', '13.4375'); + cy.matchImageSnapshot('changeFontSizeLarge'); + + cy.get('#fontSizeTip').click(); + cy.get('.popover #huge').click({ force: true }); + + cy.get('[test-id=1] > text').invoke('attr', 'font-size').should('eq', '20.15625'); + cy.matchImageSnapshot('changeFontSizeHuge'); + }); + + it('Change Font type', () => { + cy.get('#fontFamilyTip').click(); + cy.get('[model="Times"]').click({ force: true }); + + cy.get('[test-id=1] > text').invoke('attr', 'font-family').should('eq', 'Times'); + + cy.matchImageSnapshot('changeFontType'); + }); + + it('Change Font Italic', () => { + cy.get('#fontItalicTip').click(); + + cy.get('[test-id=1] > text').invoke('attr', 'font-style').should('eq', 'italic'); + + cy.matchImageSnapshot('changeFontItalic'); + }); + + it('Change Font color', () => { + cy.get('#fontColorTip').click(); + cy.get('[title="RGB (153, 0, 255)"]').click({ force: true }); + + cy.get('[test-id=1] > text').invoke('attr', 'fill').should('eq', 'rgb(153, 0, 255)'); + + cy.matchImageSnapshot('changeFontColor'); + }); +}); diff --git a/packages/editor/cypress/integration/topicManager.test.js b/packages/editor/cypress/integration/topicManager.test.js new file mode 100644 index 00000000..d45e974c --- /dev/null +++ b/packages/editor/cypress/integration/topicManager.test.js @@ -0,0 +1,49 @@ +context('Node manager', () => { + before(() => { + cy.visit('/editor.html'); + }); + + it('shortcut add sibling node', () => { + cy.contains('Mind Mapping').click(); + cy.get('body').type('{enter}').type('Mind Mapping rocks!!').type('{enter}'); + + cy.get('[test-id=36] > text > tspan').should('exist'); + + cy.matchImageSnapshot('editor-shortcut-edit'); + }); + + it('shortcut add child node', () => { + cy.contains('Mind Mapping rocks!!').click(); + cy.get('body').type('{insert}').type('Child 1 mind Mapping rocks!!').type('{enter}'); + cy.get('body').type('{enter}').type('Child 2 mind Mapping rocks!!').type('{enter}'); + + cy.get('[test-id=36] > text > tspan').should('exist'); + cy.get('[test-id=37] > text > tspan').should('exist'); + + cy.matchImageSnapshot('addChildNodeSortcut'); + }); + + it('Delete topic', () => { + cy.get('[test-id=37]').click(); + cy.get('body').type('{del}'); + + cy.get('[test-id=37]').should('not.exist'); + + cy.matchImageSnapshot('deleteTopicShortcut'); + }); + + it('undo changes', () => { + cy.get('#undoEditionTip').click(); + + cy.get('[test-id=36] > text > tspan').should('exist'); + + cy.matchImageSnapshot('undoChange'); + }); + + it('Save changes', () => { + cy.contains('Mind Mapping rocks!!').click(); + cy.get('body').type('{ctrl}s'); + + cy.matchImageSnapshot('saveChagesShortcut'); + }); +}); diff --git a/packages/editor/cypress/integration/topicPosition.test.js b/packages/editor/cypress/integration/topicPosition.test.js new file mode 100644 index 00000000..83c8d409 --- /dev/null +++ b/packages/editor/cypress/integration/topicPosition.test.js @@ -0,0 +1,35 @@ +context('Change topic position', () => { + beforeEach(() => { + cy.visit('/editor.html'); + cy.reload(); + }); + + it('Move up node "Mind Mapping"', () => { + const position = { clientX: 270, clientY: 160 }; + cy.contains('Mind Mapping').trigger('mousedown'); + cy.get('body').trigger('mousemove', position); + cy.get('body').trigger('mouseup'); + cy.matchImageSnapshot('moveupNode'); + }); + + it('Move down node "Mind Mapping"', () => { + cy.contains('Mind Mapping').trigger('mousedown'); + cy.get('body').trigger('mousemove', { clientX: 350, clientY: 380 }); + cy.get('body').trigger('mouseup'); + cy.matchImageSnapshot('movedownNode'); + }); + + it('Move default position node "Mind Mapping"', () => { + cy.contains('Mind Mapping').trigger('mousedown'); + cy.get('body').trigger('mousemove', { clientX: 270, clientY: 240 }); + cy.get('body').trigger('mouseup'); + cy.matchImageSnapshot('moveDefaultPosition'); + }); + + it('Move left node "Mind Mapping"', () => { + cy.contains('Mind Mapping').trigger('mousedown'); + cy.get('body').trigger('mousemove', { clientX: 700, clientY: 240 }); + cy.get('body').trigger('mouseup'); + cy.matchImageSnapshot('moveleftNode'); + }); +}); diff --git a/packages/editor/cypress/integration/topicShape.test.js b/packages/editor/cypress/integration/topicShape.test.js new file mode 100644 index 00000000..618e22c2 --- /dev/null +++ b/packages/editor/cypress/integration/topicShape.test.js @@ -0,0 +1,44 @@ +context('Change Topic shape', () => { + beforeEach(() => { + cy.visit('/editor.html'); + cy.reload(); + cy.contains('Try it Now!').click(); + }); + + it('change to square shape', () => { + cy.get('#topicShapeTip').click(); + cy.get('#rectagle').click({ force: true }); + + cy.get('[test-id=11] > rect').eq(1).invoke('attr', 'rx').should('eq', '0'); + + cy.matchImageSnapshot('changeToSquareShape'); + }); + + it('change to rounded rectagle', () => { + cy.get('#topicShapeTip').click(); + // TODO: The parameter {force: true} was placed because it does not detect that the element is visible + cy.get('#rounded_rectagle').click({ force: true }); + + cy.get('[test-id=11] > rect').eq(1).invoke('attr', 'rx').should('eq', '4.05'); + + cy.matchImageSnapshot('changeToRoundedRectagle'); + }); + + it('change to line', () => { + cy.get('#topicShapeTip').click(); + // TODO: The parameter {force: true} was placed because it does not detect that the element is visible + cy.get('#line').click({ force: true }); + + cy.matchImageSnapshot('changeToLine'); + }); + + it('change to elipse shape', () => { + cy.get('#topicShapeTip').click(); + // TODO: The parameter {force: true} was placed because it does not detect that the element is visible + cy.get('#elipse').click({ force: true }); + + cy.get('[test-id=11] > rect').eq(1).invoke('attr', 'rx').should('eq', '12.15'); + + cy.matchImageSnapshot('changeToElipseShape'); + }); +}); diff --git a/packages/editor/cypress/plugins/index.js b/packages/editor/cypress/plugins/index.js new file mode 100644 index 00000000..8a0fa140 --- /dev/null +++ b/packages/editor/cypress/plugins/index.js @@ -0,0 +1,24 @@ +/// +// *********************************************************** +// This example plugins/index.js can be used to load plugins +// +// You can change the location of this file or turn off loading +// the plugins file with the 'pluginsFile' configuration option. +// +// You can read more here: +// https://on.cypress.io/plugins-guide +// *********************************************************** + +// This function is called when a project is opened or re-opened (e.g. due to +// the project's config changing) + +const { addMatchImageSnapshotPlugin } = require('cypress-image-snapshot/plugin'); + +/** + * @type {Cypress.PluginConfig} + */ +module.exports = (on, config) => { + // `on` is used to hook into various events Cypress emits + // `config` is the resolved Cypress config + addMatchImageSnapshotPlugin(on, config); +}; diff --git a/packages/editor/cypress/snapshots/playground.test.js/container.snap.png b/packages/editor/cypress/snapshots/playground.test.js/container.snap.png new file mode 100644 index 00000000..9f1ebc4d Binary files /dev/null and b/packages/editor/cypress/snapshots/playground.test.js/container.snap.png differ diff --git a/packages/editor/cypress/snapshots/playground.test.js/editor.snap.png b/packages/editor/cypress/snapshots/playground.test.js/editor.snap.png new file mode 100644 index 00000000..b0b65038 Binary files /dev/null and b/packages/editor/cypress/snapshots/playground.test.js/editor.snap.png differ diff --git a/packages/editor/cypress/snapshots/playground.test.js/viewmode-complex.snap.png b/packages/editor/cypress/snapshots/playground.test.js/viewmode-complex.snap.png new file mode 100644 index 00000000..849393df Binary files /dev/null and b/packages/editor/cypress/snapshots/playground.test.js/viewmode-complex.snap.png differ diff --git a/packages/editor/cypress/snapshots/playground.test.js/viewmode-icon-sample.snap.png b/packages/editor/cypress/snapshots/playground.test.js/viewmode-icon-sample.snap.png new file mode 100644 index 00000000..c5812db7 Binary files /dev/null and b/packages/editor/cypress/snapshots/playground.test.js/viewmode-icon-sample.snap.png differ diff --git a/packages/editor/cypress/snapshots/playground.test.js/viewmode-img-support.snap.png b/packages/editor/cypress/snapshots/playground.test.js/viewmode-img-support.snap.png new file mode 100644 index 00000000..77de8b0f Binary files /dev/null and b/packages/editor/cypress/snapshots/playground.test.js/viewmode-img-support.snap.png differ diff --git a/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample1.snap.png b/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample1.snap.png new file mode 100644 index 00000000..8069012d Binary files /dev/null and b/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample1.snap.png differ diff --git a/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample2.snap.png b/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample2.snap.png new file mode 100644 index 00000000..cca81e14 Binary files /dev/null and b/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample2.snap.png differ diff --git a/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample3.snap.png b/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample3.snap.png new file mode 100644 index 00000000..9e39d25e Binary files /dev/null and b/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample3.snap.png differ diff --git a/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample4.snap.png b/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample4.snap.png new file mode 100644 index 00000000..5b18b272 Binary files /dev/null and b/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample4.snap.png differ diff --git a/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample5.snap.png b/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample5.snap.png new file mode 100644 index 00000000..f0fb0bb0 Binary files /dev/null and b/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample5.snap.png differ diff --git a/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample6.snap.png b/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample6.snap.png new file mode 100644 index 00000000..2ba68358 Binary files /dev/null and b/packages/editor/cypress/snapshots/playground.test.js/viewmode-sample6.snap.png differ diff --git a/packages/editor/cypress/snapshots/playground.test.js/viewmode-welcome.snap.png b/packages/editor/cypress/snapshots/playground.test.js/viewmode-welcome.snap.png new file mode 100644 index 00000000..6350ebae Binary files /dev/null and b/packages/editor/cypress/snapshots/playground.test.js/viewmode-welcome.snap.png differ diff --git a/packages/editor/cypress/snapshots/relationship.test.js/changeShapeRealtionship.snap.png b/packages/editor/cypress/snapshots/relationship.test.js/changeShapeRealtionship.snap.png new file mode 100644 index 00000000..e8f04dcb Binary files /dev/null and b/packages/editor/cypress/snapshots/relationship.test.js/changeShapeRealtionship.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontColor.snap.png b/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontColor.snap.png new file mode 100644 index 00000000..bd46a0c7 Binary files /dev/null and b/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontColor.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontItalic.snap.png b/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontItalic.snap.png new file mode 100644 index 00000000..61878965 Binary files /dev/null and b/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontItalic.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontSizeHuge.snap.png b/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontSizeHuge.snap.png new file mode 100644 index 00000000..b3f20e57 Binary files /dev/null and b/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontSizeHuge.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontSizeLarge.snap.png b/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontSizeLarge.snap.png new file mode 100644 index 00000000..6093c856 Binary files /dev/null and b/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontSizeLarge.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontSizeNormal.snap.png b/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontSizeNormal.snap.png new file mode 100644 index 00000000..5d2c1ab1 Binary files /dev/null and b/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontSizeNormal.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontSizeSmall.snap.png b/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontSizeSmall.snap.png new file mode 100644 index 00000000..19454e12 Binary files /dev/null and b/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontSizeSmall.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontType.snap.png b/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontType.snap.png new file mode 100644 index 00000000..b3f20e57 Binary files /dev/null and b/packages/editor/cypress/snapshots/topicFontChange.test.js/changeFontType.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicFontChange.test.js/changeMainTopicText.snap.png b/packages/editor/cypress/snapshots/topicFontChange.test.js/changeMainTopicText.snap.png new file mode 100644 index 00000000..ecf6ee6c Binary files /dev/null and b/packages/editor/cypress/snapshots/topicFontChange.test.js/changeMainTopicText.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicManager.test.js/addChildNodeSortcut.snap.png b/packages/editor/cypress/snapshots/topicManager.test.js/addChildNodeSortcut.snap.png new file mode 100644 index 00000000..34e379d5 Binary files /dev/null and b/packages/editor/cypress/snapshots/topicManager.test.js/addChildNodeSortcut.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicManager.test.js/deleteTopicShortcut.snap.png b/packages/editor/cypress/snapshots/topicManager.test.js/deleteTopicShortcut.snap.png new file mode 100644 index 00000000..63798511 Binary files /dev/null and b/packages/editor/cypress/snapshots/topicManager.test.js/deleteTopicShortcut.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicManager.test.js/editor-shortcut-edit.snap.png b/packages/editor/cypress/snapshots/topicManager.test.js/editor-shortcut-edit.snap.png new file mode 100644 index 00000000..b8161ccb Binary files /dev/null and b/packages/editor/cypress/snapshots/topicManager.test.js/editor-shortcut-edit.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicManager.test.js/saveChagesShortcut.snap.png b/packages/editor/cypress/snapshots/topicManager.test.js/saveChagesShortcut.snap.png new file mode 100644 index 00000000..d6f29c5a Binary files /dev/null and b/packages/editor/cypress/snapshots/topicManager.test.js/saveChagesShortcut.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicManager.test.js/undoChange.snap.png b/packages/editor/cypress/snapshots/topicManager.test.js/undoChange.snap.png new file mode 100644 index 00000000..c86635dd Binary files /dev/null and b/packages/editor/cypress/snapshots/topicManager.test.js/undoChange.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicPosition.test.js/moveDefaultPosition.snap.png b/packages/editor/cypress/snapshots/topicPosition.test.js/moveDefaultPosition.snap.png new file mode 100644 index 00000000..82c0b061 Binary files /dev/null and b/packages/editor/cypress/snapshots/topicPosition.test.js/moveDefaultPosition.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicPosition.test.js/movedownNode.snap.png b/packages/editor/cypress/snapshots/topicPosition.test.js/movedownNode.snap.png new file mode 100644 index 00000000..cc4dd671 Binary files /dev/null and b/packages/editor/cypress/snapshots/topicPosition.test.js/movedownNode.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicPosition.test.js/moveleftNode.snap.png b/packages/editor/cypress/snapshots/topicPosition.test.js/moveleftNode.snap.png new file mode 100644 index 00000000..a4cde1a1 Binary files /dev/null and b/packages/editor/cypress/snapshots/topicPosition.test.js/moveleftNode.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicPosition.test.js/moveupNode.snap.png b/packages/editor/cypress/snapshots/topicPosition.test.js/moveupNode.snap.png new file mode 100644 index 00000000..1054b7f8 Binary files /dev/null and b/packages/editor/cypress/snapshots/topicPosition.test.js/moveupNode.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicShape.test.js/changeToElipseShape.snap.png b/packages/editor/cypress/snapshots/topicShape.test.js/changeToElipseShape.snap.png new file mode 100644 index 00000000..39cc85a3 Binary files /dev/null and b/packages/editor/cypress/snapshots/topicShape.test.js/changeToElipseShape.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicShape.test.js/changeToLine.snap.png b/packages/editor/cypress/snapshots/topicShape.test.js/changeToLine.snap.png new file mode 100644 index 00000000..15ca03a8 Binary files /dev/null and b/packages/editor/cypress/snapshots/topicShape.test.js/changeToLine.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicShape.test.js/changeToRoundedRectagle.snap.png b/packages/editor/cypress/snapshots/topicShape.test.js/changeToRoundedRectagle.snap.png new file mode 100644 index 00000000..114beb30 Binary files /dev/null and b/packages/editor/cypress/snapshots/topicShape.test.js/changeToRoundedRectagle.snap.png differ diff --git a/packages/editor/cypress/snapshots/topicShape.test.js/changeToSquareShape.snap.png b/packages/editor/cypress/snapshots/topicShape.test.js/changeToSquareShape.snap.png new file mode 100644 index 00000000..a6617bae Binary files /dev/null and b/packages/editor/cypress/snapshots/topicShape.test.js/changeToSquareShape.snap.png differ diff --git a/packages/editor/cypress/support/commands.js b/packages/editor/cypress/support/commands.js new file mode 100644 index 00000000..85cef3a6 --- /dev/null +++ b/packages/editor/cypress/support/commands.js @@ -0,0 +1,24 @@ +import { addMatchImageSnapshotCommand } from 'cypress-image-snapshot/command'; + +// make matchImageSnapshot() call the real implementation only if CYPRESS_imageSnaphots is set +// otherwise it calls a noop +if (Cypress.env('imageSnaphots')) { + addMatchImageSnapshotCommand({ + failureThreshold: 0.001, + failureThresholdType: 'percent', + }); +} else { + Cypress.Commands.add( + 'matchImageSnapshot', + { + prevSubject: ['optional', 'element', 'window', 'document'], + }, + () => Promise.resolve(), + ); +} + +// https://www.cypress.io/blog/2020/02/12/working-with-iframes-in-cypress/ +Cypress.Commands.add('getIframeBody', () => cy + .get('iframe') + .its('0.contentDocument.body').should('not.be.empty') + .then(cy.wrap)); diff --git a/packages/editor/cypress/support/index.js b/packages/editor/cypress/support/index.js new file mode 100644 index 00000000..37a498fb --- /dev/null +++ b/packages/editor/cypress/support/index.js @@ -0,0 +1,20 @@ +// *********************************************************** +// This example support/index.js is processed and +// loaded automatically before your test files. +// +// This is a great place to put global configuration and +// behavior that modifies Cypress. +// +// You can change the location of this file or turn off +// automatically serving support files with the +// 'supportFile' configuration option. +// +// You can read more here: +// https://on.cypress.io/configuration +// *********************************************************** + +// Import commands.js using ES2015 syntax: +import './commands'; + +// Alternatively you can use CommonJS syntax: +// require('./commands') diff --git a/packages/editor/images/account.svg b/packages/editor/images/account.svg new file mode 100644 index 00000000..9ba309ee --- /dev/null +++ b/packages/editor/images/account.svg @@ -0,0 +1,3 @@ + \ No newline at end of file diff --git a/packages/editor/images/add.svg b/packages/editor/images/add.svg new file mode 100644 index 00000000..ddb7eeef --- /dev/null +++ b/packages/editor/images/add.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/ajax-loader.gif b/packages/editor/images/ajax-loader.gif new file mode 100644 index 00000000..92153b08 Binary files /dev/null and b/packages/editor/images/ajax-loader.gif differ diff --git a/packages/editor/images/back-icon.svg b/packages/editor/images/back-icon.svg new file mode 100644 index 00000000..2a970a40 --- /dev/null +++ b/packages/editor/images/back-icon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/center_focus.svg b/packages/editor/images/center_focus.svg new file mode 100644 index 00000000..e8017c36 --- /dev/null +++ b/packages/editor/images/center_focus.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/discard.svg b/packages/editor/images/discard.svg new file mode 100644 index 00000000..989837ca --- /dev/null +++ b/packages/editor/images/discard.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/export.svg b/packages/editor/images/export.svg new file mode 100644 index 00000000..11ff822e --- /dev/null +++ b/packages/editor/images/export.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/favicon.ico b/packages/editor/images/favicon.ico new file mode 100644 index 00000000..955c5116 Binary files /dev/null and b/packages/editor/images/favicon.ico differ diff --git a/packages/mindplot/test/playground/map-render/images/favicon.png b/packages/editor/images/favicon.png similarity index 100% rename from packages/mindplot/test/playground/map-render/images/favicon.png rename to packages/editor/images/favicon.png diff --git a/packages/editor/images/font-bold.svg b/packages/editor/images/font-bold.svg new file mode 100644 index 00000000..9df69edf --- /dev/null +++ b/packages/editor/images/font-bold.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/font-color.svg b/packages/editor/images/font-color.svg new file mode 100644 index 00000000..a695c281 --- /dev/null +++ b/packages/editor/images/font-color.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/font-italic.svg b/packages/editor/images/font-italic.svg new file mode 100644 index 00000000..630eb0cd --- /dev/null +++ b/packages/editor/images/font-italic.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/font-size.svg b/packages/editor/images/font-size.svg new file mode 100644 index 00000000..856af577 --- /dev/null +++ b/packages/editor/images/font-size.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/font-type.svg b/packages/editor/images/font-type.svg new file mode 100644 index 00000000..177a8635 --- /dev/null +++ b/packages/editor/images/font-type.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/history.svg b/packages/editor/images/history.svg new file mode 100644 index 00000000..3f7c900b --- /dev/null +++ b/packages/editor/images/history.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/keyboard.svg b/packages/editor/images/keyboard.svg new file mode 100644 index 00000000..c3b8e54a --- /dev/null +++ b/packages/editor/images/keyboard.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/logo-small.svg b/packages/editor/images/logo-small.svg new file mode 100644 index 00000000..fae99531 --- /dev/null +++ b/packages/editor/images/logo-small.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/editor/images/logo-text-black.svg b/packages/editor/images/logo-text-black.svg new file mode 100644 index 00000000..5b042da3 --- /dev/null +++ b/packages/editor/images/logo-text-black.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/editor/images/minus.svg b/packages/editor/images/minus.svg new file mode 100644 index 00000000..7dd812a8 --- /dev/null +++ b/packages/editor/images/minus.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/note-add.svg b/packages/editor/images/note-add.svg new file mode 100644 index 00000000..362f452e --- /dev/null +++ b/packages/editor/images/note-add.svg @@ -0,0 +1,1049 @@ + + + + Material Design Color, Flat Colors, Icons, Color Palette | Material UI + + +

(╯°□°)╯︵ ┻━┻

Not Found.

+ + diff --git a/packages/editor/images/print.svg b/packages/editor/images/print.svg new file mode 100644 index 00000000..21fdce2b --- /dev/null +++ b/packages/editor/images/print.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/public.svg b/packages/editor/images/public.svg new file mode 100644 index 00000000..ddcd5677 --- /dev/null +++ b/packages/editor/images/public.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/pwrdby-white.svg b/packages/editor/images/pwrdby-white.svg new file mode 100644 index 00000000..cf8d9c3a --- /dev/null +++ b/packages/editor/images/pwrdby-white.svg @@ -0,0 +1,5 @@ + + + + + \ No newline at end of file diff --git a/packages/editor/images/redo.svg b/packages/editor/images/redo.svg new file mode 100644 index 00000000..97d99c8b --- /dev/null +++ b/packages/editor/images/redo.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/save.svg b/packages/editor/images/save.svg new file mode 100644 index 00000000..f5b5c7cf --- /dev/null +++ b/packages/editor/images/save.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/topic-add.svg b/packages/editor/images/topic-add.svg new file mode 100644 index 00000000..25db132c --- /dev/null +++ b/packages/editor/images/topic-add.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/topic-border.svg b/packages/editor/images/topic-border.svg new file mode 100644 index 00000000..ae7e7a32 --- /dev/null +++ b/packages/editor/images/topic-border.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/topic-color.svg b/packages/editor/images/topic-color.svg new file mode 100644 index 00000000..4064d0a6 --- /dev/null +++ b/packages/editor/images/topic-color.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/topic-delete.svg b/packages/editor/images/topic-delete.svg new file mode 100644 index 00000000..08b05d02 --- /dev/null +++ b/packages/editor/images/topic-delete.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/topic-icon.svg b/packages/editor/images/topic-icon.svg new file mode 100644 index 00000000..9254873e --- /dev/null +++ b/packages/editor/images/topic-icon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/topic-link.svg b/packages/editor/images/topic-link.svg new file mode 100644 index 00000000..8eb3b987 --- /dev/null +++ b/packages/editor/images/topic-link.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/topic-note.svg b/packages/editor/images/topic-note.svg new file mode 100644 index 00000000..d065cbf1 --- /dev/null +++ b/packages/editor/images/topic-note.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/topic-notes.svg b/packages/editor/images/topic-notes.svg new file mode 100644 index 00000000..d065cbf1 --- /dev/null +++ b/packages/editor/images/topic-notes.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/topic-relation.svg b/packages/editor/images/topic-relation.svg new file mode 100644 index 00000000..05c81f8a --- /dev/null +++ b/packages/editor/images/topic-relation.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/topic-shape.svg b/packages/editor/images/topic-shape.svg new file mode 100644 index 00000000..2b3f3171 --- /dev/null +++ b/packages/editor/images/topic-shape.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/images/undo.svg b/packages/editor/images/undo.svg new file mode 100644 index 00000000..038aa75e --- /dev/null +++ b/packages/editor/images/undo.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/editor/index.html b/packages/editor/index.html deleted file mode 100644 index 453c01d8..00000000 --- a/packages/editor/index.html +++ /dev/null @@ -1,13 +0,0 @@ - - - - - - Wisemapping - - - - -
- - diff --git a/packages/editor/lang/de.json b/packages/editor/lang/de.json new file mode 100644 index 00000000..bf777ed4 --- /dev/null +++ b/packages/editor/lang/de.json @@ -0,0 +1,14 @@ +{ + "editor.try-welcome": { + "defaultMessage": "Dieser Ausgabebereich zeigt einige der Mindmap-Editor-Funktionen!" + }, + "editor.try-welcome-description": { + "defaultMessage": "Melden Sie sich an, um kostenlos eine unbegrenzte Anzahl von Mindmaps zu erstellen, zu teilen und zu veröffentlichen." + }, + "login.signup": { + "defaultMessage": "Anmeldung" + }, + "action.share": { + "defaultMessage": "Teilen" + } +} \ No newline at end of file diff --git a/packages/editor/lang/en.json b/packages/editor/lang/en.json new file mode 100644 index 00000000..c1eaa0bd --- /dev/null +++ b/packages/editor/lang/en.json @@ -0,0 +1,14 @@ +{ + "editor.try-welcome": { + "defaultMessage": "This edition space showcases some of the mindmap editor capabilities !" + }, + "editor.try-welcome-description": { + "defaultMessage": "Sign Up to start creating, sharing and publishing unlimited number of mindmaps for free." + }, + "login.signup": { + "defaultMessage": "Sign Up" + }, + "action.share": { + "defaultMessage": "Share" + } +} \ No newline at end of file diff --git a/packages/editor/lang/es.json b/packages/editor/lang/es.json new file mode 100644 index 00000000..df4a128a --- /dev/null +++ b/packages/editor/lang/es.json @@ -0,0 +1,14 @@ +{ + "editor.try-welcome": { + "defaultMessage": "¡Este espacio de edición muestra algunas de las capacidades del editor de mapas mentales!" + }, + "editor.try-welcome-description": { + "defaultMessage": "Registrate para comenzar a crear, compartir y publicar una cantidad ilimitada de mapas mentales de forma gratuita." + }, + "login.signup": { + "defaultMessage": "Crear cuenta" + }, + "action.share": { + "defaultMessage": "Compartir" + } +} \ No newline at end of file diff --git a/packages/editor/lang/fr.json b/packages/editor/lang/fr.json new file mode 100644 index 00000000..ce7af6f5 --- /dev/null +++ b/packages/editor/lang/fr.json @@ -0,0 +1,14 @@ +{ + "editor.try-welcome": { + "defaultMessage": "Cet espace d'édition présente certaines des fonctionnalités de l'éditeur de cartes mentales !" + }, + "editor.try-welcome-description": { + "defaultMessage": "Inscrivez-vous pour commencer à créer, partager et publier gratuitement un nombre illimité de cartes mentales." + }, + "login.signup": { + "defaultMessage": "S'inscrire" + }, + "action.share": { + "defaultMessage": "Partager" + } +} \ No newline at end of file diff --git a/packages/editor/package.json b/packages/editor/package.json index 7c3f42b8..181f2320 100644 --- a/packages/editor/package.json +++ b/packages/editor/package.json @@ -1,30 +1,56 @@ { "name": "@wisemapping/editor", - "version": "1.0.0", - "main": "src/index.tsx", - "scripts": {}, + "version": "0.4.1", + "main": "dist/editor.bundle.js", + "scripts": { + "build": "webpack --config webpack.prod.js", + "playground": "webpack serve --config webpack.playground.js", + "cy:run": "cypress run", + "test:integration": "start-server-and-test 'yarn playground' http-get://localhost:8081 'yarn cy:run'", + "test": "yarn test:integration", + "extract": "for lang in {'es','en','fr','de'};do formatjs extract 'src/**/*.ts*' --ignore 'src/@types/**/*' --out-file lang/${lang}.json;done", + "compile": "formatjs compile" + }, "repository": "http://www.wisemapping.com", "author": "Paulo Veiga , Ezequiel Bergamaschi ", "license": "MIT", "private": false, "devDependencies": { + "@babel/preset-env": "^7.16.11", + "@babel/preset-react": "^7.16.7", + "@formatjs/cli": "^4.8.1", "@types/react": "^17.0.0", "@types/react-dom": "^17.0.0", "@typescript-eslint/eslint-plugin": "^4.8.1", "@typescript-eslint/parser": "^4.8.1", + "clean-webpack-plugin": "^4.0.0", + "compression-webpack-plugin": "^9.2.0", + "copy-webpack-plugin": "^10.2.1", + "cypress": "^8.4.1", + "cypress-image-snapshot": "^4.0.1", "eslint": "^7.14.0", "eslint-config-prettier": "^8.0.0", + "eslint-plugin-cypress": "^2.12.1", "eslint-plugin-react": "^7.21.5", "eslint-plugin-react-hooks": "^4.2.0", + "html-webpack-plugin": "^5.5.0", "prettier": "^2.2.1", + "react": "^17.0.0", "ts-loader": "^8.0.11", "ts-node": "^9.0.0", - "typescript": "^4.1.2" + "typescript": "^4.1.2", + "webpack": "^5.67.0", + "webpack-dev-server": "^4.7.3", + "webpack-merge": "^5.8.0" }, "dependencies": { "@types/styled-components": "^5.1.4", - "react": "^17.0.1", - "react-dom": "^17.0.1", + "@wisemapping/mindplot": "^5.0.1", "styled-components": "^5.2.1" + }, + "peerDependencies": { + "react": "^17.0.0", + "react-dom": "^17.0.0", + "react-intl": "^5.24.3" } } \ No newline at end of file diff --git a/packages/editor/src/@types/index.d.ts b/packages/editor/src/@types/index.d.ts new file mode 100644 index 00000000..79579dba --- /dev/null +++ b/packages/editor/src/@types/index.d.ts @@ -0,0 +1,4 @@ +declare module "*.svg" { + const content: any; + export default content; +} \ No newline at end of file diff --git a/packages/editor/src/compiled-lang/de.json b/packages/editor/src/compiled-lang/de.json new file mode 100644 index 00000000..ac8ea4ac --- /dev/null +++ b/packages/editor/src/compiled-lang/de.json @@ -0,0 +1,26 @@ +{ + "action.share": [ + { + "type": 0, + "value": "Teilen" + } + ], + "editor.try-welcome": [ + { + "type": 0, + "value": "Dieser Ausgabebereich zeigt einige der Mindmap-Editor-Funktionen!" + } + ], + "editor.try-welcome-description": [ + { + "type": 0, + "value": "Melden Sie sich an, um kostenlos eine unbegrenzte Anzahl von Mindmaps zu erstellen, zu teilen und zu veröffentlichen." + } + ], + "login.signup": [ + { + "type": 0, + "value": "Anmeldung" + } + ] +} \ No newline at end of file diff --git a/packages/editor/src/compiled-lang/en.json b/packages/editor/src/compiled-lang/en.json new file mode 100644 index 00000000..ab5c90b6 --- /dev/null +++ b/packages/editor/src/compiled-lang/en.json @@ -0,0 +1,26 @@ +{ + "action.share": [ + { + "type": 0, + "value": "Share" + } + ], + "editor.try-welcome": [ + { + "type": 0, + "value": "This edition space showcases some of the mindmap editor capabilities !" + } + ], + "editor.try-welcome-description": [ + { + "type": 0, + "value": "Sign Up to start creating, sharing and publishing unlimited number of mindmaps for free." + } + ], + "login.signup": [ + { + "type": 0, + "value": "Sign Up" + } + ] +} \ No newline at end of file diff --git a/packages/editor/src/compiled-lang/es.json b/packages/editor/src/compiled-lang/es.json new file mode 100644 index 00000000..19ff2e8a --- /dev/null +++ b/packages/editor/src/compiled-lang/es.json @@ -0,0 +1,26 @@ +{ + "action.share": [ + { + "type": 0, + "value": "Compartir" + } + ], + "editor.try-welcome": [ + { + "type": 0, + "value": "¡Este espacio de edición muestra algunas de las capacidades del editor de mapas mentales!" + } + ], + "editor.try-welcome-description": [ + { + "type": 0, + "value": "Registrate para comenzar a crear, compartir y publicar una cantidad ilimitada de mapas mentales de forma gratuita." + } + ], + "login.signup": [ + { + "type": 0, + "value": "Crear cuenta" + } + ] +} \ No newline at end of file diff --git a/packages/editor/src/compiled-lang/fr.json b/packages/editor/src/compiled-lang/fr.json new file mode 100644 index 00000000..a7f74b02 --- /dev/null +++ b/packages/editor/src/compiled-lang/fr.json @@ -0,0 +1,26 @@ +{ + "action.share": [ + { + "type": 0, + "value": "Partager" + } + ], + "editor.try-welcome": [ + { + "type": 0, + "value": "Cet espace d'édition présente certaines des fonctionnalités de l'éditeur de cartes mentales !" + } + ], + "editor.try-welcome-description": [ + { + "type": 0, + "value": "Inscrivez-vous pour commencer à créer, partager et publier gratuitement un nombre illimité de cartes mentales." + } + ], + "login.signup": [ + { + "type": 0, + "value": "S'inscrire" + } + ] +} \ No newline at end of file diff --git a/packages/editor/src/components/action-button/index.ts b/packages/editor/src/components/action-button/index.ts new file mode 100644 index 00000000..39c79067 --- /dev/null +++ b/packages/editor/src/components/action-button/index.ts @@ -0,0 +1,25 @@ +import styled from 'styled-components'; + +const ActionButton = styled.div` + cursor: pointer; + margin: 0px 10px; + font-family: Arial, Helvetica, sans-serif; + user-select: none; + vertical-align: middle; + justify-content: center; + padding: 10px 25px; + font-size: 15px; + min-width: 64px; + box-sizing: border-box; + font-weight: 600; + border-radius: 9px; + color: white; + background-color: #ffa800; + display: inline-block; + + &:hover { + transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; + } +`; + +export default ActionButton; \ No newline at end of file diff --git a/packages/editor/src/components/canvas/index.tsx b/packages/editor/src/components/canvas/index.tsx deleted file mode 100644 index eeb2d746..00000000 --- a/packages/editor/src/components/canvas/index.tsx +++ /dev/null @@ -1,6 +0,0 @@ -import React from 'react'; -import { StyledCanvas } from './styled'; - -const Canvas = (): React.ReactElement => canvas; - -export default Canvas; diff --git a/packages/editor/src/components/canvas/styled.ts b/packages/editor/src/components/canvas/styled.ts deleted file mode 100644 index 7cc7eb85..00000000 --- a/packages/editor/src/components/canvas/styled.ts +++ /dev/null @@ -1,8 +0,0 @@ -import styled from 'styled-components'; - -export const StyledCanvas = styled.div` - height: 100% - width: 100%; - flex: 1; - -`; diff --git a/packages/editor/src/components/footer/index.tsx b/packages/editor/src/components/footer/index.tsx index d654d237..52e1b8ce 100644 --- a/packages/editor/src/components/footer/index.tsx +++ b/packages/editor/src/components/footer/index.tsx @@ -1,6 +1,55 @@ import React from 'react'; -import { StyledFooter } from './styled'; +import { StyledLogo, Notifier } from './styled'; +import { useIntl } from 'react-intl'; -const Footer = (): React.ReactElement => footer; +import KeyboardSvg from '../../../images/keyboard.svg'; +import AddSvg from '../../../images/add.svg'; +import MinusSvg from '../../../images/minus.svg'; +import CenterFocusSvg from '../../../images/center_focus.svg'; +import ActionButton from '../action-button'; + +export type FooterPropsType = { + showTryPanel?: boolean; +}; + +const Footer = ({ showTryPanel }: FooterPropsType): React.ReactElement => { + const intl = useIntl(); + + return ( + <> +
+
+ +
+
+ + +
+
+ +
+
+ + + {showTryPanel && ( +
+

{intl.formatMessage({ id: 'editor.try-welcome' })}

+

{intl.formatMessage({ id: 'editor.try-welcome-description' })}

+ + + {intl.formatMessage({ id: 'login.signup', defaultMessage: 'Sign Up' })} + + +
+ )} + + ); +}; export default Footer; diff --git a/packages/editor/src/components/footer/styled.ts b/packages/editor/src/components/footer/styled.ts index b731d333..ea900704 100644 --- a/packages/editor/src/components/footer/styled.ts +++ b/packages/editor/src/components/footer/styled.ts @@ -1,8 +1,31 @@ import styled from 'styled-components'; import { times } from '../../size'; +import LogoTextBlackSvg from '../../../images/logo-text-black.svg'; export const StyledFooter = styled.div` height: ${times(10)}; width: 100%; border: 1px solid black; `; + +export const StyledLogo = styled.div` + position: fixed; + left: 20px; + bottom: 10px; + background: url(${LogoTextBlackSvg}) no-repeat; + width: 90px; + height: 40px; +`; + +export const Notifier = styled.div` + border: 1px solid rgb(241, 163, 39); + background-color: rgb(252, 235, 192); + border-radius: 3px; + position: fixed; + padding: 5px 9px; + color: back; + white-space: nowrap; + margin-top: 5px; + display: none; + bottom: 10px; +`; diff --git a/packages/editor/src/components/frame/index.tsx b/packages/editor/src/components/frame/index.tsx deleted file mode 100644 index b809c9db..00000000 --- a/packages/editor/src/components/frame/index.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import React from 'react'; -import Footer from '../footer'; -import TopBar from '../top-bar'; -import Canvas from '../canvas'; -import { StyledFrame } from './styled'; - -const Frame = (): React.ReactElement => ( - - - -