Merge pull request #2015 from SarveshN23/master

Meme Generator added
fineanmol · Oct 3, 2022 · df14db1 · df14db1
2 parents 75dd452 + 1ef0f61
commit df14db1
Show file tree

Hide file tree

Showing 38 changed files with 419 additions and 0 deletions.
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/image1.png b/Program's_Contributed_By_Contributors/Meme-Gen/image1.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/index.html b/Program's_Contributed_By_Contributors/Meme-Gen/index.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <link rel="stylesheet" href="./styles.css" />
+        <link rel="preconnect" href="https://fonts.googleapis.com" />
+        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+        <link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,200;0,300;0,400;0,500;1,200&display=swap"
+            rel="stylesheet" />
+        <title>Meme Page</title>
+    </head>
+
+</html>
+<body>
+    <div class="content">
+        <h1>MEME GENERATOR</h1>
+        <div class ="container">
+            <div class="navbar">
+                <nav>
+                    <ul>
+                        <li><a href="traditional.html"><font size="+2">TRADITIONAL MEMES</font></a></li>
+                        <li><a href="text-memes.html"><font size="+2">TEXT MEMES</font></a></li>
+                        <li><a href="sc-meme.html"><font size="+2">SCREENSHOT MEMES</font></a></li>
+
+                    </ul>
+                </nav>
+            </div>
+
+            <img id="shrek-img" class=" shrek" src="image1.png">
+
+        </div>
+    </div>
+
+</body>
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/sc-meme.html b/Program's_Contributed_By_Contributors/Meme-Gen/sc-meme.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8" />
+		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<link rel="stylesheet" href="sc_meme.css" />
+		<title>SCREENSHOT</title>
+	</head>
+    <body>
+        <div>
+            <button class="button" id="jsstyle" onclick="display_random_meme();">Show Meme</button> 
+        </div>
+        <script src="./sc_meme.js"></script>
+    </body>
+</html>
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme.css b/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme.css
@@ -0,0 +1,13 @@
+body {
+    margin-top: 30px;
+
+}
+.button {
+    transition-duration: 0.4s;
+    padding: 15px 32px;
+  }
+
+.button:hover {
+    background-color: #343634; 
+    color: white;
+}
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme.js b/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme.js
@@ -0,0 +1,44 @@
+function display_random_meme() 
+{
+     var theImages = [{
+        src: "./sc_meme/sc_meme1.png"
+    },{
+        src: "./sc_meme/sc_meme2.png"
+    },{
+        src: "./sc_meme/sc_meme3.png"
+    },{
+        src: "./sc_meme/sc_meme4.png"
+    },{
+        src: "./sc_meme/sc_meme5.png"
+    },{
+        src: "./sc_meme/sc_meme6.png"
+    },{
+        src: "./sc_meme/sc_meme7.png"
+    },{
+        src: "./sc_meme/sc_meme8.png"
+    },{
+        src: "./sc_meme/sc_meme9.png"
+    },];
+
+    var preBuffer = [];
+    for (var i = 0, j = theImages.length; i < j; i++) {
+        preBuffer[i] = new Image();
+        preBuffer[i].src = theImages[i].src;
+    }
+
+    function getRandomInt(min,max) 
+    {
+
+    imn = Math.floor(Math.random() * (max - min + 1)) + min;
+    return preBuffer[imn];
+    }  
+
+    var newImage = getRandomInt(0, preBuffer.length - 1);
+
+    var images = document.getElementsByTagName('img');
+    var l = images.length;
+    for (var p = 0; p < l; p++) {
+        images[0].parentNode.removeChild(images[0]);
+    }  
+    document.body.appendChild(newImage);
+}
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme1.png b/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme1.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme2.png b/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme2.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme3.png b/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme3.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme4.png b/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme4.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme5.png b/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme5.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme6.png b/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme6.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme7.png b/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme7.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme8.png b/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme8.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme9.png b/Program's_Contributed_By_Contributors/Meme-Gen/sc_meme/sc_meme9.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/styles.css b/Program's_Contributed_By_Contributors/Meme-Gen/styles.css
@@ -0,0 +1,44 @@
+*{
+    margin: 20;
+    padding: 20;
+    box-sizing: border-box;
+}
+html{
+    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+}
+h1{
+    text-align: center;
+}
+.navbar{
+    display: flex;
+    justify-content: center;
+    align-items: center ;
+    padding: 20px;
+    width: 100%;
+}
+nav{
+    flex: 1;
+    text-align: center;
+}
+nav ul{
+    display: inline-block;
+    list-style-type: none;
+}
+nav ul li{
+    display: inline;
+    margin-right: 20px;
+}
+a{
+    text-decoration: none;
+    color:black;
+}
+.shrek{
+    display: block;
+    margin-left: auto;
+    margin-right: auto;
+}
+
+
+
+
+
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme1.png b/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme1.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme10.png b/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme10.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme2.png b/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme2.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme3.png b/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme3.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme4.png b/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme4.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme5.png b/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme5.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme6.png b/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme6.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme7.png b/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme7.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme8.png b/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme8.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme9.png b/Program's_Contributed_By_Contributors/Meme-Gen/t_meme/t_meme9.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/text-memes.html b/Program's_Contributed_By_Contributors/Meme-Gen/text-memes.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8" />
+		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<link rel="stylesheet" href="traditional.css" />
+		<title>TEXT_Memes</title>
+	</head>
+    <body>
+        <div>
+            <button class="button" id="jsstyle" onclick="display_random_meme();">Show Meme</button> 
+        </div>
+        <script src="./text.js"></script>
+    </body>
+</html>
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/text.css b/Program's_Contributed_By_Contributors/Meme-Gen/text.css
@@ -0,0 +1,13 @@
+body {
+    margin-top: 30px;
+
+}
+.button {
+    transition-duration: 0.4s;
+    padding: 15px 32px;
+  }
+
+.button:hover {
+    background-color: #343634; 
+    color: white;
+}
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/text.js b/Program's_Contributed_By_Contributors/Meme-Gen/text.js
@@ -0,0 +1,38 @@
+function display_random_meme() 
+{
+     var theImages = [{
+        src: "./text_m/text_m1.png"
+    },{
+        src: "./text_m/text_m2.png"
+    },{
+        src: "./text_m/text_m3.png"
+    },{
+        src: "./text_m/text_m4.png"
+    },{
+        src: "./text_m/text_m5.png"
+    },{
+        src: "./text_m/text_m6.png"
+    }, ];
+
+    var preBuffer = [];
+    for (var i = 0, j = theImages.length; i < j; i++) {
+        preBuffer[i] = new Image();
+        preBuffer[i].src = theImages[i].src;
+    }
+
+    function getRandomInt(min,max) 
+    {
+
+    imn = Math.floor(Math.random() * (max - min + 1)) + min;
+    return preBuffer[imn];
+    }  
+
+    var newImage = getRandomInt(0, preBuffer.length - 1);
+
+    var images = document.getElementsByTagName('img');
+    var l = images.length;
+    for (var p = 0; p < l; p++) {
+        images[0].parentNode.removeChild(images[0]);
+    }  
+    document.body.appendChild(newImage);
+}
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/text_m/text_m1.png b/Program's_Contributed_By_Contributors/Meme-Gen/text_m/text_m1.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/text_m/text_m2.png b/Program's_Contributed_By_Contributors/Meme-Gen/text_m/text_m2.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/text_m/text_m3.png b/Program's_Contributed_By_Contributors/Meme-Gen/text_m/text_m3.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/text_m/text_m4.png b/Program's_Contributed_By_Contributors/Meme-Gen/text_m/text_m4.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/text_m/text_m5.png b/Program's_Contributed_By_Contributors/Meme-Gen/text_m/text_m5.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/text_m/text_m6.png b/Program's_Contributed_By_Contributors/Meme-Gen/text_m/text_m6.png
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/traditional.css b/Program's_Contributed_By_Contributors/Meme-Gen/traditional.css
@@ -0,0 +1,13 @@
+body {
+    margin-top: 30px;
+
+}
+.button {
+    transition-duration: 0.4s;
+    padding: 15px 32px;
+  }
+
+.button:hover {
+    background-color: #343634; 
+    color: white;
+}
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/traditional.html b/Program's_Contributed_By_Contributors/Meme-Gen/traditional.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8" />
+		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<link rel="stylesheet" href="traditional.css" />
+		<title>TRADITIONAL</title>
+	</head>
+    <body>
+        <div>
+            <button class="button" id="jsstyle" onclick="display_random_meme();">Show Meme</button> 
+        </div>
+        <script src="./traditional.js"></script>
+    </body>
+</html>
diff --git a/Program's_Contributed_By_Contributors/Meme-Gen/traditional.js b/Program's_Contributed_By_Contributors/Meme-Gen/traditional.js
@@ -0,0 +1,46 @@
+function display_random_meme() 
+{
+     var theImages = [{
+        src: "./t_meme/t_meme1.png"
+    }, {
+        src: "./t_meme/t_meme2.png"
+    }, {
+        src: "./t_meme/t_meme3.png"
+    }, {
+        src: "./t_meme/t_meme4.png"
+    }, {
+        src: "./t_meme/t_meme5.png"
+    }, {
+        src: "./t_meme/t_meme6.png"
+    }, {
+        src: "./t_meme/t_meme7.png"
+    }, {
+        src: "./t_meme/t_meme8.png"
+    }, {
+        src: "./t_meme/t_meme9.png"
+    }, {
+        src: "./t_meme/t_meme10.png"
+    }];
+
+    var preBuffer = [];
+    for (var i = 0, j = theImages.length; i < j; i++) {
+        preBuffer[i] = new Image();
+        preBuffer[i].src = theImages[i].src;
+    }
+
+    function getRandomInt(min,max) 
+    {
+
+    imn = Math.floor(Math.random() * (max - min + 1)) + min;
+    return preBuffer[imn];
+    }  
+
+    var newImage = getRandomInt(0, preBuffer.length - 1);
+
+    var images = document.getElementsByTagName('img');
+    var l = images.length;
+    for (var p = 0; p < l; p++) {
+        images[0].parentNode.removeChild(images[0]);
+    }  
+    document.body.appendChild(newImage);
+}