Tools/LNChannelIDDecoder/index.html at main · sorukumar/Tools · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Lightning Channel ID Decoder - Bitcoin Data Labs</title>

    <!-- Bitcoin Data Labs base styles -->
    <link rel="stylesheet" href="https://sorukumar.github.io/Bitcoin-Data-Labs/styles/styles.css">
    <!-- Font Awesome -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
    <!-- Shared tool styles -->
    <link rel="stylesheet" href="../shared-tool-styles.css">
</head>
<body>
    <!-- Bitcoin Data Labs Header -->
    <div id="header"></div>

    <div class="tool-content">
        <div class="tool-header">
            <h1>Lightning Channel ID Decoder</h1>
            <p>Convert Lightning Network short channel IDs into their block, transaction, and output components</p>
        </div>

        <div class="instructions-box">
            <p>The Lightning Network uses short channel IDs as unique identifiers for payment channels. Enter a channel ID below to decode it into:</p>
            <ul>
                <li><strong>Block:</strong> The block height where the funding transaction was confirmed</li>
                <li><strong>Transaction:</strong> The transaction index within that block</li>
                <li><strong>Output:</strong> The output index of the funding transaction</li>
            </ul>
            <p>Example: <a href="https://mempool.space/lightning/channel/880174451395198976" target="_blank">880174451395198976</a> → (800514 x 3017 x 0)</p>
        </div>

        <div class="content-section">
            <label for="channelId">Enter Channel ID (Decimal):</label>
            <input type="text" id="channelId" placeholder="e.g., 880174451395198976">
            <button onclick="convertChannelId()">Convert</button>

            <div id="result" style="display:none; margin-top: 1.5rem; padding: 1rem; background: var(--bg-secondary); border-radius: 6px; border-left: 4px solid var(--primary);"></div>
        </div>
    </div>

    <!-- Bitcoin Data Labs Footer -->
    <div id="footer"></div>

    <!-- Bitcoin Data Labs App Components -->
    <script src="https://sorukumar.github.io/Bitcoin-Data-Labs/components/app-components.js"></script>
    <script>
        BitcoinLabsAppComponents.init({
            isApp: true,
            appName: 'Lightning Channel ID Decoder',
            appHomeUrl: window.location.href
        });
    </script>

    <script>
        function extractBlockTxOutput(idValue) {
            const block = idValue >> 40n;
            const tx = (idValue >> 16n) & 0xFFFFFFn;
            const output = idValue & 0xFFFFn;
            return { block, tx, output };
        }

        function convertChannelId() {
            const input = document.getElementById('channelId').value.trim();

            if (!/^\d+$/.test(input)) {
                alert("Please enter a valid decimal channel ID.");
                return;
            }

            const idValue = BigInt(input);
            const { block, tx, output } = extractBlockTxOutput(idValue);
            const resultDiv = document.getElementById('result');
            resultDiv.style.display = 'block';
            resultDiv.innerHTML = `
                <h3 style="margin-top: 0; color: var(--secondary);">Results:</h3>
                <p><strong>Block:</strong> ${block}</p>
                <p><strong>Transaction:</strong> ${tx}</p>
                <p><strong>Output:</strong> ${output}</p>
                <p style="margin-bottom: 0;"><strong>Format:</strong> ${block} x ${tx} x ${output}</p>
            `;
        }
    </script>
</body>
</html>