Add final project showcase

Author: cooper-mj

.DS_Store

@@ -99,6 +99,33 @@ <h3 class="text-muted">the <span class="text-primary">python</span> programming
         <div class="tab-content">
           <!-- Overview Tab -->
           <div role="tabpanel" class="tab-pane fade in active" id="overview">
+
+            <!-- Start of the Final Project Showcase -->
+            <!--
+            <div class="row">
+              <div>
+              <div class="projects">
+              <h4 class="text-primary">Final Project Showcase</h4>
+                <table class="table table-striped table-hover table-bordered">
+                  <thead>
+                    <tr>
+                      <th style="width:40%">Project</th>
+                      <th style="width:40%"></th>
+
+                    </tr>
+                  </thead>
+                  <tbody>
+                    <!-- Showcase inserted here by resources.js TODO - add closing
+                      comment to this when uncommenting the final project showcase
+                      since HTML comments don't nest
+                  </tbody>
+                </table>
+              </div>
+              <div>
+            </div>
+            -->
+            <!-- End of the Final Project Showcase -->
+
             <div class="row">
               <!-- Left Column -->
               <div class="col-md-4">

index.html

@@ -124,6 +124,15 @@ var gtag_trackAssignmentHandout = function(url) {
   });
 }
 
+var gtag_trackShowcaseLink = function(url) {
+  gtag('event', 'click', {
+    'event_category': 'resource:showcase',
+    'event_label': url,
+    'transport_type': DEFAULT_TRANSPORT_TYPE,
+    // 'event_callback': function(){document.location = url;}
+  });
+}
+
 var gtag_trackAssignmentStarterCode = function(url) {
   gtag('event', 'click', {
     'event_category': 'assignment:starter_code',

js/gtag_helper.js

@@ -205,6 +205,45 @@ function create_handout_tr(ho) {
   return $tr;
 }
 
+function create_showcase_tr(project) {
+  /*
+  <tr>
+    <td scope="row"> 
+      <b>Sample Project Title</b> <br> 
+         Sample Project Authors <br>
+         <a href="link_to_project"> [Check it Out!] </a>
+       </td>
+    <td> (Image, if applicable) </td>
+  </tr>
+  */
+  var $tr = $('<tr>').append(
+    $('<td>').append(
+    // $('<center>').attr('scope', 'row').append(
+    $('<b>').append(
+      project.Title.concat("<br>"))).append(
+      project.Authors.concat("<br>")).append(
+        create_anchor(project.href, project.DemoType, "None", gtag_trackShowcaseLink)
+      // )
+      ));
+
+  // Add images if they're applicable
+  if (project.img.length > 0){
+    $tr.append(
+      $('<td>').append(
+        '<img src="'.concat(project.img, '"">')
+      ));
+  }
+  else {
+    // Occupy the right hand column with something.
+    $tr.append(
+      $('<td>').append(
+        ""
+      ));
+  }
+
+  return $tr;
+}
+
 function create_announcement(announcement) {
   /*
   <div class="panel panel-default">
@@ -286,7 +325,7 @@ function create_week_heading_tr(week) {
 }
 
 // Actually fetch all the resources
-var RESOURCES_DIR = 'https://stanfordpython.com/res'
+var RESOURCES_DIR = 'http://localhost:8000/res'
 
 $.when(
   // Before we can do anything, make sure we have the proper data!
@@ -310,6 +349,9 @@ $.when(
   }),
   $.getJSON(RESOURCES_DIR + '/schedule.json', function(data) {
       schedule = data;
+  }),
+  $.getJSON(RESOURCES_DIR + '/projects.json', function(data) {
+      projects = data;
   })
 ).then(function() {
 
@@ -353,6 +395,14 @@ $.when(
     }
   }
 
+  for (var i = 0; i < projects.length; i++) {
+    var proj = projects[i];
+    var markup = create_showcase_tr(proj);
+    if (markup !== null) {
+      $(".projects tbody").append(markup);
+    }
+  }
+
   for (var i = 0; i < schedule.length; i++) {
     var week = schedule[i];
     var markup = create_week_heading_tr(week);

js/resources.js

@@ -0,0 +1,23 @@
+[
+    {
+        "uid": "4d4fd06d-adf8-4161-8fb0-27a9590231c2",
+        "Title": "Project Title",
+        "Authors": "Author1, Author2",
+        "DemoType": "GitHub",
+        "href": "https://google.com",
+        "img": "",
+        "imgAlt": "altText",
+        "ext": ""
+    },
+    {
+        "uid": "4d4fd06d-adf8-4161-8fb0-27a9590231c2",
+        "Title": "Project Title2",
+        "Authors": "Author1, Author2",
+        "DemoType": "GitHub",
+        "href": "https://google.com",
+        "img": "https://www.python.org/static/community_logos/python-logo.png",
+        "imgAlt": "altText",
+        "ext": ""
+
+    }
+]