mirror of
https://framagit.org/fiat-tux/hat-softwares/lutim.git
synced 2026-03-28 17:42:54 +01:00
🎨 — Use template literals in js
This commit is contained in:
Luc Didry
@@ -3,6 +3,7 @@ Revision history for Lutim
|
||||
0.16.0 ????-??-??
|
||||
- ⬆️ UUpdate jQuery
|
||||
- 💥 BREAKING CHANGE: no more twitter cards
|
||||
- 🎨 — Use template literals in js
|
||||
|
||||
0.15.0 2023-12-19
|
||||
- ✨ — Add --nuke option to image command
|
||||
|
||||
@@ -9,14 +9,14 @@ function addToShortHash(short) {
|
||||
window.short_hash[short] = 1;
|
||||
if (Object.keys(window.short_hash).length > 0) {
|
||||
$('#gallery-url').removeClass('hidden');
|
||||
$('#gallery-url-input').val(window.gallery_url+Object.keys(window.short_hash).join(','));
|
||||
$('#gallery-url-link').attr('href', window.gallery_url+Object.keys(window.short_hash).join(','));
|
||||
$('#gallery-url-input').val(`${window.gallery_url}${Object.keys(window.short_hash).join(',')}`);
|
||||
$('#gallery-url-link').attr('href', `${window.gallery_url}${Object.keys(window.short_hash).join(',')}`);
|
||||
}
|
||||
}
|
||||
function rmFromShortHash(short) {
|
||||
delete window.short_hash[short];
|
||||
$('#gallery-url-input').val(window.gallery_url+Object.keys(window.short_hash).join(','));
|
||||
$('#gallery-url-link').attr('href', window.gallery_url+Object.keys(window.short_hash).join(','));
|
||||
$('#gallery-url-input').val(`${window.gallery_url}${Object.keys(window.short_hash).join(',')}`);
|
||||
$('#gallery-url-link').attr('href', `${window.gallery_url}${Object.keys(window.short_hash).join(',')}`);
|
||||
if (Object.keys(window.short_hash).length === 0) {
|
||||
$('#gallery-url').addClass('hidden');
|
||||
}
|
||||
@@ -25,14 +25,14 @@ function addToZipHash(short) {
|
||||
window.zip_hash[short] = 1;
|
||||
if (Object.keys(window.zip_hash).length > 0) {
|
||||
$('#zip-url').removeClass('hidden');
|
||||
$('#zip-url-input').val(window.zip_url+Object.keys(window.zip_hash).join('&i='));
|
||||
$('#zip-url-link').attr('href', window.zip_url+Object.keys(window.zip_hash).join('&i='));
|
||||
$('#zip-url-input').val(`${window.zip_url}${Object.keys(window.zip_hash).join('&i=')}`);
|
||||
$('#zip-url-link').attr('href', `${window.zip_url}${Object.keys(window.zip_hash).join('&i=')}`);
|
||||
}
|
||||
}
|
||||
function rmFromZipHash(short) {
|
||||
delete window.zip_hash[short];
|
||||
$('#zip-url-input').val(window.zip_url+Object.keys(window.zip_hash).join('&i='));
|
||||
$('#zip-url-link').attr('href', window.zip_url+Object.keys(window.zip_hash).join('&i='));
|
||||
$('#zip-url-input').val(`${window.zip_url}${Object.keys(window.zip_hash).join('&i=')}`);
|
||||
$('#zip-url-link').attr('href', `${window.zip_url}${Object.keys(window.zip_hash).join('&i=')}`);
|
||||
if (Object.keys(window.zip_hash).length === 0) {
|
||||
$('#zip-url').addClass('hidden');
|
||||
}
|
||||
@@ -41,14 +41,14 @@ function addToRandomHash(short) {
|
||||
window.random_hash[short] = 1;
|
||||
if (Object.keys(window.random_hash).length > 0) {
|
||||
$('#random-url').removeClass('hidden');
|
||||
$('#random-url-input').val(window.random_url+Object.keys(window.random_hash).join('&i='));
|
||||
$('#random-url-link').attr('href', window.random_url+Object.keys(window.random_hash).join('&i='));
|
||||
$('#random-url-input').val(`${window.random_url}${Object.keys(window.random_hash).join('&i=')}`);
|
||||
$('#random-url-link').attr('href', `${window.random_url}${Object.keys(window.random_hash).join('&i=')}`);
|
||||
}
|
||||
}
|
||||
function rmFromRandomHash(short) {
|
||||
delete window.random_hash[short];
|
||||
$('#random-url-input').val(window.random_url+Object.keys(window.random_hash).join('&i='));
|
||||
$('#random-url-link').attr('href', window.random_url+Object.keys(window.random_hash).join('&i='));
|
||||
$('#random-url-input').val(`${window.random_url}${Object.keys(window.random_hash).join('&i=')}`);
|
||||
$('#random-url-link').attr('href', `${window.random_url}${Object.keys(window.random_hash).join('&i=')}`);
|
||||
if (Object.keys(window.random_hash).length === 0) {
|
||||
$('#random-url').addClass('hidden');
|
||||
}
|
||||
@@ -85,10 +85,10 @@ function copyLink(e) {
|
||||
e.preventDefault();
|
||||
var successful = copyText($(this).prop('href'));
|
||||
var msg = successful ? 'successful' : 'unsuccessful';
|
||||
console.debug('Copying text command was ' + msg);
|
||||
console.debug(`Copying text command was ${msg}`);
|
||||
if (!successful) {
|
||||
badToast('<%= l('Unable to copy to clipboard') %>');
|
||||
throw new Error('Copying text command was ' + msg);
|
||||
throw new Error(`Copying text command was ${msg}`);
|
||||
} else {
|
||||
goodToast('<%= l('Copied to clipboard') %>');
|
||||
}
|
||||
@@ -105,10 +105,10 @@ function copyToClipboard(el) {
|
||||
try {
|
||||
var successful = copyInput(el);
|
||||
var msg = successful ? 'successful' : 'unsuccessful';
|
||||
console.debug('Copying text command was ' + msg);
|
||||
console.debug(`Copying text command was ${msg}`);
|
||||
if (!successful) {
|
||||
badToast('<%= l('Unable to copy to clipboard') %>');
|
||||
throw new Error('Copying text command was ' + msg);
|
||||
throw new Error(`Copying text command was ${msg}`);
|
||||
} else {
|
||||
goodToast('<%= l('Copied to clipboard') %>');
|
||||
}
|
||||
@@ -126,9 +126,9 @@ function copyAllToClipboard(e) {
|
||||
try {
|
||||
var successful = copyText(text.join("\n"));
|
||||
var msg = successful ? 'successful' : 'unsuccessful';
|
||||
console.debug('Copying text command was ' + msg);
|
||||
console.debug(`Copying text command was ${msg}`);
|
||||
if (!successful) {
|
||||
throw new Error('Copying text command was ' + msg);
|
||||
throw new Error(`Copying text command was ${msg}`);
|
||||
}
|
||||
} catch (err) {
|
||||
prompt('<%= l('Hit Ctrl+C, then Enter to copy the short link') %>', text.join(" "));
|
||||
@@ -144,14 +144,14 @@ function delImage(e) {
|
||||
var short = $(this).attr('data-short');
|
||||
var token = $(this).attr('data-token');
|
||||
$.ajax({
|
||||
url: '<%= url_for('/') %>d/'+short+'/'+token,
|
||||
url: `<%= url_for('/') %>d/${short}/${token}`,
|
||||
method: 'GET',
|
||||
data: {
|
||||
_format: 'json'
|
||||
},
|
||||
success: function(data) {
|
||||
if (data.success) {
|
||||
$('#alert-'+short).remove();
|
||||
$(`#alert-${short}`).remove();
|
||||
evaluateCopyAll();
|
||||
delItem(short);
|
||||
goodToast('<%= l('Image deleted') %>');
|
||||
@@ -168,30 +168,33 @@ function delImage(e) {
|
||||
function link(url, dl, token, modify, only_url) {
|
||||
if (token !== undefined) {
|
||||
if (modify !== undefined && modify === true) {
|
||||
return '<%== url_for('/m/')->to_abs() %>'+url+'/'+token;
|
||||
return `<%== url_for('/m/')->to_abs() %>${url}/${token}`;
|
||||
}
|
||||
var link = '<%== url_for('/')->to_abs() %>d/'+url+'/'+token;
|
||||
var link = `<%== url_for('/')->to_abs() %>d/${url}/${token}`;
|
||||
if (only_url !== undefined && only_url === true) {
|
||||
return link;
|
||||
}
|
||||
return [
|
||||
'<label class="sr-only" for="link-del-', url, '"><%= l('Deletion link') %></label>',
|
||||
'<div class="input-group input-group-sm">',
|
||||
'<div class="input-group-btn adjust-addon">',
|
||||
'<a class="btn btn-default text-danger" href="#" title="<%= l('Deletion link') %>" id="del-', url, '" data-short="', url, '" data-token="', token, '">',
|
||||
'<span class="icon icon-trash"></span> ',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'<input type="text" class="form-control" id="link-del-', url, '" value="', link, '" readonly>',
|
||||
'<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">',
|
||||
'<span class="icon icon-clipboard"></span>',
|
||||
'</a>',
|
||||
'</div>'
|
||||
].join('');
|
||||
return `<label class="sr-only" for="link-del-${url}"><%= l('Deletion link') %></label>
|
||||
<div class="input-group input-group-sm">
|
||||
<div class="input-group-btn adjust-addon">
|
||||
<a href="#"
|
||||
class="btn btn-default text-danger"
|
||||
title="<%= l('Deletion link') %>"
|
||||
id="del-${url}"
|
||||
data-short="${url}"
|
||||
data-token="${token}">
|
||||
<span class="icon icon-trash"></span>
|
||||
</a>
|
||||
</div>
|
||||
<input type="text" class="form-control" id="link-del-${url}" value="${link}" readonly>
|
||||
<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">
|
||||
<span class="icon icon-clipboard"></span>
|
||||
</a>
|
||||
</div>`;
|
||||
} else if (dl !== '') {
|
||||
url = url+'?'+dl;
|
||||
url = `${url}?${dl}`;
|
||||
}
|
||||
return '<%== prefix() %>'+url;
|
||||
return `<%== prefix() %>${url}`;
|
||||
}
|
||||
|
||||
function badToast(msg) {
|
||||
|
||||
@@ -193,7 +193,7 @@ var initPhotoSwipeFromDOM = function(gallerySelector) {
|
||||
var galleryElements = document.querySelectorAll( gallerySelector );
|
||||
|
||||
for(var i = 0, l = galleryElements.length; i < l; i++) {
|
||||
galleryElements[i].setAttribute('data-pswp-uid', i+1);
|
||||
galleryElements[i].setAttribute('data-pswp-uid', i + 1);
|
||||
galleryElements[i].onclick = onThumbnailsClick;
|
||||
}
|
||||
|
||||
@@ -205,25 +205,19 @@ var initPhotoSwipeFromDOM = function(gallerySelector) {
|
||||
};
|
||||
|
||||
function addAlert(e) {
|
||||
$('#infos-msg').append([
|
||||
'<div class="alert alert-danger">',
|
||||
'<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>',
|
||||
'<strong><%= l('Something bad happened') %></strong><br>',
|
||||
cleanName(e, false),
|
||||
'</div>'
|
||||
].join(''));
|
||||
$('#infos-msg').append(`<div class="alert alert-danger">
|
||||
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
|
||||
<strong><%= l('Something bad happened') %></strong><br>
|
||||
${cleanName(e, false)}
|
||||
</div>`);
|
||||
}
|
||||
|
||||
function appendToGallery(url, width, height) {
|
||||
$('.gallery').append(
|
||||
[
|
||||
'<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">',
|
||||
' <a href="', url, '" itemprop="contentUrl" data-size="', width, 'x', height, '">',
|
||||
' <img src="', url, '?width=275" itemprop="thumbnail" alt="" class="img-responsive"/>',
|
||||
' </a>',
|
||||
'</figure>'
|
||||
].join('')
|
||||
);
|
||||
$('.gallery').append(`<figure itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
|
||||
<a href="${url}" itemprop="contentUrl" data-size="${width}x${height}">
|
||||
<img src="${url}?width=275" itemprop="thumbnail" alt="" class="img-responsive"/>
|
||||
</a>
|
||||
</figure>`);
|
||||
}
|
||||
|
||||
function nextOrInitGallery(keys) {
|
||||
@@ -238,21 +232,21 @@ function addElement(keys) {
|
||||
element = keys.shift();
|
||||
if (!element.match('xcf')) {
|
||||
$.ajax({
|
||||
url: '<%= url_for('about_img') %>'+element,
|
||||
url: `<%= url_for('about_img') %>${element}`,
|
||||
method: 'GET',
|
||||
dataType: 'json',
|
||||
success: function(data, textStatus, jqXHR) {
|
||||
if (data.success) {
|
||||
if (data.data.width && data.data.height) {
|
||||
appendToGallery(absUrl+element, data.data.width, data.data.height);
|
||||
appendToGallery(`${absUrl}${element}`, data.data.width, data.data.height);
|
||||
nextOrInitGallery(keys);
|
||||
} else {
|
||||
var img = new Image();
|
||||
img.onload = function(){
|
||||
appendToGallery(absUrl+element, img.width, img.height);
|
||||
appendToGallery(`${absUrl}${element}`, img.width, img.height);
|
||||
nextOrInitGallery(keys);
|
||||
}
|
||||
img.src = absUrl+element;
|
||||
img.src = `${absUrl}${element}`;
|
||||
}
|
||||
} else {
|
||||
addAlert(data.msg);
|
||||
@@ -269,14 +263,14 @@ function addElement(keys) {
|
||||
$(document).ready(function() {
|
||||
var key = window.location.hash.substring(1); // Get key
|
||||
// First, strip everything after the equal sign (=) which signals end of base64 string.
|
||||
i = key.indexOf('='); if (i>-1) { key = key.substring(0,i+1); }
|
||||
i = key.indexOf('='); if (i>-1) { key = key.substring(0, i + 1); }
|
||||
// If the equal sign was not present, some parameters may remain:
|
||||
i = key.indexOf('&'); if (i>-1) { key = key.substring(0,i); }
|
||||
i = key.indexOf('&'); if (i>-1) { key = key.substring(0, i); }
|
||||
|
||||
var keys = key.split(',');
|
||||
$('#img-nb').append('<p><%= l('There is XXXX image(s) in the gallery') %></p>'.replace('XXXX', keys.length));
|
||||
|
||||
$('#download-all').attr('href', $('#download-all').attr('href')+keys.join('&i='));
|
||||
$('#download-all').attr('href', $('#download-all').attr('href') + keys.join('&i='));
|
||||
|
||||
addElement(keys);
|
||||
});
|
||||
|
||||
@@ -19,13 +19,13 @@ function modifyImage(e) {
|
||||
modify(url, short);
|
||||
}
|
||||
function modify(url, short) {
|
||||
var limit = $('#day-'+short).val();
|
||||
var del_at_view = ($('#first-view-'+short).prop('checked')) ? 1 : 0;
|
||||
var limit = $(`#day-${short}`).val();
|
||||
var del_at_view = ($(`#first-view-${short}`).prop('checked')) ? 1 : 0;
|
||||
$.ajax({
|
||||
url : url,
|
||||
type : 'POST',
|
||||
data : {
|
||||
'image_url' : '<%== url_for('/')->to_abs() %>'+short,
|
||||
'image_url' : `<%== url_for('/')->to_abs() %>${short}`,
|
||||
'format' : 'json',
|
||||
'delete-day' : limit,
|
||||
'first-view' : del_at_view
|
||||
@@ -43,134 +43,131 @@ function modify(url, short) {
|
||||
function buildMessage(success, msg) {
|
||||
if(success) {
|
||||
var s_url = link([msg.short, '.', msg.ext].join(''), '');
|
||||
var thumb = (msg.thumb !== null) ? [
|
||||
'<div class="col-sm-1">',
|
||||
'<a href="', s_url, '" target="_blank">',
|
||||
'<img class="thumbnail img-responsive" alt="', cleanName(msg.filename, true), ' thumbnail" src="', msg.thumb, '">',
|
||||
'</a>',
|
||||
'</div>'
|
||||
].join('') : ''
|
||||
return [
|
||||
'<div class="alert alert-success" id="alert-', msg.real_short, '">',
|
||||
'<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>',
|
||||
'<div class="row">', thumb,
|
||||
'<div class="col-sm-11">',
|
||||
'<h4>',
|
||||
'<a href="', s_url, '" target="_blank">',
|
||||
msg.filename,
|
||||
'</a>',
|
||||
'</h4>',
|
||||
'<form class="form">',
|
||||
'<div class="form-group">',
|
||||
'<label class="sr-only" for="view', msg.real_short, '"><%= l('View link') %></label>',
|
||||
'<div class="input-group input-group-sm col-sm-6">',
|
||||
'<div class="input-group-btn adjust-addon">',
|
||||
'<a href="', s_url, '" target="_blank" class="btn btn-default">',
|
||||
'<span class="icon icon-eye" title=" <%= l('View link') %>"></span>',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'<input type="text" class="form-control view-link-input" id="view', msg.real_short, '" value="', s_url, '" readonly>',
|
||||
'<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">',
|
||||
'<span class="icon icon-clipboard"></span>',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'<div class="form-group">',
|
||||
'<label class="sr-only" for="markdown', msg.real_short, '"><%= l('Markdown syntax') %></label>',
|
||||
'<div class="input-group input-group-sm col-sm-6">',
|
||||
'<div class="input-group-addon adjust-addon">',
|
||||
'<span class="markdown-mark-solid" title="<%= l('Markdown syntax') %>"></span>',
|
||||
'</div>',
|
||||
'<input type="text" class="form-control" id="markdown', msg.real_short, '" value=", ')" readonly>',
|
||||
'<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">',
|
||||
'<span class="icon icon-clipboard"></span>',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'<div class="form-group">',
|
||||
'<label class="sr-only" for="download', msg.real_short, '"><%= l('Download link') %></label>',
|
||||
'<div class="input-group input-group-sm col-sm-6">',
|
||||
'<div class="input-group-btn adjust-addon">',
|
||||
'<a href="', link(msg.short, 'dl'), '" class="btn btn-default">',
|
||||
'<span class="icon icon-download" title="<%= l('Download link') %>"></span>',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'<input type="text" class="form-control" id="download', msg.real_short, '" value="', link(msg.short, 'dl'), '" readonly>',
|
||||
'<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">',
|
||||
'<span class="icon icon-clipboard"></span>',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'<div class="form-group">',
|
||||
'<label class="sr-only" for="share', msg.real_short, '"><%= l('Link for share on social networks') %></label>',
|
||||
'<div class="input-group input-group-sm col-sm-6">',
|
||||
'<div class="input-group-btn adjust-addon">',
|
||||
'<a href="', link(msg.short, 't'), '" target="_blank" class="btn btn-default">',
|
||||
'<span class="icon icon-share" title="<%= l('Link for share on social networks') %>"></span>',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'<input type="text" class="form-control" id="share', msg.real_short, '" value="', link(msg.short, 't'), '" readonly>',
|
||||
'<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">',
|
||||
'<span class="icon icon-clipboard"></span>',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'<div class="form-group">',
|
||||
'<div class="input-group col-sm-6 col-xs-12">',
|
||||
'<span class="form-control-static">', link(msg.real_short, '', msg.token), '</span>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'</form>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'<div class="row">',
|
||||
'<form class="form col-sm-11 col-sm-offset-1" role="form" method="POST" action="', link(msg.real_short, '', msg.token, true), '">',
|
||||
'<div class="form-group form-inline">',
|
||||
'<select id="day-', msg.real_short, '" name="delete-day" class="form-control">',
|
||||
var thumb = (msg.thumb !== null) ? `<div class="col-sm-1">
|
||||
<a href="${s_url}" target="_blank">
|
||||
<img class="thumbnail img-responsive" alt="${cleanName(msg.filename, true)} thumbnail" src="${msg.thumb}">
|
||||
</a>
|
||||
</div>` : '';
|
||||
return `<div class="alert alert-success" id="alert-${msg.real_short}">
|
||||
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
|
||||
<div class="row">${thumb}
|
||||
<div class="col-sm-11">
|
||||
<h4>
|
||||
<a href="${s_url}" target="_blank">
|
||||
${msg.filename}
|
||||
</a>
|
||||
</h4>
|
||||
<form class="form">
|
||||
<div class="form-group">
|
||||
<label class="sr-only" for="view${msg.real_short}"><%= l('View link') %></label>
|
||||
<div class="input-group input-group-sm col-sm-6">
|
||||
<div class="input-group-btn adjust-addon">
|
||||
<a href="${s_url}" target="_blank" class="btn btn-default">
|
||||
<span class="icon icon-eye" title=" <%= l('View link') %>"></span>
|
||||
</a>
|
||||
</div>
|
||||
<input type="text" class="form-control view-link-input" id="view${msg.real_short}" value="${s_url}" readonly>
|
||||
<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">
|
||||
<span class="icon icon-clipboard"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="sr-only" for="markdown${msg.real_short}"><%= l('Markdown syntax') %></label>
|
||||
<div class="input-group input-group-sm col-sm-6">
|
||||
<div class="input-group-addon adjust-addon">
|
||||
<span class="markdown-mark-solid" title="<%= l('Markdown syntax') %>"></span>
|
||||
</div>
|
||||
<input type="text" class="form-control" id="markdown${msg.real_short}" value="})" readonly>
|
||||
<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">
|
||||
<span class="icon icon-clipboard"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="sr-only" for="download${msg.real_short}"><%= l('Download link') %></label>
|
||||
<div class="input-group input-group-sm col-sm-6">
|
||||
<div class="input-group-btn adjust-addon">
|
||||
<a href="${link(msg.short, 'dl')}" class="btn btn-default">
|
||||
<span class="icon icon-download" title="<%= l('Download link') %>"></span>
|
||||
</a>
|
||||
</div>
|
||||
<input type="text" class="form-control" id="download${msg.real_short}" value="${link(msg.short, 'dl')}" readonly>
|
||||
<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">
|
||||
<span class="icon icon-clipboard"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="sr-only" for="share${msg.real_short}"><%= l('Link for share on social networks') %></label>
|
||||
<div class="input-group input-group-sm col-sm-6">
|
||||
<div class="input-group-btn adjust-addon">
|
||||
<a href="${link(msg.short, 't')}" target="_blank" class="btn btn-default">
|
||||
<span class="icon icon-share" title="<%= l('Link for share on social networks') %>"></span>
|
||||
</a>
|
||||
</div>
|
||||
<input type="text" class="form-control" id="share${msg.real_short}" value="${link(msg.short, 't')}" readonly>
|
||||
<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">
|
||||
<span class="icon icon-clipboard"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="input-group col-sm-6 col-xs-12">
|
||||
<span class="form-control-static">${link(msg.real_short, '', msg.token)}</span>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<form class="form col-sm-11 col-sm-offset-1" role="form" method="POST" action="${link(msg.real_short, '', msg.token, true)}">
|
||||
<div class="form-group form-inline">
|
||||
<select id="day-${msg.real_short}" name="delete-day" class="form-control">
|
||||
% my @delays = split(',', $self->config('proposed_delays'));
|
||||
% for my $delay (@delays) {
|
||||
% my $text = (defined($d->{'delay_'.$delay})) ? $d->{'delay_'.$delay} : l('%1 days', $delay);
|
||||
% if (config('max_delay')) {
|
||||
% if ($delay) {
|
||||
% if ($delay < config('max_delay')) {
|
||||
'<option value="<%= $delay %>" <%== is_selected($delay) %>><%= $text %></option>',
|
||||
<option value="<%= $delay %>" <%== is_selected($delay) %>><%= $text %></option>
|
||||
% } elsif ($delay == config('max_delay')) {
|
||||
'<option value="<%= $delay %>" <%== is_selected($delay) %>><%= $text %></option>',
|
||||
<option value="<%= $delay %>" <%== is_selected($delay) %>><%= $text %></option>
|
||||
% last;
|
||||
% } else {
|
||||
% my $text = ($delay == 1) ? l('24 hours') : l('%1 days', $delay);
|
||||
'<option value="<%= config('max_delay') %>" <%== is_selected(config('max_delay')) %>><%= l('%1 days', config('max_delay')) %></option>',
|
||||
<option value="<%= config('max_delay') %>" <%== is_selected(config('max_delay')) %>><%= l('%1 days', config('max_delay')) %></option>
|
||||
% last;
|
||||
% }
|
||||
% }
|
||||
% } else {
|
||||
'<option value="<%= $delay %>" <%== is_selected($delay) %>><%= $text %></option>',
|
||||
<option value="<%= $delay %>" <%== is_selected($delay) %>><%= $text %></option>
|
||||
% }
|
||||
% }
|
||||
'</select> ',
|
||||
'<div class="checkbox">',
|
||||
'<label>',
|
||||
'<input id="first-view-', msg.real_short, '" type="checkbox" name="first-view"> <%= l('Delete at first view?') %>',
|
||||
'</label>',
|
||||
'</div> ',
|
||||
'<a href="#" class="btn btn-sm btn-default btn-primary modify-image" data-modlink="', link(msg.real_short, '', msg.token, true),'" data-modshort="', msg.real_short,'">',
|
||||
'<%= l('Let\'s go!') %>',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'</form>',
|
||||
'</div>',
|
||||
'</div>'
|
||||
].join('');
|
||||
</select>
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<input id="first-view-${msg.real_short}" type="checkbox" name="first-view"> <%= l('Delete at first view?') %>
|
||||
</label>
|
||||
</div>
|
||||
<a href="#"
|
||||
class="btn btn-sm btn-default btn-primary modify-image"
|
||||
data-modlink="${link(msg.real_short, '', msg.token, true)}"
|
||||
data-modshort="${msg.real_short}">
|
||||
<%= l('Let\'s go!') %>
|
||||
</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>`
|
||||
} else {
|
||||
return [
|
||||
'<div class="alert alert-danger">',
|
||||
'<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>',
|
||||
'<strong><%= l('Something bad happened') %></strong><br>',
|
||||
cleanName(msg.filename, false),
|
||||
'<br>',
|
||||
cleanName(msg.msg, false),
|
||||
'</div>'
|
||||
].join('');
|
||||
return `<div class="alert alert-danger">
|
||||
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
|
||||
<strong><%= l('Something bad happened') %></strong><br>
|
||||
${cleanName(msg.filename, false)}
|
||||
<br>
|
||||
${cleanName(msg.msg, false)}
|
||||
</div>`;
|
||||
}
|
||||
}
|
||||
function bindddz(firstview, deleteday) {
|
||||
@@ -180,51 +177,52 @@ function bindddz(firstview, deleteday) {
|
||||
allowedTypes: 'image/*',
|
||||
maxFileSize: <%= config('max_file_size') %>,
|
||||
onNewFile: function(id, file){
|
||||
$('.messages').append([
|
||||
'<div id="', id, '-div">',
|
||||
cleanName(file.name), '<br>',
|
||||
'<div class="progress">',
|
||||
'<div id="', id, '"class="progress-bar progress-striped active width-zero" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">',
|
||||
'<span id="', id, '-text" class="pull-left pdg-left-10"> 0%</span>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'</div>'
|
||||
].join(''));
|
||||
$('.messages').append(`<div id="${id}-div">
|
||||
${cleanName(file.name)}<br>
|
||||
<div class="progress">
|
||||
<div id="${id}"
|
||||
class="progress-bar progress-striped active width-zero"
|
||||
role="progressbar"
|
||||
aria-valuenow="0"
|
||||
aria-valuemin="0"
|
||||
aria-valuemax="100">
|
||||
<span id="${id}-text" class="pull-left pdg-left-10"> 0%</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>`);
|
||||
},
|
||||
onUploadProgress: function(id, percent){
|
||||
var percentStr = ' '+percent+'%';
|
||||
$('#'+id).prop('aria-valuenow', percent);
|
||||
$('#'+id).css('width', percent+'%');
|
||||
$('#'+id+'-text').html(percentStr);
|
||||
var percentStr = ` ${percent}%`;
|
||||
$(`#${id}`).prop('aria-valuenow', percent);
|
||||
$(`#${id}`).css('width', `${percent}%`);
|
||||
$(`#${id}-text`).html(percentStr);
|
||||
},
|
||||
onUploadSuccess: function(id, data){
|
||||
data.msg.filename = cleanName(data.msg.filename);
|
||||
$('#'+id+'-div').remove();
|
||||
$(`#${id}-div`).remove();
|
||||
if ($('#copy-all').length === 0 && data.success) {
|
||||
$('.messages').prepend([
|
||||
'<div class="col-xs-12 col-sm-11 col-sm-offset-1">',
|
||||
'<a id="copy-all" href="#" class="btn btn-info copy-all-to-clipboard-link">',
|
||||
'<%= l('Copy all view links to clipboard') %>',
|
||||
'</a>',
|
||||
'</div>'
|
||||
].join(''));
|
||||
$('.messages').prepend(`<div class="col-xs-12 col-sm-11 col-sm-offset-1">
|
||||
<a id="copy-all" href="#" class="btn btn-info copy-all-to-clipboard-link">
|
||||
<%= l('Copy all view links to clipboard') %>
|
||||
</a>
|
||||
</div>`);
|
||||
}
|
||||
$('.messages').append(buildMessage(data.success, data.msg));
|
||||
$('#del-'+data.msg.real_short).on('click', function(e) {
|
||||
$(`#del-${data.msg.real_short}`).on('click', function(e) {
|
||||
e.preventDefault();
|
||||
rmFromShortHash(data.msg.short+'.'+data.msg.ext)
|
||||
rmFromShortHash(`${data.msg.short}.${data.msg.ext}`);
|
||||
rmFromZipHash(data.msg.short);
|
||||
rmFromRandomHash(data.msg.short);
|
||||
});
|
||||
$('#del-'+data.msg.real_short).on('click', delImage);
|
||||
$(`#del-${data.msg.real_short}`).on('click', delImage);
|
||||
if (data.success) {
|
||||
addToShortHash(data.msg.short+'.'+data.msg.ext);
|
||||
addToShortHash(`${data.msg.short}.${data.msg.ext}`);
|
||||
addToZipHash(data.msg.short);
|
||||
addToRandomHash(data.msg.short);
|
||||
$('.close').unbind('click', evaluateCopyAll);
|
||||
$('.close').on('click', evaluateCopyAll);
|
||||
$('input[type=\'text\']').unbind("click", selectInput);
|
||||
$('input[type=\'text\']').on("click", selectInput);
|
||||
$('input[type="text"]').unbind("click", selectInput);
|
||||
$('input[type="text"]').on("click", selectInput);
|
||||
$('.copy-all-to-clipboard-link').unbind('click', copyAllToClipboard);
|
||||
$('.copy-all-to-clipboard-link').on('click', copyAllToClipboard);
|
||||
$('.modify-image').unbind('click', modifyImage);
|
||||
@@ -264,19 +262,17 @@ function upload_url(e) {
|
||||
$('.messages').append(buildMessage(data.success, data.msg));
|
||||
if (data.success) {
|
||||
if ($('#copy-all').length === 0) {
|
||||
$('.messages').prepend([
|
||||
'<div class="col-xs-12 col-sm-11 col-sm-offset-1">',
|
||||
'<a id="copy-all" href="#" class="btn btn-info copy-all-to-clipboard-link">',
|
||||
'<%= l('Copy all view links to clipboard') %>',
|
||||
'</a>',
|
||||
'</div>'
|
||||
].join(''));
|
||||
$('.messages').prepend(`<div class="col-xs-12 col-sm-11 col-sm-offset-1">
|
||||
<a id="copy-all" href="#" class="btn btn-info copy-all-to-clipboard-link">
|
||||
<%= l('Copy all view links to clipboard') %>
|
||||
</a>
|
||||
</div>`);
|
||||
}
|
||||
$('#lutim-file-url').val('');
|
||||
addToShortHash(data.msg.short+'.'+data.msg.ext);
|
||||
addToShortHash(`${data.msg.short}.${data.msg.ext}`);
|
||||
addToZipHash(data.msg.short);
|
||||
addToRandomHash(data.msg.short);
|
||||
$('#del-'+data.msg.real_short).on('click', delImage);
|
||||
$(`#del-${data.msg.real_short}`).on('click', delImage);
|
||||
$('.close').unbind('click', evaluateCopyAll);
|
||||
$('.close').on('click', evaluateCopyAll);
|
||||
addItem(data.msg);
|
||||
@@ -308,15 +304,18 @@ function fileUpload(file) {
|
||||
fd.append('crypt', ($('#crypt').prop('checked')) ? 1 : 0);
|
||||
fd.append('delete-day', ($('#delete-day').val()));
|
||||
|
||||
$('.messages').append([
|
||||
'<div id="1-div">', cleanName(file.name), '<br>',
|
||||
'<div class="progress">',
|
||||
'<div id="1" class="progress-bar progress-striped active width-zero" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">',
|
||||
'<span id="1-text" class="pull-left pdg-left-10"> 0%</span>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'</div>'
|
||||
].join(''));
|
||||
$('.messages').append(`<div id="1-div">${cleanName(file.name)}<br>
|
||||
<div class="progress">
|
||||
<div id="1"
|
||||
class="progress-bar progress-striped active width-zero"
|
||||
role="progressbar"
|
||||
aria-valuenow="0"
|
||||
aria-valuemin="0"
|
||||
aria-valuemax="100">
|
||||
<span id="1-text" class="pull-left pdg-left-10"> 0%</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>`);
|
||||
// Ajax Submit
|
||||
$.ajax({
|
||||
url: '<%== url_for('/') %>',
|
||||
@@ -338,9 +337,9 @@ function fileUpload(file) {
|
||||
percent = Math.ceil(position / total * 100);
|
||||
}
|
||||
|
||||
var percentStr = ' '+percent+'%';
|
||||
var percentStr = ` ${percent}%`;
|
||||
$('#1').prop('aria-valuenow', percent);
|
||||
$('#1').css('width', percent+'%');
|
||||
$('#1').css('width', `${percent}%`);
|
||||
$('#1-text').html(percentStr);
|
||||
}, false);
|
||||
}
|
||||
@@ -350,13 +349,11 @@ function fileUpload(file) {
|
||||
success: function (data, message, xhr){
|
||||
$('#1-div').remove();
|
||||
if ($('#copy-all').length === 0 && data.success) {
|
||||
$('.messages').prepend([
|
||||
'<div class="col-xs-12 col-sm-11 col-sm-offset-1">',
|
||||
'<a id="copy-all" href="#" class="btn btn-info copy-all-to-clipboard-link">',
|
||||
'<%= l('Copy all view links to clipboard') %>',
|
||||
'</a>',
|
||||
'</div>'
|
||||
].join(''));
|
||||
$('.messages').prepend(`<div class="col-xs-12 col-sm-11 col-sm-offset-1">
|
||||
<a id="copy-all" href="#" class="btn btn-info copy-all-to-clipboard-link">
|
||||
<%= l('Copy all view links to clipboard') %>
|
||||
</a>
|
||||
</div>`);
|
||||
}
|
||||
data.msg.filename = cleanName(data.msg.filename);
|
||||
$('.messages').append(buildMessage(data.success, data.msg));
|
||||
|
||||
@@ -57,7 +57,7 @@ function onCheck(e) {
|
||||
var short = $(this).data('short');
|
||||
var ext = $(this).data('ext');
|
||||
if ($(this).is(':checked')) {
|
||||
addToShortHash(short+'.'+ext);
|
||||
addToShortHash(`${short}.${ext}`);
|
||||
addToZipHash(short);
|
||||
addToRandomHash(short);
|
||||
if (!$('#check-all').is(':checked') && isAllChecked()) {
|
||||
@@ -67,7 +67,7 @@ function onCheck(e) {
|
||||
if ($('#check-all').is(':checked')) {
|
||||
$('#check-all').prop('checked', false);
|
||||
}
|
||||
rmFromShortHash(short+'.'+ext);
|
||||
rmFromShortHash(`${short}.${ext}`);
|
||||
rmFromZipHash(short);
|
||||
rmFromRandomHash(short);
|
||||
}
|
||||
@@ -118,10 +118,10 @@ function modifyDelay() {
|
||||
success: function(data) {
|
||||
updateItem(short, parseInt(limit), del_at_view);
|
||||
var newLimit = (parseInt(limit, 10) === 0) ? '<%= l('No limit') %>' : moment.unix(limit * 86400 + created_at).locale(window.navigator.language).format('LLLL');
|
||||
$('#limit-'+short).html(newLimit);
|
||||
$('#del_at_view-'+short).html(delView(del_at_view));
|
||||
$('#edit-'+short).data('moddelay', limit);
|
||||
$('#edit-'+short).data('modfirstview', del_at_view);
|
||||
$(`#limit-${short}`).html(newLimit);
|
||||
$(`#del_at_view-${short}`).html(delView(del_at_view));
|
||||
$(`#edit-${short}`).data('moddelay', limit);
|
||||
$(`#edit-${short}`).data('modfirstview', del_at_view);
|
||||
goodToast(data.msg);
|
||||
},
|
||||
error: function() {
|
||||
@@ -157,35 +157,62 @@ function populateFilesTable() {
|
||||
$('#myfiles').empty();
|
||||
files.forEach(function(element, index, array) {
|
||||
var real_short = element.real_short;
|
||||
var vlink = link(element.short+'.'+element.ext, '');
|
||||
var vlink = link(`${element.short}.${element.ext}`, '');
|
||||
var dlink = link(real_short, 'dl', element.token, false, true);
|
||||
var limit = (element.limit === 0) ? '<%= l('No limit') %>' : moment.unix(element.limit * 86400 + element.created_at).locale(window.navigator.language).format('LLLL');
|
||||
var created_at = moment.unix(element.created_at).locale(window.navigator.language).format('LLLL');
|
||||
|
||||
var name = element.filename.replace(/</g, '<').replace(/>/g, '>');
|
||||
var tr = [
|
||||
'<tr id="alert-',real_short,'">',
|
||||
'<td><span class="checkbox"><label><input type="checkbox" class="ckbx" data-short="', element.short, '" data-ext="', element.ext, '"><label></span></td>',
|
||||
'<td class="ellips"><span title="', name,'">', name, '</span></td>',
|
||||
'<td class="text-center">',
|
||||
'<a href="',vlink,'" target="_blank"><i class="icon icon-eye"></i></a>',
|
||||
' <a href="',vlink,'" class="copy-to-clipboard" title="<%= l('Copy to clipboard') %>"><i class="icon icon-clipboard"></i></a>',
|
||||
'</td>',
|
||||
'<td id="count-',real_short,'" class="text-center"></td>',
|
||||
'<td id="del_at_view-', real_short, '" class="text-center">', delView(element.del_at_view), '</td>',
|
||||
'<td>', created_at, '</td>',
|
||||
'<td>',
|
||||
'<span id="limit-', element.real_short, '">', limit, '</span>',
|
||||
' <a href="#" id="edit-', element.real_short, '" data-modlink="', link(element.real_short, '', element.token, true), '" data-modshort="', element.real_short, '" data-modfirstview="', element.del_at_view, '" data-moddelay="', element.limit, '" data-modcreated_at="', element.created_at, '" data-modname="', name, '" title="<%= l('Modify expiration delay') %>">',
|
||||
'<i class="icon icon-edit"></i>',
|
||||
'</a>',
|
||||
'</td>',
|
||||
'<td class="text-center"><a id="del-',real_short,'" data-short="',real_short,'" data-token="',element.token,'" href="#" class="remove-link"><i class="icon icon-trash"></i></a></td>',
|
||||
'</tr>'
|
||||
].join('');
|
||||
var tr = `<tr id="alert-${real_short}">',
|
||||
<td>
|
||||
<span class="checkbox">
|
||||
<label>
|
||||
<input type="checkbox"
|
||||
class="ckbx"
|
||||
data-short="${element.short}"
|
||||
data-ext="${element.ext}">
|
||||
</label>
|
||||
</span>
|
||||
</td>
|
||||
<td class="ellips"><span title="${name}">${name}</span></td>
|
||||
<td class="text-center">
|
||||
<a href="${vlink}" target="_blank"><i class="icon icon-eye"></i></a>
|
||||
<a href="${vlink}"
|
||||
class="copy-to-clipboard"
|
||||
title="<%= l('Copy to clipboard') %>">
|
||||
<i class="icon icon-clipboard"></i>
|
||||
</a>
|
||||
</td>
|
||||
<td id="count-${real_short}" class="text-center"></td>
|
||||
<td id="del_at_view-${real_short}" class="text-center">${delView(element.del_at_view)}</td>
|
||||
<td>${created_at}</td>
|
||||
<td>
|
||||
<span id="limit-${element.real_short}">${limit}</span>
|
||||
<a href="#"
|
||||
id="edit-${element.real_short}"
|
||||
data-modlink="${link(element.real_short, '', element.token, true)}"
|
||||
data-modshort="${element.real_short}"
|
||||
data-modfirstview="${element.del_at_view}"
|
||||
data-moddelay="${element.limit}"
|
||||
data-modcreated_at="${element.created_at}"
|
||||
data-modname="${name}"
|
||||
title="<%= l('Modify expiration delay') %>">
|
||||
<i class="icon icon-edit"></i>
|
||||
</a>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<a id="del-${real_short}"
|
||||
data-short="${real_short}"
|
||||
data-token="${element.token}"
|
||||
href="#"
|
||||
class="remove-link">
|
||||
<i class="icon icon-trash"></i>
|
||||
</a>
|
||||
</td>
|
||||
</tr>`;
|
||||
$('#myfiles').append(tr);
|
||||
$('#del-'+real_short).on('click', delImage);
|
||||
$('#edit-'+real_short).on('click', editImage);
|
||||
$(`#del-${real_short}`).on('click', delImage);
|
||||
$(`#edit-${real_short}`).on('click', editImage);
|
||||
|
||||
$.ajax({
|
||||
url : '<%== url_for('counter') %>',
|
||||
@@ -197,17 +224,17 @@ function populateFilesTable() {
|
||||
success: function(data) {
|
||||
if (data.success) {
|
||||
if (data.enabled) {
|
||||
$('#count-'+real_short).text(data.counter);
|
||||
$(`#count-${real_short}`).text(data.counter);
|
||||
} else {
|
||||
delItem(real_short);
|
||||
$('#alert-'+real_short).remove();
|
||||
$(`#alert-${real_short}`).remove();
|
||||
}
|
||||
} else {
|
||||
badToast(element.filename+' '+data.msg);
|
||||
badToast(`${element.filename} ${data.msg}`);
|
||||
}
|
||||
},
|
||||
error: function() {
|
||||
badToast(element.filename+'<%= l(': Error while trying to get the counter.') %>');
|
||||
badToast(`${element.filename}<%= l(': Error while trying to get the counter.') %>`);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
@@ -78,6 +78,7 @@
|
||||
% }
|
||||
% if (current_route 'index') {
|
||||
%= javascript '/partial/lutim.js'
|
||||
%= javascript '/partial/korrigan.js'
|
||||
% }
|
||||
% if (current_route 'gallery') {
|
||||
%= javascript '/js/photoswipe.min.js'
|
||||
@@ -86,6 +87,7 @@
|
||||
%= javascript '/js/FileSaver.min.js'
|
||||
%= javascript '/partial/gallery.js'
|
||||
%= javascript '/partial/lutim.js'
|
||||
%= javascript '/partial/korrigan.js'
|
||||
% }
|
||||
% if (current_route 'myfiles') {
|
||||
%= javascript '/js/moment-with-locales.min.js'
|
||||
|
||||
131
themes/korrigan/templates/partial/korrigan.js.ep
Normal file
131
themes/korrigan/templates/partial/korrigan.js.ep
Normal file
@@ -0,0 +1,131 @@
|
||||
% # vim:set sw=4 ts=4 sts=4 ft=javascript expandtab:
|
||||
function buildMessage(success, msg) {
|
||||
if(success) {
|
||||
var s_url = link([msg.short, '.', msg.ext].join(''), '');
|
||||
var thumb = (msg.thumb !== null) ? `<div class="preview">
|
||||
<a href="${s_url}" target="_blank">
|
||||
<img class="thumbnail img-responsive" alt="${cleanName(msg.filename, true)} thumbnail" src="${msg.thumb}">
|
||||
</a>
|
||||
</div>` : '';
|
||||
return `<div class="alert alert-success" id="alert-${msg.real_short}">
|
||||
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
|
||||
<div>${thumb}
|
||||
<div>
|
||||
<h4>
|
||||
<a href="${s_url}" target="_blank">
|
||||
${msg.filename}
|
||||
</a>
|
||||
</h4>
|
||||
<form class="form">
|
||||
<div class="form-group">
|
||||
<label class="sr-only" for="view${msg.real_short}"><%= l('View link') %></label>
|
||||
<div class="input-group input-group-sm">
|
||||
<div class="input-group-btn adjust-addon">
|
||||
<a href="${s_url}" target="_blank" class="btn btn-default">
|
||||
<span class="icon icon-eye" title=" <%= l('View link') %>"></span>
|
||||
</a>
|
||||
</div>
|
||||
<input type="text" class="form-control view-link-input" id="view${msg.real_short}" value="${s_url}" readonly>
|
||||
<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">
|
||||
<span class="icon icon-clipboard"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="sr-only" for="markdown${msg.real_short}"><%= l('Markdown syntax') %></label>
|
||||
<div class="input-group input-group-sm">
|
||||
<div class="input-group-addon adjust-addon">
|
||||
<span class="markdown-mark-solid" title="<%= l('Markdown syntax') %>"></span>
|
||||
</div>
|
||||
<input type="text" class="form-control" id="markdown${msg.real_short}" value="})" readonly>
|
||||
<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">
|
||||
<span class="icon icon-clipboard"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="sr-only" for="download${msg.real_short}"><%= l('Download link') %></label>
|
||||
<div class="input-group input-group-sm">
|
||||
<div class="input-group-btn adjust-addon">
|
||||
<a href="${link(msg.short, 'dl')}" class="btn btn-default">
|
||||
<span class="icon icon-download" title="<%= l('Download link') %>"></span>
|
||||
</a>
|
||||
</div>
|
||||
<input type="text" class="form-control" id="download${msg.real_short}" value="${link(msg.short, 'dl')}" readonly>
|
||||
<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">
|
||||
<span class="icon icon-clipboard"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="sr-only" for="share${msg.real_short}"><%= l('Link for share on social networks') %></label>
|
||||
<div class="input-group input-group-sm">
|
||||
<div class="input-group-btn adjust-addon">
|
||||
<a href="${link(msg.short, 't')}" target="_blank" class="btn btn-default">
|
||||
<span class="icon icon-share" title="<%= l('Link for share on social networks') %>"></span>
|
||||
</a>
|
||||
</div>
|
||||
<input type="text" class="form-control" id="share${msg.real_short}" value="${link(msg.short, 't')}" readonly>
|
||||
<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">
|
||||
<span class="icon icon-clipboard"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="input-group">
|
||||
<span class="form-control-static">${link(msg.real_short, '', msg.token)}</span>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<form class="form col-sm-11 col-sm-offset-1" role="form" method="POST" action="${link(msg.real_short, '', msg.token, true)}">
|
||||
<div class="form-group form-inline">
|
||||
<select id="day-${msg.real_short}" name="delete-day" class="form-control">
|
||||
% my @delays = split(',', $self->config('proposed_delays'));
|
||||
% for my $delay (@delays) {
|
||||
% my $text = (defined($d->{'delay_'.$delay})) ? $d->{'delay_'.$delay} : l('%1 days', $delay);
|
||||
% if (config('max_delay')) {
|
||||
% if ($delay) {
|
||||
% if ($delay < config('max_delay')) {
|
||||
<option value="<%= $delay %>" <%== is_selected($delay) %>><%= $text %></option>
|
||||
% } elsif ($delay == config('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="<%= config('max_delay') %>" <%== is_selected(config('max_delay')) %>><%= l('%1 days', config('max_delay')) %></option>
|
||||
% last;
|
||||
% }
|
||||
% }
|
||||
% } else {
|
||||
<option value="<%= $delay %>" <%== is_selected($delay) %>><%= $text %></option>
|
||||
% }
|
||||
% }
|
||||
</select>
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<input id="first-view-${msg.real_short}" type="checkbox" name="first-view"> <%= l('Delete at first view?') %>
|
||||
</label>
|
||||
</div>
|
||||
<a href="#"
|
||||
class="btn btn-sm btn-default btn-primary modify-image"
|
||||
data-modlink="${link(msg.real_short, '', msg.token, true)}"
|
||||
data-modshort="${msg.real_short}">
|
||||
<%= l('Let\'s go!') %>
|
||||
</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>`
|
||||
} else {
|
||||
return `<div class="alert alert-danger">
|
||||
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
|
||||
<strong><%= l('Something bad happened') %></strong><br>
|
||||
${cleanName(msg.filename, false)}
|
||||
<br>
|
||||
${cleanName(msg.msg, false)}
|
||||
</div>`;
|
||||
}
|
||||
}
|
||||
@@ -1,486 +0,0 @@
|
||||
% # vim:set sw=4 ts=4 sts=4 ft=javascript expandtab:
|
||||
function selectInput() {
|
||||
$(this).select();
|
||||
}
|
||||
function cleanName(name, empty) {
|
||||
if (typeof(name) === 'undefined') {
|
||||
return name;
|
||||
}
|
||||
if (empty !== undefined && empty !== null && empty) {
|
||||
return name.replace(/&(l|g)t;/g, '').replace(/"/g, '\'');
|
||||
} else {
|
||||
return name.replace(/</g, '<').replace(/>/g, '>');
|
||||
}
|
||||
}
|
||||
function modifyImage(e) {
|
||||
e.preventDefault();
|
||||
var url = $(this).data('modlink');
|
||||
var short = $(this).data('modshort');
|
||||
modify(url, short);
|
||||
}
|
||||
function modify(url, short) {
|
||||
var limit = $('#day-'+short).val();
|
||||
var del_at_view = ($('#first-view-'+short).prop('checked')) ? 1 : 0;
|
||||
$.ajax({
|
||||
url : url,
|
||||
type : 'POST',
|
||||
data : {
|
||||
'image_url' : '<%== url_for('/')->to_abs() %>'+short,
|
||||
'format' : 'json',
|
||||
'delete-day' : limit,
|
||||
'first-view' : del_at_view
|
||||
},
|
||||
success: function(data) {
|
||||
updateItem(short, limit, del_at_view);
|
||||
goodToast(data.msg);
|
||||
},
|
||||
error: function() {
|
||||
badToast('<%= l('Error while trying to modify the image.') %>');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function buildMessage(success, msg) {
|
||||
if(success) {
|
||||
var s_url = link([msg.short, '.', msg.ext].join(''), '');
|
||||
var thumb = (msg.thumb !== null) ? [
|
||||
'<div class="preview">',
|
||||
'<a href="', s_url, '" target="_blank">',
|
||||
'<img class="thumbnail img-responsive" alt="', cleanName(msg.filename, true), ' thumbnail" src="', msg.thumb, '">',
|
||||
'</a>',
|
||||
'</div>'
|
||||
].join('') : ''
|
||||
return [
|
||||
'<div class="alert alert-success" id="alert-', msg.real_short, '">',
|
||||
'<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>',
|
||||
'<div>', thumb,
|
||||
'<div>',
|
||||
'<h4>',
|
||||
'<a href="', s_url, '" target="_blank">',
|
||||
msg.filename,
|
||||
'</a>',
|
||||
'</h4>',
|
||||
'<form class="form">',
|
||||
'<div class="form-group">',
|
||||
'<label class="sr-only" for="view', msg.real_short, '"><%= l('View link') %></label>',
|
||||
'<div class="input-group input-group-sm">',
|
||||
'<div class="input-group-btn adjust-addon">',
|
||||
'<a href="', s_url, '" target="_blank" class="btn btn-default">',
|
||||
'<span class="icon icon-eye" title=" <%= l('View link') %>"></span>',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'<input type="text" class="form-control view-link-input" id="view', msg.real_short, '" value="', s_url, '" readonly>',
|
||||
'<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">',
|
||||
'<span class="icon icon-clipboard"></span>',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'<div class="form-group">',
|
||||
'<label class="sr-only" for="markdown', msg.real_short, '"><%= l('Markdown syntax') %></label>',
|
||||
'<div class="input-group input-group-sm">',
|
||||
'<div class="input-group-addon adjust-addon">',
|
||||
'<span class="markdown-mark-solid" title="<%= l('Markdown syntax') %>"></span>',
|
||||
'</div>',
|
||||
'<input type="text" class="form-control" id="markdown', msg.real_short, '" value=", ')" readonly>',
|
||||
'<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">',
|
||||
'<span class="icon icon-clipboard"></span>',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'<div class="form-group">',
|
||||
'<label class="sr-only" for="download', msg.real_short, '"><%= l('Download link') %></label>',
|
||||
'<div class="input-group input-group-sm">',
|
||||
'<div class="input-group-btn adjust-addon">',
|
||||
'<a href="', link(msg.short, 'dl'), '" class="btn btn-default">',
|
||||
'<span class="icon icon-download" title="<%= l('Download link') %>"></span>',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'<input type="text" class="form-control" id="download', msg.real_short, '" value="', link(msg.short, 'dl'), '" readonly>',
|
||||
'<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">',
|
||||
'<span class="icon icon-clipboard"></span>',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'<div class="form-group">',
|
||||
'<label class="sr-only" for="share', msg.real_short, '"><%= l('Link for share on social networks') %></label>',
|
||||
'<div class="input-group input-group-sm">',
|
||||
'<div class="input-group-btn adjust-addon">',
|
||||
'<a href="', link(msg.short, 't'), '" target="_blank" class="btn btn-default">',
|
||||
'<span class="icon icon-share" title="<%= l('Link for share on social networks') %>"></span>',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'<input type="text" class="form-control" id="share', msg.real_short, '" value="', link(msg.short, 't'), '" readonly>',
|
||||
'<a href="#" class="input-group-addon copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">',
|
||||
'<span class="icon icon-clipboard"></span>',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'<div class="form-group">',
|
||||
'<div class="input-group">',
|
||||
'<span class="form-control-static">', link(msg.real_short, '', msg.token), '</span>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'</form>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'<div class="row">',
|
||||
'<form class="form col-sm-11 col-sm-offset-1" role="form" method="POST" action="', link(msg.real_short, '', msg.token, true), '">',
|
||||
'<div class="form-group form-inline">',
|
||||
'<select id="day-', msg.real_short, '" name="delete-day" class="form-control">',
|
||||
% my @delays = split(',', $self->config('proposed_delays'));
|
||||
% for my $delay (@delays) {
|
||||
% my $text = (defined($d->{'delay_'.$delay})) ? $d->{'delay_'.$delay} : l('%1 days', $delay);
|
||||
% if (config('max_delay')) {
|
||||
% if ($delay) {
|
||||
% if ($delay < config('max_delay')) {
|
||||
'<option value="<%= $delay %>" <%== is_selected($delay) %>><%= $text %></option>',
|
||||
% } elsif ($delay == config('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="<%= config('max_delay') %>" <%== is_selected(config('max_delay')) %>><%= l('%1 days', config('max_delay')) %></option>',
|
||||
% last;
|
||||
% }
|
||||
% }
|
||||
% } else {
|
||||
'<option value="<%= $delay %>" <%== is_selected($delay) %>><%= $text %></option>',
|
||||
% }
|
||||
% }
|
||||
'</select> ',
|
||||
'<div class="checkbox">',
|
||||
'<label>',
|
||||
'<input id="first-view-', msg.real_short, '" type="checkbox" name="first-view"> <%= l('Delete at first view?') %>',
|
||||
'</label>',
|
||||
'</div> ',
|
||||
'<a href="#" class="btn btn-sm btn-default btn-primary modify-image" data-modlink="', link(msg.real_short, '', msg.token, true),'" data-modshort="', msg.real_short,'">',
|
||||
'<%= l('Let\'s go!') %>',
|
||||
'</a>',
|
||||
'</div>',
|
||||
'</form>',
|
||||
'</div>',
|
||||
'</div>'
|
||||
].join('');
|
||||
} else {
|
||||
return [
|
||||
'<div class="alert alert-danger">',
|
||||
'<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>',
|
||||
'<strong><%= l('Something bad happened') %></strong><br>',
|
||||
cleanName(msg.filename, false),
|
||||
'<br>',
|
||||
cleanName(msg.msg, false),
|
||||
'</div>'
|
||||
].join('');
|
||||
}
|
||||
}
|
||||
function bindddz(firstview, deleteday) {
|
||||
$('#drag-and-drop-zone').dmUploader({
|
||||
url: '<%== url_for('/') %>',
|
||||
dataType: 'json',
|
||||
allowedTypes: 'image/*',
|
||||
maxFileSize: <%= config('max_file_size') %>,
|
||||
onNewFile: function(id, file){
|
||||
$('.messages').append([
|
||||
'<div id="', id, '-div">',
|
||||
cleanName(file.name), '<br>',
|
||||
'<div class="progress">',
|
||||
'<div id="', id, '"class="progress-bar progress-striped active width-zero" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">',
|
||||
'<span id="', id, '-text" class="pull-left pdg-left-10"> 0%</span>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'</div>'
|
||||
].join(''));
|
||||
},
|
||||
onUploadProgress: function(id, percent){
|
||||
var percentStr = ' '+percent+'%';
|
||||
$('#'+id).prop('aria-valuenow', percent);
|
||||
$('#'+id).css('width', percent+'%');
|
||||
$('#'+id+'-text').html(percentStr);
|
||||
},
|
||||
onUploadSuccess: function(id, data){
|
||||
data.msg.filename = cleanName(data.msg.filename);
|
||||
$('#'+id+'-div').remove();
|
||||
if ($('#copy-all').length === 0 && data.success) {
|
||||
$('.messages').prepend([
|
||||
'<div class="col-xs-12 col-sm-11 col-sm-offset-1">',
|
||||
'<a id="copy-all" href="#" class="btn btn-info copy-all-to-clipboard-link">',
|
||||
'<%= l('Copy all view links to clipboard') %>',
|
||||
'</a>',
|
||||
'</div>'
|
||||
].join(''));
|
||||
}
|
||||
$('.messages').append(buildMessage(data.success, data.msg));
|
||||
$('#del-'+data.msg.real_short).on('click', function(e) {
|
||||
e.preventDefault();
|
||||
rmFromShortHash(data.msg.short+'.'+data.msg.ext)
|
||||
rmFromZipHash(data.msg.short);
|
||||
rmFromRandomHash(data.msg.short);
|
||||
});
|
||||
$('#del-'+data.msg.real_short).on('click', delImage);
|
||||
if (data.success) {
|
||||
addToShortHash(data.msg.short+'.'+data.msg.ext);
|
||||
addToZipHash(data.msg.short);
|
||||
addToRandomHash(data.msg.short);
|
||||
$('.close').unbind('click', evaluateCopyAll);
|
||||
$('.close').on('click', evaluateCopyAll);
|
||||
$('input[type=\'text\']').unbind("click", selectInput);
|
||||
$('input[type=\'text\']').on("click", selectInput);
|
||||
$('.copy-all-to-clipboard-link').unbind('click', copyAllToClipboard);
|
||||
$('.copy-all-to-clipboard-link').on('click', copyAllToClipboard);
|
||||
$('.modify-image').unbind('click', modifyImage);
|
||||
$('.modify-image').on('click', modifyImage);
|
||||
$('.copy-to-clipboard-link').unbind('click', clickOnCopyLink);
|
||||
$('.copy-to-clipboard-link').on('click', clickOnCopyLink);
|
||||
addItem(data.msg);
|
||||
}
|
||||
},
|
||||
onUploadError: function(id, message){
|
||||
$('.messages').append(buildMessage(false, ''));
|
||||
},
|
||||
onFileSizeError: function(file){
|
||||
$('.messages').append(buildMessage(false, { filename: file.name, msg: '<%= l('The file exceed the size limit (%1)', config('max_file_size')) %>'}));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function upload_url(e) {
|
||||
e.preventDefault();
|
||||
var val = $('#lutim-file-url').val();
|
||||
if (val !== undefined && val !== '') {
|
||||
$('#lutim-file-url').prop('disabled', 'disabled');
|
||||
$('.hidden-spin').css('display', 'block');
|
||||
$.ajax({
|
||||
url : '<%== url_for('/') %>',
|
||||
type : 'POST',
|
||||
data : {
|
||||
'lutim-file-url' : val,
|
||||
'format' : 'json',
|
||||
'first-view' : ($('#first-view').prop('checked')) ? 1 : 0,
|
||||
'crypt' : ($('#crypt').prop('checked')) ? 1 : 0,
|
||||
'delete-day' : $('#delete-day').val()
|
||||
},
|
||||
success: function(data) {
|
||||
data.msg.filename = cleanName(data.msg.filename);
|
||||
$('.messages').append(buildMessage(data.success, data.msg));
|
||||
if (data.success) {
|
||||
if ($('#copy-all').length === 0) {
|
||||
$('.messages').prepend([
|
||||
'<div class="col-xs-12 col-sm-11 col-sm-offset-1">',
|
||||
'<a id="copy-all" href="#" class="btn btn-info copy-all-to-clipboard-link">',
|
||||
'<%= l('Copy all view links to clipboard') %>',
|
||||
'</a>',
|
||||
'</div>'
|
||||
].join(''));
|
||||
}
|
||||
$('#lutim-file-url').val('');
|
||||
addToShortHash(data.msg.short+'.'+data.msg.ext);
|
||||
addToZipHash(data.msg.short);
|
||||
addToRandomHash(data.msg.short);
|
||||
$('#del-'+data.msg.real_short).on('click', delImage);
|
||||
$('.close').unbind('click', evaluateCopyAll);
|
||||
$('.close').on('click', evaluateCopyAll);
|
||||
addItem(data.msg);
|
||||
}
|
||||
},
|
||||
error: function() {
|
||||
$('.messages').append(buildMessage(false, ''));
|
||||
},
|
||||
complete: function() {
|
||||
$('#lutim-file-url').prop('disabled', '');
|
||||
$('.hidden-spin').css('display', 'none');
|
||||
$('.copy-all-to-clipboard-link').unbind('click', copyAllToClipboard);
|
||||
$('.copy-all-to-clipboard-link').on('click', copyAllToClipboard);
|
||||
$('.modify-image').unbind('click', modifyImage);
|
||||
$('.modify-image').on('click', modifyImage);
|
||||
$('.copy-to-clipboard-link').unbind('click', clickOnCopyLink);
|
||||
$('.copy-to-clipboard-link').on('click', clickOnCopyLink);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function fileUpload(file) {
|
||||
var fd = new FormData();
|
||||
fd.append('file', file);
|
||||
|
||||
fd.append('format', 'json');
|
||||
fd.append('first-view', ($('#first-view').prop('checked')) ? 1 : 0);
|
||||
fd.append('crypt', ($('#crypt').prop('checked')) ? 1 : 0);
|
||||
fd.append('delete-day', ($('#delete-day').val()));
|
||||
|
||||
$('.messages').append([
|
||||
'<div id="1-div">', cleanName(file.name), '<br>',
|
||||
'<div class="progress">',
|
||||
'<div id="1" class="progress-bar progress-striped active width-zero" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">',
|
||||
'<span id="1-text" class="pull-left pdg-left-10"> 0%</span>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'</div>'
|
||||
].join(''));
|
||||
// Ajax Submit
|
||||
$.ajax({
|
||||
url: '<%== url_for('/') %>',
|
||||
type: 'POST',
|
||||
dataType: 'json',
|
||||
data: fd,
|
||||
cache: false,
|
||||
contentType: false,
|
||||
processData: false,
|
||||
forceSync: false,
|
||||
xhr: function(){
|
||||
var xhrobj = $.ajaxSettings.xhr();
|
||||
if(xhrobj.upload){
|
||||
xhrobj.upload.addEventListener('progress', function(event) {
|
||||
var percent = 0;
|
||||
var position = event.loaded || event.position;
|
||||
var total = event.total || e.totalSize;
|
||||
if(event.lengthComputable){
|
||||
percent = Math.ceil(position / total * 100);
|
||||
}
|
||||
|
||||
var percentStr = ' '+percent+'%';
|
||||
$('#1').prop('aria-valuenow', percent);
|
||||
$('#1').css('width', percent+'%');
|
||||
$('#1-text').html(percentStr);
|
||||
}, false);
|
||||
}
|
||||
|
||||
return xhrobj;
|
||||
},
|
||||
success: function (data, message, xhr){
|
||||
$('#1-div').remove();
|
||||
if ($('#copy-all').length === 0 && data.success) {
|
||||
$('.messages').prepend([
|
||||
'<div class="col-xs-12 col-sm-11 col-sm-offset-1">',
|
||||
'<a id="copy-all" href="#" class="btn btn-info copy-all-to-clipboard-link">',
|
||||
'<%= l('Copy all view links to clipboard') %>',
|
||||
'</a>',
|
||||
'</div>'
|
||||
].join(''));
|
||||
}
|
||||
data.msg.filename = cleanName(data.msg.filename);
|
||||
$('.messages').append(buildMessage(data.success, data.msg));
|
||||
if (data.success) {
|
||||
$('.close').unbind('click', evaluateCopyAll);
|
||||
$('.close').on('click', evaluateCopyAll);
|
||||
addItem(data.msg);
|
||||
}
|
||||
},
|
||||
error: function (xhr, status, errMsg){
|
||||
$('.messages').append(buildMessage(false, ''));
|
||||
},
|
||||
complete: function () {
|
||||
$('.copy-all-to-clipboard-link').unbind('click', copyAllToClipboard);
|
||||
$('.copy-all-to-clipboard-link').on('click', copyAllToClipboard);
|
||||
$('.modify-image').unbind('click', modifyImage);
|
||||
$('.modify-image').on('click', modifyImage);
|
||||
$('.copy-to-clipboard-link').unbind('click', clickOnCopyLink);
|
||||
$('.copy-to-clipboard-link').on('click', clickOnCopyLink);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function initPaste() {
|
||||
/*
|
||||
actually FF and Chrome doesn't handle paste events the same way...
|
||||
for ff we need to create a editable div and register an event to it.
|
||||
When user paste, the image is "really" pasted in the div. Then, we need to iterate throught
|
||||
the div childs to get images. Previsouly FF didn't have the paste event so it was esay to figure on wich browser we were.
|
||||
But firefox now have a paste event so I test it...
|
||||
|
||||
on Chrome the file object is directlyt in the clipboard.
|
||||
*/
|
||||
var b = 'FF';
|
||||
try {
|
||||
//FF
|
||||
var cbe = new ClipboardEvent('hop');
|
||||
} catch(hop) {
|
||||
//under webkkit Clipboard doesn't have arguments...
|
||||
b = 'WK'
|
||||
}
|
||||
if (b === 'FF') {
|
||||
var pasteDiv = document.createElement('div');
|
||||
pasteDiv.addEventListener('paste', onPasteFF);
|
||||
pasteDiv.setAttribute('class', 'pasteZone');
|
||||
pasteDiv.setAttribute('contenteditable', true);
|
||||
|
||||
document.getElementsByTagName('body')[0].appendChild(pasteDiv);
|
||||
pasteDiv.focus();
|
||||
|
||||
document.addEventListener('click', function(event) {
|
||||
var t = $(event.target);
|
||||
|
||||
switch (t[0].nodeName.toUpperCase()) {
|
||||
case 'A':
|
||||
case 'BUTTON':
|
||||
case 'INPUT':
|
||||
case 'SELECT':
|
||||
case 'SPAN':
|
||||
case 'LABEL':
|
||||
break;
|
||||
default:
|
||||
if (t[0].parentNode.nodeName.toUpperCase() !== 'SELECT') {
|
||||
pasteDiv.focus();
|
||||
}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
document.addEventListener('paste', onPaste);
|
||||
}
|
||||
}
|
||||
|
||||
function waitforpastedata(elem, savedcontent) {
|
||||
if (elem.childNodes && elem.childNodes.length > 0) {
|
||||
processpaste(elem, savedcontent);
|
||||
} else {
|
||||
var that = {
|
||||
e: elem,
|
||||
s: savedcontent
|
||||
};
|
||||
that.callself = function () {
|
||||
waitforpastedata(that.e, that.s);
|
||||
}
|
||||
setTimeout(that.callself, 20);
|
||||
}
|
||||
}
|
||||
|
||||
function processpaste(elem, savedcontent) {
|
||||
var pasteZone = document.getElementsByClassName('pasteZone')[0];
|
||||
var f = new Image();
|
||||
|
||||
f.onload = function(){
|
||||
var canvas = document.createElement('canvas');
|
||||
canvas.width = f.width;
|
||||
canvas.height = f.height;
|
||||
|
||||
var ctx = canvas.getContext('2d');
|
||||
ctx.drawImage(f, 0, 0, canvas.width, canvas.height);
|
||||
|
||||
canvas.toBlob(function(blob) {
|
||||
var url = window.URL.createObjectURL(blob);
|
||||
fileUpload(blob);
|
||||
});
|
||||
}
|
||||
|
||||
f.src = pasteZone.childNodes[0].src;
|
||||
|
||||
pasteZone.innerHTML = '';
|
||||
}
|
||||
|
||||
function onPasteFF(e) {
|
||||
var pasteZone = document.getElementsByClassName('pasteZone')[0];
|
||||
waitforpastedata(pasteZone, 'savedcontent');
|
||||
}
|
||||
|
||||
function onPaste(e) {
|
||||
var items = e.clipboardData.items;
|
||||
for(var i = 0; i < items.length; i++) {
|
||||
var item = items[i];
|
||||
if (/image/.test(item.type)) {
|
||||
var file = item.getAsFile();
|
||||
fileUpload(file);
|
||||
} else {
|
||||
//not image..
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user