131 lines
		
	
	
		
			4.0 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			131 lines
		
	
	
		
			4.0 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
| 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) {
 | |
|             $(".leftcol").show()
 | |
|             $(".centercol").hide()
 | |
|         } else {
 | |
|             $(".leftcol").hide()
 | |
|             $(".centercol").show()
 | |
|         }
 | |
|     } else {
 | |
|         $(".leftcol").show()
 | |
|         $(".centercol").show()
 | |
|     }
 | |
| }
 | |
| 
 | |
| $(window).on("resize", function(){
 | |
|     showFeeds()
 | |
| });
 | |
| 
 | |
| $(window).on("load", function() {
 | |
|     showFeeds()
 | |
| })
 | |
| 
 | |
| function tweetCell(tweet, parent) {
 | |
|     var cell = document.createElement("div");
 | |
|     cell.innerHTML =
 | |
|     `<div class="tweet">
 | |
|         <img src="${tweet.user.profile_image_url}" alt="" class="tweet-profilepicture">
 | |
|         <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>
 | |
|             </div>
 | |
|             <span class="tweet-text">${tweet.text}</span>
 | |
|             <div class="tweet-interactions">
 | |
|                 <div class="tweet-interaction tweet-likes">
 | |
|                     <span class="material-symbols-outlined">favorite</span>
 | |
|                     <span>${tweet.favorite_count}</span>
 | |
|                 </div>
 | |
|                 <div class="tweet-interaction tweet-retweets">
 | |
|                     <span class="material-symbols-outlined">repeat</span>
 | |
|                     <span>${tweet.retweet_count}</span>
 | |
|                 </div>
 | |
|                 <div class="tweet-interaction tweet-replies">
 | |
|                     <span class="material-symbols-outlined">chat_bubble</span>
 | |
|                     <span>${tweet.reply_count}</span>
 | |
|                 </div>
 | |
|             </div>
 | |
|         </div>
 | |
|     </div>`
 | |
|     parent.append(cell);
 | |
| }
 | |
| 
 | |
| for (let i = 0; i < 2; i++) {
 | |
|     tweetCell(atweet, $(".leftcol"));
 | |
| }
 | |
| 
 | |
|     var atweet = {
 | |
|         "created_at": "Sat Nov 16 12:51:41 +0000 2019",
 | |
|         "text": "@BobGreenburg @ONeill_Coffee Congrats to the excellent football program at Wilmington. One classy organization!",
 | |
|         "source": "<a href=\"http:\/\/twitter.com\/download\/iphone\" rel=\"nofollow\">Twitter for iPhone<\/a>",
 | |
|         "user": {
 | |
|             "name": "Express Youngstown",
 | |
|             "screen_name": "ExpressProsYO",
 | |
|             "url": "http:\/\/apply.expresspros.com\/",
 | |
|             "profile_image_url": "http:\/\/pbs.twimg.com\/profile_images\/775167844921188353\/fWquHsOK_normal.jpg",
 | |
|         },
 | |
|         "quote_count": 0,
 | |
|         "reply_count": 0,
 | |
|         "retweet_count": 0,
 | |
|         "favorite_count": 0,
 | |
|         "entities": {
 | |
|             "hashtags": [
 | |
|     
 | |
|             ],
 | |
|             "urls": [
 | |
|     
 | |
|             ],
 | |
|             "user_mentions": [
 | |
|                 {
 | |
|                     "screen_name": "BobGreenburg",
 | |
|                     "name": "Bob Greenburg",
 | |
|                     "id": 483881032,
 | |
|                     "id_str": "483881032",
 | |
|                     "indices": [
 | |
|                         0,
 | |
|                         13
 | |
|                     ]
 | |
|                 },
 | |
|                 {
 | |
|                     "screen_name": "ONeill_Coffee",
 | |
|                     "name": "O'NeillCoffeeCompany",
 | |
|                     "id": 2804543925,
 | |
|                     "id_str": "2804543925",
 | |
|                     "indices": [
 | |
|                         14,
 | |
|                         28
 | |
|                     ]
 | |
|                 }
 | |
|             ],
 | |
|             "symbols": [
 | |
|     
 | |
|             ]
 | |
|         },
 | |
|     } | 
