Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[#39] Loading an IQSet #57

Merged
merged 1 commit into from
Apr 22, 2014
Merged

[#39] Loading an IQSet #57

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
160 changes: 103 additions & 57 deletions static/js/smileteacher.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,8 +28,8 @@
#SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
**/

var VERSION = '0.0.2';
//var SMILESTATE = "1";
var VERSION = '0.1.2';

var SMILEROUTES = {
"currentmessage": "/smile/currentmessage",
"all": "/smile/all",
Expand All @@ -38,18 +38,47 @@ var SMILEROUTES = {
"createsession": "/smile/createsession"
};

var IQSet = function(id,title,teacherName,groupName,date) {
//var self = this;
/* --------
MODELS
-------- */

var Question = function(position,urlImage,author,question,answer,options,ip,type) {

this.position = position;
this.urlImage = urlImage;
this.author = author;
this.question = question;
this.answer = answer;
this.options = options;
this.ip = ip;
this.type = type;
}

var IQSet = function(position,id,title,teacherName,groupName,date) {

this.position = position;
this.id = id;
this.sessionName = title;
this.teacherName = teacherName;
this.groupName = groupName;
this.date = date;
this.questions = [];
}

//
// KO Extenders
//
var GlobalViewModel = {
teacher_name: ko.observable(""),
session_name: ko.observable(""),
group_name: ko.observable(""),
iqsets: ko.observableArray([]),
position: ko.observable(''),
questions: ko.observableArray([]),
version: ko.observable(VERSION)
};

/* --------------
KO EXTENDERS
-------------- */

// This adds the required extender for validation
ko.extenders.required = function(target, overrideMessage) {
//add some sub-observables to our observable
Expand All @@ -72,20 +101,11 @@ ko.extenders.required = function(target, overrideMessage) {
return target;
};


var GlobalViewModel = {
teacher_name: ko.observable(""),
session_name: ko.observable(""),
group_name: ko.observable(""),
iqsets: ko.observableArray([]),
iqsetToLoad: ko.observable(''),
version: ko.observable(VERSION)
};

/* ---------
ACTIONS
--------- */
GlobalViewModel.createSession = function() {

//var self = this;

if (!this.teacher_name() || this.teacher_name() === "") { this.teacher_name('Default Teacher'); }
if (!this.session_name() || this.session_name() === "") { this.session_name('Default Session'); }
if (!this.group_name() || this.group_name() === "") { this.group_name('Default Group'); }
Expand All @@ -101,7 +121,6 @@ GlobalViewModel.createSession = function() {
smileAlert('#globalstatus', 'Unable to post session values. Reason: ' + xhr.status + ':' + xhr.responseText + '. Please verify your connection or server status.', 'trace');
},
success: function(data) {
smileAlert('#globalstatus', 'Success ('+GlobalViewModel.teacher_name()+','+GlobalViewModel.session_name()+','+GlobalViewModel.group_name()+')', 'green', 5000);
switchSection('div[data-slug=choose-activity-flow]');
}
});
Expand All @@ -121,9 +140,56 @@ GlobalViewModel.startMakingQuestions = function() {
return false;
}

GlobalViewModel.usePreparedQuestions = function() {
GlobalViewModel.startMakingQuestionsWithIQSet = function() {

$.ajax({
cache: false,
type: "GET",
dataType: "text",
url: SMILEROUTES["iqset"]+GlobalViewModel.iqsets()[GlobalViewModel.position()].id,
data: {},

error: function(xhr, text, err) {
smileAlert('#globalstatus', 'Unable to call /smile/iqset/{key}. Reason: ' + xhr.status + ':' + xhr.responseText + '. Please verify your connection or server status.', 'trace');
},

success: function(data) {

var iqset = JSON.parse(data);
var iqdata = iqset.iqdata;

for (i = 0; i < iqdata.length; i++) {

var options = [];
options.push(iqdata[i].O1,iqdata[i].O2,iqdata[i].O3,iqdata[i].O4);

GlobalViewModel.questions.push(
new Question(
i,
iqdata[i].PICURL,
iqdata[i].NAME,
iqdata[i].Q,
iqdata[i].A,
options,
iqdata[i].IP,
iqdata[i].TYPE
)
);
}

GlobalViewModel.title_iqset = iqset.title;

//smileAlert('#globalstatus', 'title_iqset='+GlobalViewModel.title_iqset, 'blue', 15000);
//smileAlert('#globalstatus', 'questions='+GlobalViewModel.questions()[0].author, 'blue', 5000);
}
});

switchSection('div[data-slug=list-questions]');

//smileAlert('#globalstatus', 'Load iqsets', 'green', 5000);
return false;
}

GlobalViewModel.usePreparedQuestions = function() {

switchSection('div[data-slug=choose-an-iqset]');

Expand All @@ -135,7 +201,7 @@ GlobalViewModel.usePreparedQuestions = function() {
data: {},

error: function(xhr, text, err) {
smileAlert('#globalstatus', 'Unable to call /smile/all. Reason: ' + xhr.status + ':' + xhr.responseText + '. Please verify your connection or server status.', 'trace');
smileAlert('#globalstatus', 'Unable to call /smile/iqsets. Reason: ' + xhr.status + ':' + xhr.responseText + '. Please verify your connection or server status.', 'trace');
},

success: function(data) {
Expand All @@ -148,41 +214,33 @@ GlobalViewModel.usePreparedQuestions = function() {
GlobalViewModel.iqsets.push(
new IQSet(
i,
iqsets[i].id,
iqsets[i].value[0],
iqsets[i].value[1],
iqsets[i].value[2],
iqsets[i].key.substr(0, 10)
)
);
//smileAlert('#globalstatus', iqsets[i].value[0], 'blue', 7000);
}
}
});

return false;
}



GlobalViewModel.resetSessionValues = function() {

this.teacher_name("");
this.session_name("");
this.group_name("");

//
// XXX This is silly, fix this, cleanup the object model and reset the state
// For now just reload the page
//
//window.location.href = window.location.pathname;
//window.location.reload(true);
return false;
}

// Displays directly a "Recovering Session" button if a session is already running
GlobalViewModel.initializePage = function() {

//var alreadyRunning = false;

$.ajax({
cache: false,
type: "GET",
Expand All @@ -209,23 +267,17 @@ $(document).ready(function() {
ko.applyBindings(GlobalViewModel);

GlobalViewModel.initializePage();

});

// NEEDED
function foobar() {
smileAlert('#globalstatus', 'Not yet implemented', 'blue',5000);
}
/* ---------
UTILITY
--------- */

function switchSection(newSection) {

$('section.active').removeClass('active');
$(newSection).parent().addClass('active');
}

//
// App functions
//
// alerttype
// - by default, none is required if you don't intend to use lifetime
// - trace : use the stacktrace in the error message
Expand All @@ -242,21 +294,15 @@ function smileAlert(targetid, text, alerttype, lifetime) {
%s \
<a href="" class="close">&times;</a> \
</div>';
if (!alerttype) {
alerttype = defaultalert;
} else if (alerttype === 'trace') {
alerttype = redalert;
var trace = printStackTrace();
text = text + ' : ' + trace;
} else if (alerttype === 'red') {
alerttype = redalert;
} else if (alerttype === 'blue') {
alerttype = bluealert;
} else if (alerttype === 'green') {
alerttype = greenalert;
} else {
alerttype = defaultalert;
}

if (!alerttype) { alerttype = defaultalert; }
else if (alerttype === 'trace') { alerttype = redalert;
text += ' : ' + printStackTrace(); }
else if (alerttype === 'red') { alerttype = redalert; }
else if (alerttype === 'blue') { alerttype = bluealert; }
else if (alerttype === 'green') { alerttype = greenalert; }
else { alerttype = defaultalert; }

if (targetid) {
$(targetid).append(sprintf(formatstr, alerttype, text));
}
Expand Down
50 changes: 26 additions & 24 deletions static/smile-teacher.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -87,25 +87,17 @@ <h3>
<input data-bind='value: group_name, valueUpdate: "afterkeydown"' type="text" placeholder="Default Group" />

<ul class="button-group even two-up">
<li>
<a href="#" data-bind='click: createSession'
class="button">Next</a>
</li>
<li>
<a href="#" data-bind='click: resetSessionValues' class="button">Reset</a>
</li>
<li><a href="#" data-bind='click: createSession' class="button">Next</a></li>
<li><a href="#" data-bind='click: resetSessionValues' class="button">Reset</a></li>
</ul>
</div>
</section>


<section>

<div class="content" data-slug="recover-session" data-section-content>
<ul class="button-group even two-up">
<li>
<a href="#" data-bind='click: recoverSession' class="button">Recovering session</a>
</li>
<li><a href="#" data-bind='click: recoverSession' class="button">Recovering session</a></li>
</ul>
</div>
</section>
Expand All @@ -114,12 +106,8 @@ <h3>

<div class="content" data-slug="choose-activity-flow" data-section-content>
<ul class="button-group even two-up">
<li>
<a href="#" data-bind='click: startMakingQuestions' class="button">Start making questions</a>
</li>
<li>
<a href="#" data-bind='click: usePreparedQuestions' class="button">Use Prepared Questions</a>
</li>
<li><a href="#" data-bind='click: startMakingQuestions' class="button">Start making questions</a></li>
<li><a href="#" data-bind='click: usePreparedQuestions' class="button">Use Prepared Questions</a></li>
</ul>
</div>
</section>
Expand All @@ -130,16 +118,32 @@ <h3>

<div data-bind="foreach: iqsets" >
<div>
<input type="radio" name="optionsGroup" data-bind="attr: {value: id}, checked: $root.iqsetToLoad" />
<input type="radio" name="optionsGroup" data-bind="attr: {value: position}, checked: $root.position" />
<span data-bind="text: sessionName"></span>
(<span data-bind="text: teacherName"></span>,
<span data-bind="text: groupName"></span>,
<span data-bind="text: date"></span>)
</div>
</div>
<ul class="button-group even two-up">
<li><a href="#" data-bind='click: startMakingQuestionsWithIQSet' class="button">Load</a></li>
</ul>
</div>
</section>


<section>

<div class="content" data-slug="list-questions" data-section-content>

<div data-bind="foreach: questions" >
<div>
<input type="checkbox" name="questionsToSave" data-bind="attr: {value: position}, checked: $root.position" />
<span data-bind="text: author"></span>
</div>
</div>

</div>

</section>
</div>
</nav>
Expand All @@ -149,12 +153,10 @@ <h3>
</div>
</div>
<div class="large-3 small-3 columns">
<!-- <div data-bind="with: logindata"> -->
<div id="login-info">
<h4>
Instructions for
<div data-bind="text: teacher_name">Teacher</div>
</h4>
Teacher: <span data-bind="text: teacher_name"></span><br>
Session: <span data-bind="text: session_name"></span><br>
Group: <span data-bind="text: group_name"></span>

<p><img src="images/jamsj_slim.png" />
</div>
Expand Down