From 46be70072852e6cb2c827d960734b54880fc0681 Mon Sep 17 00:00:00 2001
From: Hufe921 <huangyunfeihufe@hotmail.com>
Date: Sun, 17 Sep 2023 20:33:24 +0800
Subject: [PATCH] feat: paper background color option

---
 docs/en/guide/option.md                  | 1 +
 docs/guide/option.md                     | 1 +
 src/editor/core/draw/frame/Background.ts | 7 ++++++-
 src/editor/index.ts                      | 1 +
 src/editor/interface/Editor.ts           | 1 +
 5 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/docs/en/guide/option.md b/docs/en/guide/option.md
index 6d5c7fa..22dd84c 100644
--- a/docs/en/guide/option.md
+++ b/docs/en/guide/option.md
@@ -27,6 +27,7 @@ interface IEditorOption {
   height?: number // Paper height. default: 1123
   scale?: number // scaling. default: 1
   pageGap?: number // Paper spacing. default: 20
+  backgroundColor?: string // Paper background color. default: #FFFFFF
   underlineColor?: string // Underline color. default: #000000
   strikeoutColor?: string // Strikeout color. default: #FF0000
   rangeColor?: string // Range color. default: #AECBFA
diff --git a/docs/guide/option.md b/docs/guide/option.md
index 9fcdfe4..8a4f565 100644
--- a/docs/guide/option.md
+++ b/docs/guide/option.md
@@ -27,6 +27,7 @@ interface IEditorOption {
   height?: number // 纸张高度。默认：1123
   scale?: number // 缩放比例。默认：1
   pageGap?: number // 纸张间隔。默认：20
+  backgroundColor?: string // 纸张背景色。默认：#FFFFFF
   underlineColor?: string // 下划线颜色。默认：#000000
   strikeoutColor?: string // 删除线颜色。默认：#FF0000
   rangeColor?: string // 选区颜色。默认：#AECBFA
diff --git a/src/editor/core/draw/frame/Background.ts b/src/editor/core/draw/frame/Background.ts
index ea736ca..c1c45f4 100644
--- a/src/editor/core/draw/frame/Background.ts
+++ b/src/editor/core/draw/frame/Background.ts
@@ -1,17 +1,22 @@
+import { DeepRequired } from '../../../interface/Common'
+import { IEditorOption } from '../../../interface/Editor'
 import { Draw } from '../Draw'
 
 export class Background {
   private draw: Draw
+  private options: DeepRequired<IEditorOption>
 
   constructor(draw: Draw) {
     this.draw = draw
+    this.options = draw.getOptions()
   }
 
   public render(ctx: CanvasRenderingContext2D, pageNo: number) {
+    const { backgroundColor } = this.options
     const width = this.draw.getCanvasWidth(pageNo)
     const height = this.draw.getCanvasHeight(pageNo)
     ctx.save()
-    ctx.fillStyle = '#ffffff'
+    ctx.fillStyle = backgroundColor
     ctx.fillRect(0, 0, width, height)
     ctx.restore()
   }
diff --git a/src/editor/index.ts b/src/editor/index.ts
index 6e57bcd..1efc2c2 100644
--- a/src/editor/index.ts
+++ b/src/editor/index.ts
@@ -140,6 +140,7 @@ export default class Editor {
       height: 1123,
       scale: 1,
       pageGap: 20,
+      backgroundColor: '#FFFFFF',
       underlineColor: '#000000',
       strikeoutColor: '#FF0000',
       rangeAlpha: 0.6,
diff --git a/src/editor/interface/Editor.ts b/src/editor/interface/Editor.ts
index 9acd290..aa905de 100644
--- a/src/editor/interface/Editor.ts
+++ b/src/editor/interface/Editor.ts
@@ -39,6 +39,7 @@ export interface IEditorOption {
   height?: number
   scale?: number
   pageGap?: number
+  backgroundColor?: string
   underlineColor?: string
   strikeoutColor?: string
   rangeColor?: string