diff --git a/js/ascii-art-css.txt b/js/ascii-art-css.txt new file mode 100644 index 0000000..85f3d6b --- /dev/null +++ b/js/ascii-art-css.txt @@ -0,0 +1,26 @@ +.ascii-output { + background-color: #1a1a1a; + border: 1px solid #00fff2; + border-radius: 5px; + padding: 1rem; + margin-top: 1rem; + font-family: monospace; + white-space: pre; + overflow-x: auto; +} + +#ascii-output { + color: #00fff2; + font-size: 0.8rem; + line-height: 1; +} + +#text-input { + width: 100%; + background-color: #1f2937; + border: 1px solid #374151; + color: #fff; + padding: 0.5rem; + border-radius: 5px; + resize: vertical; +} diff --git a/js/ascii-art-html.html b/js/ascii-art-html.html new file mode 100644 index 0000000..d1afd69 --- /dev/null +++ b/js/ascii-art-html.html @@ -0,0 +1,35 @@ + + + + + + ASCII Art Converter - Digital Services Hub + + + + +
+

ASCII Art Converter

+ + + +
+
+ + +
+ + + +
+ 

+            

+
+            
Enter your text and click 'Convert to ASCII Art' to see the result.

+        

+    

+
+    
+    
+
+
diff --git a/js/ascii-art-js.txt b/js/ascii-art-js.txt
new file mode 100644
index 0000000..6ea39fa
--- /dev/null
+++ b/js/ascii-art-js.txt
@@ -0,0 +1,19 @@
+const textInput = document.getElementById('text-input');
+const convertButton = document.getElementById('convert-button');
+const asciiOutput = document.getElementById('ascii-output');
+
+const asciiChars = ['@', '#', 'S', '%', '?', '*', '+', ';', ':', ',', '.'];
+
+function textToAscii(text) {
+    return text.split('\n').map(line => 
+        line.split('').map(char => 
+            asciiChars[Math.floor(Math.random() * asciiChars.length)]
+        ).join('')
+    ).join('\n');
+}
+
+convertButton.addEventListener('click', () => {
+    const inputText = textInput.value;
+    const asciiArt = textToAscii(inputText);
+    asciiOutput.textContent = asciiArt;
+});
diff --git a/js/qr-generator-html.html b/js/qr-generator-html.html
new file mode 100644
index 0000000..60e44f0
--- /dev/null
+++ b/js/qr-generator-html.html
@@ -0,0 +1,36 @@
+
+
+
+    
+    
+    QR Code Generator - Digital Services Hub
+    
+    
+    
+
+
+    

+        
QR Code Generator

+        
+        
+
+        

+            

+                
+                
+            

+            
+            
+
+            

+
+            
+
+            
Enter text or a URL and click 'Generate QR Code' to create your QR code.

+        

+    

+
+    
+    
+
+
diff --git a/js/qr-generator-js.txt b/js/qr-generator-js.txt
new file mode 100644
index 0000000..9d9c177
--- /dev/null
+++ b/js/qr-generator-js.txt
@@ -0,0 +1,33 @@
+const qrInput = document.getElementById('qr-input');
+const generateButton = document.getElementById('generate-button');
+const qrOutput = document.getElementById('qr-output');
+const downloadLink = document.getElementById('download-link');
+
+let qr = null;
+
+generateButton.addEventListener('click', () => {
+    const inputText = qrInput.value;
+    if (inputText) {
+        if (qr) {
+            qr.clear();
+            qr.makeCode(inputText);
+        } else {
+            qr = new QRCode(qrOutput, {
+                text: inputText,
+                width: 256,
+                height: 256,
+                colorDark: "#000000",
+                colorLight: "#ffffff",
+                correctLevel: QRCode.CorrectLevel.H
+            });
+        }
+        
+        // Enable download after a short delay to ensure QR code is generated
+        setTimeout(() => {
+            const qrImage = qrOutput.querySelector('img');
+            downloadLink.href = qrImage.src;
+            downloadLink.download = 'qrcode.png';
+            downloadLink.style.display = 'inline-block';
+        }, 100);
+    }
+});
diff --git a/js/updated-common-js (1).txt b/js/updated-common-js (1).txt
new file mode 100644
index 0000000..672a2d1
--- /dev/null
+++ b/js/updated-common-js (1).txt	
@@ -0,0 +1,15 @@
+document.addEventListener('DOMContentLoaded', (event) => {
+    const nav = document.getElementById('main-nav');
+    const currentPath = window.location.pathname;
+
+    const navItems = [
+        { href: "index.html", text: "Home" },
+        { href: "pages/image-resizer.html", text: "Image Resizer" },
+        { href: "pages/color-palette.html", text: "Color Palette" },
+        { href: "pages/ascii-art.html", text: "ASCII Art" },
+        { href: "pages/qr-generator.html", text: "QR Code Generator" },
+        { href: "pages/about.html", text: "About" }
+    ];
+
+    // ... rest of the code remains the same
+});
diff --git a/js/updated-common-js.txt b/js/updated-common-js.txt
new file mode 100644
index 0000000..cadcace
--- /dev/null
+++ b/js/updated-common-js.txt
@@ -0,0 +1,14 @@
+document.addEventListener('DOMContentLoaded', (event) => {
+    const nav = document.getElementById('main-nav');
+    const currentPath = window.location.pathname;
+
+    const navItems = [
+        { href: "index.html", text: "Home" },
+        { href: "pages/image-resizer.html", text: "Image Resizer" },
+        { href: "pages/color-palette.html", text: "Color Palette" },
+        { href: "pages/ascii-art.html", text: "ASCII Art" },
+        { href: "pages/about.html", text: "About" }
+    ];
+
+    // ... rest of the code remains the same
+});
diff --git a/js/updated-index-html (1).html b/js/updated-index-html (1).html
new file mode 100644
index 0000000..e986e0a
--- /dev/null
+++ b/js/updated-index-html (1).html	
@@ -0,0 +1,3 @@
+
+