Skip to content

Commit

Permalink
Merge pull request #6 from Vartapratikriya/languageAndCategories
Browse files Browse the repository at this point in the history 
added category filter
  • Loading branch information
@gSayak
gSayak authored Sep 17, 2023
2 parents 19e4246 + 79735f6 commit 0588c5c
Show file tree
Hide file tree
Showing 3 changed files with 171 additions and 82 deletions.
243 changes: 165 additions & 78 deletions assets/js/insights.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,108 +2,195 @@ const urlParams = {};
const url = new URL(window.location.href);
const params = url.searchParams;
for (const [key, value] of params) {
urlParams[key] = value;
urlParams[key] = value;
}

fetch("https://vartapratikriya-api.vercel.app/articles/sentiment?filter_by=language")
fetch(
"https://vartapratikriya-api.vercel.app/articles/sentiment?filter_by=language"
)
.then((response) => response.json())
.then((data) => {
var chrt = document.getElementById("sentiment-chart").getContext("2d");
var chartId = new Chart(chrt, {
type: 'bar',
data: {
labels: Object.keys(data),
datasets: [{
label: "Sentiment Index",
data: Object.values(data),
backgroundColor: ['lightblue', 'aqua', "blue", "orange", "red", "lightgreen", "violet"],
borderColor: ['lightblue', 'aqua', "blue", "orange", "red", "lightgreen", "violet"],
borderWidth: 2,
}],
},
options: {
responsive: true,
},
});
})

fetch("https://vartapratikriya-api.vercel.app/articles/categories")
var chartId = new Chart(chrt, {
type: "bar",
data: {
labels: Object.keys(data),
datasets: [
{
label: "Sentiment Index",
data: Object.values(data),
backgroundColor: [
"lightblue",
"aqua",
"blue",
"orange",
"red",
"lightgreen",
"violet",
],
borderColor: [
"lightblue",
"aqua",
"blue",
"orange",
"red",
"lightgreen",
"violet",
],
borderWidth: 2,
},
],
},
options: {
responsive: true,
},
});
});

fetch("https://vartapratikriya-api.vercel.app/articles/categories")
.then((response) => response.json())
.then((data) => {
const counts = {};
data.articles.forEach(obj => {
const value = obj['category'];
if (counts[value]) {
data.articles.forEach((obj) => {
const value = obj["category"];
if (counts[value]) {
counts[value]++;
} else {
} else {
counts[value] = 1;
}
}
});
console.log(counts)
var chrt = document.getElementById("category-chart").getContext("2d");
var chartId = new Chart(chrt, {
type: 'pie',
data: {
labels: Object.keys(counts),
datasets: [{
label: "online tutorial subjects",
data: Object.values(counts),
backgroundColor: ['lightblue', 'aqua', "blue", "orange", "red", "lightgreen", "violet"],
hoverOffset: 5
}],
},
options: {
responsive: false,
},
});
})


fetch(`https://vartapratikriya-api-rumbleftw.vercel.app/articles/headlines?language=${urlParams['language']}`)
type: "pie",
data: {
labels: Object.keys(counts),
datasets: [
{
label: "online tutorial subjects",
data: Object.values(counts),
backgroundColor: [
"lightblue",
"aqua",
"blue",
"orange",
"red",
"lightgreen",
"violet",
],
hoverOffset: 5,
},
],
},
options: {
responsive: false,
},
});
});

fetch(
`https://vartapratikriya-api-rumbleftw.vercel.app/articles/headlines?language=${urlParams["language"]}`
)
.then((response) => response.json())
.then((data) => {
const container = document.getElementById("fact-check-list");
data.articles.forEach((article) => {
const listItem = document.createElement("li");
listItem.className = "fact-check-item py-3 mb-2 flex flex-col lg:flex-row border-gray-800 border-b";
const listItem = document.createElement("li");
listItem.className =
"fact-check-item py-3 mb-2 flex flex-col lg:flex-row border-gray-800 border-b";

const image = document.createElement("img");
image.src = article.urlToImage;
image.className =
"w-96 object-cover rounded-lg flex-grow-0 flex-shrink-0 justify-center lg:w-[20%] lg:mr-4 h-28 rounded-lg";
image.alt = "newsmobile.in";

const contentContainer = document.createElement("div");
contentContainer.className = "flex flex-col flex-grow";

const heading = document.createElement("h3");
heading.className = "text-sm font-semibold my-2 hover:text-[#FF4560]";
const anchor = document.createElement("a");
anchor.href = article.url;
anchor.textContent = article.title;
heading.appendChild(anchor);

const claimDate = document.createElement("p");
claimDate.className = "text-gray-800 text-xs mb-2";
claimDate.textContent = `Published on: ${article.publishedAt}`;

const claimant = document.createElement("p");
claimant.className = "text-xs lg:text-[10px] mb-2";
claimant.textContent = `Source: ${article.source.name}`;

const image = document.createElement("img");
image.src = article.urlToImage;
image.className = "w-96 object-cover rounded-lg flex-grow-0 flex-shrink-0 justify-center lg:w-[20%] lg:mr-4 h-28 rounded-lg";
image.alt = "newsmobile.in";
const rating = document.createElement("p");
rating.className = "text-xs lg:text-sm display-font mb-2";
rating.innerHTML = `<strong>Sentiment:</strong> ${
article.sentiment.label.charAt(0).toUpperCase() +
article.sentiment.label.slice(1)
}`;

const contentContainer = document.createElement("div");
contentContainer.className = "flex flex-col flex-grow";
contentContainer.appendChild(heading);
contentContainer.appendChild(claimDate);
contentContainer.appendChild(claimant);
contentContainer.appendChild(rating);

const heading = document.createElement("h3");
heading.className = "text-sm font-semibold my-2 hover:text-[#FF4560]";
const anchor = document.createElement("a");
anchor.href = article.url;
anchor.textContent = article.title;
heading.appendChild(anchor);
listItem.appendChild(image);
listItem.appendChild(contentContainer);

const claimDate = document.createElement("p");
claimDate.className = "text-gray-800 text-xs mb-2";
claimDate.textContent = `Published on: ${article.publishedAt}`;
container.appendChild(listItem);
});
});

fetch(
`https://vartapratikriya-api-rumbleftw.vercel.app/articles/categories?category=${urlParams["category"]}`
)
.then((response) => response.json())
.then((data) => {
const container = document.getElementById("fact-check-list");
data.articles.forEach((article) => {
const listItem = document.createElement("li");
listItem.className =
"fact-check-item py-3 mb-2 flex flex-col lg:flex-row border-gray-800 border-b";

const image = document.createElement("img");
image.src = article.urlToImage;
image.className =
"w-96 object-cover rounded-lg flex-grow-0 flex-shrink-0 justify-center lg:w-[20%] lg:mr-4 h-28 rounded-lg";
image.alt = "newsmobile.in";

const contentContainer = document.createElement("div");
contentContainer.className = "flex flex-col flex-grow";

const claimant = document.createElement("p");
claimant.className = "text-xs lg:text-[10px] mb-2";
claimant.textContent = `Source: ${article.source.name}`;
const heading = document.createElement("h3");
heading.className = "text-sm font-semibold my-2 hover:text-[#FF4560]";
const anchor = document.createElement("a");
anchor.href = article.url;
anchor.textContent = article.title;
heading.appendChild(anchor);

const rating = document.createElement("p");
rating.className = "text-xs lg:text-sm display-font mb-2";
rating.innerHTML = `<strong>Sentiment:</strong> ${article.sentiment.label.charAt(0).toUpperCase() +
article.sentiment.label.slice(1)}`;
const claimDate = document.createElement("p");
claimDate.className = "text-gray-800 text-xs mb-2";
claimDate.textContent = `Published on: ${article.publishedAt}`;

contentContainer.appendChild(heading);
contentContainer.appendChild(claimDate);
contentContainer.appendChild(claimant);
contentContainer.appendChild(rating);
const claimant = document.createElement("p");
claimant.className = "text-xs lg:text-[10px] mb-2";
claimant.textContent = `Source: ${article.source.name}`;

listItem.appendChild(image);
listItem.appendChild(contentContainer);
const rating = document.createElement("p");
rating.className = "text-xs lg:text-sm display-font mb-2";
rating.innerHTML = `<strong>Sentiment:</strong> ${
article.sentiment.label.charAt(0).toUpperCase() +
article.sentiment.label.slice(1)
}`;

container.appendChild(listItem);
contentContainer.appendChild(heading);
contentContainer.appendChild(claimDate);
contentContainer.appendChild(claimant);
contentContainer.appendChild(rating);

})
})
listItem.appendChild(image);
listItem.appendChild(contentContainer);

container.appendChild(listItem);
});
});
5 changes: 1 addition & 4 deletions assets/js/load.js
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,6 @@
fetch("https://vartapratikriya-api.vercel.app/config")
.then((response) => response.json())
.then((data) => {
console.log(data);

const titleElements = document.querySelectorAll(".department .title");

titleElements.forEach((element, index) => {
Expand All @@ -13,9 +11,8 @@ fetch("https://vartapratikriya-api.vercel.app/config")
// Create an <a> element with the appropriate href attribute
const categoryLink = document.createElement("a");
categoryLink.textContent = capitalizedCategory;
categoryLink.href = `language.html?language=${category.toLowerCase()}`;
categoryLink.href = `language.html?category=${category.toLowerCase()}`;

// Replace the content of the title element with the <a> element
element.innerHTML = ""; // Clear the existing content
element.appendChild(categoryLink);
});
Expand Down
5 changes: 5 additions & 0 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -194,6 +194,8 @@ <h3 class=" leading-5 font-medium text-white flex text-[11px] whitespace-nowrap"
</div>
</section><!-- End channels Section -->



<!-- Language Section -->
<section id="language" class="language">
<div class="container" data-aos="fade-up">
Expand All @@ -214,6 +216,9 @@ <h4 class="title"><a href=""></a></h4>

<!-- Language Section ends -->




<!-- ======= department Section ======= -->
<section id="department" class="department">
<div class="container" data-aos="fade-up">
Expand Down

0 comments on commit 0588c5c

Please sign in to comment.