🧠 ENCODER-AND-DECODER

The BigInt + TOTP Encoder and Decoder is a web-based tool built in HTML and JavaScript that allows users to securely encode and decode text and images using encryption based on large integers (BigInt) and time-based authentication (TOTP – Time-Based One-Time Password).

🧩 General Functioning

The system has four main sections:

🔤 Text Encoder

Transforms plain text into an encrypted number (mixedBigInt in hexadecimal) and generates a secret key (TOTP Secret in base32).

🔍 Text Decoder

Reconstructs the original text using the mixedBigInt, the TOTP Secret, and a one-time code generated by an authenticator app (for example, Google Authenticator).

🖼️ Image Encoder

Compresses and encodes images automatically into approximately 30 pages (~90KB) of hexadecimal text.
It supports multiple formats: JPG, PNG, GIF, BMP, WEBP, SVG, TIFF, AVIF, and others.
All images are converted to JPEG during the compression process.

🧾 Image Decoder

Reconstructs the original image using the mixedBigInt, the TOTP Secret, and a valid TOTP code.

🔒 Main Technical Steps

1. The text or image (as base64) is converted into bytes, and then into a very large integer (BigInt).

2. A random secret (20 bytes) is generated and converted into Base32, forming the TOTP Secret.

3. From this secret, the system derives a unique prime number used to mix with the original value — producing the mixedBigInt (encoded data).

4. For images: automatic compression resizes the image to a maximum of 1200px and adjusts JPEG quality dynamically to reach ~90KB, ensuring about 30 pages of hexadecimal text.

5. To decode, the user must provide the mixedBigInt, the TOTP Secret, and a valid TOTP code (which refreshes every 30 seconds).

6. The system validates the TOTP code and, if correct, divides the mixedBigInt by the derived prime to recover the original text or image.

⚙️ Main Technologies Used

• Modern JavaScript (ES6+)

• Web Crypto API — used for generating HMAC-SHA1 and SHA-256

• BigInt — used for operations with extremely large numbers

• Base32 — ensures compatibility with authenticator apps

• Canvas API — handles image compression and format conversion

🖼️ Image Compression Details

💡 Purpose

The goal of this project is to protect textual data and images without transmitting or storing the original secret.
It combines mathematical encoding and two-factor authentication (2FA), ensuring that only users who possess both the TOTP Secret and a valid authentication code can decrypt the content.

🔐 Encode text and image, and then decode using the website below:

👉 https://k10.netlify.app/projetos/text&image
👉 https://github.com/andradepsa/ENCODER-AND-DECODER

🧩 STEPS

1. Enter the mixedBigInt (hex) value into the decoder on the website.

2. Enter the TOTP Secret (base32) and input the required characters.

3. Register the TOTP Secret (base32) in your Authenticator app to generate verification codes.

✅ Additions and Enhancements

• Added image encoding to the system.

• Included details about supported image formats (JPG, PNG, GIF, BMP, WEBP, SVG, TIFF, AVIF).

• Explained automatic compression to around 30 pages of hexadecimal data.

• Noted that all images are converted to JPEG during compression.

• Added technical information about the Canvas API.

• Compared file size reduction (321KB → 90KB).