skill-assessment-app/app/assets/javascripts/summary-edit.js
2016-08-10 11:00:38 -05:00

96 lines
3.2 KiB
JavaScript

/* global updateResults */
/* TODO: remove global ^ once live-coder is properly name spaced */
/**
* Summary Page Answer Editor
*/
function disableForm($form){
$form.find('fieldset').prop('disabled', true);
$form.find('textarea').prop('disabled', true);
$form.find('.button-save, .button-cancel').hide();
$form.find('.button-edit').show();
$form.find('.editable').removeClass('editable');
$('.button-edit, .submit-button').removeClass('disabled-button');
}
function restoreValues($form){
$form.find('[type=radio][data-last], [type=checkbox][data-last]').each(function(){
$(this).prop('checked', $(this).attr('data-last'));
});
$form.find('textarea[data-last]').each(function(){
$(this).val($(this).attr('data-last'));
});
}
function updateLocalValues($form){
$form.find('[type=radio][data-last], [type=checkbox][data-last]').each(function(){
$(this).attr('data-last', $(this).prop('checked') ? 'checked' : '');
});
$form.find('textarea[data-last]').each(function(){
$(this).attr('data-last', $(this).val());
});
}
function updateProgress(data) {
$(".progress-bar").attr('aria-valuenow', data.progress)
.attr('style','width: '+ data.progress +'%;')
.find('span').text(data.progress + '%');
if(data.can_submit === true){
$('#summary-submit').find('.error').remove();
$('#summary-submit').find('.submit-button').prop('disabled', false);
}
}
function prepareAjax($form) {
$form.on("ajax:success", function(e, data){
$form.prepend('<div class="success">' + data.message + '</div>');
disableForm($form);
updateLocalValues($form);
updateProgress(data);
}).on("ajax:error", function(e, xhr) {
if (xhr.status === 400){
$form.prepend('<div class="error">' + xhr.responseJSON.join('<br>') + '</div>');
} else {
$form.prepend('<div class="error">Oops! There was an error processing your request. Please try again.</div>');
}
});
}
function editClickHandler(e) {
e.preventDefault();
$('.button-edit, .submit-button').addClass('disabled-button');
var $form = $(e.delegateTarget).closest('form');
$(e.delegateTarget).addClass('editable');
$form.find('fieldset').prop('disabled', false);
$form.find('textarea').prop('disabled', false);
$form.find('textarea').focus();
$form.find('.button-edit').hide().delay();
$form.find('.button-save, .button-cancel').show().delay();
}
function cancelClickHandler(e) {
e.preventDefault();
var $form = $(e.delegateTarget).closest('form');
$form.find('.error, .success').remove();
disableForm($form);
restoreValues($form);
updateResults($form.find("[data-id=live-coder-answer]"));
}
function saveClickHandler(e) {
e.preventDefault();
var $form = $(e.delegateTarget).closest('form');
$form.find('.error, .success').remove();
$form.submit();
}
$('.summary_tpl fieldset').prop('disabled', true);
$('.summary_tpl textarea').prop('disabled', true);
$('.summary_tpl form').each(function(){ prepareAjax($(this)); });
$('.summary_tpl .answer-sec')
.find('.button-cancel, .button-save').hide().end()
.on('click', '.button-edit', editClickHandler)
.on('click', '.button-cancel', cancelClickHandler)
.on('click', '.button-save', saveClickHandler);