initial re-enabling of help buttons (source/plan/solution at least). Still need styling work etc.
This commit is contained in:
Jason White
Nanne Baars
parent
c31f60f5d9
commit
5590d07419
@ -106,10 +106,10 @@
|
||||
<button type="button" id="restartLessonBtn" class="btn btn-xs" onclick="restartLesson()">Restart Lesson</button> -->
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
<div class="lessonHelp" id="lesson-hint-row">
|
||||
<div class="lesson-hint" id="lesson-hint-row">
|
||||
<h4>Hints</h4>
|
||||
<div class="panel" >
|
||||
<div class="panel-body" id="lesson_hint">
|
||||
<div class="panel-body" id="lesson-hint">
|
||||
<span class="glyphicon-class glyphicon glyphicon-circle-arrow-left" id="showPrevHintBtn" onclick="viewPrevHint()"></span>
|
||||
<span class="glyphicon-class glyphicon glyphicon-circle-arrow-right" id="showNextHintBtn" onclick="viewNextHint()"></span>
|
||||
<br/>
|
||||
@ -159,15 +159,8 @@
|
||||
</div>
|
||||
</div><!--col-md-4 end-->
|
||||
</div>
|
||||
<div id="lessonHelpsWrapper">
|
||||
<div class="row lessonHelp" id="lesson-cookies-row">
|
||||
<div class="col-md-12">
|
||||
<h4>Lesson Parameters and Cookies</h4>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row lessonHelp" id="lesson-plan-row">
|
||||
<div id="lesson-helps-wrapper" class="panel">
|
||||
<div class="row lesson-help" id="lesson-plan-row">
|
||||
<div class="col-md-12">
|
||||
<h4>Lesson Plan</h4>
|
||||
<div class="panel" >
|
||||
@ -177,21 +170,20 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row lessonHelp" id="lesson_solution_row">
|
||||
<div class="row lesson-help" id="lesson-solution-row">
|
||||
<div class="col-md-12">
|
||||
<h4>Lesson Solution</h4>
|
||||
<div class="panel">
|
||||
<div class="panel-body" id="lesson_solution">
|
||||
<div class="panel-body" id="lesson-solution">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row lessonHelp" id="lesson_source_row">
|
||||
<div class="row lesson-help" id="lesson-source-row">
|
||||
<div class="col-md-12">
|
||||
<h4>Lesson Source Code</h4>
|
||||
<div class="panel">
|
||||
<div class="panel-body" id="lesson_source">
|
||||
<!-- <pre>{{source}}</pre> -->
|
||||
<div class="panel-body" id="lesson-source">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -710,7 +710,7 @@ fieldset[disabled] .btn-warning.active {
|
||||
margin-top:3px;
|
||||
}
|
||||
|
||||
.lessonHelp, .lessonHelpBtn {
|
||||
.lesson-help, .lesson-help-button {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
@ -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;
|
||||
});
|
||||
@ -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("<pre>"+goat.lesson.lessonInfo.source+"</pre>");
|
||||
$('#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) {
|
||||
|
||||
@ -6,11 +6,11 @@ function($,_,Backbone) {
|
||||
el:'#help-controls', //Check this
|
||||
helpButtons: {
|
||||
//TODO: move this into a template
|
||||
showSource:$('<button>',{id:'showSourceBtn','class':'btn btn-primary btn-xs help-button',type:'button',text:'Java [Source]'}),
|
||||
showSolution:$('<button>',{id:'showSolutionBtn','class':'btn btn-primary btn-xs help-button',type:'button',text:'Solution'}),
|
||||
showPlan:$('<button>',{id:'showPlanBtn','class':'btn btn-primary btn-xs help-button',type:'button',text:'Lesson Plan]'}),
|
||||
showHints:$('<button>',{id:'showHintsBtn','class':'btn btn-primary btn-xs help-button',type:'button',text:'Hints'}),
|
||||
restartLesson:$('<button>',{id:'restartLessonBtn','class':'btn btn-xs help-button',type:'button',text:'Restart Lesson'})
|
||||
showSource:$('<button>',{id:'show-source-button','class':'btn btn-primary btn-xs help-button',type:'button',text:'Java [Source]'}),
|
||||
showSolution:$('<button>',{id:'show-solution-button','class':'btn btn-primary btn-xs help-button',type:'button',text:'Solution'}),
|
||||
showPlan:$('<button>',{id:'show-plan-button','class':'btn btn-primary btn-xs help-button',type:'button',text:'Lesson Plan]'}),
|
||||
showHints:$('<button>',{id:'show-hints-button','class':'btn btn-primary btn-xs help-button',type:'button',text:'Hints'}),
|
||||
restartLesson:$('<button>',{id:'restart-lesson-button','class':'btn btn-xs help-button',type:'button',text:'Restart Lesson'})
|
||||
},
|
||||
initialize: function (options) {
|
||||
if (!options) {
|
||||
@ -23,19 +23,39 @@ function($,_,Backbone) {
|
||||
},
|
||||
render:function(title) {
|
||||
if (this.hasSource) {
|
||||
this.helpButtons.showSource.unbind().on('click',_.bind(this.showSource,this));
|
||||
this.$el.append(this.helpButtons.showSource);
|
||||
}
|
||||
if (this.hasSolution) {
|
||||
this.helpButtons.showSolution.unbind().on('click',_.bind(this.showSolution,this));
|
||||
this.$el.append(this.helpButtons.showSolution);
|
||||
}
|
||||
if (this.hasPlan) {
|
||||
this.helpButtons.showPlan.unbind().on('click',_.bind(this.showPlan,this));
|
||||
this.$el.append(this.helpButtons.showPlan);
|
||||
}
|
||||
if (this.hasHints) {
|
||||
this.helpButtons.showHints.unbind().on('click',_.bind(this.showHints,this));
|
||||
this.$el.append(this.helpButtons.showHints);
|
||||
}
|
||||
//
|
||||
this.$el.append(this.helpButtons.restartLesson);
|
||||
},
|
||||
|
||||
showSource: function() {
|
||||
this.trigger('source:show','source');
|
||||
},
|
||||
|
||||
showSolution: function() {
|
||||
this.trigger('solution:show','solution');
|
||||
},
|
||||
|
||||
showPlan: function() {
|
||||
this.trigger('plan:show','plan');
|
||||
},
|
||||
|
||||
showHints: function() {
|
||||
this.trigger('hints:show','hints');
|
||||
}
|
||||
});
|
||||
});
|
||||
Loading…
x
Reference in New Issue
Block a user