306 lines
12 KiB
Plaintext
306 lines
12 KiB
Plaintext
% my %d = (
|
|
% delay_0 => l('no time limit'),
|
|
% delay_1 => l('24 hours'),
|
|
% delay_365 => l('1 year')
|
|
% );
|
|
|
|
<section class="messages-zone">
|
|
<noscript class="message-card error">
|
|
<%= l('Javascript is disabled. You won\'t be able to use Lufi.') %>
|
|
</noscript>
|
|
% if (defined(config('broadcast_message'))) {
|
|
<div class="message-card error">
|
|
<%= config('broadcast_message') %>
|
|
</div>
|
|
% }
|
|
% if (stash('invitation')) {
|
|
<div class="message-card success">
|
|
<%= l('The link(s) of your file(s) will automatically be sent by mail to %1 (%2)', stash('invitation')->ldap_user, stash('invitation')->ldap_user_mail) %>
|
|
</div>
|
|
% }
|
|
% if (stop_upload) {
|
|
<div class="message-card error">
|
|
<%= l('Sorry, the uploading is currently disabled. Please try again later.') %>
|
|
</div>
|
|
% }
|
|
</section>
|
|
|
|
% if (!stop_upload) {
|
|
<section class="upload-zone">
|
|
<form class="upload-form">
|
|
<div class="input-delete-after-days">
|
|
<button type="button" class="icon-button info-delete-after-days modal-button" title="<%= l('Important: more information on delays') %>"></button>
|
|
|
|
<select class="select-delete-after-days" id="delete-after-days" aria-label="Delay">
|
|
% for my $delay (qw/0 1 7 30 365/) {
|
|
% my $text = ($delay == 7 || $delay == 30) ? l('%1 days', $delay) : $d{'delay_'.$delay};
|
|
% if (max_delay) {
|
|
% if ($delay) {
|
|
% if ($delay < max_delay) {
|
|
<option value="<%= $delay %>" <%== is_selected($delay) %>><%= $text %></option>
|
|
% } elsif ($delay == max_delay) {
|
|
<option value="<%= $delay %>" <%== is_selected($delay) %>><%= $text %></option>
|
|
|
|
% last;
|
|
% } else {
|
|
% my $text = ($delay == 1) ? l('24 hours') : l('%1 days', $delay);
|
|
<option value="<%= max_delay %>" <%== is_selected(max_delay) %>><%= l('%1 days', max_delay) %></option>
|
|
% last;
|
|
% }
|
|
% }
|
|
% } else {
|
|
<option value="<%= $delay %>" <%== is_selected($delay) %>><%= $text %></option>
|
|
% }
|
|
% }
|
|
</select>
|
|
</div>
|
|
|
|
<div class="checkbox input-delete-on-first-view">
|
|
<input type="checkbox" id="delete-on-first-view" name="delete-on-first-view" autocomplete="off" <%= 'checked="true"' if config('force_burn_after_reading') %> <%= 'disabled="disabled"' if config('force_burn_after_reading') %>>
|
|
<label for="delete-on-first-view"><%= l('Delete at first download?') %></label>
|
|
</div>
|
|
|
|
% if (config('allow_pwd_on_files') && (!stash('invitation'))) {
|
|
<div class="input-text input-password">
|
|
<label for="password"><%= l('Add a password to file(s)') %></label>
|
|
<input type="password" id="password" placeholder="<%= l('Password') %>" autocomplete="off">
|
|
</div>
|
|
% }
|
|
|
|
<div class="checkbox input-zip-files">
|
|
<input
|
|
type="checkbox"
|
|
id="must-zip"
|
|
>
|
|
<label for="must-zip"><%= l('Create a zip archive with the files before uploading?') %></label>
|
|
</div>
|
|
|
|
<div class="hidden input-text input-zip-name">
|
|
<label for="zip-name"><%= l('Name of the zip file') %></label>
|
|
<input type="text" id="zip-name" name="zip-name" placeholder="documents.zip" value="documents.zip" autocomplete="off">
|
|
</div>
|
|
|
|
<div class="drop-zone">
|
|
<h1><%= l('Drop files here') %></h1>
|
|
<p class="max-file-size"></p>
|
|
<p><%= l('or') %></p>
|
|
<label class="button" for="upload-button">
|
|
<%= l('Click to open the file browser') %>
|
|
</label>
|
|
<input type="file" id="upload-button" multiple autofocus>
|
|
</div>
|
|
|
|
|
|
<div class="hidden zip-zone card" aria-hidden="true">
|
|
<button type="button" class="icon-button icon close action-close" title="<%= l('Close') %>"></button>
|
|
|
|
<div class="file-description">
|
|
<p class="file-name">documents.zip</p>
|
|
<p class="file-size">0</p>
|
|
</div>
|
|
|
|
<ul class="files-list"></ul>
|
|
|
|
<button type="button" class="button action-upload-zip"><%= l("Upload generated zip file") %></button>
|
|
<div class="zip-compressing hidden" aria-hidden="true">
|
|
<div class="icon-container pulse">
|
|
<span class="icon archive"></span>
|
|
</div>
|
|
<p><%= l('Compressing zip file…') %></p>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</section>
|
|
|
|
<section class="hidden uploaded-zone" aria-hidden="true">
|
|
<h1><%= l('Uploaded files') %></h1>
|
|
<header class="hidden buttons" aria-hidden="true">
|
|
<div class="actions-buttons upload-success">
|
|
<button type="button" class="button action-copy-links"><%= l('Copy all links to clipboard') %></button>
|
|
<a class="button action-mail-links" href="<%= url_for('/')->to_abs() %>m"><%= l('Send all links by email') %></a>
|
|
</div>
|
|
</header>
|
|
|
|
<div class="file-cards"></div>
|
|
</section>
|
|
|
|
<template id="file-card-error">
|
|
<article class="card file-card error">
|
|
<button type="button" class="icon-button icon close action-close"></button>
|
|
<div class="file-description">
|
|
<p class="file-name"></p>
|
|
<p class="file-size"></p>
|
|
</div>
|
|
|
|
<div class="message-card error upload-error"></div>
|
|
</article>
|
|
</template>
|
|
|
|
<template id="file-card-guest">
|
|
<article class="card file-card guest">
|
|
<button type="button" class="icon-button icon close action-close"></button>
|
|
<div class="file-description">
|
|
<p class="file-name"></p>
|
|
<p class="file-size"></p>
|
|
</div>
|
|
|
|
<p class="file-expiration"></p>
|
|
</article>
|
|
</template>
|
|
|
|
<template id="file-card-ongoing">
|
|
<article class="card file-card ongoing">
|
|
<button type="button" class="icon-button icon close action-close"></button>
|
|
<div class="file-description">
|
|
<p class="file-name"></p>
|
|
<p class="file-size"></p>
|
|
</div>
|
|
|
|
<p class="progress-percent">0</p>
|
|
|
|
<div class="progress-container">
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
</article>
|
|
</template>
|
|
|
|
<template id="file-card-success">
|
|
<article class="card file-card success">
|
|
<button type="button" class="icon-button icon close action-close"></button>
|
|
<div class="file-description">
|
|
<p class="file-name"></p>
|
|
<p class="file-size"></p>
|
|
<a class="icon-button icon mail action-mail" href="#"></a>
|
|
</div>
|
|
|
|
<p class="file-expiration"></p>
|
|
|
|
<div class="links-zone">
|
|
<div class="download-link">
|
|
<a class="icon-button icon download download-button" title="<%= l('Download link') %>" href="#"></a>
|
|
<button type="button" title="<%= l('Copy to clipboard') %>" class="icon-button icon copy copy-button"></button>
|
|
<div class="input-text">
|
|
<label>
|
|
<%= l('Download link') %>
|
|
<input class="download-input" type="text">
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="delete-link">
|
|
<a class="icon-button icon delete delete-button" title="<%= l('Deletion link') %>" href="#"></a>
|
|
<div class="input-text">
|
|
<label>
|
|
<%= l('Deletion link') %>
|
|
<input class="delete-input" type="text">
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
</template>
|
|
|
|
<dialog class="modal modal-delete-after-days">
|
|
% use Number::Bytes::Human qw(format_bytes);
|
|
<section>
|
|
<header>
|
|
<h1><%= l('Information about delays') %></h1>
|
|
</header>
|
|
|
|
<div class="content">
|
|
<p>
|
|
<%= l('If you choose a delay, the file will be deleted after that delay.') %><br>
|
|
<%= l('Don\'t worry: if a user begins to download the file before the expiration and the download ends after the expiration, he will be able to get the file.') %>
|
|
</p>
|
|
% if (defined(config('delay_for_size'))) {
|
|
<p>
|
|
<%= l('This server sets limitations according to the file size. The expiration delay of your file will be the minimum between what you choose and the following limitations:') %>
|
|
</p>
|
|
<ul>
|
|
% my $delays = config('delay_for_size');
|
|
% $delays->{0} = max_delay;
|
|
% my @keys = sort {$a <=> $b} keys %{$delays};
|
|
% my $i = 0;
|
|
% for my $key (@keys) {
|
|
% my $delay = $delays->{$keys[$i]};
|
|
% if ($i + 1 < scalar(@keys)) {
|
|
% if ($delay) {
|
|
<li><%= l('between %1 and %2, the file will be kept %3 day(s).', format_bytes($keys[$i]), format_bytes($keys[$i + 1]), $delay) %></li>
|
|
% } else {
|
|
<li><%= l('between %1 and %2, the file will be kept forever.', format_bytes($keys[$i]), format_bytes($keys[$i + 1]), $delay) %></li>
|
|
% }
|
|
% } else {
|
|
% if ($delay) {
|
|
<li><%= l('for %1 and more, the file will be kept %2 day(s)', format_bytes($keys[$i]), $delay) %></li>
|
|
% } else {
|
|
<li><%= l('for %1 and more, the file will be kept forever.', format_bytes($keys[$i]), $delay) %></li>
|
|
% }
|
|
% }
|
|
% $i++;
|
|
% }
|
|
</ul>
|
|
% }
|
|
</div>
|
|
|
|
<footer class="actions">
|
|
<button autofocus class="button close-modal"><%= l('Close') %></button>
|
|
</footer>
|
|
</section>
|
|
</dialog>
|
|
% }
|
|
|
|
<script type="text/javascript">
|
|
const ws_url = '<%= url_for('upload')->to_abs() %>';
|
|
% if (defined($self->config('fixed_domain')) && $self->config('fixed_domain')) {
|
|
const baseURL = '<%= url_for('/')->host($self->config('fixed_domain'))->to_abs() %>';
|
|
% } else {
|
|
const baseURL = '<%= url_for('/')->to_abs() %>';
|
|
% }
|
|
const actionURL = '<%= url_for('/')->to_abs() %>';
|
|
const i18n = {
|
|
enqueued: '<%= l('XXX file has been added to upload queue.') %>',
|
|
confirmExit: '<%= l('You have attempted to leave this page. The upload will be canceled. Are you sure?') %>',
|
|
copyAll: '<%= l('Copy all links to clipboard') %>',
|
|
copySuccess: '<%= l('The link(s) has been copied to your clipboard') %>',
|
|
copyFail: '<%= l('Unable to copy the link(s) to your clipboard') %>',
|
|
cpText: '<%= l('Copy to clipboard') %>',
|
|
delText: '<%= l('Deletion link') %>',
|
|
dlText: '<%= l('Download link') %>',
|
|
download: '<%= l('Download') %>',
|
|
encrypting: '<%= l('Encrypting part XX1 of XX2') %>',
|
|
expiration: '<%= l('Expiration:') %>',
|
|
fileUploaded: '<%= l('File uploaded') %>',
|
|
hit: '<%= l('Hit Enter, then Ctrl+C to copy the download link') %>',
|
|
hits: '<%= l('Hit Enter, then Ctrl+C to copy all the download links') %>',
|
|
mailTo: '<%= l('Send all links by email') %>',
|
|
maxSize: '<%= l('(max size: XXX)') %>',
|
|
noLimit: '<%= l('No expiration delay') %>',
|
|
sending: '<%= l('Sending part XX1 of XX2. Please, be patient, the progress bar can take a while to move.') %>',
|
|
wsProblem: '<%= l('Websocket communication error') %>',
|
|
};
|
|
const maxSize = <%= config('max_file_size') || 0 %>;
|
|
|
|
% if (defined stash('invitation')) {
|
|
const isGuest = true;
|
|
const sendFilesURLsURL = '<%= url_for('guest_send_mail', token => stash('invitation')->token)->to_abs() %>';
|
|
% } else {
|
|
const isGuest = false;
|
|
% }
|
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
document.querySelector(".drop-zone").onkeydown = (event) => {
|
|
if(event.key === " ") {
|
|
document.getElementById("file-browser").click();
|
|
}
|
|
};
|
|
|
|
document.querySelector(".info-delete-after-days").onclick = () => {
|
|
document.querySelector(".modal-delete-after-days").showModal();
|
|
}
|
|
|
|
document.querySelector(".close-modal").onclick = () => {
|
|
document.querySelector(".modal").close();
|
|
}
|
|
});
|
|
</script>
|
|
%= javascript '/js/lufi-upload.js', type => 'module', defer => "true"
|