Initial commit

Bharadwaja-sahoo · Mar 5, 2024 · d7fd8a5 · d7fd8a5
commit d7fd8a5
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 0 deletions.
diff --git a/.gitattributes b/.gitattributes
@@ -0,0 +1,2 @@
+# Auto detect text files and perform LF normalization
+* text=auto
diff --git a/index.html b/index.html
@@ -0,0 +1,19 @@
+<html>
+<head>
+    <title>Image Generator App</title>
+    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
+</head>
+<body>
+    <div class="container text-center">
+        <h1>Image Generator App</h1>
+        <p>Enter text to generate an image:</p>
+        <input type="text" id="textInput" class="form-control mb-3" placeholder="Enter text">
+        <button onclick="generateImage()" class="btn btn-primary">Generate Image</button>
+        <div id="imageContainer" class="mt-3"></div>
+    </div>
+
+
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script>
+    <script src="./style.js"></script>
+</body>
+</html>
diff --git a/style.js b/style.js
@@ -0,0 +1,15 @@
+function generateImage() {
+    const text = document.getElementById('textInput').value;
+    const imageContainer = document.getElementById('imageContainer');
+
+    // You can make an AJAX call here to fetch image based on text input
+    // For demonstration purposes, let's just display a placeholder image
+    const placeholderImageUrl = 'https://source.unsplash.com/featured/?' + text;
+
+    const imageElement = document.createElement('img');
+    imageElement.setAttribute('src', placeholderImageUrl);
+    imageElement.setAttribute('class', 'img-fluid');
+
+    imageContainer.innerHTML = '';
+    imageContainer.appendChild(imageElement);
+}