From 06a7a5099a69e3c3d122999b1b490a4957d77ba5 Mon Sep 17 00:00:00 2001
From: Brian Clozel <bclozel@pivotal.io>
Date: Mon, 9 Mar 2015 11:58:27 +0100
Subject: [PATCH] Display Pivotal Education related courseware

This change adds a new "Related Courseware" section in the side
container; this section lists links to courses and talks that are
relevant to the current project page.

Relevant content is fetched by the browser, with an AJAX request sent to
the Pivotal Education LMS API. This API uses the Referrer HTTP header as
input parameter to its content selection algorithm.

Note that CORS HTTP headers are also used to allow/disallow AJAX cross
domain requests.
---
 _includes/widget_templates.html  | 20 ++++++++++++++
 js/projectDocumentationWidget.js | 46 ++++++++++++++++++++++++++++++++
 2 files changed, 66 insertions(+)

diff --git a/_includes/widget_templates.html b/_includes/widget_templates.html
index 4e609c6fff..1495ae53dd 100644
--- a/_includes/widget_templates.html
+++ b/_includes/widget_templates.html
@@ -29,6 +29,26 @@
     </div>
 </script>
 
+<script type="text/html" id="project-courses-widget-template">
+    <h2>Related Courseware</h2>
+    {@ if(hasCourses) { @}
+        <h3 id="education">Pivotal Education</h3>
+        <ul>
+        {@ _.each(courses, function(course) { @}
+          <li><a href="{@= course.url @}">{@= course.name @}</a></li>
+        {@ }); @}
+        </ul>
+    {@ } @}
+    {@ if(hasTalks) { @}
+        <h3 id="talks">Engineering Talks</h3>
+        <ul>
+        {@ _.each(talks, function(talk) { @}
+          <li><a href="{@= talk.url @}">{@= talk.name @}</a></li>
+        {@ }); @}
+        </ul>
+    {@ } @}
+</script>
+
 <script type="text/html" id="project-download-widget-controls-template">
     <div class="js-download-widget-selector">
         <select class='selector selectpicker'>
diff --git a/js/projectDocumentationWidget.js b/js/projectDocumentationWidget.js
index 900dab219a..f6123f721d 100644
--- a/js/projectDocumentationWidget.js
+++ b/js/projectDocumentationWidget.js
@@ -11,14 +11,19 @@ Spring.ProjectDocumentationWidget = function () {
   var quickStartEl = $('[data-download-widget-controls]');
   var mavenWidgetEl = $('.js-download-maven-widget');
   var documentationEl = $('.js-documentation-widget');
+  var resourcesEl = $('.project-sidebar-resource--wrapper');
 
   var projectUrl = apiBaseUrl + "/project_metadata/" + projectId;
   var promise = Spring.loadProject(projectUrl);
+  var coursesPromise = Spring.loadCourses("https://pivotallms.biglms.com/api/courses");
 
   promise.then(function (project) {
     Spring.buildDocumentationWidget(documentationEl, project);
     Spring.buildQuickStartWidget(quickStartEl, mavenWidgetEl, project);
   });
+  coursesPromise.then(function(courseware) {
+    Spring.buildCoursesWidget(resourcesEl, courseware);
+  });
 };
 
 Spring.buildDocumentationWidget = function (documentationEl, project) {
@@ -29,6 +34,17 @@ Spring.buildDocumentationWidget = function (documentationEl, project) {
   }).render();
 
 }
+Spring.buildCoursesWidget = function (resourcesEl, courseware) {
+  if(courseware.hasContent) {
+    var tpl = $("#project-courses-widget-template").text();
+    var view = new Spring.CoursesWidgetView({
+      el: resourcesEl,
+      model: courseware,
+      template: $("#project-courses-widget-template").text()
+    });
+    view.render();
+  }
+}
 Spring.buildQuickStartWidget = function (quickStartEl, mavenWidgetEl, project) {
   new Spring.QuickStartSelectorView({
     el: quickStartEl,
@@ -47,6 +63,13 @@ Spring.loadProject = function (url) {
     });
 }
 
+Spring.loadCourses = function (url) {
+  return $.getJSON(url)
+    .then(function(data) {
+      return new Spring.Courseware(data);
+  });
+}
+
 Spring.Release = function (data) {
   _.extend(this, data);
 }
@@ -63,6 +86,15 @@ Spring.Release.prototype = {
   }
 }
 
+Spring.Courseware = function (data) {
+  this.courses = data["edu1"];
+  this.talks = data["eng1"];
+  this.hasCourses = this.courses != null;
+  this.hasTalks = this.talks != null;
+  this.hasContent = this.hasTalks || this.hasCourses;
+  return this;
+};
+
 Spring.Project = function (data) {
   _.extend(this, data);
   var self = this;
@@ -87,6 +119,20 @@ Spring.DocumentationWidgetView = Backbone.View.extend({
   }
 });
 
+Spring.CoursesWidgetView = Backbone.View.extend({
+  initialize: function () {
+    this.template = _.template(this.options.template);
+    _.bindAll(this, "render");
+  },
+
+  render: function () {
+    this.$el.append(
+      this.template(this.model)
+    );
+    return this;
+  }
+});
+
 Spring.SnippetView = Backbone.View.extend({
   initialize: function () {
     var snippetType = this.options.snippetType;