use the parsed appearance for text style

mozilla · Jan 21, 2021 · ee49880 · ee49880
1 parent 1039698
commit ee49880
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 18 deletions.
diff --git a/src/core/annotation.js b/src/core/annotation.js
@@ -1000,6 +1000,7 @@ class WidgetAnnotation extends Annotation {
     this._defaultAppearanceData = parseDefaultAppearance(
       data.defaultAppearance
     );
+    this.data.defaultAppearanceData = this._defaultAppearanceData;
 
     const fieldType = getInheritableProperty({ dict, key: "FT" });
     data.fieldType = isName(fieldType) ? fieldType.name : null;

diff --git a/src/display/annotation_layer.js b/src/display/annotation_layer.js
@@ -595,7 +595,6 @@ class TextWidgetAnnotationElement extends WidgetAnnotationElement {
   }
 
   render() {
-    const TEXT_ALIGNMENT = ["left", "center", "right"];
     const storage = this.annotationStorage;
     const id = this.data.id;
 
@@ -834,20 +833,9 @@ class TextWidgetAnnotationElement extends WidgetAnnotationElement {
       element.textContent = this.data.fieldValue;
       element.style.verticalAlign = "middle";
       element.style.display = "table-cell";
-
-      let font = null;
-      if (
-        this.data.fontRefName &&
-        this.page.commonObjs.has(this.data.fontRefName)
-      ) {
-        font = this.page.commonObjs.get(this.data.fontRefName);
-      }
-      this._setTextStyle(element, font);
     }
 
-    if (this.data.textAlignment !== null) {
-      element.style.textAlign = TEXT_ALIGNMENT[this.data.textAlignment];
-    }
+    this._setTextStyle(element);
 
     this.container.appendChild(element);
     return this.container;
@@ -858,14 +846,37 @@ class TextWidgetAnnotationElement extends WidgetAnnotationElement {
    *
    * @private
    * @param {HTMLDivElement} element
-   * @param {Object} font
    * @memberof TextWidgetAnnotationElement
    */
-  _setTextStyle(element, font) {
-    // TODO: This duplicates some of the logic in CanvasGraphics.setFont().
+  _setTextStyle(element) {
+    const TEXT_ALIGNMENT = ["left", "center", "right"];
+    const { fontName, fontSize, fontColor } = this.data.defaultAppearanceData;
     const style = element.style;
-    style.fontSize = `${this.data.fontSize}px`;
-    style.direction = this.data.fontDirection < 0 ? "rtl" : "ltr";
+
+    /**
+     *  TODO: If font size is 0, calculate the font-size based on the height and
+     *          width of the element
+     *  For now, just use the default font size
+     */
+    if (fontSize) {
+      style.fontSize = `${fontSize}px`;
+    }
+
+    style.color = `rgb(${fontColor[0]}, ${fontColor[1]}, ${fontColor[2]})`;
+
+    if (this.data.textAlignment !== null) {
+      element.style.textAlign = TEXT_ALIGNMENT[this.data.textAlignment];
+    }
+
+    let font = null;
+    if (
+      fontName &&
+      fontName.name &&
+      this.data.fontRefName &&
+      this.page.commonObjs.has(fontName.name)
+    ) {
+      font = this.page.commonObjs.get(fontName.name);
+    }
 
     if (!font) {
       return;