Convert the message number parameter into the MVC route part. Correct the result of the restart lesson button.

webgoat-container/src/main/webapp/js/goatApp/controller/LessonController.js

@@ -51,23 +51,41 @@ define(['jquery',
                 this.menuButtonView = new MenuButtonView();
             };
 
-			this.loadLesson = function(scr,menu,stage) {
+            this.loadLesson = function(scr,menu,stage,num) {
+                console.log("Loading a lesson, scr: " + scr + ", menu: " + menu + ", stage: " + stage + ", num: " + num);
                 this.titleView = new TitleView();
                 this.helpsLoaded = {};
+                if (typeof(scr) == "undefined") {
+                    scr = null;
+                }
+                if (typeof(menu) == "undefined") {
+                    menu = null;
+                }
+                if (typeof(stage) == "undefined") {
+                    stage = null;
+                }
+                if (typeof(num) == "undefined") {
+                    num = null;
+                }
                 this.lessonContent.loadData({
-					'screen': scr,
+                    'scr': scr,
                     'menu': menu,
-					'stage': stage
+                    'stage': stage,
+                    'num': num,
                 });
                 this.planView = {};
                 this.solutionView = {};
                 this.sourceView = {};
                 this.lessonHintView = {};
-				this.screen = scr;
+                this.scr = scr;
                 this.menu = menu;
+                this.stage = stage;
+                this.num = num;
+                console.log("Lesson loading initiated")
             };
 
             this.onInfoLoaded = function() {
+                console.log("Lesson info loaded")
                 this.helpControlsView = new HelpControlsView({
                     hasPlan:this.lessonInfoModel.get('hasPlan'),
                     hasSolution:this.lessonInfoModel.get('hasSolution'),
@@ -87,6 +105,7 @@ define(['jquery',
             };
 
             this.onContentLoaded = function(loadHelps) {
+                console.log("Lesson content loaded")
                 this.lessonInfoModel = new LessonInfoModel();
                 this.listenTo(this.lessonInfoModel,'info:loaded',this.onInfoLoaded);
 
@@ -102,9 +121,10 @@ define(['jquery',
                     this.cookieView = new CookieView();
                     //TODO: instantiate model with values (not sure why was not working before)
                     var paramModel = new ParamModel({});
-					paramModel.set('screenParam',this.lessonContent.get('screenParam'));
+                    paramModel.set('scrParam',this.lessonContent.get('scrParam'));
                     paramModel.set('menuParam',this.lessonContent.get('menuParam'));
                     paramModel.set('stageParam',this.lessonContent.get('stageParam'));
+                    paramModel.set('numParam',this.lessonContent.get('numParam'));
                     this.paramView = new ParamView({model:paramModel});
 
                     $('.lesson-help').hide();
@@ -151,11 +171,22 @@ define(['jquery',
 
             this.restartLesson = function() {
                 var self=this;
+                var fragment = "attack/" + self.scr + "/" + self.menu;
+                console.log("Navigating to " + fragment);
+                // Avoiding the trigger event - handle - navigate loop by
+                // loading the lesson explicitly (after executing the restart
+                // servlet).
+                goatRouter.navigate(fragment);
+                // Resetting the user's lesson state (assuming a single browser
+                // and session per user).
                 $.ajax({
                     url:'service/restartlesson.mvc',
                     method:'GET'
-				}).then(function() {
+                }).done(function(text) {
-					self.loadLesson(self.screen,self.menu);
+                    console.log("Received a response from the restart servlet: '" + text + "'");
+                    // Explicitly loading the lesson instead of triggering an
+                    // event in goatRouter.navigate().
+                    self.loadLesson(self.scr,self.menu);
                 });
             };
 

webgoat-container/src/main/webapp/js/goatApp/model/LessonContentModel.js

@@ -14,18 +14,26 @@ define(['jquery',
             selectedItem:null
         },
         initialize: function (options) {
-			this.screenParam = null;
+            this.scrParam = null;
             this.menuParam = null;
             this.stageParam = null;
-			this.baseUrlRoot = 'attack?Screen=';
+            this.numParam = null;
+            this.baseUrlRoot = 'attack';
         },
         loadData: function(options) {
-			this.urlRoot = this.baseUrlRoot  +options.screen + '&menu=' + options.menu + '&stage=' + options.stage;
+            this.urlRoot = this.baseUrlRoot + "?Screen=" + options.scr + '&menu=' + options.menu;
-			this.set('menuParam',options.menu);
+            if (options.stage != null) {
-			this.set('screenParam',options.screen);
+               this.urlRoot += '&stage=' + options.stage;
-			this.set('stageParam',options.stage)
+            }
-			var self=this;
+            if (options.num != null) {
-			this.fetch().then(function(data) {
+               this.urlRoot += '&Num=' + options.num;
+            }
+            this.set('menuParam', options.menu);
+            this.set('scrParam', options.scr);
+            this.set('stageParam', options.stage)
+            this.set('numParam', options.num)
+            var self = this;
+            this.fetch().done(function(data) {
                 self.setContent(data);
             });
         },

webgoat-container/src/main/webapp/js/goatApp/view/GoatRouter.js

@@ -19,7 +19,9 @@ define(['jquery',
     var GoatAppRouter = Backbone.Router.extend({
         routes: {
             'welcome':'welcomeRoute',
-            'attack/:scr/:menu(/:stage)':'attackRoute',
+            'attack/:scr/:menu':'attackRoute',
+            'attack/:scr/:menu/:stage':'attackRoute',
+            'attack/:scr/:menu/*stage/:num':'attackRoute',
         },
 
         lessonController: new LessonController({
@@ -35,14 +37,17 @@ define(['jquery',
             this.lessonController.start();
             // this.menuController.initMenu();
 
-            goatRouter.on('route:attackRoute', function(scr,menu,stage) {
+            goatRouter.on('route:attackRoute', function(scr,menu,stage,num) {
-                this.lessonController.loadLesson(scr,menu,stage);
+                this.lessonController.loadLesson(scr,menu,stage,num);
                 this.menuController.updateMenu(scr,menu);
                 //update menu
             });
             goatRouter.on('route:welcomeRoute', function() {
                 this.lessonController.loadWelcome();
             });
+            goatRouter.on("route", function(route, params) {
+                console.log("Got a route event: " + route + ", params: " + params);
+            });
 
             Backbone.history.start();
             this.listenTo(this.lessonController, 'menu:reload',this.reloadMenu)

webgoat-container/src/main/webapp/js/goatApp/view/LessonContentView.js

@@ -26,7 +26,7 @@ define(['jquery',
         makeFormsAjax: function () {
             var options = {
                 success:this.reLoadView.bind(this),
-			    url:'attack?Screen=' + this.model.get('screenParam') + '&menu=' + this.model.get('menuParam'),
+                url: this.model.urlRoot,
                 type:'GET'
                 // $.ajax options can be used here too, for example: 
                 //timeout:   3000 
@@ -37,14 +37,19 @@ define(['jquery',
 
         ajaxifyAttackHref: function() {  // rewrite any links with hrefs point to relative attack URLs             
             var self = this;
+            // The current LessonAdapter#getLink() generates a hash-mark link.  It will not match the mask below.
+            // Besides, the new MVC code registers an event handler that will reload the lesson according to the route.
             $.each($('a[href^="attack?"]'),function(i,el) {
                 var url = $(el).attr('href');
                 $(el).unbind('click').attr('href','#').attr('link',url);
                 //TODO pull currentMenuId
-        		$(el).click(function() {
+                $(el).click(function(event) {
                     event.preventDefault();
                     var _url = $(el).attr('link');
-        			$.get(_url, {success:self.reloadView.bind(self)});
+                    console.log("About to GET " + _url);
+                    $.get(_url)
+                        .done(self.reLoadView.bind(self))
+                        .fail(function() { alert("failed to GET " + _url); });
                 });
             });
         },

webgoat-container/src/main/webapp/main.jsp

@@ -104,7 +104,7 @@
                             if (stages != null)
                                 for (int i = 0; i < stages.length; i++) {
                     %>
-                    <tr><td class="pviimenudivstage"><%=(rla.isStageComplete(webSession, stages[i]) ? lessonComplete : "")%><a href="<%=lesson.getLink() + "&stage=" + (i + 1)%>">Stage <%=i + 1%>: <%=stages[i]%></a>
+                    <tr><td class="pviimenudivstage"><%=(rla.isStageComplete(webSession, stages[i]) ? lessonComplete : "")%><a href="<%=lesson.getLink() + "/" + (i + 1)%>">Stage <%=i + 1%>: <%=stages[i]%></a>
                         </td></tr>
                         <%
                                     }