352 lines
14 KiB
Plaintext
352 lines
14 KiB
Plaintext
% my %d = (
|
|
% delay_0 => l('no time limit'),
|
|
% delay_1 => l('24 hours'),
|
|
% delay_365 => l('1 year')
|
|
% );
|
|
|
|
% if (!stop_upload) {
|
|
<div id="upload-box" class="box columns is-desktop">
|
|
<div class="left-zone column">
|
|
<div class="fixed-grid has-1-cols">
|
|
<div class="grid">
|
|
<div id="file-js-upload" class="cell fixed-grid has-1-cols">
|
|
<div class="grid file is-boxed is-fullwidth">
|
|
<div id="provided-files" class="cell is-fullwidth is-rounded p-0 is-hidden"></div>
|
|
|
|
<div class="cell total-size p-2 is-hidden">
|
|
<span><%= l('Total size:')%></span>
|
|
<span class="size"></span>
|
|
</div>
|
|
|
|
<label class="file-label is-clickable">
|
|
<input class="file-input" type="file" name="upload" multiple>
|
|
|
|
<div class="file-cta px-0 is-size-1 full-version">
|
|
<span class="file-icon mr-0">
|
|
<span class="icon fas fa-circle-plus"></span>
|
|
</span>
|
|
<div class="file-label has-text-centered is-gap-3">
|
|
<span class="is-size-3 is-size-5-mobile"><%= l('Drop files here') %></span>
|
|
<span class="is-size-5 is-hidden-mobile"><%= l('or') %></span>
|
|
<button type="button" id="upload-zone-button" class="button m-auto is-primary is-hidden-mobile" tabindex=-1><%= l('Click to open the file browser') %></button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="file-cta px-0 is-small small-version has-text-primary is-hidden">
|
|
<span class="file-icon mr-0">
|
|
<span class="icon fas fa-circle-plus"></span>
|
|
</span>
|
|
<div class="file-label has-text-centered">
|
|
<span><%= l('Add files') %></span>
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="upload-controls" class="cell is-hidden">
|
|
<div class="field">
|
|
<div class="field is-horizontal is-align-items-center">
|
|
<div class="field-label">
|
|
<label class="label<%= ' disabled' if(max_delay) %>" for="expiration-delay">
|
|
<%= l('Expires after') %>
|
|
</label>
|
|
</div>
|
|
|
|
<div class="field-body is-align-items-center">
|
|
<div class="field">
|
|
<div class="control">
|
|
<div class="select">
|
|
<select id="expiration-delay" <%= 'disabled' if(max_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>
|
|
</div>
|
|
|
|
<div class="field is-narrow">or</div>
|
|
|
|
<fieldset <%= 'disabled' if config('force_burn_after_reading') %>>
|
|
<div class="field">
|
|
<div class="control">
|
|
<label for="delete-at-first-download" class="label is-flex is-gap-1 checkbox">
|
|
<%= l('After first download?') %>
|
|
<input
|
|
type="checkbox"
|
|
id="delete-at-first-download"
|
|
<%= 'checked disabled' if config('force_burn_after_reading') %>
|
|
>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</fieldset>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="field is-horizontal is-align-items-center<%= ' is-hidden' if (!config('allow_pwd_on_files') || stash('invitation')) %>">
|
|
<div class="field-label">
|
|
<label for="use-password" class="label">
|
|
<%= l('Protect with password') %>
|
|
</label>
|
|
</div>
|
|
<div class="field-body">
|
|
<div class="field is-grouped is-align-items-center">
|
|
<div class="control">
|
|
<input
|
|
type="checkbox"
|
|
id="use-password"
|
|
>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label id="password-control" class="label is-invisible">
|
|
Password
|
|
<div class="control has-icons-left has-icons-right is-expanded">
|
|
<input class="input" id="password-input" type="password" placeholder="<%= l('Password') %>" autocomplete="off" value="">
|
|
|
|
<span class="icon is-small is-left fas fa-lock" aria-hidden="true"></span>
|
|
<span id="password-preview-button" class="icon is-small is-right fas fa-eye is-clickable has-text-primary" aria-hidden="true"></span>
|
|
</div>
|
|
<label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="zip-fields" class="field is-horizontal is-align-items-center is-hidden">
|
|
<div class="field-label">
|
|
<label for="zip-multiple" class="label">
|
|
<%= l('Compress multiple files') %>
|
|
</label>
|
|
</div>
|
|
<div class="field-body">
|
|
<div class="field is-grouped is-align-items-center">
|
|
<div class="control">
|
|
<input
|
|
type="checkbox"
|
|
id="zip-multiple"
|
|
checked
|
|
>
|
|
</div>
|
|
|
|
<div class="control is-expanded">
|
|
<label class="label">
|
|
<%= l('Name of the zip file') %>
|
|
<input id="zip-name" type="text" class="input" value="documents.zip" placeholder="documents.zip">
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<div class="control has-text-centered">
|
|
<button id="submit-button" type="button" class="button is-primary is-medium is-fullwidth"><%= l('Send') %></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="right-zone column">
|
|
% if (stash('invitation')) {
|
|
<div class="message is-info">
|
|
<div class="message-body">
|
|
<%= 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>
|
|
</div>
|
|
% }
|
|
|
|
<div id="uploaded-files" class="block">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
% }
|
|
|
|
<template id="card-file-error">
|
|
<article class="card-file-error card m-2 is-size-6">
|
|
<div class="card-content p-2">
|
|
<div class="content fixed-grid has-12-cols">
|
|
<div class="grid is-vcentered">
|
|
<div class="cell is-col-1">
|
|
<span class="icon fas fa-file fa-2x is-large has-text-primary"></span>
|
|
</div>
|
|
<div class="cell is-col-span-9">
|
|
<strong class="is-block wb-all name is-overflow-x"></strong>
|
|
<small class="is-block size mt-1"></small>
|
|
</div>
|
|
|
|
<div class="cell is-col-10 ">
|
|
<button class="is-narrow card-header-icon" aria-label="<%= l('Close') %>">
|
|
<span class="delete"></span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="message is-danger has-text-danger">
|
|
<div class="message-body"></div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</article>
|
|
</template>
|
|
|
|
<template id="card-file-to-upload">
|
|
<article class="card-file-to-upload card m-2 is-size-6">
|
|
<div class="card-content p-2">
|
|
<div class="content fixed-grid has-12-cols">
|
|
<div class="grid is-vcentered">
|
|
<div class="cell is-col-1">
|
|
<span class="icon fas fa-file fa-2x is-large has-text-primary" aria-hidden="true"></span>
|
|
</div>
|
|
<div class="cell is-col-span-9">
|
|
<strong class="is-block wb-all name is-overflow-x"></strong>
|
|
<small class="is-block size mt-1"></small>
|
|
</div>
|
|
|
|
<div class="cell is-col-10 ">
|
|
<button class="is-narrow card-header-icon" aria-label="<%= l('Close') %>">
|
|
<span class="delete"></span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</article>
|
|
</template>
|
|
|
|
<template id="card-file-uploading">
|
|
<article class="card-file-uploading card m-2 is-size-6">
|
|
<div class="card-content p-2">
|
|
<div class="content fixed-grid has-12-cols">
|
|
<div class="grid is-vcentered">
|
|
<div class="cell is-col-1">
|
|
<span class="icon fas fa-file fa-2x is-large has-text-primary" aria-hidden="true"></span>
|
|
</div>
|
|
<div class="cell is-col-span-9">
|
|
<strong class="is-block wb-all name is-overflow-x"></strong>
|
|
<small class="is-block size mt-1"></small>
|
|
</div>
|
|
|
|
<button class="cell is-col-10 is-narrow has-text-right card-header-icon" aria-label="<%= l('Close') %>">
|
|
<span class="delete"></span>
|
|
</button>
|
|
</div>
|
|
<div class="block info"><%= l('Compression in progress') %></div>
|
|
|
|
<div class="progress-text has-text-centered">0%</div>
|
|
<progress class="progress is-primary is-small" max="100">0%</progress>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
</template>
|
|
|
|
<template id="card-file-uploaded">
|
|
<article class="card-file-uploaded card m-2 is-size-6">
|
|
<div class="card-content p-2">
|
|
<div class="content fixed-grid has-12-cols">
|
|
<div class="grid is-vcentered">
|
|
<div class="cell is-col-1">
|
|
<span class="icon fas fa-file fa-2x is-large has-text-primary" aria-hidden="true"></span>
|
|
</div>
|
|
<div class="cell is-col-span-9">
|
|
<strong class="is-block wb-all name is-overflow-x name"></strong>
|
|
<small class="is-block size mt-1 size"></small>
|
|
</div>
|
|
|
|
<button class="cell is-col-10 is-narrow has-text-right card-header-icon" aria-label="<%= l('Close') %>">
|
|
<span class="delete"></span>
|
|
</button>
|
|
</div>
|
|
|
|
<div class="expiration"></div>
|
|
</div>
|
|
</div>
|
|
|
|
% if (!defined stash('invitation')) {
|
|
<footer class="card-footer is-align-items-center ">
|
|
<a href="#" class="card-footer-item action-copy">
|
|
<span class="icon-text is-justify-content-center">
|
|
<span class="icon fas fa-copy" aria-hidden="true"></span>
|
|
<span class="text"><%= l('Copy link') %></span>
|
|
</span>
|
|
</a>
|
|
<a href="#" class="card-footer-item action-download">
|
|
<span class="icon-text is-justify-content-center">
|
|
<span class="icon fas fa-download" aria-hidden="true"></span>
|
|
<span><%= l('Download') %></span>
|
|
</span>
|
|
</a>
|
|
<a href="#" class="card-footer-item action-share">
|
|
<span class="icon-text is-justify-content-center">
|
|
<span class="icon fas fa-envelope" aria-hidden="true"></span>
|
|
<span><%= l('Share') %></span>
|
|
</span>
|
|
</a>
|
|
<a href="#" class="card-footer-item has-text-danger action-delete">
|
|
<span class="icon-text is-justify-content-center">
|
|
<span class="icon fas fa-trash" aria-hidden="true"></span>
|
|
<span><%= l('Delete') %></span>
|
|
</span>
|
|
</a>
|
|
</footer>
|
|
% }
|
|
</article>
|
|
</template>
|
|
|
|
<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 = {
|
|
compressing: '<%= l('Compression in progress...') %>',
|
|
confirmExit: '<%= l('You have attempted to leave this page. The upload will be canceled. Are you sure?') %>',
|
|
copied: '<%= l('Copied') %>',
|
|
copyLink: '<%= l('Copy link') %>',
|
|
download: '<%= l('Download') %>',
|
|
expiration: '<%= l('Expiration:') %>',
|
|
fileUploaded: '<%= l('File uploaded') %>',
|
|
maxSize: '<%= l('(max size: XXX)') %>',
|
|
noLimit: '<%= l('No expiration delay') %>',
|
|
unknownYet: '<%= l('Unknown yet') %>',
|
|
uploading: '<%= l('Upload in progress...') %>',
|
|
};
|
|
const maxSize = <%= config('max_file_size') || 0 %>;
|
|
|
|
% if (defined stash('invitation')) {
|
|
const isGuest = true;
|
|
const sendGuestFileURL = '<%= url_for('guest_send_mail', token => stash('invitation')->token)->to_abs() %>';
|
|
% } else {
|
|
const isGuest = false;
|
|
% }
|
|
|
|
</script>
|
|
|
|
%= javascript '/js/minified/upload.min.js', type => 'module', defer => "true" |