css filters and event

This commit is contained in:
Tim Wijma
2022-11-02 14:39:12 +01:00
8 changed files with 132 additions and 59 deletions

View File

@@ -1,28 +1,3 @@
let root = document.documentElement // Used for css variables
let selectedSports = []
$(".sport").on("click", function() {
$(this).toggleClass("selected")
let sportName = $(this).children()[1].innerHTML // 2nd element, which is the sport name
let index = selectedSports.indexOf(sportName)
if (index > -1 ) { // If element is found in array
selectedSports.splice(index, 1) // Remove sport at index
} else {
selectedSports.push(sportName) // Add sport to array
}
$(this).trigger("selected", [selectedSports.includes(sportName), selectedSports]) // Trigger event
showFeeds()
})
function getCSSVariable(name) {
return getComputedStyle(root).getPropertyValue(name)
}
function showFeeds() {
if ($(window).width() < 1280) {
if (selectedSports.length === 0) {
@@ -38,23 +13,15 @@ function showFeeds() {
}
}
$(window).on("resize", function(){
showFeeds()
});
$(window).on("load", function() {
showFeeds()
})
function tweetCell(tweet) {
var cell = document.createElement("div");
cell.innerHTML =
`<div class="tweet">
<img src="${tweet.user.profile_image_url}" alt="" class="tweet-profilepicture">
<a href ="https://www.twitter.com/${tweet.user.screen_name}"><img src="${tweet.user.profile_image_url}" alt="" class="tweet-profilepicture"></a>
<div class="tweet-content">
<div class="tweet-name">
<span class="tweet-nickname">${tweet.user.name}</span>
<span class="tweet-username">@${tweet.user.screen_name}</span>
<a class="tweet-nickname" href = "https://www.twitter.com/${tweet.user.screen_name}" target = "_blank">${tweet.user.name}</a>
<a class="tweet-username" href = "https://www.twitter.com/${tweet.user.screen_name}" target = "_blank">@${tweet.user.screen_name}</a>
</div>
<span class="tweet-text">${tweet.text}</span>
<div class="tweet-interactions">
@@ -76,7 +43,7 @@ function tweetCell(tweet) {
return cell
}
function filter(tweets, bannedWords=[], searchWords=[], likesTop=null, likesBottom=null, retweetsTop=null, retweetsBottom=null, repliesTop=null, repliesBottom=null) {
function filterTweets(tweets, bannedWords=[], searchWords=[], likesTop=null, likesBottom=null, retweetsTop=null, retweetsBottom=null, repliesTop=null, repliesBottom=null) {
if(bannedWords.length > 0){
tweets = filterBannedWords(bannedWords, tweets)
}
@@ -153,3 +120,24 @@ function filterReplies(repliesTop, repliesBottom, tweets){
}
return tweets
}
function sortTweets(tweets, likesDes=null, retweets=null, replies=null){
if(likesDes && likesDes!=null){
tweets.sort(function(a,b){return b.favorite_count-a.favorite_count})
} else if (!likesDes && likesDes!=null){
tweets.sort(function(a,b){return a.favorite_count-b.favorite_count})
}
if(retweets && retweets!=null){
tweets.sort(function(a,b){return b.retweet_count-a.retweet_count})
} else if (!retweets && retweets!=null){
tweets.sort(function(a,b){return a.retweet_count-b.retweet_count})
}
if(replies && replies!=null){
tweets.sort(function(a,b){return b.reply_count-a.reply_count})
} else if (!replies && replies!=null){
tweets.sort(function(a,b){return a.reply_count-b.reply_count})
}
return tweets
}
var tweets = [{"likes": 2},{"likes": 3},{"likes": 5},{"likes": 1}]