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

pcap 추가

Browse Source
This commit is contained in:
byun
2026-03-05 21:32:58 +00:00
parent ebc60e9a27
commit 8a6c283f34
2 changed files with 1588 additions and 2939 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4345
ESP32_CAN_Logger-a.ino
View File

File diff suppressed because it is too large Load Diff

36
index.h
View File

@@ -654,11 +654,13 @@ const char index_html[] PROGMEM = R"rawliteral(
.format-selector { .format-selector {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 15px; flex-wrap: wrap;
gap: 8px 15px;
background: white; background: white;
padding: 8px 15px; padding: 8px 15px;
border-radius: 8px; border-radius: 8px;
border: 2px solid #667eea; border: 2px solid #667eea;
width: 100%;
} }
.format-selector label { .format-selector label {
@@ -670,6 +672,7 @@ const char index_html[] PROGMEM = R"rawliteral(
color: #2c3e50; color: #2c3e50;
font-size: 0.9em; font-size: 0.9em;
transition: all 0.3s; transition: all 0.3s;
white-space: nowrap;
} }
.format-selector label:hover { .format-selector label:hover {
@@ -689,6 +692,26 @@ const char index_html[] PROGMEM = R"rawliteral(
margin-left: 3px; margin-left: 3px;
} }
@media (max-width: 480px) {
.format-selector {
flex-direction: column;
align-items: flex-start;
gap: 10px;
padding: 10px 12px;
}
.format-selector label {
font-size: 1em;
gap: 8px;
}
.format-selector input[type="radio"] {
width: 20px;
height: 20px;
}
.format-info {
font-size: 0.8em;
}
}
/* ========== 반응형 디자인 ========== */ /* ========== 반응형 디자인 ========== */
@media (max-width: 768px) { @media (max-width: 768px) {
body { body {
@@ -1048,6 +1071,11 @@ const char index_html[] PROGMEM = R"rawliteral(
<span>📄 CSV</span> <span>📄 CSV</span>
<span class="format-info">(Text - Excel Ready)</span> <span class="format-info">(Text - Excel Ready)</span>
</label> </label>
<label>
<input type="radio" name="can-format" value="pcap">
<span>🦈 PCAP</span>
<span class="format-info">(Wireshark)</span>
</label>
</div> </div>
<button onclick="saveFileFormat()">💾 Save</button> <button onclick="saveFileFormat()">💾 Save</button>
<span id="format-save-status" style="color: #11998e; font-size: 0.85em; font-weight: 600;"></span> <span id="format-save-status" style="color: #11998e; font-size: 0.85em; font-weight: 600;"></span>
@@ -1081,6 +1109,7 @@ const char index_html[] PROGMEM = R"rawliteral(
<select id="autoTriggerFormat" style="width: 100%; padding: 8px; border-radius: 5px; border: 1px solid #444; background: #2a2a2a; color: white;"> <select id="autoTriggerFormat" style="width: 100%; padding: 8px; border-radius: 5px; border: 1px solid #444; background: #2a2a2a; color: white;">
<option value="bin">📦 Binary (BIN) - High Speed</option> <option value="bin">📦 Binary (BIN) - High Speed</option>
<option value="csv">📄 CSV - Human Readable</option> <option value="csv">📄 CSV - Human Readable</option>
<option value="pcap">🦈 PCAP - Wireshark</option>
</select> </select>
</div> </div>
@@ -1398,7 +1427,7 @@ const char index_html[] PROGMEM = R"rawliteral(
// 🆕 로그 형식 설정 // 🆕 로그 형식 설정
if (data.logFormat) { if (data.logFormat) {
document.getElementById('autoTriggerFormat').value = data.logFormat; document.getElementById('autoTriggerFormat').value = data.logFormat; // bin/csv/pcap 모두 처리
} }
// 🎯 수식 불러오기 // 🎯 수식 불러오기
@@ -1437,7 +1466,8 @@ const char index_html[] PROGMEM = R"rawliteral(
console.log('✅ CAN Format saved:', data.format); console.log('✅ CAN Format saved:', data.format);
const statusSpan = document.getElementById('format-save-status'); const statusSpan = document.getElementById('format-save-status');
if (statusSpan) { if (statusSpan) {
statusSpan.textContent = '✓ Saved: ' + data.format.toUpperCase(); const labelMap = { bin: '📦 BIN', csv: '📄 CSV', pcap: '🦈 PCAP' };
statusSpan.textContent = '✓ Saved: ' + (labelMap[data.format] || data.format.toUpperCase());
setTimeout(() => { statusSpan.textContent = ''; }, 3000); setTimeout(() => { statusSpan.textContent = ''; }, 3000);
} }
} }