QuickFetch/index.html at main · luckycdev/QuickFetch · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
<meta charset="UTF-8"/>
<meta property='og:description'  content='Test a fetch easily'>
<meta name="keywords" content="Fetch, JavaScript, QuickFetch"/>
<meta name="author" content="luckycdev"/>
<meta property='og:title'  content='QuickFetch'>
<meta property='og:url'  content='https://quickfetch.luckyc.dev'>
<meta property="og:image"  content="https://r2.e-z.host/3dc483d6-0f73-445d-bc8a-0f7e441dac0b/yz6zwc0r.png">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="theme-color" content="#37178f">

<title>QuickFetch</title>
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link href='https://fonts.googleapis.com/css?family=Open Sans' rel='stylesheet'>
<script src="https://kit.fontawesome.com/bdb0f81e24.js" crossorigin="anonymous"></script>
<body style="padding-bottom: 50px;background: linear-gradient(90deg, hsl(251, 55%, 38%) 0%, #85a8ff 100%); font-family: 'Open Sans'; font-size: 22px;">
<h1 style="color:white; text-align: center;">QuickFetch</h1>
<h3 style="color:white; text-align: center;"><u>Quickly test a fetch</u></h3>
<h3 style="color:lightsteelblue; text-align: center;">Put the url in the textarea, example: "https://returnyoutubedislikeapi.com/votes?videoId=x_zlY-UnvGQ"</h3>
<h3 style="color:lightsteelblue; text-align: center;">For specifics use what you want to see, example: "dislikes"</h3>
<div align="center"><textarea id='fetchtext' name='fetchtext' style="width:500px;height:200px;color:white;background-color:#2e3233;margin:auto" placeholder="fetch url"></textarea></div>
<div align="center"><textarea id='specific' name='specific' style="width:500px;height:200px;color:white;background-color:#2e3233;margin:auto" placeholder="specific (ex: dislikes) - will show only that from the response"></textarea></div>
<div align="center"><button class="button" onclick="quickfetchjs()">Fetch</button></div>
<script>
function quickfetchjs() {
    var fetchtext=document.getElementById("fetchtext").value;
    var specific=document.getElementById("specific").value;
    if(specific!==''){
        fetch(fetchtext)
        .then(response=>response.json())
        .then(data=>{
            if(data.hasOwnProperty(specific)){
                var responsep=document.createElement("p");
                responsep.innerText=specific+" : "+JSON.stringify(data[specific]);
                responsep.style.color='white';
                var namep=document.createElement('p');
                namep.innerText="Fetched "+fetchtext+" with specific : "+specific;
                namep.style.fontWeight='bold';
                namep.style.textDecoration='underline';
                namep.style.color='white';
                document.body.appendChild(namep);
                document.body.appendChild(responsep);
                window.scrollTo({ left: 0, top: document.body.scrollHeight, behavior: "smooth" });
            }
            else{
                throw new Error('The specified property does not exist in the fetched data.');
                window.scrollTo({ left: 0, top: document.body.scrollHeight, behavior: "smooth" });
            }
        })
        .catch(error=>{
            var errorp=document.createElement('p');
            errorp.innerText='Error: '+error.message;
            errorp.style.color='red';
            document.body.appendChild(errorp);
            window.scrollTo({ left: 0, top: document.body.scrollHeight, behavior: "smooth" });
        });
    }
    else{
        fetch(fetchtext)
        .then(response=>response.json())
        .then(data=>{
            var responsep=document.createElement("p");
            responsep.innerText=JSON.stringify(data);
            responsep.style.color='white';
            var namep=document.createElement('p');
            namep.innerText="Fetched "+fetchtext;
            namep.style.fontWeight='bold';
            namep.style.textDecoration='underline';
            namep.style.color='white';
            document.body.appendChild(namep);
            document.body.appendChild(responsep);
            window.scrollTo({ left: 0, top: document.body.scrollHeight, behavior: "smooth" });
        })
        .catch(error=>{
            var errorp=document.createElement('p');
            errorp.innerText='Error: '+error.message;
            errorp.style.color='red';
            document.body.appendChild(errorp);
            window.scrollTo({ left: 0, top: document.body.scrollHeight, behavior: "smooth" });
        });
    }
}
</script>
</body>
<style>
div.discord{
position:fixed;
right:10px;
bottom:10px;
}
div.github{
position:fixed;
right:50px;
bottom:10px;
}
div.watermark{
  position:fixed;
  left:10px;
  bottom:10px;
}
  .button {
    position: relative;
    background-color: #4c29c9;
    border: none;
    border-radius: 15px;
    font-size: 28px;
    color: #FFFFFF;
    padding: 20px;
    width: 200px;
    text-align: center;
    transition-duration: 0.4s;
    text-decoration: none;
    overflow: hidden;
    cursor: pointer;
  }
  .button:after {
    content: "";
    background: #5230cf;
    display: block;
    position: absolute;
    padding-top: 300%;
    padding-left: 350%;
    margin-left: -20px !important;
    margin-top: -120%;
    opacity: 0;
    transition: all 0.8s
  }
  .button:active:after {
    padding: 0;
    margin: 0;
    opacity: 1;
    transition: 0s
  }
  </style>
<div align="center" class="discord"><a href="https://discord.gg/nAEtSVbcKx" target="_blank"><i class="fa-brands fa-discord" style="color:#5865F2;"></i></a>
<div align="center" class="github"><a href="https://github.com/luckycdev/QuickFetch" target="_blank"><i class="fa-brands fa-github" style="color:black;"></i></a>
<div align="center" class="watermark"><a href="https://github.com/luckycdev" target="_blank"><h3 style="font-size:15px;color:white;">Made by lucky#9919</h3></a>