first commit
This commit is contained in:
dkhorosh committed
commit
57f2db0d47
1414 files changed
+381371
No files matched your search
Executable
+1077
File diff suppressed because it is too large.
Load diff
+386
@@ -0,0 +1,386 @@
|
||||
/*!
|
||||
* =============================================================
|
||||
* dropify v0.2.1 - Override your input files with style.
|
||||
* https://github.com/JeremyFagis/dropify
|
||||
*
|
||||
* (c) 2017 - Jeremy FAGIS <jeremy@fagis.fr> (http://fagis.fr)
|
||||
* =============================================================
|
||||
*/
|
||||
|
||||
@charset "UTF-8";
|
||||
@font-face {
|
||||
font-family: 'dropify';
|
||||
src: url("../fonts/dropify.eot");
|
||||
src: url("../fonts/dropify.eot#iefix") format("embedded-opentype"), url("../fonts/dropify.woff") format("woff"), url("../fonts/dropify.ttf") format("truetype"), url("../fonts/dropify.svg#dropify") format("svg");
|
||||
font-weight: normal;
|
||||
font-style: normal; }
|
||||
|
||||
[class^="dropify-font-"]:before, [class*=" dropify-font-"]:before, .dropify-font:before, .dropify-wrapper .dropify-message span.file-icon:before {
|
||||
font-family: "dropify";
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
speak: none;
|
||||
display: inline-block;
|
||||
text-decoration: inherit;
|
||||
width: 1em;
|
||||
margin-left: .2em;
|
||||
margin-right: .2em;
|
||||
text-align: center;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
line-height: 1em; }
|
||||
|
||||
.dropify-font-upload:before, .dropify-wrapper .dropify-message span.file-icon:before {
|
||||
content: '\e800'; }
|
||||
|
||||
.dropify-font-file:before {
|
||||
content: '\e801'; }
|
||||
|
||||
.dropify-wrapper {
|
||||
display: block;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
height: 200px;
|
||||
padding: 5px 10px;
|
||||
font-family: "Roboto", "Helvetica Neue", "Helvetica", "Arial";
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
color: #777;
|
||||
background-color: #FFF;
|
||||
background-image: none;
|
||||
text-align: center;
|
||||
border: 2px solid #E5E5E5;
|
||||
-webkit-transition: border-color 0.15s linear;
|
||||
transition: border-color 0.15s linear; }
|
||||
.dropify-wrapper:hover {
|
||||
background-size: 30px 30px;
|
||||
background-image: -webkit-linear-gradient(135deg, #F6F6F6 25%, transparent 25%, transparent 50%, #F6F6F6 50%, #F6F6F6 75%, transparent 75%, transparent);
|
||||
background-image: linear-gradient(-45deg, #F6F6F6 25%, transparent 25%, transparent 50%, #F6F6F6 50%, #F6F6F6 75%, transparent 75%, transparent);
|
||||
-webkit-animation: stripes 2s linear infinite;
|
||||
animation: stripes 2s linear infinite; }
|
||||
.dropify-wrapper.has-preview .dropify-clear {
|
||||
display: block; }
|
||||
.dropify-wrapper.has-error {
|
||||
border-color: #F34141; }
|
||||
.dropify-wrapper.has-error .dropify-message .dropify-error {
|
||||
display: block; }
|
||||
.dropify-wrapper.has-error:hover .dropify-errors-container {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
-webkit-transition-delay: 0s;
|
||||
transition-delay: 0s; }
|
||||
.dropify-wrapper.disabled input {
|
||||
cursor: not-allowed; }
|
||||
.dropify-wrapper.disabled:hover {
|
||||
background-image: none;
|
||||
-webkit-animation: none;
|
||||
animation: none; }
|
||||
.dropify-wrapper.disabled .dropify-message {
|
||||
opacity: 0.5;
|
||||
text-decoration: line-through; }
|
||||
.dropify-wrapper.disabled .dropify-infos-message {
|
||||
display: none; }
|
||||
.dropify-wrapper input {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
opacity: 0;
|
||||
cursor: pointer;
|
||||
z-index: 5; }
|
||||
.dropify-wrapper .dropify-message {
|
||||
position: relative;
|
||||
top: 50%;
|
||||
-webkit-transform: translateY(-50%);
|
||||
transform: translateY(-50%); }
|
||||
.dropify-wrapper .dropify-message span.file-icon {
|
||||
font-size: 50px;
|
||||
color: #CCC; }
|
||||
.dropify-wrapper .dropify-message p {
|
||||
margin: 5px 0 0 0; }
|
||||
.dropify-wrapper .dropify-message p.dropify-error {
|
||||
color: #F34141;
|
||||
font-weight: bold;
|
||||
display: none; }
|
||||
.dropify-wrapper .dropify-clear {
|
||||
display: none;
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
z-index: 7;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
background: none;
|
||||
border: 2px solid #FFF;
|
||||
text-transform: uppercase;
|
||||
font-family: "Roboto", "Helvetica Neue", "Helvetica", "Arial";
|
||||
font-size: 11px;
|
||||
padding: 4px 8px;
|
||||
font-weight: bold;
|
||||
color: #FFF;
|
||||
-webkit-transition: all 0.15s linear;
|
||||
transition: all 0.15s linear; }
|
||||
.dropify-wrapper .dropify-clear:hover {
|
||||
background: rgba(255, 255, 255, 0.2); }
|
||||
.dropify-wrapper .dropify-preview {
|
||||
display: none;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
background-color: #FFF;
|
||||
padding: 5px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
overflow: hidden;
|
||||
text-align: center; }
|
||||
.dropify-wrapper .dropify-preview .dropify-render img {
|
||||
top: 50%;
|
||||
-webkit-transform: translate(0, -50%);
|
||||
transform: translate(0, -50%);
|
||||
position: relative;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
background-color: #FFF;
|
||||
-webkit-transition: border-color 0.15s linear;
|
||||
transition: border-color 0.15s linear; }
|
||||
.dropify-wrapper .dropify-preview .dropify-render i {
|
||||
font-size: 70px;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%);
|
||||
position: absolute;
|
||||
color: #777; }
|
||||
.dropify-wrapper .dropify-preview .dropify-render .dropify-extension {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%);
|
||||
margin-top: 10px;
|
||||
text-transform: uppercase;
|
||||
font-weight: 900;
|
||||
letter-spacing: -0.03em;
|
||||
font-size: 13px;
|
||||
width: 42px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis; }
|
||||
.dropify-wrapper .dropify-preview .dropify-infos {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 3;
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
opacity: 0;
|
||||
-webkit-transition: opacity 0.15s linear;
|
||||
transition: opacity 0.15s linear; }
|
||||
.dropify-wrapper .dropify-preview .dropify-infos .dropify-infos-inner {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
-webkit-transform: translate(0, -40%);
|
||||
transform: translate(0, -40%);
|
||||
-webkit-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
width: 100%;
|
||||
padding: 0 20px;
|
||||
-webkit-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease; }
|
||||
.dropify-wrapper .dropify-preview .dropify-infos .dropify-infos-inner p {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
color: #FFF;
|
||||
text-align: center;
|
||||
line-height: 25px;
|
||||
font-weight: bold; }
|
||||
.dropify-wrapper .dropify-preview .dropify-infos .dropify-infos-inner p.dropify-infos-message {
|
||||
margin-top: 15px;
|
||||
padding-top: 15px;
|
||||
font-size: 12px;
|
||||
position: relative;
|
||||
opacity: 0.5; }
|
||||
.dropify-wrapper .dropify-preview .dropify-infos .dropify-infos-inner p.dropify-infos-message::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
-webkit-transform: translate(-50%, 0);
|
||||
transform: translate(-50%, 0);
|
||||
background: #FFF;
|
||||
width: 30px;
|
||||
height: 2px; }
|
||||
.dropify-wrapper:hover .dropify-clear {
|
||||
opacity: 1; }
|
||||
.dropify-wrapper:hover .dropify-preview .dropify-infos {
|
||||
opacity: 1; }
|
||||
.dropify-wrapper:hover .dropify-preview .dropify-infos .dropify-infos-inner {
|
||||
margin-top: -5px; }
|
||||
.dropify-wrapper.touch-fallback {
|
||||
height: auto !important; }
|
||||
.dropify-wrapper.touch-fallback:hover {
|
||||
background-image: none;
|
||||
-webkit-animation: none;
|
||||
animation: none; }
|
||||
.dropify-wrapper.touch-fallback .dropify-preview {
|
||||
position: relative;
|
||||
padding: 0; }
|
||||
.dropify-wrapper.touch-fallback .dropify-preview .dropify-render {
|
||||
display: block;
|
||||
position: relative; }
|
||||
.dropify-wrapper.touch-fallback .dropify-preview .dropify-render .dropify-font-file {
|
||||
position: relative;
|
||||
-webkit-transform: translate(0, 0);
|
||||
transform: translate(0, 0);
|
||||
top: 0;
|
||||
left: 0; }
|
||||
.dropify-wrapper.touch-fallback .dropify-preview .dropify-render .dropify-font-file::before {
|
||||
margin-top: 30px;
|
||||
margin-bottom: 30px; }
|
||||
.dropify-wrapper.touch-fallback .dropify-preview .dropify-render img {
|
||||
position: relative;
|
||||
-webkit-transform: translate(0, 0);
|
||||
transform: translate(0, 0); }
|
||||
.dropify-wrapper.touch-fallback .dropify-preview .dropify-infos {
|
||||
position: relative;
|
||||
opacity: 1;
|
||||
background: transparent; }
|
||||
.dropify-wrapper.touch-fallback .dropify-preview .dropify-infos .dropify-infos-inner {
|
||||
position: relative;
|
||||
top: 0;
|
||||
-webkit-transform: translate(0, 0);
|
||||
transform: translate(0, 0);
|
||||
padding: 5px 90px 5px 0; }
|
||||
.dropify-wrapper.touch-fallback .dropify-preview .dropify-infos .dropify-infos-inner p {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
color: #777;
|
||||
text-align: left;
|
||||
line-height: 25px; }
|
||||
.dropify-wrapper.touch-fallback .dropify-preview .dropify-infos .dropify-infos-inner p.dropify-filename {
|
||||
font-weight: bold; }
|
||||
.dropify-wrapper.touch-fallback .dropify-preview .dropify-infos .dropify-infos-inner p.dropify-infos-message {
|
||||
margin-top: 0;
|
||||
padding-top: 0;
|
||||
font-size: 11px;
|
||||
position: relative;
|
||||
opacity: 1; }
|
||||
.dropify-wrapper.touch-fallback .dropify-preview .dropify-infos .dropify-infos-inner p.dropify-infos-message::before {
|
||||
display: none; }
|
||||
.dropify-wrapper.touch-fallback .dropify-message {
|
||||
-webkit-transform: translate(0, 0);
|
||||
transform: translate(0, 0);
|
||||
padding: 40px 0; }
|
||||
.dropify-wrapper.touch-fallback .dropify-clear {
|
||||
top: auto;
|
||||
bottom: 23px;
|
||||
opacity: 1;
|
||||
border-color: rgba(119, 119, 119, 0.7);
|
||||
color: #777; }
|
||||
.dropify-wrapper.touch-fallback.has-preview .dropify-message {
|
||||
display: none; }
|
||||
.dropify-wrapper.touch-fallback:hover .dropify-preview .dropify-infos .dropify-infos-inner {
|
||||
margin-top: 0; }
|
||||
.dropify-wrapper .dropify-loader {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
right: 15px;
|
||||
display: none;
|
||||
z-index: 9; }
|
||||
.dropify-wrapper .dropify-loader::after {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
-webkit-animation: rotate 0.6s linear infinite;
|
||||
animation: rotate 0.6s linear infinite;
|
||||
border-radius: 100%;
|
||||
border-top: 1px solid #CCC;
|
||||
border-bottom: 1px solid #777;
|
||||
border-left: 1px solid #CCC;
|
||||
border-right: 1px solid #777;
|
||||
content: ''; }
|
||||
.dropify-wrapper .dropify-errors-container {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 3;
|
||||
background: rgba(243, 65, 65, 0.8);
|
||||
text-align: left;
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
-webkit-transition: visibility 0s linear 0.15s,opacity 0.15s linear;
|
||||
transition: visibility 0s linear 0.15s,opacity 0.15s linear; }
|
||||
.dropify-wrapper .dropify-errors-container ul {
|
||||
padding: 10px 20px;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
-webkit-transform: translateY(-50%);
|
||||
transform: translateY(-50%); }
|
||||
.dropify-wrapper .dropify-errors-container ul li {
|
||||
margin-left: 20px;
|
||||
color: #FFF;
|
||||
font-weight: bold; }
|
||||
.dropify-wrapper .dropify-errors-container.visible {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
-webkit-transition-delay: 0s;
|
||||
transition-delay: 0s; }
|
||||
.dropify-wrapper ~ .dropify-errors-container ul {
|
||||
padding: 0;
|
||||
margin: 15px 0; }
|
||||
.dropify-wrapper ~ .dropify-errors-container ul li {
|
||||
margin-left: 20px;
|
||||
color: #F34141;
|
||||
font-weight: bold; }
|
||||
|
||||
@-webkit-keyframes stripes {
|
||||
from {
|
||||
background-position: 0 0; }
|
||||
to {
|
||||
background-position: 60px 30px; } }
|
||||
|
||||
@keyframes stripes {
|
||||
from {
|
||||
background-position: 0 0; }
|
||||
to {
|
||||
background-position: 60px 30px; } }
|
||||
|
||||
@-webkit-keyframes rotate {
|
||||
0% {
|
||||
-webkit-transform: rotateZ(-360deg);
|
||||
transform: rotateZ(-360deg); }
|
||||
100% {
|
||||
-webkit-transform: rotateZ(0deg);
|
||||
transform: rotateZ(0deg); } }
|
||||
|
||||
@keyframes rotate {
|
||||
0% {
|
||||
-webkit-transform: rotateZ(-360deg);
|
||||
transform: rotateZ(-360deg); }
|
||||
100% {
|
||||
-webkit-transform: rotateZ(0deg);
|
||||
transform: rotateZ(0deg); } }
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
@charset "UTF-8";/*!
|
||||
* =============================================================
|
||||
* dropify v0.2.1 - Override your input files with style.
|
||||
* https://github.com/JeremyFagis/dropify
|
||||
*
|
||||
* (c) 2016 - Jeremy FAGIS <jeremy@fagis.fr> (http://fagis.fr)
|
||||
* =============================================================
|
||||
*/@font-face{font-family:dropify;src:url(../fonts/dropify.eot);src:url(../fonts/dropify.eot#iefix) format("embedded-opentype"),url(../fonts/dropify.woff) format("woff"),url(../fonts/dropify.ttf) format("truetype"),url(../fonts/dropify.svg#dropify) format("svg");font-weight:400;font-style:normal}.dropify-font:before,.dropify-wrapper .dropify-message span.file-icon:before,.dropify-wrapper .dropify-preview .dropify-infos .dropify-infos-inner p.dropify-filename span.file-icon:before,[class*=" dropify-font-"]:before,[class^=dropify-font-]:before{font-family:dropify;font-style:normal;font-weight:400;speak:none;display:inline-block;text-decoration:inherit;width:1em;margin-left:.2em;margin-right:.2em;text-align:center;font-variant:normal;text-transform:none;line-height:1em}.dropify-wrapper,.dropify-wrapper .dropify-clear{font-family:Roboto,"Helvetica Neue",Helvetica,Arial}.dropify-wrapper.has-error .dropify-message .dropify-error,.dropify-wrapper.has-preview .dropify-clear{display:block}.dropify-font-upload:before,.dropify-wrapper .dropify-message span.file-icon:before{content:'\e800'}.dropify-font-file:before{content:'\e801'}.dropify-wrapper{display:block;position:relative;cursor:pointer;overflow:hidden;width:100%;max-width:100%;height:200px;padding:5px 10px;font-size:14px;line-height:22px;color:#777;background-color:#FFF;background-image:none;text-align:center;border:2px solid #E5E5E5;-webkit-transition:border-color .15s linear;transition:border-color .15s linear}.dropify-wrapper:hover{background-size:30px 30px;background-image:-webkit-linear-gradient(135deg,#F6F6F6 25%,transparent 25%,transparent 50%,#F6F6F6 50%,#F6F6F6 75%,transparent 75%,transparent);background-image:linear-gradient(-45deg,#F6F6F6 25%,transparent 25%,transparent 50%,#F6F6F6 50%,#F6F6F6 75%,transparent 75%,transparent);-webkit-animation:stripes 2s linear infinite;animation:stripes 2s linear infinite}.dropify-wrapper.has-error{border-color:#F34141}.dropify-wrapper.has-error:hover .dropify-errors-container{visibility:visible;opacity:1;-webkit-transition-delay:0s;transition-delay:0s}.dropify-wrapper.disabled input{cursor:not-allowed}.dropify-wrapper.disabled:hover{background-image:none;-webkit-animation:none;animation:none}.dropify-wrapper.disabled .dropify-message{opacity:.5;text-decoration:line-through}.dropify-wrapper.disabled .dropify-infos-message{display:none}.dropify-wrapper input{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;width:100%;opacity:0;cursor:pointer;z-index:5}.dropify-wrapper .dropify-message{position:relative;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.dropify-wrapper .dropify-message span.file-icon{font-size:50px;color:#CCC}.dropify-wrapper .dropify-message p{margin:5px 0 0}.dropify-wrapper .dropify-message p.dropify-error{color:#F34141;font-weight:700;display:none}.dropify-wrapper .dropify-clear{display:none;position:absolute;opacity:0;z-index:7;top:10px;right:10px;background:0 0;border:2px solid #FFF;text-transform:uppercase;font-size:11px;padding:4px 8px;font-weight:700;color:#FFF;-webkit-transition:all .15s linear;transition:all .15s linear}.dropify-wrapper .dropify-clear:hover{background:rgba(255,255,255,.2)}.dropify-wrapper .dropify-preview{display:none;position:absolute;z-index:1;background-color:#FFF;padding:5px;width:100%;height:100%;top:0;right:0;bottom:0;left:0;overflow:hidden;text-align:center}.dropify-wrapper .dropify-preview .dropify-render img{top:50%;-webkit-transform:translate(0,-50%);transform:translate(0,-50%);position:relative;max-width:100%;max-height:100%;background-color:#FFF;-webkit-transition:border-color .15s linear;transition:border-color .15s linear}.dropify-wrapper .dropify-preview .dropify-render i{font-size:70px;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);position:absolute;color:#777}.dropify-wrapper .dropify-preview .dropify-render .dropify-extension{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);margin-top:10px;text-transform:uppercase;font-weight:900;letter-spacing:-.03em;font-size:13px;width:42px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dropify-wrapper .dropify-preview .dropify-infos{position:absolute;left:0;top:0;right:0;bottom:0;z-index:3;background:rgba(0,0,0,.7);opacity:0;-webkit-transition:opacity .15s linear;transition:opacity .15s linear}.dropify-wrapper .dropify-preview .dropify-infos .dropify-infos-inner{position:absolute;top:50%;-webkit-transform:translate(0,-40%);transform:translate(0,-40%);-webkit-backface-visibility:hidden;backface-visibility:hidden;width:100%;padding:0 20px;-webkit-transition:all .2s ease;transition:all .2s ease}.dropify-wrapper .dropify-preview .dropify-infos .dropify-infos-inner p{padding:0;margin:0;position:relative;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#FFF;text-align:center;line-height:25px;font-weight:700}.dropify-wrapper .dropify-preview .dropify-infos .dropifLine truncated
|
||||
BIN
Binary file not shown.
+13
@@ -0,0 +1,13 @@
|
||||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<metadata>Copyright (C) 2015 by original authors @ fontello.com</metadata>
|
||||
<defs>
|
||||
<font id="dropify" horiz-adv-x="1000" >
|
||||
<font-face font-family="dropify" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
|
||||
<missing-glyph horiz-adv-x="1000" />
|
||||
<glyph glyph-name="upload" unicode="" d="m654 189c3-3 8-4 12-4 4 0 8 1 11 4 6 7 6 17 0 23l-167 166c0 0 0 0 0 0l-11 12-11-12c0 0 0 0 0 0l-167-166c-6-6-6-16 0-23 7-6 17-6 23 0l139 140v-281c0-9 7-16 16-16s16 7 16 16v281l139-140z m158 292c-39 110-143 184-261 184-111 0-211-67-254-169-21 10-43 15-65 15-86 0-156-70-156-156-45-34-71-87-71-143 0-99 81-180 183-180 1 0 3 0 4 0 1 0 2 0 2 0h168c9 0 16 7 16 16 0 9-7 16-16 16h-168c-2 0-4 0-5 0l-3 0c-82 0-149 66-149 148 0 49 24 95 64 122l8 8-1 13c0 68 55 124 124 124 23 0 45-7 65-19l17-10 6 19c34 98 127 164 231 164 107 0 201-69 234-171l3-9 9-2c95-15 164-96 164-192 0-108-87-195-195-195h-130c-9 0-16-8-16-16 0-9 7-16 16-16h130c125 0 227 101 227 227 0 108-75 200-181 222z" horiz-adv-x="1000" />
|
||||
<glyph glyph-name="file" unicode="" d="m853 507c0 3 0 6-1 8-1 14-3 16-4 18-2 4-24 27-65 68l-167 166c-41 41-64 63-68 66-4 2-8 5-103 5h-165c-26 0-88 0-93-1-8-1-21-9-26-14-4-4-10-12-12-18-2-5-2-39-2-100v-710c0-3 0-86 1-93 1-8 8-20 13-25 4-4 12-10 19-13 6-2 58-2 100-2h440c4 0 87 0 93 1 9 1 21 9 26 14 4 4 10 12 12 18 2 5 2 39 2 100v435c0 34 0 57-1 72 1 1 1 3 1 5z m-313 287c11-10 29-28 52-51l166-167c24-23 41-41 52-52h-202c-38 0-68 31-68 69v201l0 0z m279-799c0-50-1-87 0-89-1-1-2-3-4-5-1-1-6-4-5-4-4 0-38-1-90-1h-440c-43 0-76 1-86 1-2 0-3 0-3 0-1 0-4 2-6 4-1 1-3 5-3 5h-1c0 4 0 37 0 89v710c0 52 1 87 0 89 1 1 3 4 4 5 1 1 6 4 6 4 4 1 39 1 89 1h165c24 0 45 0 61-1v-210c0-57 46-103 102-103h211c0-15 0-36 0-60l0-435 0 0z" horiz-adv-x="1000" />
|
||||
</font>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.9 KiB |
BIN
Binary file not shown.
BIN
Binary file not shown.
Executable
+657
@@ -0,0 +1,657 @@
|
||||
/*!
|
||||
* =============================================================
|
||||
* dropify v0.2.1 - Override your input files with style.
|
||||
* https://github.com/JeremyFagis/dropify
|
||||
*
|
||||
* (c) 2017 - Jeremy FAGIS <jeremy@fagis.fr> (http://fagis.fr)
|
||||
* =============================================================
|
||||
*/
|
||||
|
||||
;(function(root, factory) {
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
define(['jquery'], factory);
|
||||
} else if (typeof exports === 'object') {
|
||||
module.exports = factory(require('jquery'));
|
||||
} else {
|
||||
root.Dropify = factory(root.jQuery);
|
||||
}
|
||||
}(this, function($) {
|
||||
var pluginName = "dropify";
|
||||
|
||||
/**
|
||||
* Dropify plugin
|
||||
*
|
||||
* @param {Object} element
|
||||
* @param {Array} options
|
||||
*/
|
||||
function Dropify(element, options) {
|
||||
if (!(window.File && window.FileReader && window.FileList && window.Blob)) {
|
||||
return;
|
||||
}
|
||||
|
||||
var defaults = {
|
||||
defaultFile: '',
|
||||
maxFileSize: 0,
|
||||
minWidth: 0,
|
||||
maxWidth: 0,
|
||||
minHeight: 0,
|
||||
maxHeight: 0,
|
||||
showRemove: true,
|
||||
showLoader: true,
|
||||
showErrors: true,
|
||||
errorTimeout: 3000,
|
||||
errorsPosition: 'overlay',
|
||||
imgFileExtensions: ['png', 'jpg', 'jpeg', 'gif', 'bmp'],
|
||||
maxFileSizePreview: "5M",
|
||||
allowedFormats: ['portrait', 'square', 'landscape'],
|
||||
allowedFileExtensions: ['*'],
|
||||
messages: {
|
||||
'default': 'Drag and drop a file here or click',
|
||||
'replace': 'Drag and drop or click to replace',
|
||||
'remove': 'Remove',
|
||||
'error': 'Ooops, something wrong happended.'
|
||||
},
|
||||
error: {
|
||||
'fileSize': 'The file size is too big ({{ value }} max).',
|
||||
'minWidth': 'The image width is too small ({{ value }}}px min).',
|
||||
'maxWidth': 'The image width is too big ({{ value }}}px max).',
|
||||
'minHeight': 'The image height is too small ({{ value }}}px min).',
|
||||
'maxHeight': 'The image height is too big ({{ value }}px max).',
|
||||
'imageFormat': 'The image format is not allowed ({{ value }} only).',
|
||||
'fileExtension': 'The file is not allowed ({{ value }} only).'
|
||||
},
|
||||
tpl: {
|
||||
wrap: '<div class="dropify-wrapper"></div>',
|
||||
loader: '<div class="dropify-loader"></div>',
|
||||
message: '<div class="dropify-message"><span class="file-icon" /> <p>{{ default }}</p></div>',
|
||||
preview: '<div class="dropify-preview"><span class="dropify-render"></span><div class="dropify-infos"><div class="dropify-infos-inner"><p class="dropify-infos-message">{{ replace }}</p></div></div></div>',
|
||||
filename: '<p class="dropify-filename"><span class="dropify-filename-inner"></span></p>',
|
||||
clearButton: '<button type="button" class="dropify-clear">{{ remove }}</button>',
|
||||
errorLine: '<p class="dropify-error">{{ error }}</p>',
|
||||
errorsContainer: '<div class="dropify-errors-container"><ul></ul></div>'
|
||||
}
|
||||
};
|
||||
|
||||
this.element = element;
|
||||
this.input = $(this.element);
|
||||
this.wrapper = null;
|
||||
this.preview = null;
|
||||
this.filenameWrapper = null;
|
||||
this.settings = $.extend(true, defaults, options, this.input.data());
|
||||
this.errorsEvent = $.Event('dropify.errors');
|
||||
this.isDisabled = false;
|
||||
this.isInit = false;
|
||||
this.file = {
|
||||
object: null,
|
||||
name: null,
|
||||
size: null,
|
||||
width: null,
|
||||
height: null,
|
||||
type: null
|
||||
};
|
||||
|
||||
if (!Array.isArray(this.settings.allowedFormats)) {
|
||||
this.settings.allowedFormats = this.settings.allowedFormats.split(' ');
|
||||
}
|
||||
|
||||
if (!Array.isArray(this.settings.allowedFileExtensions)) {
|
||||
this.settings.allowedFileExtensions = this.settings.allowedFileExtensions.split(' ');
|
||||
}
|
||||
|
||||
this.onChange = this.onChange.bind(this);
|
||||
this.clearElement = this.clearElement.bind(this);
|
||||
this.onFileReady = this.onFileReady.bind(this);
|
||||
|
||||
this.translateMessages();
|
||||
this.createElements();
|
||||
this.setContainerSize();
|
||||
|
||||
this.errorsEvent.errors = [];
|
||||
|
||||
this.input.on('change', this.onChange);
|
||||
}
|
||||
|
||||
/**
|
||||
* On change event
|
||||
*/
|
||||
Dropify.prototype.onChange = function()
|
||||
{
|
||||
this.resetPreview();
|
||||
this.readFile(this.element);
|
||||
};
|
||||
|
||||
/**
|
||||
* Create dom elements
|
||||
*/
|
||||
Dropify.prototype.createElements = function()
|
||||
{
|
||||
this.isInit = true;
|
||||
this.input.wrap($(this.settings.tpl.wrap));
|
||||
this.wrapper = this.input.parent();
|
||||
|
||||
var messageWrapper = $(this.settings.tpl.message).insertBefore(this.input);
|
||||
$(this.settings.tpl.errorLine).appendTo(messageWrapper);
|
||||
|
||||
if (this.isTouchDevice() === true) {
|
||||
this.wrapper.addClass('touch-fallback');
|
||||
}
|
||||
|
||||
if (this.input.attr('disabled')) {
|
||||
this.isDisabled = true;
|
||||
this.wrapper.addClass('disabled');
|
||||
}
|
||||
|
||||
if (this.settings.showLoader === true) {
|
||||
this.loader = $(this.settings.tpl.loader);
|
||||
this.loader.insertBefore(this.input);
|
||||
}
|
||||
|
||||
this.preview = $(this.settings.tpl.preview);
|
||||
this.preview.insertAfter(this.input);
|
||||
|
||||
if (this.isDisabled === false && this.settings.showRemove === true) {
|
||||
this.clearButton = $(this.settings.tpl.clearButton);
|
||||
this.clearButton.insertAfter(this.input);
|
||||
this.clearButton.on('click', this.clearElement);
|
||||
}
|
||||
|
||||
this.filenameWrapper = $(this.settings.tpl.filename);
|
||||
this.filenameWrapper.prependTo(this.preview.find('.dropify-infos-inner'));
|
||||
|
||||
if (this.settings.showErrors === true) {
|
||||
this.errorsContainer = $(this.settings.tpl.errorsContainer);
|
||||
|
||||
if (this.settings.errorsPosition === 'outside') {
|
||||
this.errorsContainer.insertAfter(this.wrapper);
|
||||
} else {
|
||||
this.errorsContainer.insertBefore(this.input);
|
||||
}
|
||||
}
|
||||
|
||||
var defaultFile = this.settings.defaultFile || '';
|
||||
|
||||
if (defaultFile.trim() !== '') {
|
||||
this.file.name = this.cleanFilename(defaultFile);
|
||||
this.setPreview(this.isImage(), defaultFile);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Read the file using FileReader
|
||||
*
|
||||
* @param {Object} input
|
||||
*/
|
||||
Dropify.prototype.readFile = function(input)
|
||||
{
|
||||
if (input.files && input.files[0]) {
|
||||
var reader = new FileReader();
|
||||
var image = new Image();
|
||||
var file = input.files[0];
|
||||
var srcBase64 = null;
|
||||
var _this = this;
|
||||
var eventFileReady = $.Event("dropify.fileReady");
|
||||
|
||||
this.clearErrors();
|
||||
this.showLoader();
|
||||
this.setFileInformations(file);
|
||||
this.errorsEvent.errors = [];
|
||||
this.checkFileSize();
|
||||
this.isFileExtensionAllowed();
|
||||
|
||||
if (this.isImage() && this.file.size < this.sizeToByte(this.settings.maxFileSizePreview)) {
|
||||
this.input.on('dropify.fileReady', this.onFileReady);
|
||||
reader.readAsDataURL(file);
|
||||
reader.onload = function(_file) {
|
||||
srcBase64 = _file.target.result;
|
||||
image.src = _file.target.result;
|
||||
image.onload = function() {
|
||||
_this.setFileDimensions(this.width, this.height);
|
||||
_this.validateImage();
|
||||
_this.input.trigger(eventFileReady, [true, srcBase64]);
|
||||
};
|
||||
|
||||
}.bind(this);
|
||||
} else {
|
||||
this.onFileReady(false);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* On file ready to show
|
||||
*
|
||||
* @param {Event} event
|
||||
* @param {Bool} previewable
|
||||
* @param {String} src
|
||||
*/
|
||||
Dropify.prototype.onFileReady = function(event, previewable, src)
|
||||
{
|
||||
this.input.off('dropify.fileReady', this.onFileReady);
|
||||
|
||||
if (this.errorsEvent.errors.length === 0) {
|
||||
this.setPreview(previewable, src);
|
||||
} else {
|
||||
this.input.trigger(this.errorsEvent, [this]);
|
||||
for (var i = this.errorsEvent.errors.length - 1; i >= 0; i--) {
|
||||
var errorNamespace = this.errorsEvent.errors[i].namespace;
|
||||
var errorKey = errorNamespace.split('.').pop();
|
||||
this.showError(errorKey);
|
||||
}
|
||||
|
||||
if (typeof this.errorsContainer !== "undefined") {
|
||||
this.errorsContainer.addClass('visible');
|
||||
|
||||
var errorsContainer = this.errorsContainer;
|
||||
setTimeout(function(){ errorsContainer.removeClass('visible'); }, this.settings.errorTimeout);
|
||||
}
|
||||
|
||||
this.wrapper.addClass('has-error');
|
||||
this.resetPreview();
|
||||
this.clearElement();
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Set file informations
|
||||
*
|
||||
* @param {File} file
|
||||
*/
|
||||
Dropify.prototype.setFileInformations = function(file)
|
||||
{
|
||||
this.file.object = file;
|
||||
this.file.name = file.name;
|
||||
this.file.size = file.size;
|
||||
this.file.type = file.type;
|
||||
this.file.width = null;
|
||||
this.file.height = null;
|
||||
};
|
||||
|
||||
/**
|
||||
* Set file dimensions
|
||||
*
|
||||
* @param {Int} width
|
||||
* @param {Int} height
|
||||
*/
|
||||
Dropify.prototype.setFileDimensions = function(width, height)
|
||||
{
|
||||
this.file.width = width;
|
||||
this.file.height = height;
|
||||
};
|
||||
|
||||
/**
|
||||
* Set the preview and animate it
|
||||
*
|
||||
* @param {String} src
|
||||
*/
|
||||
Dropify.prototype.setPreview = function(previewable, src)
|
||||
{
|
||||
this.wrapper.removeClass('has-error').addClass('has-preview');
|
||||
this.filenameWrapper.children('.dropify-filename-inner').html(this.file.name);
|
||||
var render = this.preview.children('.dropify-render');
|
||||
|
||||
this.hideLoader();
|
||||
|
||||
if (previewable === true) {
|
||||
var imgTag = $('<img />').attr('src', src);
|
||||
|
||||
if (this.settings.height) {
|
||||
imgTag.css("max-height", this.settings.height);
|
||||
}
|
||||
|
||||
imgTag.appendTo(render);
|
||||
} else {
|
||||
$('<i />').attr('class', 'dropify-font-file').appendTo(render);
|
||||
$('<span class="dropify-extension" />').html(this.getFileType()).appendTo(render);
|
||||
}
|
||||
this.preview.fadeIn();
|
||||
};
|
||||
|
||||
/**
|
||||
* Reset the preview
|
||||
*/
|
||||
Dropify.prototype.resetPreview = function()
|
||||
{
|
||||
this.wrapper.removeClass('has-preview');
|
||||
var render = this.preview.children('.dropify-render');
|
||||
render.find('.dropify-extension').remove();
|
||||
render.find('i').remove();
|
||||
render.find('img').remove();
|
||||
this.preview.hide();
|
||||
this.hideLoader();
|
||||
};
|
||||
|
||||
/**
|
||||
* Clean the src and get the filename
|
||||
*
|
||||
* @param {String} src
|
||||
*
|
||||
* @return {String} filename
|
||||
*/
|
||||
Dropify.prototype.cleanFilename = function(src)
|
||||
{
|
||||
var filename = src.split('\\').pop();
|
||||
if (filename == src) {
|
||||
filename = src.split('/').pop();
|
||||
}
|
||||
|
||||
return src !== "" ? filename : '';
|
||||
};
|
||||
|
||||
/**
|
||||
* Clear the element, events are available
|
||||
*/
|
||||
Dropify.prototype.clearElement = function()
|
||||
{
|
||||
if (this.errorsEvent.errors.length === 0) {
|
||||
var eventBefore = $.Event("dropify.beforeClear");
|
||||
this.input.trigger(eventBefore, [this]);
|
||||
|
||||
if (eventBefore.result !== false) {
|
||||
this.resetFile();
|
||||
this.input.val('');
|
||||
this.resetPreview();
|
||||
|
||||
this.input.trigger($.Event("dropify.afterClear"), [this]);
|
||||
}
|
||||
} else {
|
||||
this.resetFile();
|
||||
this.input.val('');
|
||||
this.resetPreview();
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Reset file informations
|
||||
*/
|
||||
Dropify.prototype.resetFile = function()
|
||||
{
|
||||
this.file.object = null;
|
||||
this.file.name = null;
|
||||
this.file.size = null;
|
||||
this.file.type = null;
|
||||
this.file.width = null;
|
||||
this.file.height = null;
|
||||
};
|
||||
|
||||
/**
|
||||
* Set the container height
|
||||
*/
|
||||
Dropify.prototype.setContainerSize = function()
|
||||
{
|
||||
if (this.settings.height) {
|
||||
this.wrapper.height(this.settings.height);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Test if it's touch screen
|
||||
*
|
||||
* @return {Boolean}
|
||||
*/
|
||||
Dropify.prototype.isTouchDevice = function()
|
||||
{
|
||||
return (('ontouchstart' in window) ||
|
||||
(navigator.MaxTouchPoints > 0) ||
|
||||
(navigator.msMaxTouchPoints > 0));
|
||||
};
|
||||
|
||||
/**
|
||||
* Get the file type.
|
||||
*
|
||||
* @return {String}
|
||||
*/
|
||||
Dropify.prototype.getFileType = function()
|
||||
{
|
||||
return this.file.name.split('.').pop().toLowerCase();
|
||||
};
|
||||
|
||||
/**
|
||||
* Test if the file is an image
|
||||
*
|
||||
* @return {Boolean}
|
||||
*/
|
||||
Dropify.prototype.isImage = function()
|
||||
{
|
||||
if (this.settings.imgFileExtensions.indexOf(this.getFileType()) != "-1") {
|
||||
return true;
|
||||
}
|
||||
|
||||
return false;
|
||||
};
|
||||
|
||||
/**
|
||||
* Test if the file extension is allowed
|
||||
*
|
||||
* @return {Boolean}
|
||||
*/
|
||||
Dropify.prototype.isFileExtensionAllowed = function () {
|
||||
|
||||
if (this.settings.allowedFileExtensions.indexOf('*') != "-1" ||
|
||||
this.settings.allowedFileExtensions.indexOf(this.getFileType()) != "-1") {
|
||||
return true;
|
||||
}
|
||||
this.pushError("fileExtension");
|
||||
|
||||
return false;
|
||||
};
|
||||
|
||||
/**
|
||||
* Translate messages if needed.
|
||||
*/
|
||||
Dropify.prototype.translateMessages = function()
|
||||
{
|
||||
for (var name in this.settings.tpl) {
|
||||
for (var key in this.settings.messages) {
|
||||
this.settings.tpl[name] = this.settings.tpl[name].replace('{{ ' + key + ' }}', this.settings.messages[key]);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Check the limit filesize.
|
||||
*/
|
||||
Dropify.prototype.checkFileSize = function()
|
||||
{
|
||||
if (this.sizeToByte(this.settings.maxFileSize) !== 0 && this.file.size > this.sizeToByte(this.settings.maxFileSize)) {
|
||||
this.pushError("fileSize");
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Convert filesize to byte.
|
||||
*
|
||||
* @return {Int} value
|
||||
*/
|
||||
Dropify.prototype.sizeToByte = function(size)
|
||||
{
|
||||
var value = 0;
|
||||
|
||||
if (size !== 0) {
|
||||
var unit = size.slice(-1).toUpperCase(),
|
||||
kb = 1024,
|
||||
mb = kb * 1024,
|
||||
gb = mb * 1024;
|
||||
|
||||
if (unit === 'K') {
|
||||
value = parseFloat(size) * kb;
|
||||
} else if (unit === 'M') {
|
||||
value = parseFloat(size) * mb;
|
||||
} else if (unit === 'G') {
|
||||
value = parseFloat(size) * gb;
|
||||
}
|
||||
}
|
||||
|
||||
return value;
|
||||
};
|
||||
|
||||
/**
|
||||
* Validate image dimensions and format
|
||||
*/
|
||||
Dropify.prototype.validateImage = function()
|
||||
{
|
||||
if (this.settings.minWidth !== 0 && this.settings.minWidth >= this.file.width) {
|
||||
this.pushError("minWidth");
|
||||
}
|
||||
|
||||
if (this.settings.maxWidth !== 0 && this.settings.maxWidth <= this.file.width) {
|
||||
this.pushError("maxWidth");
|
||||
}
|
||||
|
||||
if (this.settings.minHeight !== 0 && this.settings.minHeight >= this.file.height) {
|
||||
this.pushError("minHeight");
|
||||
}
|
||||
|
||||
if (this.settings.maxHeight !== 0 && this.settings.maxHeight <= this.file.height) {
|
||||
this.pushError("maxHeight");
|
||||
}
|
||||
|
||||
if (this.settings.allowedFormats.indexOf(this.getImageFormat()) == "-1") {
|
||||
this.pushError("imageFormat");
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Get image format.
|
||||
*
|
||||
* @return {String}
|
||||
*/
|
||||
Dropify.prototype.getImageFormat = function()
|
||||
{
|
||||
if (this.file.width == this.file.height) {
|
||||
return "square";
|
||||
}
|
||||
|
||||
if (this.file.width < this.file.height) {
|
||||
return "portrait";
|
||||
}
|
||||
|
||||
if (this.file.width > this.file.height) {
|
||||
return "landscape";
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Push error
|
||||
*
|
||||
* @param {String} errorKey
|
||||
*/
|
||||
Dropify.prototype.pushError = function(errorKey) {
|
||||
var e = $.Event("dropify.error." + errorKey);
|
||||
this.errorsEvent.errors.push(e);
|
||||
this.input.trigger(e, [this]);
|
||||
};
|
||||
|
||||
/**
|
||||
* Clear errors
|
||||
*/
|
||||
Dropify.prototype.clearErrors = function()
|
||||
{
|
||||
if (typeof this.errorsContainer !== "undefined") {
|
||||
this.errorsContainer.children('ul').html('');
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Show error in DOM
|
||||
*
|
||||
* @param {String} errorKey
|
||||
*/
|
||||
Dropify.prototype.showError = function(errorKey)
|
||||
{
|
||||
if (typeof this.errorsContainer !== "undefined") {
|
||||
this.errorsContainer.children('ul').append('<li>' + this.getError(errorKey) + '</li>');
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Get error message
|
||||
*
|
||||
* @return {String} message
|
||||
*/
|
||||
Dropify.prototype.getError = function(errorKey)
|
||||
{
|
||||
var error = this.settings.error[errorKey],
|
||||
value = '';
|
||||
|
||||
if (errorKey === 'fileSize') {
|
||||
value = this.settings.maxFileSize;
|
||||
} else if (errorKey === 'minWidth') {
|
||||
value = this.settings.minWidth;
|
||||
} else if (errorKey === 'maxWidth') {
|
||||
value = this.settings.maxWidth;
|
||||
} else if (errorKey === 'minHeight') {
|
||||
value = this.settings.minHeight;
|
||||
} else if (errorKey === 'maxHeight') {
|
||||
value = this.settings.maxHeight;
|
||||
} else if (errorKey === 'imageFormat') {
|
||||
value = this.settings.allowedFormats.join(', ');
|
||||
} else if (errorKey === 'fileExtension') {
|
||||
value = this.settings.allowedFileExtensions.join(', ');
|
||||
}
|
||||
|
||||
if (value !== '') {
|
||||
return error.replace('{{ value }}', value);
|
||||
}
|
||||
|
||||
return error;
|
||||
};
|
||||
|
||||
/**
|
||||
* Show the loader
|
||||
*/
|
||||
Dropify.prototype.showLoader = function()
|
||||
{
|
||||
if (typeof this.loader !== "undefined") {
|
||||
this.loader.show();
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Hide the loader
|
||||
*/
|
||||
Dropify.prototype.hideLoader = function()
|
||||
{
|
||||
if (typeof this.loader !== "undefined") {
|
||||
this.loader.hide();
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Destroy dropify
|
||||
*/
|
||||
Dropify.prototype.destroy = function()
|
||||
{
|
||||
this.input.siblings().remove();
|
||||
this.input.unwrap();
|
||||
this.isInit = false;
|
||||
};
|
||||
|
||||
/**
|
||||
* Init dropify
|
||||
*/
|
||||
Dropify.prototype.init = function()
|
||||
{
|
||||
this.createElements();
|
||||
};
|
||||
|
||||
/**
|
||||
* Test if element is init
|
||||
*/
|
||||
Dropify.prototype.isDropified = function()
|
||||
{
|
||||
return this.isInit;
|
||||
};
|
||||
|
||||
$.fn[pluginName] = function(options) {
|
||||
this.each(function() {
|
||||
if (!$.data(this, pluginName)) {
|
||||
$.data(this, pluginName, new Dropify(this, options));
|
||||
}
|
||||
});
|
||||
|
||||
return this;
|
||||
};
|
||||
|
||||
|
||||
return Dropify;
|
||||
}));
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
/*!
|
||||
* =============================================================
|
||||
* dropify v0.2.1 - Override your input files with style.
|
||||
* https://github.com/JeremyFagis/dropify
|
||||
*
|
||||
* (c) 2016 - Jeremy FAGIS <jeremy@fagis.fr> (http://fagis.fr)
|
||||
* =============================================================
|
||||
*/
|
||||
|
||||
!function(e,i){"function"==typeof define&&define.amd?define(["jquery"],i):"object"==typeof exports?module.exports=i(require("jquery")):e.Dropify=i(e.jQuery)}(this,function(e){function i(i,t){if(window.File&&window.FileReader&&window.FileList&&window.Blob){var s={defaultFile:"",maxFileSize:0,minWidth:0,maxWidth:0,minHeight:0,maxHeight:0,showRemove:!0,showLoader:!0,showErrors:!0,errorTimeout:3e3,errorsPosition:"overlay",imgFileExtensions:["png","jpg","jpeg","gif","bmp"],maxFileSizePreview:"5M",allowedFormats:["portrait","square","landscape"],allowedFileExtensions:["*"],messages:{"default":"Drag and drop a file here or click",replace:"Drag and drop or click to replace",remove:"Remove",error:"Ooops, something wrong appended."},error:{fileSize:"The file size is too big ({{ value }} max).",minWidth:"The image width is too small ({{ value }}}px min).",maxWidth:"The image width is too big ({{ value }}}px max).",minHeight:"The image height is too small ({{ value }}}px min).",maxHeight:"The image height is too big ({{ value }}px max).",imageFormat:"The image format is not allowed ({{ value }} only).",fileExtension:"The file is not allowed ({{ value }} only)."},tpl:{wrap:'<div class="dropify-wrapper"></div>',loader:'<div class="dropify-loader"></div>',message:'<div class="dropify-message"><span class="file-icon" /> <p>{{ default }}</p></div>',preview:'<div class="dropify-preview"><span class="dropify-render"></span><div class="dropify-infos"><div class="dropify-infos-inner"><p class="dropify-infos-message">{{ replace }}</p></div></div></div>',filename:'<p class="dropify-filename"><span class="file-icon"></span> <span class="dropify-filename-inner"></span></p>',clearButton:'<button type="button" class="dropify-clear">{{ remove }}</button>',errorLine:'<p class="dropify-error">{{ error }}</p>',errorsContainer:'<div class="dropify-errors-container"><ul></ul></div>'}};this.element=i,this.input=e(this.element),this.wrapper=null,this.preview=null,this.filenameWrapper=null,this.settings=e.extend(!0,s,t,this.input.data()),this.errorsEvent=e.Event("dropify.errors"),this.isDisabled=!1,this.isInit=!1,this.file={object:null,name:null,size:null,width:null,height:null,type:null},Array.isArray(this.settings.allowedFormats)||(this.settings.allowedFormats=this.settings.allowedFormats.split(" ")),Array.isArray(this.settings.allowedFileExtensions)||(this.settings.allowedFileExtensions=this.settings.allowedFileExtensions.split(" ")),this.onChange=this.onChange.bind(this),this.clearElement=this.clearElement.bind(this),this.onFileReady=this.onFileReady.bind(this),this.translateMessages(),this.createElements(),this.setContainerSize(),this.errorsEvent.errors=[],this.input.on("change",this.onChange)}}var t="dropify";return i.prototype.onChange=function(){this.resetPreview(),this.readFile(this.element)},i.prototype.createElements=function(){this.isInit=!0,this.input.wrap(e(this.settings.tpl.wrap)),this.wrapper=this.input.parent();var i=e(this.settings.tpl.message).insertBefore(this.input);e(this.settings.tpl.errorLine).appendTo(i),this.isTouchDevice()===!0&&this.wrapper.addClass("touch-fallback"),this.input.attr("disabled")&&(this.isDisabled=!0,this.wrapper.addClass("disabled")),this.settings.showLoader===!0&&(this.loader=e(this.settings.tpl.loader),this.loader.insertBefore(this.input)),this.preview=e(this.settings.tpl.preview),this.preview.insertAfter(this.input),this.isDisabled===!1&&this.settings.showRemove===!0&&(this.clearButton=e(this.settings.tpl.clearButton),this.clearButton.insertAfter(this.input),this.clearButton.on("click",this.clearElement)),this.filenameWrapper=e(this.settings.tpl.filename),this.filenameWrapper.prependTo(this.preview.find(".dropify-infos-inner")),this.settings.showErrors===!0&&(this.errorsContainer=e(this.settings.tpl.errorsContainer),"outside"===this.settings.errorsPosition?this.errorsContainer.insertAfter(this.wrapper):this.errorsContainer.insertBefore(this.input));var t=this.settings.defaultFile||"";""!==t.trim()&&(this.file.name=this.cleanFilename(t),this.setPreview(this.isImage(),t))},i.prototype.readFile=function(i){if(i.files&&i.files[0]){var t=new FileReader,s=new Image,r=i.files[0],n=null,o=this,h=e.Event("dropify.fileReady");this.clearErrors(),this.showLoader(),this.setFileInformations(r),this.errorsEvent.errors=[],this.checkFileSize(),this.isFileExtensionAllowed(),this.isImage()&&this.file.size<this.sizeToByte(this.settings.maxFileSizePreview)?(this.input.on("dropify.fileReady",this.onFileReady),t.readAsDataURL(r),t.onload=function(e){n=e.target.result,s.src=e.target.result,s.onload=function(){o.setFileDimensions(this.width,this.height),o.validateImage(),o.input.trigger(h,[!0,n])}}.bind(this)):this.onFileReady(!1)}},i.prototype.onFileReady=function(e,i,t){if(this.input.off("dropify.fileReady",this.onFileReady),0===this.errorsEvent.errors.length)this.setPreview(i,t);else{this.input.trigger(this.errorsEvent,[this]);for(var s=this.errorsEvent.errors.length-1;s>=0;s--){var r=this.errorsEvent.errors[s].namesLine truncated
|
||||
Reference in new issue
Block a user