winix/winixd/html/fun_upload.html

[if winix_function_param_is "ckeditor_upload"]
	<script type="text/javascript">window.parent.CKEDITOR.tools.callFunction([upload_ckeditor_funnum], '[item_link]');</script>
[end]


[if any_not [winix_function_param_is "ckeditor_upload"] [winix_function_param_is "jquery_upload"]]
	<div class="winix">

	<h1>{upload_header}</h1>
	
[# the code below are copied from common/fileupload/jquery-ui.html]
[# The file upload form used as target for the file upload widget]
<form id="fileupload" action="[doc_base_url][dir]/upload" method="POST" enctype="multipart/form-data">

    [# The fileupload-buttonbar contains buttons to add/delete files and start/cancel the upload]
    <div class="fileupload-buttonbar">
        <div class="fileupload-buttons">
            [# The fileinput-button span is used to style the file input field as button]
            <span class="fileinput-button">
                <span>{upload_button_add_files}</span>
                <input type="file" name="files\[\]" multiple>
            </span>
            <button type="submit" class="start">{upload_button_start_upload}</button>
            <button type="reset" class="cancel">{upload_button_cancel_upload}</button>
            <button type="button" class="delete">{upload_button_delete}</button>
            <input type="checkbox" class="toggle">
            [# The global file processing state]
            <span class="fileupload-process"></span>
        </div>
        [# The global progress state]
        <div class="fileupload-progress fade" style="display:none">
            [# The global progress bar]
            <div class="progress" role="progressbar" aria-valuemin="0" aria-valuemax="100"></div>
            [# The extended global progress state]
            <div class="progress-extended">&nbsp;</div>
        </div>
    </div>
    [# The table listing the files available for upload/download]
    <table role="presentation"><tbody class="files"></tbody></table>
</form>


[# The blueimp Gallery widget]
<div id="blueimp-gallery" class="blueimp-gallery blueimp-gallery-controls" data-filter=":even">
    <div class="slides"></div>
    <h3 class="title"></h3>
    <a class="prev">‹</a>
    <a class="next">›</a>
    <a class="close">×</a>
    <a class="play-pause"></a>
    <ol class="indicator"></ol>
</div>

[# The template to display files available for upload]
<script id="template-upload" type="text/x-tmpl">
            \{% for (var i=0, file; file=o.files\[i\]; i++) \{ %\}
                <tr class="template-upload fade">
                    <td>
                        <span class="preview"></span>
                    </td>
                    <td>
                        <p class="name">\{%=file.name%\}</p>
                        <strong class="error"></strong>
                    </td>
                    <td>
                        <p class="size">{upload_button_processing}</p>
                        <div class="progress"></div>
                    </td>
                    <td>
                        \{% if (!i && !o.options.autoUpload) \{ %\}
                            <button class="start" disabled>{upload_button_start}</button>
                        \{% \} %\}
                        \{% if (!i) \{ %\}
                            <button class="cancel">{upload_button_cancel}</button>
                        \{% \} %\}
                    </td>
                </tr>
            \{% \} %\}</script>

[# The template to display files available for download]
<script id="template-download" type="text/x-tmpl">
            \{% for (var i=0, file; file=o.files\[i\]; i++) \{ %\}
                <tr class="template-download fade">
                    <td>
                        <span class="preview">
                            \{% if (file.thumbnailUrl) \{ %\}
                                <a href="\{%=file.url%\}" title="\{%=file.name%\}" download="\{%=file.name%\}" data-gallery><img src="\{%=file.thumbnailUrl%\}"></a>
                            \{% \} %\}
                        </span>
                    </td>
                    <td>
                        <p class="name">
                            <a href="\{%=file.url%\}" title="\{%=file.name%\}" download="\{%=file.name%\}" \{%=file.thumbnailUrl?'data-gallery':''%\}>\{%=file.name%\}</a>
                        </p>
                        \{% if (file.error) \{ %\}
                            <div><span class="error">{upload_error}</span> \{%=file.error%\}</div>
                        \{% \} %\}
                    </td>
                    <td>
                        <span class="size">\{%=o.formatFileSize(file.size)%\}</span>
                    </td>
                    <td>
                        <button class="delete" data-type="\{%=file.deleteType%\}" data-url="\{%=file.deleteUrl%\}"\{% if (file.deleteWithCredentials) \{ %\} data-xhr-fields='\{"withCredentials":true\}'\{% \} %\}>{upload_button_delete}</button>
                        <input type="checkbox" name="delete" value="1" class="toggle">
                    </td>
                </tr>
            \{% \} %\}</script>


<script type="text/javascript">
            $('#fileupload button.start').css('display', 'none');

            $('#fileupload').fileupload(\{
            "url": "[doc_base_url][dir]upload/jquery_upload",
            "autoUpload": true
            \});

            $('#fileupload').fileupload(
            'option',
            'redirect',
            window.location.href.replace(
			    /\/\[^\/\]*$/,
			    '/cors/result.html?%s'
            ));

			$("div.winix #fileupload button.cancel").css('display','inline');

            [# loading existing files]
            [# copied from common/fileupload/js/main.js]
            $('#fileupload').addClass('fileupload-processing');
            $.ajax(\{
                [# // Uncomment the following to send cross-domain cookies:]
                [# //xhrFields: \{withCredentials: true\},]
                url: $('#fileupload').fileupload('option', 'url'),
                dataType: 'json',
                context: $('#fileupload')\[0\]
            \}).always(function () \{
                $(this).removeClass('fileupload-processing');
            \}).done(function (result) \{
                $(this).fileupload('option', 'done')
                .call(this, $.Event('done'), \{result: result\});
            \});</script>


</div>

[end]