diff --git a/src/main/webapp/WEB-INF/pages/main_new.jsp b/src/main/webapp/WEB-INF/pages/main_new.jsp index c6b5766a3..f0ab6621c 100644 --- a/src/main/webapp/WEB-INF/pages/main_new.jsp +++ b/src/main/webapp/WEB-INF/pages/main_new.jsp @@ -106,10 +106,10 @@ --> -
+

Hints

-
+

@@ -159,15 +159,8 @@
-
-
-
-

Lesson Parameters and Cookies

- -
-
- -
+
+

Lesson Plan

@@ -177,21 +170,20 @@
-
+

Lesson Solution

-
+
-
+

Lesson Source Code

-
- +
diff --git a/src/main/webapp/css/main.css b/src/main/webapp/css/main.css index 7297fdf99..17f9fe8e7 100644 --- a/src/main/webapp/css/main.css +++ b/src/main/webapp/css/main.css @@ -710,7 +710,7 @@ fieldset[disabled] .btn-warning.active { margin-top:3px; } -.lessonHelp, .lessonHelpBtn { +.lesson-help, .lesson-help-button { display: none; } diff --git a/src/main/webapp/js/goatApp/controller/LessonController.js b/src/main/webapp/js/goatApp/controller/LessonController.js index 83cd15e6f..5b7b4a505 100644 --- a/src/main/webapp/js/goatApp/controller/LessonController.js +++ b/src/main/webapp/js/goatApp/controller/LessonController.js @@ -7,7 +7,8 @@ define(['jquery', 'goatApp/view/SourceView', 'goatApp/view/SolutionView', 'goatApp/view/LessonHintView', - 'goatApp/view/HelpControlsView' + 'goatApp/view/HelpControlsView', + 'goatApp/support/GoatUtils' ], function($, _, @@ -18,7 +19,8 @@ define(['jquery', SourceView, SolutionView, LessonHintView, - HelpControlsView + HelpControlsView, + GoatUtils ) { 'use strict' @@ -59,7 +61,7 @@ define(['jquery', //load cookies/parameters view - //load title view (initially hidden) << currently handled via menu click but need to be able to handle via routed request + //load title view (initially hidden) << //TODO: currently handled via menu click but need to be able to handle via routed request //plan view (initially hidden) this.planView = new PlanView(); this.listenTo(this.planView,'plan:loaded',this.areHelpsReady); @@ -72,7 +74,6 @@ define(['jquery', //load help controls view (contextul to what helps are available) this.lessonHintView = new LessonHintView(); this.listenTo(this.lessonHintView,'hints:loaded',this.areHelpsReady); - }; this.areHelpsReady = function (curHelp) { @@ -87,12 +88,44 @@ define(['jquery', hasHints:(this.lessonHintView.collection.length > 0), }); this.helpControlsView.render(); + // + this.listenTo(this.helpControlsView,'plan:show',this.hideShowHelps); + this.listenTo(this.helpControlsView,'solution:show',this.hideShowHelps); + this.listenTo(this.helpControlsView,'hints:show',this.showHints) + this.listenTo(this.helpControlsView,'source:show',this.hideShowHelps); + this.listenTo(this.helpControlsView,'lesson:restart',this.restartLesson); } }; this.addCurHelpState = function (curHelp) { this.helpsLoaded[curHelp.helpElement] = curHelp.value; - }; + }; + + this.hideShowHelps = function(showHelp) { + var showId = '#lesson-' + showHelp + '-row'; + $('.lesson-help').not(showId).hide(); + switch(showHelp) { + case 'plan': + $(showId).html(this.planView.model.get('content')).show(); + break; + case 'solution': + $(showId).html(this.solutionView.model.get('content')).show(); + break; + case 'source': + $(showId).html(this.sourceView.model.get('content')).show(); + break; + } + GoatUtils.scrollToHelp() + };; + + this.showHints = function() { + console.log('show Hints'); + }; + + this.restartLesson = function() { + console.log('restart lesson'); + }; + }; return Controller; }); \ No newline at end of file diff --git a/src/main/webapp/js/goatApp/support/GoatUtils.js b/src/main/webapp/js/goatApp/support/GoatUtils.js index b6913ef03..9b4128d72 100644 --- a/src/main/webapp/js/goatApp/support/GoatUtils.js +++ b/src/main/webapp/js/goatApp/support/GoatUtils.js @@ -95,63 +95,31 @@ define(['jquery', } } }, + showLessonCookiesAndParams: function() { $.get(goatConstants.cookieService, {}, function(reply) { $("#lesson_cookies").html(reply); }, "html"); }, - showLessonHints: function() { - $('.lessonHelp').hide(); - $('#lesson_hint').html(); - $('#lesson_hint_row').show(); - }, - showLessonSource: function(source) { - $('.lessonHelp').hide(); - //$('#lesson_source').html("
"+goat.lesson.lessonInfo.source+"
"); - $('#lesson_source_row').show(); - GoatUtils.scrollToHelp(); - }, - showLessonSolution: function() { - $('.lessonHelp').hide(); - $('#lesson_solution').html(goat.lesson.lessonInfo.solution); - $('#lesson_solution_row').show(); - GoatUtils.scrollToHelp(); - }, - showLessonPlan: function(plan) { - $('.lessonHelp').hide(); - $("#lesson_plan").html(goat.lesson.lessonInfo.plan); - $('#lesson_plan_row').show(); - GoatUtils.scrollToHelp(); - }, + scrollToHelp: function() { $('#leftside-navigation').height($('#main-content').height() + 15) - var target = $('#lessonHelpsWrapper'); - GoatUtils.scrollEasy(target); + var target = $('#lesson-helps-wrapper'); + this.scrollEasy(target); }, + scrollToTop: function() { $('.lessonHelp').hide(); var target = $('#container'); - GoatUtils.scrollEasy(target); + this.scrollEasy(target); }, + scrollEasy: function(target) { $('html,body').animate({ scrollTop: target.offset().top }, 1000); }, - scrapeParams: function(url) { - if (!url) { - return; - } - var params = url.split('?')[1].split('&'); - var paramsArr = []; - for (var i = 0; i < params.length; i++) { - var paramObj = {}; - paramObj.name = params[i].split('=')[0]; - paramObj.value = params[i].split('=')[1]; - paramsArr.push(paramObj); - } - return paramsArr; - }, + highlightCurrentLessonMenu: function(id) { //TODO: move selectors in first two lines into goatConstants $('ul li.selected').removeClass(goatConstants.selectedMenuClass) @@ -159,6 +127,7 @@ define(['jquery', $('#' + id).addClass(goatConstants.selectedMenuClass); $('#' + id).parent().addClass(goatConstants.selectedMenuClass); }, + ajaxifyAttackHref: function() { // rewrite any links with hrefs point to relative attack URLs $.each($('a[href^="attack?"]'), function(i,el) { diff --git a/src/main/webapp/js/goatApp/view/HelpControlsView.js b/src/main/webapp/js/goatApp/view/HelpControlsView.js index 424896bc2..347ad8ae1 100644 --- a/src/main/webapp/js/goatApp/view/HelpControlsView.js +++ b/src/main/webapp/js/goatApp/view/HelpControlsView.js @@ -6,11 +6,11 @@ function($,_,Backbone) { el:'#help-controls', //Check this helpButtons: { //TODO: move this into a template - showSource:$('