From 0ede11b6a00dfe708e72cf2f337a2984423f8346 Mon Sep 17 00:00:00 2001 From: thePR0M3TH3AN <53631862+PR0M3TH3AN@users.noreply.github.com> Date: Mon, 29 Jul 2024 19:53:20 -0400 Subject: [PATCH] update --- src/index.html | 148 ++++++++++++++++++++----------- src/reassemble.html | 206 ++++++++++++++++++++++++++++++++++---------- src/splitter.html | 83 ++++++++++++++++-- 3 files changed, 337 insertions(+), 100 deletions(-) diff --git a/src/index.html b/src/index.html index a37f193..23fd5d1 100644 --- a/src/index.html +++ b/src/index.html @@ -8,69 +8,121 @@ body { font-family: Arial, sans-serif; margin: 20px; + background-color: #121212; /* Dark mode background */ + color: #ffffff; /* Dark mode text color */ } - h1, h2 { - color: #333; + h1 { + color: #ffffff; } - p { - line-height: 1.6; + textarea { + width: 100%; + height: 100px; + margin-bottom: 10px; + white-space: pre-wrap; /* Ensure text wraps */ + word-wrap: break-word; /* Break long words */ + background-color: #2c2c2c; /* Dark mode textarea background */ + color: #ffffff; /* Dark mode textarea text color */ + border: 1px solid #444; /* Dark mode textarea border */ } - .section { - margin-bottom: 20px; - } - .section p { - margin: 0 0 10px; - } - .link-btn { - display: inline-block; - margin: 5px 0; - padding: 10px 15px; + button { + padding: 10px 20px; font-size: 16px; color: white; background-color: #007bff; - text-decoration: none; + border: none; border-radius: 5px; + cursor: pointer; + margin-right: 10px; } - .link-btn:hover { + button:hover { background-color: #0056b3; } + #messageFields { + margin-top: 10px; + } + .message-field { + margin-bottom: 10px; + } + #output { + white-space: pre-wrap; /* Ensure text wraps */ + word-wrap: break-word; /* Break long words */ + background: #2c2c2c; /* Dark mode output background */ + color: #ffffff; /* Dark mode output text color */ + padding: 10px; + border-radius: 5px; + margin-top: 10px; + border: 1px solid #444; /* Dark mode output border */ + } + .error { + color: #ff6b6b; /* Dark mode error color */ + } + #hashResult { + margin-top: 10px; + padding: 10px; + background: #e9ecef; + border-radius: 5px; + color: #000000; /* Light mode text color for hash result */ + } + nav { + background-color: #333; /* Dark mode nav background */ + color: #ffffff; /* Dark mode nav text color */ + padding: 10px; + border-radius: 5px; + margin-bottom: 20px; + } + nav a { + color: #ffffff; /* Dark mode nav link color */ + text-decoration: none; + margin-right: 10px; + } + nav a:hover { + text-decoration: underline; + } -

eCash Text Splitter & Reassembler

- -
-

How to Use the eCash Text Splitter

-

This tool helps you split a large eCash payment text into smaller, manageable parts that can be sent over Meshtastic. Each part will include a prefix indicating its sequence and a hash for integrity verification.

-

To use the text splitter:

-
    -
  1. Go to the eCash Text Splitter Tool.
    2. -
  2. Paste your eCash payment text into the text area.
    3. -
  3. Click the "Split Text" button. The text will be divided into chunks of up to 150 characters.
    4. -
  4. Each chunk will include a prefix with its sequence number and, for the first chunk, a hash of the entire text.
    5. -
  5. Copy each chunk and send them as separate messages.
    6. -
-
+ -
-

How to Reassemble the eCash Payment

-

To reassemble the split eCash payment text and verify its integrity:

-
    -
  1. Go to the eCash Text Reassembler Tool.
    2. -
  2. Paste all received message chunks into the provided text area.
    3. -
  3. The tool will automatically reorder the messages, combine them, and check the hash for integrity verification.
    4. -
  4. If the hash matches, you will get the original text back. If not, verify the chunks for completeness and correct order.
    5. -
-
+
+
+

eCash Text Splitter & Reassembler

+
+ +
+

How to Use the eCash Text Splitter

+

This tool helps you split a large eCash payment text into smaller, manageable parts that can be sent over Meshtastic. Each part will include a prefix indicating its sequence and a hash for integrity verification.

+

To use the text splitter:

+
    +
  1. Go to the eCash Text Splitter Tool.
    2. +
  2. Paste your eCash payment text into the text area.
    3. +
  3. Click the "Split Text" button. The text will be divided into chunks of up to 150 characters.
    4. +
  4. Each chunk will include a prefix with its sequence number and, for the first chunk, a hash of the entire text.
    5. +
  5. Copy each chunk and send them as separate messages.
    6. +
+
-
-

Links

-

Access the tools and repository below:

- +
+

How to Reassemble the eCash Payment

+

To reassemble the split eCash payment text and verify its integrity:

+
    +
  1. Go to the eCash Text Reassembler Tool.
    2. +
  2. Paste all received message chunks into the provided text area.
    3. +
  3. The tool will automatically reorder the messages, combine them, and check the hash for integrity verification.
    4. +
  4. If the hash matches, you will get the original text back. If not, verify the chunks for completeness and correct order.
    5. +
+
+ +
+

Links

+

Access the repository below:

+ +
diff --git a/src/reassemble.html b/src/reassemble.html index 03927ea..1dbb9d0 100644 --- a/src/reassemble.html +++ b/src/reassemble.html @@ -8,14 +8,21 @@ body { font-family: Arial, sans-serif; margin: 20px; + background-color: #121212; /* Dark mode background */ + color: #ffffff; /* Dark mode text color */ } h1 { - color: #333; + color: #ffffff; } textarea { width: 100%; - height: 150px; + height: 100px; margin-bottom: 10px; + white-space: pre-wrap; /* Ensure text wraps */ + word-wrap: break-word; /* Break long words */ + background-color: #2c2c2c; /* Dark mode textarea background */ + color: #ffffff; /* Dark mode textarea text color */ + border: 1px solid #444; /* Dark mode textarea border */ } button { padding: 10px 20px; @@ -25,77 +32,186 @@ border: none; border-radius: 5px; cursor: pointer; + margin-right: 10px; } button:hover { background-color: #0056b3; } - pre { - white-space: pre-wrap; /* Allows text to wrap and maintains formatting */ - background: #f4f4f4; + #messageFields { + margin-top: 10px; + } + .message-field { + margin-bottom: 10px; + } + #output { + white-space: pre-wrap; /* Ensure text wraps */ + word-wrap: break-word; /* Break long words */ + background: #2c2c2c; /* Dark mode output background */ + color: #ffffff; /* Dark mode output text color */ padding: 10px; border-radius: 5px; - overflow: auto; + margin-top: 10px; + border: 1px solid #444; /* Dark mode output border */ } .error { - color: red; + color: #ff6b6b; /* Dark mode error color */ + } + #hashResult { + margin-top: 10px; + padding: 10px; + background: #e9ecef; + border-radius: 5px; + color: #000000; /* Light mode text color for hash result */ + } + nav { + background-color: #333; /* Dark mode nav background */ + color: #ffffff; /* Dark mode nav text color */ + padding: 10px; + border-radius: 5px; + margin-bottom: 20px; + } + nav a { + color: #ffffff; /* Dark mode nav link color */ + text-decoration: none; + margin-right: 10px; + } + nav a:hover { + text-decoration: underline; } + +

eCash Text Reassembler

- + + + +
+ +

Reassembled Text

- 

-    

+    

+
+    

     
     
 
diff --git a/src/splitter.html b/src/splitter.html
index 0ce57c5..b6341a2 100644
--- a/src/splitter.html
+++ b/src/splitter.html
@@ -8,14 +8,21 @@
         body {
             font-family: Arial, sans-serif;
             margin: 20px;
+            background-color: #121212; /* Dark mode background */
+            color: #ffffff; /* Dark mode text color */
         }
         h1 {
-            color: #333;
+            color: #ffffff;
         }
         textarea {
             width: 100%;
             height: 150px;
             margin-bottom: 10px;
+            white-space: pre-wrap; /* Ensure text wraps */
+            word-wrap: break-word; /* Break long words */
+            background-color: #2c2c2c; /* Dark mode textarea background */
+            color: #ffffff; /* Dark mode textarea text color */
+            border: 1px solid #444; /* Dark mode textarea border */
         }
         button {
             padding: 10px 20px;
@@ -25,27 +32,68 @@
             border: none;
             border-radius: 5px;
             cursor: pointer;
+            margin-right: 10px;
         }
         button:hover {
             background-color: #0056b3;
         }
+        .chunk-container {
+            margin-bottom: 20px;
+        }
         pre {
-            white-space: pre-wrap; /* Allows text to wrap and maintains formatting */
-            background: #f4f4f4;
+            white-space: pre-wrap; /* Ensure text wraps */
+            word-wrap: break-word; /* Break long words */
+            background: #2c2c2c; /* Dark mode pre background */
+            color: #ffffff; /* Dark mode pre text color */
             padding: 10px;
             border-radius: 5px;
+            border: 1px solid #444; /* Dark mode pre border */
             overflow: auto;
         }
+        .copy-btn {
+            display: block;
+            margin-top: 5px;
+            background-color: #28a745;
+            border: none;
+            border-radius: 5px;
+            color: white;
+            cursor: pointer;
+            padding: 10px 20px;
+        }
+        .copy-btn:hover {
+            background-color: #218838;
+        }
+        nav {
+            background-color: #333; /* Dark mode nav background */
+            color: #ffffff; /* Dark mode nav text color */
+            padding: 10px;
+            border-radius: 5px;
+            margin-bottom: 20px;
+        }
+        nav a {
+            color: #ffffff; /* Dark mode nav link color */
+            text-decoration: none;
+            margin-right: 10px;
+        }
+        nav a:hover {
+            text-decoration: underline;
+        }
     
 
 
+    
+
     
eCash Text Splitter

     
     
     
     
     
Output Chunks

-    

+