Skip to content

Instantly share code, notes, and snippets.

@Rustem

Rustem/course_builder.js

Created November 25, 2013 12:15
Show Gist options
  • Save Rustem/7640428 to your computer and use it in GitHub Desktop.
Save Rustem/7640428 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
course_builder.js
;(function($, window, document, undefined) {
utils = {
guid: function() {
var s4 = function() {
return Math.floor((1 + Math.random()) * 0x10000)
.toString(16)
.substring(1);
};
return s4() + s4() + '-' + s4() + '-' + s4() + '-' +
s4() + '-' + s4() + s4() + s4();
},
};
nav = {
switch_off_bar: function($bar_ol) {
$bar_ol.find('li').each(function() {
$(this).find('div:first').removeClass('current');
});
},
check_bar_item_selected: function($bar_ol) {
result = $bar_ol.find('li div.current');
return result.length > 0;
}
}
var pname = 'course_builder';
var CourseBuilder = function(element, options) {
this.$element = $(element);
this.element = element;
this.options = options;
this.init();
};
CourseBuilder.prototype = {
init: function() {
var self = this;
var links = this.options.links;
this.$element.on('click', links.add_chapter, $.proxy(this.render_create_chapter_form, this)
).on('click', links.edit_chapter, $.proxy(this.render_edit_chapter_form, this)
).on('itemSelected', $.proxy(self.on_itemSelected, this)
).on('click', links.add_learning, $.proxy(this.render_create_learning_form, this)
).on('click', links.edit_learning, $.proxy(this.render_edit_learning_form, this)
).on('click', links.add_question, $.proxy(this.render_create_question_form, this)
).on('click', links.edit_question, $.proxy(this.render_edit_question_form, this)
).on('formReloaded', $.proxy(this.on_form_reloaded, this));
var $active_chapter = $(this.options.tabs.chapter).find("li div[class*='current']");
$active_chapter.find(links.edit_chapter).trigger('click', []);
},
render_create_chapter_form: function(evt) {
evt.preventDefault();
var self = this;
var $create_chapter_form = $(this.options.chapter_form)
.clone()
.removeClass('hide')
.attr('id', 'js-create-chapter-form');
$(self.options.form_wrapper).html($create_chapter_form);
$create_chapter_form.on('submit', function(evt) {
evt.preventDefault();
var url = $(this).data('url');
self.crud_save_request(url, $(this).serializeObject(), function(obj) {
var themes = self.options.state.themes;
themes.push(obj);
self.redraw_nav_bar('chapters', {'current': themes.length - 1});
var $target = $(self.options.tabs.chapter);
var e = $.Event('chapterCreated', {'relatedTarget': $target[0]});
self.$element.trigger(e, [obj]);
if(e.isDefaultPrevented()) return;
});
return false;
});
var e = $.Event('itemSelected', {'relatedTarget': $create_chapter_form[0]});
this.$element.trigger(e, [{
'which': 'chapter',
'obj': null,
}]);
return false;
},
render_edit_chapter_form: function(evt) {
evt.preventDefault();
var self = this;
nav.switch_off_bar($(evt.currentTarget).closest('ol'))
var chapter_id = $(evt.currentTarget)
.closest('div')
.addClass('current').data('chapterId');
var current_chapter = this.options.state.themes[chapter_id];
$edit_chapter_form = $(this.options.chapter_form).clone()
.loadJSON(current_chapter)
.removeClass('hide')
.attr('id', 'js-edit-chapter-form');
var url = Urls['manage-course-edit-theme'](
this.options.state.id, chapter_id.toString());
$edit_chapter_form.data('url', url);
$(self.options.form_wrapper).html($edit_chapter_form);
$edit_chapter_form.on('submit', function(evt) {
evt.preventDefault();
var url = $(this).data('url');
self.crud_save_request(url, $(this).serializeObject(), function(obj) {
self.options.state.themes[chapter_id] = obj;
self.redraw_nav_bar('chapters', {'current': chapter_id});
var $target = $(self.options.tabs.chapter);
var e = $.Event('chapterUpdated', {'target': $target[0]});
self.$element.trigger(e, [obj]);
if(e.isDefaultPrevented()) return;
});
return false;
});
var e = $.Event('itemSelected', {'relatedTarget': $edit_chapter_form[0]});
this.$element.trigger(e, [{
'which': 'chapter',
'obj': this.options.state.themes[chapter_id],
'current_chapterIdx': chapter_id
}]);
return false;
},
render_create_learning_form: function(evt) {
evt.preventDefault();
if(!nav.check_bar_item_selected($(this.options.tabs.chapter))) {
alert('Chapter must be selected');
return false;
}
nav.switch_off_bar($(evt.currentTarget).closest('ol:first'))
var self = this,
current_chapter_idx = $(evt.currentTarget).data('parentIdx'),
current_chapter_id = $(evt.currentTarget).data('parentId'),
current_theme = this.options.state.themes[current_chapter_idx];
var $create_learning_form = $(this.options.learning_form)
.clone()
.removeClass('hide')
.attr('id', 'js-create-learning-form-' + utils.guid());
var url = Urls['manage-course-add-learning'](
this.options.state.id, current_chapter_id);
$create_learning_form.data('url', url);
$(self.options.form_wrapper).html($create_learning_form);
$create_learning_form.on('submit', function(evt) {
evt.preventDefault();
self.crud_save_request(url, $(this).serializeObject(), function(obj) {
current_theme.learnings.push(obj);
self.redraw_nav_bar('learnings', {
'chapter_idx': current_chapter_idx,
'learning_idx': current_theme.learnings.length - 1});
var $target = $(self.options.tabs.learning);
var e = $.Event('learningCreated', {'target': $target[0]});
self.$element.trigger(e, [obj]);
if(e.isDefaultPrevented()) return;
});
return false;
});
var e = $.Event('itemSelected', {'relatedTarget': $create_learning_form});
this.$element.trigger(e, [{
'which': 'learning',
'obj': null,
'chapter_idx': current_chapter_idx
}]);
return false;
},
render_edit_learning_form: function(evt) {
evt.preventDefault();
if(!nav.check_bar_item_selected($(this.options.tabs.chapter))) {
alert('Chapter must be selected');
return false;
}
nav.switch_off_bar($(evt.currentTarget).closest('ol'));
$(evt.currentTarget).closest('div').addClass('current');
var self = this,
learning_state = $(evt.currentTarget).data('learningState');
if(!learning_state || learning_state === undefined)
return;
var current_chapter = this.options.state.themes[learning_state['chapter_idx']];
var current_learning = current_chapter.learnings[learning_state['material_idx']];
var $edit_learning_form = $(this.options.learning_form)
.clone()
.loadJSON(current_learning.material)
.removeClass('hide')
.attr('id', 'js-edit-learning-form-' + utils.guid());
// attach attachments
var $cur_attachments = []
var attach_tmpl = _.template($(this.options.templates.attachment).text());
for(var i = 0; i<current_learning.material.attachments.length; i++) {
var attachment = current_learning.material.attachments[i];
$cur_attachments.push(attach_tmpl({
'id': attachment.id,
'name': attachment.name,
'number': i + 1, // attachments starts with 1 (just for consistency)
'url': attachment.url,
'method': 'POST'
}));
}
$edit_learning_form.find('ul#attachments-list').html($cur_attachments);
var url = Urls['manage-course-edit-learning'](
this.options.state.id,
learning_state['chapter_id'],
learning_state['material_idx'].toString());
$edit_learning_form.data('url', url);
$(self.options.form_wrapper).html($edit_learning_form);
$edit_learning_form.on('submit', function(evt) {
evt.preventDefault();
self.crud_save_request(url, $(this).serializeObject(), function(obj) {
current_chapter.learnings[learning_state['material_idx']] = obj;
self.redraw_nav_bar('learnings', {
'chapter_idx': learning_state['chapter_idx'],
'learning_idx': learning_state['material_idx']});
var $target = $(self.options.tabs.learning);
var e = $.Event('learningUpdated', {'target': $target[0]});
self.$element.trigger(e, [obj]);
if(e.isDefaultPrevented()) return;
});
return false;
});
var e = $.Event('itemSelected', {'relatedTarget': $edit_learning_form});
this.$element.trigger(e, [{
'which': 'learning',
'obj': current_learning,
'learning_idx': learning_state['material_idx'],
'chapter_idx': learning_state['chapter_idx']
}]);
return false;
},
on_form_reloaded: function(evt, question_formObj) {
evt.currentTarget = this.options.links.add_question;
var self = this,
current_chapter_idx = $(evt.currentTarget).data('chapterIdx'),
current_learning_idx = $(evt.currentTarget).data('learningIdx');
var current_theme = this.options.state.themes[current_chapter_idx],
current_learning = current_theme.learnings[current_learning_idx];
question_formObj.$form.on('questionSaved.question_builder', function(evt, question) {
current_learning.questions.push(question);
self.redraw_nav_bar('questions', {
'chapter_idx': current_chapter_idx,
'learning_idx': current_learning_idx,
'question_idx': current_learning.questions.length - 1,});
var $target = $(self.options.tabs.question);
var e = $.Event('questionCreated', {'target': $target[0]});
self.$element.trigger(e, [question]);
if(e.isDefaultPrevented()) return;
return false;
});
},
render_create_question_form: function(evt) {
if(!nav.check_bar_item_selected($(this.options.tabs.learning))) {
alert('Learning must be selected');
return false;
}
nav.switch_off_bar($(evt.currentTarget).closest('ol'));
var self = this,
current_chapter_idx = $(evt.currentTarget).data('chapterIdx'),
current_learning_idx = $(evt.currentTarget).data('learningIdx');
var current_theme = this.options.state.themes[current_chapter_idx],
current_learning = current_theme.learnings[current_learning_idx];
var question_builder = this.$element.data('question_builder');
if(question_builder !== undefined) {
question_builder.unbind();
}
var question_ctx = $.extend({
'chapter_id': current_theme.id,
'learning_idx': current_learning_idx,
'skills': this.options.state.skills || [],
'material': current_learning.material,
'action_type': 'create'
}, this.options.question_builder_ctx);
question_builder = this.$element.question_builder(
question_ctx).data('question_builder');
question_builder.$form.on('questionSaved.question_builder', function(evt, question) {
current_learning.questions.push(question);
self.redraw_nav_bar('questions', {
'chapter_idx': current_chapter_idx,
'learning_idx': current_learning_idx,
'question_idx': current_learning.questions.length - 1,});
var $target = $(self.options.tabs.question);
var e = $.Event('questionCreated', {'target': $target[0]});
self.$element.trigger(e, [question]);
if(e.isDefaultPrevented()) return;
return false;
});
var e = $.Event('itemSelected', {'relatedTarget': null});
this.$element.trigger(e, [{
'which': 'question',
'obj': null,
'chapter_idx': current_chapter_idx,
'learning_idx': current_learning_idx
}]);
return false;
},
render_edit_question_form: function(evt) {
if(!nav.check_bar_item_selected($(this.options.tabs.learning))) {
alert('Learning must be selected');
return false;
}
nav.switch_off_bar($(evt.currentTarget).closest('ol'));
$(evt.currentTarget).closest('div').addClass('current');
var self = this,
question_state = $(evt.currentTarget).data('questionState');
var cur_theme = this.options.state.themes[question_state.chapter_idx];
var cur_learning = cur_theme.learnings[question_state.learning_idx];
var cur_question = $.extend({}, cur_learning.questions[question_state.idx]);
var question_builder = this.$element.data('question_builder');
if(question_builder !== undefined) {
question_builder.unbind();
}
var question_ctx = $.extend({
'chapter_id': question_state.chapter_id,
'learning_idx': question_state.learning_idx.toString(),
'skills': this.options.state.skills || [],
'material': question_state.material_id,
'action_type': 'edit'
}, this.options.question_builder_ctx);
question_builder = this.$element.question_builder(
question_ctx).data('question_builder');
var url = Urls['manage-course-question-edit'](
question_state.chapter_id,
question_state.learning_idx.toString(),
question_state.id);
var formObj = question_builder.load_question_form(question_state.type, url, cur_question);
formObj.$form.on('questionSaved.question_builder', function(evt, question) {
cur_learning.questions[question_state.idx] = question;
self.redraw_nav_bar('questions', {
'chapter_idx': question_state.chapter_idx,
'learning_idx': question_state.learning_idx,
'question_idx': question_state.idx,});
var $target = $(self.options.tabs.question);
var e = $.Event('questionUpdated', {'target': $target[0]});
self.$element.trigger(e, [question]);
if(e.isDefaultPrevented()) return;
});
return false;
},
redraw_nav_bar: function(where, ctx) {
var themes = this.options.state.themes;
switch(where) {
case 'chapters':
this.redraw_nav_chapters(ctx.current);
this.redraw_nav_learnings(themes[ctx.current].learnings, themes[ctx.current].id);
break;
case 'learnings':
this.redraw_nav_learnings(themes[ctx.chapter_idx].learnings, ctx.chapter_idx,
ctx.learning_idx);
this.redraw_nav_questions(themes[ctx.chapter_idx].learnings[ctx.learning_idx].questions,
ctx.learning_idx, ctx.chapter_idx, null);
break;
case 'questions':
var learning = themes[ctx.chapter_idx].learnings[ctx.learning_idx];
this.redraw_nav_questions(learning.questions, ctx.learning_idx,
ctx.chapter_idx, ctx.question_idx);
break;
default:
alert("that's a bug");
}
},
redraw_nav_chapters: function(current) {
var self = this;
var themes = this.options.state.themes;
var tmpl = _.template($(this.options.templates.chapter_nav).text());
var chapters = [];
for(var i=0; i<themes.length; i++) {
var cur = themes[i];
cur.id = i;
cur.is_current = current == i && true || false;
var $nav_item = tmpl({'chapter': cur});
chapters.push($nav_item);
}
$(this.options.tabs.chapter).html(chapters);
},
redraw_nav_learnings: function(learnings, parent_id, current) {
if(current === undefined) current = -1;
var self = this;
var tmpl = _.template($(this.options.templates.learning_nav).text());
var $learnings = [];
for(var i = 0; i<learnings.length; i++) {
var cur = learnings[i];
var is_current = current == i && true || false;
cur.parent_id = parent_id;
var $nav_item = tmpl({
'learning': cur.material,
'learning_state': {
'chapter_id': this.options.state.themes[parent_id].id,
'chapter_idx': parent_id,
'material_id': cur.material.id,
'material_idx': i,
},
'is_current': is_current
});
$learnings.push($nav_item);
}
$(this.options.tabs.learning).html($learnings);
},
redraw_nav_questions: function(questions, learning_idx, chapter_idx, current_idx) {
if(current_idx === undefined) current_idx = -1;
var self = this;
var tmpl = _.template($(this.options.templates.question_nav).text());
var $questions = [];
var the_theme = this.options.state.themes[chapter_idx];
for(var i = 0; i<questions.length; i++) {
var the_question = questions[i];
var is_current = current_idx == i && true || false;
var $question = tmpl({
'question': the_question,
'question_state': {
'chapter_id': the_theme.id,
'chapter_idx': chapter_idx,
'learning_idx': learning_idx,
'material_id': the_theme.learnings[learning_idx].material.id,
'id': the_question.id,
'idx': i,
'type': the_question.code
},
'is_current': is_current
});
$questions.push($question);
}
$(this.options.tabs.question).html($questions);
},
crud_save_request: function(url, data, callback) {
var self = this;
data = JSON.stringify(data);
$.post(url, data, function(result) {
if(result.success === true) {
if(callback && callback !== undefined) {
callback(result.object);
}
} else {
self.render_errors(result.errors);
}
return false;
});
},
on_itemSelected: function(evt, data) {
var $form = $(evt.relatedTarget);
if(data.which === 'chapter') {
if(data.obj != null) {
this.redraw_nav_learnings(data.obj.learnings, data.current_chapterIdx);
$(this.options.links.add_learning)
.data('parentId', data.obj.id)
.data('parentIdx', data.current_chapterIdx)
.removeClass('hide').addClass('active');
$(this.options.tabs.learning).removeClass('hide');
} else {
nav.switch_off_bar($(this.options.tabs.chapter));
nav.switch_off_bar($(this.options.tabs.learning));
$(this.options.links.add_learning)
.data('parentId', '')
.data('parentIdx', '')
.removeClass('active').addClass('hide');
$(this.options.tabs.learning).addClass('hide');
}
} else if(data.which === 'learning') {
// init attachment plugin
$form.find('ul#attachments-list').attachment_manager({
'attachment_template': "#js-attachment-template",
'main_form': '#' + evt.relatedTarget.id,
'fileupload': '#fileupload',
//'progress': '.fileupload-progress',
'urls': {
'upload': Urls['manage-material-attachment-upload'](),
},
'submit_btn': '#submit',
'remove_btn': 'a.del',
'cancel_btn': '#cancel',
'dialog_trigger': '#js-file-dialog-btn'
});
$form.find('textarea[name="body_md"]').mdmagick({
'previewContainer': $form.find('#js-preview-container')});
if(data.obj != null) {
this.redraw_nav_questions(data.obj.questions, data.learning_idx, data.chapter_idx);
$(this.options.links.add_question).data({
'parentId': data.obj.id,
'parentIdx': data.learning_idx});
$(this.options.links.add_question)
.data('learningIdx', data.learning_idx)
.data('chapterIdx', data.chapter_idx)
.removeClass('hide').addClass('active');
$(this.options.tabs.question).removeClass('hide');
} else {
nav.switch_off_bar($(this.options.tabs.learning));
$(this.options.links.add_question)
.data('learningIdx', '')
.data('chapterIdx', '')
.removeClass('active').addClass('hide');
$(this.options.tabs.question).addClass('hide');
}
} else if(data.which === 'question') {
console.log("question item selected");
if(data.obj != null) {
} else {
nav.switch_off_bar($(this.options.tabs.question));
}
}
},
render_errors: function(errors) {
console.log(errors);
alert('errors');
},
};
$.fn.course_builder = function(option) {
var args = Array.prototype.slice.call(arguments, 1);
return this.each(function() {
var $this = $(this),
data = $this.data(pname),
options = $.extend({}, $.fn.course_builder.defaults, typeof option === 'object' && option);
if(!data) {
$this.data(pname, (data = new CourseBuilder($this, options)));
}
if(typeof option === 'string') {
data[option].apply(data, args);
}else {
}
});
};
$.fn.course_builder.defaults = {
'state': '',
'chapter_form': '',
'lesson_form': '',
'links': {
},
'form_wrapper': '',
'tabs': {
},
'templates': {
}
};
$.fn.serializeObject = function() {
var o = {};
var a = this.serializeArray();
$.each(a, function() {
if (o[this.name] !== undefined) {
if (!o[this.name].push) {
o[this.name] = [o[this.name]];
}
o[this.name].push(this.value || '');
} else {
o[this.name] = this.value || '';
}
});
return o;
};
})( jQuery );
Raw
question_builder.js
;(function($, window, document, undefined) {
utils = {
guid: function() {
var s4 = function() {
return Math.floor((1 + Math.random()) * 0x10000)
.toString(16)
.substring(1);
};
return s4() + s4() + '-' + s4() + '-' + s4() + '-' +
s4() + '-' + s4() + s4() + s4();
},
};
var pname = 'question_builder';
var QuestionBuilderFactory = $.QuestionBuilder = Class.extend({
init: function(element, options) {
this.$element = $(element);
this.element = element;
this.ctx = $.extend({
}, options);
this.action_type = options.action_type;
this.init_evt_handlers();
},
init_evt_handlers: function() {
var self = this;
this.$element.on('change.question_builder', this.ctx.set_question_type + ' select:first', function(evt) {
var qtype = $(this).val();
var formUrl = Urls['manage-course-question-add'](
self.ctx.chapter_id, self.ctx.learning_idx.toString(), qtype);
var question_formObj = self.load_question_form(qtype, formUrl, {});
$(document).trigger('formReloaded', [question_formObj]);
return false;
});
$(this.ctx.set_question_type).removeClass('hide');
if(this.action_type == 'create') {
var qtype = this.$element.find(this.ctx.set_question_type + ' select option:selected').val();
var formUrl = Urls['manage-course-question-add'](
self.ctx.chapter_id, self.ctx.learning_idx.toString(), qtype);
var question_formObj = self.load_question_form(qtype, formUrl, {});
} else {
$(this.ctx.set_question_type).addClass('hide')
.find('select:first').unbind('change.question_builder');
}
},
load_question_form: function(qtype, url, params) {
var $form = this.$form = $(this.ctx.forms[qtype])
.clone()
.removeClass('hide')
.attr('id', 'js-create-question-form-' + qtype + "-" + utils.guid());
// populate form with skills
var $options = [];
for(var i = 0; i<this.ctx.skills.length; i++) {
var the_skill = this.ctx.skills[i];
$options.push($(document.createElement('option'))
.val(the_skill.id)
.text(the_skill.name));
}
this.$form.find('select#js-select-skills-input').html($options);
if(this.action_type == 'create') {
// create
this.$form.find('input[name="material"]').val(this.ctx.material.id);
} else {
//edit
this.$form.find('input[name="material"]').val(params.material.id);
}
var question_formObj = this.question_formObj = this.getQuestionForm(
qtype, $form[0], url, params);
$(this.ctx.form_wrapper).html($form);
return question_formObj;
},
getQuestionForm: function(qtype, form, url, params) {
var QuestionForm = QUESTION_FORMS[qtype];
return (QuestionForm ? new QuestionForm(form, url, "POST", params) : null);
},
unbind: function() {
$(this.ctx.form_wrapper).html('');
$(document).unbind('.question_builder');
if(this.$form !== undefined) {
this.question_formObj.unbind();
this.$form.remove();
}
this.$element.data(pname, null);
}
});
var QuestionFormWithContext = Class.extend({
init: function(form, action, method, params) {
this.form = form;
this.$form = $(form)
.attr('method', method)
.attr('action', action);
this.action = action;
this.params = params;
this.init_plugins();
this.bind_to_evts();
this.populate_dynamic_fields();
this.populate_form_fields();
},
init_plugins: function() {
this.$form.find('textarea[name="body_md"]').mdmagick({
'previewContainer': this.$form.find('#js-preview-container')});
},
bind_to_evts: function() {
this.$form.on('click.question_builder', '#js-add-skill-link', $.proxy(this.add_skill, this)
).on('click.question_builder', '.js-remove-skill-link', $.proxy(this.remove_skill, this)
).on('submit.question_builder', $.proxy(this.on_submit, this));
},
populate_dynamic_fields: function() {
var $skills = [];
if(this.params.skills){
for(var i = 0; i<this.params.skills.length; i++) {
var the_skill =this.params.skills[i];
var $the_skill = $(document.createElement('li')).html(
the_skill.name + " <a href='#' class='js-remove-skill-link'>[" + gettext("remove") +
"]</a><input type='hidden' name='skill' value='" + the_skill.id + "'/>"
);
$skills.push($the_skill);
}
}
this.$form.find('ul.js-skill-list').html($skills);
},
populate_form_fields: function() {
this.$form.loadJSON(this.params);
},
on_submit: function(evt) {
evt.preventDefault();
var self = this;
this.crud_save_request(this.action, this.$form.serializeObject(), function(obj) {
self.$form.trigger('questionSaved.question_builder', [obj]);
});
return false;
},
add_skill: function(evt) {
var $selected_option = this.$form.find('#js-select-skills-input option:selected');
var $skill_item = $(document.createElement('li')).html(
$.trim($selected_option.text()) + " <a href='#' class='js-remove-skill-link'>[" + gettext("remove") +
"]</a><input type='hidden' name='skill' value='" + $selected_option.val() + "'/>");
this.$form.find('ul.js-skill-list').append($skill_item);
return false;
},
remove_skill: function(evt) {
$(evt.currentTarget).closest('li').remove();
return false;
},
unbind: function() {
this.$form.unbind('.question_builder');
},
crud_save_request: function(url, data, callback) {
var self = this;
data = JSON.stringify(data);
$.post(url, data, function(result) {
if(result.success === true) {
if(callback && callback !== undefined) {
callback(result.object);
}
} else {
self.render_errors(result.errors);
}
return false;
});
},
render_errors: function(errors) {
console.log("errors", errors);
}
});
var MCMAQuestionForm = QuestionFormWithContext.extend({
bind_to_evts: function() {
this._super();
this.$form.on('click.question_builder', '#js-add-answer-choice-link', $.proxy(this.add_answer_choice, this)
).on('click.question_builder', '.js-remove-answer-choice-link', $.proxy(this.remove_answer_choice, this)
);
},
populate_dynamic_fields: function() {
this._super();
var $variants = [];
for(var i in this.params.variants) {
var variant = this.params.variants[i];
var $variant = $(document.createElement('li')).html(
variant.value + " <a href='#' class='js-remove-answer-choice-link'>[" + gettext('remove') +
"]</a><input type='hidden' name='value' value='" + variant.value + "'/>" +
"<input type='hidden' name='is_right' value='" + variant.is_right + "'/>");
$variants.push($variant);
}
this.$form.find('ul.js-answer-choice-list').html($variants);
},
add_answer_choice: function(evt) {
var $input = this.$form.find('input[name="js-answer-choice-input"]');
var $selected_option = this.$form.find('select[name="js-answer-choice-select"] option:selected');
if(!$.trim($input.val())) {
alert(gettext("Provide answer choice, before adding something"));
return false;
}
var $answer_choice_item = $(document.createElement('li')).html(
$.trim($input.val()) + " <a href='#' class='js-remove-answer-choice-link'>[" + gettext('remove') +
"]</a><input type='hidden' name='value' value='" + $.trim($input.val()) + "'/>" +
"<input type='hidden' name='is_right' value='" + $selected_option.val() + "'/>");
this.$form.find('ul.js-answer-choice-list').append($answer_choice_item);
return false;
},
remove_answer_choice: function(evt) {
$(evt.currentTarget).closest('li').remove();
return false;
}
});
var MCSAQuestionForm = MCMAQuestionForm.extend({
});
var EssayQuestionForm = QuestionFormWithContext.extend({
bind_to_evts: function() {
this._super();
this.$form.on('click.question_builder', '#js-add-answer-field-link', $.proxy(this.add_keyword_group, this)
).on('click.question_builder', '.js-remove-answer-field-link', $.proxy(this.remove_keyword_group, this)
);
},
populate_dynamic_fields: function() {
this._super();
var $keywords = [];
console.log(this.params)
for(var i in this.params.keyword) {
var kw_item = this.params.keyword[i].join(", ");
var $kw_item = $(document.createElement('li')).html(
kw_item + " <a href='#' class='js-remove-answer-field-link'>[" + gettext('remove') +
"]</a><input type='hidden' name='keyword' value='" + kw_item + "'/>");
$keywords.push($kw_item);
}
this.$form.find('ul.js-question-answer-list').html($keywords);
},
add_keyword_group: function(evt) {
var $input = this.$form.find('#js-keyword-input');
if(!$.trim($input.val())) {
alert(gettext("Provide keywords, before adding something."));
return false;
}
var $keyword_item = $(document.createElement('li')).html(
$.trim($input.val()) + " <a href='#' class='js-remove-answer-field-link'>[" + gettext('remove') +
"]</a><input type='hidden' name='keyword' value='" + $.trim($input.val()) + "'/>");
this.$form.find('ul.js-question-answer-list').append($keyword_item);
return false;
},
remove_keyword_group: function(evt) {
$(evt.currentTarget).closest('li').remove();
return false;
}
});
var CTagQuestionForm = QuestionFormWithContext.extend({
populate_form_fields: function() {
if('fake_words' in this.params || 'real_words' in this.params) {
this.params['fake_words'] = this.params['fake_words'].join(', ');
this.params['real_words'] = this.params['real_words'].join(', ');
}
this._super();
},
});
var QUESTION_FORMS = {
'es': EssayQuestionForm,
'mc-ma': MCMAQuestionForm,
'mc-sa': MCSAQuestionForm,
'ctag': CTagQuestionForm
};
$.fn.serializeObject = function() {
var o = {};
var a = this.serializeArray();
$.each(a, function() {
if (o[this.name] !== undefined) {
if (!o[this.name].push) {
o[this.name] = [o[this.name]];
}
o[this.name].push(this.value || '');
} else {
o[this.name] = this.value || '';
}
});
return o;
};
})( jQuery, window, document);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment