File: views/d3files/files.php

Recommend this page to a friend!
  Classes of Uldis Nelsons  >  d3files  >  views/d3files/files.php  >  Download  
File: views/d3files/files.php
Role: Example script
Content type: text/plain
Description: Example script
Class: d3files
Output widgets to handle uploaded files using YII2
Author: By
Last change:
Date: 1 year ago
Size: 8,002 bytes
 

Contents

Class file image Download
<?php
use yii\helpers\Html;
use
yii\web\View;
use
yii\helpers\Url;

/**
 * @var bool $viewByFancyBox
 * @var array $viewByFancyBoxExtensions
 * @var array $fileList
 */


$uploadUrl = Url::to([$url_prefix . 'd3filesupload', 'id' => $model_id]);

$t_aria_label = Yii::t('d3files', 'Close');
$t_confirm = Yii::t('d3files', 'Are you sure you want to delete this item?');
$t_no_results = Yii::t('d3files', 'No results found.');

$script = <<< JS

$(function(){
   
    function showError(data, el)
    {
        $('.d3files-alert').remove();
       
        var html = '<div class="d3files-alert alert alert-danger alert-dismissible" role="alert" style="margin: 0; margin-bottom: 1px;">';
        html += '<button type="button" class="close" data-dismiss="alert" aria-label="
$t_aria_label"><span aria-hidden="true">&times;</span></button>';
        html += '<span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span> ';
        html += '<strong>' + data.status + '</strong> ';
        html += '<span class="sr-only">' + data.name + '</span> ';
        html += data.message;
        html += '</div>';
       
        el.prepend(html);
    }
   
    $(document).on('click', '.d3files-delete', function(e) {
       
        $('.d3files-alert').remove();
       
        if (!confirm('
$t_confirm')) {
            return false;
        }
       
        var url = $(this).attr('href');
        var tbl = $(this).closest('table');
        var row = $(this).closest('tr');
        var el = $(this).closest('.d3files-widget');
       
        $.ajax({
            url: url,
            type: 'POST',
            data: {},
            success: function(data) {
                row.remove();
                if (!tbl.find('tr').length) {
                    addEmptyRow();
                }
            },
            error: function(xhr) {
                showError(xhr.responseJSON, el);
            }
        });
       
        function addEmptyRow() {
            var html = '<tr><td colspan="2"><div class="empty">
$t_no_results</div></td></tr>';
            tbl.append(html);
        }
       
        return false;
    });
       
    $('.d3file-input').on('change', function() {
        uploadFile(this.files[0], $(this).closest('.d3files-widget'));
        return false;
    });
   
    function uploadFile(file, el) {
        $('.d3files-alert').remove();
       
        var tbl = el.find('table.d3files-table');
       
        var url = el.find('.d3file-input').attr('data-url');
        var xhr = new XMLHttpRequest();
        var fd = new FormData();
        xhr.open('POST', url, true);
        xhr.onreadystatechange = function() {
            if (xhr.readyState == 4) {
                var response = $.parseJSON(xhr.responseText);
       
                if (xhr.status == 200) {
                    tbl.find('div.empty').closest('tr').remove();
                    tbl.append(response);
                } else {
                    showError(response, el);
                }
            }
        };
        fd.append('model_name', el.find('.d3file-input').attr('name'));
        fd.append('_csrf', yii.getCsrfToken());
        fd.append('upload_file', file);
        xhr.send(fd);
    }
   
    // Check for the File API support.
    if (!window.File) {
        $('.d3files-drop-zone').hide();
    } else {
        function handleFileSelect(e) {
            e.stopPropagation();
            e.preventDefault();
            handleDragLeave(e);
            var file = e.dataTransfer.files[0];
            uploadFile(file, $(e.target).closest('.d3files-widget'));
        }

        function handleDragOver(e) {
            e.stopPropagation();
            e.preventDefault();
            e.dataTransfer.dropEffect = 'copy'; // Explicitly show this is a copy.
            $(e.target).css('border-color', '#555');
            $(e.target).css('color', '#555');
        }
       
        function handleDragLeave(e) {
            $(e.target).css('border-color', '#bbb');
            $(e.target).css('color', '#bbb');
        }

        // Setup the dnd listeners.
        $('.d3files-drop-zone').each(function() {
            var dropZone = $(this)[0];
       
            dropZone.addEventListener('dragover', handleDragOver, false);
            dropZone.addEventListener('dragleave', handleDragLeave, false);
            dropZone.addEventListener('drop', handleFileSelect, false);
        });
       
    }
});
JS;

$this->registerJs($script, View::POS_END, 'd3files');

if(
$viewByFancyBox) {
    echo
newerton\fancybox3\FancyBox::widget([
       
'target' => '[data-fancybox]',
       
'config' => [
           
'type' => 'iframe',
           
'iframe' => [
               
'preload' => false
           
]
        ],
    ]);
}

?>
<div class="d3files-widget">
<table class="table table-striped table-bordered" style="margin-bottom: 0; border-bottom: 0;">
    <?php
   
if (!$hideTitle) {
       
?>
<tr style="border-bottom: 0;">
            <th style="border-bottom: 0;">
                <span class="<?php echo $icon; ?>"></span>
                <?php echo $title; ?>
<label style="margin: 0; margin-left: 5px;" title="<?php echo Yii::t('d3files', 'Add'); ?>">
                    <input type="file" class="d3file-input" style="display: none;" data-url="<?php echo $uploadUrl; ?>" name="<?php echo $model_name; ?>" />
                    <span class="glyphicon glyphicon-plus text-primary" style="cursor: pointer;"></span>
                </label>
            </th>
        </tr>
    <?php
   
}
   
?>
<tr style="border-bottom: 0;">
        <td style="padding: 0; border-bottom: 0;">
            <div class="d3files-drop-zone" title="<?php echo Yii::t('d3files', 'Drag&Drop a file here, upload will start automatically'); ?>" style="border: 2px dashed #bbb; color: #bbb; text-align: center; padding: 8px;">
                <span class="glyphicon glyphicon-cloud-upload"></span>
                <?php echo Yii::t('d3files', 'Drag&Drop file here'); ?>
</div>
        </td>
    </tr>
</table>
<table class="d3files-table table table-striped table-bordered">
<?php

foreach ($fileList as $row) {
   
$ext = strtolower(pathinfo($row['file_name'], PATHINFO_EXTENSION));
   
?>
<tr>
        <td class="col-xs-11">
            <?=Html::a(
               
$row['file_name'],
                [
$url_prefix . 'd3filesdownload', 'id' => $row['file_model_id']],
                [
'title' => Yii::t('d3files', 'Download')]
            )
?>
</td>
        <?php
       
if($viewByFancyBox) {
           
?>
<td class="col-xs-1">
                <?php
               
if(in_array($ext,$viewByFancyBoxExtensions, true)){
                   
$fbUrl = [
                       
$url_prefix . 'd3filesopen',
                       
'id' => $row['file_model_id']
                    ];
                   
$fbOptions= [
                       
'data-fancybox' => true,
                       
'data-type' => 'iframe',
                       
'fancybox' => 'fancybox',
                       
'data-src' => \yii\helpers\Url::to($fbUrl)
                    ];

                    echo
Html::a('<i class="fa fa-external-link"></i>',
                       
'javascript:;', $fbOptions);
                }
               
?>
</td>
            <?php
       
}
       
?>
<td class="text-center col-xs-1">
            <?=Html::a(
               
'<span class="glyphicon glyphicon-trash"></span>',
                [
$url_prefix . 'd3filesdelete', 'id' => $row['file_model_id']],
                [
'class' => 'd3files-delete', 'title' => Yii::t('d3files', 'Delete')]
            );
?>
</td>
    </tr>
    <?php
}
?>
</table>

</div>


For more information send a message to info at phpclasses dot org.