mirror of
https://framagit.org/fiat-tux/hat-softwares/lutim.git
synced 2026-03-28 17:42:54 +01:00
Add korrigan theme
This commit is contained in:
nicofrand
2
.gitignore
vendored
2
.gitignore
vendored
@@ -15,6 +15,8 @@ themes/default/templates/data.html.ep
|
||||
themes/default/templates/raw.html.ep
|
||||
themes/default/templates/stats.json.ep
|
||||
themes/default/templates/partial/raw.js.ep
|
||||
!themes/korrigan
|
||||
!themes/korrigan/*
|
||||
tmp/*
|
||||
.zanata-cache/*
|
||||
cover_db/*
|
||||
|
||||
2
themes/korrigan/.gitignore
vendored
Normal file
2
themes/korrigan/.gitignore
vendored
Normal file
@@ -0,0 +1,2 @@
|
||||
public/packed/
|
||||
templates/data.html.ep
|
||||
35
themes/korrigan/Makefile
Normal file
35
themes/korrigan/Makefile
Normal file
@@ -0,0 +1,35 @@
|
||||
EN=lib/Lutim/I18N/en.po
|
||||
FR=lib/Lutim/I18N/fr.po
|
||||
DE=lib/Lutim/I18N/de.po
|
||||
ES=lib/Lutim/I18N/es.po
|
||||
OC=lib/Lutim/I18N/oc.po
|
||||
AR=lib/Lutim/I18N/ar.po
|
||||
SEDOPTS=-e "s@SOME DESCRIPTIVE TITLE@Lutim language file@" \
|
||||
-e "s@YEAR THE PACKAGE'S COPYRIGHT HOLDER@2015 Luc Didry@" \
|
||||
-e "s@CHARSET@utf8@" \
|
||||
-e "s@the PACKAGE package@the Lutim package@" \
|
||||
-e '/^\#\. (/{N;/\n\#\. (/{N;/\n.*\.\.\/default\//{s/\#\..*\n.*\#\./\#. (/g}}}' \
|
||||
-e '/^\#\. (/{N;/\n.*\.\.\/default\//{s/\n/ /}}'
|
||||
SEDOPTS2=-e '/^\#.*\.\.\/default\//,+3d'
|
||||
XGETTEXT=carton exec ../../local/bin/xgettext.pl
|
||||
CARTON=carton exec
|
||||
|
||||
locales:
|
||||
$(XGETTEXT) -D templates -D ../default/templates -o $(EN) 2>/dev/null
|
||||
$(XGETTEXT) -D templates -D ../default/templates -o $(FR) 2>/dev/null
|
||||
$(XGETTEXT) -D templates -D ../default/templates -o $(DE) 2>/dev/null
|
||||
$(XGETTEXT) -D templates -D ../default/templates -o $(ES) 2>/dev/null
|
||||
$(XGETTEXT) -D templates -D ../default/templates -o $(OC) 2>/dev/null
|
||||
$(XGETTEXT) -D templates -D ../default/templates -o $(AR) 2>/dev/null
|
||||
sed $(SEDOPTS) -i $(EN)
|
||||
sed $(SEDOPTS2) -i $(EN)
|
||||
sed $(SEDOPTS) -i $(FR)
|
||||
sed $(SEDOPTS2) -i $(FR)
|
||||
sed $(SEDOPTS) -i $(DE)
|
||||
sed $(SEDOPTS2) -i $(DE)
|
||||
sed $(SEDOPTS) -i $(ES)
|
||||
sed $(SEDOPTS2) -i $(ES)
|
||||
sed $(SEDOPTS) -i $(OC)
|
||||
sed $(SEDOPTS) -i $(OC)
|
||||
sed $(SEDOPTS2) -i $(AR)
|
||||
sed $(SEDOPTS2) -i $(AR)
|
||||
17
themes/korrigan/Readme.md
Normal file
17
themes/korrigan/Readme.md
Normal file
@@ -0,0 +1,17 @@
|
||||
I know there is a lot to work on but this fits my needs for now and don't have much time to rework the theme from beginning.
|
||||
|
||||
Feel free to open a merge request for improvements.
|
||||
|
||||
|
||||
|
||||
# Credits:
|
||||
|
||||
* Triskel image comes from https://upload.wikimedia.org/wikipedia/commons/0/07/Triskele-Symbol-spiral-five-thirds-turns.svg
|
||||
|
||||
# License:
|
||||
|
||||
[MIT](https://opensource.org/licenses/MIT)
|
||||
|
||||
# Author:
|
||||
|
||||
[nicofrand](https://nicofrand.eu) ([Twitter](https://twitter.com/@nicofrand), [Mastodon](https://mastodon.social/@nicofrand))
|
||||
22
themes/korrigan/lib/Lutim/I18N.pm
Normal file
22
themes/korrigan/lib/Lutim/I18N.pm
Normal file
@@ -0,0 +1,22 @@
|
||||
# vim:set sw=4 ts=4 sts=4 ft=perl expandtab:
|
||||
package Lutim::I18N;
|
||||
|
||||
use base 'Locale::Maketext';
|
||||
use File::Basename qw/dirname/;
|
||||
use Locale::Maketext::Lexicon {
|
||||
_auto => 1,
|
||||
_decode => 1,
|
||||
_style => 'gettext',
|
||||
'*' => [
|
||||
Gettext => dirname(__FILE__) . '/I18N/*.po',
|
||||
Gettext => $app_dir . 'themes/default/lib/Lutim/I18N/*.po',
|
||||
]
|
||||
};
|
||||
|
||||
use vars qw($app_dir);
|
||||
BEGIN {
|
||||
use Cwd;
|
||||
my $app_dir = getcwd;
|
||||
}
|
||||
|
||||
1;
|
||||
BIN
themes/korrigan/preview.png
Normal file
BIN
themes/korrigan/preview.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 156 KiB |
178
themes/korrigan/public/css/korrigan.css
Normal file
178
themes/korrigan/public/css/korrigan.css
Normal file
@@ -0,0 +1,178 @@
|
||||
|
||||
/* Yeched'mad CSS */
|
||||
:root {
|
||||
--theme-blue: #0060DF;
|
||||
--theme-blue-hover: #45A1FF;
|
||||
}
|
||||
|
||||
body {
|
||||
position: relative;
|
||||
background-color: #EEEEEE;
|
||||
|
||||
background-size: cover;
|
||||
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
body::before,
|
||||
body::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
body::before {
|
||||
background-size: cover;
|
||||
background-image: url("../img/background.svg");
|
||||
}
|
||||
|
||||
body::after {
|
||||
background: linear-gradient(to bottom, rgba(255, 255, 255, 0.75) 4em, transparent 4em);
|
||||
}
|
||||
|
||||
body .navbar-default {
|
||||
background-color: transparent;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
body .navbar-default .open > a,
|
||||
body .navbar-default .open > a:focus,
|
||||
body .navbar-default .open > a:hover,
|
||||
body .navbar-default .open > a:active {
|
||||
background-color: rgba(11, 103, 183, 0.5);
|
||||
}
|
||||
|
||||
body > .container {
|
||||
flex-grow: 1;
|
||||
background-color: #FFFFFF;
|
||||
padding: 3em;
|
||||
border-radius: 5px;
|
||||
box-shadow: 1px 1px 5px #333333;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 1.15em;
|
||||
|
||||
/* SVG coming from https://upload.wikimedia.org/wikipedia/commons/0/07/Triskele-Symbol-spiral-five-thirds-turns.svg */
|
||||
background-image: url('../img/triskel.svg');
|
||||
background-size: 500px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: -125px calc(100% + 150px);
|
||||
}
|
||||
|
||||
body > .container .upload-info {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
body > .container::before,
|
||||
body > .container::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body.index > .container > * {
|
||||
background-color: rgba(255, 255, 255, 0.8);
|
||||
width: calc(50% - 2em);
|
||||
border-bottom-left-radius: inherit;
|
||||
border-bottom-right-radius: inherit;
|
||||
}
|
||||
|
||||
body .logo {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body .header {
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
|
||||
body .hennypenny {
|
||||
color: var(--theme-blue);
|
||||
margin-top: 0;
|
||||
font-family: sans-serif;
|
||||
}
|
||||
|
||||
body label {
|
||||
font-weight: normal;
|
||||
display: block;
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
body input[type='checkbox'] {
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
appearance: none;
|
||||
|
||||
position: static;
|
||||
margin: 0;
|
||||
cursor: pointer;
|
||||
vertical-align: middle;
|
||||
display: inline-flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
|
||||
background-color: #555555;
|
||||
width: 3rem;
|
||||
height: 1.5rem;
|
||||
margin-top: 0.25em;
|
||||
margin-bottom: 0.25em;
|
||||
border: none;
|
||||
border-radius: 1em;
|
||||
}
|
||||
|
||||
body input[type='checkbox']:checked {
|
||||
color: #FFFFFF;
|
||||
background-color: var(--theme-blue);
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
body input[type='checkbox']::after {
|
||||
content: '';
|
||||
margin: 0 0.15rem;
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
border-radius: 50%;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
body .uploader-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
body .uploader {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
flex-grow: 1;
|
||||
border: 2px dashed #DDDDDD;
|
||||
border-radius: 5px;
|
||||
color: #6F7986;
|
||||
}
|
||||
|
||||
body .uploader:hover {
|
||||
background-color: #FDFEFF;
|
||||
}
|
||||
|
||||
body .uploader div.browser label {
|
||||
background-color: var(--theme-blue);
|
||||
}
|
||||
|
||||
body .uploader-container form .label {
|
||||
display: block;
|
||||
}
|
||||
|
||||
body .btn {
|
||||
background-color: var(--theme-blue);
|
||||
color: white;
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
body .btn:hover,
|
||||
body .btn:focus,
|
||||
body .btn:active {
|
||||
background-color: var(--theme-blue-hover);
|
||||
}
|
||||
1
themes/korrigan/public/img/background.svg
Normal file
1
themes/korrigan/public/img/background.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 39 KiB |
63
themes/korrigan/public/img/triskel.svg
Normal file
63
themes/korrigan/public/img/triskel.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 12 KiB |
251
themes/korrigan/templates/index.html.ep
Normal file
251
themes/korrigan/templates/index.html.ep
Normal file
@@ -0,0 +1,251 @@
|
||||
% # vim:set sw=4 ts=4 sts=4 ft=html.epl expandtab:
|
||||
% my %d = (
|
||||
% delay_0 => l('no time limit'),
|
||||
% delay_1 => l('24 hours'),
|
||||
% delay_365 => l('1 year')
|
||||
% );
|
||||
|
||||
<div id="gallery-url" class="hidden row">
|
||||
<form class="form col-sm-12">
|
||||
<div class="form-group">
|
||||
<label for="gallery-url-input"><%= l('Gallery link') %></label>
|
||||
<div class="input-group">
|
||||
<a class="input-group-addon" id="gallery-url-link" href="#" target="_blank" title="<%= l('Gallery link') %>">
|
||||
<span class="icon icon-picture"></span>
|
||||
</a>
|
||||
<input class="form-control" name="gallery-url-input" type="text" id="gallery-url-input" readonly></input>
|
||||
<a href="#" class="input-group-addon jsonly copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">
|
||||
<span class="icon icon-clipboard"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div id="zip-url" class="hidden row">
|
||||
<form class="form col-sm-12">
|
||||
<div class="form-group">
|
||||
<label for="zip-url-input"><%= l('Download zip link') %></label>
|
||||
<div class="input-group">
|
||||
<a class="input-group-addon" id="zip-url-link" href="#" target="_blank" title="<%= l('Download zip link') %>">
|
||||
<span class="icon icon-file-archive"></span>
|
||||
</a>
|
||||
<input class="form-control" name="zip-url-input" type="text" id="zip-url-input" readonly></input>
|
||||
<a href="#" class="input-group-addon jsonly copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">
|
||||
<span class="icon icon-clipboard"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div id="random-url" class="hidden row">
|
||||
<form class="form col-sm-12">
|
||||
<div class="form-group">
|
||||
<label for="random-url-input"><%= l('Random image link') %></label>
|
||||
<div class="input-group">
|
||||
<a class="input-group-addon" id="random-url-link" href="#" target="_blank" title="<%= l('Random image link') %>">
|
||||
<span class="icon icon-shuffle"></span>
|
||||
</a>
|
||||
<input class="form-control" name="random-url-input" type="text" id="random-url-input" readonly></input>
|
||||
<a href="#" class="input-group-addon jsonly copy-to-clipboard-link" title="<%= l('Copy to clipboard') %>">
|
||||
<span class="icon icon-clipboard"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="messages">
|
||||
% if (config('always_encrypt')) {
|
||||
<p><%= l('The images are encrypted on the server (Lutim does not keep the key).') %></p>
|
||||
% }
|
||||
% if (defined(stash('short'))) {
|
||||
% my $url = url_for('/'.stash('short'))->to_abs();
|
||||
<div class="alert alert-success">
|
||||
<div>
|
||||
% if (defined(stash('thumb'))) {
|
||||
<div class="preview">
|
||||
<a href="<%= $url.'.'.stash('ext') %>" target="_blank"><img class="thumbnail img-responsive" alt="<%= stash('filename') %> thumbnail" src="<%= stash('thumb') %>"></a>
|
||||
</div>
|
||||
% }
|
||||
<div>
|
||||
% # Display image informations
|
||||
<h4>
|
||||
<a href="<%= $url.'.'.stash('ext') %>" target="_blank"><%= stash('filename') %></a>
|
||||
<a title="<%= l('Tweet it!') %>" target="_blank" href="https://twitter.com/share?url=<%= $url %>?t"><span class="icon icon-twitter"></span></a>
|
||||
</h4>
|
||||
% my $delete_url = url_for('delete', {short => stash('real_short'), token => stash('token')})->to_abs();
|
||||
<form class="form">
|
||||
<div class="form-group">
|
||||
<label class="sr-only" for="view"><%= l('View link') %></label>
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon"><a href="<%= $url.'.'.stash('ext') %>" target="_blank"><span class="icon icon-eye" title =" <%= l('View link') %>"></span></a></div>
|
||||
<input type="text" class="form-control" id="view" value="<%= $url.'.'.stash('ext') %>" readonly>
|
||||
<a href="#" class="input-group-addon jsonly 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"><%= l('Markdown syntax') %></label>
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon"><span class="markdown-mark-solid" title ="<%= l('Markdown syntax') %>"></span></div>
|
||||
<input type="text" class="form-control" id="markdown" value="" readonly>
|
||||
<a href="#" class="input-group-addon jsonly 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"><%= l('Download link') %></label>
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon"><a href="<%= $url %>?dl"><span class="icon icon-download" title ="<%= l('Download link') %>"></span></a></div>
|
||||
<input type="text" class="form-control" id="download" value="<%= $url %>?dl" readonly>
|
||||
<a href="#" class="input-group-addon jsonly 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"><%= l('Link for share on social networks') %></label>
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon"><a href="<%= $url %>?t" target="_blank"><span class="icon icon-share" title ="<%= l('Link for share on social networks') %>"></span></a></div>
|
||||
<input type="text" class="form-control" id="share" value="<%= $url %>?t" readonly>
|
||||
<a href="#" class="input-group-addon jsonly 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_to $delete_url => ( class => "btn btn-default col-xs-12 text-left", title => l('Deletion link') ) => begin %><span class="icon icon-trash"></span> <%= $delete_url %> <%= end %></span>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
% # Delay modification form
|
||||
% my $modify_url = url_for('modify', {short => stash('real_short'), token => stash('token')})->to_abs();
|
||||
<form class="form col-sm-11 col-sm-offset-1" method="POST" action="<%== $modify_url %>">
|
||||
<div class="form-group form-inline">
|
||||
<input name="image_url" type="hidden" value="<%= $url %>">
|
||||
<select name="delete-day" class="form-control">
|
||||
%= include 'partial/for_my_delay', d => \%d
|
||||
</select>
|
||||
<div class="">
|
||||
<label>
|
||||
<input type="checkbox" name="first-view"> <%= l('Delete at first view?') %>
|
||||
</label>
|
||||
</div>
|
||||
<%= submit_button l('Let\'s go!'), class => 'btn btn-sm btn-default btn-primary', id => 'submitmodbutton' %>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
% }
|
||||
% if (defined(flash('success'))) {
|
||||
<div class="alert alert-success">
|
||||
<button type="button" class="close jsonly" data-dismiss="alert" aria-hidden="true">×</button>
|
||||
<p><%== flash('success') %></p>
|
||||
</div>
|
||||
% }
|
||||
% if (defined(flash('msg'))) {
|
||||
<div class="alert alert-danger">
|
||||
<button type="button" class="close jsonly" data-dismiss="alert" aria-hidden="true">×</button>
|
||||
<strong><%= l('Something bad happened') %></strong><br>
|
||||
<%= flash('filename') %> <%= flash('msg') %>
|
||||
</div>
|
||||
% }
|
||||
</div>
|
||||
|
||||
<noscript>
|
||||
<form class="form" method="POST" action="<%= url_for('/') %>" enctype="multipart/form-data">
|
||||
<div class="form-group form-inline">
|
||||
<select name="delete-day" class="form-control">
|
||||
%= include 'partial/for_my_delay', d => \%d
|
||||
</select>
|
||||
<div class="">
|
||||
<label>
|
||||
<input type="checkbox" name="first-view"> <%= l('Delete at first view?') %>
|
||||
</label>
|
||||
<label <%== (config('always_encrypt')) ? 'class="always-encrypt"' : '' %>>
|
||||
<input type="checkbox" name="crypt"> <%= l('Encrypt the image (Lutim does not keep the key).') %>
|
||||
</label>
|
||||
<label>
|
||||
<input type="checkbox" name="keep-exif"> <%= l('Keep EXIF tags') %>
|
||||
</label>
|
||||
</div>
|
||||
% if ($c->config('watermark_path') && $c->config('watermark_enforce') eq 'none') {
|
||||
<select name="watermark" class="form-control">
|
||||
<option value="tiling" <%== is_wm_selected('tiling') %>>
|
||||
<%= l('Tiling watermark') %>
|
||||
</option>
|
||||
<option value="single" <%== is_wm_selected('single') %>>
|
||||
<%= l('Single watermark') %>
|
||||
</option>
|
||||
<option value="none" <%== is_wm_selected('none') %>>
|
||||
<%= l('No watermark') %>
|
||||
</option>
|
||||
</select>
|
||||
% }
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="lutim-file"><%= l('Send an image') %></label>
|
||||
<input type="file" name="file" id="lutim-file" accept="image/*">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="lutim-file-url"><%= l('Upload an image with its URL') %></label>
|
||||
<input type="url" name="lutim-file-url" placeholder="<%= l('Image URL') %>">
|
||||
</div>
|
||||
<p class="help-block"><%= l('Only images are allowed') %></p>
|
||||
<%= submit_button l('Let\'s go!'), class => 'btn btn-default btn-primary', id => 'submitbutton' %>
|
||||
</form>
|
||||
</noscript>
|
||||
|
||||
<!-- D&D Zone-->
|
||||
<div class="jsonly">
|
||||
<select id="delete-day" class="form-control">
|
||||
%= include 'partial/for_my_delay', d => \%d
|
||||
</select>
|
||||
<div class="">
|
||||
<label>
|
||||
<input type="checkbox" id="first-view"> <%= l('Delete at first view?') %>
|
||||
</label>
|
||||
<label <%== (config('always_encrypt')) ? 'class="always-encrypt"' : '' %>>
|
||||
<input type="checkbox" id="crypt"> <%= l('Encrypt the image (Lutim does not keep the key).') %>
|
||||
</label>
|
||||
<label>
|
||||
<input type="checkbox" id="keep-exif"> <%= l('Keep EXIF tags') %>
|
||||
</label>
|
||||
</div>
|
||||
% if ($c->config('watermark_path') && $c->config('watermark_enforce') eq 'none') {
|
||||
<select id="watermark" class="form-control">
|
||||
<option value="tiling" <%== is_wm_selected('tiling') %>>
|
||||
<%= l('Tiling watermark') %>
|
||||
</option>
|
||||
<option value="single" <%== is_wm_selected('single') %>>
|
||||
<%= l('Single watermark') %>
|
||||
</option>
|
||||
<option value="none" <%== is_wm_selected('none') %>>
|
||||
<%= l('No watermark') %>
|
||||
</option>
|
||||
</select>
|
||||
% }
|
||||
</div>
|
||||
</div><!-- Warning: beings in default.html.ep -->
|
||||
|
||||
<div class="jsonly uploader-container">
|
||||
<div id="drag-and-drop-zone" class="uploader">
|
||||
<div><%= l('Drag & drop images here') %></div>
|
||||
<div class="or"><%= l('-or-') %></div>
|
||||
<div class="browser">
|
||||
<label class="btn">
|
||||
<span><%= l('Click to open the file browser') %></span>
|
||||
<input type="file" name="files[]" multiple="multiple" title='<%= l('Click to open the file browser') %>' accept="image/*">
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<p class="help-block"><%= l('Only images are allowed') %></p>
|
||||
<form class="form-horizontal" method="POST" action="<%== url_for('add') %>">
|
||||
<p>
|
||||
<span class="hidden-spin spin"> <span class="icon-spinner animate-spin pull-right"></span></span>
|
||||
<label for="lutim-file-url"><%= l('Upload an image with its URL') %></label>
|
||||
|
||||
<input type="url" name="lutim-file-url" class="form-control" id="lutim-file-url" placeholder="<%= l('Image URL') %>">
|
||||
</p>
|
||||
<a href="#" class="btn pull-right" id="file-url-button"><%= l('Let\'s go!') %></a>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /D&D Zone -->
|
||||
98
themes/korrigan/templates/layouts/default.html.ep
Normal file
98
themes/korrigan/templates/layouts/default.html.ep
Normal file
@@ -0,0 +1,98 @@
|
||||
% # vim:set sw=4 ts=4 sts=4 ft=html.epl expandtab:
|
||||
% use Mojo::Util qw(url_escape);
|
||||
% my $twitter_url = 'https://twitter.com/share';
|
||||
% my $url = url_for('/')->to_abs();
|
||||
% $twitter_url .= '?url='.url_escape("$url")
|
||||
% .'&text=Check out this %23Lutim instance! ';
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Lutim</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta charset="utf-8" />
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black">
|
||||
<link rel="icon" type="image/png" href="<%= url_for('/img/favicon.png') %>">
|
||||
<link rel="icon" sizes="128x128" href="<%= url_for('/img/lutim128.png') %>">
|
||||
<link rel="icon" sizes="196x196" href="<%= url_for('/img/lutim196.png') %>">
|
||||
<link rel="apple-touch-icon" href="<%= url_for('/img/lutim60.png') %>">
|
||||
<link rel="apple-touch-icon" sizes="76x76" href="<%= url_for('/img/lutim76.png') %>">
|
||||
<link rel="apple-touch-icon" sizes="120x120" href="<%= url_for('/img/lutim120.png') %>">
|
||||
<link rel="apple-touch-icon" sizes="152x152" href="<%= url_for('/img/lutim152.png') %>">
|
||||
<link rel="apple-touch-icon-precomposed" sizes="128x128" href="<%= url_for('/img/lutim128.png') %>">
|
||||
%= stylesheet '/css/common.min.css'
|
||||
% if (current_route 'stats') {
|
||||
%= stylesheet '/css/morris-0.5.1.min.css'
|
||||
% } else {
|
||||
%= stylesheet '/css/not_stats.min.css'
|
||||
% }
|
||||
% if (current_route 'gallery') {
|
||||
%= stylesheet '/css/gallery.min.css'
|
||||
% }
|
||||
%= stylesheet '/css/korrigan.css'
|
||||
</head>
|
||||
<body class="<%== current_route %>">
|
||||
%= include 'partial/navbar', twitter_url => $twitter_url
|
||||
<div class="container">
|
||||
<div class="upload-info"><!-- Warning: ends in index.html.ep -->
|
||||
<div>
|
||||
% if (defined(config('hosted_by'))) {
|
||||
<div class="pull-right">
|
||||
<%== config('hosted_by') %>
|
||||
</div>
|
||||
% }
|
||||
<div class="header">
|
||||
<div class="pull-left hidden-xs logo">
|
||||
<img src="<%= url_for('/img/Lutim_small.png') %>" alt="Lutim logo" width="57" height="75">
|
||||
</div>
|
||||
<a class="link_nocol" href="<%= url_for('/') %>" title="<%= l('Homepage') %>"><h1 class="hennypenny">Let's Upload That Image!</h1></a>
|
||||
</div>
|
||||
</div>
|
||||
% if (defined(config('broadcast_message'))) {
|
||||
<div class="alert alert-info">
|
||||
<strong><%== config('broadcast_message') %></strong>
|
||||
</div>
|
||||
% }
|
||||
% if (defined(stash('stop_upload'))) {
|
||||
<div class="alert alert-danger">
|
||||
<strong><%= stash('stop_upload') %></strong>
|
||||
</div>
|
||||
% }
|
||||
<%= content %>
|
||||
</div>
|
||||
% if (defined(config('piwik_img'))) {
|
||||
<img src="<%== config('piwik_img') %>" class="border-zero" alt="">
|
||||
% }
|
||||
%= javascript '/js/jquery-3.2.1.min.js'
|
||||
%= javascript '/partial/manifest.js'
|
||||
%= javascript '/js/toastify.js'
|
||||
%= javascript '/js/bootstrap.min.js'
|
||||
%= javascript '/partial/common.js'
|
||||
% if (current_route 'stats') {
|
||||
%= javascript '/js/lutim.js'
|
||||
%= javascript '/js/raphael-min.js'
|
||||
%= javascript '/js/morris-0.5.1.min.js'
|
||||
%= javascript '/js/stats.js'
|
||||
%= javascript '/partial/raw.js'
|
||||
% } elsif (!(current_route 'about')) {
|
||||
%= javascript '/js/lutim.js'
|
||||
%= javascript '/js/dmuploader.min.js'
|
||||
% }
|
||||
% if (current_route 'index') {
|
||||
%= javascript '/partial/lutim.js'
|
||||
% }
|
||||
% if (current_route 'gallery') {
|
||||
%= javascript '/js/photoswipe.min.js'
|
||||
%= javascript '/js/photoswipe-ui-default.min.js'
|
||||
%= javascript '/js/jszip.min.js'
|
||||
%= javascript '/js/FileSaver.min.js'
|
||||
%= javascript '/partial/gallery.js'
|
||||
%= javascript '/partial/lutim.js'
|
||||
% }
|
||||
% if (current_route 'myfiles') {
|
||||
%= javascript '/js/moment-with-locales.min.js'
|
||||
%= javascript '/partial/myfiles.js'
|
||||
% }
|
||||
</body>
|
||||
</html>
|
||||
494
themes/korrigan/templates/partial/lutim.js.ep
Normal file
494
themes/korrigan/templates/partial/lutim.js.ep
Normal file
@@ -0,0 +1,494 @@
|
||||
% # 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 tw_url(url) {
|
||||
return btn = [
|
||||
'<a title="<%= l('Tweet it!') %>" target="_blank" href="https://twitter.com/share?url=<%== url_for('/')->to_abs() %>', url, '?t" class="btn btn-default">',
|
||||
'<span class="icon icon-twitter"></span>',
|
||||
'</a>'
|
||||
].join('');
|
||||
}
|
||||
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>',
|
||||
tw_url(msg.short),
|
||||
'</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