Skip to content

Commit

Permalink
emptied index-02.html
Browse files Browse the repository at this point in the history
  • Loading branch information
lbologna authored Aug 6, 2024
1 parent d7c2bce commit a949304
Showing 1 changed file with 0 additions and 249 deletions.
249 changes: 0 additions & 249 deletions index-02.html
Original file line number Diff line number Diff line change
@@ -1,250 +1 @@
<!DOCTYPE html>

<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>sns-yt-comments</title>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
</head>

<body id="banner" onload="execute()">
<script>
// Make sure the client is loaded before calling this method.
async function execute() {
document.getElementById("1a").innerHTML = '<br><br><div class="text-center"><div class="spinner-border" role="status"></div></div> '
document.getElementById("2a").innerHTML = '<br><br><div class="text-center"><div class="spinner-border" role="status"></div></div> '
document.getElementById("3a").innerHTML = '<br><br><div class="text-center"><div class="spinner-border" role="status"></div></div> '

const fetchResSNS = await fetch("https://lucaleonardobologna.it/snscommentsfull/");
const jsonDataSNS = await fetchResSNS.json();
populate(jsonDataSNS, "1a");

const fetchResSC = await fetch("https://lucaleonardobologna.it/sccommentsfull/");
const jsonDataSC = await fetchResSC.json();
populate(jsonDataSC, "2a");

const fetchResPGENG = await fetch("https://lucaleonardobologna.it/pgengcommentsfull/");
const jsonDataPGENG = await fetchResPGENG.json();
populate(jsonDataPGENG, "3a");
}


function populate(res, divId) {
let mainSnSdiv = document.getElementById(divId);
mainSnSdiv.innerHTML = "";
mainSnSdiv.scrollTop = 0;

// Handle the results here (response.result has the parsed body).
res["items"].forEach(element => {
/* container div */
let cdiv = document.createElement("div");
cdiv.classList.add("container", "border");
cdiv.setAttribute("style", "padding-top:4px; padding-bottom:4px")

/* author-time row" */
let authorTimeRow = document.createElement("div");
authorTimeRow.classList.add("row");
/* author div */
let authorDiv = document.createElement("div");
authorDiv.classList.add("col-8", "text-wrap", "text-break")
authorDiv.setAttribute("style", "font-size:14px")
let author = element["snippet"]["topLevelComment"]["snippet"]["authorDisplayName"];
let authorImage = element["snippet"]["topLevelComment"]["snippet"]["authorProfileImageUrl"];

authorDiv.innerHTML = "<img width=22px src='" + authorImage + "''> <strong>" + author + "</strong>";
/* time div */
let timeDiv = document.createElement("div");
timeDiv.classList.add("col-4")
timeDiv.setAttribute("style", "font-size:13px")
let creationDateString = element["snippet"]["topLevelComment"]["snippet"]["updatedAt"];
let currentTime = new Date();
let creationDate = new Date(creationDateString);
let timeToDisplay = timeText(currentTime, creationDate);
timeDiv.innerHTML = timeToDisplay;
/* */
authorTimeRow.appendChild(authorDiv)
authorTimeRow.appendChild(timeDiv)
cdiv.appendChild(authorTimeRow)

/* comment row */
let commentRow = document.createElement("div");
commentRow.classList.add("row");
commentRow.setAttribute("style", "margin-top:8px; margin-bottom:12px;")
let commentDiv = document.createElement("div");
commentDiv.classList.add("col-12", "text-wrap", "text-break");
let comment = element["snippet"]["topLevelComment"]["snippet"]["textOriginal"];
commentDiv.innerHTML = comment + "<br>";
commentRow.appendChild(commentDiv)
cdiv.appendChild(commentRow)

/* footer row */
let footerRow = document.createElement("div");
footerRow.classList.add("row");
footerRow.setAttribute("style", "font-size:13px; background-color: #f1f1f1; padding-bottom:7px; padding-top:7px")
let footerDiv = document.createElement("div");
footerDiv.classList.add("col-12", "text-wrap", "text-break");
let videoID = element["snippet"]["topLevelComment"]["snippet"]["videoId"];
let videoTitle = element["videoTitle"]
let videoPublishedAt = new Date(element["videoPublishedAt"])
let timeVideoPublished = timeText(currentTime, videoPublishedAt);
let linkToAppPre = "intent://m.youtube.com/watch?v=";
let linkToAppPost = "&feature=mweb_c3_open_app&itc_campaign=mweb_c3_open_app&redirect_app_store_ios=1&app=desktop#Intent;package=com.google.android.youtube;scheme=vnd.youtube;launchFlags=268435456;end"
let linkToApp = linkToAppPre + videoID + linkToAppPost;
let replies = element["snippet"]["totalReplyCount"];

let videoDetailsDiv = document.createElement("div");
videoDetailsDiv.classList.add("col-12")
let answersDiv = document.createElement("div");
answersDiv.classList.add("col-4")
let appDiv = document.createElement("div");
appDiv.classList.add("col-3")
let urlDiv = document.createElement("div");
urlDiv.classList.add("col-3")
let arrowDiv = document.createElement("div");
arrowDiv.classList.add("col-2")

videoDetailsDiv.innerHTML = "<strong>" + videoTitle + "</strong>" + " - " + timeVideoPublished;
answersDiv.innerHTML = "<strong>Risposte: " + replies;

appDiv.innerHTML = "<a href='" + linkToApp + "'><i class='bi bi-youtube'></i> App</a>"
urlDiv.innerHTML = "<a href='https://www.youtube.com/watch?v=" + videoID + "' target=_blank><i class='bi bi-youtube'></i> Url</a>";
arrowDiv.innerHTML = "<a href='#banner'><i class='bi bi-arrow-up'></i><a>"

footerRow.appendChild(videoDetailsDiv)
footerRow.appendChild(answersDiv)
footerRow.appendChild(appDiv)
footerRow.appendChild(urlDiv)
footerRow.appendChild(arrowDiv)

cdiv.appendChild(footerRow)

let titleContentDiv = document.createElement("div");
titleContentDiv.classList.add("col-12");

cdiv.scrollTop = 0;
mainSnSdiv.appendChild(cdiv);
});
}


/* ------------ */

function timeText(currentTime, creationDate) {
// To calculate the time difference of two dates
var DifferenceInTime = currentTime.getTime() - creationDate.getTime();

// To calculate the no. of days between two dates
let diffDays = DifferenceInTime / (1000 * 3600 * 24);
let diffHours = diffDays * 24;
let diffMinutes = diffHours * 60;
let diffYears = diffDays/365;
let diffMonths = diffDays/30;
let timeToDisplay = "";
if (diffYears > 1){
let displayTime = Math.floor(diffYears);
if (displayTime == 1)
text = " anno fa"
else
text = " anni fa"
timeToDisplay = displayTime + text
}
else if (diffMonths > 1){
let displayTime = Math.floor(diffMonths);
if (displayTime == 1)
text = " mese fa"
else
text = " mesi fa"
timeToDisplay = displayTime + text
}
else if (diffDays > 1) {
let displayTime = Math.floor(diffDays);
if (displayTime == 1)
text = " giorno fa"
else
text = " giorni fa"
timeToDisplay = displayTime + text;
} else if (diffHours > 1) {
let displayTime = Math.floor(diffHours);
if (displayTime == 1)
text = " ora fa"
else
text = " ore fa"
timeToDisplay = displayTime + text;
} else {
let displayTime = Math.ceil(diffMinutes);
if (displayTime == 1)
text = " min fa"
else
text = " min fa"
timeToDisplay = displayTime + text;
}
timeToDisplay = timeToDisplay;
return timeToDisplay;
}



</script>

<!-- Tab content -->
<div id="exTab1" class="">
<div id="" class="sticky-top container" style="margin-top:2px">
<ul class=" nav nav-pills nav-fill gap-2 p-1 small bg-primary rounded-5 shadow-sm" id="pillNav2" role="tablist"
style="--bs-nav-link-color: var(--bs-white); --bs-nav-pills-link-active-color: var(--bs-primary); --bs-nav-pills-link-active-bg: var(--bs-white);">
<li class="nav-item" role="presentation">
<button href="#1a" class="nav-link active rounded-5" id="home-tab2" data-bs-toggle="tab" type="button"
role="tab" aria-selected="true">SnS</button>
</li>
<li class="nav-item" role="presentation">
<button href="#2a" class="nav-link rounded-5" id="profile-tab2" data-bs-toggle="tab" type="button" role="tab"
aria-selected="false">Siate Curiosi</button>
</li>
<li class="nav-item" role="presentation">
<button href="#3a" class="nav-link rounded-5" id="contact-tab2" data-bs-toggle="tab" type="button" role="tab"
aria-selected="false">PG Eng</button>
</li>
</ul>
<button id="updateBtn" onclick="execute()"
style="background-color: white; border-color: #ffd174; border-width: 4px; --bs-btn-padding-y: .25rem; --bs-btn-padding-x: .5rem; --bs-btn-font-size: .75rem; margin-top:6px; margin-bottom:6px"
type="button" class="container rounded-4 btn">
Aggiorna
</button>
</div>
<div id="tab-container" class=" container ">
<div class="row tab-content clearfix">
<div class="tab-pane active" id="1a">
</div>
<div class="tab-pane" id="2a">
</div>
<div class="tab-pane" id="3a">
</div>
</div>
</div>

</div>

<!-- Tab content -->

<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
</div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-HwwvtgBNo3bZJJLYd8oVXjrBZt8cqVSpeBNS5n7C8IVInixGAoxmnlMuBnhbgrkm"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"
integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"
integrity="sha384-Rx+T1VzGupg4BHQYs2gCW9It+akI2MM/mndMCy36UVfodzcJcF0GGLxZIzObiEfa"
crossorigin="anonymous"></script>
<script> document.querySelectorAll('.nav-link').forEach(linkItem => {
linkItem.addEventListener('click', _ => {
window.scrollTo(0, 0)
})
})</script>
</body>
</html>

0 comments on commit a949304

Please sign in to comment.