add 添加初始化及处理PDF文档逻辑

packages/core/constants/index.js

@@ -0,0 +1,442 @@
+const RenderingStates = {
+  INITIAL: 0,
+  RUNNING: 1,
+  PAUSED: 2,
+  FINISHED: 3
+}
+
+const ALIGN = {
+  left: 'left',
+  centered: 'center',
+  right: 'right'
+}
+
+const MARGIN_DISTANCE = 10
+
+const IDENTITY_MATRIX = [1, 0, 0, 1, 0, 0];
+const FONT_IDENTITY_MATRIX = [0.001, 0, 0, 0.001, 0, 0];
+
+// Represent the percentage of the height of a single-line field over
+// the font size. Acrobat seems to use this value.
+const LINE_FACTOR = 1.35;
+const LINE_DESCENT_FACTOR = 0.35;
+
+/**
+ * Refer to the `WorkerTransport.getRenderingIntent`-method in the API, to see
+ * how these flags are being used:
+ *  - ANY, DISPLAY, and PRINT are the normal rendering intents, note the
+ *    `PDFPageProxy.{render, getOperatorList, getAnnotations}`-methods.
+ *  - ANNOTATIONS_FORMS, ANNOTATIONS_STORAGE, ANNOTATIONS_DISABLE control which
+ *    annotations are rendered onto the canvas (i.e. by being included in the
+ *    operatorList), note the `PDFPageProxy.{render, getOperatorList}`-methods
+ *    and their `annotationMode`-option.
+ *  - OPLIST is used with the `PDFPageProxy.getOperatorList`-method, note the
+ *    `OperatorList`-constructor (on the worker-thread).
+ */
+const RenderingIntentFlag = {
+  ANY: 0x01,
+  DISPLAY: 0x02,
+  PRINT: 0x04,
+  ANNOTATIONS_FORMS: 0x10,
+  ANNOTATIONS_STORAGE: 0x20,
+  ANNOTATIONS_DISABLE: 0x40,
+  OPLIST: 0x100,
+};
+
+const AnnotationEditorPrefix = "pdfjs_internal_editor_";
+
+const AnnotationEditorType = {
+  DISABLE: -1,
+  NONE: 0,
+  FREETEXT: 3,
+  INK: 15,
+};
+
+const AnnotationEditorParamsType = {
+  FREETEXT_SIZE: 1,
+  FREETEXT_COLOR: 2,
+  FREETEXT_OPACITY: 3,
+  INK_COLOR: 11,
+  INK_THICKNESS: 12,
+  INK_OPACITY: 13,
+};
+
+// Permission flags from Table 22, Section 7.6.3.2 of the PDF specification.
+const PermissionFlag = {
+  PRINT: 0x04,
+  MODIFY_CONTENTS: 0x08,
+  COPY: 0x10,
+  MODIFY_ANNOTATIONS: 0x20,
+  FILL_INTERACTIVE_FORMS: 0x100,
+  COPY_FOR_ACCESSIBILITY: 0x200,
+  ASSEMBLE: 0x400,
+  PRINT_HIGH_QUALITY: 0x800,
+};
+
+const TextRenderingMode = {
+  FILL: 0,
+  STROKE: 1,
+  FILL_STROKE: 2,
+  INVISIBLE: 3,
+  FILL_ADD_TO_PATH: 4,
+  STROKE_ADD_TO_PATH: 5,
+  FILL_STROKE_ADD_TO_PATH: 6,
+  ADD_TO_PATH: 7,
+  FILL_STROKE_MASK: 3,
+  ADD_TO_PATH_FLAG: 4,
+};
+
+const ImageKind = {
+  GRAYSCALE_1BPP: 1,
+  RGB_24BPP: 2,
+  RGBA_32BPP: 3,
+};
+
+const AnnotationType = {
+  TEXT: 1,
+  LINK: 2,
+  FREETEXT: 3,
+  LINE: 4,
+  SQUARE: 5,
+  CIRCLE: 6,
+  POLYGON: 7,
+  POLYLINE: 8,
+  HIGHLIGHT: 9,
+  UNDERLINE: 10,
+  SQUIGGLY: 11,
+  STRIKEOUT: 12,
+  STAMP: 13,
+  CARET: 14,
+  INK: 15,
+  POPUP: 16,
+  FILEATTACHMENT: 17,
+  SOUND: 18,
+  MOVIE: 19,
+  WIDGET: 20,
+  SCREEN: 21,
+  PRINTERMARK: 22,
+  TRAPNET: 23,
+  WATERMARK: 24,
+  THREED: 25,
+  REDACT: 26,
+};
+
+const AnnotationStateModelType = {
+  MARKED: "Marked",
+  REVIEW: "Review",
+};
+
+const AnnotationMarkedState = {
+  MARKED: "Marked",
+  UNMARKED: "Unmarked",
+};
+
+const AnnotationReviewState = {
+  ACCEPTED: "Accepted",
+  REJECTED: "Rejected",
+  CANCELLED: "Cancelled",
+  COMPLETED: "Completed",
+  NONE: "None",
+};
+
+const AnnotationReplyType = {
+  GROUP: "Group",
+  REPLY: "R",
+};
+
+const AnnotationFlag = {
+  INVISIBLE: 0x01,
+  HIDDEN: 0x02,
+  PRINT: 0x04,
+  NOZOOM: 0x08,
+  NOROTATE: 0x10,
+  NOVIEW: 0x20,
+  READONLY: 0x40,
+  LOCKED: 0x80,
+  TOGGLENOVIEW: 0x100,
+  LOCKEDCONTENTS: 0x200,
+};
+
+const AnnotationFieldFlag = {
+  READONLY: 0x0000001,
+  REQUIRED: 0x0000002,
+  NOEXPORT: 0x0000004,
+  MULTILINE: 0x0001000,
+  PASSWORD: 0x0002000,
+  NOTOGGLETOOFF: 0x0004000,
+  RADIO: 0x0008000,
+  PUSHBUTTON: 0x0010000,
+  COMBO: 0x0020000,
+  EDIT: 0x0040000,
+  SORT: 0x0080000,
+  FILESELECT: 0x0100000,
+  MULTISELECT: 0x0200000,
+  DONOTSPELLCHECK: 0x0400000,
+  DONOTSCROLL: 0x0800000,
+  COMB: 0x1000000,
+  RICHTEXT: 0x2000000,
+  RADIOSINUNISON: 0x2000000,
+  COMMITONSELCHANGE: 0x4000000,
+};
+
+const AnnotationBorderStyleType = {
+  SOLID: 1,
+  DASHED: 2,
+  BEVELED: 3,
+  INSET: 4,
+  UNDERLINE: 5,
+};
+
+const AnnotationActionEventType = {
+  E: "Mouse Enter",
+  X: "Mouse Exit",
+  D: "Mouse Down",
+  U: "Mouse Up",
+  Fo: "Focus",
+  Bl: "Blur",
+  PO: "PageOpen",
+  PC: "PageClose",
+  PV: "PageVisible",
+  PI: "PageInvisible",
+  K: "Keystroke",
+  F: "Format",
+  V: "Validate",
+  C: "Calculate",
+};
+
+const DocumentActionEventType = {
+  WC: "WillClose",
+  WS: "WillSave",
+  DS: "DidSave",
+  WP: "WillPrint",
+  DP: "DidPrint",
+};
+
+const PageActionEventType = {
+  O: "PageOpen",
+  C: "PageClose",
+};
+
+const StreamType = {
+  UNKNOWN: "UNKNOWN",
+  FLATE: "FLATE",
+  LZW: "LZW",
+  DCT: "DCT",
+  JPX: "JPX",
+  JBIG: "JBIG",
+  A85: "A85",
+  AHX: "AHX",
+  CCF: "CCF",
+  RLX: "RLX", // PDF short name is 'RL', but telemetry requires three chars.
+};
+
+const FontType = {
+  UNKNOWN: "UNKNOWN",
+  TYPE1: "TYPE1",
+  TYPE1STANDARD: "TYPE1STANDARD",
+  TYPE1C: "TYPE1C",
+  CIDFONTTYPE0: "CIDFONTTYPE0",
+  CIDFONTTYPE0C: "CIDFONTTYPE0C",
+  TRUETYPE: "TRUETYPE",
+  CIDFONTTYPE2: "CIDFONTTYPE2",
+  TYPE3: "TYPE3",
+  OPENTYPE: "OPENTYPE",
+  TYPE0: "TYPE0",
+  MMTYPE1: "MMTYPE1",
+};
+
+const VerbosityLevel = {
+  ERRORS: 0,
+  WARNINGS: 1,
+  INFOS: 5,
+};
+
+const CMapCompressionType = {
+  NONE: 0,
+  BINARY: 1,
+};
+
+// All the possible operations for an operator list.
+const OPS = {
+  // Intentionally start from 1 so it is easy to spot bad operators that will be
+  // 0's.
+  // PLEASE NOTE: We purposely keep any removed operators commented out, since
+  //              re-numbering the list would risk breaking third-party users.
+  dependency: 1,
+  setLineWidth: 2,
+  setLineCap: 3,
+  setLineJoin: 4,
+  setMiterLimit: 5,
+  setDash: 6,
+  setRenderingIntent: 7,
+  setFlatness: 8,
+  setGState: 9,
+  save: 10,
+  restore: 11,
+  transform: 12,
+  moveTo: 13,
+  lineTo: 14,
+  curveTo: 15,
+  curveTo2: 16,
+  curveTo3: 17,
+  closePath: 18,
+  rectangle: 19,
+  stroke: 20,
+  closeStroke: 21,
+  fill: 22,
+  eoFill: 23,
+  fillStroke: 24,
+  eoFillStroke: 25,
+  closeFillStroke: 26,
+  closeEOFillStroke: 27,
+  endPath: 28,
+  clip: 29,
+  eoClip: 30,
+  beginText: 31,
+  endText: 32,
+  setCharSpacing: 33,
+  setWordSpacing: 34,
+  setHScale: 35,
+  setLeading: 36,
+  setFont: 37,
+  setTextRenderingMode: 38,
+  setTextRise: 39,
+  moveText: 40,
+  setLeadingMoveText: 41,
+  setTextMatrix: 42,
+  nextLine: 43,
+  showText: 44,
+  showSpacedText: 45,
+  nextLineShowText: 46,
+  nextLineSetSpacingShowText: 47,
+  setCharWidth: 48,
+  setCharWidthAndBounds: 49,
+  setStrokeColorSpace: 50,
+  setFillColorSpace: 51,
+  setStrokeColor: 52,
+  setStrokeColorN: 53,
+  setFillColor: 54,
+  setFillColorN: 55,
+  setStrokeGray: 56,
+  setFillGray: 57,
+  setStrokeRGBColor: 58,
+  setFillRGBColor: 59,
+  setStrokeCMYKColor: 60,
+  setFillCMYKColor: 61,
+  shadingFill: 62,
+  beginInlineImage: 63,
+  beginImageData: 64,
+  endInlineImage: 65,
+  paintXObject: 66,
+  markPoint: 67,
+  markPointProps: 68,
+  beginMarkedContent: 69,
+  beginMarkedContentProps: 70,
+  endMarkedContent: 71,
+  beginCompat: 72,
+  endCompat: 73,
+  paintFormXObjectBegin: 74,
+  paintFormXObjectEnd: 75,
+  beginGroup: 76,
+  endGroup: 77,
+  // beginAnnotations: 78,
+  // endAnnotations: 79,
+  beginAnnotation: 80,
+  endAnnotation: 81,
+  // paintJpegXObject: 82,
+  paintImageMaskXObject: 83,
+  paintImageMaskXObjectGroup: 84,
+  paintImageXObject: 85,
+  paintInlineImageXObject: 86,
+  paintInlineImageXObjectGroup: 87,
+  paintImageXObjectRepeat: 88,
+  paintImageMaskXObjectRepeat: 89,
+  paintSolidColorImageMask: 90,
+  constructPath: 91,
+};
+
+const UNSUPPORTED_FEATURES = {
+  forms: "forms",
+  javaScript: "javaScript",
+  signatures: "signatures",
+  smask: "smask",
+  shadingPattern: "shadingPattern",
+  errorTilingPattern: "errorTilingPattern",
+  errorExtGState: "errorExtGState",
+  errorXObject: "errorXObject",
+  errorFontLoadType3: "errorFontLoadType3",
+  errorFontState: "errorFontState",
+  errorFontMissing: "errorFontMissing",
+  errorFontTranslate: "errorFontTranslate",
+  errorColorSpace: "errorColorSpace",
+  errorOperatorList: "errorOperatorList",
+  errorFontToUnicode: "errorFontToUnicode",
+  errorFontLoadNative: "errorFontLoadNative",
+  errorFontBuildPath: "errorFontBuildPath",
+  errorFontGetPath: "errorFontGetPath",
+  errorMarkedContent: "errorMarkedContent",
+  errorContentSubStream: "errorContentSubStream",
+};
+
+const PasswordResponses = {
+  NEED_PASSWORD: 1,
+  INCORRECT_PASSWORD: 2,
+};
+
+class PixelsPerInch {
+  static CSS = 96.0;
+
+  static PDF = 72.0;
+
+  static PDF_TO_CSS_UNITS = 1;
+}
+
+const ANNOTATION_TYPE = {
+  ink: 'Ink',
+  freetext: 'freetext',
+  text: 'Text',
+  square: 'Square',
+  circle: 'Circle',
+  line: 'Line',
+  arrow: 'Line',
+  image: 'Image',
+};
+
+
+
+export {
+  RenderingStates,
+  MARGIN_DISTANCE,
+  IDENTITY_MATRIX,
+  FONT_IDENTITY_MATRIX,
+  LINE_FACTOR,
+  LINE_DESCENT_FACTOR,
+  RenderingIntentFlag,
+  AnnotationEditorPrefix,
+  AnnotationEditorType,
+  AnnotationEditorParamsType,
+  PermissionFlag,
+  TextRenderingMode,
+  ImageKind,
+  AnnotationType,
+  AnnotationStateModelType,
+  AnnotationMarkedState,
+  AnnotationReviewState,
+  AnnotationReplyType,
+  AnnotationFlag,
+  AnnotationFieldFlag,
+  AnnotationBorderStyleType,
+  AnnotationActionEventType,
+  DocumentActionEventType,
+  PageActionEventType,
+  StreamType,
+  FontType,
+  VerbosityLevel,
+  CMapCompressionType,
+  OPS,
+  PixelsPerInch,
+  UNSUPPORTED_FEATURES,
+  PasswordResponses,
+  ANNOTATION_TYPE,
+  ALIGN
+}

packages/core/package.json

@@ -23,6 +23,7 @@
     "@babel/runtime-corejs3": "^7.20.1",
     "@rollup/plugin-babel": "^6.0.2",
     "@rollup/plugin-commonjs": "^23.0.2",
+    "@rollup/plugin-json": "^6.0.0",
     "@rollup/plugin-node-resolve": "^15.0.1",
     "cross-env": "^7.0.3",
     "rollup": "^3.2.3",

packages/core/rollup.config.js

@@ -2,6 +2,7 @@ import nodeResolve from '@rollup/plugin-node-resolve'
 import commonjs from "@rollup/plugin-commonjs"
 import babel from '@rollup/plugin-babel'
 import { uglify } from 'rollup-plugin-uglify'
+import json from '@rollup/plugin-json';
 
 export default {
   input: "./src/index.js",
@@ -11,10 +12,11 @@ export default {
       format: "es",
       name: 'ComPDFKitViewer',
       file: "../webview/lib/webview.min.js",
-      sourcemap: true
+      sourcemap: false
     }
   ],
   plugins: [
+    json(),
     nodeResolve({
       preferBuiltins: true,
       mainFields: ['browser']

packages/webview/package.json

@@ -14,7 +14,7 @@
     "@vueuse/integrations": "^9.5.0",
     "axios": "^0.27.2",
     "dayjs": "^1.11.6",
-    "pinia": "^2.0.23",
+    "pinia": "^2.0.36",
     "vue": "^3.2.41"
   },
   "devDependencies": {

packages/webview/src/stores/modules/viewer.js

@@ -5,6 +5,7 @@ export const useViewerStore = defineStore({
   state: () => ({
     fullMode: false,
     currentPage: 0,
+    searchStatus: false,
     scale: '',
     themeMode: 'Light',
     pageMode: 0,
@@ -16,6 +17,153 @@ export const useViewerStore = defineStore({
     activeLeftPanelTab: 'THUMBS',
     activeStickNote: false,
     activeActiveMeasure: false,
-    activeHand: false
-  })
+    activeHand: false,
+    openElements: {
+      header: true,
+      leftPanel: false
+    },
+    headers: [
+      {
+        type: 'toggleElementButton',
+        img: 'icon-header-sidebar-line',
+        element: 'leftPanel',
+        dataElement: 'leftPanelButton',
+        title: 'Left Panel'
+      },
+      {
+        type: 'divider',
+        hidden: [
+          'small-mobile'
+        ]
+      },
+      {
+        type: 'pageDisplayButton',
+        dataElement: 'pageDisplayButton',
+        element: 'pageDisplayButton',
+        title: 'Page Display'
+      },
+      {
+        type: 'fullScreenButton',
+        dataElement: 'fullScreenButton',
+        element: 'fullScreenButton',
+        title: 'Full Screen'
+      },
+      {
+        type: 'handToolButton',
+        dataElement: 'handToolButton',
+        element: 'handToolButton',
+        title: 'Pan Tool'
+      },
+      {
+        type: 'divider',
+        hidden: [
+          'small-mobile'
+        ]
+      },
+      {
+        type: 'zoomOverlay',
+        dataElement: 'zoomOverlayButton',
+        element: 'zoomOverlay',
+        hiddenOnMobileDevice: true
+      },
+      {
+        type: 'divider',
+        hidden: [
+          'small-mobile'
+        ]
+      },
+      {
+        type: 'themeMode',
+        dataElement: 'themeMode',
+        element: 'themeMode'
+      }
+    ],
+    disabledElements: null
+  }),
+  getters: {
+    getFullMode () {
+      return this.fullMode
+    },
+    getCurrentPage () {
+      return this.currentPage
+    },
+    getThemeMode () {
+      return this.themeMode
+    },
+    getPageMode () {
+      return this.pageMode
+    },
+    getScrollMode () {
+      return this.scrollMode
+    },
+    getActiveHeaderItems () {
+      return this.headers
+    },
+    getActiveRightHeaderItems () {
+      return this.rightHeaders
+    },
+    isLeftPanelOpen: (state) => {
+      return (dataElement) => state.openElements[dataElement] && !state.disabledElements?.[dataElement]?.disabled
+    },
+    getActiveLeftPanel () {
+      return this.activeLeftPanel
+    },
+    getActiveLeftPanelTab () {
+      return this.activeLeftPanelTab
+    },
+    getScale () {
+      return Math.round(this.scale * 100)
+    },
+    getActiveMeasure () {
+      return this.activeActiveMeasure
+    },
+    getActiveHand () {
+      return this.activeHand
+    },
+    getSearchStatus () {
+      return this.searchStatus
+    }
+  },
+  actions: {
+    setFullMode (fullMode) {
+      return this.fullMode = fullMode
+    },
+    setCurrentPage (currentPage) {
+      this.currentPage = currentPage
+    },
+    setThemeMode (themeMode) {
+      this.themeMode = themeMode
+    },
+    setPageMode (mode) {
+      this.pageMode = mode
+    },
+    setScrollMode (mode) {
+      this.scrollMode = mode
+    },
+    setCurrentScale (scale) {
+      this.scale = scale
+    },
+    openElement (dataElement) {
+      this.openElements[dataElement] = true
+    },
+    closeElement (dataElement) {
+      this.openElements[dataElement] = false
+    },
+    toggleElement (dataElement) {
+      if (this.disabledElements?.[dataElement]?.disabled) {
+        return
+      }
+      if (this.openElements[dataElement]) {
+        this.closeElement(dataElement)
+      } else {
+        this.openElement(dataElement)
+      }
+    },
+    setActiveLeftPanel (dataElement) {
+      this.activeLeftPanel = dataElement
+    },
+    setActiveLeftPanelTab (dataElement) {
+      this.activeLeftPanelTab = dataElement
+    }
+  }
 })