Dropzone.js

├── LICENSE ├── README.md ├── README_CN.md ├── bin ├── examples │ ├── avatar │ │ ├── css │ │ │ ├── bootstrap.min.css │ │ │ ├── cropper.min.css │ │ │ ├── main.css │ │ │ └── qunit.css │ │ ├── img │ │ │ ├── loading.gif │ │ │ └── picture.jpg │ │ ├── index.html │ │ ├── js │ │ │ ├── bootstrap.min.js │ │ │ ├── cropper.min.js │ │ │ ├── jquery.min.js │ │ │ └── main.js │ │ └── server.py │ ├── simple │ │ ├── css │ │ │ ├── dropzone.css │ │ │ └── style.css │ │ ├── index.html │ │ ├── js │ │ │ └── dropzone.js │ │ ├── main.css │ │ ├── main.js │ │ └── server.py │ └── upload.html └── stack ├── gruntfile.js ├── package.json ├── src ├── .baseDir.ts ├── _all.d.ts ├── app.ts ├── route.ts ├── storage.ts └── storage │ ├── disk.ts │ ├── ftp.ts │ ├── hdfs.ts │ ├── maria.ts │ ├── memcached.ts │ ├── mongo.ts │ ├── pg.ts │ └── redis.ts ├── tslint.json └── typings.json /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2016 k9982874 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Stack - a distributed file storage service 2 | =========================== 3 | This is a distributed file storage service, the back-end through a variety of different drivers can be achieved with distributed file storage, front-end with HAProxy achieve high availability. 4 | 5 | Installing 6 | ---------- 7 | ```bash 8 | git clone http:///stack 9 | cd stack 10 | npm install 11 | node_modules/.bin/typings install 12 | ``` 13 | 14 | Usage 15 | ----- 16 | ```bash 17 | npm run grunt serve 18 | ``` 19 | 20 | API 21 | --- 22 | "upload" 23 | Accepts a `POST` request of type `multipart/form-data` and saves the data in the `file` field of the request to `local`. 24 | 25 | "file" 26 | Accept the `GET` request to get the saved file from `local`. 27 | 28 | 29 | Supported storage drivers 30 | ------------------------- 31 | "disk" 32 | Local disk drive, through this drive with `moosefs`, `GlusterFS`, `ceph` and other distributed file system can support distributed storage. 33 | 34 | "ftp" 35 | ftp driver. 36 | 37 | "hdfs" 38 | [hdfs driver.](https://hadoop.apache.org/) 39 | 40 | "maria" 41 | [maria driver.](https://mariadb.org/) 42 | 43 | "memcached" 44 | [memcached driver.](https://memcached.org/) 45 | 46 | "mongo" 47 | [mongodb driver.](https://www.mongodb.com/) 48 | 49 | "pg" 50 | [postgresql driver.](https://www.postgresql.org/) 51 | 52 | "redis" 53 | [redis driver.](http://redis.io/) 54 | -------------------------------------------------------------------------------- /README_CN.md: -------------------------------------------------------------------------------- 1 | Stack - 分布式文件存储服务 2 | =========================== 3 | 这是一个分布式文件存储服务，后端通过配合多种不同驱动可以实现分布式文件存储，前端配合`HAProxy`实现高可用性。 4 | 5 | 安装 6 | ---- 7 | ```bash 8 | git clone http:///stack 9 | cd stack 10 | npm install 11 | node_modules/.bin/typings install 12 | ``` 13 | 14 | 如何使用 15 | -------- 16 | ```bash 17 | npm run grunt serve 18 | ``` 19 | 20 | API 21 | --- 22 | "upload" 23 | 接受`multipart/form-data`类型的`POST`请求，保存请求中`file`字段的数据到“本地”。 24 | 25 | "file" 26 | 接受`GET`请求，从“本地”获取保存的文件。 27 | 28 | 29 | 后端支持引擎 30 | ------------ 31 | "disk" 32 | 本地磁盘驱动，通过此驱动配合`moosefs`、`GlusterFS`、`ceph`等分布式文件系统可支持分布式存储。 33 | 34 | "ftp" 35 | ftp服务器驱动。 36 | 37 | "hdfs" 38 | [hdfs driver。](https://hadoop.apache.org/) 39 | 40 | "maria" 41 | [maria driver。](https://mariadb.org/) 42 | 43 | "memcached" 44 | [memcached driver。](https://memcached.org/) 45 | 46 | "mongo" 47 | [mongodb driver。](https://www.mongodb.com/) 48 | 49 | "pg" 50 | [postgresql driver。](https://www.postgresql.org/) 51 | 52 | "redis" 53 | [redis driver。](http://redis.io/) 54 | -------------------------------------------------------------------------------- /bin/examples/avatar/css/cropper.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Cropper v2.3.4 3 | * https://github.com/fengyuanchen/cropper 4 | * 5 | * Copyright (c) 2014-2016 Fengyuan Chen and contributors 6 | * Released under the MIT license 7 | * 8 | * Date: 2016-09-03T05:50:45.412Z 9 | */.cropper-container{font-size:0;line-height:0;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;direction:ltr!important}.cropper-container img{display:block;width:100%;min-width:0!important;max-width:none!important;height:100%;min-height:0!important;max-height:none!important;image-orientation:0deg!important}.cropper-canvas,.cropper-crop-box,.cropper-drag-box,.cropper-modal,.cropper-wrap-box{position:absolute;top:0;right:0;bottom:0;left:0}.cropper-wrap-box{overflow:hidden}.cropper-drag-box{opacity:0;background-color:#fff;filter:alpha(opacity=0)}.cropper-dashed,.cropper-modal{opacity:.5;filter:alpha(opacity=50)}.cropper-modal{background-color:#000}.cropper-view-box{display:block;overflow:hidden;width:100%;height:100%;outline:#39f solid 1px;outline-color:rgba(51,153,255,.75)}.cropper-dashed{position:absolute;display:block;border:0 dashed #eee}.cropper-dashed.dashed-h{top:33.33333%;left:0;width:100%;height:33.33333%;border-top-width:1px;border-bottom-width:1px}.cropper-dashed.dashed-v{top:0;left:33.33333%;width:33.33333%;height:100%;border-right-width:1px;border-left-width:1px}.cropper-center{position:absolute;top:50%;left:50%;display:block;width:0;height:0;opacity:.75;filter:alpha(opacity=75)}.cropper-center:after,.cropper-center:before{position:absolute;display:block;content:' ';background-color:#eee}.cropper-center:before{top:0;left:-3px;width:7px;height:1px}.cropper-center:after{top:-3px;left:0;width:1px;height:7px}.cropper-face,.cropper-line,.cropper-point{position:absolute;display:block;width:100%;height:100%;opacity:.1;filter:alpha(opacity=10)}.cropper-face{top:0;left:0;background-color:#fff}.cropper-line,.cropper-point{background-color:#39f}.cropper-line.line-e{top:0;right:-3px;width:5px;cursor:e-resize}.cropper-line.line-n{top:-3px;left:0;height:5px;cursor:n-resize}.cropper-line.line-w{top:0;left:-3px;width:5px;cursor:w-resize}.cropper-line.line-s{bottom:-3px;left:0;height:5px;cursor:s-resize}.cropper-point{width:5px;height:5px;opacity:.75;filter:alpha(opacity=75)}.cropper-point.point-e{top:50%;right:-3px;margin-top:-3px;cursor:e-resize}.cropper-point.point-n{top:-3px;left:50%;margin-left:-3px;cursor:n-resize}.cropper-point.point-w{top:50%;left:-3px;margin-top:-3px;cursor:w-resize}.cropper-point.point-s{bottom:-3px;left:50%;margin-left:-3px;cursor:s-resize}.cropper-point.point-ne{top:-3px;right:-3px;cursor:ne-resize}.cropper-point.point-nw{top:-3px;left:-3px;cursor:nw-resize}.cropper-point.point-sw{bottom:-3px;left:-3px;cursor:sw-resize}.cropper-point.point-se{right:-3px;bottom:-3px;width:20px;height:20px;cursor:se-resize;opacity:1;filter:alpha(opacity=100)}.cropper-point.point-se:before{position:absolute;right:-50%;bottom:-50%;display:block;width:200%;height:200%;content:' ';opacity:0;background-color:#39f;filter:alpha(opacity=0)}@media (min-width:768px){.cropper-point.point-se{width:15px;height:15px}}@media (min-width:992px){.cropper-point.point-se{width:10px;height:10px}}@media (min-width:1200px){.cropper-point.point-se{width:5px;height:5px;opacity:.75;filter:alpha(opacity=75)}}.cropper-invisible{opacity:0;filter:alpha(opacity=0)}.cropper-bg{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC)}.cropper-hide{position:absolute;display:block;width:0;height:0}.cropper-hidden{display:none!important}.cropper-move{cursor:move}.cropper-crop{cursor:crosshair}.cropper-disabled .cropper-drag-box,.cropper-disabled .cropper-face,.cropper-disabled .cropper-line,.cropper-disabled .cropper-point{cursor:not-allowed} -------------------------------------------------------------------------------- /bin/examples/avatar/css/main.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: #fcfcfc; 3 | } 4 | 5 | .avatar-view { 6 | display: block; 7 | margin: 15% auto 5%; 8 | height: 220px; 9 | width: 220px; 10 | border: 3px solid #fff; 11 | border-radius: 5px; 12 | box-shadow: 0 0 5px rgba(0,0,0,.15); 13 | cursor: pointer; 14 | overflow: hidden; 15 | } 16 | 17 | .avatar-view img { 18 | width: 100%; 19 | } 20 | 21 | .avatar-body { 22 | padding-right: 15px; 23 | padding-left: 15px; 24 | } 25 | 26 | .avatar-upload { 27 | overflow: hidden; 28 | } 29 | 30 | .avatar-upload label { 31 | display: block; 32 | float: left; 33 | clear: left; 34 | width: 100px; 35 | } 36 | 37 | .avatar-upload input { 38 | display: block; 39 | margin-left: 110px; 40 | } 41 | 42 | .avatar-alert { 43 | margin-top: 10px; 44 | margin-bottom: 10px; 45 | } 46 | 47 | .avatar-wrapper { 48 | height: 364px; 49 | width: 100%; 50 | margin-top: 15px; 51 | box-shadow: inset 0 0 5px rgba(0,0,0,.25); 52 | background-color: #fcfcfc; 53 | overflow: hidden; 54 | } 55 | 56 | .avatar-wrapper img { 57 | display: block; 58 | height: auto; 59 | max-width: 100%; 60 | } 61 | 62 | .avatar-preview { 63 | float: left; 64 | margin-top: 15px; 65 | margin-right: 15px; 66 | border: 1px solid #eee; 67 | border-radius: 4px; 68 | background-color: #fff; 69 | overflow: hidden; 70 | } 71 | 72 | .avatar-preview:hover { 73 | border-color: #ccf; 74 | box-shadow: 0 0 5px rgba(0,0,0,.15); 75 | } 76 | 77 | .avatar-preview img { 78 | width: 100%; 79 | } 80 | 81 | .preview-lg { 82 | height: 184px; 83 | width: 184px; 84 | margin-top: 15px; 85 | } 86 | 87 | .preview-md { 88 | height: 100px; 89 | width: 100px; 90 | } 91 | 92 | .preview-sm { 93 | height: 50px; 94 | width: 50px; 95 | } 96 | 97 | @media (min-width: 992px) { 98 | .avatar-preview { 99 | float: none; 100 | } 101 | } 102 | 103 | .avatar-btns { 104 | margin-top: 30px; 105 | margin-bottom: 15px; 106 | } 107 | 108 | .avatar-btns .btn-group { 109 | margin-right: 5px; 110 | } 111 | 112 | .loading { 113 | display: none; 114 | position: absolute; 115 | top: 0; 116 | right: 0; 117 | bottom: 0; 118 | left: 0; 119 | background: #fff url("../img/loading.gif") no-repeat center center; 120 | opacity: .75; 121 | filter: alpha(opacity=75); 122 | z-index: 20140628; 123 | } 124 | -------------------------------------------------------------------------------- /bin/examples/avatar/css/qunit.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * QUnit 2.0.1 3 | * https://qunitjs.com/ 4 | * 5 | * Copyright jQuery Foundation and other contributors 6 | * Released under the MIT license 7 | * https://jquery.org/license 8 | * 9 | * Date: 2016-07-23T19:39Z 10 | */ 11 | 12 | /** Font Family and Sizes */ 13 | 14 | #qunit-tests, #qunit-header, #qunit-banner, #qunit-testrunner-toolbar, #qunit-filteredTest, #qunit-userAgent, #qunit-testresult { 15 | font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial, sans-serif; 16 | } 17 | 18 | #qunit-testrunner-toolbar, #qunit-filteredTest, #qunit-userAgent, #qunit-testresult, #qunit-tests li { font-size: small; } 19 | #qunit-tests { font-size: smaller; } 20 | 21 | 22 | /** Resets */ 23 | 24 | #qunit-tests, #qunit-header, #qunit-banner, #qunit-filteredTest, #qunit-userAgent, #qunit-testresult, #qunit-modulefilter { 25 | margin: 0; 26 | padding: 0; 27 | } 28 | 29 | 30 | /** Header (excluding toolbar) */ 31 | 32 | #qunit-header { 33 | padding: 0.5em 0 0.5em 1em; 34 | 35 | color: #8699A4; 36 | background-color: #0D3349; 37 | 38 | font-size: 1.5em; 39 | line-height: 1em; 40 | font-weight: 400; 41 | 42 | border-radius: 5px 5px 0 0; 43 | } 44 | 45 | #qunit-header a { 46 | text-decoration: none; 47 | color: #C2CCD1; 48 | } 49 | 50 | #qunit-header a:hover, 51 | #qunit-header a:focus { 52 | color: #FFF; 53 | } 54 | 55 | #qunit-banner { 56 | height: 5px; 57 | } 58 | 59 | #qunit-filteredTest { 60 | padding: 0.5em 1em 0.5em 1em; 61 | color: #366097; 62 | background-color: #F4FF77; 63 | } 64 | 65 | #qunit-userAgent { 66 | padding: 0.5em 1em 0.5em 1em; 67 | color: #FFF; 68 | background-color: #2B81AF; 69 | text-shadow: rgba(0, 0, 0, 0.5) 2px 2px 1px; 70 | } 71 | 72 | 73 | /** Toolbar */ 74 | 75 | #qunit-testrunner-toolbar { 76 | padding: 0.5em 1em 0.5em 1em; 77 | color: #5E740B; 78 | background-color: #EEE; 79 | } 80 | 81 | #qunit-testrunner-toolbar .clearfix { 82 | height: 0; 83 | clear: both; 84 | } 85 | 86 | #qunit-testrunner-toolbar label { 87 | display: inline-block; 88 | } 89 | 90 | #qunit-testrunner-toolbar input[type=checkbox], 91 | #qunit-testrunner-toolbar input[type=radio] { 92 | margin: 3px; 93 | vertical-align: -2px; 94 | } 95 | 96 | #qunit-testrunner-toolbar input[type=text] { 97 | box-sizing: border-box; 98 | height: 1.6em; 99 | } 100 | 101 | .qunit-url-config, 102 | .qunit-filter, 103 | #qunit-modulefilter { 104 | display: inline-block; 105 | line-height: 2.1em; 106 | } 107 | 108 | .qunit-filter, 109 | #qunit-modulefilter { 110 | float: right; 111 | position: relative; 112 | margin-left: 1em; 113 | } 114 | 115 | .qunit-url-config label { 116 | margin-right: 0.5em; 117 | } 118 | 119 | #qunit-modulefilter-search { 120 | box-sizing: border-box; 121 | width: 400px; 122 | } 123 | 124 | #qunit-modulefilter-search-container:after { 125 | position: absolute; 126 | right: 0.3em; 127 | content: "\25bc"; 128 | color: black; 129 | } 130 | 131 | #qunit-modulefilter-dropdown { 132 | /* align with #qunit-modulefilter-search */ 133 | box-sizing: border-box; 134 | width: 400px; 135 | position: absolute; 136 | right: 0; 137 | top: 50%; 138 | margin-top: 0.8em; 139 | 140 | border: 1px solid #D3D3D3; 141 | border-top: none; 142 | border-radius: 0 0 .25em .25em; 143 | color: #000; 144 | background-color: #F5F5F5; 145 | z-index: 99; 146 | } 147 | 148 | #qunit-modulefilter-dropdown a { 149 | color: inherit; 150 | text-decoration: none; 151 | } 152 | 153 | #qunit-modulefilter-dropdown .clickable.checked { 154 | font-weight: bold; 155 | color: #000; 156 | background-color: #D2E0E6; 157 | } 158 | 159 | #qunit-modulefilter-dropdown .clickable:hover { 160 | color: #FFF; 161 | background-color: #0D3349; 162 | } 163 | 164 | #qunit-modulefilter-actions { 165 | display: block; 166 | overflow: auto; 167 | 168 | /* align with #qunit-modulefilter-dropdown-list */ 169 | font: smaller/1.5em sans-serif; 170 | } 171 | 172 | #qunit-modulefilter-dropdown #qunit-modulefilter-actions > * { 173 | box-sizing: border-box; 174 | max-height: 2.8em; 175 | display: block; 176 | padding: 0.4em; 177 | } 178 | 179 | #qunit-modulefilter-dropdown #qunit-modulefilter-actions > button { 180 | float: right; 181 | font: inherit; 182 | } 183 | 184 | #qunit-modulefilter-dropdown #qunit-modulefilter-actions > :last-child { 185 | /* insert padding to align with checkbox margins */ 186 | padding-left: 3px; 187 | } 188 | 189 | #qunit-modulefilter-dropdown-list { 190 | max-height: 200px; 191 | overflow-y: auto; 192 | margin: 0; 193 | border-top: 2px groove threedhighlight; 194 | padding: 0.4em 0 0; 195 | font: smaller/1.5em sans-serif; 196 | } 197 | 198 | #qunit-modulefilter-dropdown-list li { 199 | white-space: nowrap; 200 | overflow: hidden; 201 | text-overflow: ellipsis; 202 | } 203 | 204 | #qunit-modulefilter-dropdown-list .clickable { 205 | display: block; 206 | padding-left: 0.15em; 207 | } 208 | 209 | 210 | /** Tests: Pass/Fail */ 211 | 212 | #qunit-tests { 213 | list-style-position: inside; 214 | } 215 | 216 | #qunit-tests li { 217 | padding: 0.4em 1em 0.4em 1em; 218 | border-bottom: 1px solid #FFF; 219 | list-style-position: inside; 220 | } 221 | 222 | #qunit-tests > li { 223 | display: none; 224 | } 225 | 226 | #qunit-tests li.running, 227 | #qunit-tests li.pass, 228 | #qunit-tests li.fail, 229 | #qunit-tests li.skipped { 230 | display: list-item; 231 | } 232 | 233 | #qunit-tests.hidepass { 234 | position: relative; 235 | } 236 | 237 | #qunit-tests.hidepass li.running, 238 | #qunit-tests.hidepass li.pass { 239 | visibility: hidden; 240 | position: absolute; 241 | width: 0; 242 | height: 0; 243 | padding: 0; 244 | border: 0; 245 | margin: 0; 246 | } 247 | 248 | #qunit-tests li strong { 249 | cursor: pointer; 250 | } 251 | 252 | #qunit-tests li.skipped strong { 253 | cursor: default; 254 | } 255 | 256 | #qunit-tests li a { 257 | padding: 0.5em; 258 | color: #C2CCD1; 259 | text-decoration: none; 260 | } 261 | 262 | #qunit-tests li p a { 263 | padding: 0.25em; 264 | color: #6B6464; 265 | } 266 | #qunit-tests li a:hover, 267 | #qunit-tests li a:focus { 268 | color: #000; 269 | } 270 | 271 | #qunit-tests li .runtime { 272 | float: right; 273 | font-size: smaller; 274 | } 275 | 276 | .qunit-assert-list { 277 | margin-top: 0.5em; 278 | padding: 0.5em; 279 | 280 | background-color: #FFF; 281 | 282 | border-radius: 5px; 283 | } 284 | 285 | .qunit-source { 286 | margin: 0.6em 0 0.3em; 287 | } 288 | 289 | .qunit-collapsed { 290 | display: none; 291 | } 292 | 293 | #qunit-tests table { 294 | border-collapse: collapse; 295 | margin-top: 0.2em; 296 | } 297 | 298 | #qunit-tests th { 299 | text-align: right; 300 | vertical-align: top; 301 | padding: 0 0.5em 0 0; 302 | } 303 | 304 | #qunit-tests td { 305 | vertical-align: top; 306 | } 307 | 308 | #qunit-tests pre { 309 | margin: 0; 310 | white-space: pre-wrap; 311 | word-wrap: break-word; 312 | } 313 | 314 | #qunit-tests del { 315 | color: #374E0C; 316 | background-color: #E0F2BE; 317 | text-decoration: none; 318 | } 319 | 320 | #qunit-tests ins { 321 | color: #500; 322 | background-color: #FFCACA; 323 | text-decoration: none; 324 | } 325 | 326 | /*** Test Counts */ 327 | 328 | #qunit-tests b.counts { color: #000; } 329 | #qunit-tests b.passed { color: #5E740B; } 330 | #qunit-tests b.failed { color: #710909; } 331 | 332 | #qunit-tests li li { 333 | padding: 5px; 334 | background-color: #FFF; 335 | border-bottom: none; 336 | list-style-position: inside; 337 | } 338 | 339 | /*** Passing Styles */ 340 | 341 | #qunit-tests li li.pass { 342 | color: #3C510C; 343 | background-color: #FFF; 344 | border-left: 10px solid #C6E746; 345 | } 346 | 347 | #qunit-tests .pass { color: #528CE0; background-color: #D2E0E6; } 348 | #qunit-tests .pass .test-name { color: #366097; } 349 | 350 | #qunit-tests .pass .test-actual, 351 | #qunit-tests .pass .test-expected { color: #999; } 352 | 353 | #qunit-banner.qunit-pass { background-color: #C6E746; } 354 | 355 | /*** Failing Styles */ 356 | 357 | #qunit-tests li li.fail { 358 | color: #710909; 359 | background-color: #FFF; 360 | border-left: 10px solid #EE5757; 361 | white-space: pre; 362 | } 363 | 364 | #qunit-tests > li:last-child { 365 | border-radius: 0 0 5px 5px; 366 | } 367 | 368 | #qunit-tests .fail { color: #000; background-color: #EE5757; } 369 | #qunit-tests .fail .test-name, 370 | #qunit-tests .fail .module-name { color: #000; } 371 | 372 | #qunit-tests .fail .test-actual { color: #EE5757; } 373 | #qunit-tests .fail .test-expected { color: #008000; } 374 | 375 | #qunit-banner.qunit-fail { background-color: #EE5757; } 376 | 377 | /*** Skipped tests */ 378 | 379 | #qunit-tests .skipped { 380 | background-color: #EBECE9; 381 | } 382 | 383 | #qunit-tests .qunit-skipped-label { 384 | background-color: #F4FF77; 385 | display: inline-block; 386 | font-style: normal; 387 | color: #366097; 388 | line-height: 1.8em; 389 | padding: 0 0.5em; 390 | margin: -0.4em 0.4em -0.4em 0; 391 | } 392 | 393 | /** Result */ 394 | 395 | #qunit-testresult { 396 | padding: 0.5em 1em 0.5em 1em; 397 | 398 | color: #2B81AF; 399 | background-color: #D2E0E6; 400 | 401 | border-bottom: 1px solid #FFF; 402 | } 403 | #qunit-testresult .module-name { 404 | font-weight: 700; 405 | } 406 | 407 | /** Fixture */ 408 | 409 | #qunit-fixture { 410 | position: absolute; 411 | top: -10000px; 412 | left: -10000px; 413 | width: 1000px; 414 | height: 1000px; 415 | } 416 | -------------------------------------------------------------------------------- /bin/examples/avatar/img/loading.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/k9982874/stack/3c1ff3b9dfd96556b3a3e09487cb0befc5e926a7/bin/examples/avatar/img/loading.gif -------------------------------------------------------------------------------- /bin/examples/avatar/img/picture.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/k9982874/stack/3c1ff3b9dfd96556b3a3e09487cb0befc5e926a7/bin/examples/avatar/img/picture.jpg -------------------------------------------------------------------------------- /bin/examples/avatar/index.html: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/k9982874/stack/3c1ff3b9dfd96556b3a3e09487cb0befc5e926a7/bin/examples/avatar/index.html -------------------------------------------------------------------------------- /bin/examples/avatar/js/bootstrap.min.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * Bootstrap v3.3.7 (http://getbootstrap.com) 3 | * Copyright 2011-2016 Twitter, Inc. 4 | * Licensed under the MIT license 5 | */ 6 | if("undefined"==typeof jQuery)throw new Error("Bootstrap's JavaScript requires jQuery");+function(a){"use strict";var b=a.fn.jquery.split(" ")[0].split(".");if(b[0]<2&&b[1]<9||1==b[0]&&9==b[1]&&b[2]<1||b[0]>3)throw new Error("Bootstrap's JavaScript requires jQuery version 1.9.1 or higher, but lower than version 4")}(jQuery),+function(a){"use strict";function b(){var a=document.createElement("bootstrap"),b={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"oTransitionEnd otransitionend",transition:"transitionend"};for(var c in b)if(void 0!==a.style[c])return{end:b[c]};return!1}a.fn.emulateTransitionEnd=function(b){var c=!1,d=this;a(this).one("bsTransitionEnd",function(){c=!0});var e=function(){c||a(d).trigger(a.support.transition.end)};return setTimeout(e,b),this},a(function(){a.support.transition=b(),a.support.transition&&(a.event.special.bsTransitionEnd={bindType:a.support.transition.end,delegateType:a.support.transition.end,handle:function(b){if(a(b.target).is(this))return b.handleObj.handler.apply(this,arguments)}})})}(jQuery),+function(a){"use strict";function b(b){return this.each(function(){var c=a(this),e=c.data("bs.alert");e||c.data("bs.alert",e=new d(this)),"string"==typeof b&&e[b].call(c)})}var c='[data-dismiss="alert"]',d=function(b){a(b).on("click",c,this.close)};d.VERSION="3.3.7",d.TRANSITION_DURATION=150,d.prototype.close=function(b){function c(){g.detach().trigger("closed.bs.alert").remove()}var e=a(this),f=e.attr("data-target");f||(f=e.attr("href"),f=f&&f.replace(/.*(?=#[^\s]*$)/,""));var g=a("#"===f?[]:f);b&&b.preventDefault(),g.length||(g=e.closest(".alert")),g.trigger(b=a.Event("close.bs.alert")),b.isDefaultPrevented()||(g.removeClass("in"),a.support.transition&&g.hasClass("fade")?g.one("bsTransitionEnd",c).emulateTransitionEnd(d.TRANSITION_DURATION):c())};var e=a.fn.alert;a.fn.alert=b,a.fn.alert.Constructor=d,a.fn.alert.noConflict=function(){return a.fn.alert=e,this},a(document).on("click.bs.alert.data-api",c,d.prototype.close)}(jQuery),+function(a){"use strict";function b(b){return this.each(function(){var d=a(this),e=d.data("bs.button"),f="object"==typeof b&&b;e||d.data("bs.button",e=new c(this,f)),"toggle"==b?e.toggle():b&&e.setState(b)})}var c=function(b,d){this.$element=a(b),this.options=a.extend({},c.DEFAULTS,d),this.isLoading=!1};c.VERSION="3.3.7",c.DEFAULTS={loadingText:"loading..."},c.prototype.setState=function(b){var c="disabled",d=this.$element,e=d.is("input")?"val":"html",f=d.data();b+="Text",null==f.resetText&&d.data("resetText",d[e]()),setTimeout(a.proxy(function(){d[e](null==f[b]?this.options[b]:f[b]),"loadingText"==b?(this.isLoading=!0,d.addClass(c).attr(c,c).prop(c,!0)):this.isLoading&&(this.isLoading=!1,d.removeClass(c).removeAttr(c).prop(c,!1))},this),0)},c.prototype.toggle=function(){var a=!0,b=this.$element.closest('[data-toggle="buttons"]');if(b.length){var c=this.$element.find("input");"radio"==c.prop("type")?(c.prop("checked")&&(a=!1),b.find(".active").removeClass("active"),this.$element.addClass("active")):"checkbox"==c.prop("type")&&(c.prop("checked")!==this.$element.hasClass("active")&&(a=!1),this.$element.toggleClass("active")),c.prop("checked",this.$element.hasClass("active")),a&&c.trigger("change")}else this.$element.attr("aria-pressed",!this.$element.hasClass("active")),this.$element.toggleClass("active")};var d=a.fn.button;a.fn.button=b,a.fn.button.Constructor=c,a.fn.button.noConflict=function(){return a.fn.button=d,this},a(document).on("click.bs.button.data-api",'[data-toggle^="button"]',function(c){var d=a(c.target).closest(".btn");b.call(d,"toggle"),a(c.target).is('input[type="radio"], input[type="checkbox"]')||(c.preventDefault(),d.is("input,button")?d.trigger("focus"):d.find("input:visible,button:visible").first().trigger("focus"))}).on("focus.bs.button.data-api blur.bs.button.data-api",'[data-toggle^="button"]',function(b){a(b.target).closest(".btn").toggleClass("focus",/^focus(in)?$/.test(b.type))})}(jQuery),+function(a){"use strict";function b(b){return this.each(function(){var d=a(this),e=d.data("bs.carousel"),f=a.extend({},c.DEFAULTS,d.data(),"object"==typeof b&&b),g="string"==typeof b?b:f.slide;e||d.data("bs.carousel",e=new c(this,f)),"number"==typeof b?e.to(b):g?e[g]():f.interval&&e.pause().cycle()})}var c=function(b,c){this.$element=a(b),this.$indicators=this.$element.find(".carousel-indicators"),this.options=c,this.paused=null,this.sliding=null,this.interval=null,this.$active=null,this.$items=null,this.options.keyboard&&this.$element.on("keydown.bs.carousel",a.proxy(this.keydown,this)),"hover"==this.options.pause&&!("ontouchstart"in document.documentElement)&&this.$element.on("mouseenter.bs.carousel",a.proxy(this.pause,this)).on("mouseleave.bs.carousel",a.proxy(this.cycle,this))};c.VERSION="3.3.7",c.TRANSITION_DURATION=600,c.DEFAULTS={interval:5e3,pause:"hover",wrap:!0,keyboard:!0},c.prototype.keydown=function(a){if(!/input|textarea/i.test(a.target.tagName)){switch(a.which){case 37:this.prev();break;case 39:this.next();break;default:return}a.preventDefault()}},c.prototype.cycle=function(b){return b||(this.paused=!1),this.interval&&clearInterval(this.interval),this.options.interval&&!this.paused&&(this.interval=setInterval(a.proxy(this.next,this),this.options.interval)),this},c.prototype.getItemIndex=function(a){return this.$items=a.parent().children(".item"),this.$items.index(a||this.$active)},c.prototype.getItemForDirection=function(a,b){var c=this.getItemIndex(b),d="prev"==a&&0===c||"next"==a&&c==this.$items.length-1;if(d&&!this.options.wrap)return b;var e="prev"==a?-1:1,f=(c+e)%this.$items.length;return this.$items.eq(f)},c.prototype.to=function(a){var b=this,c=this.getItemIndex(this.$active=this.$element.find(".item.active"));if(!(a>this.$items.length-1||a<0))return this.sliding?this.$element.one("slid.bs.carousel",function(){b.to(a)}):c==a?this.pause().cycle():this.slide(a>c?"next":"prev",this.$items.eq(a))},c.prototype.pause=function(b){return b||(this.paused=!0),this.$element.find(".next, .prev").length&&a.support.transition&&(this.$element.trigger(a.support.transition.end),this.cycle(!0)),this.interval=clearInterval(this.interval),this},c.prototype.next=function(){if(!this.sliding)return this.slide("next")},c.prototype.prev=function(){if(!this.sliding)return this.slide("prev")},c.prototype.slide=function(b,d){var e=this.$element.find(".item.active"),f=d||this.getItemForDirection(b,e),g=this.interval,h="next"==b?"left":"right",i=this;if(f.hasClass("active"))return this.sliding=!1;var j=f[0],k=a.Event("slide.bs.carousel",{relatedTarget:j,direction:h});if(this.$element.trigger(k),!k.isDefaultPrevented()){if(this.sliding=!0,g&&this.pause(),this.$indicators.length){this.$indicators.find(".active").removeClass("active");var l=a(this.$indicators.children()[this.getItemIndex(f)]);l&&l.addClass("active")}var m=a.Event("slid.bs.carousel",{relatedTarget:j,direction:h});return a.support.transition&&this.$element.hasClass("slide")?(f.addClass(b),f[0].offsetWidth,e.addClass(h),f.addClass(h),e.one("bsTransitionEnd",function(){f.removeClass([b,h].join(" ")).addClass("active"),e.removeClass(["active",h].join(" ")),i.sliding=!1,setTimeout(function(){i.$element.trigger(m)},0)}).emulateTransitionEnd(c.TRANSITION_DURATION)):(e.removeClass("active"),f.addClass("active"),this.sliding=!1,this.$element.trigger(m)),g&&this.cycle(),this}};var d=a.fn.carousel;a.fn.carousel=b,a.fn.carousel.Constructor=c,a.fn.carousel.noConflict=function(){return a.fn.carousel=d,this};var e=function(c){var d,e=a(this),f=a(e.attr("data-target")||(d=e.attr("href"))&&d.replace(/.*(?=#[^\s]+$)/,""));if(f.hasClass("carousel")){var g=a.extend({},f.data(),e.data()),h=e.attr("data-slide-to");h&&(g.interval=!1),b.call(f,g),h&&f.data("bs.carousel").to(h),c.preventDefault()}};a(document).on("click.bs.carousel.data-api","[data-slide]",e).on("click.bs.carousel.data-api","[data-slide-to]",e),a(window).on("load",function(){a('[data-ride="carousel"]').each(function(){var c=a(this);b.call(c,c.data())})})}(jQuery),+function(a){"use strict";function b(b){var c,d=b.attr("data-target")||(c=b.attr("href"))&&c.replace(/.*(?=#[^\s]+$)/,"");return a(d)}function c(b){return this.each(function(){var c=a(this),e=c.data("bs.collapse"),f=a.extend({},d.DEFAULTS,c.data(),"object"==typeof b&&b);!e&&f.toggle&&/show|hide/.test(b)&&(f.toggle=!1),e||c.data("bs.collapse",e=new d(this,f)),"string"==typeof b&&e[b]()})}var d=function(b,c){this.$element=a(b),this.options=a.extend({},d.DEFAULTS,c),this.$trigger=a('[data-toggle="collapse"][href="#'+b.id+'"],[data-toggle="collapse"][data-target="#'+b.id+'"]'),this.transitioning=null,this.options.parent?this.$parent=this.getParent():this.addAriaAndCollapsedClass(this.$element,this.$trigger),this.options.toggle&&this.toggle()};d.VERSION="3.3.7",d.TRANSITION_DURATION=350,d.DEFAULTS={toggle:!0},d.prototype.dimension=function(){var a=this.$element.hasClass("width");return a?"width":"height"},d.prototype.show=function(){if(!this.transitioning&&!this.$element.hasClass("in")){var b,e=this.$parent&&this.$parent.children(".panel").children(".in, .collapsing");if(!(e&&e.length&&(b=e.data("bs.collapse"),b&&b.transitioning))){var f=a.Event("show.bs.collapse");if(this.$element.trigger(f),!f.isDefaultPrevented()){e&&e.length&&(c.call(e,"hide"),b||e.data("bs.collapse",null));var g=this.dimension();this.$element.removeClass("collapse").addClass("collapsing")[g](0).attr("aria-expanded",!0),this.$trigger.removeClass("collapsed").attr("aria-expanded",!0),this.transitioning=1;var h=function(){this.$element.removeClass("collapsing").addClass("collapse in")[g](""),this.transitioning=0,this.$element.trigger("shown.bs.collapse")};if(!a.support.transition)return h.call(this);var i=a.camelCase(["scroll",g].join("-"));this.$element.one("bsTransitionEnd",a.proxy(h,this)).emulateTransitionEnd(d.TRANSITION_DURATION)[g](this.$element[0][i])}}}},d.prototype.hide=function(){if(!this.transitioning&&this.$element.hasClass("in")){var b=a.Event("hide.bs.collapse");if(this.$element.trigger(b),!b.isDefaultPrevented()){var c=this.dimension();this.$element[c](this.$element[c]())[0].offsetHeight,this.$element.addClass("collapsing").removeClass("collapse in").attr("aria-expanded",!1),this.$trigger.addClass("collapsed").attr("aria-expanded",!1),this.transitioning=1;var e=function(){this.transitioning=0,this.$element.removeClass("collapsing").addClass("collapse").trigger("hidden.bs.collapse")};return a.support.transition?void this.$element[c](0).one("bsTransitionEnd",a.proxy(e,this)).emulateTransitionEnd(d.TRANSITION_DURATION):e.call(this)}}},d.prototype.toggle=function(){this[this.$element.hasClass("in")?"hide":"show"]()},d.prototype.getParent=function(){return a(this.options.parent).find('[data-toggle="collapse"][data-parent="'+this.options.parent+'"]').each(a.proxy(function(c,d){var e=a(d);this.addAriaAndCollapsedClass(b(e),e)},this)).end()},d.prototype.addAriaAndCollapsedClass=function(a,b){var c=a.hasClass("in");a.attr("aria-expanded",c),b.toggleClass("collapsed",!c).attr("aria-expanded",c)};var e=a.fn.collapse;a.fn.collapse=c,a.fn.collapse.Constructor=d,a.fn.collapse.noConflict=function(){return a.fn.collapse=e,this},a(document).on("click.bs.collapse.data-api",'[data-toggle="collapse"]',function(d){var e=a(this);e.attr("data-target")||d.preventDefault();var f=b(e),g=f.data("bs.collapse"),h=g?"toggle":e.data();c.call(f,h)})}(jQuery),+function(a){"use strict";function b(b){var c=b.attr("data-target");c||(c=b.attr("href"),c=c&&/#[A-Za-z]/.test(c)&&c.replace(/.*(?=#[^\s]*$)/,""));var d=c&&a(c);return d&&d.length?d:b.parent()}function c(c){c&&3===c.which||(a(e).remove(),a(f).each(function(){var d=a(this),e=b(d),f={relatedTarget:this};e.hasClass("open")&&(c&&"click"==c.type&&/input|textarea/i.test(c.target.tagName)&&a.contains(e[0],c.target)||(e.trigger(c=a.Event("hide.bs.dropdown",f)),c.isDefaultPrevented()||(d.attr("aria-expanded","false"),e.removeClass("open").trigger(a.Event("hidden.bs.dropdown",f)))))}))}function d(b){return this.each(function(){var c=a(this),d=c.data("bs.dropdown");d||c.data("bs.dropdown",d=new g(this)),"string"==typeof b&&d[b].call(c)})}var e=".dropdown-backdrop",f='[data-toggle="dropdown"]',g=function(b){a(b).on("click.bs.dropdown",this.toggle)};g.VERSION="3.3.7",g.prototype.toggle=function(d){var e=a(this);if(!e.is(".disabled, :disabled")){var f=b(e),g=f.hasClass("open");if(c(),!g){"ontouchstart"in document.documentElement&&!f.closest(".navbar-nav").length&&a(document.createElement("div")).addClass("dropdown-backdrop").insertAfter(a(this)).on("click",c);var h={relatedTarget:this};if(f.trigger(d=a.Event("show.bs.dropdown",h)),d.isDefaultPrevented())return;e.trigger("focus").attr("aria-expanded","true"),f.toggleClass("open").trigger(a.Event("shown.bs.dropdown",h))}return!1}},g.prototype.keydown=function(c){if(/(38|40|27|32)/.test(c.which)&&!/input|textarea/i.test(c.target.tagName)){var d=a(this);if(c.preventDefault(),c.stopPropagation(),!d.is(".disabled, :disabled")){var e=b(d),g=e.hasClass("open");if(!g&&27!=c.which||g&&27==c.which)return 27==c.which&&e.find(f).trigger("focus"),d.trigger("click");var h=" li:not(.disabled):visible a",i=e.find(".dropdown-menu"+h);if(i.length){var j=i.index(c.target);38==c.which&&j>0&&j--,40==c.which&&jdocument.documentElement.clientHeight;this.$element.css({paddingLeft:!this.bodyIsOverflowing&&a?this.scrollbarWidth:"",paddingRight:this.bodyIsOverflowing&&!a?this.scrollbarWidth:""})},c.prototype.resetAdjustments=function(){this.$element.css({paddingLeft:"",paddingRight:""})},c.prototype.checkScrollbar=function(){var a=window.innerWidth;if(!a){var b=document.documentElement.getBoundingClientRect();a=b.right-Math.abs(b.left)}this.bodyIsOverflowing=document.body.clientWidth

Try it out!