Feedback/output integration ... currently requires html div's in lesson template
This commit is contained in:
Jason White
parent
d9e7ab724d
commit
b67bc85ad6
@ -16,26 +16,26 @@ define(['jquery',
|
|||||||
},
|
},
|
||||||
|
|
||||||
render: function() {
|
render: function() {
|
||||||
this.$el.html(this.model.get('content'));
|
this.$el.find('.lesson-content').html(this.model.get('content'));
|
||||||
this.makeFormsAjax();
|
this.makeFormsAjax();
|
||||||
this.ajaxifyAttackHref();
|
//this.ajaxifyAttackHref();
|
||||||
$(window).scrollTop(0); //work-around til we get the scroll down sorted out
|
$(window).scrollTop(0); //work-around til we get the scroll down sorted out
|
||||||
this.initPagination();
|
this.initPagination();
|
||||||
},
|
},
|
||||||
|
|
||||||
makeFormsAjax: function () {
|
// makeFormsAjax: function () {
|
||||||
// will bind all forms with attack-form class
|
// // will bind all forms with attack-form class
|
||||||
var self = this;
|
// var self = this;
|
||||||
$("form.attack-form").each(function(form) {
|
// $("form.attack-form").each(function(form) {
|
||||||
var options = {
|
// var options = {
|
||||||
success:self.onAttackExecution.bind(this),
|
// success:self.onAttackExecution.bind(this),
|
||||||
url: this.action,
|
// url: this.action,
|
||||||
type:this.method,
|
// type:this.method,
|
||||||
// additional options
|
// // additional options
|
||||||
};
|
// };
|
||||||
$(this).ajaxForm(options);
|
// $(this).ajaxForm(options);
|
||||||
});
|
// });
|
||||||
},
|
// },
|
||||||
|
|
||||||
initPagination: function() {
|
initPagination: function() {
|
||||||
//get basic pagination info
|
//get basic pagination info
|
||||||
@ -68,7 +68,7 @@ define(['jquery',
|
|||||||
// turn off standard submit
|
// turn off standard submit
|
||||||
|
|
||||||
//set standard options
|
//set standard options
|
||||||
var contentType = (this.$form.attr('contentType')) ? this.$form.attr('contentType') : 'url-form-encoded';
|
var contentType = (this.$form.attr('contentType')) ? this.$form.attr('contentType') : 'application/x-www-form-urlencoded; charset=UTF-8';
|
||||||
this.formOptions = {
|
this.formOptions = {
|
||||||
//success:this.reLoadView.bind(this),
|
//success:this.reLoadView.bind(this),
|
||||||
url: this.$form.attr('action'),
|
url: this.$form.attr('action'),
|
||||||
@ -99,35 +99,54 @@ define(['jquery',
|
|||||||
method:this.formOptions.method,
|
method:this.formOptions.method,
|
||||||
contentType:this.formOptions.contentType,
|
contentType:this.formOptions.contentType,
|
||||||
data: submitData
|
data: submitData
|
||||||
}).success(function(data) {
|
}).then(self.onSuccessResponse.bind(self), self.onErrorResponse.bind(self)); // {
|
||||||
//Log shows warning, see https://bugzilla.mozilla.org/show_bug.cgi?id=884693
|
// // Log shows warning, see https://bugzilla.mozilla.org/show_bug.cgi?id=884693
|
||||||
// Explicitly loading the lesson instead of triggering an
|
// // Explicitly loading the lesson instead of triggering an
|
||||||
// event in goatRouter.navigate().
|
// // event in goatRouter.navigate().
|
||||||
self.reLoadView(data);
|
// console.log(data);
|
||||||
});
|
// //self.reLoadView(data);
|
||||||
|
// }).error(function(data) {
|
||||||
|
// console.log(data);
|
||||||
|
// //test
|
||||||
|
// });
|
||||||
|
|
||||||
return false;
|
return false;
|
||||||
},
|
},
|
||||||
|
|
||||||
ajaxifyAttackHref: function() { // rewrite any links with hrefs point to relative attack URLs
|
onSuccessResponse: function(data) {
|
||||||
|
console.log(data);
|
||||||
|
this.renderFeedback(data.feedback);
|
||||||
|
// update menu if lessonCompleted is true
|
||||||
|
this.renderOutput(data.output || "");
|
||||||
|
return false;
|
||||||
|
},
|
||||||
|
|
||||||
|
onErrorResponse: function (a,b,c) {
|
||||||
|
console.error(a);
|
||||||
|
console.error(b);
|
||||||
|
console.error(c);
|
||||||
|
return false;
|
||||||
|
},
|
||||||
|
|
||||||
|
ajaxifyAttackHref: function() { // rewrite any links with hrefs point to relative attack URLs
|
||||||
var self = this;
|
var self = this;
|
||||||
// The current LessonAdapter#getLink() generates a hash-mark link. It will not match the mask below.
|
// instruct in template to have links returned with the attack-link class
|
||||||
// Besides, the new MVC code registers an event handler that will reload the lesson according to the route.
|
$('a.attack-link').submit(function(event){
|
||||||
|
$.get(this.action, "json").then(self.onSuccessResponse, self.onErrorResponse);
|
||||||
$('form').submit(function(event){
|
});
|
||||||
$.get(this.action, "json")
|
|
||||||
//.done(self.reLoadView.bind(self))
|
|
||||||
.fail(function() { alert("failed to GET " + url); });
|
|
||||||
});
|
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
onAttackExecution: function(feedback) {
|
// onAttackExecution: function(feedback) {
|
||||||
console.log('attack executed')
|
// console.log('attack executed')
|
||||||
this.renderFeedback(feedback);
|
// this.renderFeedback(feedback);
|
||||||
},
|
// },
|
||||||
|
|
||||||
renderFeedback: function(feedback) {
|
renderFeedback: function(feedback) {
|
||||||
this.$el.find('feedback').html(feedback);
|
this.$el.find('.attack-feedback').html(feedback);
|
||||||
|
},
|
||||||
|
|
||||||
|
renderOutput: function(output) {
|
||||||
|
this.$el.find('.attack-output').html(output);
|
||||||
},
|
},
|
||||||
|
|
||||||
addPaginationControls: function() {
|
addPaginationControls: function() {
|
||||||
|
|||||||
@ -105,58 +105,34 @@
|
|||||||
<section id="main-content"> <!--ng-controller="goatLesson"-->
|
<section id="main-content"> <!--ng-controller="goatLesson"-->
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-md-8">
|
<div class="col-md-8">
|
||||||
<div class="col-md-12" align="left">
|
<!--<div class="col-md-12" align="left">-->
|
||||||
<div class="panel" id="help-controls">
|
<!---->
|
||||||
<button class="btn btn-primary btn-xs btn-danger help-button" id="show-source-button">
|
<!--<!– hints moved into lesson template –>-->
|
||||||
<i class="fa fa-code" />
|
<!--</div>-->
|
||||||
</button>
|
|
||||||
<button class="btn btn-primary btn-xs btn-danger help-button" id="show-attack-button">
|
|
||||||
Attack It
|
|
||||||
</button>
|
|
||||||
<button class="btn btn-xs help-button" id="restart-lesson-button">
|
|
||||||
Reset Lesson
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<!-- hints moved into lesson template -->
|
|
||||||
</div>
|
|
||||||
<div class="col-md-12" align="left">
|
<div class="col-md-12" align="left">
|
||||||
<div id="lesson-content-wrapper" class="panel">
|
<div id="lesson-content-wrapper" class="panel">
|
||||||
|
<div class="" id="help-controls">
|
||||||
|
<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-attack-button">-->
|
||||||
|
<!--Attack It-->
|
||||||
|
<!--</button>-->
|
||||||
|
<button class="btn btn-xs help-button" id="restart-lesson-button">
|
||||||
|
Reset Lesson
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="lesson-content">
|
||||||
|
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div><!--col-md-8 end-->
|
</div>
|
||||||
<!--<div class="col-md-4">-->
|
|
||||||
<!--<div class="col-md-12">-->
|
|
||||||
<!--<div class="panel">-->
|
|
||||||
<!--<div class="panel-body">-->
|
|
||||||
<!--<div align="left">-->
|
|
||||||
<!--<h3>Cookies / Parameters</h3>-->
|
|
||||||
<!--</div>-->
|
|
||||||
<!--<hr/>-->
|
|
||||||
<!--<div id="cookies-and-params">-->
|
|
||||||
<!--<div id="cookies-view">-->
|
|
||||||
<!--<h4>Cookies</h4>-->
|
|
||||||
<!--</div>-->
|
|
||||||
<!--<div id="params-view"> <!–class="paramsView"–>-->
|
|
||||||
<!--<h4>Params</h4>-->
|
|
||||||
<!--</div>-->
|
|
||||||
<!--</div>-->
|
|
||||||
<!--<div id="developer-control-container">-->
|
|
||||||
<!--<div align="left">-->
|
|
||||||
<!--<h3>Developer controls</h3>-->
|
|
||||||
<!--</div>-->
|
|
||||||
<!--<hr/>-->
|
|
||||||
<!--<div id="developer-controls">-->
|
|
||||||
|
|
||||||
<!--</div>-->
|
|
||||||
<!--</div>-->
|
|
||||||
<!--</div>-->
|
|
||||||
<!--</div>-->
|
|
||||||
<!--</div>-->
|
|
||||||
<!--</div>-->
|
|
||||||
<!--col-md-4 end-->
|
|
||||||
</div>
|
</div>
|
||||||
<div id="lesson-helps-wrapper" class="panel">
|
<div id="lesson-helps-wrapper" class="panel">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div class="lesson-help" id="lesson-plan-row">
|
<div class="lesson-help" id="lesson-plan-row">
|
||||||
<div class="col-md-12">
|
<div class="col-md-12">
|
||||||
<h4>Lesson Plan</h4>
|
<h4>Lesson Plan</h4>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user