Skip to content
This repository was archived by the owner on Jun 7, 2023. It is now read-only.

Commit b8d5c59

Browse files
bnmnetpbnmnetp
committed
Merge branch 'riknos314-pollPR'
2 parents 455cd7c + 9772b8d commit b8d5c59

File tree

2 files changed

+265
-130
lines changed

2 files changed

+265
-130
lines changed

‎runestone/poll/js/poll.js‎

Lines changed: 183 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,61 +1,216 @@
1-
// Javascript needed for the poll Sphinx directive type
1+
/*
2+
__author__ = Kirby Olson
3+
__date__ = 6/12/2015 */
24

5+
var pollList = {};
36

4-
function submitPoll(div_id) {
5-
var form = $("#"+div_id+"_poll");
6-
var poll_val = form.find("input:radio[name="+div_id +"_opt]:checked").val();
7-
if(poll_val === undefined)
7+
Poll.prototype = new RunestoneBase();
8+
9+
function Poll(opts) {
10+
if (opts) {
11+
this.init(opts);
12+
}
13+
}
14+
15+
Poll.prototype.init = function (opts) {
16+
RunestoneBase.apply(this, arguments);
17+
var orig = opts.orig; //entire <p> element
18+
this.origElem = orig;
19+
this.divid = orig.id;
20+
this.children = this.origElem.childNodes;
21+
this.optionList = [];
22+
this.optsArray = [];
23+
this.comment = false;
24+
if ($(this.origElem).is("[data-comment]")) {
25+
this.comment = true;
26+
}
27+
console.log(this.comment);
28+
29+
this.getQuestionText();
30+
this.getOptionText(); //populates optionList
31+
this.renderPoll(); //generates HTML
32+
this.checkPollStorage(); //checks localStorage to see if this poll has already been completed by this user
33+
};
34+
35+
Poll.prototype.getQuestionText = function() {
36+
//finds the text inside the parent tag, but before the first <li> tag and sets it as the question
37+
var _this = this;
38+
var firstAnswer;
39+
for (var i=0; i<this.children.length; i++) {
40+
if (this.children[i].tagName == "LI") {
41+
firstAnswer = _this.children[i];
42+
break;
43+
}
44+
}
45+
var delimiter = firstAnswer.outerHTML;
46+
var fulltext = $(this.origElem).html();
47+
var temp = fulltext.split(delimiter);
48+
this.question = temp[0];
49+
};
50+
51+
Poll.prototype.getOptionText = function() {
52+
//Gets the text from each <li> tag and places it in this.optionList
53+
var _this = this;
54+
for (var i=0; i<this.children.length; i++) {
55+
if (_this.children[i].tagName == "LI") {
56+
_this.optionList.push($(_this.children[i]).text());
57+
}
58+
}
59+
};
60+
61+
Poll.prototype.renderPoll = function() {
62+
//generates the HTML that the user interacts with
63+
var _this = this;
64+
this.containerDiv = document.createElement("div");
65+
this.pollForm = document.createElement("form");
66+
this.resultsDiv = document.createElement("div");
67+
68+
this.containerDiv.id = this.divid + "_container";
69+
$(this.containerDiv).addClass("alert alert-warning");
70+
71+
$(this.pollForm).text(this.question);
72+
$(this.pollForm).attr({
73+
"id":this.divid +"_form",
74+
"method" : "get",
75+
"action" : "",
76+
"onsubmit" : "return false;"
77+
});
78+
this.pollForm.appendChild(document.createElement("br"));
79+
for (var i=0; i<this.optionList.length; i++) {
80+
var radio = document.createElement("input");
81+
var tmpid = _this.divid + "_opt_" + i;
82+
$(radio).attr({
83+
"id":tmpid,
84+
"name":this.divid +"_group1",
85+
"type":"radio",
86+
"value":i
87+
});
88+
var label = document.createElement("label");
89+
$(label).attr("for", tmpid);
90+
$(label).text(this.optionList[i]);
91+
this.pollForm.appendChild(radio);
92+
this.optsArray.push(radio);
93+
this.pollForm.appendChild(label);
94+
this.pollForm.appendChild(document.createElement("br"));
95+
}
96+
97+
if (this.comment) {
98+
this.renderTextField();
99+
}
100+
101+
var button = document.createElement("button");
102+
button.onclick = function() {
103+
_this.submitPoll();
104+
};
105+
button.textContent = "Complete";
106+
$(button).attr({
107+
"class" : "btn btn-success",
108+
"name" : "Submit Poll",
109+
});
110+
111+
this.resultsDiv.id = this.divid + "_results";
112+
113+
114+
this.pollForm.appendChild(button);
115+
this.containerDiv.appendChild(this.pollForm);
116+
this.containerDiv.appendChild(this.resultsDiv);
117+
$(this.origElem).replaceWith(this.containerDiv);
118+
};
119+
120+
Poll.prototype.renderTextField = function () {
121+
this.textfield = document.createElement("input");
122+
this.textfield.type = "text";
123+
$(this.textfield).addClass("form-control");
124+
this.textfield.style.width = "300px";
125+
this.textfield.name = this.divid + "_comment";
126+
this.textfield.placeholder = "Any comments?";
127+
this.pollForm.appendChild(this.textfield);
128+
this.pollForm.appendChild(document.createElement("br"));
129+
};
130+
131+
Poll.prototype.submitPoll = function() {
132+
//checks the poll, sets localstorage and submits to the server
133+
var poll_val = null;
134+
for (var i = 0; i < this.optsArray.length; i++) {
135+
if (this.optsArray[i].checked) {
136+
poll_val = this.optsArray[i].value;
137+
break;
138+
}
139+
}
140+
if(poll_val === null)
8141
return;
9142

10-
var poll_comment = form.find("input:text[name="+div_id+"_comment]").val();
143+
var comment_val = "";
144+
if (this.comment) {
145+
comment_val = this.textfield.value;
146+
}
11147

12-
var act = '';
13-
if((poll_comment === undefined) || (poll_comment[0] !== undefined))
14-
act = poll_val + ":" + poll_comment;
15-
else
148+
var act = "";
149+
if(comment_val !== "") {
150+
act = poll_val + ":" + comment_val;
151+
} else {
16152
act = poll_val;
153+
}
17154

18-
var eventInfo = {'event':'poll', 'act':act, 'div_id':div_id};
155+
var eventInfo = {"event":"poll", "act":act, "div_id":this.divid};
19156

20157
// log the response to the database
21158
this.logBookEvent(eventInfo); // in bookfuncs.js
22159

23160
// log the fact that the user has answered the poll to local storage
24-
localStorage.setItem(div_id, "true");
25-
26-
// hide the poll inputs
27-
$("#"+div_id+"_poll_input").hide();
161+
localStorage.setItem(this.divid, "true");
28162

29163
// show the results of the poll
30164
var data = {};
31-
data.div_id = div_id;
165+
data.div_id = this.divid;
32166
data.course = eBookConfig.course;
33-
jQuery.get(eBookConfig.ajaxURL+'getpollresults', data, showPollResults);
34-
}
35-
36-
function showPollResults(data) {
37-
// create the display of the poll results
167+
jQuery.get(eBookConfig.ajaxURL+"getpollresults", data, this.showPollResults);
168+
};
38169

39-
results = eval(data);
170+
Poll.prototype.showPollResults = function(data) {
171+
//displays the results returned by the server
172+
var results = eval(data);
40173
var total = results[0];
41174
var opt_list = results[1];
42175
var count_list = results[2];
43176
var div_id = results[3];
44177

45-
var result_div = $("#"+div_id+"_results");
46-
result_div.html("<b>Results:</b><br><br>");
47-
result_div.show();
178+
$(this.resultsDiv).html("<b>Results:</b><br><br>");
48179

49180
var list = $(document.createElement("ol"));
50181
for(var i=0; i<opt_list.length; i++) {
51182
var count = count_list[i];
52183
var percent = (count / total) * 100;
53184
var text = Math.round(10*percent)/10 + "%"; // round percent to 10ths
54185

55-
var html = "<li value='"+opt_list[i]+"'><div class='progress'><div class='progress-bar progress-bar-success' style='width:"+percent+"%;'><span class='poll-text'>"+text+"</span></div></div></li>";
186+
var html = "<li value='"+opt_list[i]+"'><div class='progress'><div class='progress-bar progress-bar-success' style=width:"+percent+"%;><span class='poll-text'>"+text+"</span></div></div></li>";
56187
var el = $(html);
57188
list.append(el);
58189
}
59-
result_div.append(list);
60-
}
190+
$(this.resultsDiv).append(list);
191+
};
192+
193+
Poll.prototype.disableOptions = function() {
194+
195+
};
196+
197+
Poll.prototype.checkPollStorage = function() {
198+
//checks the localstorage to see if the poll has been completed already
199+
var _this = this;
200+
var len = localStorage.length;
201+
if (len > 0) { //If the poll has already been completed, show the results
202+
var data = {};
203+
data.div_id = this.divid;
204+
data.course = eBookConfig.course;
205+
jQuery.get(eBookConfig.ajaxURL+"getpollresults", data, this.showPollResults.bind(this));
206+
}
207+
};
208+
209+
210+
61211

212+
$(document).ready(function() {
213+
$("[data-component=poll]").each(function(index) {
214+
pollList[this.id] = new Poll({"orig":this});
215+
});
216+
});

0 commit comments

Comments
 (0)