From a00d6b6d76db5c123788d7119c9a978fc2eb31ff Mon Sep 17 00:00:00 2001
From: itorr <itorrrrrr@me.com>
Date: Thu, 11 Aug 2022 14:48:55 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E9=80=89=E9=A1=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 html/document.js |  2 ++
 html/index.html  | 17 ++++++++++++++++-
 html/louvre.js   | 30 +++++++++++++++++++-----------
 3 files changed, 37 insertions(+), 12 deletions(-)

diff --git a/html/document.js b/html/document.js
index 6b3e5af..c1ddb56 100644
--- a/html/document.js
+++ b/html/document.js
@@ -146,6 +146,8 @@ const Convolutes = {
 const style = {
 	zoom:1.3,
 	light:0,
+	blackLimit: 80,
+	blackLight: 40,
 	s:80,
 	l:50,
 	black:true,
diff --git a/html/index.html b/html/index.html
index 1e9dab4..54fe123 100644
--- a/html/index.html
+++ b/html/index.html
@@ -59,6 +59,9 @@ img,canvas{
 			<label>
 				<input type="checkbox" v-model="style.black">铺调子
 			</label>
+			<label>
+				<input type="checkbox" v-model="style.cover">方形封面
+			</label>
 		</div>
 
 		<!-- <div class="label-box" style="padding:4px 0;">
@@ -96,11 +99,23 @@ img,canvas{
 			<span v-text="style.lightCut"></span>
 		</div> -->
 		<div class="label-box" style="padding:4px 0;">
-			<b>黑场切断</b>
+			<b>线迹轻重</b>
 			<input type="range" v-model.number="style.darkCut"
 				   min="80" max="126" step="1">
 			<span v-text="style.darkCut"></span>
 		</div>
+		<div class="label-box" style="padding:4px 0;">
+			<b>调子数量</b>
+			<input type="range" v-model.number="style.blackLimit"
+				   min="20" max="140" step="1">
+			<span v-text="style.blackLimit"></span>
+		</div>
+		<div class="label-box" style="padding:4px 0;">
+			<b>调子轻重</b>
+			<input type="range" v-model.number="style.blackLight"
+				   min="10" max="70" step="1">
+			<span v-text="style.blackLight"></span>
+		</div>
 		<!-- <div class="label-box" style="padding:4px 0;">
 			<label>
 				<input type="checkbox" v-model="style.hue">色轮
diff --git a/html/louvre.js b/html/louvre.js
index ac74a50..c30a02e 100644
--- a/html/louvre.js
+++ b/html/louvre.js
@@ -64,23 +64,25 @@ const louvre = (img, config, callback) => {
 	// const _height = 800;
 
 
-	canvas.width = _width;
-	canvas.height = _height;
-
 	let cutLeft = 0;
 	let cutTop = 0;
 
 	let calcWidth = oriWidth;
 	let calcHeight = oriHeight;
 
+	if(config.cover){
+
+		if(oriScale > 1){
+			cutLeft = (oriScale - 1) * oriHeight / 2;
+			calcWidth = oriHeight;
+			_width = _height;
+		}else{
+			cutTop =  (1 - oriScale) * oriHeight / 2;
+			calcHeight = oriWidth;
+			_height = _width;
+		}
+	}
 
-	// if(oriScale > 1){
-	// 	cutLeft = (oriScale - 1) * oriHeight / 2;
-	// 	calcWidth = oriHeight;
-	// }else{
-	// 	cutTop =  (1 - oriScale) * oriHeight / 2;
-	// 	calcHeight = oriWidth;
-	// }
 
 	let setLeft = 0;
 	let setTop = 0;
@@ -90,6 +92,8 @@ const louvre = (img, config, callback) => {
 
 
 
+	canvas.width = _width;
+	canvas.height = _height;
 
 	ctx.drawImage(
 		img,
@@ -129,6 +133,10 @@ const louvre = (img, config, callback) => {
 	}
 	let blackPixel;
 
+	const { 
+		blackLimit = 80,
+		blackLight = 40 
+	} = config;
 	if(config.black){
 		// 处理暗面
 		blackPixel = ctx.createImageData(_width, _height);
@@ -136,7 +144,7 @@ const louvre = (img, config, callback) => {
 		for (let i = 0; i < pixelData.length; i += 4) {
 			let y = pixelData[i];
 
-			y = y > 80 ? 0 : (40 + Math.random() * 40 - 20);
+			y = y > blackLimit ? 0 : (blackLight + Math.random() * 40 - 20);
 
 			// y = Math.max(255-y) * 0.6;