Changeset 88798 in spip-zone


Ignore:
Timestamp:
Apr 25, 2015, 11:06:28 PM (5 years ago)
Author:
p@…
Message:

Dropzone 4.0

Location:
_plugins_/uploadhtml5/trunk/lib/dropzone
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • _plugins_/uploadhtml5/trunk/lib/dropzone/dropzone.css

    r88796 r88798  
    1 /* The MIT License */
    2 
    3 /* CSS de DropZone modifier pour mieux coller à SPPIP */
    4 .dropzone,
    5 .dropzone *,
    6 .dropzone-previews,
    7 .dropzone-previews * {
    8     -webkit-box-sizing: border-box;
    9     -moz-box-sizing: border-box;
    10     box-sizing: border-box;
    11 }
     1/*
     2 * The MIT License
     3 * Copyright (c) 2012 Matias Meno <m@tias.me>
     4 */
     5@-webkit-keyframes passing-through {
     6  0% {
     7    opacity: 0;
     8    -webkit-transform: translateY(40px);
     9    -moz-transform: translateY(40px);
     10    -ms-transform: translateY(40px);
     11    -o-transform: translateY(40px);
     12    transform: translateY(40px); }
     13  30%, 70% {
     14    opacity: 1;
     15    -webkit-transform: translateY(0px);
     16    -moz-transform: translateY(0px);
     17    -ms-transform: translateY(0px);
     18    -o-transform: translateY(0px);
     19    transform: translateY(0px); }
     20  100% {
     21    opacity: 0;
     22    -webkit-transform: translateY(-40px);
     23    -moz-transform: translateY(-40px);
     24    -ms-transform: translateY(-40px);
     25    -o-transform: translateY(-40px);
     26    transform: translateY(-40px); } }
     27@-moz-keyframes passing-through {
     28  0% {
     29    opacity: 0;
     30    -webkit-transform: translateY(40px);
     31    -moz-transform: translateY(40px);
     32    -ms-transform: translateY(40px);
     33    -o-transform: translateY(40px);
     34    transform: translateY(40px); }
     35  30%, 70% {
     36    opacity: 1;
     37    -webkit-transform: translateY(0px);
     38    -moz-transform: translateY(0px);
     39    -ms-transform: translateY(0px);
     40    -o-transform: translateY(0px);
     41    transform: translateY(0px); }
     42  100% {
     43    opacity: 0;
     44    -webkit-transform: translateY(-40px);
     45    -moz-transform: translateY(-40px);
     46    -ms-transform: translateY(-40px);
     47    -o-transform: translateY(-40px);
     48    transform: translateY(-40px); } }
     49@keyframes passing-through {
     50  0% {
     51    opacity: 0;
     52    -webkit-transform: translateY(40px);
     53    -moz-transform: translateY(40px);
     54    -ms-transform: translateY(40px);
     55    -o-transform: translateY(40px);
     56    transform: translateY(40px); }
     57  30%, 70% {
     58    opacity: 1;
     59    -webkit-transform: translateY(0px);
     60    -moz-transform: translateY(0px);
     61    -ms-transform: translateY(0px);
     62    -o-transform: translateY(0px);
     63    transform: translateY(0px); }
     64  100% {
     65    opacity: 0;
     66    -webkit-transform: translateY(-40px);
     67    -moz-transform: translateY(-40px);
     68    -ms-transform: translateY(-40px);
     69    -o-transform: translateY(-40px);
     70    transform: translateY(-40px); } }
     71@-webkit-keyframes slide-in {
     72  0% {
     73    opacity: 0;
     74    -webkit-transform: translateY(40px);
     75    -moz-transform: translateY(40px);
     76    -ms-transform: translateY(40px);
     77    -o-transform: translateY(40px);
     78    transform: translateY(40px); }
     79  30% {
     80    opacity: 1;
     81    -webkit-transform: translateY(0px);
     82    -moz-transform: translateY(0px);
     83    -ms-transform: translateY(0px);
     84    -o-transform: translateY(0px);
     85    transform: translateY(0px); } }
     86@-moz-keyframes slide-in {
     87  0% {
     88    opacity: 0;
     89    -webkit-transform: translateY(40px);
     90    -moz-transform: translateY(40px);
     91    -ms-transform: translateY(40px);
     92    -o-transform: translateY(40px);
     93    transform: translateY(40px); }
     94  30% {
     95    opacity: 1;
     96    -webkit-transform: translateY(0px);
     97    -moz-transform: translateY(0px);
     98    -ms-transform: translateY(0px);
     99    -o-transform: translateY(0px);
     100    transform: translateY(0px); } }
     101@keyframes slide-in {
     102  0% {
     103    opacity: 0;
     104    -webkit-transform: translateY(40px);
     105    -moz-transform: translateY(40px);
     106    -ms-transform: translateY(40px);
     107    -o-transform: translateY(40px);
     108    transform: translateY(40px); }
     109  30% {
     110    opacity: 1;
     111    -webkit-transform: translateY(0px);
     112    -moz-transform: translateY(0px);
     113    -ms-transform: translateY(0px);
     114    -o-transform: translateY(0px);
     115    transform: translateY(0px); } }
     116@-webkit-keyframes pulse {
     117  0% {
     118    -webkit-transform: scale(1);
     119    -moz-transform: scale(1);
     120    -ms-transform: scale(1);
     121    -o-transform: scale(1);
     122    transform: scale(1); }
     123  10% {
     124    -webkit-transform: scale(1.1);
     125    -moz-transform: scale(1.1);
     126    -ms-transform: scale(1.1);
     127    -o-transform: scale(1.1);
     128    transform: scale(1.1); }
     129  20% {
     130    -webkit-transform: scale(1);
     131    -moz-transform: scale(1);
     132    -ms-transform: scale(1);
     133    -o-transform: scale(1);
     134    transform: scale(1); } }
     135@-moz-keyframes pulse {
     136  0% {
     137    -webkit-transform: scale(1);
     138    -moz-transform: scale(1);
     139    -ms-transform: scale(1);
     140    -o-transform: scale(1);
     141    transform: scale(1); }
     142  10% {
     143    -webkit-transform: scale(1.1);
     144    -moz-transform: scale(1.1);
     145    -ms-transform: scale(1.1);
     146    -o-transform: scale(1.1);
     147    transform: scale(1.1); }
     148  20% {
     149    -webkit-transform: scale(1);
     150    -moz-transform: scale(1);
     151    -ms-transform: scale(1);
     152    -o-transform: scale(1);
     153    transform: scale(1); } }
     154@keyframes pulse {
     155  0% {
     156    -webkit-transform: scale(1);
     157    -moz-transform: scale(1);
     158    -ms-transform: scale(1);
     159    -o-transform: scale(1);
     160    transform: scale(1); }
     161  10% {
     162    -webkit-transform: scale(1.1);
     163    -moz-transform: scale(1.1);
     164    -ms-transform: scale(1.1);
     165    -o-transform: scale(1.1);
     166    transform: scale(1.1); }
     167  20% {
     168    -webkit-transform: scale(1);
     169    -moz-transform: scale(1);
     170    -ms-transform: scale(1);
     171    -o-transform: scale(1);
     172    transform: scale(1); } }
     173.dropzone, .dropzone * {
     174  box-sizing: border-box; }
    12175
    13176.dropzone {
    14     position: relative;
    15     padding: 1em;
    16 }
    17 .dropzone.dz-clickable {
    18     cursor: pointer;
    19 }
    20 .dropzone.dz-clickable .dz-message,
    21 .dropzone.dz-clickable .dz-message span {
    22     cursor: pointer;
    23 }
    24 .dropzone.dz-clickable * {
    25     cursor: default;
    26 }
    27 .dropzone .dz-message {
    28     opacity: 1;
    29     -ms-filter: none;
    30     filter: none;
    31 }
    32 .dropzone.dz-drag-hover {
    33     border-color: rgba(0,0,0,0.15);
    34     background: rgba(0,0,0,0.04);
    35 }
    36 .dropzone.dz-started .dz-message {
    37     display: none;
    38 }
    39 .dropzone .dz-preview,
    40 .dropzone-previews .dz-preview {
    41     background: rgba(255,255,255,0.8);
     177  min-height: 150px;
     178  border: 2px solid rgba(0, 0, 0, 0.3);
     179  background: white;
     180  padding: 20px 20px; }
     181  .dropzone.dz-clickable {
     182    cursor: pointer; }
     183    .dropzone.dz-clickable * {
     184      cursor: default; }
     185    .dropzone.dz-clickable .dz-message, .dropzone.dz-clickable .dz-message * {
     186      cursor: pointer; }
     187  .dropzone.dz-started .dz-message {
     188    display: none; }
     189  .dropzone.dz-drag-hover {
     190    border-style: solid; }
     191    .dropzone.dz-drag-hover .dz-message {
     192      opacity: 0.5; }
     193  .dropzone .dz-message {
     194    text-align: center;
     195    margin: 2em 0; }
     196  .dropzone .dz-preview {
    42197    position: relative;
    43198    display: inline-block;
     199    vertical-align: top;
    44200    margin: 16px;
    45     vertical-align: top;
    46     border: 1px solid #acacac;
    47     padding: 6px 6px 6px 6px;
    48 }
    49 .dropzone .dz-preview.dz-file-preview [data-dz-thumbnail],
    50 .dropzone-previews .dz-preview.dz-file-preview [data-dz-thumbnail] {
    51     display: none;
    52 }
    53 .dropzone .dz-preview .dz-details,
    54 .dropzone-previews .dz-preview .dz-details {
    55     width: 100px;
    56     height: 100px;
    57     position: relative;
    58     background: #ebebeb;
    59     padding: 5px;
    60     margin-bottom: 22px;
    61 }
    62 .dropzone .dz-preview .dz-details .dz-filename,
    63 .dropzone-previews .dz-preview .dz-details .dz-filename {
    64     overflow: hidden;
    65     height: 100%;
    66 }
    67 .dropzone .dz-preview .dz-details img,
    68 .dropzone-previews .dz-preview .dz-details img {
    69     position: absolute;
    70     top: 0;
    71     left: 0;
    72     width: 100px;
    73     height: 100px;
    74 }
    75 .dropzone .dz-preview .dz-details .dz-size,
    76 .dropzone-previews .dz-preview .dz-details .dz-size {
    77     position: absolute;
    78     bottom: -28px;
    79     left: 3px;
    80     height: 28px;
    81     line-height: 28px;
    82 }
    83 .dropzone .dz-preview.dz-error .dz-error-mark,
    84 .dropzone-previews .dz-preview.dz-error .dz-error-mark {
    85     display: block;
    86 }
    87 .dropzone .dz-preview.dz-success .dz-success-mark,
    88 .dropzone-previews .dz-preview.dz-success .dz-success-mark {
    89     display: block;
    90 }
    91 .dropzone .dz-preview:hover .dz-details img,
    92 .dropzone-previews .dz-preview:hover .dz-details img {
    93     display: none;
    94 }
    95 .dropzone .dz-preview .dz-success-mark,
    96 .dropzone-previews .dz-preview .dz-success-mark,
    97 .dropzone .dz-preview .dz-error-mark,
    98 .dropzone-previews .dz-preview .dz-error-mark {
    99     display: none;
    100     position: absolute;
    101     width: 40px;
    102     height: 40px;
    103     font-size: 30px;
    104     text-align: center;
    105     right: -10px;
    106     top: -10px;
    107 }
    108 .dropzone .dz-preview .dz-success-mark,
    109 .dropzone-previews .dz-preview .dz-success-mark {
    110     color: #8cc657;
    111 }
    112 .dropzone .dz-preview .dz-error-mark,
    113 .dropzone-previews .dz-preview .dz-error-mark {
    114     color: #ee162d;
    115 }
    116 .dropzone .dz-preview .dz-progress,
    117 .dropzone-previews .dz-preview .dz-progress {
    118     position: absolute;
    119     top: 100px;
    120     left: 6px;
    121     right: 6px;
    122     height: 6px;
    123     background: #d7d7d7;
    124     display: none;
    125 }
    126 .dropzone .dz-preview .dz-progress .dz-upload,
    127 .dropzone-previews .dz-preview .dz-progress .dz-upload {
    128     display: block;
    129     position: absolute;
    130     top: 0;
    131     bottom: 0;
    132     left: 0;
    133     width: 0%;
    134     background-color: #8cc657;
    135 }
    136 .dropzone .dz-preview.dz-processing .dz-progress,
    137 .dropzone-previews .dz-preview.dz-processing .dz-progress {
    138     display: block;
    139 }
    140 .dropzone .dz-preview .dz-error-message,
    141 .dropzone-previews .dz-preview .dz-error-message {
    142     display: none;
    143     position: absolute;
    144     top: 25px;
    145     left:5px;
    146     background: rgba(245,245,245,0.8);
    147     padding: 8px 10px;
    148     color: #800;
    149     width: 101px;
    150     font-size: 0.8rem;
    151     z-index: 500;
    152 }
    153 .dropzone .dz-preview:hover.dz-error .dz-error-message,
    154 .dropzone-previews .dz-preview:hover.dz-error .dz-error-message {
    155     display: block;
    156 }
     201    min-height: 100px; }
     202    .dropzone .dz-preview:hover {
     203      z-index: 1000; }
     204      .dropzone .dz-preview:hover .dz-details {
     205        opacity: 1; }
     206    .dropzone .dz-preview.dz-file-preview .dz-image {
     207      border-radius: 20px;
     208      background: #999;
     209      background: linear-gradient(to bottom, #eee, #ddd); }
     210    .dropzone .dz-preview.dz-file-preview .dz-details {
     211      opacity: 1; }
     212    .dropzone .dz-preview.dz-image-preview {
     213      background: white; }
     214      .dropzone .dz-preview.dz-image-preview .dz-details {
     215        -webkit-transition: opacity 0.2s linear;
     216        -moz-transition: opacity 0.2s linear;
     217        -ms-transition: opacity 0.2s linear;
     218        -o-transition: opacity 0.2s linear;
     219        transition: opacity 0.2s linear; }
     220    .dropzone .dz-preview .dz-remove {
     221      font-size: 14px;
     222      text-align: center;
     223      display: block;
     224      cursor: pointer;
     225      border: none; }
     226      .dropzone .dz-preview .dz-remove:hover {
     227        text-decoration: underline; }
     228    .dropzone .dz-preview:hover .dz-details {
     229      opacity: 1; }
     230    .dropzone .dz-preview .dz-details {
     231      z-index: 20;
     232      position: absolute;
     233      top: 0;
     234      left: 0;
     235      opacity: 0;
     236      font-size: 13px;
     237      min-width: 100%;
     238      max-width: 100%;
     239      padding: 2em 1em;
     240      text-align: center;
     241      color: rgba(0, 0, 0, 0.9);
     242      line-height: 150%; }
     243      .dropzone .dz-preview .dz-details .dz-size {
     244        margin-bottom: 1em;
     245        font-size: 16px; }
     246      .dropzone .dz-preview .dz-details .dz-filename {
     247        white-space: nowrap; }
     248        .dropzone .dz-preview .dz-details .dz-filename:hover span {
     249          border: 1px solid rgba(200, 200, 200, 0.8);
     250          background-color: rgba(255, 255, 255, 0.8); }
     251        .dropzone .dz-preview .dz-details .dz-filename:not(:hover) {
     252          overflow: hidden;
     253          text-overflow: ellipsis; }
     254          .dropzone .dz-preview .dz-details .dz-filename:not(:hover) span {
     255            border: 1px solid transparent; }
     256      .dropzone .dz-preview .dz-details .dz-filename span, .dropzone .dz-preview .dz-details .dz-size span {
     257        background-color: rgba(255, 255, 255, 0.4);
     258        padding: 0 0.4em;
     259        border-radius: 3px; }
     260    .dropzone .dz-preview:hover .dz-image img {
     261      -webkit-transform: scale(1.05, 1.05);
     262      -moz-transform: scale(1.05, 1.05);
     263      -ms-transform: scale(1.05, 1.05);
     264      -o-transform: scale(1.05, 1.05);
     265      transform: scale(1.05, 1.05);
     266      -webkit-filter: blur(8px);
     267      filter: blur(8px); }
     268    .dropzone .dz-preview .dz-image {
     269      border-radius: 20px;
     270      overflow: hidden;
     271      width: 120px;
     272      height: 120px;
     273      position: relative;
     274      display: block;
     275      z-index: 10; }
     276      .dropzone .dz-preview .dz-image img {
     277        display: block; }
     278    .dropzone .dz-preview.dz-success .dz-success-mark {
     279      -webkit-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
     280      -moz-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
     281      -ms-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
     282      -o-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
     283      animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1); }
     284    .dropzone .dz-preview.dz-error .dz-error-mark {
     285      opacity: 1;
     286      -webkit-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
     287      -moz-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
     288      -ms-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
     289      -o-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
     290      animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1); }
     291    .dropzone .dz-preview .dz-success-mark, .dropzone .dz-preview .dz-error-mark {
     292      pointer-events: none;
     293      opacity: 0;
     294      z-index: 500;
     295      position: absolute;
     296      display: block;
     297      top: 50%;
     298      left: 50%;
     299      margin-left: -27px;
     300      margin-top: -27px; }
     301      .dropzone .dz-preview .dz-success-mark svg, .dropzone .dz-preview .dz-error-mark svg {
     302        display: block;
     303        width: 54px;
     304        height: 54px; }
     305    .dropzone .dz-preview.dz-processing .dz-progress {
     306      opacity: 1;
     307      -webkit-transition: all 0.2s linear;
     308      -moz-transition: all 0.2s linear;
     309      -ms-transition: all 0.2s linear;
     310      -o-transition: all 0.2s linear;
     311      transition: all 0.2s linear; }
     312    .dropzone .dz-preview.dz-complete .dz-progress {
     313      opacity: 0;
     314      -webkit-transition: opacity 0.4s ease-in;
     315      -moz-transition: opacity 0.4s ease-in;
     316      -ms-transition: opacity 0.4s ease-in;
     317      -o-transition: opacity 0.4s ease-in;
     318      transition: opacity 0.4s ease-in; }
     319    .dropzone .dz-preview:not(.dz-processing) .dz-progress {
     320      -webkit-animation: pulse 6s ease infinite;
     321      -moz-animation: pulse 6s ease infinite;
     322      -ms-animation: pulse 6s ease infinite;
     323      -o-animation: pulse 6s ease infinite;
     324      animation: pulse 6s ease infinite; }
     325    .dropzone .dz-preview .dz-progress {
     326      opacity: 1;
     327      z-index: 1000;
     328      pointer-events: none;
     329      position: absolute;
     330      height: 16px;
     331      left: 50%;
     332      top: 50%;
     333      margin-top: -8px;
     334      width: 80px;
     335      margin-left: -40px;
     336      background: rgba(255, 255, 255, 0.9);
     337      -webkit-transform: scale(1);
     338      border-radius: 8px;
     339      overflow: hidden; }
     340      .dropzone .dz-preview .dz-progress .dz-upload {
     341        background: #333;
     342        background: linear-gradient(to bottom, #666, #444);
     343        position: absolute;
     344        top: 0;
     345        left: 0;
     346        bottom: 0;
     347        width: 0;
     348        -webkit-transition: width 300ms ease-in-out;
     349        -moz-transition: width 300ms ease-in-out;
     350        -ms-transition: width 300ms ease-in-out;
     351        -o-transition: width 300ms ease-in-out;
     352        transition: width 300ms ease-in-out; }
     353    .dropzone .dz-preview.dz-error .dz-error-message {
     354      display: block; }
     355    .dropzone .dz-preview.dz-error:hover .dz-error-message {
     356      opacity: 1;
     357      pointer-events: auto; }
     358    .dropzone .dz-preview .dz-error-message {
     359      pointer-events: none;
     360      z-index: 1000;
     361      position: absolute;
     362      display: block;
     363      display: none;
     364      opacity: 0;
     365      -webkit-transition: opacity 0.3s ease;
     366      -moz-transition: opacity 0.3s ease;
     367      -ms-transition: opacity 0.3s ease;
     368      -o-transition: opacity 0.3s ease;
     369      transition: opacity 0.3s ease;
     370      border-radius: 8px;
     371      font-size: 13px;
     372      top: 130px;
     373      left: -10px;
     374      width: 140px;
     375      background: #be2626;
     376      background: linear-gradient(to bottom, #be2626, #a92222);
     377      padding: 0.5em 1.2em;
     378      color: white; }
     379      .dropzone .dz-preview .dz-error-message:after {
     380        content: '';
     381        position: absolute;
     382        top: -6px;
     383        left: 64px;
     384        width: 0;
     385        height: 0;
     386        border-left: 6px solid transparent;
     387        border-right: 6px solid transparent;
     388        border-bottom: 6px solid #be2626; }
  • _plugins_/uploadhtml5/trunk/lib/dropzone/dropzone.js

    r88793 r88798  
    1 
    2 ;(function(){
    3 
    4 /**
    5  * Require the module at `name`.
    6  *
    7  * @param {String} name
    8  * @return {Object} exports
    9  * @api public
    10  */
    11 
    12 function require(name) {
    13   var module = require.modules[name];
    14   if (!module) throw new Error('failed to require "' + name + '"');
    15 
    16   if (!('exports' in module) && typeof module.definition === 'function') {
    17     module.client = module.component = true;
    18     module.definition.call(this, module.exports = {}, module);
    19     delete module.definition;
    20   }
    21 
    22   return module.exports;
    23 }
    24 
    25 /**
    26  * Registered modules.
    27  */
    28 
    29 require.modules = {};
    30 
    31 /**
    32  * Register module at `name` with callback `definition`.
    33  *
    34  * @param {String} name
    35  * @param {Function} definition
    36  * @api private
    37  */
    38 
    39 require.register = function (name, definition) {
    40   require.modules[name] = {
    41     definition: definition
    42   };
    43 };
    44 
    45 /**
    46  * Define a module's exports immediately with `exports`.
    47  *
    48  * @param {String} name
    49  * @param {Generic} exports
    50  * @api private
    51  */
    52 
    53 require.define = function (name, exports) {
    54   require.modules[name] = {
    55     exports: exports
    56   };
    57 };
    58 require.register("dropzone", function (exports, module) {
    59 
    60 
    61 /**
    62  * Exposing dropzone
    63  */
    64 module.exports = require("dropzone/lib/dropzone.js");
    65 
    66 });
    67 
    68 require.register("dropzone/lib/dropzone.js", function (exports, module) {
    691
    702/*
     
    192124      createImageThumbnails: true,
    193125      maxThumbnailFilesize: 10,
    194       thumbnailWidth: 100,
    195       thumbnailHeight: 100,
     126      thumbnailWidth: 120,
     127      thumbnailHeight: 120,
     128      filesizeBase: 1000,
    196129      maxFiles: null,
     130      filesizeBase: 1000,
    197131      params: {},
    198132      clickable: true,
     
    371305      },
    372306      thumbnail: function(file, dataUrl) {
    373         var thumbnailElement, _i, _len, _ref, _results;
     307        var thumbnailElement, _i, _len, _ref;
    374308        if (file.previewElement) {
    375309          file.previewElement.classList.remove("dz-file-preview");
    376           file.previewElement.classList.add("dz-image-preview");
    377310          _ref = file.previewElement.querySelectorAll("[data-dz-thumbnail]");
    378           _results = [];
    379311          for (_i = 0, _len = _ref.length; _i < _len; _i++) {
    380312            thumbnailElement = _ref[_i];
    381313            thumbnailElement.alt = file.name;
    382             _results.push(thumbnailElement.src = dataUrl);
    383           }
    384           return _results;
     314            thumbnailElement.src = dataUrl;
     315          }
     316          return setTimeout(((function(_this) {
     317            return function() {
     318              return file.previewElement.classList.add("dz-image-preview");
     319            };
     320          })(this)), 1);
    385321        }
    386322      },
     
    442378      complete: function(file) {
    443379        if (file._removeLink) {
    444           return file._removeLink.textContent = this.options.dictRemoveFile;
     380          file._removeLink.textContent = this.options.dictRemoveFile;
     381        }
     382        if (file.previewElement) {
     383          return file.previewElement.classList.add("dz-complete");
    445384        }
    446385      },
     
    449388      maxfilesreached: noop,
    450389      queuecomplete: noop,
    451       previewTemplate: "<div class=\"dz-preview dz-file-preview\">\n  <div class=\"dz-details\">\n    <div class=\"dz-filename\"><span data-dz-name></span></div>\n    <div class=\"dz-size\" data-dz-size></div>\n    <img data-dz-thumbnail />\n  </div>\n  <div class=\"dz-progress\"><span class=\"dz-upload\" data-dz-uploadprogress></span></div>\n  <div class=\"dz-success-mark\"><span>✔</span></div>\n  <div class=\"dz-error-mark\"><span>✘</span></div>\n  <div class=\"dz-error-message\"><span data-dz-errormessage></span></div>\n</div>"
     390      previewTemplate: "<div class=\"dz-preview dz-file-preview\">\n  <div class=\"dz-image\"><img data-dz-thumbnail /></div>\n  <div class=\"dz-details\">\n    <div class=\"dz-size\"><span data-dz-size></span></div>\n    <div class=\"dz-filename\"><span data-dz-name></span></div>\n  </div>\n  <div class=\"dz-progress\"><span class=\"dz-upload\" data-dz-uploadprogress></span></div>\n  <div class=\"dz-error-message\"><span data-dz-errormessage></span></div>\n  <div class=\"dz-success-mark\">\n    <svg width=\"54px\" height=\"54px\" viewBox=\"0 0 54 54\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" xmlns:sketch=\"http://www.bohemiancoding.com/sketch/ns\">\n      <title>Check</title>\n      <defs></defs>\n      <g id=\"Page-1\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\" sketch:type=\"MSPage\">\n        <path d=\"M23.5,31.8431458 L17.5852419,25.9283877 C16.0248253,24.3679711 13.4910294,24.366835 11.9289322,25.9289322 C10.3700136,27.4878508 10.3665912,30.0234455 11.9283877,31.5852419 L20.4147581,40.0716123 C20.5133999,40.1702541 20.6159315,40.2626649 20.7218615,40.3488435 C22.2835669,41.8725651 24.794234,41.8626202 26.3461564,40.3106978 L43.3106978,23.3461564 C44.8771021,21.7797521 44.8758057,19.2483887 43.3137085,17.6862915 C41.7547899,16.1273729 39.2176035,16.1255422 37.6538436,17.6893022 L23.5,31.8431458 Z M27,53 C41.3594035,53 53,41.3594035 53,27 C53,12.6405965 41.3594035,1 27,1 C12.6405965,1 1,12.6405965 1,27 C1,41.3594035 12.6405965,53 27,53 Z\" id=\"Oval-2\" stroke-opacity=\"0.198794158\" stroke=\"#747474\" fill-opacity=\"0.816519475\" fill=\"#FFFFFF\" sketch:type=\"MSShapeGroup\"></path>\n      </g>\n    </svg>\n  </div>\n  <div class=\"dz-error-mark\">\n    <svg width=\"54px\" height=\"54px\" viewBox=\"0 0 54 54\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" xmlns:sketch=\"http://www.bohemiancoding.com/sketch/ns\">\n      <title>Error</title>\n      <defs></defs>\n      <g id=\"Page-1\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\" sketch:type=\"MSPage\">\n        <g id=\"Check-+-Oval-2\" sketch:type=\"MSLayerGroup\" stroke=\"#747474\" stroke-opacity=\"0.198794158\" fill=\"#FFFFFF\" fill-opacity=\"0.816519475\">\n          <path d=\"M32.6568542,29 L38.3106978,23.3461564 C39.8771021,21.7797521 39.8758057,19.2483887 38.3137085,17.6862915 C36.7547899,16.1273729 34.2176035,16.1255422 32.6538436,17.6893022 L27,23.3431458 L21.3461564,17.6893022 C19.7823965,16.1255422 17.2452101,16.1273729 15.6862915,17.6862915 C14.1241943,19.2483887 14.1228979,21.7797521 15.6893022,23.3461564 L21.3431458,29 L15.6893022,34.6538436 C14.1228979,36.2202479 14.1241943,38.7516113 15.6862915,40.3137085 C17.2452101,41.8726271 19.7823965,41.8744578 21.3461564,40.3106978 L27,34.6568542 L32.6538436,40.3106978 C34.2176035,41.8744578 36.7547899,41.8726271 38.3137085,40.3137085 C39.8758057,38.7516113 39.8771021,36.2202479 38.3106978,34.6538436 L32.6568542,29 Z M27,53 C41.3594035,53 53,41.3594035 53,27 C53,12.6405965 41.3594035,1 27,1 C12.6405965,1 1,12.6405965 1,27 C1,41.3594035 12.6405965,53 27,53 Z\" id=\"Oval-2\" sketch:type=\"MSShapeGroup\"></path>\n        </g>\n      </g>\n    </svg>\n  </div>\n</div>"
    452391    };
    453392
     
    875814
    876815    Dropzone.prototype.filesize = function(size) {
    877       var string;
    878       if (size >= 1024 * 1024 * 1024 * 1024 / 10) {
    879         size = size / (1024 * 1024 * 1024 * 1024 / 10);
    880         string = "TiB";
    881       } else if (size >= 1024 * 1024 * 1024 / 10) {
    882         size = size / (1024 * 1024 * 1024 / 10);
    883         string = "GiB";
    884       } else if (size >= 1024 * 1024 / 10) {
    885         size = size / (1024 * 1024 / 10);
    886         string = "MiB";
    887       } else if (size >= 1024 / 10) {
    888         size = size / (1024 / 10);
    889         string = "KiB";
    890       } else {
    891         size = size * 10;
    892         string = "b";
    893       }
    894       return "<strong>" + (Math.round(size) / 10) + "</strong> " + string;
     816      var cutoff, i, selectedSize, selectedUnit, unit, units, _i, _len;
     817      units = ['TB', 'GB', 'MB', 'KB', 'b'];
     818      selectedSize = selectedUnit = null;
     819      for (i = _i = 0, _len = units.length; _i < _len; i = ++_i) {
     820        unit = units[i];
     821        cutoff = Math.pow(this.options.filesizeBase, 4 - i) / 10;
     822        if (size >= cutoff) {
     823          selectedSize = size / Math.pow(this.options.filesizeBase, 4 - i);
     824          selectedUnit = unit;
     825          break;
     826        }
     827      }
     828      selectedSize = Math.round(10 * selectedSize) / 10;
     829      return "<strong>" + selectedSize + "</strong> " + selectedUnit;
    895830    };
    896831
     
    11201055      fileReader.onload = (function(_this) {
    11211056        return function() {
    1122           var img;
    11231057          if (file.type === "image/svg+xml") {
    11241058            _this.emit("thumbnail", file, fileReader.result);
     
    11281062            return;
    11291063          }
    1130           img = document.createElement("img");
    1131           img.onload = function() {
    1132             var canvas, ctx, resizeInfo, thumbnail, _ref, _ref1, _ref2, _ref3;
    1133             file.width = img.width;
    1134             file.height = img.height;
    1135             resizeInfo = _this.options.resize.call(_this, file);
    1136             if (resizeInfo.trgWidth == null) {
    1137               resizeInfo.trgWidth = resizeInfo.optWidth;
    1138             }
    1139             if (resizeInfo.trgHeight == null) {
    1140               resizeInfo.trgHeight = resizeInfo.optHeight;
    1141             }
    1142             canvas = document.createElement("canvas");
    1143             ctx = canvas.getContext("2d");
    1144             canvas.width = resizeInfo.trgWidth;
    1145             canvas.height = resizeInfo.trgHeight;
    1146             drawImageIOSFix(ctx, img, (_ref = resizeInfo.srcX) != null ? _ref : 0, (_ref1 = resizeInfo.srcY) != null ? _ref1 : 0, resizeInfo.srcWidth, resizeInfo.srcHeight, (_ref2 = resizeInfo.trgX) != null ? _ref2 : 0, (_ref3 = resizeInfo.trgY) != null ? _ref3 : 0, resizeInfo.trgWidth, resizeInfo.trgHeight);
    1147             thumbnail = canvas.toDataURL("image/png");
    1148             _this.emit("thumbnail", file, thumbnail);
    1149             if (callback != null) {
    1150               return callback();
    1151             }
    1152           };
    1153           return img.src = fileReader.result;
     1064          return _this.createThumbnailFromUrl(file, fileReader.result, callback);
    11541065        };
    11551066      })(this);
    11561067      return fileReader.readAsDataURL(file);
     1068    };
     1069
     1070    Dropzone.prototype.createThumbnailFromUrl = function(file, imageUrl, callback) {
     1071      var img;
     1072      img = document.createElement("img");
     1073      img.onload = (function(_this) {
     1074        return function() {
     1075          var canvas, ctx, resizeInfo, thumbnail, _ref, _ref1, _ref2, _ref3;
     1076          file.width = img.width;
     1077          file.height = img.height;
     1078          resizeInfo = _this.options.resize.call(_this, file);
     1079          if (resizeInfo.trgWidth == null) {
     1080            resizeInfo.trgWidth = resizeInfo.optWidth;
     1081          }
     1082          if (resizeInfo.trgHeight == null) {
     1083            resizeInfo.trgHeight = resizeInfo.optHeight;
     1084          }
     1085          canvas = document.createElement("canvas");
     1086          ctx = canvas.getContext("2d");
     1087          canvas.width = resizeInfo.trgWidth;
     1088          canvas.height = resizeInfo.trgHeight;
     1089          drawImageIOSFix(ctx, img, (_ref = resizeInfo.srcX) != null ? _ref : 0, (_ref1 = resizeInfo.srcY) != null ? _ref1 : 0, resizeInfo.srcWidth, resizeInfo.srcHeight, (_ref2 = resizeInfo.trgX) != null ? _ref2 : 0, (_ref3 = resizeInfo.trgY) != null ? _ref3 : 0, resizeInfo.trgWidth, resizeInfo.trgHeight);
     1090          thumbnail = canvas.toDataURL("image/png");
     1091          _this.emit("thumbnail", file, thumbnail);
     1092          if (callback != null) {
     1093            return callback();
     1094          }
     1095        };
     1096      })(this);
     1097      if (callback != null) {
     1098        img.onerror = callback;
     1099      }
     1100      return img.src = imageUrl;
    11571101    };
    11581102
     
    14421386  })(Emitter);
    14431387
    1444   Dropzone.version = "3.12.0";
     1388  Dropzone.version = "4.0.1";
    14451389
    14461390  Dropzone.options = {};
     
    17831727
    17841728}).call(this);
    1785 
    1786 });
    1787 
    1788 if (typeof exports == "object") {
    1789   module.exports = require("dropzone");
    1790 } else if (typeof define == "function" && define.amd) {
    1791   define([], function(){ return require("dropzone"); });
    1792 } else {
    1793   this["Dropzone"] = require("dropzone");
    1794 }
    1795 })()
Note: See TracChangeset for help on using the changeset viewer.