API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Jul 15th, 2016
94
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
JavaScript 12.14 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3.    
  4.    <head>
  5.       <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
  6.      <script src = "https://code.jquery.com/jquery.js"></script>
  7.  
  8.  
  9.      <title>News Aggregation</title>
  10.      <meta name = "viewport" content = "width = device-width, initial-scale = 1.0">
  11.      
  12.      <!-- Bootstrap -->
  13.      <link href = "css/bootstrap.min.css" rel = "stylesheet">
  14.       <link href = "css/main.css" rel = "stylesheet">
  15.      
  16.      
  17.      <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  18.      <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  19.      
  20.       <!--[if lt IE 9]>
  21.       <script src = "https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
  22.       <script src = "https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
  23.       <![endif]-->
  24.      
  25.       <script type="text/javascript" src="https://www.google.com/jsapi"></script>
  26.         <script>
  27.  
  28.             function dateWork(){
  29.             var currDate = new Date();
  30.                 var hours = currDate.getHours();
  31.                 var ampm = 'AM';
  32.                 if (hours === 0 ) {
  33.                     hours = 12;
  34.                 } else if (hours === 12) {
  35.                     ampm = 'PM';
  36.                 } else if (hours > 12){
  37.                     hours = hours - 12;
  38.                     ampm = 'PM';
  39.                 }
  40.                 var minutesStr = '' + currDate.getMinutes();
  41.  
  42.                 if (currDate.getMinutes() < 10){
  43.                     minutesStr = '0' + minutesStr;
  44.                 }
  45.                 var dateString = (currDate.getMonth() + 1) + '/' + currDate.getDate() + '/' +
  46.                     currDate.getFullYear() + ' at ' + hours + ':' + minutesStr + ' ' + ampm;
  47.                 return dateString;
  48.         }
  49.         function everything(){
  50.  
  51.                
  52.  
  53.  
  54.             $("#create-acct-btn").click(function(){
  55.                 $("#auth-errs").text("");
  56.                 $("#auth-success").text("");
  57.                 $.ajax({
  58.                     method: "POST",
  59.                     url: "create-account.php",
  60.                     data: {
  61.                         username: $("#username").val(),
  62.                         password: $("#password").val()
  63.                     },
  64.                     dataType: "json",
  65.                     success: function(data, status){
  66.                         if (data.errCode == 1){
  67.                             // Username already exists
  68.                             $("#auth-errs").text(data.errText);
  69.                         } else {
  70.                             // Account creation successful
  71.                             $("#login-success").text(data.successText);
  72.                         }
  73.                     },
  74.                     error: function(data, status, errorThrown){
  75.                         //alert("ERROR: " + JSON.stringify(data) + " " + status + " " + errorThrown);
  76.                     }
  77.                 });
  78.             });
  79.  
  80.             $("#login-btn").click(function(){
  81.                 $("#auth-errs").text("");
  82.                 $("#acct-created").text("");
  83.                 $.ajax({
  84.                     method: "POST",
  85.                     url: "login.php",
  86.                     data: {
  87.                         username: $("#username").val(),
  88.                         password: $("#password").val()
  89.                     },
  90.                     dataType: "json",
  91.                     success: function(data, status){
  92.                         if(data.errCode == 1){
  93.                             // Bad password
  94.                             $("#auth-errs").text(data.errText);
  95.                         } else if (data.errCode == 2){
  96.                             // Nonexistant username
  97.                             $("#auth-errs").text(data.errText);
  98.                         } else {
  99.                             // Login successful
  100.                             $(".auth-box").hide();
  101.                             $(".logged-in-head").css("opacity", 1);
  102.                             $("#main-content").show();
  103.                             $(".userDisplay").text(data.username);
  104.                             var userDateStr = data.username + 'lastDate';
  105.                             var lastVisit = localStorage.getItem(userDateStr);
  106.                             if (lastVisit != null) {
  107.                                 $(".timeDisplay").text(lastVisit);
  108.                             } else {
  109.                                 $(".timeDisplay").text('Never');
  110.                             }
  111.                             $(".filter-boxes input").prop('checked', true);
  112.                             var filters = {};
  113.                             var firstLoad = true;
  114.                             var allArticles;
  115.  
  116.                             function loadFeeds(callback){
  117.                                 var feedsArray = [  "http://feeds.reuters.com/Reuters/domesticNews",
  118.                                                     "http://feeds.reuters.com/Reuters/worldNews",
  119.                                                     "http://feeds.reuters.com/reuters/sportsNews",
  120.                                                     "http://w1.weather.gov/xml/current_obs/KROC.rss",
  121.                                                     "http://feeds.reuters.com/reuters/technologyNews"];
  122.                                 var articleArray = [];
  123.                                 var count = 0;                 
  124.                                 for (var i in feedsArray){
  125.                                     var feed = new google.feeds.Feed(feedsArray[i]);
  126.                                     feed.setNumEntries(6);
  127.                                     feed.load(function(result) {
  128.                                         if (!result.error) {
  129.                                             articleArray = articleArray.concat(result.feed.entries);
  130.                                         }
  131.                                         count++;
  132.                                         if (count == feedsArray.length) {
  133.                                             allArticles = articleArray;
  134.                                             callback(articleArray);
  135.                                         }
  136.                                     });
  137.                                 }
  138.  
  139.                                
  140.                             }
  141.  
  142.                             function updateFilters(){
  143.  
  144.                                 var boxArray = $(".filter-boxes input");
  145.                                 for (var i in boxArray){
  146.                                     filters[boxArray[i].id] = boxArray[i].checked;
  147.                                 }
  148.                                 if (firstLoad){
  149.  
  150.                                 } else {
  151.                                     drawArticles(allArticles);
  152.                                 }
  153.                             }
  154.  
  155.                             updateFilters();
  156.  
  157.                             $(".filter-boxes .checkbox").click(updateFilters);
  158.  
  159.                             localStorage.setItem(userDateStr, dateWork());
  160.  
  161.                             var favorites = (data.favorites || []);
  162.  
  163.                             function saveFavorites(){
  164.                                 $.ajax({
  165.                                     method: "POST",
  166.                                     url: "saveFaves.php",
  167.                                     data: {username: data.username, favorites: {array: favorites}},
  168.                                     dataType: "json"
  169.                                 });
  170.                             }
  171.  
  172.                             function drawFavorites(){
  173.  
  174.                                 var favCont = $("#favContent");
  175.                                 favCont.html("");
  176.  
  177.                                 for (var i in favorites){
  178.                                     var favItem = $('<div class="favItem"></div>');
  179.                                     favItem.html(
  180.                                                 "<a href=" + favorites[i].link + "\">" + favorites[i].title + "</a>" +
  181.                                                 "<button type=\"button\" class=\"btn btn-primary-outline unFavBtn\" my-fav= \"" + i + "\">" +
  182.                                                 "<span class=\"glyphicon glyphicon-trash\" aria-hidden=\"true\"></span></button>"
  183.                                                 );
  184.                                     favCont.append(favItem);
  185.  
  186.                                 }
  187.                                 $(".unFavBtn").click(function(){
  188.                                     var index = Number($(this).attr("my-fav"));
  189.                                     favorites.splice(index, 1);
  190.                                     drawFavorites();
  191.                                     saveFavorites();
  192.                                 });
  193.                             }
  194.                             drawFavorites();
  195.  
  196.                            
  197.  
  198.                             function filterArticles(articleArray){
  199.                                 var filtTrans = {
  200.                                     domesticNews: "us-check",
  201.                                     worldNews: "world-check",
  202.                                     sportsNews: "sports-check",
  203.                                     technologyNews: "tech-check",
  204.                                     weather: "weather-check"
  205.                                 };
  206.                                 var filtered = [];
  207.                                 for (var i in articleArray){
  208.                                     var filterKey = filtTrans[(articleArray[i].categories[0] || "weather")];
  209.                                     if(filters[filterKey]){
  210.                                         filtered.push(articleArray[i]);
  211.                                     }
  212.                                 }
  213.                                 return filtered;
  214.                             }
  215.  
  216.                             function drawArticles(articleArray) {
  217.                                 firstLoad = false;
  218.                                 articleArray = filterArticles(articleArray);
  219.  
  220.                                 articleArray.sort(function dateComp(article1, article2){
  221.                                     var d1;
  222.                                     var d2;
  223.                                     if (article1.publishedDate != "") {
  224.                                         d1 = new Date(article1.publishedDate);
  225.                                     } else {
  226.                                         d1 = new Date();
  227.                                     }
  228.                                     if (article2.publishedDate != "") {
  229.                                         d2 = new Date(article2.publishedDate);
  230.                                     } else {
  231.                                         d2 = new Date();
  232.                                     }
  233.                                    
  234.                                     if (d1 > d2) {
  235.                                         return -1;
  236.                                     } else if (d1 == d2){
  237.                                         return 0;
  238.                                     } else {
  239.                                         return 1;
  240.                                     }
  241.                                 });
  242.  
  243.                                 var articleCont = $("#rssBody");
  244.                                 articleCont.html("");
  245.                                 var catTrans = {
  246.                                     domesticNews: "US News",
  247.                                     worldNews: "World News",
  248.                                     sportsNews: "Sports",
  249.                                     technologyNews: "Technology"
  250.                                 };
  251.                                 for (var i in articleArray){
  252.                                     var artDate = (articleArray[i].publishedDate || "Right Now         ");
  253.                                     var articleItem = $('<div class="articleItem"></div>');
  254.                                     articleItem.html(
  255.                                                     "<button type=\"button\" class=\"btn btn-primary-outline favBtn\" my-article= \"" + i + "\">" +
  256.                                                     "<span class=\"glyphicon glyphicon-heart\" aria-hidden=\"true\"></span></button>" +
  257.                                                     "<a href=" + articleArray[i].link + "\">" + articleArray[i].title + "</a><br>" +
  258.                                                     "<span class= \"articleTime\">(" + artDate.substring(0, artDate.length - 9) + ")</span><br>" +
  259.                                                     "<span class= \"snippet\">" + articleArray[i].contentSnippet + "</span>" +
  260.                                                     "<span class= \"category\">" + (catTrans[articleArray[i].categories[0]] || "Weather") + "</span>"
  261.                                                     );
  262.  
  263.                                     articleCont.append(articleItem);
  264.                                 }
  265.  
  266.                                 $(".favBtn").click(function(){
  267.                                     var index = Number($(this).attr("my-article"));
  268.                                     favorites.push({title: articleArray[index].title, link: articleArray[index].link});
  269.                                     drawFavorites();
  270.                                     saveFavorites();
  271.                                 });
  272.  
  273.                             }
  274.  
  275.                             loadFeeds(drawArticles);
  276.                         }
  277.                        
  278.                     },
  279.                     error: function(data, status, errorThrown){
  280.                         //alert("ERROR: " + JSON.stringify(data) + " " + status + " " + errorThrown);
  281.                     }
  282.                 });
  283.             });
  284.  
  285.             $("#logout-button").click(function(){
  286.                 $("#main-content").hide();
  287.                 $(".logged-in-head").css("opacity", 0);
  288.                 $(".auth-box").show();
  289.             });
  290.  
  291.  
  292.  
  293.  
  294.     /*
  295.             "http://feeds.reuters.com/Reuters/domesticNews", //US News
  296.             "http://feeds.reuters.com/Reuters/worldNews", //World News
  297.             "http://feeds.reuters.com/reuters/sportsNews", //Sports
  298.             "http://w1.weather.gov/xml/current_obs/KROC.rss", //Weather
  299.             "http://feeds.reuters.com/reuters/technologyNews" //Technology
  300. */
  301.  
  302.         }; //everything
  303.  
  304.  
  305.             google.load("feeds", "1");
  306.             google.setOnLoadCallback(everything);
  307.         </script>
  308.    </head>
  309.    
  310.    <body>
  311.  
  312.      
  313.      
  314.       <!-- Include all compiled plugins (below), or include individual files as needed -->
  315.       <script src = "js/bootstrap.min.js"></script>
  316.      
  317.       <div class = "container centered">
  318.    
  319.         <div class = "bg-primary row" id="head-content">
  320.             <div class = "logged-in-head last-visit col-xs-3" id="welcome-box">
  321.                 Welcome <span class="userDisplay"></span>.<br>
  322.                 Last visit was on: <span class="timeDisplay"></span>.<br>
  323.             </div>
  324.             <div class = "main-col col-xs-6 text-left">
  325.                 <h1>News Aggregation</h1>
  326.             </div>
  327.             <div class = "logged-in-head col-xs-3 text-right">
  328.                 <br><button type="button" class="btn btn-danger btn-sm" id="logout-button">Logout</button> 
  329.             </div>
  330.  
  331.         </div>
  332.         <div class="row" id="auth-row">
  333.             <div class="auth-box">
  334.                 <input type="text" class="form-control" id="username" placeholder="Username">
  335.                 <input type="password" class="form-control" id="password" placeholder="Password">
  336.                 <div class="btn-group btn-group-justified">
  337.                     <div class="btn-group"><button type="button" class="btn btn-default" id="create-acct-btn">Create Account</button></div>
  338.                     <div class="btn-group"><button type="button" class="btn btn-primary" id="login-btn">Login</button></div>
  339.                 </div>
  340.             </div>
  341.             <div class="err-box text-danger" id="auth-errs"></div>
  342.             <div class="success-box text-success" id="auth-success"></div>
  343.         </div>
  344.         <div class = "row" id="main-content">
  345.            
  346.             <div class = "col-xs-8" style=" border-right: 1px solid #ccc; border-left: 1px solid #ccc;">
  347.                 <div id="rssBody">
  348.                 Loading...
  349.                 <!--
  350.                     <div id="feedControl" class= "feedControl">Loading...</div>
  351.                 -->
  352.                 </div>
  353.             </div>
  354.             <div class = "col-xs-4" id="favorites">
  355.                 <h3>Content Filters</h3>
  356.                 <div class="filter-boxes">
  357.                     <label class="checkbox active">
  358.                       <input type="checkbox" checked id="us-check">US News
  359.                     </label>
  360.                     <label class="checkbox active">
  361.                       <input type="checkbox" checked id="world-check">World News
  362.                     </label>
  363.                     <label class="checkbox active">
  364.                       <input type="checkbox" checked id="sports-check">Sports
  365.                     </label>
  366.                     <label class="checkbox active">
  367.                       <input type="checkbox" checked id="weather-check">Weather
  368.                     </label>
  369.                     <label class="checkbox active">
  370.                       <input type="checkbox" checked id="tech-check">Technology
  371.                     </label>
  372.                 </div>
  373.                 <h3><span class= "fav-text">Favorites</span></h3>
  374.                 <div class="fav-list" id="favContent">Loading...</div>
  375.                
  376.             </div>
  377.                
  378.         </div>
  379.    
  380.     </div>
  381.  
  382.  
  383.     </body>
  384. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!