Skip to content

Commit

Permalink
Tutorial: Add a hello world survey card.
Browse files Browse the repository at this point in the history
  • Loading branch information
hjdivad authored and cyril-sf committed Dec 13, 2013
1 parent a50bfae commit de9e919
Show file tree
Hide file tree
Showing 3 changed files with 12 additions and 66 deletions.
9 changes: 9 additions & 0 deletions example/cards/tutorial/survey_card.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
<!DOCTYPE html>
<html>
<head>
<script src="/conductor-0.3.0.js" ></script>
<script src="survey_card.js" ></script>
</head>
<body>
</body>
</html>
67 changes: 2 additions & 65 deletions example/cards/tutorial/survey_card.js
Original file line number Diff line number Diff line change
@@ -1,72 +1,9 @@
/*global Handlebars*/

Conductor.require('/vendor/jquery.js');
Conductor.require('/example/libs/handlebars-1.0.0-rc.3.js');

var gradingTemplate = '<div><form>{{#each grades}}<input type="radio" name="survey" value="{{this}}">{{this}}</br>{{/each}}<input id="grade" type="button" value="Grade"></div>';
var gradeResultTemplate = '<div>Your rating: {{grade}} <button id="changeGrade">Change</button></div>';

Conductor.card({
consumers: { survey: Conductor.Oasis.Consumer },

grade: null,
grades: ["A", "B", "C", "D", "F"],
renderMode: 'survey',

activate: function( data ) {
this.consumers.height.autoUpdate = false;
this.compileTemplates();
},

compileTemplates: function() {
gradingTemplate = Handlebars.compile(gradingTemplate);
gradeResultTemplate = Handlebars.compile(gradeResultTemplate);
this.message = "<div>hello world</div>";
},

render: function () {
if (this.renderMode === 'survey') {
this.renderSurvey();
} else {
this.renderReport();
}
},

renderReport: function() {
var card = this;
this.renderMode = 'report';

$('body').html(gradeResultTemplate( this ));

$('#changeGrade').click( function( event ) {
$(this).off('click');
card.renderSurvey();
});
},

renderSurvey: function() {
var card = this;
this.renderMode = 'survey';

$('body').html(gradingTemplate(this));

if (this.grade) {
$('input:radio[name=survey][value="' + this.grade + '"]').attr('checked', 'checked');
}

$('#grade').click( function( event ) {
var grade = $('input:radio[name=survey]:checked').val();
if (grade) {
$(this).off('click');
if (card.consumers.survey) {
if (!card.grade) {
card.consumers.survey.send('surveyTaken', grade);
} else {
card.consumers.survey.send('gradeChanged', grade);
}
}
card.grade = grade;
card.renderReport();
}
});
document.body.innerHTML = this.message;
}
});
2 changes: 1 addition & 1 deletion example/playground/js/playground.js
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ window.Playground = {

this.cardTemplate = $('.card-wrapper').hide();

this.addCard('../cards/superbowl/card.js', 1, []);
this.addCard('../cards/tutorial/survey_card.js', 1, []);
}
};

Expand Down

0 comments on commit de9e919

Please sign in to comment.