Skip to content
Permalink
Browse files

Fixed issue #15160: Upload button not working (File Upload question t…

…ype)

Dev: assets for question/upload module need to be compiled
  • Loading branch information...
dominikvitt committed Oct 4, 2019
1 parent 1b8c5a2 commit c6a240eac75da35be3119d9d815f5047a56f03cc
@@ -301,10 +301,10 @@ public function run($actionID)
var surveyid = surveyid || "'.$surveyid.'";
showpopups="'.$oTemplate->showpopups.'";
';
$sLangScriptVar = "
uploadLang = {
$sLangScript = "{
titleFld: '" . gT('Title', 'js')."',
commentFld: '" . gT('Comment', 'js')."',
filenameFld: '" . gT('File name', 'js')."',
errorNoMoreFiles: '" . gT('Sorry, no more files can be uploaded!', 'js')."',
errorOnlyAllowed: '" . gT('Sorry, only %s files can be uploaded for this question!', 'js')."',
uploading: '" . gT('Uploading', 'js')."',
@@ -315,19 +315,18 @@ public function run($actionID)
errorTooMuch: '" . gT('The maximum number of files has been uploaded. You may return back to survey.', 'js')."',
errorNeedMoreConfirm: '" . gT("You need to upload %s more files for this question.\nAre you sure you want to exit?", 'js')."',
deleteFile : '".gT('Delete', 'js')."',
editFile : '".gT('Edit', 'js')."',
};
editFile : '".gT('Edit', 'js')."'
}
";
$sLangScriptVar = "
uploadLang = " . $sLangScript . ";";
$oTemplate = Template::model()->getInstance('', $surveyid);
Yii::app()->clientScript->registerPackage('survey-template-'.$oTemplate->sTemplateName);
// App()->getClientScript()->registerCssFile(Yii::app()->getConfig("publicstyleurl")."uploader.css");
// App()->getClientScript()->registerCssFile(Yii::app()->getConfig('publicstyleurl')."uploader-files.css");
App()->getClientScript()->registerScript('sNeededScriptVar', $sNeededScriptVar, LSYii_ClientScript::POS_BEGIN);
App()->getClientScript()->registerScript('sLangScriptVar', $sLangScriptVar, LSYii_ClientScript::POS_BEGIN);
// App()->getClientScript()->registerScriptFile(Yii::app()->getConfig("generalscripts").'ajaxupload.js', LSYii_ClientScript::POS_END);
// App()->getClientScript()->registerScriptFile(Yii::app()->getConfig("generalscripts").'uploader.js', LSYii_ClientScript::POS_END);
App()->bootstrap->register();
App()->getClientScript()->registerScriptFile('/assets/packages/questions/upload/build/uploadquestion.js');
App()->getClientScript()->registerScriptFile('/assets/packages/questions/upload/src/ajaxupload.js');
$header = getHeader($meta);
@@ -358,12 +357,16 @@ public function run($actionID)
window.uploadModalObjects = window.uploadModalObjects || {};
window.uploadModalObjects['".$fn."'] = window.getUploadHandler( "
. $qid.", {"
. "qid : '".$qid."', "
. "sFieldName : '".$sFieldName."', "
. "sPreview : '".$sPreview."', "
. "questgrppreview : '".$sPreview."', "
. "uploadurl : '".$this->createUrl('/uploader/index/mode/upload/')."', "
. "csrfToken: '".ls_json_encode(Yii::app()->request->csrfToken)."', "
. "showpopups: '".Yii::app()->getConfig("showpopups")."'"
. "});"
. "});
. "showpopups: '".Yii::app()->getConfig("showpopups")."', "
. "uploadLang: ".$sLangScript
. "});
});
</script>";
$container = $this->renderPartial('/survey/questions/answer/file_upload/modal-container', $aData, true);
$body .= $container.$scripts;
@@ -4149,7 +4149,7 @@ function getLabelSets($languages = null)
function getHeader($meta = false)
{
/* Todo : move this to layout/public.html */
global $surveyid;
$surveyid = Yii::app()->session['LEMsid'];
$oSurvey = Survey::model()->findByPk($surveyid);
Yii::app()->loadHelper('surveytranslator');
@@ -1792,12 +1792,20 @@ function upload_$ia[1]() {
$filecountvalue = $tempval;
}
}
$uploadurl = $scriptloc."?sid=".Yii::app()->getConfig('surveyID')."&fieldname=".$ia[1]."&qid=".$ia[0];
$uploadurl .= "&preview=".$questgrppreview."&show_title=".$aQuestionAttributes['show_title'];
$uploadurl .= "&show_comment=".$aQuestionAttributes['show_comment'];
$uploadurl .= "&minfiles=".$aQuestionAttributes['min_num_of_files']; // TODO: Regression here? Should use LEMval(minfiles) like above
$uploadurl .= "&maxfiles=".$aQuestionAttributes['max_num_of_files']; // Same here.
$fileuploadData = array(
'fileid' => $ia[1],
'value' => $_SESSION['survey_'.Yii::app()->getConfig('surveyID')][$ia[1]],
'filecountvalue'=>$filecountvalue,
'coreClass'=>$coreClass,
'basename' => $ia[1],
'uploadurl' => $uploadurl,
'uploadButtonLabel' => ngT("Upload file|Upload files", $aQuestionAttributes['max_num_of_files'])
);
$answer .= doRender('/survey/questions/answer/file_upload/answer', $fileuploadData, true);
$answer .= '<script type="text/javascript">
@@ -1841,11 +1849,6 @@ function upload_$ia[1]() {
$("#'.$ia[1].'_filecount").val(filecount);
});
</script>';
$uploadurl = $scriptloc."?sid=".Yii::app()->getConfig('surveyID')."&fieldname=".$ia[1]."&qid=".$ia[0];
$uploadurl .= "&preview=".$questgrppreview."&show_title=".$aQuestionAttributes['show_title'];
$uploadurl .= "&show_comment=".$aQuestionAttributes['show_comment'];
$uploadurl .= "&minfiles=".$aQuestionAttributes['min_num_of_files']; // TODO: Regression here? Should use LEMval(minfiles) like above
$uploadurl .= "&maxfiles=".$aQuestionAttributes['max_num_of_files']; // Same here.
$answer .= '
<!-- Trigger the modal with a button -->
<!-- Modal -->
@@ -18,7 +18,7 @@
href='#'
onclick='javascript:upload_{{ fileid }}();'
>
<span class='fa fa-upload'></span>&nbsp;{{ gT('Upload files') }}
<span class='fa fa-upload'></span>&nbsp;{{ uploadButtonLabel }}
</a>
</div>
<input type='hidden' id='{{ fileid }}' name='{{ fileid }}' value='{{ value }}' />
@@ -1,10 +1,10 @@
<div class="model-container clearfix">
<div id="notice" class="text-center"></div>
<input type="hidden" id="ia_<?=$fn?>" value="<?=$fn?>" />
<input type="hidden" id="<?=$fn?>_minfiles" value="'.$minfiles.'" />
<input type="hidden" id="<?=$fn?>_maxfiles" value="'.$maxfiles.'" />
<input type="hidden" id="<?=$fn?>_maxfilesize" value="'<?=$qidattributes['max_filesize']?>" />
<input type="hidden" id="<?=$fn?>_allowed_filetypes" value="'<?=$qidattributes['allowed_filetypes']?>" />
<input type="hidden" id="<?=$fn?>_minfiles" value="<?=$minfiles?>" />
<input type="hidden" id="<?=$fn?>_maxfiles" value="<?=$maxfiles?>" />
<input type="hidden" id="<?=$fn?>_maxfilesize" value="<?=$qidattributes['max_filesize']?>" />
<input type="hidden" id="<?=$fn?>_allowed_filetypes" value="<?=$qidattributes['allowed_filetypes']?>" />
<input type="hidden" id="preview" value="<?=Yii::app()->session['preview']?>" />
<input type="hidden" id="<?=$fn?>_show_comment" value="<?=$qidattributes['show_comment']?>" />
<input type="hidden" id="<?=$fn?>_show_title" value="<?=$qidattributes['show_title']?>" />
@@ -5,7 +5,8 @@ $(function() {
});

function openUploadModalDialog(){
$('.upload').click(function(e) {
$('.upload').off('click.lsuploadquestion');
$('.upload').on('click.lsuploadquestion',function(e) {

e.preventDefault();

@@ -20,16 +21,18 @@ function openUploadModalDialog(){
};

$('#file-upload-modal-' + fieldname).modal('show');
$(document).on('shown.bs.modal','#file-upload-modal-' + fieldname, function()
$(document).off('shown.bs.modal.lsuploadquestion');
$(document).on('shown.bs.modal.lsuploadquestion','#file-upload-modal-' + fieldname, function()
{
var uploadFrame = $('#uploader'+fieldname);
uploadFrame.load(uploadFrame.data('src'));
updateMaxHeightModalbody($(this));
});
$('#file-upload-modal-' + fieldname).on('hide.bs.modal', function() {
$('#file-upload-modal-' + fieldname).off('hide.bs.modal.lsuploadquestion');
$('#file-upload-modal-' + fieldname).on('hide.bs.modal.lsuploadquestion', function() {
var pass;
var uploaderId = 'uploader' + fieldname;
window.uploadModalObjects[fieldname].saveAndExit(fieldname,show_title,show_comment,pos);
window.currentUplaodHandler.saveAndExit(fieldname,show_title, show_comment,pos);
// if(document.getElementById(uploaderId).contentDocument) {
// if(document.getElementById(uploaderId).contentDocument.defaultView)
// { /*Firefox*/
@@ -40,7 +43,9 @@ function openUploadModalDialog(){
// }else{ /*IE6*/
// pass=document.getElementById(uploaderId).contentWindow.saveAndExit(fieldname,show_title,show_comment,pos);
// }
$('#uploader'+fieldname).html('');
return pass;

});
});
}
@@ -96,7 +101,7 @@ function isValueInArray(arr, val) {
return inArray;
}

var displayUploadedFiles = function ( filecount, fieldname, show_title, show_comment) {
var displayUploadedFiles = function (filecount, fieldname, show_title, show_comment) {
var jsonstring = $("#"+fieldname).val();
var i;
var display = '';
@@ -113,32 +118,33 @@ var displayUploadedFiles = function ( filecount, fieldname, show_title, show_com
jsonobj = JSON.parse(jsonstring);
} catch(e) {};

var table = $('<table width="100%" class="question uploadedfiles"></table>');
$('<thead></thead>').appendTo(table)
.append($('<tr></tr>').append('<th width="20%">&nbsp;</th>'));

display = '<table width="100%" class="question uploadedfiles">';
display += '<thead>';
display += '<tr>';
display += '<th width="20%">&nbsp;</th>';


if (show_title != 0)
display += '<th>'+uploadLang.headTitle+'</th>';
display += '<th>'+uploadLang.titleFld+'</th>';
if (show_comment != 0)
display += '<th>'+uploadLang.headComment+'</th>';
display += '<th>'+uploadLang.headFileName+'</th><th class="edit"></th></tr></thead><tbody>';
display += '<th>'+uploadLang.commentFld+'</th>';
display += '<th>'+uploadLang.filenameFld+'</th><th class="edit"></th></tr></thead><tbody>';
var image_extensions = new Array('gif', 'jpeg', 'jpg', 'png', 'swf', 'psd', 'bmp', 'tiff', 'jp2', 'iff', 'bmp', 'xbm', 'ico');

jsonobj.forEach(function(item,iterator) {
if (isValueInArray(image_extensions, item.ext))
display += '<tr><td class="upload image"><img src="' + uploadurl + '/filegetcontents/'+decodeURIComponent(item.filename)+'" class="uploaded" /></td>';
display += '<tr><td class="upload image"><img src="' + uploadurl + '/filegetcontents/'+decodeURIComponent(item.filename)+'" class="uploaded" /></td>';
else
display += '<tr><td class="upload placeholder"><div class="upload-placeholder" /></td>';

display += '<tr><td class="upload placeholder"><div class="upload-placeholder" /></td>';
if (show_title != 0)
display += '<td class="upload title">'+htmlspecialchars(item.title)+'</td>';
display += '<td class="upload title">'+item.title+'</td>';
if (show_comment != 0)
display += '<td class="upload comment">'+htmlspecialchars(item.comment)+'</td>';
display +='<td class="upload edit">'+htmlspecialchars(decodeURIComponent(item.name))+'</td><td>'+'<a class="btn btn-primary" onclick="javascript:upload_'+fieldname+'();$(\'#upload_'+fieldname+'\').click();"><span class="fa fa-pencil"></span>&nbsp;'+uploadLang.editFile+'</a></td></tr>';
display += '<td class="upload comment">'+item.comment+'</td>';
display +='<td class="upload edit">'+decodeURIComponent(item.name)+'</td><td>'+'<a class="btn btn-primary" onclick="javascript:$(\'#upload_'+fieldname+'\').click();"><span class="fa fa-pencil"></span>&nbsp;'+uploadLang.editFile+'</a></td></tr>';
});
display += '</tbody></table>';

$('#'+fieldname+'_uploadedfiles').html(display);
}
};
@@ -1,24 +1,25 @@
import './ajaxupload.js';
import './modaldialog.js';

"use strict"
var uploadHandler = function (qid, options) {

var init = function () {
$(document).on('ready pjax:scriptcomplete', function () {
doFileUpload();
// fixParentHeigth();
});
doFileUpload();
};

var fixParentHeigth = function () {
return;
}
var renderPreviewItem = function (fieldname, item, iterator) {

var i = iterator + 1;
var i = iterator;
var image_extensions = new Array('gif', 'jpeg', 'jpg', 'png', 'swf', 'psd', 'bmp', 'tiff', 'jp2', 'iff', 'bmp', 'xbm', 'ico');

var previewblock = $('<li id="' + fieldname + '_li_' + i + '" class="previewblock file-element"></li>');
var previewContainer = $('<div class="file-preview"></div>');

if (RegExp(image_extensions).test(item.ext.toLowerCase())) {
if (isValueInArray(image_extensions, item.ext.toLowerCase())){
previewContainer.append('<img src="' + options.uploadurl + '/filegetcontents/' + item.filename + '" class="uploaded" />');
} else {
previewContainer.append('<div class="upload-placeholder"></div>');
@@ -73,20 +74,22 @@ var uploadHandler = function (qid, options) {
.wrap('<div class="file-info"></div>')
.appendTo(previewContainer);

previewblock.append(previewContainer);

$('<input type="hidden" />').attr('id', fieldname + '_size_' + i).attr('value', item.size).appendTo(previewblock);
$('<input type="hidden" />').attr('id', fieldname + '_name_' + i).attr('value', item.name).appendTo(previewblock);
$('<input type="hidden" />').attr('id', fieldname + '_file_index_' + i).attr('value', i).appendTo(previewblock);
$('<input type="hidden" />').attr('id', fieldname + '_filename_' + i).attr('value', item.filename).appendTo(previewblock);
$('<input type="hidden" />').attr('id', fieldname + '_ext_' + i).attr('value', item.ext).appendTo(previewblock);

// add file to the list
$('#field' + fieldname + '_listfiles').append(previewblock);

$('<input type="hidden" />').attr('id', fieldname + '_size_' + i).attr('value', item.size).appendTo(previewblock);
$('<input type="hidden" />').attr('id', fieldname + '_name_' + i).attr('value', item.name).appendTo(previewblock);
$('<input type="hidden" />').attr('id', fieldname + '_file_index_' + i).attr('value', i).appendTo(previewblock);
$('<input type="hidden" />').attr('id', fieldname + '_filename_' + i).attr('value', item.filename).appendTo(previewblock);
$('<input type="hidden" />').attr('id', fieldname + '_ext_' + i).attr('value', item.ext).appendTo(previewblock);

// add file to the list only if it doesn't exists already
if ($("#" + fieldname + "_li_" + i).length === 0){
previewblock.append(previewContainer);
$('#field' + fieldname + '_listfiles').append(previewblock);
}
}

var doFileUpload = function () {
var fieldname = options.fieldname;
var fieldname = options.sFieldName;
/* Load the previously uploaded files */
var filecount = $('#' + fieldname + '_filecount').val();

@@ -109,13 +112,12 @@ var uploadHandler = function (qid, options) {
$('#' + fieldname + '_licount').val(filecount);

json.forEach(function (item, iterator) {
renderPreviewItem(fieldname, item, iterator);
renderPreviewItem(fieldname, item, iterator+1);
});
}

// The upload button
var button = $('#button1');

var button = $('#button_' + qid);
new AjaxUpload(button, {
action: options.uploadurl + '/sid/' + surveyid + '/preview/' + options.questgrppreview + '/fieldname/' + fieldname + '/',
name: 'uploadfile',
@@ -132,7 +134,6 @@ var uploadHandler = function (qid, options) {
var maxfiles = parseInt($('#' + fieldname + '_maxfiles').val());
var filecount = parseInt($('#' + fieldname + '_filecount').val());
var allowed_filetypes = $('#' + fieldname + '_allowed_filetypes').val().split(",");

/* If maximum number of allowed filetypes have already been uploaded,
* do not upload the file and display an error message ! */
if (filecount >= maxfiles) {
@@ -172,7 +173,13 @@ var uploadHandler = function (qid, options) {

// Once the file has been uploaded via AJAX,
// the preview is appended to the list of files
var metadata = eval('(' + response + ')');
try{
var metadata = JSON.parse(response);
} catch(e) {
/* Suppose we get an HTML error ? Replace whole HTML (without head) */
$('body').html(response);
return;
}

var count = parseInt($('#' + fieldname + '_licount').val());
count++;
@@ -280,6 +287,11 @@ var uploadHandler = function (qid, options) {
copyJSON(filecount, fieldname, show_title, show_comment, pos);
}

function copyJSON(filecount, fieldname, show_title, show_comment, pos) {
$('#'+fieldname+'_filecount').val(filecount);
displayUploadedFiles(filecount, fieldname, show_title, show_comment, pos);
}

var saveAndExit = function (fieldname, show_title, show_comment, pos) {
var filecount = parseInt($('#' + fieldname + '_filecount').val());
var minfiles = parseInt($('#' + fieldname + '_minfiles').val());
@@ -314,7 +326,7 @@ var uploadHandler = function (qid, options) {
'fieldname': fieldname,
'filename': filename,
'name': name,
YII_CSRF_TOKEN: csrfToken
YII_CSRF_TOKEN: options.csrfToken
}
})
.done(function (msg) {
@@ -344,6 +356,11 @@ var uploadHandler = function (qid, options) {
}
});
}

return {
init: init,
saveAndExit: saveAndExit,
};
}


@@ -357,5 +374,9 @@ function escapeHtml(unsafe) {
}

window.getUploadHandler = function(qid, options){
return new uploadHandler(qid, options);
if (!window.currentUplaodHandler){
window.currentUplaodHandler = new uploadHandler(qid, options);
}
window.currentUplaodHandler.init();
return window.currentUplaodHandler;
}
@@ -82,4 +82,13 @@ img.uploaded {
height: auto;
max-height: 100px;
max-width: 96%;
padding: 5px;
}

.uploadedfiles tbody tr td {
text-align: left;
}

.uploadedfiles thead tr th {
font-weight: bold;
}

0 comments on commit c6a240e

Please sign in to comment.
You can’t perform that action at this time.