byun/esp32s3_canlogger_mcp2515
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Upload files to "/"

Browse Source
This commit is contained in:
byun
2025-11-29 16:08:30 +00:00
parent 73000e77f1
commit 4b3b2702ca
1 changed files with 73 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
index.h
View File

@@ -590,6 +590,45 @@ const char index_html[] PROGMEM = R"rawliteral(
flex: 1; flex: 1;
} }
} }
/* 파일 형식 선택 라디오 버튼 스타일 */
.format-selector {
display: flex;
align-items: center;
gap: 15px;
background: white;
padding: 8px 15px;
border-radius: 8px;
border: 2px solid #667eea;
}
.format-selector label {
display: flex;
align-items: center;
gap: 5px;
cursor: pointer;
font-weight: 600;
color: #2c3e50;
font-size: 0.9em;
transition: all 0.3s;
}
.format-selector label:hover {
color: #667eea;
}
.format-selector input[type="radio"] {
width: 18px;
height: 18px;
cursor: pointer;
accent-color: #667eea;
}
.format-info {
font-size: 0.75em;
color: #7f8c8d;
margin-left: 3px;
}
</style> </style>
</head> </head>
<body> <body>
@@ -710,6 +749,22 @@ const char index_html[] PROGMEM = R"rawliteral(
<button onclick="setMcpMode()">Apply</button> <button onclick="setMcpMode()">Apply</button>
<span id="mode-status" style="color: #11998e; font-size: 0.85em; font-weight: 600;"></span> <span id="mode-status" style="color: #11998e; font-size: 0.85em; font-weight: 600;"></span>
</div> </div>
<!-- CAN 로깅 형식 선택 -->
<div class="control-row">
<label style="font-weight: 600; color: #333;">📁 File Format:</label>
<div class="format-selector">
<label>
<input type="radio" name="can-format" value="bin" checked>
<span>📦 BIN</span>
<span class="format-info">(Binary - Fast, Small)</span>
</label>
<label>
<input type="radio" name="can-format" value="csv">
<span>📄 CSV</span>
<span class="format-info">(Text - Excel Ready)</span>
</label>
</div>
</div>
<div class="control-row"> <div class="control-row">
<button onclick="startLogging()" style="background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);">Start Logging</button> <button onclick="startLogging()" style="background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);">Start Logging</button>
<button onclick="stopLogging()" style="background: linear-gradient(135deg, #eb3349 0%, #f45c43 100%);">Stop Logging</button> <button onclick="stopLogging()" style="background: linear-gradient(135deg, #eb3349 0%, #f45c43 100%);">Stop Logging</button>
@@ -1207,16 +1262,31 @@ const char index_html[] PROGMEM = R"rawliteral(
console.log('MCP2515 mode set to:', modeName); console.log('MCP2515 mode set to:', modeName);
} }
function startLogging() { function startLogging() {
if (ws && ws.readyState === WebSocket.OPEN) { if (ws && ws.readyState === WebSocket.OPEN) {
ws.send(JSON.stringify({cmd: 'startLogging'})); // 선택된 형식 가져오기
console.log('Start logging command sent'); let canFormat = 'bin'; // 기본값
const formatRadios = document.getElementsByName('can-format');
for (const radio of formatRadios) {
if (radio.checked) {
canFormat = radio.value;
break;
}
}
// 로깅 시작 명령 전송
ws.send(JSON.stringify({
cmd: 'startLogging',
format: canFormat
}));
console.log('Start logging: format=' + canFormat);
setTimeout(() => { setTimeout(() => {
refreshFiles(); refreshFiles();
}, 1000); }, 1000);
} }
} }
function stopLogging() { function stopLogging() {
if (ws && ws.readyState === WebSocket.OPEN) { if (ws && ws.readyState === WebSocket.OPEN) {
ws.send(JSON.stringify({cmd: 'stopLogging'})); ws.send(JSON.stringify({cmd: 'stopLogging'}));