From 7323a1fa859e154e4264dd8b8ebcac929ce47b24 Mon Sep 17 00:00:00 2001
From: Jason White <jason.white@owasp.org>
Date: Tue, 11 Oct 2016 16:28:23 -0400
Subject: [PATCH] Hints back on main screen

---
 .../js/goatApp/controller/LessonController.js   |  1 +
 .../static/js/goatApp/view/GoatRouter.js        |  1 -
 .../static/js/goatApp/view/HelpControlsView.js  |  7 +++++++
 .../static/js/goatApp/view/HintView.js          |  6 +++++-
 .../src/main/resources/templates/main_new.html  | 17 +++++++++++++++++
 5 files changed, 30 insertions(+), 2 deletions(-)

diff --git a/webgoat-container/src/main/resources/static/js/goatApp/controller/LessonController.js b/webgoat-container/src/main/resources/static/js/goatApp/controller/LessonController.js
index 7e88c4693..ffffb464a 100644
--- a/webgoat-container/src/main/resources/static/js/goatApp/controller/LessonController.js
+++ b/webgoat-container/src/main/resources/static/js/goatApp/controller/LessonController.js
@@ -90,6 +90,7 @@ define(['jquery',
                     //hasAttack:this.lessonInfo.get('hasAttack') // TODO: add attack options
                 });
 
+                this.listenTo(this.helpControlsView,'hints:show',this.showHints);
                 this.listenTo(this.helpControlsView,'attack:show',this.hideShowAttack);
                 this.listenTo(this.helpControlsView,'solution:show',this.hideShowHelps);
                 this.listenTo(this.helpControlsView,'source:show',this.hideShowHelps);
diff --git a/webgoat-container/src/main/resources/static/js/goatApp/view/GoatRouter.js b/webgoat-container/src/main/resources/static/js/goatApp/view/GoatRouter.js
index 3ca7688b7..3d69afb5f 100644
--- a/webgoat-container/src/main/resources/static/js/goatApp/view/GoatRouter.js
+++ b/webgoat-container/src/main/resources/static/js/goatApp/view/GoatRouter.js
@@ -45,7 +45,6 @@ define(['jquery',
 //                this.menuController.updateMenu(scr,menu);
 //            });
             goatRouter.on('route:lessonRoute', function(name) {
-                console.log('lesson route initiated');
                 this.lessonController.loadLesson(name);
                 //TODO - update menu code from below
                 this.menuController.updateMenu(name);
diff --git a/webgoat-container/src/main/resources/static/js/goatApp/view/HelpControlsView.js b/webgoat-container/src/main/resources/static/js/goatApp/view/HelpControlsView.js
index 60f02600b..b29220224 100644
--- a/webgoat-container/src/main/resources/static/js/goatApp/view/HelpControlsView.js
+++ b/webgoat-container/src/main/resources/static/js/goatApp/view/HelpControlsView.js
@@ -26,6 +26,9 @@ function($,_,Backbone) {
 			if (this.hasSource) {
 				this.$el.find('#show-source-button').unbind().on('click',_.bind(this.showSource,this)).show();
 			}
+			if (this.hasHints) {
+                this.$el.find('#show-hints-button').unbind().on('click',this.showHints.bind(this)).show();
+            }
 			if (this.hasSolution) {
 				this.$el.find('#show-solution-button').unbind().on('click',_.bind(this.showSolution,this)).show();
 			}
@@ -38,6 +41,10 @@ function($,_,Backbone) {
 			//this.$el.append(this.helpButtons.restartLesson);
 		},
 
+		showHints: function() {
+		    this.trigger('hints:show','hint');
+		},
+
 		showSource: function() {
 			this.trigger('source:show','source');
 		},
diff --git a/webgoat-container/src/main/resources/static/js/goatApp/view/HintView.js b/webgoat-container/src/main/resources/static/js/goatApp/view/HintView.js
index bd16640ae..564acde68 100644
--- a/webgoat-container/src/main/resources/static/js/goatApp/view/HintView.js
+++ b/webgoat-container/src/main/resources/static/js/goatApp/view/HintView.js
@@ -24,7 +24,11 @@ function($,
         },
 
         toggleLabel: function() {
-            this.$el.text((showing) ? 'Hide hints' : 'Show hints');
+            if (this.isVisible()) {
+                $('show-hints-button').text('Hide hints');
+            } else {
+                $('show-hints-button').text('Show hints');
+            }
         },
 
 		render:function() {
diff --git a/webgoat-container/src/main/resources/templates/main_new.html b/webgoat-container/src/main/resources/templates/main_new.html
index 8fd0b8f2a..240b16dd5 100644
--- a/webgoat-container/src/main/resources/templates/main_new.html
+++ b/webgoat-container/src/main/resources/templates/main_new.html
@@ -115,6 +115,8 @@
                                 <button class="btn btn-primary btn-xs btn-danger help-button" id="show-source-button">
                                     <i class="fa fa-code" />
                                 </button>
+                                <button class="btn btn-primary btn-xs btn-danger help-button" id="show-hints-button">Show Hints
+                                </button>
                                 <!--<button class="btn btn-primary btn-xs btn-danger help-button" id="show-attack-button">-->
                                 <!--Attack It-->
                                 <!--</button>-->
@@ -122,6 +124,21 @@
                                     Reset Lesson
                                 </button>
                             </div>
+
+                            <div class="lesson-hint" id="lesson-hint-container">
+                                <!--<h4>Hints</h4>-->
+                                <div class="panel">
+                                    <div id="message" class="info" th:utext="${message}"></div>
+                                    <div class="panel-body" id="lesson-hint">
+                            <span class="glyphicon-class glyphicon glyphicon-circle-arrow-left"
+                                  id="show-prev-hint"></span>
+                                        <span class="glyphicon-class glyphicon glyphicon-circle-arrow-right"
+                                              id="show-next-hint"></span>
+                                        <br/>
+                                        <span id="lesson-hint-content"></span>
+                                    </div>
+                                </div>
+                            </div>
                             <div class="lesson-content">
 
                             </div>