Projects can now add documentation and quickstart widgets

[#52044647]

_includes/documentation.html

@@ -0,0 +1 @@
+<div class="js-documentation-widget"></div>

_includes/quickstart.html

@@ -0,0 +1,9 @@
+<h3>Quick Start (TBD)</h3>
+<div class="js-quickstart-selector"></div>
+<div>
+    Maven/Gradle
+</div>
+<p>
+    Hypatia globular star cluster, corpus callosum laws of physics globular star cluster? Rings of Uranus corpus callosum? Trillion prime number colonies kindling the energy hidden in matter, a still more glorious dawn awaits the carbon in our apple pies citizens of distant epochs Apollonius of Perga star stuff harvesting star light prime number encyclopaedia galactica the sky calls to us circumnavigated paroxysm of global death preserve and cherish that pale blue dot shores of the cosmic ocean radio telescope a billion trillion at the edge of forever. Tingling of the spine. Take root and flourish star stuff harvesting star light?
+</p>
+<div class="js-quickstart-maven-widget"></div>

_includes/widget_template.html

@@ -23,3 +23,22 @@
         </tbody>
     </table>
 </script>
+
+<script type="text/html" id="project-quickstart-selector-template">
+    <select class='selector'>
+        <% _.each(releases, function(release, index) { %>
+            <option value="<%= index %>"><%= release.fullName %> (<%= release.statusIconClass() %>)</option>
+        <% }); %>
+    </select>
+</script>
+
+<script type="text/html" id="project-quickstart-maven-widget-template">
+    <pre>
+&lt;dependency&gt;
+    &lt;groupId&gt;<%= groupId %>&lt;/groupId&gt;
+    &lt;artifactId&gt;<%= artifactId %>&lt;/artifactId&gt;
+    &lt;version&gt;<%= fullName %>&lt;/version&gt;
+&lt;/dependency&gt;
+    </pre>
+
+</script>

_layouts/default.html

@@ -27,6 +27,7 @@ api_base_url: http://localhost:8080
   <script type="text/javascript" src="js/application.js"></script>
   <script type="text/javascript">
     var apiBaseUrl = "{{ page.api_base_url }}";
+    var projectId = "{{ site.projectId }}";
   </script>
   <meta name="google-site-verification" content="7qGntFPD9lWAVCtUu5U77v4l68PsTHf6xpzgjQv2j2M" />
 </head>

js/projectDocumentationWidget.js

@@ -1,16 +1,32 @@
 window.Spring = window.Spring || {};
 
 Spring.ProjectDocumentationWidget = function() {
-  var projectId = $('[data-documentation-widget]').data('documentation-widget');
+  var quickStartEl = $('.js-quickstart-selector');
+  var documentationEl = $('.js-documentation-widget');
+
   var projectUrl = apiBaseUrl + "/projects/" + projectId;
   var promise = Spring.loadProject(projectUrl);
 
   promise.then(function(project) {
-    new Spring.ProjectDocumentationWidgetView({
-      el: '[data-documentation-widget]',
+    new Spring.WidgetView({
+      el: documentationEl,
       model: project,
       template: $("#project-documentation-widget-template").text()
     }).render();
+
+    var mavenWidget = new Spring.WidgetView({
+      el: $('.js-quickstart-maven-widget'),
+      model: project.releases[0],
+      template: $("#project-quickstart-maven-widget-template").text()
+    }).render();
+
+    new Spring.QuickStartSelectorView({
+      el: quickStartEl,
+      model: project,
+      template: $("#project-quickstart-selector-template").text(),
+      mavenWidget: mavenWidget
+    }).render();
+
   });
 };
 
@@ -23,7 +39,11 @@ Spring.loadProject = function(url) {
   });
 }
 
-Spring.Release = {
+Spring.Release = function(data) {
+  _.extend(this, data);
+}
+
+Spring.Release.prototype = {
   statusIconClass: function() {
     if (this.preRelease) {
       return "icon-projects-pre";
@@ -37,14 +57,15 @@ Spring.Release = {
 
 Spring.Project = function(data) {
   _.extend(this, data);
+  var self = this;
   this.releases = _.map(this.projectReleases, function(r) {
-    return _.extend(r, Spring.Release);
+    return new Spring.Release(r);
   });
 
   return this;
 };
 
-Spring.ProjectDocumentationWidgetView = Backbone.View.extend({
+Spring.WidgetView = Backbone.View.extend({
   initialize: function() {
     this.template = _.template(this.options.template);
     _.bindAll(this, "render");
@@ -57,4 +78,29 @@ Spring.ProjectDocumentationWidgetView = Backbone.View.extend({
     return this;
   }
 
+});
+
+Spring.QuickStartSelectorView = Backbone.View.extend({
+  events: {
+    "change .selector": "updateMaven"
+  },
+
+  initialize: function() {
+    this.template = _.template(this.options.template);
+    this.mavenWidget = this.options.mavenWidget;
+    _.bindAll(this, "render", "updateMaven");
+  },
+
+  render: function() {
+    this.$el.html(
+      this.template(this.model)
+    );
+    return this;
+  },
+
+  updateMaven: function() {
+    this.mavenWidget.model = this.model.releases[this.$('.selector :selected').val()];
+    this.mavenWidget.render();
+  }
+
 });

js/test/spec/ProjectSpec.js

@@ -5,6 +5,7 @@ describe("Project", function () {
 
     beforeEach(function () {
       project = new Spring.Project({
+        id: "spring-data-jpa",
         name: "Spring Data JPA",
         projectReleases: [
           {fullName: "1.4.0.RC1", refDocUrl: "http://localhost/1.4.0/ref", apiDocUrl: "http://localhost/1.4.0/api", preRelease: true, current: false, supported: false},