clean

.hta_slug/base64-to-image-converter.php

@@ -0,0 +1,52 @@
+<section class="diZContainer diZmxAuto">
+    <h2 class="diZBorderBottom">Convert Base64 to Image</h2>
+    <div class="diZMaxW500 diZmxAuto diZFlexColumn toolsSection diZmy20">
+        <textarea rows="10" class="base64-textarea" placeholder="Enter base64 encoded image data"></textarea>
+        <p class="diZDisplayNone diZDengerText" id="no-select-message"></p>
+        <button class="convert-button diZmt2"><span>Convert to Image</span></button>
+        <div class="" id="preview"></div>
+
+        <div class="diZFlexColumn diZDisplayNone diZJustifyCenter" id="download-options" >
+        <p>Choose Image Format & Download:</p>
+        <div class="diZFlexRow">
+            <button class="format-button" data-format="png"><span>PNG</span></button>
+            <button class="format-button" data-format="jpeg"><span>JPEG</span></button>
+            <button class="format-button" data-format="webp"><span>WebP</span></button>
+        </div>
+    </div>
+    </div>
+</section>
+<script>
+    document.querySelector('.convert-button').addEventListener('click', function() {
+        var base64Data = document.querySelector('.base64-textarea').value.trim();
+        if (base64Data !== '') {
+            var img = document.createElement('img');
+            img.src = base64Data;
+            img.style.maxWidth = '100%';
+            img.style.height = 'auto';
+            document.getElementById('preview').innerHTML = '';
+            document.getElementById('preview').appendChild(img);
+            document.getElementById('download-options').style.display = 'block';
+        } else {
+            document.getElementById('no-select-message').innerHTML = 'Please enter base64 encoded image data.';
+            document.getElementById('no-select-message').style.display = 'block';
+        }
+    });
+
+    // Add event listeners to format buttons
+    var formatButtons = document.querySelectorAll('.format-button');
+    formatButtons.forEach(function(button) {
+        button.addEventListener('click', function() {
+            var imageFormat = this.getAttribute('data-format');
+            downloadImage(imageFormat);
+        });
+    });
+
+    function downloadImage(imageFormat) {
+        var base64Data = document.querySelector('.base64-textarea').value.trim();
+        var downloadLink = document.createElement('a');
+        downloadLink.href = base64Data;
+        downloadLink.download = 'image.' + imageFormat;
+        downloadLink.click();
+    }
+</script>