Verified Commit 3eb8db12 authored by Luc Didry's avatar Luc Didry
Browse files

Fix #48 No more scroll to top on click + add notifications to actions

parent dd9dc7bd
......@@ -160,3 +160,16 @@ cover:
script:
- make cover
coverage: '/Total .*\d+\.\d+$/'
### Push new translations strings to https://trad.framasoft.org
##
#
trads:
stage: cover
image: framasoft/push-trad:latest
script:
- sed -e 's#<project-version>.*</project-version>#<project-version>development</project-version>#' -i zanata.xml
- if [ ! -z ${ZANATA_CONFIG+x} ]; then mkdir -p ${HOME}/.config; echo -e "${ZANATA_CONFIG}" > ${HOME}/.config/zanata.ini; fi
- if [ ! -z ${ZANATA_CONFIG+x} ]; then make push-locales; fi
only:
- development
......@@ -5,6 +5,12 @@ CARTON=carton exec
LUTIM=script/lutim
REAL_LUTIM=script/application
minify:
@echo "CSS concatenation"
@cd ./themes/default/public/css/ && cat bootstrap.min.css fontello.css hennypenny.css lutim.css toastify.css | csso > common.min.css
@cd ./themes/default/public/css/ && cat animation.css uploader.css markdown.css | csso > not_stats.min.css
@cd ./themes/default/public/css/ && cat photoswipe.css default-skin/default-skin.css | csso > gallery.min.css
locales:
$(XGETTEXT) $(EXTRACTDIR) -o $(POT) 2>/dev/null
......@@ -34,7 +40,7 @@ test: podcheck test-sqlite test-pg
clean:
rm -rf lutim.db files/
dev:
dev: minify
$(CARTON) morbo $(LUTIM) --listen http://0.0.0.0:3000 --watch lib/ --watch script/ --watch themes/ --watch lutim.conf
devlog:
......
......@@ -106,7 +106,7 @@ sub startup {
$self->plugin('GzipStatic');
# Cache static files
$self->plugin('StaticCache');
$self->plugin('StaticCache' => { even_in_dev => 1 });
# Helpers
$self->plugin('Lutim::Plugin::Helpers');
......
......@@ -70,7 +70,7 @@ sub startup {
$self->plugin('GzipStatic');
# Cache static files
$self->plugin('StaticCache');
$self->plugin('StaticCache' => { even_in_dev => 1 });
# Helpers
$self->plugin('Lutim::Plugin::Helpers');
......
......@@ -76,11 +76,15 @@ msgstr ""
msgid "Contributors"
msgstr ""
#: themes/default/templates/partial/lutim.js.ep:218 themes/default/templates/partial/lutim.js.ep:272 themes/default/templates/partial/lutim.js.ep:350
#: themes/default/templates/partial/common.js.ep:96
msgid "Copied to clipboard"
msgstr ""
#: themes/default/templates/partial/lutim.js.ep:218 themes/default/templates/partial/lutim.js.ep:273 themes/default/templates/partial/lutim.js.ep:351
msgid "Copy all view links to clipboard"
msgstr ""
#: themes/default/templates/index.html.ep:18 themes/default/templates/index.html.ep:36 themes/default/templates/index.html.ep:69 themes/default/templates/index.html.ep:77 themes/default/templates/index.html.ep:85 themes/default/templates/index.html.ep:93 themes/default/templates/myfiles.html.ep:20 themes/default/templates/myfiles.html.ep:38 themes/default/templates/partial/common.js.ep:150 themes/default/templates/partial/lutim.js.ep:108 themes/default/templates/partial/lutim.js.ep:123 themes/default/templates/partial/lutim.js.ep:82 themes/default/templates/partial/lutim.js.ep:94
#: themes/default/templates/index.html.ep:18 themes/default/templates/index.html.ep:36 themes/default/templates/index.html.ep:69 themes/default/templates/index.html.ep:77 themes/default/templates/index.html.ep:85 themes/default/templates/index.html.ep:93 themes/default/templates/myfiles.html.ep:20 themes/default/templates/myfiles.html.ep:38 themes/default/templates/partial/common.js.ep:177 themes/default/templates/partial/lutim.js.ep:108 themes/default/templates/partial/lutim.js.ep:123 themes/default/templates/partial/lutim.js.ep:82 themes/default/templates/partial/lutim.js.ep:94
msgid "Copy to clipboard"
msgstr ""
......@@ -108,7 +112,7 @@ msgstr ""
msgid "Deleted images in 30 days"
msgstr ""
#: themes/default/templates/index.html.ep:98 themes/default/templates/myfiles.html.ep:56 themes/default/templates/partial/common.js.ep:142 themes/default/templates/partial/common.js.ep:145
#: themes/default/templates/index.html.ep:98 themes/default/templates/myfiles.html.ep:56 themes/default/templates/partial/common.js.ep:169 themes/default/templates/partial/common.js.ep:172
msgid "Deletion link"
msgstr ""
......@@ -164,11 +168,11 @@ msgstr ""
msgid "Gallery link"
msgstr ""
#: themes/default/templates/partial/common.js.ep:104 themes/default/templates/partial/common.js.ep:87
#: themes/default/templates/partial/common.js.ep:105 themes/default/templates/partial/common.js.ep:122
msgid "Hit Ctrl+C, then Enter to copy the short link"
msgstr ""
#: themes/default/templates/layouts/default.html.ep:54
#: themes/default/templates/layouts/default.html.ep:48
msgid "Homepage"
msgstr ""
......@@ -196,6 +200,10 @@ msgstr ""
msgid "Image delay"
msgstr ""
#: themes/default/templates/partial/common.js.ep:142
msgid "Image deleted"
msgstr ""
#: lib/Lutim/Controller.pm:752
msgid "Image not found."
msgstr ""
......@@ -362,7 +370,7 @@ msgstr ""
#. ($tx->res->max_message_size)
#. ($c->req->max_message_size)
#. (config('max_file_size')
#: lib/Lutim/Controller.pm:309 lib/Lutim/Controller.pm:378 themes/default/templates/partial/lutim.js.ep:244
#: lib/Lutim/Controller.pm:309 lib/Lutim/Controller.pm:378 themes/default/templates/partial/lutim.js.ep:245
msgid "The file exceed the size limit (%1)"
msgstr ""
......@@ -413,6 +421,10 @@ msgstr ""
msgid "Tweet it!"
msgstr ""
#: themes/default/templates/partial/common.js.ep:85
msgid "Unable to copy to clipboard"
msgstr ""
#. ($short)
#: lib/Lutim/Controller.pm:106 lib/Lutim/Controller.pm:200 lib/Lutim/Controller.pm:271
msgid "Unable to find the image %1."
......
This diff is collapsed.
/*! PhotoSwipe main CSS by Dmitry Semenov | photoswipe.com | MIT license */
.pswp{display:none;position:absolute;width:100%;height:100%;left:0;top:0;overflow:hidden;-ms-touch-action:none;touch-action:none;z-index:1500;-webkit-text-size-adjust:100%;-webkit-backface-visibility:hidden;outline:0}.pswp *{-webkit-box-sizing:border-box;box-sizing:border-box}.pswp img{max-width:none}.pswp--animate_opacity{opacity:.001;will-change:opacity;-webkit-transition:opacity 333ms cubic-bezier(.4,0,.22,1);transition:opacity 333ms cubic-bezier(.4,0,.22,1)}.pswp--open{display:block}.pswp--zoom-allowed .pswp__img{cursor:-webkit-zoom-in;cursor:-moz-zoom-in;cursor:zoom-in}.pswp--zoomed-in .pswp__img{cursor:-webkit-grab;cursor:-moz-grab;cursor:grab}.pswp--dragging .pswp__img{cursor:-webkit-grabbing;cursor:-moz-grabbing;cursor:grabbing}.pswp__bg,.pswp__scroll-wrap{position:absolute;left:0;top:0;width:100%;height:100%}.pswp__bg{background:#000;opacity:0;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-backface-visibility:hidden}.pswp__scroll-wrap{overflow:hidden}.pswp__container{position:absolute}.pswp__container,.pswp__zoom-wrap{-ms-touch-action:none;touch-action:none;left:0;right:0;top:0;bottom:0}.pswp__container,.pswp__img{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}.pswp__zoom-wrap{position:absolute;width:100%;-webkit-transform-origin:left top;-ms-transform-origin:left top;transform-origin:left top;-webkit-transition:-webkit-transform 333ms cubic-bezier(.4,0,.22,1);transition:transform 333ms cubic-bezier(.4,0,.22,1)}.pswp__bg{will-change:opacity;-webkit-transition:opacity 333ms cubic-bezier(.4,0,.22,1);transition:opacity 333ms cubic-bezier(.4,0,.22,1)}.pswp--animated-in .pswp__bg,.pswp--animated-in .pswp__zoom-wrap{-webkit-transition:none;transition:none}.pswp__container,.pswp__zoom-wrap{-webkit-backface-visibility:hidden}.pswp__img,.pswp__item{position:absolute;top:0;left:0}.pswp__item{right:0;bottom:0;overflow:hidden}.pswp__img{width:auto;height:auto}.pswp__img--placeholder{-webkit-backface-visibility:hidden}.pswp__img--placeholder--blank{background:#222}.pswp--ie .pswp__img{width:100%!important;height:auto!important;left:0;top:0}.pswp__error-msg{position:absolute;left:0;top:50%;width:100%;text-align:center;font-size:14px;line-height:16px;margin-top:-8px;color:#ccc}.pswp__error-msg a{color:#ccc;text-decoration:underline}
/*! PhotoSwipe Default UI CSS by Dmitry Semenov | photoswipe.com | MIT license */
@-webkit-keyframes clockwise{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes clockwise{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes donut-rotate{0%,to{-webkit-transform:rotate(0);transform:rotate(0)}50%{-webkit-transform:rotate(-140deg);transform:rotate(-140deg)}}@keyframes donut-rotate{0%,to{-webkit-transform:rotate(0);transform:rotate(0)}50%{-webkit-transform:rotate(-140deg);transform:rotate(-140deg)}}.pswp__button{position:relative;background:0 0;cursor:pointer;overflow:visible;-webkit-appearance:none;display:block;border:0;padding:0;margin:0;float:right;opacity:.75;-webkit-transition:opacity .2s;transition:opacity .2s;-webkit-box-shadow:none;box-shadow:none}.pswp__button:focus,.pswp__button:hover{opacity:1}.pswp__button:active{outline:0;opacity:.9}.pswp__button::-moz-focus-inner{padding:0;border:0}.pswp__ui--over-close .pswp__button--close{opacity:1}.pswp__button,.pswp__button--arrow--left:before,.pswp__button--arrow--right:before{background:url(default-skin.png) 0 0 no-repeat;background-size:264px 88px;width:44px;height:44px}.pswp__button--arrow--left:before,.pswp__button--arrow--right:before{content:'';top:35px;background-color:rgba(0,0,0,.3);height:30px;width:32px;position:absolute}@media (-webkit-min-device-pixel-ratio:1.1),(-webkit-min-device-pixel-ratio:1.09375),(min-resolution:105dpi),(min-resolution:1.1dppx){.pswp--svg .pswp__button,.pswp--svg .pswp__button--arrow--left:before,.pswp--svg .pswp__button--arrow--right:before{background-image:url(default-skin.svg)}.pswp--svg .pswp__button--arrow--left,.pswp--svg .pswp__button--arrow--right{background:0 0}}.pswp__button--close{background-position:0 -44px}.pswp__button--share{background-position:-44px -44px}.pswp__button--fs{display:none}.pswp--supports-fs .pswp__button--fs{display:block}.pswp--fs .pswp__button--fs{background-position:-44px 0}.pswp__button--zoom{display:none;background-position:-88px 0}.pswp--zoom-allowed .pswp__button--zoom{display:block}.pswp--zoomed-in .pswp__button--zoom{background-position:-132px 0}.pswp--touch .pswp__button--arrow--left,.pswp--touch .pswp__button--arrow--right{visibility:hidden}.pswp__button--arrow--left,.pswp__button--arrow--right{background:0 0;top:50%;margin-top:-50px;width:70px;height:100px;position:absolute}.pswp__button--arrow--left{left:0}.pswp__button--arrow--right{right:0}.pswp__button--arrow--left:before{left:6px;background-position:-138px -44px}.pswp__button--arrow--right:before{right:6px;background-position:-94px -44px}.pswp__counter,.pswp__share-modal{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.pswp__share-modal{display:block;background:rgba(0,0,0,.5);width:100%;height:100%;top:0;left:0;padding:10px;position:absolute;z-index:1600;opacity:0;-webkit-transition:opacity .25s ease-out;transition:opacity .25s ease-out;-webkit-backface-visibility:hidden;will-change:opacity}.pswp__share-modal--hidden{display:none}.pswp__share-tooltip{z-index:1620;position:absolute;background:#fff;top:56px;border-radius:2px;display:block;width:auto;right:44px;-webkit-box-shadow:0 2px 5px rgba(0,0,0,.25);box-shadow:0 2px 5px rgba(0,0,0,.25);-webkit-transform:translateY(6px);-ms-transform:translateY(6px);transform:translateY(6px);-webkit-transition:-webkit-transform .25s;transition:transform .25s;-webkit-backface-visibility:hidden;will-change:transform}.pswp__share-tooltip a{display:block;padding:8px 12px;font-size:14px;line-height:18px}.pswp__share-tooltip a,.pswp__share-tooltip a:hover{text-decoration:none;color:#000}.pswp__share-tooltip a:first-child{border-radius:2px 2px 0 0}.pswp__share-tooltip a:last-child{border-radius:0 0 2px 2px}.pswp__share-modal--fade-in{opacity:1}.pswp__share-modal--fade-in .pswp__share-tooltip{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}.pswp--touch .pswp__share-tooltip a{padding:16px 12px}a.pswp__share--facebook:before{content:'';display:block;width:0;height:0;position:absolute;top:-12px;right:15px;border:6px solid transparent;border-bottom-color:#fff;-webkit-pointer-events:none;-moz-pointer-events:none;pointer-events:none}a.pswp__share--facebook:hover{background:#3e5c9a;color:#fff}a.pswp__share--facebook:hover:before{border-bottom-color:#3e5c9a}a.pswp__share--twitter:hover{background:#55acee;color:#fff}a.pswp__share--pinterest:hover{background:#ccc;color:#ce272d}a.pswp__share--download:hover{background:#ddd}.pswp__counter{position:absolute;left:0;top:0;height:44px;font-size:13px;line-height:44px;color:#fff;opacity:.75;padding:0 10px}.pswp__caption{position:absolute;left:0;bottom:0;width:100%;min-height:44px}.pswp__caption small{font-size:11px;color:#bbb}.pswp__caption__center{text-align:left;max-width:420px;margin:0 auto;font-size:13px;padding:10px;line-height:20px;color:#ccc}.pswp__caption--empty{display:none}.pswp__caption--fake{visibility:hidden}.pswp__preloader{width:44px;height:44px;position:absolute;top:0;left:50%;margin-left:-22px;opacity:0;-webkit-transition:opacity .25s ease-out;transition:opacity .25s ease-out;will-change:opacity;direction:ltr}.pswp__preloader__icn{width:20px;height:20px;margin:12px}.pswp__preloader--active .pswp__preloader__icn{background:url(preloader.gif) 0 0 no-repeat}.pswp--css_animation .pswp__preloader--active,.pswp__preloader--active{opacity:1}.pswp--css_animation .pswp__preloader--active .pswp__preloader__icn{-webkit-animation:clockwise 500ms linear infinite;animation:clockwise 500ms linear infinite}.pswp--css_animation .pswp__preloader--active .pswp__preloader__donut{-webkit-animation:donut-rotate 1000ms cubic-bezier(.4,0,.22,1) infinite;animation:donut-rotate 1000ms cubic-bezier(.4,0,.22,1) infinite}.pswp--css_animation .pswp__preloader__icn{background:0 0;opacity:.75;width:14px;height:14px;position:absolute;left:15px;top:15px;margin:0}.pswp--css_animation .pswp__preloader__cut{position:relative;width:7px;height:14px;overflow:hidden}.pswp--css_animation .pswp__preloader__donut{-webkit-box-sizing:border-box;box-sizing:border-box;width:14px;height:14px;border:2px solid #fff;border-radius:50%;border-left-color:transparent;border-bottom-color:transparent;position:absolute;top:0;left:0;background:0 0;margin:0}@media screen and (max-width:1024px){.pswp__preloader{position:relative;left:auto;top:auto;margin:0;float:right}}.pswp__ui{-webkit-font-smoothing:auto;visibility:visible;opacity:1;z-index:1550}.pswp__top-bar{position:absolute;left:0;top:0;height:44px;width:100%}.pswp--has_mouse .pswp__button--arrow--left,.pswp--has_mouse .pswp__button--arrow--right,.pswp__caption,.pswp__top-bar{-webkit-backface-visibility:hidden;will-change:opacity;-webkit-transition:opacity 333ms cubic-bezier(.4,0,.22,1);transition:opacity 333ms cubic-bezier(.4,0,.22,1)}.pswp--has_mouse .pswp__button--arrow--left,.pswp--has_mouse .pswp__button--arrow--right{visibility:visible}.pswp__caption,.pswp__top-bar{background-color:rgba(0,0,0,.5)}.pswp__ui--fit .pswp__caption,.pswp__ui--fit .pswp__top-bar{background-color:rgba(0,0,0,.3)}.pswp__ui--idle .pswp__button--arrow--left,.pswp__ui--idle .pswp__button--arrow--right,.pswp__ui--idle .pswp__top-bar{opacity:0}.pswp__ui--hidden .pswp__button--arrow--left,.pswp__ui--hidden .pswp__button--arrow--right,.pswp__ui--hidden .pswp__caption,.pswp__ui--hidden .pswp__top-bar{opacity:.001}.pswp__ui--one-slide .pswp__button--arrow--left,.pswp__ui--one-slide .pswp__button--arrow--right,.pswp__ui--one-slide .pswp__counter{display:none}.pswp__element--disabled{display:none!important}.pswp--minimal--dark .pswp__top-bar{background:0 0}
@-moz-keyframes spin{0%{-moz-transform:rotate(0deg);-o-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-moz-transform:rotate(359deg);-o-transform:rotate(359deg);-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@-webkit-keyframes spin{0%{-moz-transform:rotate(0deg);-o-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-moz-transform:rotate(359deg);-o-transform:rotate(359deg);-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@-o-keyframes spin{0%{-moz-transform:rotate(0deg);-o-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-moz-transform:rotate(359deg);-o-transform:rotate(359deg);-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@-ms-keyframes spin{0%{-moz-transform:rotate(0deg);-o-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-moz-transform:rotate(359deg);-o-transform:rotate(359deg);-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes spin{0%{-moz-transform:rotate(0deg);-o-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-moz-transform:rotate(359deg);-o-transform:rotate(359deg);-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.animate-spin{-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;-webkit-animation:spin 2s infinite linear;animation:spin 2s infinite linear;display:inline-block}.uploader{border:2px dotted #a5a5c7;width:100%;color:#92aab0;text-align:center;vertical-align:middle;padding:30px 0;margin-bottom:10px;font-size:200%;cursor:default;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.uploader div.or{font-size:50%;font-weight:700;color:silver;padding:10px}@media (max-width:768px){.uploader div.browser label{max-width:95%}}@media (min-width:768px){.uploader div.browser label{width:300px}}.uploader div.browser label{background-color:#5a7bc2;color:#fff;padding:6px 0;font-size:40%;font-weight:700;cursor:pointer;border-radius:2px;position:relative;overflow:hidden;display:block;margin:20px auto 0;box-shadow:2px 2px 2px #888}.uploader div.browser span{cursor:pointer}.uploader div.browser input{position:absolute;top:0;right:0;margin:0;border:solid transparent;border-width:0 0 100px 200px;opacity:0;filter:alpha(opacity= 0);-o-transform:translate(250px,-50px) scale(1);-moz-transform:translate(-300px,0) scale(4);direction:ltr;cursor:pointer}.uploader div.browser label:hover{background-color:#427fed}@font-face{font-family:'markdown';src:url(../../font/markdown.eot?-6fnbp5);src:url(../../font/markdown.eot?#iefix-6fnbp5) format('embedded-opentype'),url(../../font/markdown.woff?-6fnbp5) format('woff'),url(../../font/markdown.ttf?-6fnbp5) format('truetype'),url(../../font/markdown.svg?-6fnbp5#markdown) format('svg');font-weight:400;font-style:normal}[class*=" markdown-"],[class^=markdown-]{font-family:'markdown';speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.markdown-mark:before{content:"\e600"}.markdown-mark-solid:before{content:"\e601"}
/*!
* Toastify js 1.2.0
* https://github.com/apvarun/toastify-js
* @license MIT licensed
*
* Copyright (C) 2018 Varun A P
*/
.toastify {
padding: 12px 20px;
color: #ffffff;
display: inline-block;
box-shadow: 0 3px 6px -1px rgba(0, 0, 0, 0.12), 0 10px 36px -4px rgba(77, 96, 232, 0.3);
background: -webkit-linear-gradient(315deg, #73a5ff, #5477f5);
background: linear-gradient(135deg, #73a5ff, #5477f5);
position: fixed;
opacity: 0;
transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
border-radius: 2px;
cursor: pointer;
text-decoration: none;
max-width: calc(50% - 20px);
}
.toastify.on {
opacity: 1;
}
.toast-close {
opacity: 0.4;
padding: 0 5px;
}
.right {
right: 15px;
}
.left {
left: 15px;
}
.top {
top: -150px;
}
.bottom {
bottom: -150px;
}
.rounded {
border-radius: 25px;
}
.avatar{
width: 1.5em;
height: 1.5em;
margin: 0 5px;
border-radius: 2px;
}
@media only screen and (max-width: 360px){
.right, .left{
margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
max-width: fit-content;
}
}
......@@ -50,7 +50,10 @@ function share(url) {
}
});
}
function evaluateCopyAll() {
function evaluateCopyAll(e) {
if (e) {
e.preventDefault();
}
setTimeout(function() {
if ($('.view-link-input').length === 0) {
$('#copy-all').parent().remove();
......
/*!
* Toastify js 1.2.0
* https://github.com/apvarun/toastify-js
* @license MIT licensed
*
* Copyright (C) 2018 Varun A P
*/
;
(function (root, factory) {
if(typeof module === "object" && module.exports) {
require('./toastify.css');
module.exports = factory();
} else {
root.Toastify = factory();
}
}(this, function (global) {
// Object initialization
var Toastify = function (options) {
// Returning a new init object
return new Toastify.lib.init(options);
},
// Library version
version = "1.2.0";
// Defining the prototype of the object
Toastify.lib = Toastify.prototype = {
toastify: version,
constructor: Toastify,
// Initializing the object with required parameters
init: function (options) {
// Verifying and validating the input object
if (!options) {
options = {};
}
// Creating the options object
this.options = {};
// Validating the options
this.options.text = options.text || 'Hi there!'; // Display message
this.options.duration = options.duration || 3000; // Display duration
this.options.selector = options.selector; // Parent selector
this.options.callback = options.callback || function () { }; // Callback after display
this.options.destination = options.destination; // On-click destination
this.options.newWindow = options.newWindow || false; // Open destination in new window
this.options.close = options.close || false; // Show toast close icon
this.options.gravity = (options.gravity == "bottom") ? "bottom" : "top"; // toast position - top or bottom
this.options.positionLeft = options.positionLeft || false; // toast position - left or right
this.options.backgroundColor = options.backgroundColor || "linear-gradient(135deg, #73a5ff, #5477f5)"; // toast position - left or right
this.options.avatar = options.avatar || ""; // toast position - left or right
// Returning the current object for chaining functions
return this;
},
// Building the DOM element
buildToast: function () {
// Validating if the options are defined
if (!this.options) {
throw "Toastify is not initialized";
}
// Creating the DOM object
var divElement = document.createElement("div");
divElement.className = 'toastify on';
// Positioning toast to left or right
if (this.options.positionLeft === true) {
divElement.className += " left";
} else {
divElement.className += " right";
}
// Assigning gravity of element
divElement.className += " " + this.options.gravity;
divElement.style.background = this.options.backgroundColor;
// Adding the toast message
divElement.innerHTML = this.options.text;
if (this.options.avatar !== "") {
var avatarElement = document.createElement("img");
avatarElement.src = this.options.avatar;
avatarElement.className = "avatar";
if (this.options.positionLeft === true) {
// Adding close icon on the left of content
divElement.appendChild(avatarElement);
} else {
// Adding close icon on the right of content
divElement.insertAdjacentElement('beforeend', avatarElement);
}
}
// Adding a close icon to the toast
if (this.options.close === true) {
// Create a span for close element
var closeElement = document.createElement("span");
closeElement.innerHTML = "&#10006;";
closeElement.className = 'toast-close';
// Triggering the removal of toast from DOM on close click
closeElement.addEventListener('click', function (event) {
event.stopPropagation();
this.removeElement(event.target.parentElement);
window.clearTimeout(event.target.parentElement.timeOutValue);
}.bind(this));
//Calculating screen width
var width = (window.innerWidth > 0) ? window.innerWidth : screen.width;
// Adding the close icon to the toast element
// Display on the right if screen width is less than or equal to 360px
if (this.options.positionLeft === true && width > 360) {
// Adding close icon on the left of content
divElement.insertAdjacentElement('afterbegin', closeElement);
} else {
// Adding close icon on the right of content
divElement.appendChild(closeElement);
}
}
// Adding an on-click destination path
if (typeof this.options.destination !== 'undefined') {
divElement.addEventListener('click', function (event) {
event.stopPropagation();
if(this.options.newWindow === true){
window.open(this.options.destination, '_blank')
} else {
window.location = this.options.destination;
}
}.bind(this));
}
// Returning the generated element
return divElement;
},
// Displaying the toast
showToast: function () {
// Creating the DOM object for the toast
var toastElement = this.buildToast();
// Getting the root element to with the toast needs to be added
var rootElement;
if (typeof this.options.selector === "undefined") {
rootElement = document.body;
} else {
rootElement = document.getElementById(this.options.selector);
}
// Validating if root element is present in DOM
if (!rootElement) {
throw "Root element is not defined";
}
// Adding the DOM element
rootElement.insertBefore(toastElement, rootElement.firstChild);
// Repositioning the toasts in case multiple toasts are present
Toastify.reposition();
toastElement.timeOutValue = window.setTimeout(function () {
// Remove the toast from DOM
this.removeElement(toastElement);
}.bind(this), this.options.duration); // Binding `this` for function invocation
// Supporting function chaining
return this;
},
// Removing the element from the DOM
removeElement: function (toastElement) {
// Hiding the element
// toastElement.classList.remove("on");
toastElement.className = toastElement.className.replace(" on","");
// Removing the element from DOM after transition end
window.setTimeout(function () {
// Remove the elemenf from the DOM
toastElement.parentNode.removeChild(toastElement);
// Calling the callback function
this.options.callback.call(toastElement);
// Repositioning the toasts again
Toastify.reposition();
}.bind(this), 400); // Binding `this` for function invocation
}
}
// Positioning the toasts on the DOM
Toastify.reposition = function () {
// Top margins with gravity
var topLeftOffsetSize = {
top: 15,
bottom: 15
};
var topRightOffsetSize = {
top: 15,
bottom: 15
};
var offsetSize = {
top: 15,
bottom: 15
};
// Get all toast messages on the DOM
var allToasts = document.getElementsByClassName('toastify');
var classUsed;
// Modifying the position of each toast element
for (var i = 0; i < allToasts.length; i++) {
// Getting the applied gravity
if (containsClass(allToasts[i], 'top') === true) {
classUsed = "top";
} else {
classUsed = "bottom";
}
var height = allToasts[i].offsetHeight;
// Spacing between toasts
var offset = 15;
var width = (window.innerWidth > 0) ? window.innerWidth : screen.width;
// Show toast in center if screen with less than or qual to 360px
if (width <= 360) {
// Setting the position
allToasts[i].style[classUsed] = offsetSize[classUsed] + 'px';
offsetSize[classUsed] += height + offset;
} else {
if (containsClass(allToasts[i], 'left') === true) {
// Setting the position
allToasts[i].style[classUsed] = topLeftOffsetSize[classUsed] + 'px';
topLeftOffsetSize[classUsed] += height + offset;
} else {
// Setting the position
allToasts[i].style[classUsed] = topRightOffsetSize[classUsed] + 'px';
topRightOffsetSize[classUsed] += height + offset;
}
}
}
// Supporting function chaining
return this;
}
function containsClass(elem, yourClass) {
if(!elem || typeof yourClass !== 'string') {
return false;
} else if(elem.className && elem.className.trim().split(/\s+/gi).indexOf(yourClass) > -1) {
return true;
} else {
return false;
}
}
// Setting up the prototype for the init object
Toastify.lib.init.prototype = Toastify.lib;
// Returning the Toastify function to be assigned to the window object/module
return Toastify;
}));
\ No newline at end of file
......@@ -21,20 +21,14 @@
<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/bootstrap.min.css'
%= stylesheet '/css/fontello-embedded.css'
%= stylesheet '/css/hennypenny.css'
%= stylesheet '/css/lutim.css'
%= stylesheet '/css/common.min.css'
% if (current_route 'stats') {
%= stylesheet '/css/morris-0.4.3.min.css'
% } else {
%= stylesheet '/css/animation.css'
%= stylesheet '/css/uploader.css'
%= stylesheet '/css/markdown.css'
%= stylesheet '/css/not_stats.min.css'
% }
% if (current_route 'gallery') {
%= stylesheet '/css/photoswipe.css'
%= stylesheet '/css/default-skin/default-skin.css'
%= stylesheet '/css/gallery.min.css'
% }
%= javascript '/js/jquery-3.2.1.min.js'
</head>
......@@ -72,6 +66,7 @@
% if (defined(config('piwik_img'))) {
<img src="<%== config('piwik_img') %>" style="border:0" alt="">
% }
%= javascript '/js/toastify.js'
%= javascript '/js/bootstrap.min.js'
% if (current_route 'stats') {
%= javascript '/js/lutim.js'
......
......@@ -81,7 +81,25 @@ function copyToClipboard(el) {
var msg = successful ? 'successful' : 'unsuccessful';
console.debug('Copying text command was ' + msg);