Skip to content

Commit

Permalink
Hotfix UI, UI fixes, scrape another timeframe feature
Browse files Browse the repository at this point in the history
  • Loading branch information
@dstN
dstN committed May 6, 2020
1 parent 6eb907f commit a34d9af
Show file tree
Hide file tree
Showing 3 changed files with 98 additions and 98 deletions.
150 changes: 76 additions & 74 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,74 +17,74 @@ <h1 class="doneScrape">Transfermarkt Scraper</h1>
<div class="form-control">
<label for="startyear">Starting year:</label>
<select id="startyear" name="startyear">
<option disabled selected value>select a year</option>
<option value="2022">2022</option>
<option value="2021">2021</option>
<option value="2020">2020</option>
<option value="2019">2019</option>
<option value="2018">2018</option>
<option value="2017">2017</option>
<option value="2016">2016</option>
<option value="2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
<option value="2012">2012</option>
<option value="2011">2011</option>
<option value="2010">2010</option>
<option value="2009">2009</option>
<option value="2008">2008</option>
<option value="2007">2007</option>
<option value="2006">2006</option>
<option value="2005">2005</option>
<option value="2004">2004</option>
<option value="2003">2003</option>
<option value="2002">2002</option>
<option value="2001">2001</option>
<option value="2000">2000</option>
<option value="1999">1999</option>
<option value="1998">1998</option>
<option value="1997">1997</option>
<option value="1996">1996</option>
<option value="1995">1995</option>
<option value="1994">1994</option>
<option value="1993">1993</option>
<option value="1992">1992</option>
<option value="1991">1991</option>
<option value="1990">1990</option>
<option value="1989">1989</option>
<option value="1988">1988</option>
<option value="1987">1987</option>
<option value="1986">1986</option>
<option value="1985">1985</option>
<option value="1984">1984</option>
<option value="1983">1983</option>
<option value="1982">1982</option>
<option value="1981">1981</option>
<option value="1980">1980</option>
<option value="1979">1979</option>
<option value="1978">1978</option>
<option value="1977">1977</option>
<option value="1976">1976</option>
<option value="1975">1975</option>
<option value="1974">1974</option>
<option value="1973">1973</option>
<option value="1972">1972</option>
<option value="1971">1971</option>
<option value="1970">1970</option>
<option value="1969">1969</option>
<option value="1968">1968</option>
<option value="1967">1967</option>
<option value="1966">1966</option>
<option value="1965">1965</option>
<option value="1964">1964</option>
<option value="1963">1963</option>
<option value="1962">1962</option>
<option value="1961">1961</option>
<option value="1960">1960</option>
<option value="1959">1959</option>
<option value="1958">1958</option>
<option value="1957">1957</option>
<option disabled="" selected="" value="">select a year</option>
<option value="1956">1956</option>
<option value="1957">1957</option>
<option value="1958">1958</option>
<option value="1959">1959</option>
<option value="1960">1960</option>
<option value="1961">1961</option>
<option value="1962">1962</option>
<option value="1963">1963</option>
<option value="1964">1964</option>
<option value="1965">1965</option>
<option value="1966">1966</option>
<option value="1967">1967</option>
<option value="1968">1968</option>
<option value="1969">1969</option>
<option value="1970">1970</option>
<option value="1971">1971</option>
<option value="1972">1972</option>
<option value="1973">1973</option>
<option value="1974">1974</option>
<option value="1975">1975</option>
<option value="1976">1976</option>
<option value="1977">1977</option>
<option value="1978">1978</option>
<option value="1979">1979</option>
<option value="1980">1980</option>
<option value="1981">1981</option>
<option value="1982">1982</option>
<option value="1983">1983</option>
<option value="1984">1984</option>
<option value="1985">1985</option>
<option value="1986">1986</option>
<option value="1987">1987</option>
<option value="1988">1988</option>
<option value="1989">1989</option>
<option value="1990">1990</option>
<option value="1991">1991</option>
<option value="1992">1992</option>
<option value="1993">1993</option>
<option value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>
<option value="2006">2006</option>
<option value="2007">2007</option>
<option value="2008">2008</option>
<option value="2009">2009</option>
<option value="2010">2010</option>
<option value="2011">2011</option>
<option value="2012">2012</option>
<option value="2013">2013</option>
<option value="2014">2014</option>
<option value="2015">2015</option>
<option value="2016">2016</option>
<option value="2017">2017</option>
<option value="2018">2018</option>
<option value="2019">2019</option>
<option value="2020">2020</option>
<option value="2021">2021</option>
<option value="2022">2022</option>
</select>
</div>
<div class="form-control">
Expand Down Expand Up @@ -177,13 +177,15 @@ <h1 class="doneScrape">Transfermarkt Scraper</h1>
</div>
<div class="copy">
<h1 class="loadingScrape">Scraping...</h1>
<pre id="copy"></pre>
<button onclick="copyFunction()">
Copy to clipboard
</button>
<button onclick="scrapeReset()">
Scrape another!
</button>
<div class="copyinner">
<pre id="copy"></pre>
<button onclick="copyFunction()">
Copy to clipboard
</button>
<button onclick="scrapeReset()">
Scrape another!
</button>
</div>
</div>
<script type="text/javascript" src="selectbox.js"></script>
<script type="text/javascript" src="main.js"></script>
Expand Down
15 changes: 6 additions & 9 deletions main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -86,10 +86,8 @@ function ajaxCall(startyear, endyear){
$("."+startyear+".before").append("<p id='"+playerID+"'>"+playerJSON+"</p>"); // parse json to browser
});
$("."+startyear+".after").append("<span>],</span>");

if(startyear++ < endyear) {
$(".loadingScrape").removeClass("visible");
ajaxCall(startyear);
ajaxCall(startyear, endyear);
}
else {
$(".loadingScrape").removeClass("visible");
Expand All @@ -99,10 +97,8 @@ function ajaxCall(startyear, endyear){
completeJSON = JSON.parse(completeJSON);
completeJSON = JSON.stringify(completeJSON, undefined, 2);
jsonoutput(syntaxHighlight(completeJSON));
$(".copy").addClass("visible");
$(".copy").prepend('<h1 class="doneScrape">Scraping done!</h1>');
$(".copy button").addClass("visible");
$("#copy").addClass("visible");
$(".copy .copyinner").addClass("visible");
$(".copy .loadingScrape").addClass("doneScrape").removeClass("loadingScrape").text("Scraping done!");
}
},
error: function(error) {
Expand Down Expand Up @@ -136,10 +132,11 @@ function copyFunction() {
alert("Copied to clipboard!");
}
function scrapeReset() {
$(".table .json").empty();
$(".copy pre").empty();
$(".copy .doneScrape").remove();
$(".copy, .copy pre, .copy button").removeClass("visible");
$(".copyinner").removeClass("visible");
$(".form").addClass("visible");
$(".copy .doneScrape").addClass("loadingScrape").text("Scraping...");
}
function jsonoutput(input) {
document.getElementById("copy").innerHTML = input;
Expand Down
31 changes: 16 additions & 15 deletions style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,10 @@ body {
margin: 0;
padding: 0;
}
h1 {
margin-top: 1rem;
margin-bottom: 1rem;
}
::selection {
background: #e03100;
color: #fff;
Expand All @@ -22,18 +26,9 @@ body {
display: none !important;
visibility: hidden !important;
}
.copy {
display: block !important;
visibility: visible !important;
position: absolute;
height: 100%;
width: 100%;
top: 0;
z-index: 0;
}
.loadingScrape {
opacity: 0;
visibility: hidden;
opacity: 0;
color: #fff;
text-align: center;
text-shadow: 1px 1px 2px rgba(0,0,0,0.7),
Expand Down Expand Up @@ -73,8 +68,6 @@ pre {
max-height: 50vh !important;
margin: auto;
font-family: Console, monospace;
opacity: 0;
visibility: hidden;
margin-bottom: 1rem;
}
.string { color: green; }
Expand Down Expand Up @@ -105,8 +98,6 @@ button {
background-position: 0 -100%;
transition: 1.5s ease;
filter: hue-rotate(140deg);
opacity: 0;
visibility: hidden;
}
button:focus {
outline: 0 none;
Expand Down Expand Up @@ -142,11 +133,21 @@ button:hover {
display: block;
margin-bottom: 10px;
}
.copy {
position: absolute;
top: 0;
width: 100%;
height: 100%;
z-index: 0;
}
.copyinner {
opacity: 0;
visibility: hidden;
}
.form {
text-align: center;
opacity: 0;
visibility: hidden;
transition: all ease-in-out 1.5s;
position: absolute;
top: 0;
width: 100%;
Expand Down

0 comments on commit a34d9af

Please sign in to comment.