175 lines
5.8 KiB
JavaScript
175 lines
5.8 KiB
JavaScript
/**
|
|
* Summary Page Answer Editor
|
|
*/
|
|
|
|
(function($){
|
|
$.fn.setTextAreaHeight = function(input) {
|
|
return this.each(function(){
|
|
var lineHeight = parseInt($(this).css('line-height'));
|
|
var rows = Math.ceil(input / lineHeight);
|
|
rows = rows == 0 ? 1 : rows;
|
|
|
|
$(this).attr('rows', rows);
|
|
})
|
|
}
|
|
|
|
$('input[type="radio"]').on('change', function() {
|
|
var inputName = $(this).attr('name');
|
|
//$('input[name="'+inputName+'"]').attr('checked', false);
|
|
var value = $(this).attr('value');
|
|
$('input[name="'+inputName+'"][value="'+value+'"]').attr("checked",true);
|
|
$('input[name="'+inputName+'"]').each(function() {
|
|
if($(this).val() != value) {
|
|
$(this).attr('checked', false);
|
|
}
|
|
});
|
|
});
|
|
|
|
// $('.run-js').hide().delay();
|
|
}(jQuery));
|
|
|
|
var existingValue = [];
|
|
|
|
var editClickHandler = function(e) {
|
|
e.preventDefault();
|
|
var thisEd = $(e.delegateTarget);
|
|
var height = thisEd.find('p').height();
|
|
thisEd.data('answer', thisEd.find('p').text());
|
|
if(thisEd.find('input').attr('type') == 'radio') {
|
|
existingValue = thisEd.find('input:checked').val();
|
|
}
|
|
else if(thisEd.find('input').attr('type') == 'checkbox') {
|
|
$(thisEd.find('input')).each(function() {
|
|
if($(this).prop('checked')==true) {
|
|
existingValue.push($(this).val());
|
|
}
|
|
});
|
|
}
|
|
|
|
$('.button-edit, .submit-button').addClass('disabled-button');
|
|
thisEd.addClass('editable');
|
|
thisEd.find('.text-answer:not(.code-answer)').replaceWith('<textarea class="answer-block">' + $.trim(thisEd.data('answer')) + '</textarea>');
|
|
thisEd.find('.answer-block, .code-answer').prop('disabled', false);
|
|
thisEd.find('textarea').setTextAreaHeight(height);
|
|
thisEd.find('textarea.answer-block').focus();
|
|
thisEd.find('.button-edit').hide().delay();
|
|
thisEd.find('.button-save, .button-cancel').show().delay();
|
|
// thisEd.find('button.run-js').show().delay();
|
|
};
|
|
|
|
var cancelClickHandler = function(e) {
|
|
e.preventDefault();
|
|
var thisEd = $(e.delegateTarget);
|
|
if(thisEd.find('input').attr('type') == 'radio') {
|
|
$(thisEd.find('input')).each(function() {
|
|
if($(this).val()!=existingValue) {
|
|
$(this).attr('checked', false).prop('checked', false);
|
|
}
|
|
else {
|
|
$(this).prop('checked', true);
|
|
}
|
|
});
|
|
}
|
|
else if(thisEd.find('input').attr('type') == 'checkbox') {
|
|
$(existingValue).each(function(index, value) {
|
|
thisEd.find('input[value="'+value+'"]').prop('checked', true);
|
|
});
|
|
}
|
|
$('.success, .error').remove();
|
|
$('.button-edit, .submit-button').removeClass('disabled-button');
|
|
thisEd.removeClass('editable');
|
|
thisEd.find('textarea:not(.code-answer)').replaceWith('<p class="text-answer answer-container">' + $.trim(thisEd.data('answer')) + '</p>');
|
|
thisEd.find('.answer-block, .code-answer').prop('disabled', true);
|
|
thisEd.find('.button-edit').show();
|
|
thisEd.find('.button-save, .button-cancel').hide();
|
|
// thisEd.find('button.run-js').hide();
|
|
existingValue = [];
|
|
};
|
|
|
|
var saveClickHandler = function(e) {
|
|
e.preventDefault();
|
|
var thisEd = $(e.delegateTarget);
|
|
var data =[];
|
|
var executeQuery;
|
|
var questionId = thisEd.find('.button-edit').attr('data-questionid');
|
|
|
|
if (thisEd.find('textarea.code-answer')) {
|
|
var htmlAnswer = $(thisEd.find('textarea.code-html')[0]).val();
|
|
var cssAnswer = $(thisEd.find('textarea.code-css')[0]).val();
|
|
var jsAnswer = $(thisEd.find('textarea.code-js')[0]).val();
|
|
data = {
|
|
'html': htmlAnswer,
|
|
'css': cssAnswer,
|
|
'js': jsAnswer
|
|
}
|
|
} else if(thisEd.find('input').attr('type')=='radio') {
|
|
$(thisEd.find('input')).each(function() {
|
|
if($(this).prop('checked')==true) {
|
|
data = $(this).val();
|
|
}
|
|
});
|
|
} else if(thisEd.find('input').attr('type')=='checkbox') {
|
|
$(thisEd.find('input')).each(function() {
|
|
if($(this).prop('checked')==true) {
|
|
data.push($(this).val());
|
|
}
|
|
});
|
|
} else {
|
|
data = thisEd.find('textarea').val();
|
|
}
|
|
if(data == '') {
|
|
$(thisEd).before('<div class="error">Please select or enter a value.</div>');
|
|
} else {
|
|
thisEd.find('textarea:not(.code-answer)').replaceWith('<p class="text-answer answer-container">' + $.trim(thisEd.find('textarea').val()) + '</p>');
|
|
$.ajax({
|
|
type: "POST",
|
|
url: "/summary",
|
|
data:{ id: questionId, answer: data},
|
|
success: function(data){
|
|
executeQuery = true;
|
|
//console.log(data);
|
|
},
|
|
error: function(data){
|
|
executeQuery = false;
|
|
}
|
|
}).done(function() {
|
|
if(executeQuery == true) {
|
|
$('.success, .error').remove();
|
|
$(thisEd).before('<div class="success">Your answer has been updated successfully!</div>');
|
|
$(thisEd).find('.code-answer').attr('disabled', true);
|
|
}
|
|
if(executeQuery == false) {
|
|
$('.error, .success').remove();
|
|
$(thisEd).before('<div class="error">Oops! There was an error processing your request. Please try again.</div>');
|
|
}
|
|
});
|
|
|
|
$('.button-edit, .submit-button').removeClass('disabled-button');
|
|
thisEd.removeClass('editable');
|
|
thisEd.find('.answer-block').prop('disabled', true);
|
|
thisEd.find('.button-edit').show();
|
|
thisEd.find('.button-save, .button-cancel').hide();
|
|
}
|
|
};
|
|
|
|
$('.answer-block').prop('disabled', true);
|
|
|
|
// Question events
|
|
$('.answer-sec')
|
|
.find('.button-cancel, .button-save').hide().end()
|
|
// // delegating events
|
|
.on('click', '.button-edit', editClickHandler)
|
|
.on('click', '.button-cancel', cancelClickHandler)
|
|
.on('click', '.button-save', saveClickHandler);
|
|
|
|
// Dynamically load in coders
|
|
$.each($('.answer-sec.live-coder-type'), function(index, elem){
|
|
var qid = $(elem).data('qid');
|
|
$(elem).find("[data-id='live-coder-answer']").load("/live-coder-entry/" + qid, function(){
|
|
$(elem).find('.js-error').addClass('hidden');
|
|
// updateResults();
|
|
$(elem).find(".code-input textarea").linedtextarea();
|
|
});
|
|
|
|
});
|