From 9be9bed8110d3166c64af4d454a7aeb1b07c36bf Mon Sep 17 00:00:00 2001 From: Paulo Gustavo Veiga Date: Mon, 3 Jan 2022 12:06:55 -0800 Subject: [PATCH] Revert "Work IP" This reverts commit 129f6693216e08d9f6641f3f5804817d25978f4c. --- packages/web2d/src/components/Font.js | 27 +++++----- packages/web2d/src/components/Text.js | 17 +++--- packages/web2d/src/components/Toolkit.js | 14 +---- .../src/components/peer/svg/ArialFont.js | 16 ++++-- .../components/peer/svg/BrushScriptFont.js | 27 ---------- .../peer/svg/{FontPeer.js => Font.js} | 12 ++--- .../src/components/peer/svg/TahomaFont.js | 16 ++++-- .../web2d/src/components/peer/svg/TextPeer.js | 53 ++++++++++++------- .../src/components/peer/svg/TimesFont.js | 16 ++++-- .../src/components/peer/svg/VerdanaFont.js | 16 ++++-- packages/web2d/test/playground/font.html | 7 --- packages/web2d/test/playground/font.js | 14 ++--- packages/web2d/test/playground/text.js | 4 +- 13 files changed, 124 insertions(+), 115 deletions(-) delete mode 100644 packages/web2d/src/components/peer/svg/BrushScriptFont.js rename packages/web2d/src/components/peer/svg/{FontPeer.js => Font.js} (91%) diff --git a/packages/web2d/src/components/Font.js b/packages/web2d/src/components/Font.js index b81812c9..97324f55 100644 --- a/packages/web2d/src/components/Font.js +++ b/packages/web2d/src/components/Font.js @@ -16,12 +16,13 @@ * limitations under the License. */ -import TransformUtil from './peer/utils/TransformUtils'; import Toolkit from './Toolkit'; +import TransformUtil from './peer/utils/TransformUtils'; class Font { - constructor(fontName) { - this.peer = Toolkit.createFontByName(fontName); + constructor(fontFamily, textPeer) { + this.peer = Toolkit[`create${fontFamily}Font`](); + this._textPeer = textPeer; } getHtmlSize() { @@ -50,6 +51,10 @@ class Font { return this.peer.getWeight(); } + getFontFamily() { + return this.peer.getFontFamily(); + } + setSize(size) { return this.peer.setSize(size); } @@ -62,20 +67,18 @@ class Font { return this.peer.setWeight(weight); } - setFontName(fontName) { - return this.peer.setFontName(fontName); - } - - getFontName() { + getFont() { return this.peer.getFont(); } - getFontPeer() { - return this.peer; - } - getWidthMargin() { return this.peer.getWidthMargin(); } } + +Font.ARIAL = 'Arial'; +Font.TIMES = 'Times'; +Font.TAHOMA = 'Tahoma'; +Font.VERDANA = 'Verdana'; + export default Font; diff --git a/packages/web2d/src/components/Text.js b/packages/web2d/src/components/Text.js index 8619baf8..1df94ce6 100644 --- a/packages/web2d/src/components/Text.js +++ b/packages/web2d/src/components/Text.js @@ -17,14 +17,13 @@ */ import { $assert } from '@wisemapping/core-js'; -import Font from './Font'; import ElementClass from './ElementClass'; import Toolkit from './Toolkit'; +import Font from './Font'; class Text extends ElementClass { constructor(attributes) { - const defaultFont = new Font('Arial'); - const peer = Toolkit.createText(defaultFont); + const peer = Toolkit.createText(Font); super(peer, attributes); } @@ -54,10 +53,6 @@ class Text extends ElementClass { this.peer.setFont(font, size, style, weight); } - setFontName(fontName) { - this.peer.setFontName(fontName); - } - setColor(color) { this.peer.setColor(color); } @@ -74,6 +69,10 @@ class Text extends ElementClass { this.peer.setWeight(weight); } + setFontFamily(family) { + this.peer.setFontFamily(family); + } + getFont() { return this.peer.getFont(); } @@ -82,8 +81,8 @@ class Text extends ElementClass { this.peer.setSize(size); } - getHtmlFontSize(scale) { - return this.peer.getHtmlFontSize(scale); + getHtmlFontSize() { + return this.peer.getHtmlFontSize(); } getWidth() { diff --git a/packages/web2d/src/components/Toolkit.js b/packages/web2d/src/components/Toolkit.js index acfdbf51..22bdf3d4 100644 --- a/packages/web2d/src/components/Toolkit.js +++ b/packages/web2d/src/components/Toolkit.js @@ -29,14 +29,8 @@ import ArialFont from './peer/svg/ArialFont'; import TimesFont from './peer/svg/TimesFont'; import VerdanaFont from './peer/svg/VerdanaFont'; import TahomaFont from './peer/svg/TahomaFont'; -import BrushScriptMTFont from './peer/svg/BrushScriptFont'; class Toolkit { - static createFontByName(fontName) { - const font = fontName.replaceAll(' ', ''); - return Toolkit[`create${font}Font`](); - } - static createWorkspace(element) { return new WorkspacePeer(element); } @@ -65,8 +59,8 @@ class Toolkit { return new ArrowPeer(); } - static createText(font) { - return new TextPeer(font.getFontPeer()); + static createText(Font) { + return new TextPeer(Font); } static createImage() { @@ -92,10 +86,6 @@ class Toolkit { static createTahomaFont() { return new TahomaFont(); } - - static createBrushScriptMTFont() { - return new BrushScriptMTFont(); - } } export default Toolkit; diff --git a/packages/web2d/src/components/peer/svg/ArialFont.js b/packages/web2d/src/components/peer/svg/ArialFont.js index efe8bcba..85ceb484 100644 --- a/packages/web2d/src/components/peer/svg/ArialFont.js +++ b/packages/web2d/src/components/peer/svg/ArialFont.js @@ -15,11 +15,21 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import FontPeer from './FontPeer'; +import Font from './Font'; -class ArialFont extends FontPeer { +class ArialFont extends Font { constructor() { - super('Arial'); + super(); + this._fontFamily = 'Arial'; + } + + getFontFamily() { + return this._fontFamily; + } + + // eslint-disable-next-line class-methods-use-this + getFont() { + return Font.ARIAL; } } diff --git a/packages/web2d/src/components/peer/svg/BrushScriptFont.js b/packages/web2d/src/components/peer/svg/BrushScriptFont.js deleted file mode 100644 index 3aa94cdc..00000000 --- a/packages/web2d/src/components/peer/svg/BrushScriptFont.js +++ /dev/null @@ -1,27 +0,0 @@ -/* - * Copyright [2021] [wisemapping] - * - * Licensed under WiseMapping Public License, Version 1.0 (the "License"). - * It is basically the Apache License, Version 2.0 (the "License") plus the - * "powered by wisemapping" text requirement on every single page; - * you may not use this file except in compliance with the License. - * You may obtain a copy of the license at - * - * http://www.wisemapping.org/license - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -import FontPeer from './FontPeer'; - -class BrushScriptMTFont extends FontPeer { - // eslint-disable-next-line class-methods-use-this - constructor() { - super('Brush Script MT'); - } -} - -export default BrushScriptMTFont; diff --git a/packages/web2d/src/components/peer/svg/FontPeer.js b/packages/web2d/src/components/peer/svg/Font.js similarity index 91% rename from packages/web2d/src/components/peer/svg/FontPeer.js rename to packages/web2d/src/components/peer/svg/Font.js index 8f8f1efb..0d341805 100644 --- a/packages/web2d/src/components/peer/svg/FontPeer.js +++ b/packages/web2d/src/components/peer/svg/Font.js @@ -17,12 +17,11 @@ */ import { $assert, $defined } from '@wisemapping/core-js'; -class FontPeer { - constructor(fontName) { +class Font { + constructor() { this._size = 10; this._style = 'normal'; this._weight = 'normal'; - this._fontName = fontName; } init(args) { @@ -90,11 +89,6 @@ class FontPeer { } return result; } - - // eslint-disable-next-line class-methods-use-this - getFontName() { - return this._fontName; - } } -export default FontPeer; +export default Font; diff --git a/packages/web2d/src/components/peer/svg/TahomaFont.js b/packages/web2d/src/components/peer/svg/TahomaFont.js index 69bb8830..640d5dd9 100644 --- a/packages/web2d/src/components/peer/svg/TahomaFont.js +++ b/packages/web2d/src/components/peer/svg/TahomaFont.js @@ -15,11 +15,21 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import FontPeer from './FontPeer'; +import Font from './Font'; -class TahomaFont extends FontPeer { +class TahomaFont extends Font { constructor() { - super('Verdana'); + super(); + this._fontFamily = 'Tahoma'; + } + + getFontFamily() { + return this._fontFamily; + } + + // eslint-disable-next-line class-methods-use-this + getFont() { + return Font.TAHOMA; } } diff --git a/packages/web2d/src/components/peer/svg/TextPeer.js b/packages/web2d/src/components/peer/svg/TextPeer.js index b427e25e..e652df63 100644 --- a/packages/web2d/src/components/peer/svg/TextPeer.js +++ b/packages/web2d/src/components/peer/svg/TextPeer.js @@ -18,14 +18,14 @@ import { $defined } from '@wisemapping/core-js'; import ElementPeer from './ElementPeer'; import { getPosition } from '../utils/DomUtils'; -import Toolkit from '../../Toolkit'; class TextPeer extends ElementPeer { - constructor(fontPeer) { + constructor(Font) { const svgElement = window.document.createElementNS(ElementPeer.svgNamespace, 'text'); super(svgElement); + this.Font = Font; this._position = { x: 0, y: 0 }; - this._font = fontPeer; + this._font = new Font('Arial', this); } append(element) { @@ -84,11 +84,10 @@ class TextPeer extends ElementPeer { return getPosition(this._native); } - setFont(fontName, size, style, weight) { - if ($defined(fontName)) { - this._font = Toolkit.createFontByName(fontName); + setFont(font, size, style, weight) { + if ($defined(font)) { + this._font = new this.Font(font, this); } - if ($defined(style)) { this._font.setStyle(style); } @@ -102,7 +101,7 @@ class TextPeer extends ElementPeer { } _updateFontStyle() { - this._native.setAttribute('font-family', this._font.getFontName()); + this._native.setAttribute('font-family', this._font.getFontFamily()); this._native.setAttribute('font-size', this._font.getGraphSize()); this._native.setAttribute('font-style', this._font.getStyle()); this._native.setAttribute('font-weight', this._font.getWeight()); @@ -135,9 +134,9 @@ class TextPeer extends ElementPeer { this._updateFontStyle(); } - setFontName(fontName) { + setFontFamily(family) { const oldFont = this._font; - this._font = Toolkit.createFontByName(fontName); + this._font = new this.Font(family, this); this._font.setSize(oldFont.getSize()); this._font.setStyle(oldFont.getStyle()); this._font.setWeight(oldFont.getWeight()); @@ -146,7 +145,7 @@ class TextPeer extends ElementPeer { getFont() { return { - font: this._font.getFontName(), + font: this._font.getFont(), size: parseInt(this._font.getSize(), 10), style: this._font.getStyle(), weight: this._font.getWeight(), @@ -159,10 +158,21 @@ class TextPeer extends ElementPeer { } getWidth() { - let computedWidth = this._native.getBBox().width; - if (computedWidth === 0) { - const bbox = this._native.getBBox(); - computedWidth = bbox.width; + let computedWidth; + // Firefox hack for this issue:http://stackoverflow.com/questions/6390065/doing-ajax-updates-in-svg-breaks-getbbox-is-there-a-workaround + try { + computedWidth = this._native.getBBox().width; + // Chrome bug is producing this error, oly during page loading. + // Remove the hack if it works. The issue seems to be + // caused when the element is hidden. I don't know why, but it works ... + if (computedWidth === 0) { + const bbox = this._native.getBBox(); + computedWidth = bbox.width; + } + } catch (e) { + // eslint-disable-next-line no-console + console.error(e); + computedWidth = 10; } let width = parseInt(computedWidth, 10); @@ -171,12 +181,19 @@ class TextPeer extends ElementPeer { } getHeight() { - const computedHeight = this._native.getBBox().height; + // Firefox hack for this + // issue:http://stackoverflow.com/questions/6390065/doing-ajax-updates-in-svg-breaks-getbbox-is-there-a-workaround + let computedHeight; + try { + computedHeight = this._native.getBBox().height; + } catch (e) { + computedHeight = 10; + } return parseInt(computedHeight, 10); } - getHtmlFontSize(scale) { - return this._font.getHtmlSize(scale); + getHtmlFontSize() { + return this._font.getHtmlSize(); } } diff --git a/packages/web2d/src/components/peer/svg/TimesFont.js b/packages/web2d/src/components/peer/svg/TimesFont.js index 583b5c00..6c6b43d4 100644 --- a/packages/web2d/src/components/peer/svg/TimesFont.js +++ b/packages/web2d/src/components/peer/svg/TimesFont.js @@ -15,11 +15,21 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import FontPeer from './FontPeer'; +import Font from './Font'; -class TimesFont extends FontPeer { +class TimesFont extends Font { constructor() { - super('Times'); + super(); + this._fontFamily = 'Times'; + } + + getFontFamily() { + return this._fontFamily; + } + + // eslint-disable-next-line class-methods-use-this + getFont() { + return Font.TIMES; } } diff --git a/packages/web2d/src/components/peer/svg/VerdanaFont.js b/packages/web2d/src/components/peer/svg/VerdanaFont.js index e527baeb..dd5b1c4e 100644 --- a/packages/web2d/src/components/peer/svg/VerdanaFont.js +++ b/packages/web2d/src/components/peer/svg/VerdanaFont.js @@ -15,11 +15,21 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import FontPeer from './FontPeer'; +import Font from './Font'; -class VerdanaFont extends FontPeer { +class VerdanaFont extends Font { constructor() { - super('Verdana'); + super(); + this._fontFamily = 'Verdana'; + } + + getFontFamily() { + return this._fontFamily; + } + + // eslint-disable-next-line class-methods-use-this + getFont() { + return Font.VERDANA; } } diff --git a/packages/web2d/test/playground/font.html b/packages/web2d/test/playground/font.html index b3bee85f..754086c2 100644 --- a/packages/web2d/test/playground/font.html +++ b/packages/web2d/test/playground/font.html @@ -13,7 +13,6 @@ Tahoma Verdana Times - Brush Script MT @@ -33,9 +32,6 @@
- -
- @@ -53,9 +49,6 @@
- -
- diff --git a/packages/web2d/test/playground/font.js b/packages/web2d/test/playground/font.js index 16ac656a..442acb00 100644 --- a/packages/web2d/test/playground/font.js +++ b/packages/web2d/test/playground/font.js @@ -1,11 +1,11 @@ import $ from 'jquery'; import { - Workspace, Text, + Toolkit, Workspace, Text, } from '../../src'; global.$ = $; -function multiline(text, fontName, elemId) { +function multiline(text, family, elemId) { const workspace = new Workspace(); workspace.setSize('200px', '240px'); workspace.setCoordSize('200', '240'); @@ -16,7 +16,7 @@ function multiline(text, fontName, elemId) { workspace.append(wText); wText.setText(text); - wText.setFont(fontName, size, 'bold'); + wText.setFont(family, size, 'bold'); wText.setPosition(30, 50 * i); wText.setColor('blue'); }); @@ -45,11 +45,11 @@ function alignments(text, family, elemId) { } // Multine tests ... -['Arial', 'Tahoma', 'Verdana', 'Times', 'Brush Script MT'].forEach((fontName, i) => { - multiline('This multine text.\nLine 1 :)\nLine2', fontName, `multi${i}`); +['Arial', 'Tahoma', 'Verdana', 'Times'].forEach((family, i) => { + multiline('This multine text.\nLine 1 :)\nLine2', family, `multi${i}`); }); // Multine tests and alingments .. ... -['Arial', 'Tahoma', 'Verdana', 'Times', 'Brush Script MT'].forEach((fontName, i) => { - alignments('This multine text.\nThis is the long line just because :)\nShort line', fontName, `amulti${i}`); +['Arial', 'Tahoma', 'Verdana', 'Times'].forEach((family, i) => { + alignments('This multine text.\nThis is the long line just because :)\nShort line', family, `amulti${i}`); }); diff --git a/packages/web2d/test/playground/text.js b/packages/web2d/test/playground/text.js index 1283b59f..4f249b2f 100644 --- a/packages/web2d/test/playground/text.js +++ b/packages/web2d/test/playground/text.js @@ -18,7 +18,7 @@ const textTestHelper = function textTestHelper(coordSize, textval, font, fontSiz const workspace = new Workspace(); workspace.setSize('300px', '100px'); - workspace.setCoordSize(coordSize, coordSize); + workspace.setCoordSize('coordSize', coordSize); workspace.setCoordOrigin(0, 0); workspace.addItAsChildTo($(`#${htmlElemId}`)); @@ -36,7 +36,7 @@ const textTestHelper = function textTestHelper(coordSize, textval, font, fontSiz span.setAttribute('id', `textoHTML${iesimo}`); const textsize = `${textval} - Scale: ${scale.height}`; const textHtml = document.createTextNode(textsize); - const fontSize = text.getHtmlFontSize(textsize); + const fontSize = text.getHtmlFontSize(); span.append(textHtml); span.setAttribute('style', `font-weight:${modifier};font-style: ${style}; font-size:${fontSize}pt; font-family: ${font};width:30;height:30;`);