diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md
index 48b28f8..6389962 100644
--- a/CONTRIBUTORS.md
+++ b/CONTRIBUTORS.md
@@ -4,4 +4,5 @@ Here's to the crazy ones:
Divyansh Upadhyay
Lovedeep singh kamal
-Neeraj Chatterjee
\ No newline at end of file
+Neeraj Chatterjee
+Rahul Maurya
\ No newline at end of file
diff --git a/src/components/Meme.js b/src/components/Meme.js
index f973e95..d449941 100644
--- a/src/components/Meme.js
+++ b/src/components/Meme.js
@@ -13,7 +13,8 @@ export default function Meme() {
useEffect(function () {
fetch(api_url)
.then((data) => data.json())
- .then((data) => setAllMemes(data.data.memes));
+ .then((data) => setAllMemes(data.data.memes))
+ .catch((err) => document.write("
Cannot connect to the server. Try after some time
"));
}, []);
//this state stores information about the current meme
@@ -23,12 +24,50 @@ export default function Meme() {
url: "",
});
+ const [display, setDisplay] = useState(false)
+
+ const handleTopText = (e) => {
+ setMeme((prev) => ({
+ ...prev,
+ topText: e.target.value
+ }));
+ }
+
+ const handleBottomText = (e) => {
+ setMeme((prev) => ({
+ ...prev,
+ bottomText: e.target.value
+ }));
+ }
+
+
+ const handleClick = (e) => {
+ if (e.target.name == "topText")
+ setMeme((prev) => ({
+ ...prev,
+ topText: ""
+ }));
+ else if (e.target.name == "bottomText") setMeme((prev) => ({
+ ...prev,
+ bottomText: ""
+ }));
+ }
+
function getRandomMeme() {
+ // const {topText, bottomText} = meme
+ // if(topText=="" && bottomText=="") {
+ // alert("Please fill any one of the text")
+ // return
+ // }
let index = Math.floor(Math.random() * allMemes.length);
setMeme((prev) => ({
...prev,
url: allMemes[index].url,
}));
+
+ setDisplay(() => ({
+ display: true
+ }))
}
//this is for handling the input
@@ -41,17 +80,17 @@ export default function Meme() {
}
// this is for uploading the image from the PC
- function uploadImage(event){
+ function uploadImage(event) {
console.log(event.target.files[0].type);
// accepts image in the form of PNG/JPG/JPEG
- if (event.target.files[0].type === "image/png" || event.target.files[0].type === "image/jpg" || event.target.files[0].type === "image/jpeg"){
+ if (event.target.files[0].type === "image/png" || event.target.files[0].type === "image/jpg" || event.target.files[0].type === "image/jpeg") {
setMeme((prev) => ({
...prev,
url: URL.createObjectURL(event.target.files[0])
}))
}
- else{
+ else {
// Alert is shown when there is incorrect file chosen
alert("Please upload the image in the correct format (PNG/JPEG/JPG)!")
}
@@ -65,26 +104,32 @@ export default function Meme() {
type="text"
placeholder="text1"
name="topText"
+ value={meme.topText}
+ onChange={handleTopText}
/>
-