Update text-to-cards.html

This commit is contained in:
2025-08-01 10:00:36 +08:00
committed by GitHub
parent 4eaece56b8
commit 029449a31e

View File

@@ -92,9 +92,9 @@
<div class="section"> <div class="section">
<h2>編碼:文字 → 撲克牌</h2> <h2>編碼:文字 → 撲克牌</h2>
<label for="textInput">輸入文字最多14字</label> <label for="textInput">輸入文字最多14字</label>
<input type="text" id="textInput" placeholder="請輸入要編碼的文字..." maxlength="14"> <input type="text" id="textInput" placeholder="請輸入要編碼的文字..." maxlength="14">
<div class="char-count" id="charCount">0 / 14 字</div> <div class="char-count" id="charCount">0 / 14 字</div>
<label style="margin-top: 15px;">撲克牌排列T=10、s=黑桃、h=紅心、d=方塊、c=梅花):</label> <label style="margin-top: 15px;">撲克牌排列T=10、s=黑桃、h=紅心、d=方塊、c=梅花):</label>
<div class="cards-display" id="cardsOutput">等待輸入文字...</div> <div class="cards-display" id="cardsOutput">等待輸入文字...</div>
@@ -259,8 +259,8 @@
/** /**
* 將文字轉換為撲克牌排列 * 將文字轉換為撲克牌排列
* 新版本直接編碼14個字不足的用null字填充 * 新版本直接編碼14個字不足的用null字填充
* 步驟:文字 → 填充到14字 → 數字編碼 → 排列 → 撲克牌順序 * 步驟:文字 → 填充到14字 → 數字編碼 → 排列 → 撲克牌順序
* *
* @param {string} text - 要編碼的文字 * @param {string} text - 要編碼的文字
* @returns {Array} 對應的撲克牌索引排列 * @returns {Array} 對應的撲克牌索引排列
@@ -268,16 +268,16 @@
function textToCards(text) { function textToCards(text) {
// 檢查文字長度是否超出限制 // 檢查文字長度是否超出限制
if (text.length > 14) { if (text.length > 14) {
throw new Error('文字長度不能超過 14 個字'); throw new Error('文字長度不能超過 14 個字');
} }
// 將文字填充到14個字不足的用null字(\u0000)填充 // 將文字填充到14個字不足的用null字(\u0000)填充
let paddedText = text.padEnd(14, '\u0000'); let paddedText = text.padEnd(14, '\u0000');
// 將填充後的文字轉換為一個大數字 // 將填充後的文字轉換為一個大數字
let bigNumber = 0n; let bigNumber = 0n;
// 將每個字的Unicode編碼拼接到數字中每個字佔16位 // 將每個字的Unicode編碼拼接到數字中每個字佔16位
for (let i = 0; i < 14; i++) { for (let i = 0; i < 14; i++) {
let charCode = paddedText.charCodeAt(i); let charCode = paddedText.charCodeAt(i);
bigNumber = bigNumber * (2n ** 16n) + BigInt(charCode); bigNumber = bigNumber * (2n ** 16n) + BigInt(charCode);
@@ -289,8 +289,8 @@
/** /**
* 將撲克牌排列轉換回文字 * 將撲克牌排列轉換回文字
* 新版本解碼14個字遇到第一個null字就停止 * 新版本解碼14個字遇到第一個null字就停止
* 步驟:撲克牌順序 → 排列 → 數字解碼 → 14字字串 → 去除null填充 * 步驟:撲克牌順序 → 排列 → 數字解碼 → 14字字串 → 去除null填充
* *
* @param {Array} cardOrder - 撲克牌索引排列 * @param {Array} cardOrder - 撲克牌索引排列
* @returns {string} 解碼出的文字 * @returns {string} 解碼出的文字
@@ -310,23 +310,23 @@
// 將排列轉換回數字 // 將排列轉換回數字
let bigNumber = convertFromPermutation(cardOrder); let bigNumber = convertFromPermutation(cardOrder);
// 逐個字解碼從低位開始總共14個字 // 逐個字解碼從低位開始總共14個字
let chars = []; let chars = [];
for (let i = 0; i < 14; i++) { for (let i = 0; i < 14; i++) {
let charCode = Number(bigNumber % (2n ** 16n)); // 取低16位 let charCode = Number(bigNumber % (2n ** 16n)); // 取低16位
chars.unshift(String.fromCharCode(charCode)); // 插入到數組開頭 chars.unshift(String.fromCharCode(charCode)); // 插入到數組開頭
bigNumber = bigNumber >> 16n; // 右移16位處理下一個字 bigNumber = bigNumber >> 16n; // 右移16位處理下一個字
} }
// 將字數組合併成字串 // 將字數組合併成字串
let fullText = chars.join(''); let fullText = chars.join('');
// 找到第一個null字的位置,如果沒有則返回完整字串 // 找到第一個null字的位置,如果沒有則返回完整字串
let nullIndex = fullText.indexOf('\u0000'); let nullIndex = fullText.indexOf('\u0000');
if (nullIndex === -1) { if (nullIndex === -1) {
return fullText; // 沒有null字返回完整的14字 return fullText; // 沒有null字返回完整的14字
} else { } else {
return fullText.substring(0, nullIndex); // 在第一個null字處截斷 return fullText.substring(0, nullIndex); // 在第一個null字處截斷
} }
} }
@@ -356,9 +356,9 @@
throw new Error(`無效的撲克牌格式: "${cardName}"`); throw new Error(`無效的撲克牌格式: "${cardName}"`);
} }
// 提取花色(最後一個字 // 提取花色(最後一個字
let suit = cardName.slice(-1).toLowerCase(); let suit = cardName.slice(-1).toLowerCase();
// 提取點數(除了最後一個字 // 提取點數(除了最後一個字
let rank = cardName.slice(0, -1); let rank = cardName.slice(0, -1);
// 標準化點數表示法 // 標準化點數表示法
@@ -490,8 +490,8 @@
const charCountEl = document.getElementById('charCount'); const charCountEl = document.getElementById('charCount');
const cardsOutputEl = document.getElementById('cardsOutput'); const cardsOutputEl = document.getElementById('cardsOutput');
// 更新字計數顯示 // 更新字計數顯示
charCountEl.textContent = `${text.length} / 14 字`; charCountEl.textContent = `${text.length} / 14 字`;
// 如果沒有輸入文字,顯示等待訊息 // 如果沒有輸入文字,顯示等待訊息
if (text.length === 0) { if (text.length === 0) {
@@ -507,7 +507,7 @@
const cardString = indicesToCardString(cardOrder); const cardString = indicesToCardString(cardOrder);
// 格式化顯示 // 格式化顯示
cardsOutputEl.textContent = formatCardsForDisplay(cardString); cardsOutputEl.textContent = formatCardsForDisplay(cardString);
showMessage(`成功編碼 "${text}" (${text.length})`, 'success'); showMessage(`成功編碼 "${text}" (${text.length})`, 'success');
} catch (error) { } catch (error) {
// 處理編碼錯誤 // 處理編碼錯誤
cardsOutputEl.textContent = '編碼失敗'; cardsOutputEl.textContent = '編碼失敗';
@@ -532,7 +532,7 @@
const decodedText = cardStringToText(cardString); const decodedText = cardStringToText(cardString);
// 顯示解碼結果(如果是空字串則顯示特殊標記) // 顯示解碼結果(如果是空字串則顯示特殊標記)
textOutputEl.textContent = decodedText || '(空字串)'; textOutputEl.textContent = decodedText || '(空字串)';
showMessage(`成功解碼: "${decodedText}" (${decodedText.length})`, 'success'); showMessage(`成功解碼: "${decodedText}" (${decodedText.length})`, 'success');
} catch (error) { } catch (error) {
// 處理解碼錯誤 // 處理解碼錯誤
textOutputEl.textContent = '解碼失敗'; textOutputEl.textContent = '解碼失敗';