mirror_php/humhub
1
0
Fork 0
mirror of https://github.com/humhub/humhub.git synced 2025-01-29 12:28:06 +01:00
Code Issues Projects Releases Wiki Activity

Fixing progress bar for file uploads and prevent postform submissions until uploads are finished (#15)

Browse Source
This commit is contained in:
Andy Strobel 2014-04-07 15:56:05 +02:00
parent e89298b02b
commit 69d8da1726
5 changed files with 89 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
css/style.css
View File

@ -389,6 +389,13 @@ ul.tag_input li img {
left: 50px;
font-size: 18px;
}
.contentForm_options {
min-height: 29px;
}
.contentForm-upload-progress {
margin-top: 18px;
margin-bottom: 10px !important;
}
.mime {
background-repeat: no-repeat;
background-position: 0 0;

12
css/style.less
View File

@ -528,6 +528,18 @@ ul.tag_input {
font-size: 18px;
}
.contentForm_options {
min-height: 29px;
}
.contentForm-upload-progress {
margin-top: 18px;
margin-bottom: 10px !important;
}
.btn_container {
//margin-bottom: 0px;
}
// Mime-Types
.mime {

29
protected/modules_core/file/widgets/views/fileUploadButton.php
View File

@ -36,7 +36,8 @@
cursor: pointer;
}
</style>
<span class="btn btn-info fileinput-button tt" data-toggle="tooltip" data-placement="top" title="" data-original-title="<?php echo Yii::t('FileModule.base', 'Upload files'); ?>">
<span class="btn btn-info fileinput-button tt" data-toggle="tooltip" data-placement="top" title=""
data-original-title="<?php echo Yii::t('FileModule.base', 'Upload files'); ?>">
<i class="icon-cloud-upload"></i>
<input id="<?php echo $uploaderId; ?>" type="file" name="files[]"
data-url="<?php echo Yii::app()->createUrl('//file/file/upload'); ?>" multiple>
@ -76,12 +77,38 @@
},
progressall: function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);
// Fix: remove focus from upload button to hide tooltip
$('#post_submit_button').focus();
// hide form buttons
$('.btn_container').hide();
// show progress bar
$('#<?php echo $uploaderId; ?>_progress').show();
if (progress == 100) {
// set upload status to 100
$('#<?php echo $uploaderId; ?>_progress').children().css('width', 100 + "%");
// hide progress bar
$('#<?php echo $uploaderId; ?>_progress').hide();
// show form buttons
$('.btn_container').show();
// show attached files
$('#<?php echo $uploaderId; ?>_list').fadeIn('slow');
} else {
// show progress bar
$('#<?php echo $uploaderId; ?>_progress').show();
// update upload status
$('#<?php echo $uploaderId; ?>_progress').children().css('width', progress + "%");
}

12
protected/modules_core/file/widgets/views/fileUploadList.php
View File

@ -12,11 +12,15 @@
*/
?>
<div id="<?php echo $uploaderId; ?>_details" style="display:none">
<br>
<div class="progress progress-info active" id="<?php echo $uploaderId; ?>_progress" >
<div class="bar" style="width: 0%;"></div>
<div class="progress contentForm-upload-progress" id="<?php echo $uploaderId; ?>_progress" style="">
<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="0" aria-valuemin="0"
aria-valuemax="100" style="width: 0%">
</div>
</div>
<?php //echo Yii::t('FileModule.base', 'List of already uploaded files:'); ?>
<ul style="list-style: none; margin: 0;" id="<?php echo $uploaderId; ?>_list">
<ul style="list-style: none; display:none; margin: 0; padding-top: 10px;" id="<?php echo $uploaderId; ?>_list">
</ul>
</div>

62
protected/modules_core/wall/widgets/views/contentForm.php
View File

@ -17,17 +17,19 @@
<hr>
<?php
$url = CHtml::normalizeUrl(Yii::app()->createUrl($submitUrl));
echo HHtml::ajaxSubmitButton($submitButtonText, $url, array(
'type' => 'POST',
'dataType' => 'json',
'beforeSend' => "function() {
<div class="btn_container">
<?php
$url = CHtml::normalizeUrl(Yii::app()->createUrl($submitUrl));
echo HHtml::ajaxSubmitButton($submitButtonText, $url, array(
'type' => 'POST',
'dataType' => 'json',
'beforeSend' => "function() {
$('.contentForm').removeClass('error');
$('#contentFormError').hide();
$('#contentFormError').empty();
}",
'success' => "function(response) {
'success' => "function(response) {
if (response.success) {
// application.modules_core.wall function
@ -64,26 +66,28 @@
}
}",
), array('id' => "post_submit_button", 'class' => 'btn btn-info')
);
?>
<?php
// Creates Uploading Button
$this->widget('application.modules_core.file.widgets.FileUploadButtonWidget', array(
'uploaderId' => 'contentFormFiles', // Unique ID of Uploader Instance
'bindToFormFieldId' => 'contentFrom_files', // Hidden field to store uploaded files
));
?>
);
?>
<?php
// Creates Uploading Button
$this->widget('application.modules_core.file.widgets.FileUploadButtonWidget', array(
'uploaderId' => 'contentFormFiles', // Unique ID of Uploader Instance
'bindToFormFieldId' => 'contentFrom_files', // Hidden field to store uploaded files
));
?>
<!-- content sharing -->
<div class="pull-right">
<?php if (get_class($this->contentContainer) == 'Space' && $this->contentContainer->canShare()): /* can create public content */ ?>
<div class="checkbox">
<label>
<?php echo CHtml::checkbox("visibility", "", array('id'=>'contentForm_visibility', 'class' => 'contentForm')); ?> <?php echo Yii::t('WallModule.base', 'Is public'); ?>
</label>
</div>
<!-- content sharing -->
<div class="pull-right">
<?php if (get_class($this->contentContainer) == 'Space' && $this->contentContainer->canShare()): /* can create public content */ ?>
<div class="checkbox">
<label>
<?php echo CHtml::checkbox("visibility", "", array('id' => 'contentForm_visibility', 'class' => 'contentForm')); ?> <?php echo Yii::t('WallModule.base', 'Is public'); ?>
</label>
</div>
<?php endif; ?>
</div>
<?php endif; ?>
</div>
<?php echo CHtml::endForm(); ?>
@ -96,8 +100,10 @@
));
?>
</div> <!-- /contentForm_Options -->
</div> <!-- /panel body -->
</div>
<!-- /contentForm_Options -->
</div>
<!-- /panel body -->
</div> <!-- /panel -->
<div class="clearFloats"></div>
@ -110,7 +116,7 @@
// Remove info text from the textinput
jQuery('#contentFormBody').click(function() {
jQuery('#contentFormBody').click(function () {
// Hide options by default
jQuery('.contentForm_options').fadeIn();