Skip to content

Commit

Permalink
Add files via upload
Browse files Browse the repository at this point in the history
  • Loading branch information
TMHSDigital authored Jul 9, 2024
1 parent 2aef502 commit a26e58c
Show file tree
Hide file tree
Showing 10 changed files with 196 additions and 0 deletions.
26 changes: 26 additions & 0 deletions js/ascii-art-css.txt
Original file line number Diff line number Diff line change
@@ -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;
}
35 changes: 35 additions & 0 deletions js/ascii-art-html.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ASCII Art Converter - Digital Services Hub</title>
<link rel="stylesheet" href="../css/styles.css">
<link rel="stylesheet" href="../css/ascii-art.css">
</head>
<body>
<div class="container">
<h1 class="neon-text">ASCII Art Converter</h1>

<nav id="main-nav"></nav>

<div class="content">
<div class="input-group">
<label for="text-input">Enter your text:</label>
<textarea id="text-input" rows="3" placeholder="Type your text here..."></textarea>
</div>

<button id="convert-button" class="tech-button">Convert to ASCII Art</button>

<div id="output-container" class="ascii-output">
<pre id="ascii-output"></pre>
</div>

<p class="instructions">Enter your text and click 'Convert to ASCII Art' to see the result.</p>
</div>
</div>

<script src="../js/common.js"></script>
<script src="../js/ascii-art.js"></script>
</body>
</html>
19 changes: 19 additions & 0 deletions js/ascii-art-js.txt
Original file line number Diff line number Diff line change
@@ -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;
});
36 changes: 36 additions & 0 deletions js/qr-generator-html.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>QR Code Generator - Digital Services Hub</title>
<link rel="stylesheet" href="../css/styles.css">
<link rel="stylesheet" href="../css/qr-generator.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js"></script>
</head>
<body>
<div class="container">
<h1 class="neon-text">QR Code Generator</h1>

<nav id="main-nav"></nav>

<div class="content">
<div class="input-group">
<label for="qr-input">Enter text or URL:</label>
<input type="text" id="qr-input" placeholder="Enter text or URL here">
</div>

<button id="generate-button" class="tech-button">Generate QR Code</button>

<div id="qr-output"></div>

<a id="download-link" class="tech-button" style="display: none;">Download QR Code</a>

<p class="instructions">Enter text or a URL and click 'Generate QR Code' to create your QR code.</p>
</div>
</div>

<script src="../js/common.js"></script>
<script src="../js/qr-generator.js"></script>
</body>
</html>
33 changes: 33 additions & 0 deletions js/qr-generator-js.txt
Original file line number Diff line number Diff line change
@@ -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);
}
});
15 changes: 15 additions & 0 deletions js/updated-common-js (1).txt
Original file line number Diff line number Diff line change
@@ -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
});
14 changes: 14 additions & 0 deletions js/updated-common-js.txt
Original file line number Diff line number Diff line change
@@ -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
});
3 changes: 3 additions & 0 deletions js/updated-index-html (1).html
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
<!-- ... previous content ... -->
<ul class="services-list">
<li><a href="pages/image-resizer.html">Futuristic Image Resizer</a></l
8 changes: 8 additions & 0 deletions js/updated-index-html (2).html
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
<!-- ... previous content ... -->
<ul class="services-list">
<li><a href="pages/image-resizer.html">Futuristic Image Resizer</a></li>
<li><a href="pages/color-palette.html">Color Palette Generator</a></li>
<li><a href="pages/ascii-art.html">ASCII Art Converter</a></li>
<li><a href="pages/qr-generator.html">QR Code Generator</a></li>
</ul>
<!-- ... rest of the content ... -->
7 changes: 7 additions & 0 deletions js/updated-index-html.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
<!-- ... previous content ... -->
<ul class="services-list">
<li><a href="pages/image-resizer.html">Futuristic Image Resizer</a></li>
<li><a href="pages/color-palette.html">Color Palette Generator</a></li>
<li><a href="pages/ascii-art.html">ASCII Art Converter</a></li>
</ul>
<!-- ... rest of the content ... -->

0 comments on commit a26e58c

Please sign in to comment.