UNPKG

pdfjs-dist/lib/display/annotation_layer.js

Version:
64 kBJavaScriptView Raw
1/**
* @licstart The following is the entire license notice for the
* Javascript code in this page
*
* Copyright 2021 Mozilla Foundation
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
*     http://www.apache.org/licenses/LICENSE-2.0
*
* 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.
*
* @licend The above is the entire license notice for the
* Javascript code in this page
*/
22"use strict";
23
24Object.defineProperty(exports, "__esModule", {
value: true
26});
27exports.AnnotationLayer = void 0;
28
29var _util = require("../shared/util.js");
30
31var _display_utils = require("./display_utils.js");
32
33var _annotation_storage = require("./annotation_storage.js");
34
35var _scripting_utils = require("../shared/scripting_utils.js");
36
37var _xfa_layer = require("./xfa_layer.js");
38
39const DEFAULT_TAB_INDEX = 1000;
40const GetElementsByNameSet = new WeakSet();
41
42class AnnotationElementFactory {
static create(parameters) {
  const subtype = parameters.data.annotationType;
45
  switch (subtype) {
    case _util.AnnotationType.LINK:
      return new LinkAnnotationElement(parameters);
49
    case _util.AnnotationType.TEXT:
      return new TextAnnotationElement(parameters);
52
    case _util.AnnotationType.WIDGET:
      const fieldType = parameters.data.fieldType;
55
      switch (fieldType) {
        case "Tx":
          return new TextWidgetAnnotationElement(parameters);
59
        case "Btn":
          if (parameters.data.radioButton) {
            return new RadioButtonWidgetAnnotationElement(parameters);
          } else if (parameters.data.checkBox) {
            return new CheckboxWidgetAnnotationElement(parameters);
          }
66
          return new PushButtonWidgetAnnotationElement(parameters);
68
        case "Ch":
          return new ChoiceWidgetAnnotationElement(parameters);
      }
72
      return new WidgetAnnotationElement(parameters);
74
    case _util.AnnotationType.POPUP:
      return new PopupAnnotationElement(parameters);
77
    case _util.AnnotationType.FREETEXT:
      return new FreeTextAnnotationElement(parameters);
80
    case _util.AnnotationType.LINE:
      return new LineAnnotationElement(parameters);
83
    case _util.AnnotationType.SQUARE:
      return new SquareAnnotationElement(parameters);
86
    case _util.AnnotationType.CIRCLE:
      return new CircleAnnotationElement(parameters);
89
    case _util.AnnotationType.POLYLINE:
      return new PolylineAnnotationElement(parameters);
92
    case _util.AnnotationType.CARET:
      return new CaretAnnotationElement(parameters);
95
    case _util.AnnotationType.INK:
      return new InkAnnotationElement(parameters);
98
    case _util.AnnotationType.POLYGON:
      return new PolygonAnnotationElement(parameters);
101
    case _util.AnnotationType.HIGHLIGHT:
      return new HighlightAnnotationElement(parameters);
104
    case _util.AnnotationType.UNDERLINE:
      return new UnderlineAnnotationElement(parameters);
107
    case _util.AnnotationType.SQUIGGLY:
      return new SquigglyAnnotationElement(parameters);
110
    case _util.AnnotationType.STRIKEOUT:
      return new StrikeOutAnnotationElement(parameters);
113
    case _util.AnnotationType.STAMP:
      return new StampAnnotationElement(parameters);
116
    case _util.AnnotationType.FILEATTACHMENT:
      return new FileAttachmentAnnotationElement(parameters);
119
    default:
      return new AnnotationElement(parameters);
  }
}
124
125}
126
127class AnnotationElement {
constructor(parameters, {
  isRenderable = false,
  ignoreBorder = false,
  createQuadrilaterals = false
} = {}) {
  this.isRenderable = isRenderable;
  this.data = parameters.data;
  this.layer = parameters.layer;
  this.page = parameters.page;
  this.viewport = parameters.viewport;
  this.linkService = parameters.linkService;
  this.downloadManager = parameters.downloadManager;
  this.imageResourcesPath = parameters.imageResourcesPath;
  this.renderForms = parameters.renderForms;
  this.svgFactory = parameters.svgFactory;
  this.annotationStorage = parameters.annotationStorage;
  this.enableScripting = parameters.enableScripting;
  this.hasJSActions = parameters.hasJSActions;
  this._fieldObjects = parameters.fieldObjects;
  this._mouseState = parameters.mouseState;
148
  if (isRenderable) {
    this.container = this._createContainer(ignoreBorder);
  }
152
  if (createQuadrilaterals) {
    this.quadrilaterals = this._createQuadrilaterals(ignoreBorder);
  }
}
157
_createContainer(ignoreBorder = false) {
  const data = this.data,
        page = this.page,
        viewport = this.viewport;
  const container = document.createElement("section");
  let width = data.rect[2] - data.rect[0];
  let height = data.rect[3] - data.rect[1];
  container.setAttribute("data-annotation-id", data.id);
166
  const rect = _util.Util.normalizeRect([data.rect[0], page.view[3] - data.rect[1] + page.view[1], data.rect[2], page.view[3] - data.rect[3] + page.view[1]]);
168
  if (data.hasOwnCanvas) {
    const transform = viewport.transform.slice();
171
    const [scaleX, scaleY] = _util.Util.singularValueDecompose2dScale(transform);
173
    width = Math.ceil(width * scaleX);
    height = Math.ceil(height * scaleY);
    rect[0] *= scaleX;
    rect[1] *= scaleY;
178
    for (let i = 0; i < 4; i++) {
      transform[i] = Math.sign(transform[i]);
    }
182
    container.style.transform = `matrix(${transform.join(",")})`;
  } else {
    container.style.transform = `matrix(${viewport.transform.join(",")})`;
  }
187
  container.style.transformOrigin = `${-rect[0]}px ${-rect[1]}px`;
189
  if (!ignoreBorder && data.borderStyle.width > 0) {
    container.style.borderWidth = `${data.borderStyle.width}px`;
192
    if (data.borderStyle.style !== _util.AnnotationBorderStyleType.UNDERLINE) {
      width -= 2 * data.borderStyle.width;
      height -= 2 * data.borderStyle.width;
    }
197
    const horizontalRadius = data.borderStyle.horizontalCornerRadius;
    const verticalRadius = data.borderStyle.verticalCornerRadius;
200
    if (horizontalRadius > 0 || verticalRadius > 0) {
      const radius = `${horizontalRadius}px / ${verticalRadius}px`;
      container.style.borderRadius = radius;
    }
205
    switch (data.borderStyle.style) {
      case _util.AnnotationBorderStyleType.SOLID:
        container.style.borderStyle = "solid";
        break;
210
      case _util.AnnotationBorderStyleType.DASHED:
        container.style.borderStyle = "dashed";
        break;
214
      case _util.AnnotationBorderStyleType.BEVELED:
        (0, _util.warn)("Unimplemented border style: beveled");
        break;
218
      case _util.AnnotationBorderStyleType.INSET:
        (0, _util.warn)("Unimplemented border style: inset");
        break;
222
      case _util.AnnotationBorderStyleType.UNDERLINE:
        container.style.borderBottomStyle = "solid";
        break;
226
      default:
        break;
    }
230
    const borderColor = data.borderColor || data.color || null;
232
    if (borderColor) {
      container.style.borderColor = _util.Util.makeHexColor(data.color[0] | 0, data.color[1] | 0, data.color[2] | 0);
    } else {
      container.style.borderWidth = 0;
    }
  }
239
  container.style.left = `${rect[0]}px`;
  container.style.top = `${rect[1]}px`;
242
  if (data.hasOwnCanvas) {
    container.style.width = container.style.height = "auto";
  } else {
    container.style.width = `${width}px`;
    container.style.height = `${height}px`;
  }
249
  return container;
}
252
_createQuadrilaterals(ignoreBorder = false) {
  if (!this.data.quadPoints) {
    return null;
  }
257
  const quadrilaterals = [];
  const savedRect = this.data.rect;
260
  for (const quadPoint of this.data.quadPoints) {
    this.data.rect = [quadPoint[2].x, quadPoint[2].y, quadPoint[1].x, quadPoint[1].y];
    quadrilaterals.push(this._createContainer(ignoreBorder));
  }
265
  this.data.rect = savedRect;
  return quadrilaterals;
}
269
_createPopup(trigger, data) {
  let container = this.container;
272
  if (this.quadrilaterals) {
    trigger = trigger || this.quadrilaterals;
    container = this.quadrilaterals[0];
  }
277
  if (!trigger) {
    trigger = document.createElement("div");
    trigger.style.height = container.style.height;
    trigger.style.width = container.style.width;
    container.appendChild(trigger);
  }
284
  const popupElement = new PopupElement({
    container,
    trigger,
    color: data.color,
    titleObj: data.titleObj,
    modificationDate: data.modificationDate,
    contentsObj: data.contentsObj,
    richText: data.richText,
    hideWrapper: true
  });
  const popup = popupElement.render();
  popup.style.left = container.style.width;
  container.appendChild(popup);
}
299
_renderQuadrilaterals(className) {
  for (const quadrilateral of this.quadrilaterals) {
    quadrilateral.className = className;
  }
304
  return this.quadrilaterals;
}
307
render() {
  (0, _util.unreachable)("Abstract method `AnnotationElement.render` called");
}
311
_getElementsByName(name, skipId = null) {
  const fields = [];
314
  if (this._fieldObjects) {
    const fieldObj = this._fieldObjects[name];
317
    if (fieldObj) {
      for (const {
        page,
        id,
        exportValues
      } of fieldObj) {
        if (page === -1) {
          continue;
        }
327
        if (id === skipId) {
          continue;
        }
331
        const exportValue = typeof exportValues === "string" ? exportValues : null;
        const domElement = document.getElementById(id);
334
        if (domElement && !GetElementsByNameSet.has(domElement)) {
          (0, _util.warn)(`_getElementsByName - element not allowed: ${id}`);
          continue;
        }
339
        fields.push({
          id,
          exportValue,
          domElement
        });
      }
    }
347
    return fields;
  }
350
  for (const domElement of document.getElementsByName(name)) {
    const {
      id,
      exportValue
    } = domElement;
356
    if (id === skipId) {
      continue;
    }
360
    if (!GetElementsByNameSet.has(domElement)) {
      continue;
    }
364
    fields.push({
      id,
      exportValue,
      domElement
    });
  }
371
  return fields;
}
374
static get platform() {
  const platform = typeof navigator !== "undefined" ? navigator.platform : "";
  return (0, _util.shadow)(this, "platform", {
    isWin: platform.includes("Win"),
    isMac: platform.includes("Mac")
  });
}
382
383}
384
385class LinkAnnotationElement extends AnnotationElement {
constructor(parameters, options = null) {
  const isRenderable = !!(parameters.data.url || parameters.data.dest || parameters.data.action || parameters.data.isTooltipOnly || parameters.data.resetForm || parameters.data.actions && (parameters.data.actions.Action || parameters.data.actions["Mouse Up"] || parameters.data.actions["Mouse Down"]));
  super(parameters, {
    isRenderable,
    ignoreBorder: !!options?.ignoreBorder,
    createQuadrilaterals: true
  });
}
394
render() {
  const {
    data,
    linkService
  } = this;
  const link = document.createElement("a");
401
  if (data.url) {
    if (!linkService.addLinkAttributes) {
      (0, _util.warn)("LinkAnnotationElement.render - missing `addLinkAttributes`-method on the `linkService`-instance.");
    }
406
    linkService.addLinkAttributes?.(link, data.url, data.newWindow);
  } else if (data.action) {
    this._bindNamedAction(link, data.action);
  } else if (data.dest) {
    this._bindLink(link, data.dest);
  } else {
    let hasClickAction = false;
414
    if (data.actions && (data.actions.Action || data.actions["Mouse Up"] || data.actions["Mouse Down"]) && this.enableScripting && this.hasJSActions) {
      hasClickAction = true;
417
      this._bindJSAction(link, data);
    }
420
    if (data.resetForm) {
      this._bindResetFormAction(link, data.resetForm);
    } else if (!hasClickAction) {
      this._bindLink(link, "");
    }
  }
427
  if (this.quadrilaterals) {
    return this._renderQuadrilaterals("linkAnnotation").map((quadrilateral, index) => {
      const linkElement = index === 0 ? link : link.cloneNode();
      quadrilateral.appendChild(linkElement);
      return quadrilateral;
    });
  }
435
  this.container.className = "linkAnnotation";
  this.container.appendChild(link);
  return this.container;
}
440
_bindLink(link, destination) {
  link.href = this.linkService.getDestinationHash(destination);
443
  link.onclick = () => {
    if (destination) {
      this.linkService.goToDestination(destination);
    }
448
    return false;
  };
451
  if (destination || destination === "") {
    link.className = "internalLink";
  }
}
456
_bindNamedAction(link, action) {
  link.href = this.linkService.getAnchorUrl("");
459
  link.onclick = () => {
    this.linkService.executeNamedAction(action);
    return false;
  };
464
  link.className = "internalLink";
}
467
_bindJSAction(link, data) {
  link.href = this.linkService.getAnchorUrl("");
  const map = new Map([["Action", "onclick"], ["Mouse Up", "onmouseup"], ["Mouse Down", "onmousedown"]]);
471
  for (const name of Object.keys(data.actions)) {
    const jsName = map.get(name);
474
    if (!jsName) {
      continue;
    }
478
    link[jsName] = () => {
      this.linkService.eventBus?.dispatch("dispatcheventinsandbox", {
        source: this,
        detail: {
          id: data.id,
          name
        }
      });
      return false;
    };
  }
490
  if (!link.onclick) {
    link.onclick = () => false;
  }
494
  link.className = "internalLink";
}
497
_bindResetFormAction(link, resetForm) {
  const otherClickAction = link.onclick;
500
  if (!otherClickAction) {
    link.href = this.linkService.getAnchorUrl("");
  }
504
  link.className = "internalLink";
506
  if (!this._fieldObjects) {
    (0, _util.warn)(`_bindResetFormAction - "resetForm" action not supported, ` + "ensure that the `fieldObjects` parameter is provided.");
509
    if (!otherClickAction) {
      link.onclick = () => false;
    }
513
    return;
  }
516
  link.onclick = () => {
    if (otherClickAction) {
      otherClickAction();
    }
521
    const {
      fields: resetFormFields,
      refs: resetFormRefs,
      include
    } = resetForm;
    const allFields = [];
528
    if (resetFormFields.length !== 0 || resetFormRefs.length !== 0) {
      const fieldIds = new Set(resetFormRefs);
531
      for (const fieldName of resetFormFields) {
        const fields = this._fieldObjects[fieldName] || [];
534
        for (const {
          id
        } of fields) {
          fieldIds.add(id);
        }
      }
541
      for (const fields of Object.values(this._fieldObjects)) {
        for (const field of fields) {
          if (fieldIds.has(field.id) === include) {
            allFields.push(field);
          }
        }
      }
    } else {
      for (const fields of Object.values(this._fieldObjects)) {
        allFields.push(...fields);
      }
    }
554
    const storage = this.annotationStorage;
    const allIds = [];
557
    for (const field of allFields) {
      const {
        id
      } = field;
      allIds.push(id);
563
      switch (field.type) {
        case "text":
          {
            const value = field.defaultValue || "";
            storage.setValue(id, {
              value,
              valueAsString: value
            });
            break;
          }
574
        case "checkbox":
        case "radiobutton":
          {
            const value = field.defaultValue === field.exportValues;
            storage.setValue(id, {
              value
            });
            break;
          }
584
        case "combobox":
        case "listbox":
          {
            const value = field.defaultValue || "";
            storage.setValue(id, {
              value
            });
            break;
          }
594
        default:
          continue;
      }
598
      const domElement = document.getElementById(id);
600
      if (!domElement || !GetElementsByNameSet.has(domElement)) {
        continue;
      }
604
      domElement.dispatchEvent(new Event("resetform"));
    }
607
    if (this.enableScripting) {
      this.linkService.eventBus?.dispatch("dispatcheventinsandbox", {
        source: this,
        detail: {
          id: "app",
          ids: allIds,
          name: "ResetForm"
        }
      });
    }
618
    return false;
  };
}
622
623}
624
625class TextAnnotationElement extends AnnotationElement {
constructor(parameters) {
  const isRenderable = !!(parameters.data.hasPopup || parameters.data.titleObj?.str || parameters.data.contentsObj?.str || parameters.data.richText?.str);
  super(parameters, {
    isRenderable
  });
}
632
render() {
  this.container.className = "textAnnotation";
  const image = document.createElement("img");
  image.style.height = this.container.style.height;
  image.style.width = this.container.style.width;
  image.src = this.imageResourcesPath + "annotation-" + this.data.name.toLowerCase() + ".svg";
  image.alt = "[{{type}} Annotation]";
  image.dataset.l10nId = "text_annotation_type";
  image.dataset.l10nArgs = JSON.stringify({
    type: this.data.name
  });
644
  if (!this.data.hasPopup) {
    this._createPopup(image, this.data);
  }
648
  this.container.appendChild(image);
  return this.container;
}
652
653}
654
655class WidgetAnnotationElement extends AnnotationElement {
render() {
  if (this.data.alternativeText) {
    this.container.title = this.data.alternativeText;
  }
660
  return this.container;
}
663
_getKeyModifier(event) {
  const {
    isWin,
    isMac
  } = AnnotationElement.platform;
  return isWin && event.ctrlKey || isMac && event.metaKey;
}
671
_setEventListener(element, baseName, eventName, valueGetter) {
  if (baseName.includes("mouse")) {
    element.addEventListener(baseName, event => {
      this.linkService.eventBus?.dispatch("dispatcheventinsandbox", {
        source: this,
        detail: {
          id: this.data.id,
          name: eventName,
          value: valueGetter(event),
          shift: event.shiftKey,
          modifier: this._getKeyModifier(event)
        }
      });
    });
  } else {
    element.addEventListener(baseName, event => {
      this.linkService.eventBus?.dispatch("dispatcheventinsandbox", {
        source: this,
        detail: {
          id: this.data.id,
          name: eventName,
          value: event.target.checked
        }
      });
    });
  }
}
699
_setEventListeners(element, names, getter) {
  for (const [baseName, eventName] of names) {
    if (eventName === "Action" || this.data.actions?.[eventName]) {
      this._setEventListener(element, baseName, eventName, getter);
    }
  }
}
707
_setBackgroundColor(element) {
  const color = this.data.backgroundColor || null;
  element.style.backgroundColor = color === null ? "transparent" : _util.Util.makeHexColor(color[0], color[1], color[2]);
}
712
_dispatchEventFromSandbox(actions, jsEvent) {
  const setColor = (jsName, styleName, event) => {
    const color = event.detail[jsName];
    event.target.style[styleName] = _scripting_utils.ColorConverters[`${color[0]}_HTML`](color.slice(1));
  };
718
  const commonActions = {
    display: event => {
      const hidden = event.detail.display % 2 === 1;
      event.target.style.visibility = hidden ? "hidden" : "visible";
      this.annotationStorage.setValue(this.data.id, {
        hidden,
        print: event.detail.display === 0 || event.detail.display === 3
      });
    },
    print: event => {
      this.annotationStorage.setValue(this.data.id, {
        print: event.detail.print
      });
    },
    hidden: event => {
      event.target.style.visibility = event.detail.hidden ? "hidden" : "visible";
      this.annotationStorage.setValue(this.data.id, {
        hidden: event.detail.hidden
      });
    },
    focus: event => {
      setTimeout(() => event.target.focus({
        preventScroll: false
      }), 0);
    },
    userName: event => {
      event.target.title = event.detail.userName;
    },
    readonly: event => {
      if (event.detail.readonly) {
        event.target.setAttribute("readonly", "");
      } else {
        event.target.removeAttribute("readonly");
      }
    },
    required: event => {
      if (event.detail.required) {
        event.target.setAttribute("required", "");
      } else {
        event.target.removeAttribute("required");
      }
    },
    bgColor: event => {
      setColor("bgColor", "backgroundColor", event);
    },
    fillColor: event => {
      setColor("fillColor", "backgroundColor", event);
    },
    fgColor: event => {
      setColor("fgColor", "color", event);
    },
    textColor: event => {
      setColor("textColor", "color", event);
    },
    borderColor: event => {
      setColor("borderColor", "borderColor", event);
    },
    strokeColor: event => {
      setColor("strokeColor", "borderColor", event);
    }
  };
780
  for (const name of Object.keys(jsEvent.detail)) {
    const action = actions[name] || commonActions[name];
783
    if (action) {
      action(jsEvent);
    }
  }
}
789
790}
791
792class TextWidgetAnnotationElement extends WidgetAnnotationElement {
constructor(parameters) {
  const isRenderable = parameters.renderForms || !parameters.data.hasAppearance && !!parameters.data.fieldValue;
  super(parameters, {
    isRenderable
  });
}
799
setPropertyOnSiblings(base, key, value, keyInStorage) {
  const storage = this.annotationStorage;
802
  for (const element of this._getElementsByName(base.name, base.id)) {
    if (element.domElement) {
      element.domElement[key] = value;
    }
807
    storage.setValue(element.id, {
      [keyInStorage]: value
    });
  }
}
813
render() {
  const storage = this.annotationStorage;
  const id = this.data.id;
  this.container.className = "textWidgetAnnotation";
  let element = null;
819
  if (this.renderForms) {
    const storedData = storage.getValue(id, {
      value: this.data.fieldValue,
      valueAsString: this.data.fieldValue
    });
    const textContent = storedData.valueAsString || storedData.value || "";
    const elementData = {
      userValue: null,
      formattedValue: null,
      beforeInputSelectionRange: null,
      beforeInputValue: null
    };
832
    if (this.data.multiLine) {
      element = document.createElement("textarea");
      element.textContent = textContent;
    } else {
      element = document.createElement("input");
      element.type = "text";
      element.setAttribute("value", textContent);
    }
841
    GetElementsByNameSet.add(element);
    element.disabled = this.data.readOnly;
    element.name = this.data.fieldName;
    element.tabIndex = DEFAULT_TAB_INDEX;
    elementData.userValue = textContent;
    element.setAttribute("id", id);
    element.addEventListener("input", event => {
      storage.setValue(id, {
        value: event.target.value
      });
      this.setPropertyOnSiblings(element, "value", event.target.value, "value");
    });
    element.addEventListener("resetform", event => {
      const defaultValue = this.data.defaultFieldValue || "";
      element.value = elementData.userValue = defaultValue;
      delete elementData.formattedValue;
    });
859
    let blurListener = event => {
      if (elementData.formattedValue) {
        event.target.value = elementData.formattedValue;
      }
864
      event.target.scrollLeft = 0;
      elementData.beforeInputSelectionRange = null;
    };
868
    if (this.enableScripting && this.hasJSActions) {
      element.addEventListener("focus", event => {
        if (elementData.userValue) {
          event.target.value = elementData.userValue;
        }
      });
      element.addEventListener("updatefromsandbox", jsEvent => {
        const actions = {
          value(event) {
            elementData.userValue = event.detail.value || "";
            storage.setValue(id, {
              value: elementData.userValue.toString()
            });
882
            if (!elementData.formattedValue) {
              event.target.value = elementData.userValue;
            }
          },
887
          valueAsString(event) {
            elementData.formattedValue = event.detail.valueAsString || "";
890
            if (event.target !== document.activeElement) {
              event.target.value = elementData.formattedValue;
            }
894
            storage.setValue(id, {
              formattedValue: elementData.formattedValue
            });
          },
899
          selRange(event) {
            const [selStart, selEnd] = event.detail.selRange;
902
            if (selStart >= 0 && selEnd < event.target.value.length) {
              event.target.setSelectionRange(selStart, selEnd);
            }
          }
907
        };
909
        this._dispatchEventFromSandbox(actions, jsEvent);
      });
      element.addEventListener("keydown", event => {
        elementData.beforeInputValue = event.target.value;
        let commitKey = -1;
915
        if (event.key === "Escape") {
          commitKey = 0;
        } else if (event.key === "Enter") {
          commitKey = 2;
        } else if (event.key === "Tab") {
          commitKey = 3;
        }
923
        if (commitKey === -1) {
          return;
        }
927
        elementData.userValue = event.target.value;
        this.linkService.eventBus?.dispatch("dispatcheventinsandbox", {
          source: this,
          detail: {
            id,
            name: "Keystroke",
            value: event.target.value,
            willCommit: true,
            commitKey,
            selStart: event.target.selectionStart,
            selEnd: event.target.selectionEnd
          }
        });
      });
      const _blurListener = blurListener;
      blurListener = null;
      element.addEventListener("blur", event => {
        if (this._mouseState.isDown) {
          elementData.userValue = event.target.value;
          this.linkService.eventBus?.dispatch("dispatcheventinsandbox", {
            source: this,
            detail: {
              id,
              name: "Keystroke",
              value: event.target.value,
              willCommit: true,
              commitKey: 1,
              selStart: event.target.selectionStart,
              selEnd: event.target.selectionEnd
            }
          });
        }
960
        _blurListener(event);
      });
      element.addEventListener("mousedown", event => {
        elementData.beforeInputValue = event.target.value;
        elementData.beforeInputSelectionRange = null;
      });
      element.addEventListener("keyup", event => {
        if (event.target.selectionStart === event.target.selectionEnd) {
          elementData.beforeInputSelectionRange = null;
        }
      });
      element.addEventListener("select", event => {
        elementData.beforeInputSelectionRange = [event.target.selectionStart, event.target.selectionEnd];
      });
975
      if (this.data.actions?.Keystroke) {
        element.addEventListener("input", event => {
          let selStart = -1;
          let selEnd = -1;
980
          if (elementData.beforeInputSelectionRange) {
            [selStart, selEnd] = elementData.beforeInputSelectionRange;
          }
984
          this.linkService.eventBus?.dispatch("dispatcheventinsandbox", {
            source: this,
            detail: {
              id,
              name: "Keystroke",
              value: elementData.beforeInputValue,
              change: event.data,
              willCommit: false,
              selStart,
              selEnd
            }
          });
        });
      }
999
      this._setEventListeners(element, [["focus", "Focus"], ["blur", "Blur"], ["mousedown", "Mouse Down"], ["mouseenter", "Mouse Enter"], ["mouseleave", "Mouse Exit"], ["mouseup", "Mouse Up"]], event => event.target.value);
    }
1002
    if (blurListener) {
      element.addEventListener("blur", blurListener);
    }
1006
    if (this.data.maxLen !== null) {
      element.maxLength = this.data.maxLen;
    }
1010
    if (this.data.comb) {
      const fieldWidth = this.data.rect[2] - this.data.rect[0];
      const combWidth = fieldWidth / this.data.maxLen;
      element.classList.add("comb");
      element.style.letterSpacing = `calc(${combWidth}px - 1ch)`;
    }
  } else {
    element = document.createElement("div");
    element.textContent = this.data.fieldValue;
    element.style.verticalAlign = "middle";
    element.style.display = "table-cell";
  }
1023
  this._setTextStyle(element);
1025
  this._setBackgroundColor(element);
1027
  this.container.appendChild(element);
  return this.container;
}
1031
_setTextStyle(element) {
  const TEXT_ALIGNMENT = ["left", "center", "right"];
  const {
    fontSize,
    fontColor
  } = this.data.defaultAppearanceData;
  const style = element.style;
1039
  if (fontSize) {
    style.fontSize = `${fontSize}px`;
  }
1043
  style.color = _util.Util.makeHexColor(fontColor[0], fontColor[1], fontColor[2]);
1045
  if (this.data.textAlignment !== null) {
    style.textAlign = TEXT_ALIGNMENT[this.data.textAlignment];
  }
}
1050
1051}
1052
1053class CheckboxWidgetAnnotationElement extends WidgetAnnotationElement {
constructor(parameters) {
  super(parameters, {
    isRenderable: parameters.renderForms
  });
}
1059
render() {
  const storage = this.annotationStorage;
  const data = this.data;
  const id = data.id;
  let value = storage.getValue(id, {
    value: data.exportValue === data.fieldValue
  }).value;
1067
  if (typeof value === "string") {
    value = value !== "Off";
    storage.setValue(id, {
      value
    });
  }
1074
  this.container.className = "buttonWidgetAnnotation checkBox";
  const element = document.createElement("input");
  GetElementsByNameSet.add(element);
  element.disabled = data.readOnly;
  element.type = "checkbox";
  element.name = data.fieldName;
1081
  if (value) {
    element.setAttribute("checked", true);
  }
1085
  element.setAttribute("id", id);
  element.setAttribute("exportValue", data.exportValue);
  element.tabIndex = DEFAULT_TAB_INDEX;
  element.addEventListener("change", event => {
    const {
      name,
      checked
    } = event.target;
1094
    for (const checkbox of this._getElementsByName(name, id)) {
      const curChecked = checked && checkbox.exportValue === data.exportValue;
1097
      if (checkbox.domElement) {
        checkbox.domElement.checked = curChecked;
      }
1101
      storage.setValue(checkbox.id, {
        value: curChecked
      });
    }
1106
    storage.setValue(id, {
      value: checked
    });
  });
  element.addEventListener("resetform", event => {
    const defaultValue = data.defaultFieldValue || "Off";
    event.target.checked = defaultValue === data.exportValue;
  });
1115
  if (this.enableScripting && this.hasJSActions) {
    element.addEventListener("updatefromsandbox", jsEvent => {
      const actions = {
        value(event) {
          event.target.checked = event.detail.value !== "Off";
          storage.setValue(id, {
            value: event.target.checked
          });
        }
1125
      };
1127
      this._dispatchEventFromSandbox(actions, jsEvent);
    });
1130
    this._setEventListeners(element, [["change", "Validate"], ["change", "Action"], ["focus", "Focus"], ["blur", "Blur"], ["mousedown", "Mouse Down"], ["mouseenter", "Mouse Enter"], ["mouseleave", "Mouse Exit"], ["mouseup", "Mouse Up"]], event => event.target.checked);
  }
1133
  this._setBackgroundColor(element);
1135
  this.container.appendChild(element);
  return this.container;
}
1139
1140}
1141
1142class RadioButtonWidgetAnnotationElement extends WidgetAnnotationElement {
constructor(parameters) {
  super(parameters, {
    isRenderable: parameters.renderForms
  });
}
1148
render() {
  this.container.className = "buttonWidgetAnnotation radioButton";
  const storage = this.annotationStorage;
  const data = this.data;
  const id = data.id;
  let value = storage.getValue(id, {
    value: data.fieldValue === data.buttonValue
  }).value;
1157
  if (typeof value === "string") {
    value = value !== data.buttonValue;
    storage.setValue(id, {
      value
    });
  }
1164
  const element = document.createElement("input");
  GetElementsByNameSet.add(element);
  element.disabled = data.readOnly;
  element.type = "radio";
  element.name = data.fieldName;
1170
  if (value) {
    element.setAttribute("checked", true);
  }
1174
  element.setAttribute("id", id);
  element.tabIndex = DEFAULT_TAB_INDEX;
  element.addEventListener("change", event => {
    const {
      name,
      checked
    } = event.target;
1182
    for (const radio of this._getElementsByName(name, id)) {
      storage.setValue(radio.id, {
        value: false
      });
    }
1188
    storage.setValue(id, {
      value: checked
    });
  });
  element.addEventListener("resetform", event => {
    const defaultValue = data.defaultFieldValue;
    event.target.checked = defaultValue !== null && defaultValue !== undefined && defaultValue === data.buttonValue;
  });
1197
  if (this.enableScripting && this.hasJSActions) {
    const pdfButtonValue = data.buttonValue;
    element.addEventListener("updatefromsandbox", jsEvent => {
      const actions = {
        value: event => {
          const checked = pdfButtonValue === event.detail.value;
1204
          for (const radio of this._getElementsByName(event.target.name)) {
            const curChecked = checked && radio.id === id;
1207
            if (radio.domElement) {
              radio.domElement.checked = curChecked;
            }
1211
            storage.setValue(radio.id, {
              value: curChecked
            });
          }
        }
      };
1218
      this._dispatchEventFromSandbox(actions, jsEvent);
    });
1221
    this._setEventListeners(element, [["change", "Validate"], ["change", "Action"], ["focus", "Focus"], ["blur", "Blur"], ["mousedown", "Mouse Down"], ["mouseenter", "Mouse Enter"], ["mouseleave", "Mouse Exit"], ["mouseup", "Mouse Up"]], event => event.target.checked);
  }
1224
  this._setBackgroundColor(element);
1226
  this.container.appendChild(element);
  return this.container;
}
1230
1231}
1232
1233class PushButtonWidgetAnnotationElement extends LinkAnnotationElement {
constructor(parameters) {
  super(parameters, {
    ignoreBorder: parameters.data.hasAppearance
  });
}
1239
render() {
  const container = super.render();
  container.className = "buttonWidgetAnnotation pushButton";
1243
  if (this.data.alternativeText) {
    container.title = this.data.alternativeText;
  }
1247
  return container;
}
1250
1251}
1252
1253class ChoiceWidgetAnnotationElement extends WidgetAnnotationElement {
constructor(parameters) {
  super(parameters, {
    isRenderable: parameters.renderForms
  });
}
1259
render() {
  this.container.className = "choiceWidgetAnnotation";
  const storage = this.annotationStorage;
  const id = this.data.id;
  storage.getValue(id, {
    value: this.data.fieldValue.length > 0 ? this.data.fieldValue[0] : undefined
  });
  let {
    fontSize
  } = this.data.defaultAppearanceData;
1270
  if (!fontSize) {
    fontSize = 9;
  }
1274
  const fontSizeStyle = `calc(${fontSize}px * var(--zoom-factor))`;
  const selectElement = document.createElement("select");
  GetElementsByNameSet.add(selectElement);
  selectElement.disabled = this.data.readOnly;
  selectElement.name = this.data.fieldName;
  selectElement.setAttribute("id", id);
  selectElement.tabIndex = DEFAULT_TAB_INDEX;
  selectElement.style.fontSize = `${fontSize}px`;
1283
  if (!this.data.combo) {
    selectElement.size = this.data.options.length;
1286
    if (this.data.multiSelect) {
      selectElement.multiple = true;
    }
  }
1291
  selectElement.addEventListener("resetform", event => {
    const defaultValue = this.data.defaultFieldValue;
1294
    for (const option of selectElement.options) {
      option.selected = option.value === defaultValue;
    }
  });
1299
  for (const option of this.data.options) {
    const optionElement = document.createElement("option");
    optionElement.textContent = option.displayValue;
    optionElement.value = option.exportValue;
1304
    if (this.data.combo) {
      optionElement.style.fontSize = fontSizeStyle;
    }
1308
    if (this.data.fieldValue.includes(option.exportValue)) {
      optionElement.setAttribute("selected", true);
    }
1312
    selectElement.appendChild(optionElement);
  }
1315
  const getValue = (event, isExport) => {
    const name = isExport ? "value" : "textContent";
    const options = event.target.options;
1319
    if (!event.target.multiple) {
      return options.selectedIndex === -1 ? null : options[options.selectedIndex][name];
    }
1323
    return Array.prototype.filter.call(options, option => option.selected).map(option => option[name]);
  };
1326
  const getItems = event => {
    const options = event.target.options;
    return Array.prototype.map.call(options, option => {
      return {
        displayValue: option.textContent,
        exportValue: option.value
      };
    });
  };
1336
  if (this.enableScripting && this.hasJSActions) {
    selectElement.addEventListener("updatefromsandbox", jsEvent => {
      const actions = {
        value(event) {
          const value = event.detail.value;
          const values = new Set(Array.isArray(value) ? value : [value]);
1343
          for (const option of selectElement.options) {
            option.selected = values.has(option.value);
          }
1347
          storage.setValue(id, {
            value: getValue(event, true)
          });
        },
1352
        multipleSelection(event) {
          selectElement.multiple = true;
        },
1356
        remove(event) {
          const options = selectElement.options;
          const index = event.detail.remove;
          options[index].selected = false;
          selectElement.remove(index);
1362
          if (options.length > 0) {
            const i = Array.prototype.findIndex.call(options, option => option.selected);
1365
            if (i === -1) {
              options[0].selected = true;
            }
          }
1370
          storage.setValue(id, {
            value: getValue(event, true),
            items: getItems(event)
          });
        },
1376
        clear(event) {
          while (selectElement.length !== 0) {
            selectElement.remove(0);
          }
1381
          storage.setValue(id, {
            value: null,
            items: []
          });
        },
1387
        insert(event) {
          const {
            index,
            displayValue,
            exportValue
          } = event.detail.insert;
          const optionElement = document.createElement("option");
          optionElement.textContent = displayValue;
          optionElement.value = exportValue;
          selectElement.insertBefore(optionElement, selectElement.children[index]);
          storage.setValue(id, {
            value: getValue(event, true),
            items: getItems(event)
          });
        },
1403
        items(event) {
          const {
            items
          } = event.detail;
1408
          while (selectElement.length !== 0) {
            selectElement.remove(0);
          }
1412
          for (const item of items) {
            const {
              displayValue,
              exportValue
            } = item;
            const optionElement = document.createElement("option");
            optionElement.textContent = displayValue;
            optionElement.value = exportValue;
            selectElement.appendChild(optionElement);
          }
1423
          if (selectElement.options.length > 0) {
            selectElement.options[0].selected = true;
          }
1427
          storage.setValue(id, {
            value: getValue(event, true),
            items: getItems(event)
          });
        },
1433
        indices(event) {
          const indices = new Set(event.detail.indices);
1436
          for (const option of event.target.options) {
            option.selected = indices.has(option.index);
          }
1440
          storage.setValue(id, {
            value: getValue(event, true)
          });
        },
1445
        editable(event) {
          event.target.disabled = !event.detail.editable;
        }
1449
      };
1451
      this._dispatchEventFromSandbox(actions, jsEvent);
    });
    selectElement.addEventListener("input", event => {
      const exportValue = getValue(event, true);
      const value = getValue(event, false);
      storage.setValue(id, {
        value: exportValue
      });
      this.linkService.eventBus?.dispatch("dispatcheventinsandbox", {
        source: this,
        detail: {
          id,
          name: "Keystroke",
          value,
          changeEx: exportValue,
          willCommit: true,
          commitKey: 1,
          keyDown: false
        }
      });
    });
1473
    this._setEventListeners(selectElement, [["focus", "Focus"], ["blur", "Blur"], ["mousedown", "Mouse Down"], ["mouseenter", "Mouse Enter"], ["mouseleave", "Mouse Exit"], ["mouseup", "Mouse Up"], ["input", "Action"]], event => event.target.checked);
  } else {
    selectElement.addEventListener("input", function (event) {
      storage.setValue(id, {
        value: getValue(event)
      });
    });
  }
1482
  this._setBackgroundColor(selectElement);
1484
  this.container.appendChild(selectElement);
  return this.container;
}
1488
1489}
1490
1491class PopupAnnotationElement extends AnnotationElement {
constructor(parameters) {
  const isRenderable = !!(parameters.data.titleObj?.str || parameters.data.contentsObj?.str || parameters.data.richText?.str);
  super(parameters, {
    isRenderable
  });
}
1498
render() {
  const IGNORE_TYPES = ["Line", "Square", "Circle", "PolyLine", "Polygon", "Ink"];
  this.container.className = "popupAnnotation";
1502
  if (IGNORE_TYPES.includes(this.data.parentType)) {
    return this.container;
  }
1506
  const selector = `[data-annotation-id="${this.data.parentId}"]`;
  const parentElements = this.layer.querySelectorAll(selector);
1509
  if (parentElements.length === 0) {
    return this.container;
  }
1513
  const popup = new PopupElement({
    container: this.container,
    trigger: Array.from(parentElements),
    color: this.data.color,
    titleObj: this.data.titleObj,
    modificationDate: this.data.modificationDate,
    contentsObj: this.data.contentsObj,
    richText: this.data.richText
  });
  const page = this.page;
1524
  const rect = _util.Util.normalizeRect([this.data.parentRect[0], page.view[3] - this.data.parentRect[1] + page.view[1], this.data.parentRect[2], page.view[3] - this.data.parentRect[3] + page.view[1]]);
1526
  const popupLeft = rect[0] + this.data.parentRect[2] - this.data.parentRect[0];
  const popupTop = rect[1];
  this.container.style.transformOrigin = `${-popupLeft}px ${-popupTop}px`;
  this.container.style.left = `${popupLeft}px`;
  this.container.style.top = `${popupTop}px`;
  this.container.appendChild(popup.render());
  return this.container;
}
1535
1536}
1537
1538class PopupElement {
constructor(parameters) {
  this.container = parameters.container;
  this.trigger = parameters.trigger;
  this.color = parameters.color;
  this.titleObj = parameters.titleObj;
  this.modificationDate = parameters.modificationDate;
  this.contentsObj = parameters.contentsObj;
  this.richText = parameters.richText;
  this.hideWrapper = parameters.hideWrapper || false;
  this.pinned = false;
}
1550
render() {
  const BACKGROUND_ENLIGHT = 0.7;
  const wrapper = document.createElement("div");
  wrapper.className = "popupWrapper";
  this.hideElement = this.hideWrapper ? wrapper : this.container;
  this.hideElement.hidden = true;
  const popup = document.createElement("div");
  popup.className = "popup";
  const color = this.color;
1560
  if (color) {
    const r = BACKGROUND_ENLIGHT * (255 - color[0]) + color[0];
    const g = BACKGROUND_ENLIGHT * (255 - color[1]) + color[1];
    const b = BACKGROUND_ENLIGHT * (255 - color[2]) + color[2];
    popup.style.backgroundColor = _util.Util.makeHexColor(r | 0, g | 0, b | 0);
  }
1567
  const title = document.createElement("h1");
  title.dir = this.titleObj.dir;
  title.textContent = this.titleObj.str;
  popup.appendChild(title);
1572
  const dateObject = _display_utils.PDFDateString.toDateObject(this.modificationDate);
1574
  if (dateObject) {
    const modificationDate = document.createElement("span");
    modificationDate.className = "popupDate";
    modificationDate.textContent = "{{date}}, {{time}}";
    modificationDate.dataset.l10nId = "annotation_date_string";
    modificationDate.dataset.l10nArgs = JSON.stringify({
      date: dateObject.toLocaleDateString(),
      time: dateObject.toLocaleTimeString()
    });
    popup.appendChild(modificationDate);
  }
1586
  if (this.richText?.str && (!this.contentsObj?.str || this.contentsObj.str === this.richText.str)) {
    _xfa_layer.XfaLayer.render({
      xfaHtml: this.richText.html,
      intent: "richText",
      div: popup
    });
1593
    popup.lastChild.className = "richText popupContent";
  } else {
    const contents = this._formatContents(this.contentsObj);
1597
    popup.appendChild(contents);
  }
1600
  if (!Array.isArray(this.trigger)) {
    this.trigger = [this.trigger];
  }
1604
  for (const element of this.trigger) {
    element.addEventListener("click", this._toggle.bind(this));
    element.addEventListener("mouseover", this._show.bind(this, false));
    element.addEventListener("mouseout", this._hide.bind(this, false));
  }
1610
  popup.addEventListener("click", this._hide.bind(this, true));
  wrapper.appendChild(popup);
  return wrapper;
}
1615
_formatContents({
  str,
  dir
}) {
  const p = document.createElement("p");
  p.className = "popupContent";
  p.dir = dir;
  const lines = str.split(/(?:\r\n?|\n)/);
1624
  for (let i = 0, ii = lines.length; i < ii; ++i) {
    const line = lines[i];
    p.appendChild(document.createTextNode(line));
1628
    if (i < ii - 1) {
      p.appendChild(document.createElement("br"));
    }
  }
1633
  return p;
}
1636
_toggle() {
  if (this.pinned) {
    this._hide(true);
  } else {
    this._show(true);
  }
}
1644
_show(pin = false) {
  if (pin) {
    this.pinned = true;
  }
1649
  if (this.hideElement.hidden) {
    this.hideElement.hidden = false;
    this.container.style.zIndex += 1;
  }
}
1655
_hide(unpin = true) {
  if (unpin) {
    this.pinned = false;
  }
1660
  if (!this.hideElement.hidden && !this.pinned) {
    this.hideElement.hidden = true;
    this.container.style.zIndex -= 1;
  }
}
1666
1667}
1668
1669class FreeTextAnnotationElement extends AnnotationElement {
constructor(parameters) {
  const isRenderable = !!(parameters.data.hasPopup || parameters.data.titleObj?.str || parameters.data.contentsObj?.str || parameters.data.richText?.str);
  super(parameters, {
    isRenderable,
    ignoreBorder: true
  });
}
1677
render() {
  this.container.className = "freeTextAnnotation";
1680
  if (!this.data.hasPopup) {
    this._createPopup(null, this.data);
  }
1684
  return this.container;
}
1687
1688}
1689
1690class LineAnnotationElement extends AnnotationElement {
constructor(parameters) {
  const isRenderable = !!(parameters.data.hasPopup || parameters.data.titleObj?.str || parameters.data.contentsObj?.str || parameters.data.richText?.str);
  super(parameters, {
    isRenderable,
    ignoreBorder: true
  });
}
1698
render() {
  this.container.className = "lineAnnotation";
  const data = this.data;
  const width = data.rect[2] - data.rect[0];
  const height = data.rect[3] - data.rect[1];
  const svg = this.svgFactory.create(width, height);
  const line = this.svgFactory.createElement("svg:line");
  line.setAttribute("x1", data.rect[2] - data.lineCoordinates[0]);
  line.setAttribute("y1", data.rect[3] - data.lineCoordinates[1]);
  line.setAttribute("x2", data.rect[2] - data.lineCoordinates[2]);
  line.setAttribute("y2", data.rect[3] - data.lineCoordinates[3]);
  line.setAttribute("stroke-width", data.borderStyle.width || 1);
  line.setAttribute("stroke", "transparent");
  line.setAttribute("fill", "transparent");
  svg.appendChild(line);
  this.container.append(svg);
1715
  this._createPopup(line, data);
1717
  return this.container;
}
1720
1721}
1722
1723class SquareAnnotationElement extends AnnotationElement {
constructor(parameters) {
  const isRenderable = !!(parameters.data.hasPopup || parameters.data.titleObj?.str || parameters.data.contentsObj?.str || parameters.data.richText?.str);
  super(parameters, {
    isRenderable,
    ignoreBorder: true
  });
}
1731
render() {
  this.container.className = "squareAnnotation";
  const data = this.data;
  const width = data.rect[2] - data.rect[0];
  const height = data.rect[3] - data.rect[1];
  const svg = this.svgFactory.create(width, height);
  const borderWidth = data.borderStyle.width;
  const square = this.svgFactory.createElement("svg:rect");
  square.setAttribute("x", borderWidth / 2);
  square.setAttribute("y", borderWidth / 2);
  square.setAttribute("width", width - borderWidth);
  square.setAttribute("height", height - borderWidth);
  square.setAttribute("stroke-width", borderWidth || 1);
  square.setAttribute("stroke", "transparent");
  square.setAttribute("fill", "transparent");
  svg.appendChild(square);
  this.container.append(svg);
1749
  this._createPopup(square, data);
1751
  return this.container;
}
1754
1755}
1756
1757class CircleAnnotationElement extends AnnotationElement {
constructor(parameters) {
  const isRenderable = !!(parameters.data.hasPopup || parameters.data.titleObj?.str || parameters.data.contentsObj?.str || parameters.data.richText?.str);
  super(parameters, {
    isRenderable,
    ignoreBorder: true
  });
}
1765
render() {
  this.container.className = "circleAnnotation";
  const data = this.data;
  const width = data.rect[2] - data.rect[0];
  const height = data.rect[3] - data.rect[1];
  const svg = this.svgFactory.create(width, height);
  const borderWidth = data.borderStyle.width;
  const circle = this.svgFactory.createElement("svg:ellipse");
  circle.setAttribute("cx", width / 2);
  circle.setAttribute("cy", height / 2);
  circle.setAttribute("rx", width / 2 - borderWidth / 2);
  circle.setAttribute("ry", height / 2 - borderWidth / 2);
  circle.setAttribute("stroke-width", borderWidth || 1);
  circle.setAttribute("stroke", "transparent");
  circle.setAttribute("fill", "transparent");
  svg.appendChild(circle);
  this.container.append(svg);
1783
  this._createPopup(circle, data);
1785
  return this.container;
}
1788
1789}
1790
1791class PolylineAnnotationElement extends AnnotationElement {
constructor(parameters) {
  const isRenderable = !!(parameters.data.hasPopup || parameters.data.titleObj?.str || parameters.data.contentsObj?.str || parameters.data.richText?.str);
  super(parameters, {
    isRenderable,
    ignoreBorder: true
  });
  this.containerClassName = "polylineAnnotation";
  this.svgElementName = "svg:polyline";
}
1801
render() {
  this.container.className = this.containerClassName;
  const data = this.data;
  const width = data.rect[2] - data.rect[0];
  const height = data.rect[3] - data.rect[1];
  const svg = this.svgFactory.create(width, height);
  let points = [];
1809
  for (const coordinate of data.vertices) {
    const x = coordinate.x - data.rect[0];
    const y = data.rect[3] - coordinate.y;
    points.push(x + "," + y);
  }
1815
  points = points.join(" ");
  const polyline = this.svgFactory.createElement(this.svgElementName);
  polyline.setAttribute("points", points);
  polyline.setAttribute("stroke-width", data.borderStyle.width || 1);
  polyline.setAttribute("stroke", "transparent");
  polyline.setAttribute("fill", "transparent");
  svg.appendChild(polyline);
  this.container.append(svg);
1824
  this._createPopup(polyline, data);
1826
  return this.container;
}
1829
1830}
1831
1832class PolygonAnnotationElement extends PolylineAnnotationElement {
constructor(parameters) {
  super(parameters);
  this.containerClassName = "polygonAnnotation";
  this.svgElementName = "svg:polygon";
}
1838
1839}
1840
1841class CaretAnnotationElement extends AnnotationElement {
constructor(parameters) {
  const isRenderable = !!(parameters.data.hasPopup || parameters.data.titleObj?.str || parameters.data.contentsObj?.str || parameters.data.richText?.str);
  super(parameters, {
    isRenderable,
    ignoreBorder: true
  });
}
1849
render() {
  this.container.className = "caretAnnotation";
1852
  if (!this.data.hasPopup) {
    this._createPopup(null, this.data);
  }
1856
  return this.container;
}
1859
1860}
1861
1862class InkAnnotationElement extends AnnotationElement {
constructor(parameters) {
  const isRenderable = !!(parameters.data.hasPopup || parameters.data.titleObj?.str || parameters.data.contentsObj?.str || parameters.data.richText?.str);
  super(parameters, {
    isRenderable,
    ignoreBorder: true
  });
  this.containerClassName = "inkAnnotation";
  this.svgElementName = "svg:polyline";
}
1872
render() {
  this.container.className = this.containerClassName;
  const data = this.data;
  const width = data.rect[2] - data.rect[0];
  const height = data.rect[3] - data.rect[1];
  const svg = this.svgFactory.create(width, height);
1879
  for (const inkList of data.inkLists) {
    let points = [];
1882
    for (const coordinate of inkList) {
      const x = coordinate.x - data.rect[0];
      const y = data.rect[3] - coordinate.y;
      points.push(`${x},${y}`);
    }
1888
    points = points.join(" ");
    const polyline = this.svgFactory.createElement(this.svgElementName);
    polyline.setAttribute("points", points);
    polyline.setAttribute("stroke-width", data.borderStyle.width || 1);
    polyline.setAttribute("stroke", "transparent");
    polyline.setAttribute("fill", "transparent");
1895
    this._createPopup(polyline, data);
1897
    svg.appendChild(polyline);
  }
1900
  this.container.append(svg);
  return this.container;
}
1904
1905}
1906
1907class HighlightAnnotationElement extends AnnotationElement {
constructor(parameters) {
  const isRenderable = !!(parameters.data.hasPopup || parameters.data.titleObj?.str || parameters.data.contentsObj?.str || parameters.data.richText?.str);
  super(parameters, {
    isRenderable,
    ignoreBorder: true,
    createQuadrilaterals: true
  });
}
1916
render() {
  if (!this.data.hasPopup) {
    this._createPopup(null, this.data);
  }
1921
  if (this.quadrilaterals) {
    return this._renderQuadrilaterals("highlightAnnotation");
  }
1925
  this.container.className = "highlightAnnotation";
  return this.container;
}
1929
1930}
1931
1932class UnderlineAnnotationElement extends AnnotationElement {
constructor(parameters) {
  const isRenderable = !!(parameters.data.hasPopup || parameters.data.titleObj?.str || parameters.data.contentsObj?.str || parameters.data.richText?.str);
  super(parameters, {
    isRenderable,
    ignoreBorder: true,
    createQuadrilaterals: true
  });
}
1941
render() {
  if (!this.data.hasPopup) {
    this._createPopup(null, this.data);
  }
1946
  if (this.quadrilaterals) {
    return this._renderQuadrilaterals("underlineAnnotation");
  }
1950
  this.container.className = "underlineAnnotation";
  return this.container;
}
1954
1955}
1956
1957class SquigglyAnnotationElement extends AnnotationElement {
constructor(parameters) {
  const isRenderable = !!(parameters.data.hasPopup || parameters.data.titleObj?.str || parameters.data.contentsObj?.str || parameters.data.richText?.str);
  super(parameters, {
    isRenderable,
    ignoreBorder: true,
    createQuadrilaterals: true
  });
}
1966
render() {
  if (!this.data.hasPopup) {
    this._createPopup(null, this.data);
  }
1971
  if (this.quadrilaterals) {
    return this._renderQuadrilaterals("squigglyAnnotation");
  }
1975
  this.container.className = "squigglyAnnotation";
  return this.container;
}
1979
1980}
1981
1982class StrikeOutAnnotationElement extends AnnotationElement {
constructor(parameters) {
  const isRenderable = !!(parameters.data.hasPopup || parameters.data.titleObj?.str || parameters.data.contentsObj?.str || parameters.data.richText?.str);
  super(parameters, {
    isRenderable,
    ignoreBorder: true,
    createQuadrilaterals: true
  });
}
1991
render() {
  if (!this.data.hasPopup) {
    this._createPopup(null, this.data);
  }
1996
  if (this.quadrilaterals) {
    return this._renderQuadrilaterals("strikeoutAnnotation");
  }
2000
  this.container.className = "strikeoutAnnotation";
  return this.container;
}
2004
2005}
2006
2007class StampAnnotationElement extends AnnotationElement {
constructor(parameters) {
  const isRenderable = !!(parameters.data.hasPopup || parameters.data.titleObj?.str || parameters.data.contentsObj?.str || parameters.data.richText?.str);
  super(parameters, {
    isRenderable,
    ignoreBorder: true
  });
}
2015
render() {
  this.container.className = "stampAnnotation";
2018
  if (!this.data.hasPopup) {
    this._createPopup(null, this.data);
  }
2022
  return this.container;
}
2025
2026}
2027
2028class FileAttachmentAnnotationElement extends AnnotationElement {
constructor(parameters) {
  super(parameters, {
    isRenderable: true
  });
  const {
    filename,
    content
  } = this.data.file;
  this.filename = (0, _display_utils.getFilenameFromUrl)(filename);
  this.content = content;
  this.linkService.eventBus?.dispatch("fileattachmentannotation", {
    source: this,
    id: (0, _util.stringToPDFString)(filename),
    filename,
    content
  });
}
2046
render() {
  this.container.className = "fileAttachmentAnnotation";
  const trigger = document.createElement("div");
  trigger.style.height = this.container.style.height;
  trigger.style.width = this.container.style.width;
  trigger.addEventListener("dblclick", this._download.bind(this));
2053
  if (!this.data.hasPopup && (this.data.titleObj?.str || this.data.contentsObj?.str || this.data.richText)) {
    this._createPopup(trigger, this.data);
  }
2057
  this.container.appendChild(trigger);
  return this.container;
}
2061
_download() {
  this.downloadManager?.openOrDownloadData(this.container, this.content, this.filename);
}
2065
2066}
2067
2068class AnnotationLayer {
static render(parameters) {
  const sortedAnnotations = [],
        popupAnnotations = [];
2072
  for (const data of parameters.annotations) {
    if (!data) {
      continue;
    }
2077
    if (data.annotationType === _util.AnnotationType.POPUP) {
      popupAnnotations.push(data);
      continue;
    }
2082
    sortedAnnotations.push(data);
  }
2085
  if (popupAnnotations.length) {
    sortedAnnotations.push(...popupAnnotations);
  }
2089
  const div = parameters.div;
2091
  for (const data of sortedAnnotations) {
    const element = AnnotationElementFactory.create({
      data,
      layer: div,
      page: parameters.page,
      viewport: parameters.viewport,
      linkService: parameters.linkService,
      downloadManager: parameters.downloadManager,
      imageResourcesPath: parameters.imageResourcesPath || "",
      renderForms: parameters.renderForms !== false,
      svgFactory: new _display_utils.DOMSVGFactory(),
      annotationStorage: parameters.annotationStorage || new _annotation_storage.AnnotationStorage(),
      enableScripting: parameters.enableScripting,
      hasJSActions: parameters.hasJSActions,
      fieldObjects: parameters.fieldObjects,
      mouseState: parameters.mouseState || {
        isDown: false
      }
    });
2111
    if (element.isRenderable) {
      const rendered = element.render();
2114
      if (data.hidden) {
        rendered.style.visibility = "hidden";
      }
2118
      if (Array.isArray(rendered)) {
        for (const renderedElement of rendered) {
          div.appendChild(renderedElement);
        }
      } else {
        if (element instanceof PopupAnnotationElement) {
          div.prepend(rendered);
        } else {
          div.appendChild(rendered);
        }
      }
    }
  }
2132
  this.#setAnnotationCanvasMap(div, parameters.annotationCanvasMap);
}
2135
static update(parameters) {
  const {
    page,
    viewport,
    annotations,
    annotationCanvasMap,
    div
  } = parameters;
  const transform = viewport.transform;
  const matrix = `matrix(${transform.join(",")})`;
  let scale, ownMatrix;
2147
  for (const data of annotations) {
    const elements = div.querySelectorAll(`[data-annotation-id="${data.id}"]`);
2150
    if (elements) {
      for (const element of elements) {
        if (data.hasOwnCanvas) {
          const rect = _util.Util.normalizeRect([data.rect[0], page.view[3] - data.rect[1] + page.view[1], data.rect[2], page.view[3] - data.rect[3] + page.view[1]]);
2155
          if (!ownMatrix) {
            scale = Math.abs(transform[0] || transform[1]);
            const ownTransform = transform.slice();
2159
            for (let i = 0; i < 4; i++) {
              ownTransform[i] = Math.sign(ownTransform[i]);
            }
2163
            ownMatrix = `matrix(${ownTransform.join(",")})`;
          }
2166
          const left = rect[0] * scale;
          const top = rect[1] * scale;
          element.style.left = `${left}px`;
          element.style.top = `${top}px`;
          element.style.transformOrigin = `${-left}px ${-top}px`;
          element.style.transform = ownMatrix;
        } else {
          element.style.transform = matrix;
        }
      }
    }
  }
2179
  this.#setAnnotationCanvasMap(div, annotationCanvasMap);
  div.hidden = false;
}
2183
static #setAnnotationCanvasMap(div, annotationCanvasMap) {
  if (!annotationCanvasMap) {
    return;
  }
2188
  for (const [id, canvas] of annotationCanvasMap) {
    const element = div.querySelector(`[data-annotation-id="${id}"]`);
2191
    if (!element) {
      continue;
    }
2195
    const {
      firstChild
    } = element;
2199
    if (firstChild.nodeName === "CANVAS") {
      element.replaceChild(canvas, firstChild);
    } else {
      element.insertBefore(canvas, firstChild);
    }
  }
2206
  annotationCanvasMap.clear();
}
2209
2210}
2211
2212exports.AnnotationLayer = AnnotationLayer;
\No newline at end of file
1	`/**`
2	`* @licstart The following is the entire license notice for the`
3	`* Javascript code in this page`
4	`*`
5	`* Copyright 2021 Mozilla Foundation`
6	`*`
7	`* Licensed under the Apache License, Version 2.0 (the "License");`
8	`* you may not use this file except in compliance with the License.`
9	`* You may obtain a copy of the License at`
10	`*`
11	`* http://www.apache.org/licenses/LICENSE-2.0`
12	`*`
13	`* Unless required by applicable law or agreed to in writing, software`
14	`* distributed under the License is distributed on an "AS IS" BASIS,`
15	`* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.`
16	`* See the License for the specific language governing permissions and`
17	`* limitations under the License.`
18	`*`
19	`* @licend The above is the entire license notice for the`
20	`* Javascript code in this page`
21	`*/`
22	`"use strict";`
23
24	`Object.defineProperty(exports, "__esModule", {`
25	`value: true`
26	`});`
27	`exports.AnnotationLayer = void 0;`
28
29	`var _util = require("../shared/util.js");`
30
31	`var _display_utils = require("./display_utils.js");`
32
33	`var _annotation_storage = require("./annotation_storage.js");`
34
35	`var _scripting_utils = require("../shared/scripting_utils.js");`
36
37	`var _xfa_layer = require("./xfa_layer.js");`
38
39	`const DEFAULT_TAB_INDEX = 1000;`
40	`const GetElementsByNameSet = new WeakSet();`