GitHub/epd42
1
0
Fork 0
mirror of https://github.com/pengwon/epd42.git synced 2025-12-06 15:52:49 +08:00
Code Issues Packages Projects Releases Wiki Activity

update html

Browse Source
This commit is contained in:
Shuanglei Tao
2024-12-25 14:42:48 +08:00
parent 023331b4e1
commit 60d48ad8c4
4 changed files with 244 additions and 374 deletions
Download Patch File Download Diff File Expand all files Collapse all files

160
EPD/EPD_Test.c
View File

@@ -1,160 +0,0 @@
#include "EPD_Test.h"
#include "EPD_4in2.h"
const unsigned char EPD_4IN2_4Gray_lut_vcom[] =
{
0x00 ,0x0A ,0x00 ,0x00 ,0x00 ,0x01,
0x60 ,0x14 ,0x14 ,0x00 ,0x00 ,0x01,
0x00 ,0x14 ,0x00 ,0x00 ,0x00 ,0x01,
0x00 ,0x13 ,0x0A ,0x01 ,0x00 ,0x01,
0x00 ,0x00 ,0x00 ,0x00 ,0x00 ,0x00,
0x00 ,0x00 ,0x00 ,0x00 ,0x00 ,0x00,
0x00 ,0x00 ,0x00 ,0x00 ,0x00 ,0x00
};
const unsigned char EPD_4IN2_4Gray_lut_ww[] ={
0x40 ,0x0A ,0x00 ,0x00 ,0x00 ,0x01,
0x90 ,0x14 ,0x14 ,0x00 ,0x00 ,0x01,
0x10 ,0x14 ,0x0A ,0x00 ,0x00 ,0x01,
0xA0 ,0x13 ,0x01 ,0x00 ,0x00 ,0x01,
0x00 ,0x00 ,0x00 ,0x00 ,0x00 ,0x00,
0x00 ,0x00 ,0x00 ,0x00 ,0x00 ,0x00,
0x00 ,0x00 ,0x00 ,0x00 ,0x00 ,0x00,
};
const unsigned char EPD_4IN2_4Gray_lut_bw[] ={
0x40 ,0x0A ,0x00 ,0x00 ,0x00 ,0x01,
0x90 ,0x14 ,0x14 ,0x00 ,0x00 ,0x01,
0x00 ,0x14 ,0x0A ,0x00 ,0x00 ,0x01,
0x99 ,0x0C ,0x01 ,0x03 ,0x04 ,0x01,
0x00 ,0x00 ,0x00 ,0x00 ,0x00 ,0x00,
0x00 ,0x00 ,0x00 ,0x00 ,0x00 ,0x00,
0x00 ,0x00 ,0x00 ,0x00 ,0x00 ,0x00,
};
const unsigned char EPD_4IN2_4Gray_lut_wb[] ={
0x40 ,0x0A ,0x00 ,0x00 ,0x00 ,0x01,
0x90 ,0x14 ,0x14 ,0x00 ,0x00 ,0x01,
0x00 ,0x14 ,0x0A ,0x00 ,0x00 ,0x01,
0x99 ,0x0B ,0x04 ,0x04 ,0x01 ,0x01,
0x00 ,0x00 ,0x00 ,0x00 ,0x00 ,0x00,
0x00 ,0x00 ,0x00 ,0x00 ,0x00 ,0x00,
0x00 ,0x00 ,0x00 ,0x00 ,0x00 ,0x00,
};
const unsigned char EPD_4IN2_4Gray_lut_bb[] ={
0x80 ,0x0A ,0x00 ,0x00 ,0x00 ,0x01,
0x90 ,0x14 ,0x14 ,0x00 ,0x00 ,0x01,
0x20 ,0x14 ,0x0A ,0x00 ,0x00 ,0x01,
0x50 ,0x13 ,0x01 ,0x00 ,0x00 ,0x01,
0x00 ,0x00 ,0x00 ,0x00 ,0x00 ,0x00,
0x00 ,0x00 ,0x00 ,0x00 ,0x00 ,0x00,
0x00 ,0x00 ,0x00 ,0x00 ,0x00 ,0x00,
};
static void EPD_4IN2_4Gray_lut(void)
{
unsigned int count;
EPD_4IN2_SendCommand(0x20); //vcom
for(count=0;count<42;count++)
{EPD_4IN2_SendData(EPD_4IN2_4Gray_lut_vcom[count]);}
EPD_4IN2_SendCommand(0x21); //red not use
for(count=0;count<42;count++)
{EPD_4IN2_SendData(EPD_4IN2_4Gray_lut_ww[count]);}
EPD_4IN2_SendCommand(0x22); //bw r
for(count=0;count<42;count++)
{EPD_4IN2_SendData(EPD_4IN2_4Gray_lut_bw[count]);}
EPD_4IN2_SendCommand(0x23); //wb w
for(count=0;count<42;count++)
{EPD_4IN2_SendData(EPD_4IN2_4Gray_lut_wb[count]);}
EPD_4IN2_SendCommand(0x24); //bb b
for(count=0;count<42;count++)
{EPD_4IN2_SendData(EPD_4IN2_4Gray_lut_bb[count]);}
EPD_4IN2_SendCommand(0x25); //vcom
for(count=0;count<42;count++)
{EPD_4IN2_SendData(EPD_4IN2_4Gray_lut_ww[count]);}
}
static void drawNormal(void)
{
UWORD Width, Height;
Width = (EPD_4IN2_WIDTH % 8 == 0)? (EPD_4IN2_WIDTH / 8 ): (EPD_4IN2_WIDTH / 8 + 1);
Height = EPD_4IN2_HEIGHT;
EPD_4IN2_SendCommand(0x10);
for (UWORD j = 0; j < Height; j++) {
for (UWORD i = 0; i < Width; i++) {
EPD_4IN2_SendData(0xFF);
}
}
EPD_4IN2_SendCommand(0x13);
for (UWORD j = 0; j < Height; j++) {
for (UWORD i = 0; i < Width; i++) {
EPD_4IN2_SendData(((j + 1)*2 > Height) ? 0x00 : 0xFF);
}
}
EPD_4IN2_TurnOnDisplay();
}
static void draw4Gray(void)
{
UWORD Width, Height;
Width = (EPD_4IN2_WIDTH % 8 == 0)? (EPD_4IN2_WIDTH / 8 ): (EPD_4IN2_WIDTH / 8 + 1);
Height = EPD_4IN2_HEIGHT;
EPD_4IN2_SendCommand(0x10);
for (UWORD i = 0; i < Width * Height; i++) {
UWORD idx = (i % 50) / 12;
if (idx > 3) idx = 3;
if (idx == 0 || idx == 1) {
EPD_4IN2_SendData(0x00);
} else if (idx == 2 || idx == 3) {
EPD_4IN2_SendData(0xFF);
}
}
EPD_4IN2_SendCommand(0x13);
for (UWORD i = 0; i < Width * Height; i++) {
UWORD idx = (i % 50) / 12;
if (idx > 3) idx = 3;
if (idx == 0 || idx == 2) {
EPD_4IN2_SendData(0x00);
} else if (idx == 1 || idx == 3) {
EPD_4IN2_SendData(0xFF);
}
}
// Load LUT from register
EPD_4IN2_SendCommand(0x00);
EPD_4IN2_SendData(0x3f);
EPD_4IN2_4Gray_lut();
EPD_4IN2_TurnOnDisplay();
// Load LUT from OTP
EPD_4IN2_SendCommand(0x00);
EPD_4IN2_SendData(0x1f);
}
void EPD_4in2_test(void)
{
DEV_Module_Init();
EPD_4IN2_Init();
EPD_4IN2_Clear();
DEV_Delay_ms(500);
drawNormal();
DEV_Delay_ms(1000);
draw4Gray();
}

BIN
html/images/0.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 402 KiB

After

Width:  |  Height:  |  Size: 278 KiB

17
html/index.html
View File

@@ -18,6 +18,7 @@
#canvas-box { margin-top: 10px; }
button { padding: 0.375rem 0.75rem; border: 1px solid #0d6efd; border-radius: 0.375rem; }
button:disabled { opacity: 0.65; }
button.primary { color: #fff; background-color: #0d6efd; }
button.primary:hover { color: #fff; border-color: #0b5ed7; background-color: #0b5ed7; }
button.secondary { color: #fff; background-color: #6c757d; }
@@ -38,8 +39,8 @@
<legend>蓝牙</legend>
<div style="display: flex; justify-content: space-between;">
<div>
<button id="connectbutton" type="button" class="primary" onclick="preConnect();">连接</button>
<button id="reconnectbutton" type="button" class="secondary" onclick="reConnect();">重连</button>
<button id="connectbutton" type="button" class="primary" onclick="preConnect()">连接</button>
<button id="reconnectbutton" type="button" class="secondary" onclick="reConnect()">重连</button>
</div>
<div>
<label for="epddriver">驱动</label>
@@ -50,7 +51,7 @@
</select>
<label for="epdpins">引脚</label>
<input id="epdpins" type="text" value="">
<button id="setDriverbutton" type="button" class="primary" onclick="setDriver();">确认</button>
<button id="setDriverbutton" type="button" class="primary" onclick="setDriver()">确认</button>
</div>
</div>
</fieldset>
@@ -59,13 +60,13 @@
<legend>传图</legend>
<div style="margin-bottom: 10px; display: flex; justify-content: space-between;">
<div>
<button id="clearcanvasbutton" type="button" class="secondary" onclick="clear_canvas();">清除画布</button>
<button id="sendimgbutton" type="button" class="primary" class="primary" onclick="sendimg();">发送图片</button>
<button id="clearcanvasbutton" type="button" class="secondary" onclick="clear_canvas()">清除画布</button>
<button id="sendimgbutton" type="button" class="primary" onclick="sendimg()">发送图片</button>
</div>
<div>
<button id="clearscreenbutton" type="button" class="secondary" onclick="clearscreen();">清除屏幕</button>
<button id="clearscreenbutton" type="button" class="secondary" onclick="clearscreen()">清除屏幕</button>
<input type="text" id="cmdTXT" value="">
<button id="sendcmdbutton" type="button" class="primary" onclick="sendcmd(document.getElementById(&quot;cmdTXT&quot;).value);">发送命令</button>
<button id="sendcmdbutton" type="button" class="primary" onclick="sendcmd()">发送命令</button>
</div>
</div>
<div style="font-size: 85%; color: #666; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px dotted #AAA;"><b>状态：</b><span id="status"></span></div>
@@ -93,7 +94,7 @@
<label for="threshold">阈值</label>
<input type="number" max="255" min="0" value="125" id="threshold" onchange="update_image()">
</div>
<button type="button" class="secondary" onclick="document.getElementById('log').innerHTML = '';">清空日志</button>
<button type="button" class="secondary" onclick="clearLog()">清空日志</button>
</div>
<div style="display: flex; justify-content: space-between;">
<canvas id="canvas" width="400" height="300" style="border: black solid 1px;"></canvas>

141
html/js/main.js
View File

@@ -6,7 +6,22 @@ let reconnectTrys = 0;
let canvas;
let startTime;
let chunkSize = 38;
const MAX_PACKET_SIZE = 20;
const EpdCmd = {
SET_PINS: 0x00,
INIT: 0x01,
CLEAR: 0x02,
SEND_CMD: 0x03,
SEND_DATA: 0x04,
DISPLAY: 0x05,
SLEEP: 0x06,
SET_CONFIG: 0x90,
SYS_RESET: 0x91,
SYS_SLEEP: 0x92,
CFG_ERASE: 0x99,
};
function resetVariables() {
gattServer = null;
@@ -30,66 +45,78 @@ async function handleError(error) {
}
}
async function sendCommand(cmd) {
if (epdCharacteristic) {
await epdCharacteristic.writeValue(cmd);
} else {
async function write(cmd, data) {
if (!epdCharacteristic) {
addLog("服务不可用，请检查蓝牙连接");
return;
}
let payload = [cmd];
if (data) {
if (typeof data == 'string') data = hex2bytes(data);
if (data instanceof Uint8Array) data = Array.from(data);
payload.push(...data)
};
if (payload.length > MAX_PACKET_SIZE) {
throw new Error("BLE packet too large!");
}
addLog(`<span class="action">⇑</span> ${bytes2hex(payload)}`);
await epdCharacteristic.writeValue(Uint8Array.from(payload));
}
async function sendcmd(cmdTXT) {
addLog(`<span class="action">⇑</span> ${cmdTXT}`);
await sendCommand(hexToBytes(cmdTXT));
}
async function setDriver() {
const driver = document.getElementById("epddriver").value;
const pins = document.getElementById("epdpins").value;
await sendcmd(`00${pins}`);
await sendcmd(`01${driver}`);
}
async function clearscreen() {
if(confirm('确认清除屏幕内容?')) {
await sendcmd("02");
}
}
async function sendCmWithData(cmd, data){
async function epdWrite(cmd, data) {
const chunkSize = MAX_PACKET_SIZE - 1;
const count = Math.round(data.length / chunkSize);
let chunkIdx = 0;
await sendcmd(`03${cmd}`);
if (typeof data == 'string') data = hex2bytes(data);
await write(EpdCmd.SEND_CMD, [cmd]);
for (let i = 0; i < data.length; i += chunkSize) {
let currentTime = (new Date().getTime() - startTime) / 1000.0;
let chunk = data.substring(i, i + chunkSize);
setStatus(`命令：0x${cmd}, 数据块: ${chunkIdx+1}/${count+1}, 总用时: ${currentTime}s`);
await sendcmd(`04${chunk}`);
setStatus(`命令：0x${cmd.toString(16)}, 数据块: ${chunkIdx+1}/${count+1}, 总用时: ${currentTime}s`);
await write(EpdCmd.SEND_DATA, data.slice(i, i + chunkSize));
chunkIdx++;
}
}
async function setDriver() {
await write(EpdCmd.SET_PINS, document.getElementById("epdpins").value);
await write(EpdCmd.INIT, document.getElementById("epddriver").value);
}
async function clearscreen() {
if(confirm('确认清除屏幕内容?')) {
await write(EpdCmd.CLEAR);
}
}
async function sendcmd() {
const cmdTXT = document.getElementById('cmdTXT').value;
if (cmdTXT == '') return;
const bytes = hex2bytes(cmdTXT);
await write(bytes[0], bytes.length > 1 ? bytes.slice(1) : null);
}
async function send4GrayLut() {
await sendCmWithData("20", "000A0000000160141400000100140000000100130A010001000000000000000000000000000000000000"); // vcom
await sendCmWithData("21", "400A0000000190141400000110140A000001A01301000001000000000000000000000000000000000000"); // red not use
await sendCmWithData("22", "400A0000000190141400000100140A000001990C01030401000000000000000000000000000000000000"); // bw r
await sendCmWithData("23", "400A0000000190141400000100140A000001990B04040101000000000000000000000000000000000000"); // wb w
await sendCmWithData("24", "800A0000000190141400000120140A000001501301000001000000000000000000000000000000000000"); // bb b
await sendCmWithData("25", "400A0000000190141400000110140A000001A01301000001000000000000000000000000000000000000"); // vcom
await epdWrite(0x20, "000A0000000160141400000100140000000100130A010001000000000000000000000000000000000000"); // vcom
await epdWrite(0x21, "400A0000000190141400000110140A000001A01301000001000000000000000000000000000000000000"); // red not use
await epdWrite(0x22, "400A0000000190141400000100140A000001990C01030401000000000000000000000000000000000000"); // bw r
await epdWrite(0x23, "400A0000000190141400000100140A000001990B04040101000000000000000000000000000000000000"); // wb w
await epdWrite(0x24, "800A0000000190141400000120140A000001501301000001000000000000000000000000000000000000"); // bb b
await epdWrite(0x25, "400A0000000190141400000110140A000001A01301000001000000000000000000000000000000000000"); // vcom
}
function getImageData(canvas, driver, mode) {
if (mode === '4gray') {
return bytesToHex(canvas2gray(canvas));
return canvas2gray(canvas);
} else {
let data = bytesToHex(canvas2bytes(canvas, 'bw'));
let data = canvas2bytes(canvas, 'bw');
if (driver === '03') {
if (mode.startsWith('bwr')) {
data += bytesToHex(canvas2bytes(canvas, 'red'));
data.push(...canvas2bytes(canvas, 'red'));
} else {
const count = data.length;
data += 'F'.repeat(count);
const data1= 'F'.repeat(data.length);
data.push(...data1);
}
}
return data;
@@ -102,24 +129,22 @@ async function sendimg() {
const driver = document.getElementById("epddriver").value;
const mode = document.getElementById('dithering').value;
const imgArray = getImageData(canvas, driver, mode);
const bwArrLen = (canvas.width/8) * canvas.height * 2;
const bwArrLen = canvas.width * canvas.height / 8;
if (imgArray.length == bwArrLen * 2) {
await sendCmWithData("10", imgArray.slice(0, bwArrLen - 1));
await sendCmWithData("13", imgArray.slice(bwArrLen));
await epdWrite(0x10, imgArray.slice(0, bwArrLen));
await epdWrite(0x13, imgArray.slice(bwArrLen));
} else {
await sendCmWithData(driver === "03" ? "10" : "13", imgArray);
await epdWrite(driver === "03" ? 0x10 : 0x13, imgArray);
}
if (mode === "4gray") {
await sendcmd("0300");
await sendcmd("043F"); // Load LUT from register
await epdWrite(0x00, [0x3F]); // Load LUT from register
await send4GrayLut();
await sendcmd("05");
await sendcmd("0300");
await sendcmd("041F"); // Load LUT from OTP
await write(EpdCmd.DISPLAY);
await epdWrite(0x00, [0x1F]); // Load LUT from OTP
} else {
await sendcmd("05");
await write(EpdCmd.DISPLAY);
}
const sendTime = (new Date().getTime() - startTime) / 1000.0;
@@ -147,7 +172,7 @@ function disconnect() {
async function preConnect() {
if (gattServer != null && gattServer.connected) {
if (bleDevice != null && bleDevice.gatt.connected) {
await sendcmd("06");
await write(EpdCmd.SLEEP);
bleDevice.gatt.disconnect();
}
}
@@ -196,12 +221,12 @@ async function connect() {
await epdCharacteristic.startNotifications();
epdCharacteristic.addEventListener('characteristicvaluechanged', (event) => {
addLog(`<span class="action">⇓</span> ${bytesToHex(event.target.value.buffer)}`);
document.getElementById("epdpins").value = bytesToHex(event.target.value.buffer.slice(0, 7));
document.getElementById("epddriver").value = bytesToHex(event.target.value.buffer.slice(7, 8));
addLog(`<span class="action">⇓</span> ${bytes2hex(event.target.value.buffer)}`);
document.getElementById("epdpins").value = bytes2hex(event.target.value.buffer.slice(0, 7));
document.getElementById("epddriver").value = bytes2hex(event.target.value.buffer.slice(7, 8));
});
await sendcmd("01");
await write(EpdCmd.INIT);
document.getElementById("connectbutton").innerHTML = '断开';
updateButtonStatus();
@@ -227,13 +252,17 @@ function addLog(logTXT) {
}
}
function hexToBytes(hex) {
function clearLog() {
document.getElementById("log").innerHTML = '';
}
function hex2bytes(hex) {
for (var bytes = [], c = 0; c < hex.length; c += 2)
bytes.push(parseInt(hex.substr(c, 2), 16));
return new Uint8Array(bytes);
}
function bytesToHex(data) {
function bytes2hex(data) {
return new Uint8Array(data).reduce(
function (memo, i) {
return memo + ("0" + i.toString(16)).slice(-2);