Small cleanup of Webpage

This commit is contained in:
Taevas 2023-03-08 01:48:47 +01:00
parent c41fac6862
commit c992d5ce75
6 changed files with 56 additions and 51 deletions

View file

@ -1,10 +1,12 @@
# Website-Finder: Javascript
# Website-Finder: Webpage
While this is called Javascript, it also makes use of HTML (and CSS, somewhat)
This version of Website-Finder differs a lot from the scripts available in this repository, as it runs in a web browser and uses external dependencies to look fancy
The reason why is because this version is geared towards people who just want to look at something cool that does something cool, without the hassle of installing a new programming language
## HOW TO RUN
It is already being run by [GitHub Pages](https://tttaevas.github.io/Website-Finder/Javascript/index.html), but you may run it yourself simply by opening [index.html](./index.html) in your web browser
It is already being run on [finder.taevas.xyz](https://finder.taevas.xyz), but you may run it yourself simply by cloning the repository and opening index.html in your web browser
Do note that using arguments and launching the search is done through the HTML, so you cannot use the cli/terminal to use arguments, and opening the file will not instantly trigger the search
@ -25,13 +27,13 @@ $ open index.html
Your web browser should be unable to create files on your computer, so unlike other scripts, no report in json is made
Instead, a report is created in real time within the HTML, while the logging is done by the browser in its development tools
Instead, a report is created in real time within the HTML, and some logging is done by the browser in its development tools
## REGARDING ARGUMENTS
The GitHub Pages version cannot use HTTP due to [Mixed Content](https://developer.mozilla.org/en-US/docs/Web/Security/Mixed_content)
If the page is served to you through HTTPS, you won't be able to use the HTTP application protocol due to [Mixed Content](https://developer.mozilla.org/en-US/docs/Web/Security/Mixed_content)
The default arguments may not match the ones specified in [defaults.json](../defaults.json), as they have to be independent from each other
The default arguments do not match the ones specified in [defaults.json](../defaults.json)
## OTHER STUFF

BIN
Webpage/favicon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

View file

@ -29,22 +29,10 @@ body {
line-height: 1em;
}
label {
#finder label {
color: black;
}
#btn {
padding: 40px;
margin: 10px;
font-size: 50px;
}
@media screen and (max-width: 700px) {
#btn {
font-size: 4.5vw;
}
}
#finder, #status {
border: solid 1px;
border-collapse: collapse;
@ -63,6 +51,18 @@ label {
margin: 15px;
}
#search_btn {
padding: 40px;
margin: 10px;
font-size: 50px;
}
@media screen and (max-width: 700px) {
#search_btn {
font-size: 4.5vw;
}
}
#status {
background-color: #030715a3;
overflow-x: hidden;
@ -84,33 +84,6 @@ label {
width: 0;
}
#list {
flex: auto;
width: 600px;
height: 50vh;
overflow-x: hidden;
overflow-y: auto;
background-color: #0000006e;
border: solid 1px;
}
#actual_list {
padding: 0px;
}
#list a {
color: white;
}
#list a:visited {
color: grey;
}
li {
list-style: none;
font-size: 20px;
margin: 10px;
}
/* https://stackoverflow.com/a/23635565 */
@-webkit-keyframes borderBlink {
from, to {
@ -133,3 +106,32 @@ li {
-webkit-animation: borderBlink 2s step-end infinite;
animation: borderBlink 2s step-end infinite;
}
#list {
flex: auto;
width: 600px;
height: 50vh;
overflow-x: hidden;
overflow-y: auto;
background-color: #0000006e;
border: solid 1px;
}
#actual_list {
padding: 0px;
}
#actual_list a {
color: white;
}
#actual_list a:visited {
color: grey;
}
#actual_list li {
list-style: none;
font-size: 20px;
margin: 10px;
}

View file

@ -2,6 +2,7 @@
<html>
<head>
<title>Website-Finder</title>
<link rel="icon" type="image/x-icon" href="./favicon.png">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="https://fonts.cdnfonts.com/css/gugi" rel="stylesheet">
@ -57,7 +58,7 @@
<label>Chances out of 100 for a URL to have two TLDs</label>
</div>
</div>
<input type="button" id="btn" value="Find websites!">
<input type="button" id="search_btn" value="Find websites!">
</form>
</div>
<div id="status" class="row" style="display: none;">

View file

@ -1,5 +1,5 @@
$(function() {
$("#btn").click(findWebsites)
$("#search_btn").click(findWebsites)
})
function findWebsites() {
@ -31,7 +31,7 @@ function findWebsites() {
$("#progress").removeClass("in_progress")
console.log("\nFinished at " + String(new Date().toLocaleTimeString()))
document.getElementById("btn").disabled = false
$("#search_btn").attr("disabled", false)
}
function url_generator() {
@ -61,6 +61,6 @@ function findWebsites() {
console.log("Minimum length of URLs:", min)
console.log("Maximum length of URLs:", max)
document.getElementById("btn").disabled = true
$("#search_btn").attr("disabled", true)
main_loop()
}

View file

@ -1,3 +1,3 @@
<meta http-equiv="refresh" content="0; url=Webpage/index.html">
<meta http-equiv="refresh" content="0; url=./Webpage">
<!-- This file is only used for redirecting to the right page when root is hosted instead of ./Webpage
This file is not necessary for anything else, you may delete it if you find it useless -->