Lesson Overview updates

webgoat-container/src/main/resources/static/css/main.css

@@ -973,15 +973,8 @@ cookie-container {
     padding-top:2px;
 }
 
-.attack-link.solved-true {
-    color:#88FB88;
-}
-
 .attack-link.solved-false {
-    color:#f2baba;
+    background-color:#ac2925;
-}
-
-.attack-link.cur-page, .page-link.cur-page {
     color:#fff;
 }
 
@@ -989,6 +982,17 @@ cookie-container {
     color:#eee;
 }
 
+.attack-link.solved-true {
+    /*color:#88FB88;*/
+    background-color:#247506;
+    color:#fff;
+}
+
+.attack-link.cur-page, .page-link.cur-page {
+    color:#fff;
+    font-weight:bold;
+}
+
 .page-link-wrapper {
     display:inline-block;
 }

webgoat-container/src/main/resources/static/js/goatApp/controller/LessonController.js

@@ -18,17 +18,13 @@ define(['jquery',
     'goatApp/view/TitleView',
     'goatApp/model/LessonProgressModel',
     'goatApp/view/LessonProgressView',
-    'goatApp/view/LessonOverviewView',
+    'goatApp/view/LessonOverviewView'
-    'goatApp/model/LessonOverviewModel'
     ],
     function($,
         _,
         Backbone,
         LessonContentModel,
         LessonContentView,
-//        PlanView,
-//        SourceView,
-//        SolutionView,
         HintView,
         HelpControlsView,
         ParamView,
@@ -41,8 +37,7 @@ define(['jquery',
         TitleView,
         LessonProgressModel,
         LessonProgressView,
-        LessonOverviewView,
+        LessonOverviewView
-        LessonOverviewModel
     ) {
         'use strict'
 
@@ -50,8 +45,6 @@ define(['jquery',
             this.lessonContent = new LessonContentModel();
             this.lessonProgressModel = new LessonProgressModel();
             this.lessonProgressView = new LessonProgressView(this.lessonProgressModel);
-            this.lessonOverviewModel = new LessonOverviewModel();
-            this.lessonOverview = new LessonOverviewView(this.lessonOverviewModel);
             this.lessonContentView = options.lessonContentView;
             this.titleView = options.titleView;
             this.developerControlsView = new DeveloperControlsView();
@@ -63,7 +56,6 @@ define(['jquery',
                 this.userAndInfoView = new UserAndInfoView();
                 this.menuButtonView = new MenuButtonView();
                 this.listenTo(this.lessonContentView, 'assignment:complete', this.updateMenu);
-                this.listenTo(this.lessonContentView, 'assignment:complete', this.updateLessonOverview);
                 this.listenTo(this.lessonContentView, 'endpoints:filtered', this.filterPageHints);
             };
 
@@ -111,13 +103,11 @@ define(['jquery',
                 });
 
                 this.listenTo(this.helpControlsView,'hints:show',this.showHints);
-                this.listenTo(this.helpControlsView,'lessonOverview:show',this.showLessonOverview)
 
                 this.listenTo(this.helpControlsView,'lesson:restart',this.restartLesson);
                 this.listenTo(this.developerControlsView, 'dev:labels', this.restartLesson);
 
                 this.helpControlsView.render();
-                this.lessonOverview.hideLessonOverview();
                 this.titleView.render(this.lessonInfoModel.get('lessonTitle'));
             };
 
@@ -125,10 +115,6 @@ define(['jquery',
                 this.trigger('menu:reload')
             };
 
-            this.updateLessonOverview = function() {
-                this.lessonOverviewModel.fetch();
-            }
-
             this.onContentLoaded = function(loadHelps) {
                 this.lessonInfoModel = new LessonInfoModel();
                 this.listenTo(this.lessonInfoModel,'info:loaded',this.onInfoLoaded);
@@ -198,10 +184,6 @@ define(['jquery',
                 this.lessonHintView.render();
             };
 
-            this.showLessonOverview = function() {
-               this.lessonOverviewModel.fetch().then(this.lessonOverview.render());
-            };
-
             this.restartLesson = function() {
                 var self=this;
                 $.ajax({

webgoat-container/src/main/resources/static/js/goatApp/model/AssignmentStatusModel.js

@@ -0,0 +1,6 @@
+define([
+	'backbone'],
+	function(
+		Backbone) {
+	return Backbone.Model.extend({});
+});

webgoat-container/src/main/resources/static/js/goatApp/model/LessonOverviewCollection.js

@@ -0,0 +1,14 @@
+define([
+	'backbone',
+	'goatApp/model/AssignmentStatusModel'
+	],
+	function(
+		Backbone,
+		AssignmentStatusModel) {
+	return Backbone.Collection.extend({
+	    //tagName: 'ul',
+		url: 'service/lessonoverview.mvc',
+		model: AssignmentStatusModel
+	});
+});
+

webgoat-container/src/main/resources/static/js/goatApp/model/LessonOverviewModel.js

@@ -1,10 +0,0 @@
-define([
-	'backbone'],
-	function(
-		Backbone) {
-	return Backbone.Collection.extend({
-	    //tagName: 'ul',
-		url: 'service/lessonoverview.mvc'
-	});
-});
-

webgoat-container/src/main/resources/static/js/goatApp/view/HelpControlsView.js

@@ -34,7 +34,6 @@ function($,_,Backbone) {
 				this.$el.find('#show-solution-button').unbind().on('click',_.bind(this.showSolution,this)).show();
 			}
 
-			//this.$el.find('#show-lesson-overview-button').unbind().on('click', _.bind(this.showLessonOverview, this)).show();
 			this.$el.find('#restart-lesson-button').unbind().on('click',_.bind(this.restartLesson,this)).show();
 		},
 
@@ -52,9 +51,6 @@ function($,_,Backbone) {
 
 		restartLesson: function() {
 			this.trigger('lesson:restart');
-		},
-		showLessonOverview: function() {
-		    this.trigger('lessonOverview:show');
 		}
 	});
 });

webgoat-container/src/main/resources/static/js/goatApp/view/LessonContentView.js

@@ -60,6 +60,7 @@ define(['jquery',
             this.paginationControlView = new PaginationControlView(this.$contentPages,this.model.get('lessonUrl'));
          },
 
+
          getCurrentPage: function () {
             return this.currentPage;
          },
@@ -120,6 +121,7 @@ define(['jquery',
         markAssignmentComplete: function () {
             this.curForm.reset();
             $(this.curForm).siblings('.assignment-success').find('i').removeClass('hidden');
+            this.paginationControlView.updateModel();
         },
 
         markAssignmentIncomplete: function () {

webgoat-container/src/main/resources/static/js/goatApp/view/LessonOverviewView.js

@@ -1,19 +1,19 @@
 define(['jquery',
 	'underscore',
 	'backbone',
-	'goatApp/model/LessonOverviewModel',
+	'goatApp/model/LessonOverviewCollection',
     'text!templates/lesson_overview.html'],
 function($,
 	_,
 	Backbone,
-	LessonOverviewModel,
+	LessonOverviewCollection,
 	LessonOverviewTemplate) {
 	return Backbone.View.extend({
 	    template: LessonOverviewTemplate,
 		el:'#lesson-overview',
-		 initialize: function (lessonOverviewModel) {
+		 initialize: function (lessonOverviewCollection) {
-			this.model = lessonOverviewModel;
+			this.collection = lessonOverviewModel;
-			this.listenTo(this.model, 'change add remove update reset', this.render);
+			this.listenTo(this.collection, 'change add remove update reset', this.render);
 			this.hideLessonOverview();
 		},
 

webgoat-container/src/main/resources/static/js/goatApp/view/PaginationControlView.js

@@ -1,12 +1,12 @@
 define(['jquery',
         'underscore',
         'backbone',
-        'goatApp/model/LessonOverviewModel',
+        'goatApp/model/LessonOverviewCollection',
         'text!templates/paging_controls.html'],
     function ($,
               _,
               Backbone,
-              LessonOverviewModel,
+              LessonOverviewCollection,
               PaginationTemplate) {
         return Backbone.View.extend({
             template: PaginationTemplate,
@@ -14,24 +14,28 @@ define(['jquery',
 
             initialize: function ($contentPages,baseLessonUrl) {
                 this.$contentPages = $contentPages;
-                this.model = new LessonOverviewModel();
+                this.collection = new LessonOverviewCollection();
-                this.listenTo(this.model, 'change add remove update reset', this.render);
+                this.listenTo(this.collection, 'change add reset delete update', this.render);
                 this.numPages = this.$contentPages.length;
                 this.baseUrl = baseLessonUrl;
 
-                this.model.fetch();
+                this.collection.fetch();
                 this.initPagination();
                 this.render();
              },
 
-            render: function () {
+            render: function (e) {
                 this.parseLinks();
                 var t = _.template(this.template);
                 this.$el.html(t({'overview':this.lessonOverview}));
-               this.bindNavButtons();
+                this.bindNavButtons();
                 this.hideShowNavButtons();
             },
 
+            updateModel: function() {
+                this.collection.fetch();
+            },
+
             bindNavButtons: function() {
                 this.$el.find('span.glyphicon-class.glyphicon.glyphicon-circle-arrow-right.show-next-page').unbind().on('click',this.incrementPageView.bind(this));
                 this.$el.find('span.glyphicon-class.glyphicon.glyphicon-circle-arrow-left.show-prev-page').unbind().on('click', this.decrementPageView.bind(this));
@@ -42,17 +46,20 @@ define(['jquery',
                 var assignmentCount = this.$contentPages.find('.attack-container');
                 var solvedMap = {};
                 var pages = [];
-                // one pass on solved assignmets
+
-                _.each(this.model.toJSON(), function(assignment) {
+                _.each(this.collection.models, function(model) {
-                    if (assignment.solved) {
+                    //alert (model.get('solved'));
-                        var key = assignment.assignment.path; //.replace(/\//g,'');
+                     if (model.get('solved')) {
-                        solvedMap[key] = assignment.assignment.name;
+                        var key = model.get('assignment').path.replace(/\//g,'');
-                    }
+                        solvedMap[key] = model.get('assignment').name;
+                     }
+
                 });
 
                 isAttackSolved = function (path) {
                     //strip
                     var newPath = path.replace(/^\/WebGoat/,'');
+                    var newPath = newPath.replace(/\//g,'');
                     if (typeof solvedMap[newPath] !== 'undefined') {
                         return true;
                     }
@@ -68,7 +75,7 @@ define(['jquery',
                         pageClass = 'page-link';
                         pages.push({content:'content',pageClass:pageClass,curPageClass:curPageClass});
                     } else {
-                        var $assignmentForms = $(page).find('.attack-container form');
+                        var $assignmentForms = $(page).find('.attack-container form.attack-form');
                         // use for loop to avoid anonymous function scope hell
                         //var pageAssignments = {content:'attack',attacks:[]}
                         pageClass = 'attack-link'
@@ -87,6 +94,7 @@ define(['jquery',
                         pages.push({solvedClass:solvedClass,content:'assignment',curPageClass:curPageClass,pageClass:pageClass});
                     }
                 });
+
                 //assign to the view
                 this.lessonOverview = {
                     baseUrl: this.baseUrl,
@@ -134,7 +142,7 @@ define(['jquery',
                     this.hideNextPageButton();
                     this.showPrevPageButton;
                 }
-                this.render();
+                this.model.fetch();
             },
 
             decrementPageView: function() {
@@ -151,7 +159,7 @@ define(['jquery',
                     this.hidePrevPageButton();
                     this.showNextPageButton()
                 }
-                this.render();
+                this.model.fetch();
             },
 
             hideShowNavButtons: function () {