diff --git a/.editorconfig b/.editorconfig new file mode 100644 index 0000000..0f09989 --- /dev/null +++ b/.editorconfig @@ -0,0 +1,10 @@ +# editorconfig.org +root = true + +[*] +indent_style = space +indent_size = 2 +end_of_line = lf +charset = utf-8 +trim_trailing_whitespace = true +insert_final_newline = true diff --git a/.eslintrc b/.eslintrc new file mode 100644 index 0000000..885e472 --- /dev/null +++ b/.eslintrc @@ -0,0 +1,181 @@ +{ + "env": { + "browser": true, + "node": true + }, + + "globals": { + "jQuery": true + }, + + "ecmaFeatures": { + "arrowFunctions": true, + "destructuring": true, + "classes": true, + "defaultParams": true, + "blockBindings": true, + "modules": true, + "objectLiteralComputedProperties": true, + "objectLiteralShorthandMethods": true, + "objectLiteralShorthandProperties": true, + "restParams": true, + "spread": true, + "templateStrings": true + }, + + "rules": { + "accessor-pairs": 2, + "array-bracket-spacing": 0, + "block-scoped-var": 0, + "brace-style": [2, "1tbs", { "allowSingleLine": true }], + "camelcase": 0, + "comma-dangle": [2, "never"], + "comma-spacing": [2, { "before": false, "after": true }], + "comma-style": [2, "last"], + "complexity": 0, + "computed-property-spacing": 0, + "consistent-return": 0, + "consistent-this": 0, + "constructor-super": 2, + "curly": [2, "multi-line"], + "default-case": 0, + "dot-location": [2, "property"], + "dot-notation": 0, + "eol-last": 2, + "eqeqeq": [2, "allow-null"], + "func-names": 0, + "func-style": 0, + "generator-star-spacing": [2, { "before": true, "after": true }], + "guard-for-in": 0, + "handle-callback-err": [2, "^(err|error)$" ], + "indent": [2, 2, { "SwitchCase": 1 }], + "key-spacing": [2, { "beforeColon": false, "afterColon": true }], + "linebreak-style": 0, + "lines-around-comment": 0, + "max-nested-callbacks": 0, + "new-cap": [2, { "newIsCap": true, "capIsNew": false }], + "new-parens": 2, + "newline-after-var": 0, + "no-alert": 0, + "no-array-constructor": 2, + "no-caller": 2, + "no-catch-shadow": 0, + "no-cond-assign": 2, + "no-console": 0, + "no-constant-condition": 0, + "no-continue": 0, + "no-control-regex": 2, + "no-debugger": 2, + "no-delete-var": 2, + "no-div-regex": 0, + "no-dupe-args": 2, + "no-dupe-keys": 2, + "no-duplicate-case": 2, + "no-else-return": 0, + "no-empty": 0, + "no-empty-character-class": 2, + "no-empty-label": 2, + "no-eq-null": 0, + "no-eval": 2, + "no-ex-assign": 2, + "no-extend-native": 2, + "no-extra-bind": 2, + "no-extra-boolean-cast": 2, + "no-extra-parens": 0, + "no-extra-semi": 0, + "no-fallthrough": 2, + "no-floating-decimal": 2, + "no-func-assign": 2, + "no-implied-eval": 2, + "no-inline-comments": 0, + "no-inner-declarations": [2, "functions"], + "no-invalid-regexp": 2, + "no-irregular-whitespace": 2, + "no-iterator": 2, + "no-label-var": 2, + "no-labels": 2, + "no-lone-blocks": 2, + "no-lonely-if": 0, + "no-loop-func": 0, + "no-mixed-requires": 0, + "no-mixed-spaces-and-tabs": 2, + "no-multi-spaces": 2, + "no-multi-str": 2, + "no-multiple-empty-lines": [2, { "max": 1 }], + "no-native-reassign": 2, + "no-negated-in-lhs": 2, + "no-nested-ternary": 0, + "no-new": 2, + "no-new-func": 0, + "no-new-object": 2, + "no-new-require": 2, + "no-new-wrappers": 2, + "no-obj-calls": 2, + "no-octal": 2, + "no-octal-escape": 2, + "no-param-reassign": 0, + "no-path-concat": 0, + "no-process-env": 0, + "no-process-exit": 0, + "no-proto": 0, + "no-redeclare": 2, + "no-regex-spaces": 2, + "no-restricted-modules": 0, + "no-return-assign": 2, + "no-script-url": 0, + "no-self-compare": 2, + "no-sequences": 2, + "no-shadow": 0, + "no-shadow-restricted-names": 2, + "no-spaced-func": 2, + "no-sparse-arrays": 2, + "no-sync": 0, + "no-ternary": 0, + "no-this-before-super": 2, + "no-throw-literal": 2, + "no-trailing-spaces": 2, + "no-undef": 2, + "no-undef-init": 2, + "no-undefined": 0, + "no-underscore-dangle": 0, + "no-unexpected-multiline": 2, + "no-unneeded-ternary": 2, + "no-unreachable": 2, + "no-unused-expressions": 0, + "no-unused-vars": [2, { "vars": "all", "args": "none" }], + "no-use-before-define": 0, + "no-var": 0, + "no-void": 0, + "no-warning-comments": 0, + "no-with": 2, + "object-curly-spacing": 0, + "object-shorthand": 0, + "one-var": [2, { "initialized": "never" }], + "operator-assignment": 0, + "operator-linebreak": [2, "after", { "overrides": { "?": "before", ":": "before" } }], + "padded-blocks": 0, + "prefer-const": 0, + "quote-props": 0, + "quotes": [2, "single", "avoid-escape"], + "radix": 2, + "semi": [2, "always"], + "semi-spacing": 0, + "sort-vars": 0, + "space-after-keywords": [2, "always"], + "space-before-blocks": [2, "always"], + "space-before-function-paren": [2, "always"], + "space-in-parens": [2, "never"], + "space-infix-ops": 2, + "space-return-throw-case": 2, + "space-unary-ops": [2, { "words": true, "nonwords": false }], + "spaced-comment": [2, "always", { "markers": ["global", "globals", "eslint", "eslint-disable", "*package", "!"] }], + "strict": 0, + "use-isnan": 2, + "valid-jsdoc": 0, + "valid-typeof": 2, + "vars-on-top": 0, + "wrap-iife": [2, "any"], + "wrap-regex": 0, + "yoda": [2, "never"] + } +} diff --git a/.gitattributes b/.gitattributes new file mode 100644 index 0000000..cf911c1 --- /dev/null +++ b/.gitattributes @@ -0,0 +1,17 @@ +# Automatically normalize line endings for all text-based files +# http://git-scm.com/docs/gitattributes#_end_of_line_conversion +* text=auto + +# For the following file types, normalize line endings to LF on +# checkin and prevent conversion to CRLF when they are checked out +# (this is required in order to prevent newline related issues like, +# for example, after the build script is run) +.* text eol=lf +*.css text eol=lf +*.html text eol=lf +*.js text eol=lf +*.json text eol=lf +*.md text eol=lf +*.sh text eol=lf +*.txt text eol=lf +*.xml text eol=lf diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..be21597 --- /dev/null +++ b/.gitignore @@ -0,0 +1,47 @@ +# Project +node_modules +/_* + +# Windows image file caches +Thumbs.db +ehthumbs.db + +# Folder config file +Desktop.ini + +# Recycle Bin used on file shares +$RECYCLE.BIN/ + +# Windows Installer files +*.cab +*.msi +*.msm +*.msp + +# Windows shortcuts +*.lnk + +# ========================= +# Operating System Files +# ========================= + +# OSX +# ========================= + +.DS_Store +.AppleDouble +.LSOverride + +# Thumbnails +._* + +# Files that might appear on external disk +.Spotlight-V100 +.Trashes + +# Directories potentially created on remote AFP share +.AppleDB +.AppleDesktop +Network Trash Folder +Temporary Items +.apdisk diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..f759787 --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +The MIT License (MIT) + +Copyright (c) 2016 Fengyuan Chen + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in +all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN +THE SOFTWARE. diff --git a/README.md b/README.md new file mode 100644 index 0000000..c648826 --- /dev/null +++ b/README.md @@ -0,0 +1,21 @@ +# Photo Editor + +> A photo editing application based on the [Cropper.js](https://github.com/fengyuanchen/cropperjs). + +- [Homepage](http://fengyuanchen.github.io/photo-editor) + + + +## Browser support + +- Chrome (latest 2) +- Firefox (latest 2) +- Internet Explorer 9+ +- Opera (latest 2) +- Safari (latest 2) + + + +## License + +[MIT](http://opensource.org/licenses/MIT) © [Fengyuan Chen](http://chenfengyuan.com) diff --git a/css/cropper.min.css b/css/cropper.min.css new file mode 100644 index 0000000..0bea9db --- /dev/null +++ b/css/cropper.min.css @@ -0,0 +1,9 @@ +/*! + * Cropper.js v0.5.5 + * https://github.com/fengyuanchen/cropperjs + * + * Copyright (c) 2015-2016 Fengyuan Chen + * Released under the MIT license + * + * Date: 2016-01-01T08:10:03.671Z + */.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;-ms-touch-action:none;touch-action:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}.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} \ No newline at end of file diff --git a/css/font-awesome.min.css b/css/font-awesome.min.css new file mode 100644 index 0000000..d0603cb --- /dev/null +++ b/css/font-awesome.min.css @@ -0,0 +1,4 @@ +/*! + * Font Awesome 4.5.0 by @davegandy - http://fontawesome.io - @fontawesome + * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) + */@font-face{font-family:'FontAwesome';src:url('../fonts/fontawesome-webfont.eot?v=4.5.0');src:url('../fonts/fontawesome-webfont.eot?#iefix&v=4.5.0') format('embedded-opentype'),url('../fonts/fontawesome-webfont.woff2?v=4.5.0') format('woff2'),url('../fonts/fontawesome-webfont.woff?v=4.5.0') format('woff'),url('../fonts/fontawesome-webfont.ttf?v=4.5.0') format('truetype'),url('../fonts/fontawesome-webfont.svg?v=4.5.0#fontawesomeregular') format('svg');font-weight:normal;font-style:normal}.fa{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571429em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14285714em;list-style-type:none}.fa-ul>li{position:relative}.fa-li{position:absolute;left:-2.14285714em;width:2.14285714em;top:.14285714em;text-align:center}.fa-li.fa-lg{left:-1.85714286em}.fa-border{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em}.fa-pull-left{float:left}.fa-pull-right{float:right}.fa.fa-pull-left{margin-right:.3em}.fa.fa-pull-right{margin-left:.3em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear}.fa-pulse{-webkit-animation:fa-spin 1s infinite steps(8);animation:fa-spin 1s infinite steps(8)}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fa-rotate-90{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);-webkit-transform:scale(-1, 1);-ms-transform:scale(-1, 1);transform:scale(-1, 1)}.fa-flip-vertical{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);-webkit-transform:scale(1, -1);-ms-transform:scale(1, -1);transform:scale(1, -1)}:root .fa-rotate-90,:root .fa-rotate-180,:root .fa-rotate-270,:root .fa-flip-horizontal,:root .fa-flip-vertical{filter:none}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-glass:before{content:"\f000"}.fa-music:before{content:"\f001"}.fa-search:before{content:"\f002"}.fa-envelope-o:before{content:"\f003"}.fa-heart:before{content:"\f004"}.fa-star:before{content:"\f005"}.fa-star-o:before{content:"\f006"}.fa-user:before{content:"\f007"}.fa-film:before{content:"\f008"}.fa-th-large:before{content:"\f009"}.fa-th:before{content:"\f00a"}.fa-th-list:before{content:"\f00b"}.fa-check:before{content:"\f00c"}.fa-remove:before,.fa-close:before,.fa-times:before{content:"\f00d"}.fa-search-plus:before{content:"\f00e"}.fa-search-minus:before{content:"\f010"}.fa-power-off:before{content:"\f011"}.fa-signal:before{content:"\f012"}.fa-gear:before,.fa-cog:before{content:"\f013"}.fa-trash-o:before{content:"\f014"}.fa-home:before{content:"\f015"}.fa-file-o:before{content:"\f016"}.fa-clock-o:before{content:"\f017"}.fa-road:before{content:"\f018"}.fa-download:before{content:"\f019"}.fa-arrow-circle-o-down:before{content:"\f01a"}.fa-arrow-circle-o-up:before{content:"\f01b"}.fa-inbox:before{content:"\f01c"}.fa-play-circle-o:before{content:"\f01d"}.fa-rotate-right:before,.fa-repeat:before{content:"\f01e"}.fa-refresh:before{content:"\f021"}.fa-list-alt:before{content:"\f022"}.fa-lock:before{content:"\f023"}.fa-flag:before{content:"\f024"}.fa-headphones:before{content:"\f025"}.fa-volume-off:before{content:"\f026"}.fa-volume-down:before{content:"\f027"}.fa-volume-up:before{content:"\f028"}.fa-qrcode:before{content:"\f029"}.fa-barcode:before{content:"\f02a"}.fa-tag:before{content:"\f02b"}.fa-tags:before{content:"\f02c"}.fa-book:before{content:"\f02d"}.fa-bookmark:before{content:"\f02e"}.fa-print:before{content:"\f02f"}.fa-camera:before{content:"\f030"}.fa-font:before{content:"\f031"}.fa-bold:before{content:"\f032"}.fa-italic:before{content:"\f033"}.fa-text-height:before{content:"\f034"}.fa-text-width:before{content:"\f035"}.fa-align-left:before{content:"\f036"}.fa-align-center:before{content:"\f037"}.fa-align-right:before{content:"\f038"}.fa-align-justify:before{content:"\f039"}.fa-list:before{content:"\f03a"}.fa-dedent:before,.fa-outdent:before{content:"\f03b"}.fa-indent:before{content:"\f03c"}.fa-video-camera:before{content:"\f03d"}.fa-photo:before,.fa-image:before,.fa-picture-o:before{content:"\f03e"}.fa-pencil:before{content:"\f040"}.fa-map-marker:before{content:"\f041"}.fa-adjust:before{content:"\f042"}.fa-tint:before{content:"\f043"}.fa-edit:before,.fa-pencil-square-o:before{content:"\f044"}.fa-share-square-o:before{content:"\f045"}.fa-check-square-o:before{content:"\f046"}.fa-arrows:before{content:"\f047"}.fa-step-backward:before{content:"\f048"}.fa-fast-backward:before{content:"\f049"}.fa-backward:before{content:"\f04a"}.fa-play:before{content:"\f04b"}.fa-pause:before{content:"\f04c"}.fa-stop:before{content:"\f04d"}.fa-forward:before{content:"\f04e"}.fa-fast-forward:before{content:"\f050"}.fa-step-forward:before{content:"\f051"}.fa-eject:before{content:"\f052"}.fa-chevron-left:before{content:"\f053"}.fa-chevron-right:before{content:"\f054"}.fa-plus-circle:before{content:"\f055"}.fa-minus-circle:before{content:"\f056"}.fa-times-circle:before{content:"\f057"}.fa-check-circle:before{content:"\f058"}.fa-question-circle:before{content:"\f059"}.fa-info-circle:before{content:"\f05a"}.fa-crosshairs:before{content:"\f05b"}.fa-times-circle-o:before{content:"\f05c"}.fa-check-circle-o:before{content:"\f05d"}.fa-ban:before{content:"\f05e"}.fa-arrow-left:before{content:"\f060"}.fa-arrow-right:before{content:"\f061"}.fa-arrow-up:before{content:"\f062"}.fa-arrow-down:before{content:"\f063"}.fa-mail-forward:before,.fa-share:before{content:"\f064"}.fa-expand:before{content:"\f065"}.fa-compress:before{content:"\f066"}.fa-plus:before{content:"\f067"}.fa-minus:before{content:"\f068"}.fa-asterisk:before{content:"\f069"}.fa-exclamation-circle:before{content:"\f06a"}.fa-gift:before{content:"\f06b"}.fa-leaf:before{content:"\f06c"}.fa-fire:before{content:"\f06d"}.fa-eye:before{content:"\f06e"}.fa-eye-slash:before{content:"\f070"}.fa-warning:before,.fa-exclamation-triangle:before{content:"\f071"}.fa-plane:before{content:"\f072"}.fa-calendar:before{content:"\f073"}.fa-random:before{content:"\f074"}.fa-comment:before{content:"\f075"}.fa-magnet:before{content:"\f076"}.fa-chevron-up:before{content:"\f077"}.fa-chevron-down:before{content:"\f078"}.fa-retweet:before{content:"\f079"}.fa-shopping-cart:before{content:"\f07a"}.fa-folder:before{content:"\f07b"}.fa-folder-open:before{content:"\f07c"}.fa-arrows-v:before{content:"\f07d"}.fa-arrows-h:before{content:"\f07e"}.fa-bar-chart-o:before,.fa-bar-chart:before{content:"\f080"}.fa-twitter-square:before{content:"\f081"}.fa-facebook-square:before{content:"\f082"}.fa-camera-retro:before{content:"\f083"}.fa-key:before{content:"\f084"}.fa-gears:before,.fa-cogs:before{content:"\f085"}.fa-comments:before{content:"\f086"}.fa-thumbs-o-up:before{content:"\f087"}.fa-thumbs-o-down:before{content:"\f088"}.fa-star-half:before{content:"\f089"}.fa-heart-o:before{content:"\f08a"}.fa-sign-out:before{content:"\f08b"}.fa-linkedin-square:before{content:"\f08c"}.fa-thumb-tack:before{content:"\f08d"}.fa-external-link:before{content:"\f08e"}.fa-sign-in:before{content:"\f090"}.fa-trophy:before{content:"\f091"}.fa-github-square:before{content:"\f092"}.fa-upload:before{content:"\f093"}.fa-lemon-o:before{content:"\f094"}.fa-phone:before{content:"\f095"}.fa-square-o:before{content:"\f096"}.fa-bookmark-o:before{content:"\f097"}.fa-phone-square:before{content:"\f098"}.fa-twitter:before{content:"\f099"}.fa-facebook-f:before,.fa-facebook:before{content:"\f09a"}.fa-github:before{content:"\f09b"}.fa-unlock:before{content:"\f09c"}.fa-credit-card:before{content:"\f09d"}.fa-feed:before,.fa-rss:before{content:"\f09e"}.fa-hdd-o:before{content:"\f0a0"}.fa-bullhorn:before{content:"\f0a1"}.fa-bell:before{content:"\f0f3"}.fa-certificate:before{content:"\f0a3"}.fa-hand-o-right:before{content:"\f0a4"}.fa-hand-o-left:before{content:"\f0a5"}.fa-hand-o-up:before{content:"\f0a6"}.fa-hand-o-down:before{content:"\f0a7"}.fa-arrow-circle-left:before{content:"\f0a8"}.fa-arrow-circle-right:before{content:"\f0a9"}.fa-arrow-circle-up:before{content:"\f0aa"}.fa-arrow-circle-down:before{content:"\f0ab"}.fa-globe:before{content:"\f0ac"}.fa-wrench:before{content:"\f0ad"}.fa-tasks:before{content:"\f0ae"}.fa-filter:before{content:"\f0b0"}.fa-briefcase:before{content:"\f0b1"}.fa-arrows-alt:before{content:"\f0b2"}.fa-group:before,.fa-users:before{content:"\f0c0"}.fa-chain:before,.fa-link:before{content:"\f0c1"}.fa-cloud:before{content:"\f0c2"}.fa-flask:before{content:"\f0c3"}.fa-cut:before,.fa-scissors:before{content:"\f0c4"}.fa-copy:before,.fa-files-o:before{content:"\f0c5"}.fa-paperclip:before{content:"\f0c6"}.fa-save:before,.fa-floppy-o:before{content:"\f0c7"}.fa-square:before{content:"\f0c8"}.fa-navicon:before,.fa-reorder:before,.fa-bars:before{content:"\f0c9"}.fa-list-ul:before{content:"\f0ca"}.fa-list-ol:before{content:"\f0cb"}.fa-strikethrough:before{content:"\f0cc"}.fa-underline:before{content:"\f0cd"}.fa-table:before{content:"\f0ce"}.fa-magic:before{content:"\f0d0"}.fa-truck:before{content:"\f0d1"}.fa-pinterest:before{content:"\f0d2"}.fa-pinterest-square:before{content:"\f0d3"}.fa-google-plus-square:before{content:"\f0d4"}.fa-google-plus:before{content:"\f0d5"}.fa-money:before{content:"\f0d6"}.fa-caret-down:before{content:"\f0d7"}.fa-caret-up:before{content:"\f0d8"}.fa-caret-left:before{content:"\f0d9"}.fa-caret-right:before{content:"\f0da"}.fa-columns:before{content:"\f0db"}.fa-unsorted:before,.fa-sort:before{content:"\f0dc"}.fa-sort-down:before,.fa-sort-desc:before{content:"\f0dd"}.fa-sort-up:before,.fa-sort-asc:before{content:"\f0de"}.fa-envelope:before{content:"\f0e0"}.fa-linkedin:before{content:"\f0e1"}.fa-rotate-left:before,.fa-undo:before{content:"\f0e2"}.fa-legal:before,.fa-gavel:before{content:"\f0e3"}.fa-dashboard:before,.fa-tachometer:before{content:"\f0e4"}.fa-comment-o:before{content:"\f0e5"}.fa-comments-o:before{content:"\f0e6"}.fa-flash:before,.fa-bolt:before{content:"\f0e7"}.fa-sitemap:before{content:"\f0e8"}.fa-umbrella:before{content:"\f0e9"}.fa-paste:before,.fa-clipboard:before{content:"\f0ea"}.fa-lightbulb-o:before{content:"\f0eb"}.fa-exchange:before{content:"\f0ec"}.fa-cloud-download:before{content:"\f0ed"}.fa-cloud-upload:before{content:"\f0ee"}.fa-user-md:before{content:"\f0f0"}.fa-stethoscope:before{content:"\f0f1"}.fa-suitcase:before{content:"\f0f2"}.fa-bell-o:before{content:"\f0a2"}.fa-coffee:before{content:"\f0f4"}.fa-cutlery:before{content:"\f0f5"}.fa-file-text-o:before{content:"\f0f6"}.fa-building-o:before{content:"\f0f7"}.fa-hospital-o:before{content:"\f0f8"}.fa-ambulance:before{content:"\f0f9"}.fa-medkit:before{content:"\f0fa"}.fa-fighter-jet:before{content:"\f0fb"}.fa-beer:before{content:"\f0fc"}.fa-h-square:before{content:"\f0fd"}.fa-plus-square:before{content:"\f0fe"}.fa-angle-double-left:before{content:"\f100"}.fa-angle-double-right:before{content:"\f101"}.fa-angle-double-up:before{content:"\f102"}.fa-angle-double-down:before{content:"\f103"}.fa-angle-left:before{content:"\f104"}.fa-angle-right:before{content:"\f105"}.fa-angle-up:before{content:"\f106"}.fa-angle-down:before{content:"\f107"}.fa-desktop:before{content:"\f108"}.fa-laptop:before{content:"\f109"}.fa-tablet:before{content:"\f10a"}.fa-mobile-phone:before,.fa-mobile:before{content:"\f10b"}.fa-circle-o:before{content:"\f10c"}.fa-quote-left:before{content:"\f10d"}.fa-quote-right:before{content:"\f10e"}.fa-spinner:before{content:"\f110"}.fa-circle:before{content:"\f111"}.fa-mail-reply:before,.fa-reply:before{content:"\f112"}.fa-github-alt:before{content:"\f113"}.fa-folder-o:before{content:"\f114"}.fa-folder-open-o:before{content:"\f115"}.fa-smile-o:before{content:"\f118"}.fa-frown-o:before{content:"\f119"}.fa-meh-o:before{content:"\f11a"}.fa-gamepad:before{content:"\f11b"}.fa-keyboard-o:before{content:"\f11c"}.fa-flag-o:before{content:"\f11d"}.fa-flag-checkered:before{content:"\f11e"}.fa-terminal:before{content:"\f120"}.fa-code:before{content:"\f121"}.fa-mail-reply-all:before,.fa-reply-all:before{content:"\f122"}.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:"\f123"}.fa-location-arrow:before{content:"\f124"}.fa-crop:before{content:"\f125"}.fa-code-fork:before{content:"\f126"}.fa-unlink:before,.fa-chain-broken:before{content:"\f127"}.fa-question:before{content:"\f128"}.fa-info:before{content:"\f129"}.fa-exclamation:before{content:"\f12a"}.fa-superscript:before{content:"\f12b"}.fa-subscript:before{content:"\f12c"}.fa-eraser:before{content:"\f12d"}.fa-puzzle-piece:before{content:"\f12e"}.fa-microphone:before{content:"\f130"}.fa-microphone-slash:before{content:"\f131"}.fa-shield:before{content:"\f132"}.fa-calendar-o:before{content:"\f133"}.fa-fire-extinguisher:before{content:"\f134"}.fa-rocket:before{content:"\f135"}.fa-maxcdn:before{content:"\f136"}.fa-chevron-circle-left:before{content:"\f137"}.fa-chevron-circle-right:before{content:"\f138"}.fa-chevron-circle-up:before{content:"\f139"}.fa-chevron-circle-down:before{content:"\f13a"}.fa-html5:before{content:"\f13b"}.fa-css3:before{content:"\f13c"}.fa-anchor:before{content:"\f13d"}.fa-unlock-alt:before{content:"\f13e"}.fa-bullseye:before{content:"\f140"}.fa-ellipsis-h:before{content:"\f141"}.fa-ellipsis-v:before{content:"\f142"}.fa-rss-square:before{content:"\f143"}.fa-play-circle:before{content:"\f144"}.fa-ticket:before{content:"\f145"}.fa-minus-square:before{content:"\f146"}.fa-minus-square-o:before{content:"\f147"}.fa-level-up:before{content:"\f148"}.fa-level-down:before{content:"\f149"}.fa-check-square:before{content:"\f14a"}.fa-pencil-square:before{content:"\f14b"}.fa-external-link-square:before{content:"\f14c"}.fa-share-square:before{content:"\f14d"}.fa-compass:before{content:"\f14e"}.fa-toggle-down:before,.fa-caret-square-o-down:before{content:"\f150"}.fa-toggle-up:before,.fa-caret-square-o-up:before{content:"\f151"}.fa-toggle-right:before,.fa-caret-square-o-right:before{content:"\f152"}.fa-euro:before,.fa-eur:before{content:"\f153"}.fa-gbp:before{content:"\f154"}.fa-dollar:before,.fa-usd:before{content:"\f155"}.fa-rupee:before,.fa-inr:before{content:"\f156"}.fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:"\f157"}.fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:"\f158"}.fa-won:before,.fa-krw:before{content:"\f159"}.fa-bitcoin:before,.fa-btc:before{content:"\f15a"}.fa-file:before{content:"\f15b"}.fa-file-text:before{content:"\f15c"}.fa-sort-alpha-asc:before{content:"\f15d"}.fa-sort-alpha-desc:before{content:"\f15e"}.fa-sort-amount-asc:before{content:"\f160"}.fa-sort-amount-desc:before{content:"\f161"}.fa-sort-numeric-asc:before{content:"\f162"}.fa-sort-numeric-desc:before{content:"\f163"}.fa-thumbs-up:before{content:"\f164"}.fa-thumbs-down:before{content:"\f165"}.fa-youtube-square:before{content:"\f166"}.fa-youtube:before{content:"\f167"}.fa-xing:before{content:"\f168"}.fa-xing-square:before{content:"\f169"}.fa-youtube-play:before{content:"\f16a"}.fa-dropbox:before{content:"\f16b"}.fa-stack-overflow:before{content:"\f16c"}.fa-instagram:before{content:"\f16d"}.fa-flickr:before{content:"\f16e"}.fa-adn:before{content:"\f170"}.fa-bitbucket:before{content:"\f171"}.fa-bitbucket-square:before{content:"\f172"}.fa-tumblr:before{content:"\f173"}.fa-tumblr-square:before{content:"\f174"}.fa-long-arrow-down:before{content:"\f175"}.fa-long-arrow-up:before{content:"\f176"}.fa-long-arrow-left:before{content:"\f177"}.fa-long-arrow-right:before{content:"\f178"}.fa-apple:before{content:"\f179"}.fa-windows:before{content:"\f17a"}.fa-android:before{content:"\f17b"}.fa-linux:before{content:"\f17c"}.fa-dribbble:before{content:"\f17d"}.fa-skype:before{content:"\f17e"}.fa-foursquare:before{content:"\f180"}.fa-trello:before{content:"\f181"}.fa-female:before{content:"\f182"}.fa-male:before{content:"\f183"}.fa-gittip:before,.fa-gratipay:before{content:"\f184"}.fa-sun-o:before{content:"\f185"}.fa-moon-o:before{content:"\f186"}.fa-archive:before{content:"\f187"}.fa-bug:before{content:"\f188"}.fa-vk:before{content:"\f189"}.fa-weibo:before{content:"\f18a"}.fa-renren:before{content:"\f18b"}.fa-pagelines:before{content:"\f18c"}.fa-stack-exchange:before{content:"\f18d"}.fa-arrow-circle-o-right:before{content:"\f18e"}.fa-arrow-circle-o-left:before{content:"\f190"}.fa-toggle-left:before,.fa-caret-square-o-left:before{content:"\f191"}.fa-dot-circle-o:before{content:"\f192"}.fa-wheelchair:before{content:"\f193"}.fa-vimeo-square:before{content:"\f194"}.fa-turkish-lira:before,.fa-try:before{content:"\f195"}.fa-plus-square-o:before{content:"\f196"}.fa-space-shuttle:before{content:"\f197"}.fa-slack:before{content:"\f198"}.fa-envelope-square:before{content:"\f199"}.fa-wordpress:before{content:"\f19a"}.fa-openid:before{content:"\f19b"}.fa-institution:before,.fa-bank:before,.fa-university:before{content:"\f19c"}.fa-mortar-board:before,.fa-graduation-cap:before{content:"\f19d"}.fa-yahoo:before{content:"\f19e"}.fa-google:before{content:"\f1a0"}.fa-reddit:before{content:"\f1a1"}.fa-reddit-square:before{content:"\f1a2"}.fa-stumbleupon-circle:before{content:"\f1a3"}.fa-stumbleupon:before{content:"\f1a4"}.fa-delicious:before{content:"\f1a5"}.fa-digg:before{content:"\f1a6"}.fa-pied-piper:before{content:"\f1a7"}.fa-pied-piper-alt:before{content:"\f1a8"}.fa-drupal:before{content:"\f1a9"}.fa-joomla:before{content:"\f1aa"}.fa-language:before{content:"\f1ab"}.fa-fax:before{content:"\f1ac"}.fa-building:before{content:"\f1ad"}.fa-child:before{content:"\f1ae"}.fa-paw:before{content:"\f1b0"}.fa-spoon:before{content:"\f1b1"}.fa-cube:before{content:"\f1b2"}.fa-cubes:before{content:"\f1b3"}.fa-behance:before{content:"\f1b4"}.fa-behance-square:before{content:"\f1b5"}.fa-steam:before{content:"\f1b6"}.fa-steam-square:before{content:"\f1b7"}.fa-recycle:before{content:"\f1b8"}.fa-automobile:before,.fa-car:before{content:"\f1b9"}.fa-cab:before,.fa-taxi:before{content:"\f1ba"}.fa-tree:before{content:"\f1bb"}.fa-spotify:before{content:"\f1bc"}.fa-deviantart:before{content:"\f1bd"}.fa-soundcloud:before{content:"\f1be"}.fa-database:before{content:"\f1c0"}.fa-file-pdf-o:before{content:"\f1c1"}.fa-file-word-o:before{content:"\f1c2"}.fa-file-excel-o:before{content:"\f1c3"}.fa-file-powerpoint-o:before{content:"\f1c4"}.fa-file-photo-o:before,.fa-file-picture-o:before,.fa-file-image-o:before{content:"\f1c5"}.fa-file-zip-o:before,.fa-file-archive-o:before{content:"\f1c6"}.fa-file-sound-o:before,.fa-file-audio-o:before{content:"\f1c7"}.fa-file-movie-o:before,.fa-file-video-o:before{content:"\f1c8"}.fa-file-code-o:before{content:"\f1c9"}.fa-vine:before{content:"\f1ca"}.fa-codepen:before{content:"\f1cb"}.fa-jsfiddle:before{content:"\f1cc"}.fa-life-bouy:before,.fa-life-buoy:before,.fa-life-saver:before,.fa-support:before,.fa-life-ring:before{content:"\f1cd"}.fa-circle-o-notch:before{content:"\f1ce"}.fa-ra:before,.fa-rebel:before{content:"\f1d0"}.fa-ge:before,.fa-empire:before{content:"\f1d1"}.fa-git-square:before{content:"\f1d2"}.fa-git:before{content:"\f1d3"}.fa-y-combinator-square:before,.fa-yc-square:before,.fa-hacker-news:before{content:"\f1d4"}.fa-tencent-weibo:before{content:"\f1d5"}.fa-qq:before{content:"\f1d6"}.fa-wechat:before,.fa-weixin:before{content:"\f1d7"}.fa-send:before,.fa-paper-plane:before{content:"\f1d8"}.fa-send-o:before,.fa-paper-plane-o:before{content:"\f1d9"}.fa-history:before{content:"\f1da"}.fa-circle-thin:before{content:"\f1db"}.fa-header:before{content:"\f1dc"}.fa-paragraph:before{content:"\f1dd"}.fa-sliders:before{content:"\f1de"}.fa-share-alt:before{content:"\f1e0"}.fa-share-alt-square:before{content:"\f1e1"}.fa-bomb:before{content:"\f1e2"}.fa-soccer-ball-o:before,.fa-futbol-o:before{content:"\f1e3"}.fa-tty:before{content:"\f1e4"}.fa-binoculars:before{content:"\f1e5"}.fa-plug:before{content:"\f1e6"}.fa-slideshare:before{content:"\f1e7"}.fa-twitch:before{content:"\f1e8"}.fa-yelp:before{content:"\f1e9"}.fa-newspaper-o:before{content:"\f1ea"}.fa-wifi:before{content:"\f1eb"}.fa-calculator:before{content:"\f1ec"}.fa-paypal:before{content:"\f1ed"}.fa-google-wallet:before{content:"\f1ee"}.fa-cc-visa:before{content:"\f1f0"}.fa-cc-mastercard:before{content:"\f1f1"}.fa-cc-discover:before{content:"\f1f2"}.fa-cc-amex:before{content:"\f1f3"}.fa-cc-paypal:before{content:"\f1f4"}.fa-cc-stripe:before{content:"\f1f5"}.fa-bell-slash:before{content:"\f1f6"}.fa-bell-slash-o:before{content:"\f1f7"}.fa-trash:before{content:"\f1f8"}.fa-copyright:before{content:"\f1f9"}.fa-at:before{content:"\f1fa"}.fa-eyedropper:before{content:"\f1fb"}.fa-paint-brush:before{content:"\f1fc"}.fa-birthday-cake:before{content:"\f1fd"}.fa-area-chart:before{content:"\f1fe"}.fa-pie-chart:before{content:"\f200"}.fa-line-chart:before{content:"\f201"}.fa-lastfm:before{content:"\f202"}.fa-lastfm-square:before{content:"\f203"}.fa-toggle-off:before{content:"\f204"}.fa-toggle-on:before{content:"\f205"}.fa-bicycle:before{content:"\f206"}.fa-bus:before{content:"\f207"}.fa-ioxhost:before{content:"\f208"}.fa-angellist:before{content:"\f209"}.fa-cc:before{content:"\f20a"}.fa-shekel:before,.fa-sheqel:before,.fa-ils:before{content:"\f20b"}.fa-meanpath:before{content:"\f20c"}.fa-buysellads:before{content:"\f20d"}.fa-connectdevelop:before{content:"\f20e"}.fa-dashcube:before{content:"\f210"}.fa-forumbee:before{content:"\f211"}.fa-leanpub:before{content:"\f212"}.fa-sellsy:before{content:"\f213"}.fa-shirtsinbulk:before{content:"\f214"}.fa-simplybuilt:before{content:"\f215"}.fa-skyatlas:before{content:"\f216"}.fa-cart-plus:before{content:"\f217"}.fa-cart-arrow-down:before{content:"\f218"}.fa-diamond:before{content:"\f219"}.fa-ship:before{content:"\f21a"}.fa-user-secret:before{content:"\f21b"}.fa-motorcycle:before{content:"\f21c"}.fa-street-view:before{content:"\f21d"}.fa-heartbeat:before{content:"\f21e"}.fa-venus:before{content:"\f221"}.fa-mars:before{content:"\f222"}.fa-mercury:before{content:"\f223"}.fa-intersex:before,.fa-transgender:before{content:"\f224"}.fa-transgender-alt:before{content:"\f225"}.fa-venus-double:before{content:"\f226"}.fa-mars-double:before{content:"\f227"}.fa-venus-mars:before{content:"\f228"}.fa-mars-stroke:before{content:"\f229"}.fa-mars-stroke-v:before{content:"\f22a"}.fa-mars-stroke-h:before{content:"\f22b"}.fa-neuter:before{content:"\f22c"}.fa-genderless:before{content:"\f22d"}.fa-facebook-official:before{content:"\f230"}.fa-pinterest-p:before{content:"\f231"}.fa-whatsapp:before{content:"\f232"}.fa-server:before{content:"\f233"}.fa-user-plus:before{content:"\f234"}.fa-user-times:before{content:"\f235"}.fa-hotel:before,.fa-bed:before{content:"\f236"}.fa-viacoin:before{content:"\f237"}.fa-train:before{content:"\f238"}.fa-subway:before{content:"\f239"}.fa-medium:before{content:"\f23a"}.fa-yc:before,.fa-y-combinator:before{content:"\f23b"}.fa-optin-monster:before{content:"\f23c"}.fa-opencart:before{content:"\f23d"}.fa-expeditedssl:before{content:"\f23e"}.fa-battery-4:before,.fa-battery-full:before{content:"\f240"}.fa-battery-3:before,.fa-battery-three-quarters:before{content:"\f241"}.fa-battery-2:before,.fa-battery-half:before{content:"\f242"}.fa-battery-1:before,.fa-battery-quarter:before{content:"\f243"}.fa-battery-0:before,.fa-battery-empty:before{content:"\f244"}.fa-mouse-pointer:before{content:"\f245"}.fa-i-cursor:before{content:"\f246"}.fa-object-group:before{content:"\f247"}.fa-object-ungroup:before{content:"\f248"}.fa-sticky-note:before{content:"\f249"}.fa-sticky-note-o:before{content:"\f24a"}.fa-cc-jcb:before{content:"\f24b"}.fa-cc-diners-club:before{content:"\f24c"}.fa-clone:before{content:"\f24d"}.fa-balance-scale:before{content:"\f24e"}.fa-hourglass-o:before{content:"\f250"}.fa-hourglass-1:before,.fa-hourglass-start:before{content:"\f251"}.fa-hourglass-2:before,.fa-hourglass-half:before{content:"\f252"}.fa-hourglass-3:before,.fa-hourglass-end:before{content:"\f253"}.fa-hourglass:before{content:"\f254"}.fa-hand-grab-o:before,.fa-hand-rock-o:before{content:"\f255"}.fa-hand-stop-o:before,.fa-hand-paper-o:before{content:"\f256"}.fa-hand-scissors-o:before{content:"\f257"}.fa-hand-lizard-o:before{content:"\f258"}.fa-hand-spock-o:before{content:"\f259"}.fa-hand-pointer-o:before{content:"\f25a"}.fa-hand-peace-o:before{content:"\f25b"}.fa-trademark:before{content:"\f25c"}.fa-registered:before{content:"\f25d"}.fa-creative-commons:before{content:"\f25e"}.fa-gg:before{content:"\f260"}.fa-gg-circle:before{content:"\f261"}.fa-tripadvisor:before{content:"\f262"}.fa-odnoklassniki:before{content:"\f263"}.fa-odnoklassniki-square:before{content:"\f264"}.fa-get-pocket:before{content:"\f265"}.fa-wikipedia-w:before{content:"\f266"}.fa-safari:before{content:"\f267"}.fa-chrome:before{content:"\f268"}.fa-firefox:before{content:"\f269"}.fa-opera:before{content:"\f26a"}.fa-internet-explorer:before{content:"\f26b"}.fa-tv:before,.fa-television:before{content:"\f26c"}.fa-contao:before{content:"\f26d"}.fa-500px:before{content:"\f26e"}.fa-amazon:before{content:"\f270"}.fa-calendar-plus-o:before{content:"\f271"}.fa-calendar-minus-o:before{content:"\f272"}.fa-calendar-times-o:before{content:"\f273"}.fa-calendar-check-o:before{content:"\f274"}.fa-industry:before{content:"\f275"}.fa-map-pin:before{content:"\f276"}.fa-map-signs:before{content:"\f277"}.fa-map-o:before{content:"\f278"}.fa-map:before{content:"\f279"}.fa-commenting:before{content:"\f27a"}.fa-commenting-o:before{content:"\f27b"}.fa-houzz:before{content:"\f27c"}.fa-vimeo:before{content:"\f27d"}.fa-black-tie:before{content:"\f27e"}.fa-fonticons:before{content:"\f280"}.fa-reddit-alien:before{content:"\f281"}.fa-edge:before{content:"\f282"}.fa-credit-card-alt:before{content:"\f283"}.fa-codiepie:before{content:"\f284"}.fa-modx:before{content:"\f285"}.fa-fort-awesome:before{content:"\f286"}.fa-usb:before{content:"\f287"}.fa-product-hunt:before{content:"\f288"}.fa-mixcloud:before{content:"\f289"}.fa-scribd:before{content:"\f28a"}.fa-pause-circle:before{content:"\f28b"}.fa-pause-circle-o:before{content:"\f28c"}.fa-stop-circle:before{content:"\f28d"}.fa-stop-circle-o:before{content:"\f28e"}.fa-shopping-bag:before{content:"\f290"}.fa-shopping-basket:before{content:"\f291"}.fa-hashtag:before{content:"\f292"}.fa-bluetooth:before{content:"\f293"}.fa-bluetooth-b:before{content:"\f294"}.fa-percent:before{content:"\f295"} diff --git a/css/main.css b/css/main.css new file mode 100644 index 0000000..036c448 --- /dev/null +++ b/css/main.css @@ -0,0 +1 @@ +.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.sr-only--focusable:active,.sr-only--focusable:focus{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}body{margin:0;color:#333;font-family:"Helvetica","Arial",sans-serif;font-size:14px;font-weight:400;line-height:20px}.header{position:relative;z-index:1;height:48px;padding-left:16px;padding-right:16px;background-color:#666}@media (min-width: 768px){.header{padding-left:24px;padding-right:24px}}.title{float:left;display:block;font-size:18px;line-height:48px;color:#fff}.main{position:absolute;top:48px;right:0;bottom:0;left:0;background-color:#333}.main>img{display:table-cell;max-width:100%;vertical-align:middle}.footer{position:absolute;right:0;bottom:0;left:0;height:0}.menu{float:right}.menu__button{float:left;display:block;width:48px;height:48px;border-width:0;font-size:16px;line-height:48px;text-align:center;background-color:transparent;color:#fff;cursor:pointer}.menu__button:focus{outline:none}.menu__button:hover{background-color:#0074d9;color:#fff}.menu__button--success:hover{background-color:#2ecc40}.menu__button--danger:hover{background-color:#ff4136}.toolbar{position:absolute;left:50%;bottom:16px;z-index:2015;width:256px;height:32px;margin-left:-128px;background-color:rgba(0,0,0,0.5);color:#fff}.toolbar__button{float:left;display:block;width:32px;height:32px;border-width:0;font-size:14px;text-align:center;background-color:transparent;color:#fff;cursor:pointer}.toolbar__button:focus{outline:none}.toolbar__button:hover{background-color:#0074d9;color:#fff}.upload{display:table;width:100%;height:100%;overflow:hidden}.upload>p{display:table-cell;color:#999;text-align:center;vertical-align:middle}.browse{margin-left:4px;color:#0074d9;cursor:pointer}.browse:hover{color:#0d8eff;text-decoration:underline}.canvas{width:100%;height:100%}.editor{height:100%;overflow:hidden}.editor>img{display:block;max-width:100%;max-height:100%;margin:auto;vertical-align:middle} diff --git a/fonts/FontAwesome.otf b/fonts/FontAwesome.otf new file mode 100644 index 0000000..3ed7f8b Binary files /dev/null and b/fonts/FontAwesome.otf differ diff --git a/fonts/fontawesome-webfont.eot b/fonts/fontawesome-webfont.eot new file mode 100644 index 0000000..9b6afae Binary files /dev/null and b/fonts/fontawesome-webfont.eot differ diff --git a/fonts/fontawesome-webfont.svg b/fonts/fontawesome-webfont.svg new file mode 100644 index 0000000..d05688e --- /dev/null +++ b/fonts/fontawesome-webfont.svg @@ -0,0 +1,655 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/fonts/fontawesome-webfont.ttf b/fonts/fontawesome-webfont.ttf new file mode 100644 index 0000000..26dea79 Binary files /dev/null and b/fonts/fontawesome-webfont.ttf differ diff --git a/fonts/fontawesome-webfont.woff b/fonts/fontawesome-webfont.woff new file mode 100644 index 0000000..dc35ce3 Binary files /dev/null and b/fonts/fontawesome-webfont.woff differ diff --git a/fonts/fontawesome-webfont.woff2 b/fonts/fontawesome-webfont.woff2 new file mode 100644 index 0000000..500e517 Binary files /dev/null and b/fonts/fontawesome-webfont.woff2 differ diff --git a/gulpfile.js b/gulpfile.js new file mode 100644 index 0000000..ada2fff --- /dev/null +++ b/gulpfile.js @@ -0,0 +1,147 @@ +'use strict'; + +var gulp = require('gulp'); +var webpack = require('webpack'); +var plugins = require('gulp-load-plugins')(); +var scripts = { + entry: './src/js/main.js', + output: './js/main.js', + src: './src/js/**', + dest: './js' + }; +var styles = { + entry: './src/css/main.scss', + src: './src/css/**', + dest: './css' + }; +var fonts = { + dest: './fonts' + }; +var html = { + entry: './src/index.jade', + src: './src/**', + dest: './' + }; + +gulp.task('eslint', function() { + return gulp.src(scripts.src) + .pipe(plugins.eslint()) + .pipe(plugins.eslint.format()); +}); + +gulp.task('webpack', function(callback) { + webpack({ + entry: scripts.entry, + output: { + filename: scripts.output + }, + externals: { + 'vue': 'window.Vue', + 'cropper': 'window.Cropper' + }, + module: { + loaders: [ + { + test: /\.js$/, + exclude: /node_modules/, + loader: 'babel-loader', + query: { + presets: ['es2015'] + } + } + ] + } + }, function(err, stats) { + if(err) { + throw new plugins.util.PluginError('webpack', err); + } + + plugins.util.log('[webpack]', stats.toString()); + + callback(); + }); +}); + +gulp.task('js', ['eslint', 'webpack'], function() { + return gulp.src(scripts.output) + .pipe(plugins.uglify()) + .pipe(gulp.dest(scripts.dest)); +}); + +gulp.task('sass', function() { + return gulp.src(styles.entry) + .pipe(plugins.sass({ + outputStyle: 'expanded' + })) + .pipe(gulp.dest(styles.dest)); +}); + +gulp.task('css', function() { + return gulp.src(styles.entry) + .pipe(plugins.sass({ + outputStyle: 'compressed' + })) + .pipe(plugins.autoprefixer({ + browsers: [ + 'Android 2.3', + 'Android >= 4', + 'Chrome >= 35', + 'Firefox >= 31', + 'Edge >= 12', + 'Explorer >= 9', + 'iOS >= 7', + 'Opera >= 12', + 'Safari >= 7.1' + ] + })) + .pipe(gulp.dest(styles.dest)); +}); + +gulp.task('jade', function() { + return gulp.src(html.entry) + .pipe(plugins.jade({ + pretty: true + })) + .pipe(gulp.dest(html.dest)); +}); + +gulp.task('html', function() { + return gulp.src(html.entry) + .pipe(plugins.jade()) + .pipe(gulp.dest(html.dest)); +}); + +gulp.task('asset:font', function() { + return gulp.src([ + 'node_modules/font-awesome/fonts/*' + ]) + .pipe(gulp.dest(fonts.dest)); +}); + +gulp.task('asset:css', function() { + return gulp.src([ + 'node_modules/cropperjs/dist/cropper.min.css', + 'node_modules/font-awesome/css/font-awesome.min.css' + ]) + .pipe(gulp.dest(styles.dest)); +}); + +gulp.task('asset:js', function() { + return gulp.src([ + 'node_modules/vue/dist/vue.min.js', + 'node_modules/cropperjs/dist/cropper.min.js' + ]) + .pipe(gulp.dest(scripts.dest)); +}); + +gulp.task('asset', ['asset:font', 'asset:css', 'asset:js']); + +gulp.task('release', ['js', 'css', 'html', 'asset']); + +gulp.task('watch', function () { + gulp.watch(scripts.src, ['webpack']); + gulp.watch(styles.src, ['sass']); + gulp.watch(html.src, ['jade']); +}); + +gulp.task('default', ['watch']); diff --git a/index.html b/index.html new file mode 100644 index 0000000..ec9fe4b --- /dev/null +++ b/index.html @@ -0,0 +1 @@ +Photo Editor
Photo Editor
\ No newline at end of file diff --git a/js/cropper.min.js b/js/cropper.min.js new file mode 100644 index 0000000..a9f240d --- /dev/null +++ b/js/cropper.min.js @@ -0,0 +1,10 @@ +/*! + * Cropper.js v0.5.5 + * https://github.com/fengyuanchen/cropperjs + * + * Copyright (c) 2015-2016 Fengyuan Chen + * Released under the MIT license + * + * Date: 2016-01-01T08:10:31.084Z + */ +!function(t,e){"object"==typeof module&&"object"==typeof module.exports?module.exports=t.document?e(t,!0):function(t){if(!t.document)throw new Error("Cropper requires a window with a document");return e(t)}:e(t)}("undefined"!=typeof window?window:this,function(t,e){"use strict";function i(t){return Kt.call(t).slice(8,-1).toLowerCase()}function a(t){return"number"==typeof t&&!isNaN(t)}function n(t){return"undefined"==typeof t}function o(t){return"object"==typeof t&&null!==t}function r(t){var e,i;if(!o(t))return!1;try{return e=t.constructor,i=e.prototype,e&&i&&Gt.call(i,"isPrototypeOf")}catch(a){return!1}}function h(t){return"function"===i(t)}function l(t){return $.isArray?$.isArray(t):"array"===i(t)}function c(t,e){return e=e>=0?e:0,$.from?$.from(t).slice(e):Jt.call(t,e)}function s(t){return"string"==typeof t&&(t=t.trim?t.trim():t.replace(bt,"$1")),t}function d(t,e){var i,n;if(t&&h(e))if(l(t)||a(t.length))for(n=0,i=t.length;i>n&&e.call(t,t[n],n,t)!==!1;n++);else if(o(t))for(n in t)if(t.hasOwnProperty(n)&&e.call(t,t[n],n,t)===!1)break;return t}function p(t){var e;if(arguments.length>1){if(e=c(arguments),Z.assign)return Z.assign.apply(Z,e);e.shift(),d(e,function(e){d(e,function(e,i){t[i]=e})})}return t}function u(t,e){var i=c(arguments,2);return function(){return t.apply(e,i.concat(c(arguments)))}}function g(t,e){var i=t.style;d(e,function(t,e){vt.test(e)&&a(t)&&(t+="px"),i[e]=t})}function f(t,e){return t.classList?t.classList.contains(e):t.className.indexOf(e)>-1}function m(t,e){var i;return a(t.length)?d(t,function(t){m(t,e)}):t.classList?t.classList.add(e):(i=s(t.className),void(i?i.indexOf(e)<0&&(t.className=i+" "+e):t.className=e))}function v(t,e){return a(t.length)?d(t,function(t){v(t,e)}):t.classList?t.classList.remove(e):void(t.className.indexOf(e)>=0&&(t.className=t.className.replace(e,"")))}function w(t,e,i){return a(t.length)?d(t,function(t){w(t,e,i)}):void(i?m(t,e):v(t,e))}function b(t,e){return o(t[e])?t[e]:t.dataset?t.dataset[e]:t.getAttribute("data-"+e)}function x(t,e,i){o(i)&&n(t[e])?t[e]=i:t.dataset?t.dataset[e]=i:t.setAttribute("data-"+e,i)}function D(t,e){o(t[e])?delete t[e]:t.dataset?delete t.dataset[e]:t.removeAttribute("data-"+e)}function C(t,e,i){var a=s(e).split(xt);return a.length>1?d(a,function(e){C(t,e,i)}):void(t.addEventListener?t.addEventListener(e,i,!1):t.attachEvent&&t.attachEvent("on"+e,i))}function y(t,e,i){var a=s(e).split(xt);return a.length>1?d(a,function(e){y(t,e,i)}):void(t.removeEventListener?t.removeEventListener(e,i,!1):t.detachEvent&&t.detachEvent("on"+e,i))}function B(t){t.preventDefault?t.preventDefault():t.returnValue=!1}function T(e){var i,n=e||t.event;return n.target||(n.target=n.srcElement||q),a(n.pageX)||(i=q.documentElement,n.pageX=n.clientX+(t.scrollX||i&&i.scrollLeft||0)-(i&&i.clientLeft||0),n.pageY=n.clientY+(t.scrollY||i&&i.scrollTop||0)-(i&&i.clientTop||0)),n}function L(e){var i=q.documentElement,a=e.getBoundingClientRect();return{left:a.left+(t.scrollX||i&&i.scrollLeft||0)-(i&&i.clientLeft||0),top:a.top+(t.scrollY||i&&i.scrollTop||0)-(i&&i.clientTop||0)}}function X(t){var e=t.length,i=0,a=0;return e&&(d(t,function(t){i+=t.pageX,a+=t.pageY}),i/=e,a/=e),{pageX:i,pageY:a}}function Y(t,e){return t.getElementsByTagName(e)}function k(t,e){return t.getElementsByClassName?t.getElementsByClassName(e):t.querySelectorAll("."+e)}function W(t){return q.createElement(t)}function H(t,e){t.appendChild(e)}function M(t){t.parentNode&&t.parentNode.removeChild(t)}function E(t){for(;t.firstChild;)t.removeChild(t.firstChild)}function O(t){var e=t.match(wt);return e&&(e[1]!==F.protocol||e[2]!==F.hostname||e[3]!==F.port)}function z(t){var e="timestamp="+(new Date).getTime();return t+(-1===t.indexOf("?")?"?":"&")+e}function R(t,e){var i;return t.naturalWidth?e(t.naturalWidth,t.naturalHeight):(i=W("img"),i.onload=function(){e(this.width,this.height)},void(i.src=t.src))}function N(t){var e=[],i=t.rotate,n=t.scaleX,o=t.scaleY;return a(i)&&e.push("rotate("+i+"deg)"),a(n)&&a(o)&&e.push("scale("+n+","+o+")"),e.length?e.join(" "):"none"}function U(t,e){var i,a,n=_t(t.degree)%180,o=(n>90?180-n:n)*Zt/180,r=Pt(o),h=jt(o),l=t.width,c=t.height,s=t.aspectRatio;return e?(i=l/(h+r/s),a=i/s):(i=l*h+c*r,a=l*r+c*h),{width:i,height:a}}function A(t,e){var i,n,o,r=W("canvas"),h=r.getContext("2d"),l=0,c=0,s=e.naturalWidth,d=e.naturalHeight,p=e.rotate,u=e.scaleX,g=e.scaleY,f=a(u)&&a(g)&&(1!==u||1!==g),m=a(p)&&0!==p,v=m||f,w=s,b=d;return f&&(i=s/2,n=d/2),m&&(o=U({width:s,height:d,degree:p}),w=o.width,b=o.height,i=o.width/2,n=o.height/2),r.width=w,r.height=b,v&&(l=-s/2,c=-d/2,h.save(),h.translate(i,n)),m&&h.rotate(p*Zt/180),f&&h.scale(u,g),h.drawImage(t,Vt(l),Vt(c),Vt(s),Vt(d)),v&&h.restore(),r}function I(t,e,i){var a="",n=e;for(i+=e;i>n;n++)a+=Qt(t.getUint8(n));return a}function S(t){var e,i,a,n,o,r,h,l,c,s,d=new DataView(t),p=d.byteLength;if(255===d.getUint8(0)&&216===d.getUint8(1))for(c=2;p>c;){if(255===d.getUint8(c)&&225===d.getUint8(c+1)){h=c;break}c++}if(h&&(i=h+4,a=h+10,"Exif"===I(d,i,4)&&(r=d.getUint16(a),o=18761===r,(o||19789===r)&&42===d.getUint16(a+2,o)&&(n=d.getUint32(a+4,o),n>=8&&(l=a+n)))),l)for(p=d.getUint16(l,o),s=0;p>s;s++)if(c=l+12*s+2,274===d.getUint16(c,o)){c+=8,e=d.getUint16(c,o),d.setUint16(c,1,o);break}return e}function _(t){var e,i=t.replace(Ct,""),a=atob(i),n=a.length,o=new V(n),r=new Uint8Array(o);for(e=0;n>e;e++)r[e]=a.charCodeAt(e);return o}function P(t){var e,i=new Uint8Array(t),a=i.length,n="";for(e=0;a>e;e++)n+=Qt(i[e]);return"data:image/jpeg;base64,"+btoa(n)}function j(t,e){var i=this;i.element=t,i.options=p({},j.DEFAULTS,r(e)&&e),i.ready=!1,i.built=!1,i.complete=!1,i.rotated=!1,i.cropped=!1,i.disabled=!1,i.replaced=!1,i.limited=!1,i.wheeling=!1,i.isImg=!1,i.originalUrl="",i.canvasData=null,i.cropBoxData=null,i.previews=null,i.init()}var q=t.document,F=t.location,V=t.ArrayBuffer,Z=t.Object,$=t.Array,K=t.String,G=t.Number,J=t.Math,Q="cropper",tt=Q+"-modal",et=Q+"-hide",it=Q+"-hidden",at=Q+"-invisible",nt=Q+"-move",ot=Q+"-crop",rt=Q+"-disabled",ht=Q+"-bg",lt="mousedown touchstart pointerdown MSPointerDown",ct="mousemove touchmove pointermove MSPointerMove",st="mouseup touchend touchcancel pointerup pointercancel MSPointerUp MSPointerCancel",dt="wheel mousewheel DOMMouseScroll",pt="dblclick",ut="resize",gt="error",ft="load",mt=/e|w|s|n|se|sw|ne|nw|all|crop|move|zoom/,vt=/width|height|left|top|marginLeft|marginTop/,wt=/^(https?:)\/\/([^\:\/\?#]+):?(\d*)/i,bt=/^\s+(.*)\s+$/,xt=/\s+/,Dt=/^data\:/,Ct=/^data\:([^\;]+)\;base64,/,yt=/^data\:image\/jpeg.*;base64,/,Bt="preview",Tt="action",Lt="e",Xt="w",Yt="s",kt="n",Wt="se",Ht="sw",Mt="ne",Et="nw",Ot="all",zt="crop",Rt="move",Nt="zoom",Ut="none",At=!!q.createElement("canvas").getContext,It=J.min,St=J.max,_t=J.abs,Pt=J.sin,jt=J.cos,qt=J.sqrt,Ft=J.round,Vt=J.floor,Zt=J.PI,$t=Z.prototype,Kt=$t.toString,Gt=$t.hasOwnProperty,Jt=$.prototype.slice,Qt=K.fromCharCode;j.prototype={constructor:j,init:function(){var t,e=this,i=e.element,a=i.tagName.toLowerCase();if(!b(i,Q)){if(x(i,Q,e),"img"===a){if(e.isImg=!0,e.originalUrl=t=i.getAttribute("src"),!t)return;t=i.src}else"canvas"===a&&At&&(t=i.toDataURL());e.load(t)}},load:function(t){var e,i=this,a=i.options;if(t&&(!h(a.build)||a.build.call(i.element)!==!1)){if(i.url=t,i.imageData={},!a.checkOrientation||!V)return i.clone();if(Dt.test(t))return yt.test(t)?i.read(_(t)):i.clone();e=new XMLHttpRequest,e.onerror=e.onabort=function(){i.clone()},e.onload=function(){i.read(this.response)},e.open("get",t),e.responseType="arraybuffer",e.send()}},read:function(t){var e,i,a,n=this,o=n.options,r=S(t),h=n.imageData;if(r>1)switch(n.url=P(t),r){case 2:i=-1;break;case 3:e=-180;break;case 4:a=-1;break;case 5:e=90,a=-1;break;case 6:e=90;break;case 7:e=90,i=-1;break;case 8:e=-90}o.rotatable&&(h.rotate=e),o.scalable&&(h.scaleX=i,h.scaleY=a),n.clone()},clone:function(){var t,e,i,a,n,o=this,r=o.element,h=o.url;o.options.checkCrossOrigin&&O(h)&&(t=r.crossOrigin,t||(t="anonymous",e=z(h))),o.crossOrigin=t,o.crossOriginUrl=e,i=W("img"),t&&(i.crossOrigin=t),i.src=e||h,o.image=i,o._start=a=u(o.start,o),o._stop=n=u(o.stop,o),o.isImg?r.complete?o.start():C(r,ft,a):(C(i,ft,a),C(i,gt,n),m(i,et),r.parentNode.insertBefore(i,r.nextSibling))},start:function(t){var e=this,i=e.isImg?e.element:e.image;t&&(y(i,ft,e._start),y(i,gt,e._stop)),R(i,function(t,i){p(e.imageData,{naturalWidth:t,naturalHeight:i,aspectRatio:t/i}),e.ready=!0,e.build()})},stop:function(){var t=this,e=t.image;y(e,ft,t._start),y(e,gt,t._stop),M(e),t.image=null},build:function(){var t,e,i,a,n,o,r,l=this,c=l.options,s=l.element,d=l.image;l.ready&&(l.built&&l.unbuild(),e=W("div"),e.innerHTML=j.TEMPLATE,l.container=t=s.parentNode,l.cropper=i=k(e,"cropper-container")[0],l.canvas=a=k(i,"cropper-canvas")[0],l.dragBox=n=k(i,"cropper-drag-box")[0],l.cropBox=o=k(i,"cropper-crop-box")[0],l.viewBox=k(i,"cropper-view-box")[0],l.face=r=k(o,"cropper-face")[0],H(a,d),m(s,it),t.insertBefore(i,s.nextSibling),l.isImg||v(d,et),l.initPreview(),l.bind(),c.aspectRatio=St(0,c.aspectRatio)||NaN,c.viewMode=St(0,It(3,Ft(c.viewMode)))||0,c.autoCrop?(l.cropped=!0,c.modal&&m(n,tt)):m(o,it),c.guides||m(k(o,"cropper-dashed"),it),c.center||m(k(o,"cropper-center"),it),c.background&&m(i,ht),c.highlight||m(r,at),c.cropBoxMovable&&(m(r,nt),x(r,Tt,Ot)),c.cropBoxResizable||(m(k(o,"cropper-line"),it),m(k(o,"cropper-point"),it)),l.setDragMode(c.dragMode),l.render(),l.built=!0,l.setData(c.data),setTimeout(function(){h(c.built)&&c.built.call(s),h(c.crop)&&c.crop.call(s,l.getData()),l.complete=!0},0))},unbuild:function(){var t=this;t.built&&(t.built=!1,t.complete=!1,t.initialImageData=null,t.initialCanvasData=null,t.initialCropBoxData=null,t.containerData=null,t.canvasData=null,t.cropBoxData=null,t.unbind(),t.resetPreview(),t.previews=null,t.viewBox=null,t.cropBox=null,t.dragBox=null,t.canvas=null,t.container=null,M(t.cropper),t.cropper=null)},render:function(){var t=this;t.initContainer(),t.initCanvas(),t.initCropBox(),t.renderCanvas(),t.cropped&&t.renderCropBox()},initContainer:function(){var t,e=this,i=e.options,a=e.element,n=e.container,o=e.cropper;m(o,it),v(a,it),e.containerData=t={width:St(n.offsetWidth,G(i.minContainerWidth)||200),height:St(n.offsetHeight,G(i.minContainerHeight)||100)},g(o,{width:t.width,height:t.height}),m(a,it),v(o,it)},initCanvas:function(){var t,e=this,i=e.options.viewMode,a=e.containerData,n=e.imageData,o=90===_t(n.rotate),r=o?n.naturalHeight:n.naturalWidth,h=o?n.naturalWidth:n.naturalHeight,l=r/h,c=a.width,s=a.height;a.height*l>a.width?3===i?c=a.height*l:s=a.width/l:3===i?s=a.width/l:c=a.height*l,t={naturalWidth:r,naturalHeight:h,aspectRatio:l,width:c,height:s},t.oldLeft=t.left=(a.width-c)/2,t.oldTop=t.top=(a.height-s)/2,e.canvasData=t,e.limited=1===i||2===i,e.limitCanvas(!0,!0),e.initialImageData=p({},n),e.initialCanvasData=p({},t)},limitCanvas:function(t,e){var i,a,n,o,r=this,h=r.options,l=h.viewMode,c=r.containerData,s=r.canvasData,d=s.aspectRatio,p=r.cropBoxData,u=r.cropped&&p;t&&(i=G(h.minCanvasWidth)||0,a=G(h.minCanvasHeight)||0,l>1?(i=St(i,c.width),a=St(a,c.height),3===l&&(a*d>i?i=a*d:a=i/d)):l>0&&(i?i=St(i,u?p.width:0):a?a=St(a,u?p.height:0):u&&(i=p.width,a=p.height,a*d>i?i=a*d:a=i/d)),i&&a?a*d>i?a=i/d:i=a*d:i?a=i/d:a&&(i=a*d),s.minWidth=i,s.minHeight=a,s.maxWidth=1/0,s.maxHeight=1/0),e&&(l?(n=c.width-s.width,o=c.height-s.height,s.minLeft=It(0,n),s.minTop=It(0,o),s.maxLeft=St(0,n),s.maxTop=St(0,o),u&&r.limited&&(s.minLeft=It(p.left,p.left+p.width-s.width),s.minTop=It(p.top,p.top+p.height-s.height),s.maxLeft=p.left,s.maxTop=p.top,2===l&&(s.width>=c.width&&(s.minLeft=It(0,n),s.maxLeft=St(0,n)),s.height>=c.height&&(s.minTop=It(0,o),s.maxTop=St(0,o))))):(s.minLeft=-s.width,s.minTop=-s.height,s.maxLeft=c.width,s.maxTop=c.height))},renderCanvas:function(t){var e,i,a=this,n=a.canvasData,o=a.imageData,r=o.rotate;a.rotated&&(a.rotated=!1,i=U({width:o.width,height:o.height,degree:r}),e=i.width/i.height,e!==n.aspectRatio&&(n.left-=(i.width-n.width)/2,n.top-=(i.height-n.height)/2,n.width=i.width,n.height=i.height,n.aspectRatio=e,n.naturalWidth=o.naturalWidth,n.naturalHeight=o.naturalHeight,r%180&&(i=U({width:o.naturalWidth,height:o.naturalHeight,degree:r}),n.naturalWidth=i.width,n.naturalHeight=i.height),a.limitCanvas(!0,!1))),(n.width>n.maxWidth||n.widthn.maxHeight||n.heightn.width?o.height=o.width/i:o.width=o.height*i),t.cropBoxData=o,t.limitCropBox(!0,!0),o.width=It(St(o.width,o.minWidth),o.maxWidth),o.height=It(St(o.height,o.minHeight),o.maxHeight),o.width=St(o.minWidth,o.width*a),o.height=St(o.minHeight,o.height*a),o.oldLeft=o.left=n.left+(n.width-o.width)/2,o.oldTop=o.top=n.top+(n.height-o.height)/2,t.initialCropBoxData=p({},o)},limitCropBox:function(t,e){var i,a,n,o,r=this,h=r.options,l=h.aspectRatio,c=r.containerData,s=r.canvasData,d=r.cropBoxData,p=r.limited;t&&(i=G(h.minCropBoxWidth)||0,a=G(h.minCropBoxHeight)||0,i=It(i,c.width),a=It(a,c.height),n=It(c.width,p?s.width:c.width),o=It(c.height,p?s.height:c.height),l&&(i&&a?a*l>i?a=i/l:i=a*l:i?a=i/l:a&&(i=a*l),o*l>n?o=n/l:n=o*l),d.minWidth=It(i,n),d.minHeight=It(a,o),d.maxWidth=n,d.maxHeight=o),e&&(p?(d.minLeft=St(0,s.left),d.minTop=St(0,s.top),d.maxLeft=It(c.width,s.left+s.width)-d.width,d.maxTop=It(c.height,s.top+s.height)-d.height):(d.minLeft=0,d.minTop=0,d.maxLeft=c.width-d.width,d.maxTop=c.height-d.height))},renderCropBox:function(){var t=this,e=t.options,i=t.containerData,a=t.cropBoxData;(a.width>a.maxWidth||a.widtha.maxHeight||a.heighta&&(f=a/o,s=n*f,d=a),g(t,{width:s,height:d}),g(Y(t,"img")[0],p({width:r*f,height:h*f,marginLeft:-l*f,marginTop:-c*f},u))}))},bind:function(){var e=this,i=e.options,a=e.cropper;C(a,lt,e._cropStart=u(e.cropStart,e)),i.zoomable&&i.zoomOnWheel&&C(a,dt,e._wheel=u(e.wheel,e)),i.toggleDragModeOnDblclick&&C(a,pt,e._dblclick=u(e.dblclick,e)),C(q,ct,e._cropMove=u(e.cropMove,e)),C(q,st,e._cropEnd=u(e.cropEnd,e)),i.responsive&&C(t,ut,e._resize=u(e.resize,e))},unbind:function(){var e=this,i=e.options,a=e.cropper;y(a,lt,e._cropStart),i.zoomable&&i.zoomOnWheel&&y(a,dt,e._wheel),i.toggleDragModeOnDblclick&&y(a,pt,e._dblclick),y(q,ct,e._cropMove),y(q,st,e._cropEnd),i.responsive&&y(t,ut,e._resize)},resize:function(){var t,e,i,a=this,n=a.options.restore,o=a.container,r=a.containerData;!a.disabled&&r&&(i=o.offsetWidth/r.width,(1!==i||o.offsetHeight!==r.height)&&(n&&(t=a.getCanvasData(),e=a.getCropBoxData()),a.render(),n&&(a.setCanvasData(d(t,function(e,a){t[a]=e*i})),a.setCropBoxData(d(e,function(t,a){e[a]=t*i})))))},dblclick:function(){var t=this;t.disabled||t.setDragMode(f(t.dragBox,ot)?Rt:zt)},wheel:function(t){var e=this,i=T(t),a=G(e.options.wheelZoomRatio)||.1,n=1;e.disabled||(B(i),e.wheeling||(e.wheeling=!0,setTimeout(function(){e.wheeling=!1},50),i.deltaY?n=i.deltaY>0?1:-1:i.wheelDelta?n=-i.wheelDelta/120:i.detail&&(n=i.detail>0?1:-1),e.zoom(-n*a,i)))},cropStart:function(t){var e,i,a,n=this,o=n.options,r=T(t),l=r.touches;if(!n.disabled){if(l){if(e=l.length,e>1){if(!o.zoomable||!o.zoomOnTouch||2!==e)return;i=l[1],n.startX2=i.pageX,n.startY2=i.pageY,a=Nt}i=l[0]}if(a=a||b(r.target,Tt),mt.test(a)){if(h(o.cropstart)&&o.cropstart.call(n.element,{originalEvent:r,action:a})===!1)return;B(r),n.action=a,n.cropping=!1,n.startX=i?i.pageX:r.pageX,n.startY=i?i.pageY:r.pageY,a===zt&&(n.cropping=!0,m(n.dragBox,tt))}}},cropMove:function(t){var e,i,a=this,n=a.options,o=T(t),r=o.touches,l=a.action;if(!a.disabled){if(r){if(e=r.length,e>1){if(!n.zoomable||!n.zoomOnTouch||2!==e)return;i=r[1],a.endX2=i.pageX,a.endY2=i.pageY}i=r[0]}if(l){if(h(n.cropmove)&&n.cropmove.call(a.element,{originalEvent:o,action:l})===!1)return;B(o),a.endX=i?i.pageX:o.pageX,a.endY=i?i.pageY:o.pageY,a.change(o.shiftKey,l===Nt?o:null)}}},cropEnd:function(t){var e=this,i=e.options,a=T(t),n=e.action;e.disabled||n&&(B(a),e.cropping&&(e.cropping=!1,w(e.dragBox,tt,e.cropped&&i.modal)),e.action="",h(i.cropend)&&i.cropend.call(e.element,{originalEvent:a,action:n}))},change:function(t,e){var i,a,n=this,o=n.options,r=o.aspectRatio,h=n.action,l=n.containerData,c=n.canvasData,s=n.cropBoxData,d=s.width,p=s.height,u=s.left,g=s.top,f=u+d,m=g+p,w=0,b=0,x=l.width,D=l.height,C=!0;switch(!r&&t&&(r=d&&p?d/p:1),n.limited&&(w=s.minLeft,b=s.minTop,x=w+It(l.width,c.width),D=b+It(l.height,c.height)),a={x:n.endX-n.startX,y:n.endY-n.startY},r&&(a.X=a.y*r,a.Y=a.x/r),h){case Ot:u+=a.x,g+=a.y;break;case Lt:if(a.x>=0&&(f>=x||r&&(b>=g||m>=D))){C=!1;break}d+=a.x,r&&(p=d/r,g-=a.Y/2),0>d&&(h=Xt,d=0);break;case kt:if(a.y<=0&&(b>=g||r&&(w>=u||f>=x))){C=!1;break}p-=a.y,g+=a.y,r&&(d=p*r,u+=a.X/2),0>p&&(h=Yt,p=0);break;case Xt:if(a.x<=0&&(w>=u||r&&(b>=g||m>=D))){C=!1;break}d-=a.x,u+=a.x,r&&(p=d/r,g+=a.Y/2),0>d&&(h=Lt,d=0);break;case Yt:if(a.y>=0&&(m>=D||r&&(w>=u||f>=x))){C=!1;break}p+=a.y,r&&(d=p*r,u-=a.X/2),0>p&&(h=kt,p=0);break;case Mt:if(r){if(a.y<=0&&(b>=g||f>=x)){C=!1;break}p-=a.y,g+=a.y,d=p*r}else a.x>=0?x>f?d+=a.x:a.y<=0&&b>=g&&(C=!1):d+=a.x,a.y<=0?g>b&&(p-=a.y,g+=a.y):(p-=a.y,g+=a.y);0>d&&0>p?(h=Ht,p=0,d=0):0>d?(h=Et,d=0):0>p&&(h=Wt,p=0);break;case Et:if(r){if(a.y<=0&&(b>=g||w>=u)){C=!1;break}p-=a.y,g+=a.y,d=p*r,u+=a.X}else a.x<=0?u>w?(d-=a.x,u+=a.x):a.y<=0&&b>=g&&(C=!1):(d-=a.x,u+=a.x),a.y<=0?g>b&&(p-=a.y,g+=a.y):(p-=a.y,g+=a.y);0>d&&0>p?(h=Wt,p=0,d=0):0>d?(h=Mt,d=0):0>p&&(h=Ht,p=0);break;case Ht:if(r){if(a.x<=0&&(w>=u||m>=D)){C=!1;break}d-=a.x,u+=a.x,p=d/r}else a.x<=0?u>w?(d-=a.x,u+=a.x):a.y>=0&&m>=D&&(C=!1):(d-=a.x,u+=a.x),a.y>=0?D>m&&(p+=a.y):p+=a.y;0>d&&0>p?(h=Mt,p=0,d=0):0>d?(h=Wt,d=0):0>p&&(h=Et,p=0);break;case Wt:if(r){if(a.x>=0&&(f>=x||m>=D)){C=!1;break}d+=a.x,p=d/r}else a.x>=0?x>f?d+=a.x:a.y>=0&&m>=D&&(C=!1):d+=a.x,a.y>=0?D>m&&(p+=a.y):p+=a.y;0>d&&0>p?(h=Et,p=0,d=0):0>d?(h=Ht,d=0):0>p&&(h=Mt,p=0);break;case Rt:n.move(a.x,a.y),C=!1;break;case Nt:n.zoom(function(t,e,i,a){var n=qt(t*t+e*e),o=qt(i*i+a*a);return(o-n)/n}(_t(n.startX-n.startX2),_t(n.startY-n.startY2),_t(n.endX-n.endX2),_t(n.endY-n.endY2)),e),n.startX2=n.endX2,n.startY2=n.endY2,C=!1;break;case zt:if(!a.x||!a.y){C=!1;break}i=L(n.cropper),u=n.startX-i.left,g=n.startY-i.top,d=s.minWidth,p=s.minHeight,a.x>0?h=a.y>0?Wt:Mt:a.x<0&&(u-=d,h=a.y>0?Ht:Et),a.y<0&&(g-=p),n.cropped||(v(n.cropBox,it),n.cropped=!0,n.limited&&n.limitCropBox(!0,!0))}C&&(s.width=d,s.height=p,s.left=u,s.top=g,n.action=h,n.renderCropBox()),n.startX=n.endX,n.startY=n.endY},crop:function(){var t=this;return t.built&&!t.disabled&&(t.cropped||(t.cropped=!0,t.limitCropBox(!0,!0),t.options.modal&&m(t.dragBox,tt),v(t.cropBox,it)),t.setCropBoxData(t.initialCropBoxData)),t},reset:function(){var t=this;return t.built&&!t.disabled&&(t.imageData=p({},t.initialImageData),t.canvasData=p({},t.initialCanvasData),t.cropBoxData=p({},t.initialCropBoxData),t.renderCanvas(),t.cropped&&t.renderCropBox()),t},clear:function(){var t=this;return t.cropped&&!t.disabled&&(p(t.cropBoxData,{left:0,top:0,width:0,height:0}),t.cropped=!1,t.renderCropBox(),t.limitCanvas(),t.renderCanvas(),v(t.dragBox,tt),m(t.cropBox,it)),t},replace:function(t){var e=this;return!e.disabled&&t&&(e.isImg&&(e.replaced=!0,e.element.src=t),e.options.data=null,e.load(t)),e},enable:function(){var t=this;return t.built&&(t.disabled=!1,v(t.cropper,rt)),t},disable:function(){var t=this;return t.built&&(t.disabled=!0,m(t.cropper,rt)),t},destroy:function(){var t=this,e=t.element,i=t.image;return t.ready?(t.isImg&&t.replaced&&(e.src=t.originalUrl),t.unbuild(),v(e,it)):t.isImg?e.off(ft,t.start):i&&M(i),D(e,Q),t},move:function(t,e){var i=this,a=i.canvasData;return i.moveTo(n(t)?t:a.left+G(t),n(e)?e:a.top+G(e))},moveTo:function(t,e){var i=this,o=i.canvasData,r=!1;return n(e)&&(e=t),t=G(t),e=G(e),i.built&&!i.disabled&&i.options.movable&&(a(t)&&(o.left=t,r=!0),a(e)&&(o.top=e,r=!0),r&&i.renderCanvas(!0)),i},zoom:function(t,e){var i=this,a=i.canvasData;return t=G(t),t=0>t?1/(1-t):1+t,i.zoomTo(a.width*t/a.naturalWidth,e)},zoomTo:function(t,e){var i,a,n,o,r=this,l=r.options,c=r.canvasData,s=c.width,d=c.height,p=c.naturalWidth,u=c.naturalHeight;if(t=G(t),t>=0&&r.built&&!r.disabled&&l.zoomable){if(i=p*t,a=u*t,h(l.zoom)&&l.zoom.call(r.element,{originalEvent:e,oldRatio:s/p,ratio:i/p})===!1)return r;e?(n=L(r.cropper),o=e.touches?X(e.touches):{pageX:e.pageX,pageY:e.pageY},c.left-=(i-s)*((o.pageX-n.left-c.left)/s),c.top-=(a-d)*((o.pageY-n.top-c.top)/d)):(c.left-=(i-s)/2,c.top-=(a-d)/2),c.width=i,c.height=a,r.renderCanvas(!0)}return r},rotate:function(t){var e=this;return e.rotateTo((e.imageData.rotate||0)+G(t))},rotateTo:function(t){var e=this;return t=G(t),a(t)&&e.built&&!e.disabled&&e.options.rotatable&&(e.imageData.rotate=t%360,e.rotated=!0,e.renderCanvas(!0)),e},scale:function(t,e){var i=this,o=i.imageData,r=!1;return n(e)&&(e=t),t=G(t),e=G(e),i.built&&!i.disabled&&i.options.scalable&&(a(t)&&(o.scaleX=t,r=!0),a(e)&&(o.scaleY=e,r=!0),r&&i.renderImage(!0)),i},scaleX:function(t){var e=this,i=e.imageData.scaleY;return e.scale(t,a(i)?i:1)},scaleY:function(t){var e=this,i=e.imageData.scaleX;return e.scale(a(i)?i:1,t)},getData:function(t){var e,i,a=this,n=a.options,o=a.imageData,r=a.canvasData,h=a.cropBoxData;return a.built&&a.cropped?(i={x:h.left-r.left,y:h.top-r.top,width:h.width,height:h.height},e=o.width/o.naturalWidth,d(i,function(a,n){a/=e,i[n]=t?Ft(a):a})):i={x:0,y:0,width:0,height:0},n.rotatable&&(i.rotate=o.rotate||0),n.scalable&&(i.scaleX=o.scaleX||1,i.scaleY=o.scaleY||1),i},setData:function(t){var e,i,n,o=this,l=o.options,c=o.imageData,s=o.canvasData,d={};return h(t)&&(t=t.call(o.element)),o.built&&!o.disabled&&r(t)&&(l.rotatable&&a(t.rotate)&&t.rotate!==c.rotate&&(c.rotate=t.rotate,o.rotated=e=!0),l.scalable&&(a(t.scaleX)&&t.scaleX!==c.scaleX&&(c.scaleX=t.scaleX,i=!0),a(t.scaleY)&&t.scaleY!==c.scaleY&&(c.scaleY=t.scaleY,i=!0)),e?o.renderCanvas():i&&o.renderImage(),n=c.width/c.naturalWidth,a(t.x)&&(d.left=t.x*n+s.left),a(t.y)&&(d.top=t.y*n+s.top),a(t.width)&&(d.width=t.width*n),a(t.height)&&(d.height=t.height*n),o.setCropBoxData(d)),o},getContainerData:function(){var t=this;return t.built?t.containerData:{}},getImageData:function(){var t=this;return t.ready?t.imageData:{}},getCanvasData:function(){var t=this,e=t.canvasData,i={};return t.built&&d(["left","top","width","height","naturalWidth","naturalHeight"],function(t){i[t]=e[t]}),i},setCanvasData:function(t){var e=this,i=e.canvasData,n=i.aspectRatio;return h(t)&&(t=t.call(e.element)),e.built&&!e.disabled&&r(t)&&(a(t.left)&&(i.left=t.left),a(t.top)&&(i.top=t.top),a(t.width)?(i.width=t.width,i.height=t.width/n):a(t.height)&&(i.height=t.height,i.width=t.height*n),e.renderCanvas(!0)),e},getCropBoxData:function(){var t,e=this,i=e.cropBoxData;return e.built&&e.cropped&&(t={left:i.left,top:i.top,width:i.width,height:i.height}),t||{}},setCropBoxData:function(t){var e,i,n=this,o=n.cropBoxData,l=n.options.aspectRatio;return h(t)&&(t=t.call(n.element)),n.built&&n.cropped&&!n.disabled&&r(t)&&(a(t.left)&&(o.left=t.left),a(t.top)&&(o.top=t.top),a(t.width)&&(e=!0,o.width=t.width),a(t.height)&&(i=!0,o.height=t.height),l&&(e?o.height=o.width/l:i&&(o.width=o.height*l)),n.renderCropBox()),n},getCroppedCanvas:function(t){var e,i,a,n,o,h,l,c,s,d,p,u=this;return u.built&&u.cropped&&At?(r(t)||(t={}),p=u.getData(),e=p.width,i=p.height,c=e/i,r(t)&&(o=t.width,h=t.height,o?(h=o/c,l=o/e):h&&(o=h*c,l=h/i)),a=Vt(o||e),n=Vt(h||i),s=W("canvas"),s.width=a,s.height=n,d=s.getContext("2d"),t.fillColor&&(d.fillStyle=t.fillColor,d.fillRect(0,0,a,n)),d.drawImage.apply(d,function(){var t,a,n,o,r,h,c=A(u.image,u.imageData),s=c.width,d=c.height,g=[c],f=p.x,m=p.y;return-e>=f||f>s?f=t=n=r=0:0>=f?(n=-f,f=0,t=r=It(s,e+f)):s>=f&&(n=0,t=r=It(e,s-f)),0>=t||-i>=m||m>d?m=a=o=h=0:0>=m?(o=-m,m=0,a=h=It(d,i+m)):d>=m&&(o=0,a=h=It(i,d-m)),g.push(Vt(f),Vt(m),Vt(t),Vt(a)),l&&(n*=l,o*=l,r*=l,h*=l),r>0&&h>0&&g.push(Vt(n),Vt(o),Vt(r),Vt(h)),g}.call(u)),s):void 0},setAspectRatio:function(t){var e=this,i=e.options;return e.disabled||n(t)||(i.aspectRatio=St(0,t)||NaN,e.built&&(e.initCropBox(),e.cropped&&e.renderCropBox())),e},setDragMode:function(t){var e,i,a=this,n=a.options,o=a.dragBox,r=a.face;return a.ready&&!a.disabled&&(e=t===zt,i=n.movable&&t===Rt,t=e||i?t:Ut,x(o,Tt,t),w(o,ot,e),w(o,nt,i),n.cropBoxMovable||(x(r,Tt,t),w(r,ot,e),w(r,nt,i))),a}},j.DEFAULTS={viewMode:0,dragMode:"crop",aspectRatio:NaN,data:null,preview:"",responsive:!0,restore:!0,checkCrossOrigin:!0,checkOrientation:!0,modal:!0,guides:!0,center:!0,highlight:!0,background:!0,autoCrop:!0,autoCropArea:.8,movable:!0,rotatable:!0,scalable:!0,zoomable:!0,zoomOnTouch:!0,zoomOnWheel:!0,wheelZoomRatio:.1,cropBoxMovable:!0,cropBoxResizable:!0,toggleDragModeOnDblclick:!0,minCanvasWidth:0,minCanvasHeight:0,minCropBoxWidth:0,minCropBoxHeight:0,minContainerWidth:200,minContainerHeight:100,build:null,built:null,cropstart:null,cropmove:null,cropend:null,crop:null,zoom:null},j.TEMPLATE=function(t,e){return e=e.split(","),t.replace(/\d+/g,function(t){return e[t]})}('<0 6="5-container"><0 6="5-wrap-9"><0 6="5-canvas"><0 6="5-drag-9"><0 6="5-crop-9"><1 6="5-view-9"><1 6="5-8 8-h"><1 6="5-8 8-v"><1 6="5-center"><1 6="5-face"><1 6="5-7 7-e" 3-2="e"><1 6="5-7 7-n" 3-2="n"><1 6="5-7 7-w" 3-2="w"><1 6="5-7 7-s" 3-2="s"><1 6="5-4 4-e" 3-2="e"><1 6="5-4 4-n" 3-2="n"><1 6="5-4 4-w" 3-2="w"><1 6="5-4 4-s" 3-2="s"><1 6="5-4 4-ne" 3-2="ne"><1 6="5-4 4-nw" 3-2="nw"><1 6="5-4 4-sw" 3-2="sw"><1 6="5-4 4-se" 3-2="se">',"div,span,action,data,point,cropper,class,line,dashed,box");var te=t.Cropper;return j.noConflict=function(){return t.Cropper=te,j},j.setDefaults=function(t){p(j.DEFAULTS,t)},"function"==typeof define&&define.amd&&define("cropper",[],function(){return j}),e||(t.Cropper=j),j}); \ No newline at end of file diff --git a/js/main.js b/js/main.js new file mode 100644 index 0000000..2c60c27 --- /dev/null +++ b/js/main.js @@ -0,0 +1 @@ +!function(e){function t(r){if(a[r])return a[r].exports;var o=a[r]={exports:{},id:r,loaded:!1};return e[r].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var a={};return t.m=e,t.c=a,t.p="",t(0)}([function(e,t,a){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}var o=a(1),i=r(o),s=a(2),n=r(s),c=a(3),p=r(c),d=a(4),u=r(d);window.vm=new i["default"]({el:"body",components:{ButtonBox:n["default"],UploadBox:p["default"],CanvasBox:u["default"]},events:{broadcast:function(e,t){this.$broadcast(e,t)}}})},function(e,t){e.exports=window.Vue},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t["default"]={data:function(){return{uploaded:!1,cropping:!1,cropped:!1,download:"undefined"!=typeof document.createElement("a").download,url:"",name:""}},template:"#button-box",methods:{click:function(e){var t=e.target,a=t.dataset.action||t.parentNode.dataset.action;if(a){switch(a){case"restore":this.restore();break;case"remove":this.remove();break;case"clear":case"crop":this.cropping=!1}this.$dispatch("broadcast",a)}},restore:function(){this.cropped=!1,this.url="",this.name=""},remove:function(){this.uploaded=!1,this.cropping=!1,this.cropped&&this.restore()}},events:{uploaded:function(){this.uploaded=!0},cropping:function(){this.cropping=!0},cleared:function(){this.cropping=!1},restored:function(){this.restore()},removed:function(){this.remove()},cropped:function(e){this.cropped=!0,this.cropping=!1,this.download&&(this.url=e.url,this.name=e.name)}}}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t["default"]={data:function(){return{uploaded:!1}},template:"#upload-box",methods:{read:function(e){var t=this,a=arguments.length<=1||void 0===arguments[1]?function(){}:arguments[1],r=null;e?/^image\/\w+$/.test(e.type)?(r=new FileReader,r.onload=function(){t.uploaded=!0,t.$dispatch("broadcast","uploaded",{type:e.type,name:e.name,url:r.result}),a()},r.readAsDataURL(e)):(window.alert("Please choose an image file."),a()):a()},change:function(e){var t=e.target,a=t.files;this.read(a&&a[0],function(){t.value=""})},dragover:function(e){e.preventDefault()},drop:function(e){var t=e.dataTransfer.files;e.preventDefault(),this.read(t&&t[0])}},events:{remove:function(){this.uploaded=!1},removed:function(){this.uploaded=!1}}}},function(e,t,a){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}Object.defineProperty(t,"__esModule",{value:!0});var o=a(5),i=r(o);t["default"]={data:function(){return{editable:!1,cropper:!1,cropping:!1,data:null,image:null,type:"",name:"",url:"",originalUrl:""}},template:"#canvas-box",ready:function(){window.addEventListener("keydown",this.keydown,!1)},beforeDestory:function(){window.removeEventListener("keydown",this.keydown,!1)},methods:{load:function(e){this.image||(this.image=e.target,this.start())},click:function(e){var t=this.cropper,a=e.target,r="";if(t)switch(r=a.dataset.action||a.parentNode.dataset.action){case"move":case"crop":t.setDragMode(r);break;case"zoom-in":t.zoom(.1);break;case"zoom-out":t.zoom(-.1);break;case"rotate-left":t.rotate(-90);break;case"rotate-right":t.rotate(90);break;case"flip-horizontal":t.scaleX(-this.cropper.getData().scaleX||-1);break;case"flip-vertical":t.scaleY(-this.cropper.getData().scaleY||-1)}},keydown:function(e){var t=this.cropper,a=e.key||e.keyCode||e.which||e.charCode;switch(a){case 90:e.ctrlKey&&(e.preventDefault(),this.restore(!0));break;case 46:this.remove(!0)}if(t)switch(a){case 13:this.crop(!0);break;case 27:this.clear(!0);break;case 37:e.preventDefault(),t.move(-1,0);break;case 38:e.preventDefault(),t.move(0,-1);break;case 39:e.preventDefault(),t.move(1,0);break;case 40:e.preventDefault(),t.move(0,1);break;case 67:t.setDragMode("crop");break;case 77:t.setDragMode("move");break;case 73:t.zoom(.1);break;case 79:t.zoom(-.1);break;case 76:t.rotate(-90);break;case 82:t.rotate(90);break;case 72:t.scaleX(-this.cropper.getData().scaleX||-1);break;case 86:t.scaleY(-this.cropper.getData().scaleY||-1)}},start:function(){var e=this;this.cropper||(this.cropper=new i["default"](this.image,{autoCrop:!1,dragMode:"move",background:!1,built:function(){e.data&&(this.cropper.crop().setData(e.data),e.data=null)},crop:function(t){t.width>0&&t.height>0&&!e.cropping&&(e.cropping=!0,e.$dispatch("broadcast","cropping"))}}))},stop:function(){this.cropper&&(this.cropper.destroy(),this.cropper=null,this.cropping=!1)},crop:function(e){var t=this.cropper,a=this.type;this.cropping&&(this.originalUrl=this.url,this.data=t.getData(),this.url=t.getCroppedCanvas("image/png"===a?null:{fillColor:"#fff"}).toDataURL(a),this.stop(),e&&this.$dispatch("broadcast","cropped",{url:this.url,name:this.name}))},clear:function(e){this.cropping&&(this.cropper.clear(),this.cropping=!1,e&&this.$dispatch("broadcast","cleared"))},restore:function(e){this.cropper||(this.image=null,this.url=this.originalUrl,this.originalUrl="",e&&this.$dispatch("broadcast","restored"))},remove:function(e){this.cropping||(this.stop(),this.editable=!1,this.data=null,this.image=null,this.type="",this.name="",this.url="",this.originalUrl="",e&&this.$dispatch("broadcast","removed"))}},events:{uploaded:function(e){var t=e.url,a=e.type,r=e.name;this.editable=!0,this.type=a,this.name=r,this.url=t},remove:function(){this.remove()},crop:function(){this.crop(!0)},clear:function(){this.clear()},restore:function(){this.restore()}}}},function(e,t){e.exports=window.Cropper}]); \ No newline at end of file diff --git a/js/vue.min.js b/js/vue.min.js new file mode 100644 index 0000000..be459c8 --- /dev/null +++ b/js/vue.min.js @@ -0,0 +1,8 @@ +/*! + * Vue.js v1.0.13 + * (c) 2015 Evan You + * Released under the MIT License. + */ +!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.Vue=e()}(this,function(){"use strict";function t(e,n,r){if(i(e,n))return void(e[n]=r);if(e._isVue)return void t(e._data,n,r);var s=e.__ob__;if(!s)return void(e[n]=r);if(s.convert(n,r),s.dep.notify(),s.vms)for(var o=s.vms.length;o--;){var a=s.vms[o];a._proxy(n),a._digest()}return r}function e(t,e){if(i(t,e)){delete t[e];var n=t.__ob__;if(n&&(n.dep.notify(),n.vms))for(var r=n.vms.length;r--;){var s=n.vms[r];s._unproxy(e),s._digest()}}}function i(t,e){return vi.call(t,e)}function n(t){return mi.test(t)}function r(t){var e=(t+"").charCodeAt(0);return 36===e||95===e}function s(t){return null==t?"":t.toString()}function o(t){if("string"!=typeof t)return t;var e=Number(t);return isNaN(e)?t:e}function a(t){return"true"===t?!0:"false"===t?!1:t}function h(t){var e=t.charCodeAt(0),i=t.charCodeAt(t.length-1);return e!==i||34!==e&&39!==e?t:t.slice(1,-1)}function l(t){return t.replace(gi,c)}function c(t,e){return e?e.toUpperCase():""}function u(t){return t.replace(_i,"$1-$2").toLowerCase()}function f(t){return t.replace(bi,c)}function p(t,e){return function(i){var n=arguments.length;return n?n>1?t.apply(e,arguments):t.call(e,i):t.call(e)}}function d(t,e){e=e||0;for(var i=t.length-e,n=new Array(i);i--;)n[i]=t[i+e];return n}function v(t,e){for(var i=Object.keys(e),n=i.length;n--;)t[i[n]]=e[i[n]];return t}function m(t){return null!==t&&"object"==typeof t}function g(t){return yi.call(t)===Ci}function _(t,e,i,n){Object.defineProperty(t,e,{value:i,enumerable:!!n,writable:!0,configurable:!0})}function b(t,e){var i,n,r,s,o,a=function h(){var a=Date.now()-s;e>a&&a>=0?i=setTimeout(h,e-a):(i=null,o=t.apply(r,n),i||(r=n=null))};return function(){return r=this,n=arguments,s=Date.now(),i||(i=setTimeout(a,e)),o}}function y(t,e){for(var i=t.length;i--;)if(t[i]===e)return i;return-1}function C(t){var e=function i(){return i.cancelled?void 0:t.apply(this,arguments)};return e.cancel=function(){e.cancelled=!0},e}function w(t,e){return t==e||(m(t)&&m(e)?JSON.stringify(t)===JSON.stringify(e):!1)}function $(t){this.size=0,this.limit=t,this.head=this.tail=void 0,this._keymap=Object.create(null)}function k(){var t,e=Pi.slice(Vi,Wi).trim();if(e){t={};var i=e.match(Qi);t.name=i[0],i.length>1&&(t.args=i.slice(1).map(x))}t&&(Ri.filters=Ri.filters||[]).push(t),Vi=Wi+1}function x(t){if(Gi.test(t))return{value:o(t),dynamic:!1};var e=h(t),i=e===t;return{value:i?t:e,dynamic:i}}function A(t){var e=Ji.get(t);if(e)return e;for(Pi=t,Mi=zi=!1,Ii=Ui=qi=0,Vi=0,Ri={},Wi=0,Bi=Pi.length;Bi>Wi;Wi++)if(Li=Hi,Hi=Pi.charCodeAt(Wi),Mi)39===Hi&&92!==Li&&(Mi=!Mi);else if(zi)34===Hi&&92!==Li&&(zi=!zi);else if(124===Hi&&124!==Pi.charCodeAt(Wi+1)&&124!==Pi.charCodeAt(Wi-1))null==Ri.expression?(Vi=Wi+1,Ri.expression=Pi.slice(0,Wi).trim()):k();else switch(Hi){case 34:zi=!0;break;case 39:Mi=!0;break;case 40:qi++;break;case 41:qi--;break;case 91:Ui++;break;case 93:Ui--;break;case 123:Ii++;break;case 125:Ii--}return null==Ri.expression?Ri.expression=Pi.slice(0,Wi).trim():0!==Vi&&k(),Ji.put(t,Ri),Ri}function O(t){return t.replace(Ki,"\\$&")}function N(){var t=O(on.delimiters[0]),e=O(on.delimiters[1]),i=O(on.unsafeDelimiters[0]),n=O(on.unsafeDelimiters[1]);Yi=new RegExp(i+"(.+?)"+n+"|"+t+"(.+?)"+e,"g"),tn=new RegExp("^"+i+".*"+n+"$"),Xi=new $(1e3)}function T(t){Xi||N();var e=Xi.get(t);if(e)return e;if(t=t.replace(/\n/g,""),!Yi.test(t))return null;for(var i,n,r,s,o,a,h=[],l=Yi.lastIndex=0;i=Yi.exec(t);)n=i.index,n>l&&h.push({value:t.slice(l,n)}),r=tn.test(i[0]),s=r?i[1]:i[2],o=s.charCodeAt(0),a=42===o,s=a?s.slice(1):s,h.push({tag:!0,value:s.trim(),html:r,oneTime:a}),l=n+i[0].length;return l1?t.map(function(t){return E(t)}).join("+"):E(t[0],!0)}function E(t,e){return t.tag?S(t.value,e):'"'+t.value+'"'}function S(t,e){if(en.test(t)){var i=A(t);return i.filters?"this._applyFilters("+i.expression+",null,"+JSON.stringify(i.filters)+",false)":"("+t+")"}return e?t:"("+t+")"}function F(t,e,i,n){R(t,1,function(){e.appendChild(t)},i,n)}function D(t,e,i,n){R(t,1,function(){M(t,e)},i,n)}function P(t,e,i){R(t,-1,function(){I(t)},e,i)}function R(t,e,i,n,r){var s=t.__v_trans;if(!s||!s.hooks&&!Ni||!n._isCompiled||n.$parent&&!n.$parent._isCompiled)return i(),void(r&&r());var o=e>0?"enter":"leave";s[o](i,r)}function H(t){if("string"==typeof t){t=document.querySelector(t)}return t}function L(t){var e=document.documentElement,i=t&&t.parentNode;return e===t||e===i||!(!i||1!==i.nodeType||!e.contains(i))}function W(t,e){var i=t.getAttribute(e);return null!==i&&t.removeAttribute(e),i}function B(t,e){var i=W(t,":"+e);return null===i&&(i=W(t,"v-bind:"+e)),i}function V(t,e){return t.hasAttribute(e)||t.hasAttribute(":"+e)||t.hasAttribute("v-bind:"+e)}function M(t,e){e.parentNode.insertBefore(t,e)}function z(t,e){e.nextSibling?M(t,e.nextSibling):e.parentNode.appendChild(t)}function I(t){t.parentNode.removeChild(t)}function U(t,e){e.firstChild?M(t,e.firstChild):e.appendChild(t)}function q(t,e){var i=t.parentNode;i&&i.replaceChild(e,t)}function J(t,e,i){t.addEventListener(e,i)}function Q(t,e,i){t.removeEventListener(e,i)}function G(t,e){!xi||t instanceof SVGElement?t.setAttribute("class",e):t.className=e}function Z(t,e){if(t.classList)t.classList.add(e);else{var i=" "+(t.getAttribute("class")||"")+" ";i.indexOf(" "+e+" ")<0&&G(t,(i+e).trim())}}function K(t,e){if(t.classList)t.classList.remove(e);else{for(var i=" "+(t.getAttribute("class")||"")+" ",n=" "+e+" ";i.indexOf(n)>=0;)i=i.replace(n," ");G(t,i.trim())}t.className||t.removeAttribute("class")}function X(t,e){var i,n;if(et(t)&&t.content instanceof DocumentFragment&&(t=t.content),t.hasChildNodes())for(Y(t),n=e?document.createDocumentFragment():document.createElement("div");i=t.firstChild;)n.appendChild(i);return n}function Y(t){tt(t,t.firstChild),tt(t,t.lastChild)}function tt(t,e){e&&3===e.nodeType&&!e.data.trim()&&t.removeChild(e)}function et(t){return t.tagName&&"template"===t.tagName.toLowerCase()}function it(t,e){var i=on.debug?document.createComment(t):document.createTextNode(e?" ":"");return i.__vue_anchor=!0,i}function nt(t){if(t.hasAttributes())for(var e=t.attributes,i=0,n=e.length;n>i;i++){var r=e[i].name;if(hn.test(r))return l(r.replace(hn,""))}}function rt(t,e,i){for(var n;t!==e;)n=t.nextSibling,i(t),t=n;i(e)}function st(t,e,i,n,r){function s(){if(a++,o&&a>=h.length){for(var t=0;tr;r++){var o=n[r];ln.test(o)||cn.test(o)||(e=i[o],g(e)&&(i[o]=li.extend(e)))}}function dt(t){var e,i,n=t.props;if(wi(n))for(t.props={},e=n.length;e--;)i=n[e],"string"==typeof i?t.props[i]=null:i.name&&(t.props[i.name]=i);else if(g(n)){var r=Object.keys(n);for(e=r.length;e--;)i=n[r[e]],"function"==typeof i&&(n[r[e]]={type:i})}}function vt(t){if(wi(t)){for(var e,i={},n=t.length;n--;){e=t[n];var r="function"==typeof e?e.options&&e.options.name||e.id:e.name||e.id;r&&(i[r]=e)}return i}return t}function mt(t,e,n){function r(i){var r=un[i]||fn;o[i]=r(t[i],e[i],n,i)}pt(e),dt(e);var s,o={};if(e.mixins)for(var a=0,h=e.mixins.length;h>a;a++)t=mt(t,e.mixins[a],n);for(s in t)r(s);for(s in e)i(t,s)||r(s);return o}function gt(t,e,i){var n,r=t[e];return r[i]||r[n=l(i)]||r[n.charAt(0).toUpperCase()+n.slice(1)]}function _t(t,e,i){}function bt(){this.id=vn++,this.subs=[]}function yt(t){if(this.value=t,this.dep=new bt,_(t,"__ob__",this),wi(t)){var e=$i?Ct:wt;e(t,dn,mn),this.observeArray(t)}else this.walk(t)}function Ct(t,e){t.__proto__=e}function wt(t,e,i){for(var n=0,r=i.length;r>n;n++){var s=i[n];_(t,s,e[s])}}function $t(t,e){if(t&&"object"==typeof t){var n;return i(t,"__ob__")&&t.__ob__ instanceof yt?n=t.__ob__:(wi(t)||g(t))&&Object.isExtensible(t)&&!t._isVue&&(n=new yt(t)),n&&e&&n.addVm(e),n}}function kt(t,e,i){var n,r,s=new bt;if(on.convertAllProperties){var o=Object.getOwnPropertyDescriptor(t,e);if(o&&o.configurable===!1)return;n=o&&o.get,r=o&&o.set}var a=$t(i);Object.defineProperty(t,e,{enumerable:!0,configurable:!0,get:function(){var e=n?n.call(t):i;if(bt.target&&(s.depend(),a&&a.dep.depend(),wi(e)))for(var r,o=0,h=e.length;h>o;o++)r=e[o],r&&r.__ob__&&r.__ob__.dep.depend();return e},set:function(e){var o=n?n.call(t):i;e!==o&&(r?r.call(t,e):i=e,a=$t(e),s.notify())}})}function xt(t){t.prototype._init=function(t){t=t||{},this.$el=null,this.$parent=t.parent,this.$root=this.$parent?this.$parent.$root:this,this.$children=[],this.$refs={},this.$els={},this._watchers=[],this._directives=[],this._uid=_n++,this._isVue=!0,this._events={},this._eventsCount={},this._isFragment=!1,this._fragment=this._fragmentStart=this._fragmentEnd=null,this._isCompiled=this._isDestroyed=this._isReady=this._isAttached=this._isBeingDestroyed=!1,this._unlinkFn=null,this._context=t._context||this.$parent,this._scope=t._scope,this._frag=t._frag,this._frag&&this._frag.children.push(this),this.$parent&&this.$parent.$children.push(this),t=this.$options=mt(this.constructor.options,t,this),this._updateRef(),this._data={},this._callHook("init"),this._initState(),this._initEvents(),this._callHook("created"),t.el&&this.$mount(t.el)}}function At(t){if(void 0===t)return"eof";var e=t.charCodeAt(0);switch(e){case 91:case 93:case 46:case 34:case 39:case 48:return t;case 95:case 36:return"ident";case 32:case 9:case 10:case 13:case 160:case 65279:case 8232:case 8233:return"ws"}return e>=97&&122>=e||e>=65&&90>=e?"ident":e>=49&&57>=e?"number":"else"}function Ot(t){var e=t.trim();return"0"===t.charAt(0)&&isNaN(t)?!1:n(e)?h(e):"*"+e}function Nt(t){function e(){var e=t[c+1];return u===Tn&&"'"===e||u===jn&&'"'===e?(c++,n="\\"+e,p[yn](),!0):void 0}var i,n,r,s,o,a,h,l=[],c=-1,u=kn,f=0,p=[];for(p[Cn]=function(){void 0!==r&&(l.push(r),r=void 0)},p[yn]=function(){void 0===r?r=n:r+=n},p[wn]=function(){p[yn](),f++},p[$n]=function(){if(f>0)f--,u=Nn,p[yn]();else{if(f=0,r=Ot(r),r===!1)return!1;p[Cn]()}};null!=u;)if(c++,i=t[c],"\\"!==i||!e()){if(s=At(i),h=Fn[u],o=h[s]||h["else"]||Sn,o===Sn)return;if(u=o[0],a=p[o[1]],a&&(n=o[2],n=void 0===n?i:n,a()===!1))return;if(u===En)return l.raw=t,l}}function Tt(t){var e=bn.get(t);return e||(e=Nt(t),e&&bn.put(t,e)),e}function jt(t,e){return Lt(e).get(t)}function Et(e,i,n){var r=e;if("string"==typeof i&&(i=Nt(i)),!i||!m(e))return!1;for(var s,o,a=0,h=i.length;h>a;a++)s=e,o=i[a],"*"===o.charAt(0)&&(o=Lt(o.slice(1)).get.call(r,r)),h-1>a?(e=e[o],m(e)||(e={},t(s,o,e))):wi(e)?e.$set(o,n):o in e?e[o]=n:t(e,o,n);return!0}function St(t,e){var i=Jn.length;return Jn[i]=e?t.replace(Vn,"\\n"):t,'"'+i+'"'}function Ft(t){var e=t.charAt(0),i=t.slice(1);return Hn.test(i)?t:(i=i.indexOf('"')>-1?i.replace(zn,Dt):i,e+"scope."+i)}function Dt(t,e){return Jn[e]}function Pt(t){Wn.test(t),Jn.length=0;var e=t.replace(Mn,St).replace(Bn,"");return e=(" "+e).replace(Un,Ft).replace(zn,Dt),Rt(e)}function Rt(t){try{return new Function("scope","return "+t+";")}catch(e){}}function Ht(t){var e=Tt(t);return e?function(t,i){Et(t,e,i)}:void 0}function Lt(t,e){t=t.trim();var i=Pn.get(t);if(i)return e&&!i.set&&(i.set=Ht(i.exp)),i;var n={exp:t};return n.get=Wt(t)&&t.indexOf("[")<0?Rt("scope."+t):Pt(t),e&&(n.set=Ht(t)),Pn.put(t,n),n}function Wt(t){return In.test(t)&&!qn.test(t)&&"Math."!==t.slice(0,5)}function Bt(){Gn=[],Zn=[],Kn={},Xn={},Yn=tr=!1}function Vt(){Mt(Gn),tr=!0,Mt(Zn),Bt()}function Mt(t){for(var e=0;e47&&58>e?parseInt(t,10):1===t.length&&(e=t.toUpperCase().charCodeAt(0),e>64&&91>e)?e:Or[t]});return function(e){return i.indexOf(e.keyCode)>-1?t.call(this,e):void 0}}function Gt(t){return function(e){return e.stopPropagation(),t.call(this,e)}}function Zt(t){return function(e){return e.preventDefault(),t.call(this,e)}}function Kt(t,e,i){for(var n,r,s,o=e?[]:null,a=0,h=t.options.length;h>a;a++)if(n=t.options[a],s=i?n.hasAttribute("selected"):n.selected){if(r=n.hasOwnProperty("_value")?n._value:n.value,!e)return r;o.push(r)}return o}function Xt(t,e){for(var i=t.length;i--;)if(w(t[i],e))return i;return-1}function Yt(t){return et(t)&&t.content instanceof DocumentFragment}function te(t,e){var i=Rr.get(t);if(i)return i;var n=document.createDocumentFragment(),r=t.match(Wr),s=Br.test(t);if(r||s){var o=r&&r[1],a=Lr[o]||Lr.efault,h=a[0],l=a[1],c=a[2],u=document.createElement("div");for(e||(t=t.trim()),u.innerHTML=l+t+c;h--;)u=u.lastChild;for(var f;f=u.firstChild;)n.appendChild(f)}else n.appendChild(document.createTextNode(t));return Rr.put(t,n),n}function ee(t){if(Yt(t))return Y(t.content),t.content;if("SCRIPT"===t.tagName)return te(t.textContent);for(var e,i=ie(t),n=document.createDocumentFragment();e=i.firstChild;)n.appendChild(e);return Y(n),n}function ie(t){if(!t.querySelectorAll)return t.cloneNode();var e,i,n,r=t.cloneNode(!0);if(Vr){var s=r;if(Yt(t)&&(t=t.content,s=r.content),i=t.querySelectorAll("template"),i.length)for(n=s.querySelectorAll("template"),e=n.length;e--;)n[e].parentNode.replaceChild(ie(i[e]),n[e])}if(Mr)if("TEXTAREA"===t.tagName)r.value=t.value;else if(i=t.querySelectorAll("textarea"),i.length)for(n=r.querySelectorAll("textarea"),e=n.length;e--;)n[e].value=i[e].value;return r}function ne(t,e,i){var n,r;return t instanceof DocumentFragment?(Y(t),e?ie(t):t):("string"==typeof t?i||"#"!==t.charAt(0)?r=te(t,i):(r=Hr.get(t),r||(n=document.getElementById(t.slice(1)),n&&(r=ee(n),Hr.put(t,r)))):t.nodeType&&(r=ee(t)),r&&e?ie(r):r)}function re(t,e,i,n,r,s){this.children=[],this.childFrags=[],this.vm=e,this.scope=r,this.inserted=!1,this.parentFrag=s,s&&s.childFrags.push(this),this.unlink=t(e,i,n,r,this);var o=this.single=1===i.childNodes.length&&!i.childNodes[0].__vue_anchor;o?(this.node=i.childNodes[0],this.before=se,this.remove=oe):(this.node=it("fragment-start"),this.end=it("fragment-end"),this.frag=i,U(this.node,i),i.appendChild(this.end),this.before=ae,this.remove=he),this.node.__vfrag__=this}function se(t,e){this.inserted=!0;var i=e!==!1?D:M;i(this.node,t,this.vm),L(this.node)&&this.callHook(le)}function oe(){this.inserted=!1;var t=L(this.node),e=this;e.callHook(ce),P(this.node,this.vm,function(){t&&e.callHook(ue),e.destroy()})}function ae(t,e){this.inserted=!0;var i=this.vm,n=e!==!1?D:M;rt(this.node,this.end,function(e){n(e,t,i)}),L(this.node)&&this.callHook(le)}function he(){this.inserted=!1;var t=this,e=L(this.node);t.callHook(ce),st(this.node,this.end,this.vm,this.frag,function(){e&&t.callHook(ue),t.destroy()})}function le(t){t._isAttached||t._callHook("attached")}function ce(t){t.$destroy(!1,!0)}function ue(t){t._isAttached&&t._callHook("detached")}function fe(t,e){this.vm=t;var i,n="string"==typeof e;n||et(e)?i=ne(e,!0):(i=document.createDocumentFragment(),i.appendChild(e)),this.template=i;var r,s=t.constructor.cid;if(s>0){var o=s+(n?e:e.outerHTML);r=Ir.get(o),r||(r=xe(i,t.$options,!0),Ir.put(o,r))}else r=xe(i,t.$options,!0);this.linker=r}function pe(t,e,i){var n=t.node.previousSibling;if(n){for(t=n.__vfrag__;!(t&&t.forId===i&&t.inserted||n===e);){if(n=n.previousSibling,!n)return;t=n.__vfrag__}return t}}function de(t){var e=t.node;if(t.end)for(;!e.__vue__&&e!==t.end&&e.nextSibling;)e=e.nextSibling;return e.__vue__}function ve(t){for(var e=-1,i=new Array(t);++e-1:i(t,e)}function we(t,e){for(var i,r,s,o,a,h,c,f=[],p=Object.keys(e),d=p.length;d--;)r=p[d],i=e[r]||us,a=l(r),fs.test(a)&&(c={name:r,path:a,options:i,mode:cs.ONE_WAY,raw:null},s=u(r),null===(o=B(t,s))&&(null!==(o=B(t,s+".sync"))?c.mode=cs.TWO_WAY:null!==(o=B(t,s+".once"))&&(c.mode=cs.ONE_TIME)),null!==o?(c.raw=o,h=A(o),o=h.expression,c.filters=h.filters,n(o)?c.optimizedLiteral=!0:c.dynamic=!0,c.parentPath=o):null!==(o=W(t,s))?c.raw=o:i.required,f.push(c));return $e(f)}function $e(t){return function(e,i){e._props={};for(var n,r,s,l,c,u=t.length;u--;)if(n=t[u],c=n.raw,r=n.path,s=n.options,e._props[r]=n,null===c)ht(e,n,ke(e,s));else if(n.dynamic)e._context&&(n.mode===cs.ONE_TIME?(l=(i||e._context).$get(n.parentPath),ht(e,n,l)):e._bindDir({name:"prop",def:os,prop:n},null,null,i));else if(n.optimizedLiteral){var f=h(c);l=f===c?a(o(c)):f,ht(e,n,l)}else l=s.type===Boolean&&""===c?!0:c,ht(e,n,l)}}function ke(t,e){if(!i(e,"default"))return e.type===Boolean?!1:void 0;var n=e["default"];return m(n),"function"==typeof n&&e.type!==Function?n.call(t):n}function xe(t,e,i){var n=i||!e._asComponent?Se(t,e):null,r=n&&n.terminal||"SCRIPT"===t.tagName||!t.hasChildNodes()?null:Le(t.childNodes,e);return function(t,e,i,s,o){var a=d(e.childNodes),h=Ae(function(){n&&n(t,e,i,s,o),r&&r(t,a,i,s,o)},t);return Ne(t,h)}}function Ae(t,e){var i=e._directives.length;t();var n=e._directives.slice(i);n.sort(Oe);for(var r=0,s=n.length;s>r;r++)n[r]._bind();return n}function Oe(t,e){return t=t.descriptor.def.priority||bs,e=e.descriptor.def.priority||bs,t>e?-1:t===e?0:1}function Ne(t,e,i,n){return function(r){Te(t,e,r),i&&n&&Te(i,n)}}function Te(t,e,i){for(var n=e.length;n--;)e[n]._teardown(),i||t._directives.$remove(e[n])}function je(t,e,i,n){var r=we(e,i),s=Ae(function(){r(t,n)},t);return Ne(t,s)}function Ee(t,e,i){var n,r,s=e._containerAttrs,o=e._replacerAttrs;return 11!==t.nodeType&&(e._asComponent?(s&&i&&(n=Ue(s,i)),o&&(r=Ue(o,e))):r=Ue(t.attributes,e)),function(t,e,i){var s,o=t._context;o&&n&&(s=Ae(function(){n(o,e,null,i)},o));var a=Ae(function(){r&&r(t,e)},t);return Ne(t,a,o,s)}}function Se(t,e){var i=t.nodeType;return 1===i&&"SCRIPT"!==t.tagName?Fe(t,e):3===i&&t.data.trim()?De(t,e):null}function Fe(t,e){if("TEXTAREA"===t.tagName){var i=T(t.value);i&&(t.setAttribute(":value",j(i)),t.value="")}var n,r=t.hasAttributes();return r&&(n=Me(t,e)),n||(n=Be(t,e)),n||(n=Ve(t,e)),!n&&r&&(n=Ue(t.attributes,e)),n}function De(t,e){if(t._skip)return Pe;var i=T(t.wholeText);if(!i)return null;for(var n=t.nextSibling;n&&3===n.nodeType;)n._skip=!0,n=n.nextSibling;for(var r,s,o=document.createDocumentFragment(),a=0,h=i.length;h>a;a++)s=i[a],r=s.tag?Re(s,e):document.createTextNode(s.value),o.appendChild(r);return He(i,o,e)}function Pe(t,e){I(e)}function Re(t,e){function i(e){if(!t.descriptor){var i=A(t.value);t.descriptor={name:e,def:Zr[e],expression:i.expression,filters:i.filters}}}var n;return t.oneTime?n=document.createTextNode(t.value):t.html?(n=document.createComment("v-html"),i("html")):(n=document.createTextNode(" "),i("text")),n}function He(t,e){return function(i,n,r,s){for(var o,a,h,l=e.cloneNode(!0),c=d(l.childNodes),u=0,f=t.length;f>u;u++)o=t[u],a=o.value,o.tag&&(h=c[u],o.oneTime?(a=(s||i).$eval(a),o.html?q(h,ne(a,!0)):h.data=a):i._bindDir(o.descriptor,h,r,s));q(n,l)}}function Le(t,e){for(var i,n,r,s=[],o=0,a=t.length;a>o;o++)r=t[o],i=Se(r,e),n=i&&i.terminal||"SCRIPT"===r.tagName||!r.hasChildNodes()?null:Le(r.childNodes,e),s.push(i,n);return s.length?We(s):null}function We(t){return function(e,i,n,r,s){for(var o,a,h,l=0,c=0,u=t.length;u>l;c++){o=i[c],a=t[l++],h=t[l++];var f=d(o.childNodes);a&&a(e,o,n,r,s),h&&h(e,f,n,r,s)}}}function Be(t,e){var i=t.tagName.toLowerCase();if(!ln.test(i)){"slot"===i&&V(t,"name")&&(i="_namedSlot");var n=gt(e,"elementDirectives",i);return n?Ie(t,i,"",e,n):void 0}}function Ve(t,e){var i=ot(t,e);if(i){var n=nt(t),r={name:"component",ref:n,expression:i.id,def:ls.component,modifiers:{literal:!i.dynamic}},s=function(t,e,i,s,o){n&&kt((s||t).$refs,n,null),t._bindDir(r,e,i,s,o)};return s.terminal=!0,s}}function Me(t,e){if(null!==W(t,"v-pre"))return ze;if(t.hasAttribute("v-else")){var i=t.previousElementSibling;if(i&&i.hasAttribute("v-if"))return ze}for(var n,r,s=0,o=_s.length;o>s;s++)if(r=_s[s],n=t.getAttribute("v-"+r))return Ie(t,r,n,e)}function ze(){}function Ie(t,e,i,n,r){var s=A(i),o={name:e,expression:s.expression,filters:s.filters,raw:i,def:r||Zr[e]};("for"===e||"router-view"===e)&&(o.ref=nt(t));var a=function(t,e,i,n,r){o.ref&&kt((n||t).$refs,o.ref,null),t._bindDir(o,e,i,n,r)};return a.terminal=!0,a}function Ue(t,e){function i(t,e,i){var n=A(s);d.push({name:t,attr:o,raw:a,def:e,arg:l,modifiers:c,expression:n.expression,filters:n.filters,interp:i})}for(var n,r,s,o,a,h,l,c,u,f,p=t.length,d=[];p--;)if(n=t[p],r=o=n.name,s=a=n.value,f=T(s),l=null,c=qe(r),r=r.replace(ms,""),f)s=j(f),l=r,i("bind",Zr.bind,!0);else if(gs.test(r))c.literal=!ps.test(r),i("transition",ls.transition);else if(ds.test(r))l=r.replace(ds,""),i("on",Zr.on);else if(ps.test(r))h=r.replace(ps,""),"style"===h||"class"===h?i(h,ls[h]):(l=h,i("bind",Zr.bind));else if(0===r.indexOf("v-")){if(l=(l=r.match(vs))&&l[1],l&&(r=r.replace(vs,"")),h=r.slice(2),"else"===h)continue;u=gt(e,"directives",h),u&&i(h,u)}return d.length?Je(d):void 0}function qe(t){var e=Object.create(null),i=t.match(ms);if(i)for(var n=i.length;n--;)e[i[n].slice(1)]=!0;return e}function Je(t){return function(e,i,n,r,s){for(var o=t.length;o--;)e._bindDir(t[o],i,n,r,s)}}function Qe(t,e){return e&&(e._containerAttrs=Ze(t)),et(t)&&(t=ne(t)),e&&(e._asComponent&&!e.template&&(e.template=""),e.template&&(e._content=X(t),t=Ge(t,e))),t instanceof DocumentFragment&&(U(it("v-start",!0),t),t.appendChild(it("v-end",!0))),t}function Ge(t,e){var i=e.template,n=ne(i,!0);if(n){var r=n.firstChild,s=r.tagName&&r.tagName.toLowerCase();return e.replace?(t===document.body,n.childNodes.length>1||1!==r.nodeType||"component"===s||gt(e,"components",s)||V(r,"is")||gt(e,"elementDirectives",s)||r.hasAttribute("v-for")||r.hasAttribute("v-if")?n:(e._replacerAttrs=Ze(r),Ke(t,r),r)):(t.appendChild(n),t)}}function Ze(t){return 1===t.nodeType&&t.hasAttributes()?d(t.attributes):void 0}function Ke(t,e){for(var i,n,r=t.attributes,s=r.length;s--;)i=r[s].name,n=r[s].value,e.hasAttribute(i)||ys.test(i)?"class"===i&&n.split(/\s+/).forEach(function(t){Z(e,t)}):e.setAttribute(i,n)}function Xe(e){function n(){}function s(t,e){var i=new It(e,t,null,{lazy:!0});return function(){return i.dirty&&i.evaluate(),bt.target&&i.depend(),i.value}}Object.defineProperty(e.prototype,"$data",{get:function(){return this._data},set:function(t){t!==this._data&&this._setData(t)}}),e.prototype._initState=function(){this._initProps(),this._initMeta(),this._initMethods(),this._initData(),this._initComputed()},e.prototype._initProps=function(){var t=this.$options,e=t.el,i=t.props;e=t.el=H(e),this._propsUnlinkFn=e&&1===e.nodeType&&i?je(this,e,i,this._scope):null},e.prototype._initData=function(){var e=this._data,n=this.$options.data,r=n&&n();if(r){this._data=r;for(var s in e)null===this._props[s].raw&&i(r,s)||t(r,s,e[s])}var o,a,h=this._data,l=Object.keys(h);for(o=l.length;o--;)a=l[o],this._proxy(a);$t(h,this)},e.prototype._setData=function(t){t=t||{};var e=this._data;this._data=t;var n,r,s;for(n=Object.keys(e),s=n.length;s--;)r=n[s],r in t||this._unproxy(r);for(n=Object.keys(t),s=n.length;s--;)r=n[s],i(this,r)||this._proxy(r);e.__ob__.removeVm(this),$t(t,this),this._digest()},e.prototype._proxy=function(t){if(!r(t)){var e=this;Object.defineProperty(e,t,{configurable:!0,enumerable:!0,get:function(){return e._data[t]},set:function(i){e._data[t]=i}})}},e.prototype._unproxy=function(t){r(t)||delete this[t]},e.prototype._digest=function(){for(var t=0,e=this._watchers.length;e>t;t++)this._watchers[t].update(!0)},e.prototype._initComputed=function(){var t=this.$options.computed;if(t)for(var e in t){var i=t[e],r={enumerable:!0,configurable:!0};"function"==typeof i?(r.get=s(i,this),r.set=n):(r.get=i.get?i.cache!==!1?s(i.get,this):p(i.get,this):n,r.set=i.set?p(i.set,this):n),Object.defineProperty(this,e,r)}},e.prototype._initMethods=function(){var t=this.$options.methods;if(t)for(var e in t)this[e]=p(t[e],this)},e.prototype._initMeta=function(){var t=this.$options._meta;if(t)for(var e in t)kt(this,e,t[e])}}function Ye(t){function e(t,e){for(var i,n,r=e.attributes,s=0,o=r.length;o>s;s++)i=r[s].name,ws.test(i)&&(i=i.replace(ws,""),n=(t._scope||t._context).$eval(r[s].value,!0),t.$on(i.replace(ws),n))}function i(t,e,i){if(i){var r,s,o,a;for(s in i)if(r=i[s],wi(r))for(o=0,a=r.length;a>o;o++)n(t,e,s,r[o]);else n(t,e,s,r)}}function n(t,e,i,r,s){var o=typeof r;if("function"===o)t[e](i,r,s);else if("string"===o){var a=t.$options.methods,h=a&&a[r];h&&t[e](i,h,s)}else r&&"object"===o&&n(t,e,i,r.handler,r)}function r(){this._isAttached||(this._isAttached=!0,this.$children.forEach(s))}function s(t){!t._isAttached&&L(t.$el)&&t._callHook("attached")}function o(){this._isAttached&&(this._isAttached=!1,this.$children.forEach(a))}function a(t){t._isAttached&&!L(t.$el)&&t._callHook("detached")}t.prototype._initEvents=function(){var t=this.$options;t._asComponent&&e(this,t.el),i(this,"$on",t.events),i(this,"$watch",t.watch)},t.prototype._initDOMHooks=function(){this.$on("hook:attached",r),this.$on("hook:detached",o)},t.prototype._callHook=function(t){this.$emit("pre-hook:"+t);var e=this.$options[t];if(e)for(var i=0,n=e.length;n>i;i++)e[i].call(this);this.$emit("hook:"+t)}}function ti(){}function ei(t,e,i,n,r,s){this.vm=e,this.el=i,this.descriptor=t,this.name=t.name,this.expression=t.expression,this.arg=t.arg,this.modifiers=t.modifiers,this.filters=t.filters,this.literal=this.modifiers&&this.modifiers.literal,this._locked=!1,this._bound=!1,this._listeners=null,this._host=n,this._scope=r,this._frag=s}function ii(t){t.prototype._updateRef=function(t){var e=this.$options._ref;if(e){var i=(this._scope||this._context).$refs;t?i[e]===this&&(i[e]=null):i[e]=this}},t.prototype._compile=function(t){var e=this.$options,i=t;if(t=Qe(t,e),this._initElement(t),1!==t.nodeType||null===W(t,"v-pre")){var n,r=this._context&&this._context.$options,s=Ee(t,e,r),o=this.constructor;e._linkerCachable&&(n=o.linker,n||(n=o.linker=xe(t,e)));var a=s(this,t,this._scope),h=n?n(this,t):xe(t,e)(this,t);return this._unlinkFn=function(){a(),h(!0)},e.replace&&q(i,t),this._isCompiled=!0,this._callHook("compiled"),t}},t.prototype._initElement=function(t){t instanceof DocumentFragment?(this._isFragment=!0,this.$el=this._fragmentStart=t.firstChild,this._fragmentEnd=t.lastChild,3===this._fragmentStart.nodeType&&(this._fragmentStart.data=this._fragmentEnd.data=""),this._fragment=t):this.$el=t,this.$el.__vue__=this,this._callHook("beforeCompile")},t.prototype._bindDir=function(t,e,i,n,r){this._directives.push(new ei(t,this,e,i,n,r))},t.prototype._destroy=function(t,e){if(this._isBeingDestroyed)return void(e||this._cleanup());var i,n,r=this,s=function(){!i||n||e||r._cleanup()};t&&this.$el&&(n=!0,this.$remove(function(){n=!1,s()})),this._callHook("beforeDestroy"),this._isBeingDestroyed=!0;var o,a=this.$parent;for(a&&!a._isBeingDestroyed&&(a.$children.$remove(this),this._updateRef(!0)),o=this.$children.length;o--;)this.$children[o].$destroy();for(this._propsUnlinkFn&&this._propsUnlinkFn(),this._unlinkFn&&this._unlinkFn(),o=this._watchers.length;o--;)this._watchers[o].teardown();this.$el&&(this.$el.__vue__=null),i=!0,s()},t.prototype._cleanup=function(){this._isDestroyed||(this._frag&&this._frag.children.$remove(this),this._data.__ob__&&this._data.__ob__.removeVm(this),this.$el=this.$parent=this.$root=this.$children=this._watchers=this._context=this._scope=this._directives=null,this._isDestroyed=!0,this._callHook("destroyed"),this.$off())}}function ni(t){t.prototype._applyFilters=function(t,e,i,n){var r,s,o,a,h,l,c,u,f;for(l=0,c=i.length;c>l;l++)if(r=i[l],s=gt(this.$options,"filters",r.name),s&&(s=n?s.write:s.read||s,"function"==typeof s)){if(o=n?[t,e]:[t],h=n?2:1,r.args)for(u=0,f=r.args.length;f>u;u++)a=r.args[u],o[u+h]=a.dynamic?this.$get(a.value):a.value;t=s.apply(this,o)}return t},t.prototype._resolveComponent=function(e,i){var n=gt(this.$options,"components",e);if(n)if(n.options)i(n);else if(n.resolved)i(n.resolved);else if(n.requested)n.pendingCallbacks.push(i);else{n.requested=!0;var r=n.pendingCallbacks=[i];n(function(e){g(e)&&(e=t.extend(e)),n.resolved=e;for(var i=0,s=r.length;s>i;i++)r[i](e)},function(t){})}}}function ri(i){function n(t){return new Function("return function "+f(t)+" (options) { this._init(options) }")()}i.util=gn,i.config=on,i.set=t,i["delete"]=e,i.nextTick=Fi,i.compiler=Cs,i.FragmentFactory=fe,i.internalDirectives=ls,i.parsers={path:Dn,text:nn,template:zr,directive:Zi,expression:Qn},i.cid=0;var r=1;i.extend=function(t){t=t||{};var e=this,i=0===e.cid;if(i&&t._Ctor)return t._Ctor;var s=t.name||e.options.name,o=n(s||"VueComponent");return o.prototype=Object.create(e.prototype),o.prototype.constructor=o,o.cid=r++,o.options=mt(e.options,t),o["super"]=e,o.extend=e.extend,on._assetTypes.forEach(function(t){o[t]=e[t]}),s&&(o.options.components[s]=o),i&&(t._Ctor=o),o},i.use=function(t){if(!t.installed){var e=d(arguments,1);return e.unshift(this),"function"==typeof t.install?t.install.apply(t,e):t.apply(null,e),t.installed=!0,this}},i.mixin=function(t){i.options=mt(i.options,t)},on._assetTypes.forEach(function(t){i[t]=function(e,n){return n?("component"===t&&g(n)&&(n.name=e,n=i.extend(n)),this.options[t+"s"][e]=n,n):this.options[t+"s"][e]}})}function si(t){function i(t){return JSON.parse(JSON.stringify(t))}t.prototype.$get=function(t,e){var i=Lt(t);if(i){if(e&&!Wt(t)){var n=this;return function(){n.$arguments=d(arguments),i.get.call(n,n),n.$arguments=null}}try{return i.get.call(this,this)}catch(r){}}},t.prototype.$set=function(t,e){var i=Lt(t,!0);i&&i.set&&i.set.call(this,this,e)},t.prototype.$delete=function(t){e(this._data,t)},t.prototype.$watch=function(t,e,i){ +var n,r=this;"string"==typeof t&&(n=A(t),t=n.expression);var s=new It(r,t,e,{deep:i&&i.deep,sync:i&&i.sync,filters:n&&n.filters,user:!i||i.user!==!1});return i&&i.immediate&&e.call(r,s.value),function(){s.teardown()}},t.prototype.$eval=function(t,e){if($s.test(t)){var i=A(t),n=this.$get(i.expression,e);return i.filters?this._applyFilters(n,null,i.filters):n}return this.$get(t,e)},t.prototype.$interpolate=function(t){var e=T(t),i=this;return e?1===e.length?i.$eval(e[0].value)+"":e.map(function(t){return t.tag?i.$eval(t.value):t.value}).join(""):t},t.prototype.$log=function(t){var e=t?jt(this._data,t):this._data;if(e&&(e=i(e)),!t)for(var n in this.$options.computed)e[n]=i(this[n]);console.log(e)}}function oi(t){function e(t,e,n,r,s,o){e=i(e);var a=!L(e),h=r===!1||a?s:o,l=!a&&!t._isAttached&&!L(t.$el);return t._isFragment?(rt(t._fragmentStart,t._fragmentEnd,function(i){h(i,e,t)}),n&&n()):h(t.$el,e,t,n),l&&t._callHook("attached"),t}function i(t){return"string"==typeof t?document.querySelector(t):t}function n(t,e,i,n){e.appendChild(t),n&&n()}function r(t,e,i,n){M(t,e),n&&n()}function s(t,e,i){I(t),i&&i()}t.prototype.$nextTick=function(t){Fi(t,this)},t.prototype.$appendTo=function(t,i,r){return e(this,t,i,r,n,F)},t.prototype.$prependTo=function(t,e,n){return t=i(t),t.hasChildNodes()?this.$before(t.firstChild,e,n):this.$appendTo(t,e,n),this},t.prototype.$before=function(t,i,n){return e(this,t,i,n,r,D)},t.prototype.$after=function(t,e,n){return t=i(t),t.nextSibling?this.$before(t.nextSibling,e,n):this.$appendTo(t.parentNode,e,n),this},t.prototype.$remove=function(t,e){if(!this.$el.parentNode)return t&&t();var i=this._isAttached&&L(this.$el);i||(e=!1);var n=this,r=function(){i&&n._callHook("detached"),t&&t()};if(this._isFragment)st(this._fragmentStart,this._fragmentEnd,this,this._fragment,r);else{var o=e===!1?s:P;o(this.$el,this,r)}return this}}function ai(t){function e(t,e,n){var r=t.$parent;if(r&&n&&!i.test(e))for(;r;)r._eventsCount[e]=(r._eventsCount[e]||0)+n,r=r.$parent}t.prototype.$on=function(t,i){return(this._events[t]||(this._events[t]=[])).push(i),e(this,t,1),this},t.prototype.$once=function(t,e){function i(){n.$off(t,i),e.apply(this,arguments)}var n=this;return i.fn=e,this.$on(t,i),this},t.prototype.$off=function(t,i){var n;if(!arguments.length){if(this.$parent)for(t in this._events)n=this._events[t],n&&e(this,t,-n.length);return this._events={},this}if(n=this._events[t],!n)return this;if(1===arguments.length)return e(this,t,-n.length),this._events[t]=null,this;for(var r,s=n.length;s--;)if(r=n[s],r===i||r.fn===i){e(this,t,-1),n.splice(s,1);break}return this},t.prototype.$emit=function(t){var e=this._events[t],i=!e;if(e){e=e.length>1?d(e):e;for(var n=d(arguments,1),r=0,s=e.length;s>r;r++){var o=e[r].apply(this,n);o===!0&&(i=!0)}}return i},t.prototype.$broadcast=function(t){if(this._eventsCount[t]){for(var e=this.$children,i=0,n=e.length;n>i;i++){var r=e[i],s=r.$emit.apply(r,arguments);s&&r.$broadcast.apply(r,arguments)}return this}},t.prototype.$dispatch=function(){this.$emit.apply(this,arguments);for(var t=this.$parent;t;){var e=t.$emit.apply(t,arguments);t=e?t.$parent:null}return this};var i=/^hook:/}function hi(t){function e(){this._isAttached=!0,this._isReady=!0,this._callHook("ready")}t.prototype.$mount=function(t){return this._isCompiled?void 0:(t=H(t),t||(t=document.createElement("div")),this._compile(t),this._initDOMHooks(),L(this.$el)?(this._callHook("attached"),e.call(this)):this.$once("hook:attached",e),this)},t.prototype.$destroy=function(t,e){this._destroy(t,e)},t.prototype.$compile=function(t,e,i,n){return xe(t,this.$options,!0)(this,t,e,i,n)}}function li(t){this._init(t)}function ci(t,e,i){return i=i?parseInt(i,10):0,"number"==typeof e?t.slice(i,i+e):t}function ui(t,e,i){if(t=ks(t),null==e)return t;if("function"==typeof e)return t.filter(e);e=(""+e).toLowerCase();for(var n,r,s,o,a="in"===i?3:2,h=d(arguments,a).reduce(function(t,e){return t.concat(e)},[]),l=[],c=0,u=t.length;u>c;c++)if(n=t[c],s=n&&n.$value||n,o=h.length){for(;o--;)if(r=h[o],"$key"===r&&pi(n.$key,e)||pi(jt(s,r),e)){l.push(n);break}}else pi(n,e)&&l.push(n);return l}function fi(t,e,i){if(t=ks(t),!e)return t;var n=i&&0>i?-1:1;return t.slice().sort(function(t,i){return"$key"!==e&&(m(t)&&"$value"in t&&(t=t.$value),m(i)&&"$value"in i&&(i=i.$value)),t=m(t)?jt(t,e):t,i=m(i)?jt(i,e):i,t===i?0:t>i?n:-n})}function pi(t,e){var i;if(g(t)){var n=Object.keys(t);for(i=n.length;i--;)if(pi(t[n[i]],e))return!0}else if(wi(t)){for(i=t.length;i--;)if(pi(t[i],e))return!0}else if(null!=t)return t.toString().toLowerCase().indexOf(e)>-1}function di(t,e,i){function n(t){!et(t)||t.hasAttribute("v-if")||t.hasAttribute("v-for")||(t=ne(t)),t=ie(t),r.appendChild(t)}for(var r=document.createDocumentFragment(),s=0,o=t.length;o>s;s++){var a=t[s];i&&!a.__v_selected?n(a):i||a.parentNode!==e||(a.__v_selected=!0,n(a))}return r}var vi=Object.prototype.hasOwnProperty,mi=/^\s?(true|false|[\d\.]+|'[^']*'|"[^"]*")\s?$/,gi=/-(\w)/g,_i=/([a-z\d])([A-Z])/g,bi=/(?:^|[-_\/])(\w)/g,yi=Object.prototype.toString,Ci="[object Object]",wi=Array.isArray,$i="__proto__"in{},ki="undefined"!=typeof window&&"[object Object]"!==Object.prototype.toString.call(window),xi=ki&&navigator.userAgent.toLowerCase().indexOf("msie 9.0")>0,Ai=ki&&navigator.userAgent.toLowerCase().indexOf("android")>0,Oi=void 0,Ni=void 0,Ti=void 0,ji=void 0;if(ki&&!xi){var Ei=void 0===window.ontransitionend&&void 0!==window.onwebkittransitionend,Si=void 0===window.onanimationend&&void 0!==window.onwebkitanimationend;Oi=Ei?"WebkitTransition":"transition",Ni=Ei?"webkitTransitionEnd":"transitionend",Ti=Si?"WebkitAnimation":"animation",ji=Si?"webkitAnimationEnd":"animationend"}var Fi=function(){function t(){n=!1;var t=i.slice(0);i=[];for(var e=0;e=this.length&&(this.length=Number(t)+1),this.splice(t,1,e)[0]}),_(pn,"$remove",function(t){if(this.length){var e=y(this,t);return e>-1?this.splice(e,1):void 0}});var vn=0;bt.target=null,bt.prototype.addSub=function(t){this.subs.push(t)},bt.prototype.removeSub=function(t){this.subs.$remove(t)},bt.prototype.depend=function(){bt.target.addDep(this)},bt.prototype.notify=function(){for(var t=d(this.subs),e=0,i=t.length;i>e;e++)t[e].update()};var mn=Object.getOwnPropertyNames(dn);yt.prototype.walk=function(t){for(var e=Object.keys(t),i=0,n=e.length;n>i;i++)this.convert(e[i],t[e[i]])},yt.prototype.observeArray=function(t){for(var e=0,i=t.length;i>e;e++)$t(t[e])},yt.prototype.convert=function(t,e){kt(this.value,t,e)},yt.prototype.addVm=function(t){(this.vms||(this.vms=[])).push(t)},yt.prototype.removeVm=function(t){this.vms.$remove(t)};var gn=Object.freeze({defineReactive:kt,set:t,del:e,hasOwn:i,isLiteral:n,isReserved:r,_toString:s,toNumber:o,toBoolean:a,stripQuotes:h,camelize:l,hyphenate:u,classify:f,bind:p,toArray:d,extend:v,isObject:m,isPlainObject:g,def:_,debounce:b,indexOf:y,cancellable:C,looseEqual:w,isArray:wi,hasProto:$i,inBrowser:ki,isIE9:xi,isAndroid:Ai,get transitionProp(){return Oi},get transitionEndEvent(){return Ni},get animationProp(){return Ti},get animationEndEvent(){return ji},nextTick:Fi,query:H,inDoc:L,getAttr:W,getBindAttr:B,hasBindAttr:V,before:M,after:z,remove:I,prepend:U,replace:q,on:J,off:Q,setClass:G,addClass:Z,removeClass:K,extractContent:X,trimNode:Y,isTemplate:et,createAnchor:it,findRef:nt,mapNodeRange:rt,removeNodeRange:st,mergeOptions:mt,resolveAsset:gt,assertAsset:_t,checkComponentAttr:ot,initProp:ht,assertProp:lt,coerceProp:ct,commonTagRE:ln,reservedTagRE:cn,warn:an}),_n=0,bn=new $(1e3),yn=0,Cn=1,wn=2,$n=3,kn=0,xn=1,An=2,On=3,Nn=4,Tn=5,jn=6,En=7,Sn=8,Fn=[];Fn[kn]={ws:[kn],ident:[On,yn],"[":[Nn],eof:[En]},Fn[xn]={ws:[xn],".":[An],"[":[Nn],eof:[En]},Fn[An]={ws:[An],ident:[On,yn]},Fn[On]={ident:[On,yn],0:[On,yn],number:[On,yn],ws:[xn,Cn],".":[An,Cn],"[":[Nn,Cn],eof:[En,Cn]},Fn[Nn]={"'":[Tn,yn],'"':[jn,yn],"[":[Nn,wn],"]":[xn,$n],eof:Sn,"else":[Nn,yn]},Fn[Tn]={"'":[Nn,yn],eof:Sn,"else":[Tn,yn]},Fn[jn]={'"':[Nn,yn],eof:Sn,"else":[jn,yn]};var Dn=Object.freeze({parsePath:Tt,getPath:jt,setPath:Et}),Pn=new $(1e3),Rn="Math,Date,this,true,false,null,undefined,Infinity,NaN,isNaN,isFinite,decodeURI,decodeURIComponent,encodeURI,encodeURIComponent,parseInt,parseFloat",Hn=new RegExp("^("+Rn.replace(/,/g,"\\b|")+"\\b)"),Ln="break,case,class,catch,const,continue,debugger,default,delete,do,else,export,extends,finally,for,function,if,import,in,instanceof,let,return,super,switch,throw,try,var,while,with,yield,enum,await,implements,package,proctected,static,interface,private,public",Wn=new RegExp("^("+Ln.replace(/,/g,"\\b|")+"\\b)"),Bn=/\s/g,Vn=/\n/g,Mn=/[\{,]\s*[\w\$_]+\s*:|('(?:[^'\\]|\\.)*'|"(?:[^"\\]|\\.)*")|new |typeof |void /g,zn=/"(\d+)"/g,In=/^[A-Za-z_$][\w$]*(?:\.[A-Za-z_$][\w$]*|\['.*?'\]|\[".*?"\]|\[\d+\]|\[[A-Za-z_$][\w$]*\])*$/,Un=/[^\w$\.](?:[A-Za-z_$][\w$]*)/g,qn=/^(?:true|false)$/,Jn=[],Qn=Object.freeze({parseExpression:Lt,isSimplePath:Wt}),Gn=[],Zn=[],Kn={},Xn={},Yn=!1,tr=!1,er=0;It.prototype.addDep=function(t){var e=t.id;this.newDeps[e]||(this.newDeps[e]=t,this.deps[e]||(this.deps[e]=t,t.addSub(this)))},It.prototype.get=function(){this.beforeGet();var t,e=this.scope||this.vm;try{t=this.getter.call(e,e)}catch(i){}return this.deep&&Ut(t),this.preProcess&&(t=this.preProcess(t)),this.filters&&(t=e._applyFilters(t,null,this.filters,!1)),this.postProcess&&(t=this.postProcess(t)),this.afterGet(),t},It.prototype.set=function(t){var e=this.scope||this.vm;this.filters&&(t=e._applyFilters(t,this.value,this.filters,!0));try{this.setter.call(e,e,t)}catch(i){}var n=e.$forContext;if(n&&n.alias===this.expression){if(n.filters)return;n._withLock(function(){e.$key?n.rawValue[e.$key]=t:n.rawValue.$set(e.$index,t)})}},It.prototype.beforeGet=function(){bt.target=this,this.newDeps=Object.create(null)},It.prototype.afterGet=function(){bt.target=null;for(var t=Object.keys(this.deps),e=t.length;e--;){var i=t[e];this.newDeps[i]||this.deps[i].removeSub(this)}this.deps=this.newDeps},It.prototype.update=function(t){this.lazy?this.dirty=!0:this.sync||!on.async?this.run():(this.shallow=this.queued?t?this.shallow:!1:!!t,this.queued=!0,zt(this))},It.prototype.run=function(){if(this.active){var t=this.get();if(t!==this.value||(m(t)||this.deep)&&!this.shallow){var e=this.value;this.value=t;this.prevError;this.cb.call(this.vm,t,e)}this.queued=this.shallow=!1}},It.prototype.evaluate=function(){var t=bt.target;this.value=this.get(),this.dirty=!1,bt.target=t},It.prototype.depend=function(){for(var t=Object.keys(this.deps),e=t.length;e--;)this.deps[t[e]].depend()},It.prototype.teardown=function(){if(this.active){this.vm._isBeingDestroyed||this.vm._watchers.$remove(this);for(var t=Object.keys(this.deps),e=t.length;e--;)this.deps[t[e]].removeSub(this);this.active=!1,this.vm=this.cb=this.value=null}};var ir={bind:function(){var t=this.el;this.vm.$once("pre-hook:compiled",function(){t.removeAttribute("v-cloak")})}},nr={bind:function(){}},rr=700,sr=800,or=850,ar=1100,hr=1500,lr=1500,cr=1750,ur=1750,fr=2e3,pr=2e3,dr={priority:hr,bind:function(){if(this.arg){var t=this.id=l(this.arg),e=(this._scope||this.vm).$els;i(e,t)?e[t]=this.el:kt(e,t,this.el)}},unbind:function(){var t=(this._scope||this.vm).$els;t[this.id]===this.el&&(t[this.id]=null)}},vr=["-webkit-","-moz-","-ms-"],mr=["Webkit","Moz","ms"],gr=/!important;?$/,_r=Object.create(null),br=null,yr={deep:!0,update:function(t){"string"==typeof t?this.el.style.cssText=t:wi(t)?this.handleObject(t.reduce(v,{})):this.handleObject(t||{})},handleObject:function(t){var e,i,n=this.cache||(this.cache={});for(e in n)e in t||(this.handleSingle(e,null),delete n[e]);for(e in t)i=t[e],i!==n[e]&&(n[e]=i,this.handleSingle(e,i))},handleSingle:function(t,e){if(t=qt(t))if(null!=e&&(e+=""),e){var i=gr.test(e)?"important":"";i&&(e=e.replace(gr,"").trim()),this.el.style.setProperty(t,e,i)}else this.el.style.removeProperty(t)}},Cr="http://www.w3.org/1999/xlink",wr=/^xlink:/,$r=/^v-|^:|^@|^(is|transition|transition-mode|debounce|track-by|stagger|enter-stagger|leave-stagger)$/,kr=/^(value|checked|selected|muted)$/,xr={value:"_value","true-value":"_trueValue","false-value":"_falseValue"},Ar={priority:or,bind:function(){var t=this.arg,e=this.el.tagName;t||(this.deep=!0),this.descriptor.interp&&($r.test(t)||"name"===t&&("PARTIAL"===e||"SLOT"===e))&&(this.el.removeAttribute(t),this.invalid=!0)},update:function(t){if(!this.invalid){var e=this.arg;this.arg?this.handleSingle(e,t):this.handleObject(t||{})}},handleObject:yr.handleObject,handleSingle:function(t,e){var i=this.el,n=this.descriptor.interp;!n&&kr.test(t)&&t in i&&(i[t]="value"===t&&null==e?"":e);var r=xr[t];if(!n&&r){i[r]=e;var s=i.__v_model;s&&s.listener()}return"value"===t&&"TEXTAREA"===i.tagName?void i.removeAttribute(t):void(null!=e&&e!==!1?"class"===t?(i.__v_trans&&(e+=" "+i.__v_trans.id+"-transition"),G(i,e)):wr.test(t)?i.setAttributeNS(Cr,t,e):i.setAttribute(t,e):i.removeAttribute(t))}},Or={esc:27,tab:9,enter:13,space:32,"delete":46,up:38,left:37,right:39,down:40},Nr={acceptStatement:!0,priority:rr,bind:function(){if("IFRAME"===this.el.tagName&&"load"!==this.arg){var t=this;this.iframeBind=function(){J(t.el.contentWindow,t.arg,t.handler)},this.on("load",this.iframeBind)}},update:function(t){if(this.descriptor.raw||(t=function(){}),"function"==typeof t){this.modifiers.stop&&(t=Gt(t)),this.modifiers.prevent&&(t=Zt(t));var e=Object.keys(this.modifiers).filter(function(t){return"stop"!==t&&"prevent"!==t});e.length&&(t=Qt(t,e)),this.reset(),this.handler=t,this.iframeBind?this.iframeBind():J(this.el,this.arg,this.handler)}},reset:function(){var t=this.iframeBind?this.el.contentWindow:this.el;this.handler&&Q(t,this.arg,this.handler)},unbind:function(){this.reset()}},Tr={bind:function(){function t(){var t=i.checked;return t&&i.hasOwnProperty("_trueValue")?i._trueValue:!t&&i.hasOwnProperty("_falseValue")?i._falseValue:t}var e=this,i=this.el;this.getValue=function(){return i.hasOwnProperty("_value")?i._value:e.params.number?o(i.value):i.value},this.listener=function(){var n=e._watcher.value;if(wi(n)){var r=e.getValue();i.checked?y(n,r)<0&&n.push(r):n.$remove(r)}else e.set(t())},this.on("change",this.listener),i.hasAttribute("checked")&&(this.afterBind=this.listener)},update:function(t){var e=this.el;wi(t)?e.checked=y(t,this.getValue())>-1:e.hasOwnProperty("_trueValue")?e.checked=w(t,e._trueValue):e.checked=!!t}},jr={bind:function(){var t=this,e=this.el;this.forceUpdate=function(){t._watcher&&t.update(t._watcher.get())};var i=this.multiple=e.hasAttribute("multiple");this.listener=function(){var n=Kt(e,i);n=t.params.number?wi(n)?n.map(o):o(n):n,t.set(n)},this.on("change",this.listener);var n=Kt(e,i,!0);(i&&n.length||!i&&null!==n)&&(this.afterBind=this.listener),this.vm.$on("hook:attached",this.forceUpdate)},update:function(t){var e=this.el;e.selectedIndex=-1;for(var i,n,r=this.multiple&&wi(t),s=e.options,o=s.length;o--;)i=s[o],n=i.hasOwnProperty("_value")?i._value:i.value,i.selected=r?Xt(t,n)>-1:w(t,n)},unbind:function(){this.vm.$off("hook:attached",this.forceUpdate)}},Er={bind:function(){var t=this,e=this.el;this.getValue=function(){if(e.hasOwnProperty("_value"))return e._value;var i=e.value;return t.params.number&&(i=o(i)),i},this.listener=function(){t.set(t.getValue())},this.on("change",this.listener),e.hasAttribute("checked")&&(this.afterBind=this.listener)},update:function(t){this.el.checked=w(t,this.getValue())}},Sr={bind:function(){var t=this,e=this.el,i="range"===e.type,n=this.params.lazy,r=this.params.number,s=this.params.debounce,a=!1;Ai||i||(this.on("compositionstart",function(){a=!0}),this.on("compositionend",function(){a=!1,n||t.listener()})),this.focused=!1,i||(this.on("focus",function(){t.focused=!0}),this.on("blur",function(){t.focused=!1,(!t._frag||t._frag.inserted)&&t.rawListener()})),this.listener=this.rawListener=function(){if(!a&&t._bound){var n=r||i?o(e.value):e.value;t.set(n),Fi(function(){t._bound&&!t.focused&&t.update(t._watcher.value)})}},s&&(this.listener=b(this.listener,s)),this.hasjQuery="function"==typeof jQuery,this.hasjQuery?(jQuery(e).on("change",this.listener),n||jQuery(e).on("input",this.listener)):(this.on("change",this.listener),n||this.on("input",this.listener)),!n&&xi&&(this.on("cut",function(){Fi(t.listener)}),this.on("keyup",function(e){(46===e.keyCode||8===e.keyCode)&&t.listener()})),(e.hasAttribute("value")||"TEXTAREA"===e.tagName&&e.value.trim())&&(this.afterBind=this.listener)},update:function(t){this.el.value=s(t)},unbind:function(){var t=this.el;this.hasjQuery&&(jQuery(t).off("change",this.listener),jQuery(t).off("input",this.listener))}},Fr={text:Sr,radio:Er,select:jr,checkbox:Tr},Dr={priority:sr,twoWay:!0,handlers:Fr,params:["lazy","number","debounce"],bind:function(){this.checkFilters(),this.hasRead&&!this.hasWrite;var t,e=this.el,i=e.tagName;if("INPUT"===i)t=Fr[e.type]||Fr.text;else if("SELECT"===i)t=Fr.select;else{if("TEXTAREA"!==i)return;t=Fr.text}e.__v_model=this,t.bind.call(this),this.update=t.update,this._unbind=t.unbind},checkFilters:function(){var t=this.filters;if(t)for(var e=t.length;e--;){var i=gt(this.vm.$options,"filters",t[e].name);("function"==typeof i||i.read)&&(this.hasRead=!0),i.write&&(this.hasWrite=!0)}},unbind:function(){this.el.__v_model=null,this._unbind&&this._unbind()}},Pr={bind:function(){var t=this.el.nextElementSibling;t&&null!==W(t,"v-else")&&(this.elseEl=t)},update:function(t){this.apply(this.el,t),this.elseEl&&this.apply(this.elseEl,!t)},apply:function(t,e){function i(){t.style.display=e?"":"none"}L(t)?R(t,e?1:-1,i,this.vm):i()}},Rr=new $(1e3),Hr=new $(1e3),Lr={efault:[0,"",""],legend:[1,"
","
"],tr:[2,"","
"],col:[2,"","
"]};Lr.td=Lr.th=[3,"","
"],Lr.option=Lr.optgroup=[1,'"],Lr.thead=Lr.tbody=Lr.colgroup=Lr.caption=Lr.tfoot=[1,"","
"],Lr.g=Lr.defs=Lr.symbol=Lr.use=Lr.image=Lr.text=Lr.circle=Lr.ellipse=Lr.line=Lr.path=Lr.polygon=Lr.polyline=Lr.rect=[1,'',""];var Wr=/<([\w:]+)/,Br=/&#?\w+?;/,Vr=function(){if(ki){var t=document.createElement("div");return t.innerHTML="",!t.cloneNode(!0).firstChild.innerHTML}return!1}(),Mr=function(){if(ki){var t=document.createElement("textarea");return t.placeholder="t","t"===t.cloneNode(!0).value}return!1}(),zr=Object.freeze({cloneNode:ie,parseTemplate:ne});re.prototype.callHook=function(t){var e,i;for(e=0,i=this.children.length;i>e;e++)t(this.children[e]);for(e=0,i=this.childFrags.length;i>e;e++)this.childFrags[e].callHook(t)},re.prototype.destroy=function(){this.parentFrag&&this.parentFrag.childFrags.$remove(this),this.unlink()};var Ir=new $(5e3);fe.prototype.create=function(t,e,i){var n=ie(this.template);return new re(this.linker,this.vm,n,t,e,i)};var Ur={priority:pr,bind:function(){var t=this.el;if(t.__vue__)this.invalid=!0;else{var e=t.nextElementSibling;e&&null!==W(e,"v-else")&&(I(e),this.elseFactory=new fe(this.vm,e)),this.anchor=it("v-if"),q(t,this.anchor),this.factory=new fe(this.vm,t)}},update:function(t){this.invalid||(t?this.frag||this.insert():this.remove())},insert:function(){this.elseFrag&&(this.elseFrag.remove(),this.elseFrag=null),this.frag=this.factory.create(this._host,this._scope,this._frag),this.frag.before(this.anchor)},remove:function(){this.frag&&(this.frag.remove(),this.frag=null),this.elseFactory&&!this.elseFrag&&(this.elseFrag=this.elseFactory.create(this._host,this._scope,this._frag),this.elseFrag.before(this.anchor))},unbind:function(){this.frag&&this.frag.destroy()}},qr=0,Jr={priority:fr,params:["track-by","stagger","enter-stagger","leave-stagger"],bind:function(){var t=this.expression.match(/(.*) in (.*)/);if(t){var e=t[1].match(/\((.*),(.*)\)/);e?(this.iterator=e[1].trim(),this.alias=e[2].trim()):this.alias=t[1].trim(),this.expression=t[2]}if(this.alias){this.id="__v-for__"+ ++qr;var i=this.el.tagName;this.isOption=("OPTION"===i||"OPTGROUP"===i)&&"SELECT"===this.el.parentNode.tagName,this.start=it("v-for-start"),this.end=it("v-for-end"),q(this.el,this.end),M(this.start,this.end),this.cache=Object.create(null),this.factory=new fe(this.vm,this.el)}},update:function(t){this.diff(t),this.updateRef(),this.updateModel()},diff:function(t){var e,n,r,s,o,a,h=t[0],l=this.fromObject=m(h)&&i(h,"$key")&&i(h,"$value"),c=this.params.trackBy,u=this.frags,f=this.frags=new Array(t.length),p=this.alias,d=this.iterator,v=this.start,g=this.end,_=L(v),b=!u;for(e=0,n=t.length;n>e;e++)h=t[e],s=l?h.$key:null,o=l?h.$value:h,a=!m(o),r=!b&&this.getCachedFrag(o,e,s),r?(r.reused=!0,r.scope.$index=e,s&&(r.scope.$key=s),d&&(r.scope[d]=null!==s?s:e),(c||l||a)&&(r.scope[p]=o)):(r=this.create(o,p,e,s),r.fresh=!b),f[e]=r,b&&r.before(g);if(!b){var y=0,C=u.length-f.length;for(e=0,n=u.length;n>e;e++)r=u[e],r.reused||(this.deleteCachedFrag(r),this.remove(r,y++,C,_));var w,$,k,x=0;for(e=0,n=f.length;n>e;e++)r=f[e],w=f[e-1],$=w?w.staggerCb?w.staggerAnchor:w.end||w.node:v,r.reused&&!r.staggerCb?(k=pe(r,v,this.id),k===w||k&&pe(k,v,this.id)===w||this.move(r,$)):this.insert(r,x++,$,_),r.reused=r.fresh=!1}},create:function(t,e,i,n){var r=this._host,s=this._scope||this.vm,o=Object.create(s);o.$refs=Object.create(s.$refs),o.$els=Object.create(s.$els),o.$parent=s,o.$forContext=this,kt(o,e,t),kt(o,"$index",i),n?kt(o,"$key",n):o.$key&&_(o,"$key",null),this.iterator&&kt(o,this.iterator,null!==n?n:i);var a=this.factory.create(r,o,this._frag);return a.forId=this.id,this.cacheFrag(t,a,i,n),a},updateRef:function(){var t=this.descriptor.ref;if(t){var e,i=(this._scope||this.vm).$refs;this.fromObject?(e={},this.frags.forEach(function(t){e[t.scope.$key]=de(t)})):e=this.frags.map(de),i[t]=e}},updateModel:function(){if(this.isOption){var t=this.start.parentNode,e=t&&t.__v_model;e&&e.forceUpdate()}},insert:function(t,e,i,n){t.staggerCb&&(t.staggerCb.cancel(),t.staggerCb=null);var r=this.getStagger(t,e,null,"enter");if(n&&r){var s=t.staggerAnchor;s||(s=t.staggerAnchor=it("stagger-anchor"),s.__vfrag__=t),z(s,i);var o=t.staggerCb=C(function(){t.staggerCb=null,t.before(s),I(s)});setTimeout(o,r)}else t.before(i.nextSibling)},remove:function(t,e,i,n){if(t.staggerCb)return t.staggerCb.cancel(),void(t.staggerCb=null);var r=this.getStagger(t,e,i,"leave");if(n&&r){var s=t.staggerCb=C(function(){t.staggerCb=null,t.remove()});setTimeout(s,r)}else t.remove()},move:function(t,e){t.before(e.nextSibling,!1)},cacheFrag:function(t,e,n,r){var s,o=this.params.trackBy,a=this.cache,h=!m(t);r||o||h?(s=o?"$index"===o?n:t[o]:r||t,a[s]||(a[s]=e)):(s=this.id,i(t,s)?null===t[s]&&(t[s]=e):_(t,s,e)),e.raw=t},getCachedFrag:function(t,e,i){var n,r=this.params.trackBy,s=!m(t);if(i||r||s){var o=r?"$index"===r?e:t[r]:i||t;n=this.cache[o]}else n=t[this.id];return n&&(n.reused||n.fresh),n},deleteCachedFrag:function(t){var e=t.raw,n=this.params.trackBy,r=t.scope,s=r.$index,o=i(r,"$key")&&r.$key,a=!m(e);if(n||o||a){var h=n?"$index"===n?s:e[n]:o||e;this.cache[h]=null}else e[this.id]=null,t.raw=null},getStagger:function(t,e,i,n){n+="Stagger";var r=t.node.__v_trans,s=r&&r.hooks,o=s&&(s[n]||s.stagger);return o?o.call(t,e,i):e*parseInt(this.params[n]||this.params.stagger,10)},_preProcess:function(t){return this.rawValue=t,t},_postProcess:function(t){if(wi(t))return t;if(g(t)){for(var e,i=Object.keys(t),n=i.length,r=new Array(n);n--;)e=i[n],r[n]={$key:e,$value:t[e]};return r}return"number"==typeof t&&(t=ve(t)),t||[]},unbind:function(){if(this.descriptor.ref&&((this._scope||this.vm).$refs[this.descriptor.ref]=null),this.frags)for(var t,e=this.frags.length;e--;)t=this.frags[e],this.deleteCachedFrag(t),t.destroy()}},Qr={bind:function(){8===this.el.nodeType&&(this.nodes=[],this.anchor=it("v-html"),q(this.el,this.anchor))},update:function(t){t=s(t),this.nodes?this.swap(t):this.el.innerHTML=t},swap:function(t){for(var e=this.nodes.length;e--;)I(this.nodes[e]);var i=ne(t,!0,!0);this.nodes=d(i.childNodes),M(i,this.anchor)}},Gr={bind:function(){this.attr=3===this.el.nodeType?"data":"textContent"},update:function(t){this.el[this.attr]=s(t)}},Zr={text:Gr,html:Qr,"for":Jr,"if":Ur,show:Pr,model:Dr,on:Nr,bind:Ar,el:dr,ref:nr,cloak:ir},Kr=[],Xr=!1,Yr=1,ts=2,es=Oi+"Duration",is=Ti+"Duration",ns=_e.prototype;ns.enter=function(t,e){this.cancelPending(),this.callHook("beforeEnter"),this.cb=e,Z(this.el,this.enterClass),t(),this.entered=!1,this.callHookWithCb("enter"),this.entered||(this.cancel=this.hooks&&this.hooks.enterCancelled,me(this.enterNextTick))},ns.enterNextTick=function(){this.justEntered=!0;var t=this;setTimeout(function(){t.justEntered=!1},17);var e=this.enterDone,i=this.getCssTransitionType(this.enterClass);this.pendingJsCb?i===Yr&&K(this.el,this.enterClass):i===Yr?(K(this.el,this.enterClass),this.setupCssCb(Ni,e)):i===ts?this.setupCssCb(ji,e):e()},ns.enterDone=function(){this.entered=!0,this.cancel=this.pendingJsCb=null,K(this.el,this.enterClass),this.callHook("afterEnter"),this.cb&&this.cb()},ns.leave=function(t,e){this.cancelPending(),this.callHook("beforeLeave"),this.op=t,this.cb=e,Z(this.el,this.leaveClass),this.left=!1,this.callHookWithCb("leave"),this.left||(this.cancel=this.hooks&&this.hooks.leaveCancelled,this.op&&!this.pendingJsCb&&(this.justEntered?this.leaveDone():me(this.leaveNextTick)))},ns.leaveNextTick=function(){var t=this.getCssTransitionType(this.leaveClass);if(t){var e=t===Yr?Ni:ji;this.setupCssCb(e,this.leaveDone)}else this.leaveDone()},ns.leaveDone=function(){this.left=!0,this.cancel=this.pendingJsCb=null,this.op(),K(this.el,this.leaveClass),this.callHook("afterLeave"),this.cb&&this.cb(),this.op=null},ns.cancelPending=function(){this.op=this.cb=null;var t=!1;this.pendingCssCb&&(t=!0,Q(this.el,this.pendingCssEvent,this.pendingCssCb),this.pendingCssEvent=this.pendingCssCb=null),this.pendingJsCb&&(t=!0,this.pendingJsCb.cancel(),this.pendingJsCb=null),t&&(K(this.el,this.enterClass),K(this.el,this.leaveClass)),this.cancel&&(this.cancel.call(this.vm,this.el),this.cancel=null)},ns.callHook=function(t){this.hooks&&this.hooks[t]&&this.hooks[t].call(this.vm,this.el)},ns.callHookWithCb=function(t){var e=this.hooks&&this.hooks[t];e&&(e.length>1&&(this.pendingJsCb=C(this[t+"Done"])),e.call(this.vm,this.el,this.pendingJsCb))},ns.getCssTransitionType=function(t){if(!(!Ni||document.hidden||this.hooks&&this.hooks.css===!1||be(this.el))){var e=this.typeCache[t];if(e)return e;var i=this.el.style,n=window.getComputedStyle(this.el),r=i[es]||n[es];if(r&&"0s"!==r)e=Yr;else{var s=i[is]||n[is];s&&"0s"!==s&&(e=ts)}return e&&(this.typeCache[t]=e),e}},ns.setupCssCb=function(t,e){this.pendingCssEvent=t;var i=this,n=this.el,r=this.pendingCssCb=function(s){s.target===n&&(Q(n,t,r),i.pendingCssEvent=i.pendingCssCb=null,!i.pendingJsCb&&e&&e())};J(n,t,r)};var rs={priority:ar,update:function(t,e){var i=this.el,n=gt(this.vm.$options,"transitions",t);t=t||"v",i.__v_trans=new _e(i,t,n,this.el.__vue__||this.vm),e&&K(i,e+"-transition"),Z(i,t+"-transition")}},ss=on._propBindingModes,os={bind:function(){var t=this.vm,e=t._context,i=this.descriptor.prop,n=i.path,r=i.parentPath,s=i.mode===ss.TWO_WAY,o=this.parentWatcher=new It(e,r,function(e){e=ct(i,e),lt(i,e)&&(t[n]=e)},{twoWay:s,filters:i.filters,scope:this._scope});if(ht(t,i,o.value),s){var a=this;t.$once("pre-hook:created",function(){a.childWatcher=new It(t,n,function(t){o.set(t)},{sync:!0})})}},unbind:function(){this.parentWatcher.teardown(),this.childWatcher&&this.childWatcher.teardown()}},as={priority:lr,params:["keep-alive","transition-mode","inline-template"],bind:function(){this.el.__vue__||(this.keepAlive=this.params.keepAlive,this.keepAlive&&(this.cache={}),this.params.inlineTemplate&&(this.inlineTemplate=X(this.el,!0)),this.pendingComponentCb=this.Component=null,this.pendingRemovals=0,this.pendingRemovalCb=null,this.anchor=it("v-component"),q(this.el,this.anchor),this.el.removeAttribute("is"),this.descriptor.ref&&this.el.removeAttribute("v-ref:"+u(this.descriptor.ref)),this.literal&&this.setComponent(this.expression))},update:function(t){this.literal||this.setComponent(t)},setComponent:function(t,e){if(this.invalidatePending(),t){var i=this;this.resolveComponent(t,function(){i.mountComponent(e)})}else this.unbuild(!0),this.remove(this.childVM,e),this.childVM=null},resolveComponent:function(t,e){var i=this;this.pendingComponentCb=C(function(n){i.ComponentName=n.options.name||t,i.Component=n,e()}),this.vm._resolveComponent(t,this.pendingComponentCb)},mountComponent:function(t){this.unbuild(!0);var e=this,i=this.Component.options.activate,n=this.getCached(),r=this.build();i&&!n?(this.waitingFor=r,i.call(r,function(){e.waitingFor===r&&(e.waitingFor=null,e.transition(r,t))})):(n&&r._updateRef(),this.transition(r,t)); +},invalidatePending:function(){this.pendingComponentCb&&(this.pendingComponentCb.cancel(),this.pendingComponentCb=null)},build:function(t){var e=this.getCached();if(e)return e;if(this.Component){var i={name:this.ComponentName,el:ie(this.el),template:this.inlineTemplate,parent:this._host||this.vm,_linkerCachable:!this.inlineTemplate,_ref:this.descriptor.ref,_asComponent:!0,_isRouterView:this._isRouterView,_context:this.vm,_scope:this._scope,_frag:this._frag};t&&v(i,t);var n=new this.Component(i);return this.keepAlive&&(this.cache[this.Component.cid]=n),n}},getCached:function(){return this.keepAlive&&this.cache[this.Component.cid]},unbuild:function(t){this.waitingFor&&(this.waitingFor.$destroy(),this.waitingFor=null);var e=this.childVM;return!e||this.keepAlive?void(e&&e._updateRef(!0)):void e.$destroy(!1,t)},remove:function(t,e){var i=this.keepAlive;if(t){this.pendingRemovals++,this.pendingRemovalCb=e;var n=this;t.$remove(function(){n.pendingRemovals--,i||t._cleanup(),!n.pendingRemovals&&n.pendingRemovalCb&&(n.pendingRemovalCb(),n.pendingRemovalCb=null)})}else e&&e()},transition:function(t,e){var i=this,n=this.childVM;switch(this.childVM=t,i.params.transitionMode){case"in-out":t.$before(i.anchor,function(){i.remove(n,e)});break;case"out-in":i.remove(n,function(){t.$before(i.anchor,e)});break;default:i.remove(n),t.$before(i.anchor,e)}},unbind:function(){if(this.invalidatePending(),this.unbuild(),this.cache){for(var t in this.cache)this.cache[t].$destroy();this.cache=null}}},hs={deep:!0,update:function(t){t&&"string"==typeof t?this.handleObject(ye(t)):g(t)?this.handleObject(t):wi(t)?this.handleArray(t):this.cleanup()},handleObject:function(t){this.cleanup(t);for(var e=this.prevKeys=Object.keys(t),i=0,n=e.length;n>i;i++){var r=e[i];t[r]?Z(this.el,r):K(this.el,r)}},handleArray:function(t){this.cleanup(t);for(var e=0,i=t.length;i>e;e++)t[e]&&Z(this.el,t[e]);this.prevKeys=t.slice()},cleanup:function(t){if(this.prevKeys)for(var e=this.prevKeys.length;e--;){var i=this.prevKeys[e];!i||t&&Ce(t,i)||K(this.el,i)}}},ls={style:yr,"class":hs,component:as,prop:os,transition:rs},cs=on._propBindingModes,us={},fs=/^[$_a-zA-Z]+[\w$]*$/,ps=/^v-bind:|^:/,ds=/^v-on:|^@/,vs=/:(.*)$/,ms=/\.[^\.]+/g,gs=/^(v-bind:|:)?transition$/,_s=["for","if"],bs=1e3;ze.terminal=!0;var ys=/[^\w\-:\.]/,Cs=Object.freeze({compile:xe,compileAndLinkProps:je,compileRoot:Ee,transclude:Qe}),ws=/^v-on:|^@/;ei.prototype._bind=function(){var t=this.name,e=this.descriptor;if(("cloak"!==t||this.vm._isCompiled)&&this.el&&this.el.removeAttribute){var i=e.attr||"v-"+t;this.el.removeAttribute(i)}var n=e.def;if("function"==typeof n?this.update=n:v(this,n),this._setupParams(),this.bind&&this.bind(),this._bound=!0,this.literal)this.update&&this.update(e.raw);else if((this.expression||this.modifiers)&&(this.update||this.twoWay)&&!this._checkStatement()){var r=this;this.update?this._update=function(t,e){r._locked||r.update(t,e)}:this._update=ti;var s=this._preProcess?p(this._preProcess,this):null,o=this._postProcess?p(this._postProcess,this):null,a=this._watcher=new It(this.vm,this.expression,this._update,{filters:this.filters,twoWay:this.twoWay,deep:this.deep,preProcess:s,postProcess:o,scope:this._scope});this.afterBind?this.afterBind():this.update&&this.update(a.value)}},ei.prototype._setupParams=function(){if(this.params){var t=this.params;this.params=Object.create(null);for(var e,i,n,r=t.length;r--;)e=t[r],n=l(e),i=B(this.el,e),null!=i?this._setupParamWatcher(n,i):(i=W(this.el,e),null!=i&&(this.params[n]=""===i?!0:i))}},ei.prototype._setupParamWatcher=function(t,e){var i=this,n=!1,r=(this._scope||this.vm).$watch(e,function(e,r){if(i.params[t]=e,n){var s=i.paramWatchers&&i.paramWatchers[t];s&&s.call(i,e,r)}else n=!0},{immediate:!0,user:!1});(this._paramUnwatchFns||(this._paramUnwatchFns=[])).push(r)},ei.prototype._checkStatement=function(){var t=this.expression;if(t&&this.acceptStatement&&!Wt(t)){var e=Lt(t).get,i=this._scope||this.vm,n=function(t){i.$event=t,e.call(i,i),i.$event=null};return this.filters&&(n=i._applyFilters(n,null,this.filters)),this.update(n),!0}},ei.prototype.set=function(t){this.twoWay&&this._withLock(function(){this._watcher.set(t)})},ei.prototype._withLock=function(t){var e=this;e._locked=!0,t.call(e),Fi(function(){e._locked=!1})},ei.prototype.on=function(t,e){J(this.el,t,e),(this._listeners||(this._listeners=[])).push([t,e])},ei.prototype._teardown=function(){if(this._bound){this._bound=!1,this.unbind&&this.unbind(),this._watcher&&this._watcher.teardown();var t,e=this._listeners;if(e)for(t=e.length;t--;)Q(this.el,e[t][0],e[t][1]);var i=this._paramUnwatchFns;if(i)for(t=i.length;t--;)i[t]();this.vm=this.el=this._watcher=this._listeners=null}};var $s=/[^|]\|[^|]/;xt(li),Xe(li),Ye(li),ii(li),ni(li),ri(li),si(li),oi(li),ai(li),hi(li);var ks=Jr._postProcess,xs=/(\d{3})(?=\d)/g,As={orderBy:fi,filterBy:ui,limitBy:ci,json:{read:function(t,e){return"string"==typeof t?t:JSON.stringify(t,null,Number(e)||2)},write:function(t){try{return JSON.parse(t)}catch(e){return t}}},capitalize:function(t){return t||0===t?(t=t.toString(),t.charAt(0).toUpperCase()+t.slice(1)):""},uppercase:function(t){return t||0===t?t.toString().toUpperCase():""},lowercase:function(t){return t||0===t?t.toString().toLowerCase():""},currency:function(t,e){if(t=parseFloat(t),!isFinite(t)||!t&&0!==t)return"";e=null!=e?e:"$";var i=Math.abs(t).toFixed(2),n=i.slice(0,-3),r=n.length%3,s=r>0?n.slice(0,r)+(n.length>3?",":""):"",o=i.slice(-3),a=0>t?"-":"";return e+a+s+n.slice(r).replace(xs,"$1,")+o},pluralize:function(t){var e=d(arguments,1);return e.length>1?e[t%10-1]||e[e.length-1]:e[0]+(1===t?"":"s")},debounce:function(t,e){return t?(e||(e=300),b(t,e)):void 0}},Os={priority:cr,params:["name"],paramWatchers:{name:function(t){Ur.remove.call(this),t&&this.insert(t)}},bind:function(){this.anchor=it("v-partial"),q(this.el,this.anchor),this.insert(this.params.name)},insert:function(t){var e=gt(this.vm.$options,"partials",t);e&&(this.factory=new fe(this.vm,e),Ur.insert.call(this))},unbind:function(){this.frag&&this.frag.destroy()}},Ns={priority:ur,bind:function(){var t=this.vm,e=t.$options._content;if(!e)return void this.fallback();var i=t._context,n=this.params&&this.params.name;if(n){var r='[slot="'+n+'"]',s=e.querySelectorAll(r);s.length?this.tryCompile(di(s,e),i,t):this.fallback()}else this.tryCompile(di(e.childNodes,e,!0),i,t)},tryCompile:function(t,e,i){t.hasChildNodes()?this.compile(t,e,i):this.fallback()},compile:function(t,e,i){if(t&&e){var n=i?i._scope:this._scope;this.unlink=e.$compile(t,i,n,this._frag)}t?q(this.el,t):I(this.el)},fallback:function(){this.compile(X(this.el,!0),this.vm)},unbind:function(){this.unlink&&this.unlink()}},Ts=v(v({},Ns),{priority:Ns.priority+1,params:["name"]}),js={slot:Ns,_namedSlot:Ts,partial:Os};return li.version="1.0.13",li.options={directives:Zr,elementDirectives:js,filters:As,transitions:{},components:{},partials:{},replace:!0},li}); \ No newline at end of file diff --git a/package.json b/package.json new file mode 100644 index 0000000..8c8ca17 --- /dev/null +++ b/package.json @@ -0,0 +1,43 @@ +{ + "name": "photo-editor", + "version": "1.0.0", + "description": "A photo editing application based on the Cropper.js", + "license": "MIT", + "repository": "fengyuanchen/photo-editor", + "author": { + "name": "Fengyuan Chen", + "url": "http://chenfengyuan.com" + }, + "keywords": [ + "photo", + "editor", + "cropper", + "cropperjs", + "cropper.js", + "html", + "css", + "javascript", + "front-end", + "web", + "development" + ], + "dependencies": { + "cropperjs": "^0.5.5", + "font-awesome": "^4.5.0", + "vue": "^1.0.13" + }, + "devDependencies": { + "babel-core": "^6.3.26", + "babel-loader": "^6.2.0", + "babel-preset-es2015": "^6.3.13", + "gulp": "^3.9.0", + "gulp-autoprefixer": "^3.1.0", + "gulp-eslint": "^1.1.1", + "gulp-jade": "^1.1.0", + "gulp-load-plugins": "^1.1.0", + "gulp-sass": "^2.1.1", + "gulp-uglify": "^1.5.1", + "gulp-util": "^3.0.7", + "webpack": "^1.12.9" + } +} diff --git a/src/button-box.jade b/src/button-box.jade new file mode 100644 index 0000000..b3227bb --- /dev/null +++ b/src/button-box.jade @@ -0,0 +1,17 @@ +script(id="button-box", type="text/x-template") + div(class="menu" @click="click") + label(class="menu__button", for="file", title="Upload", v-show="!uploaded") + span(class="fa fa-upload") + button(class="menu__button", data-action="restore", title="Undo (Ctrl + Z)", v-show="cropped") + span(class="fa fa-undo") + button(class="menu__button menu__button--danger", data-action="remove", title="Delete (Delete)", v-show="uploaded && !cropping") + span(class="fa fa-trash") + button(class="menu__button menu__button--danger", data-action="clear", title="Cancel (Esc)", v-show="cropping") + span(class="fa fa-ban") + button(class="menu__button menu__button--success", data-action="crop", title="OK (Enter)", v-show="cropping") + span(class="fa fa-check") + a(class="menu__button menu__button--success", data-action="download", href="{{ url }}", title="Download", download="{{ name }}", v-show="url") + span(class="fa fa-download") + a(class="menu__button", data-action="download", href="https://github.com/fengyuanchen/photo-editor", title="View on GitHub") + span(class="fa fa-github") + diff --git a/src/canvas-box.jade b/src/canvas-box.jade new file mode 100644 index 0000000..d576677 --- /dev/null +++ b/src/canvas-box.jade @@ -0,0 +1,23 @@ +script(id="canvas-box", type="text/x-template") + div(class="canvas", v-show="editable") + div(class="editor") + template(v-if="url") + img(src="{{ url }}", alt="{{ name }}", @load="load") + div(class="toolbar", @click="click", v-show="cropper") + button(class="toolbar__button", data-action="move", title="Move (M)") + span(class="fa fa-arrows") + button(class="toolbar__button", data-action="crop", title="Crop (C)") + span(class="fa fa-crop") + button(class="toolbar__button", data-action="zoom-in", title="Zoom In (I)") + span(class="fa fa-search-plus") + button(class="toolbar__button", data-action="zoom-out", title="Zoom Out (O)") + span(class="fa fa-search-minus") + button(class="toolbar__button", data-action="rotate-left", title="Rotate Left (L)") + span(class="fa fa-rotate-left") + button(class="toolbar__button", data-action="rotate-right", title="Rotate Right (R)") + span(class="fa fa-rotate-right") + button(class="toolbar__button", data-action="flip-horizontal", title="Flip Horizontal (H)") + span(class="fa fa-arrows-h") + button(class="toolbar__button", data-action="flip-vertical", title="Flip Vertical (V)") + span(class="fa fa-arrows-v") + diff --git a/src/css/_canvas.scss b/src/css/_canvas.scss new file mode 100644 index 0000000..af04586 --- /dev/null +++ b/src/css/_canvas.scss @@ -0,0 +1,21 @@ +// Canvas for editing image +// ================================================== + +.canvas { + width: 100%; + height: 100%; +} + +.editor { + height: 100%; + overflow: hidden; + + > img { + display: block; + max-width: 100%; + max-height: 100%; + margin: auto; + + vertical-align: middle; + } +} diff --git a/src/css/_layout.scss b/src/css/_layout.scss new file mode 100644 index 0000000..eb7ae04 --- /dev/null +++ b/src/css/_layout.scss @@ -0,0 +1,65 @@ +// Layout +// ================================================== + +body { + margin: 0; + color: #333; + font-family: "Helvetica","Arial",sans-serif; + font-size: 14px; + font-weight: 400; + line-height: 20px; +} + +.header { + position: relative; + z-index: 1; + + height: 48px; + padding-left: 16px; + padding-right: 16px; + + background-color: #666; +} + +@media (min-width: $screen-sm) { + .header { + padding-left: 24px; + padding-right: 24px; + } +} + +.title { + float: left; + display: block; + + font-size: 18px; + line-height: 48px; + + color: $color-white; +} + +.main { + position: absolute; + top: 48px; + right: 0; + bottom: 0; + left: 0; + + background-color: #333; + + > img { + display: table-cell; + max-width: 100%; + + vertical-align: middle; + } +} + +.footer { + position: absolute; + right: 0; + bottom: 0; + left: 0; + + height: 0; +} diff --git a/src/css/_menu.scss b/src/css/_menu.scss new file mode 100644 index 0000000..52db744 --- /dev/null +++ b/src/css/_menu.scss @@ -0,0 +1,44 @@ +// Menu for toggling actions +// ================================================== + +.menu { + float: right; +} + +.menu__button { + float: left; + display: block; + width: 48px; + height: 48px; + border-width: 0; + + font-size: 16px; + line-height: 48px; + text-align: center; + + background-color: transparent; + color: $color-white; + + cursor: pointer; + + &:focus { + outline: none; + } + + &:hover { + background-color: $color-brand; + color: $color-white; + } +} + +.menu__button--success { + &:hover { + background-color: $color-success; + } +} + +.menu__button--danger { + &:hover { + background-color: $color-danger; + } +} diff --git a/src/css/_mixins.scss b/src/css/_mixins.scss new file mode 100644 index 0000000..1ee4a36 --- /dev/null +++ b/src/css/_mixins.scss @@ -0,0 +1,23 @@ +// Mixins +// ================================================== + +// Opacity +// ------------------------- + +@mixin opacity($opacity) { + opacity: $opacity; + filter: alpha(opacity=#{$opacity * 100}); // IE8 +} + + +// Sizing shortcuts +// ------------------------- + +@mixin size($width, $height) { + width: $width; + height: $height; +} + +@mixin square($size) { + @include size($size, $size); +} diff --git a/src/css/_toolbar.scss b/src/css/_toolbar.scss new file mode 100644 index 0000000..9dd5b03 --- /dev/null +++ b/src/css/_toolbar.scss @@ -0,0 +1,41 @@ +// Toolbar for handling image +// ================================================== + +.toolbar { + position: absolute; + left: 50%; + bottom: 16px; + z-index: 2015; + + width: 256px; + height: 32px; + margin-left: -128px; + + background-color: rgba($color-black, .5); + color: $color-white; +} + +.toolbar__button { + float: left; + display: block; + width: 32px; + height: 32px; + border-width: 0; + + font-size: 14px; + text-align: center; + + background-color: transparent; + color: $color-white; + + cursor: pointer; + + &:focus { + outline: none; + } + + &:hover { + background-color: $color-brand; + color: $color-white; + } +} diff --git a/src/css/_upload.scss b/src/css/_upload.scss new file mode 100644 index 0000000..25cafe6 --- /dev/null +++ b/src/css/_upload.scss @@ -0,0 +1,31 @@ +// Upload for importing image +// ================================================== + +.upload { + display: table; + width: 100%; + height: 100%; + overflow: hidden; + + > p { + display: table-cell; + + color: #999; + text-align: center; + + vertical-align: middle; + } +} + +.browse { + margin-left: 4px; + + color: $color-brand; + + cursor: pointer; + + &:hover { + color: lighten($color-brand, 10%); + text-decoration: underline; + } +} diff --git a/src/css/_utilities.scss b/src/css/_utilities.scss new file mode 100644 index 0000000..0668d94 --- /dev/null +++ b/src/css/_utilities.scss @@ -0,0 +1,25 @@ +// Utilites +// ================================================== + +.sr-only { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + border: 0; +} + +.sr-only--focusable { + &:active, + &:focus { + position: static; + width: auto; + height: auto; + margin: 0; + overflow: visible; + clip: auto; + } +} diff --git a/src/css/_variables.scss b/src/css/_variables.scss new file mode 100644 index 0000000..6ad9dd2 --- /dev/null +++ b/src/css/_variables.scss @@ -0,0 +1,21 @@ +// Variables +// ================================================== + +// Colors +// ------------------------- + +$color-brand: #0074d9; +$color-black: #000; +$color-white: #fff; + +$color-success: #2ecc40; +$color-danger: #ff4136; + + +// Media queries breakpoints +// ------------------------- + +$screen-xs: 480px; // Extra small screen / phone +$screen-sm: 768px; // Small screen / tablet +$screen-md: 992px; // Medium screen / desktop +$screen-lg: 1200px; // Large screen / wide desktop diff --git a/src/css/main.scss b/src/css/main.scss new file mode 100644 index 0000000..a692e5c --- /dev/null +++ b/src/css/main.scss @@ -0,0 +1,8 @@ +@import "variables"; +@import "mixins"; +@import "utilities"; +@import "layout"; +@import "menu"; +@import "toolbar"; +@import "upload"; +@import "canvas"; diff --git a/src/index.jade b/src/index.jade new file mode 100644 index 0000000..33eed64 --- /dev/null +++ b/src/index.jade @@ -0,0 +1,27 @@ +doctype html +html(lang="en") + head + meta(charset="utf-8") + meta(http-equiv="x-ua-compatible", content="ie=edge") + meta(name="viewport", content="width=device-width, initial-scale=1") + meta(name="description", content="A photo editing application based on the Cropper.js") + meta(name="keywords", content="HTML, CSS, JS, JavaScript, photo, editor, front-end, web development") + meta(name="author", content="Fengyuan Chen") + title Photo Editor + link(href="css/font-awesome.min.css", rel="stylesheet") + link(href="css/cropper.min.css", rel="stylesheet") + link(href="css/main.css", rel="stylesheet") + body + header(class="header") + span(class="title") Photo Editor + button-box + main(class="main") + upload-box + canvas-box + include ./button-box.jade + include ./upload-box.jade + include ./canvas-box.jade + script(src="js/vue.min.js") + script(src="js/cropper.min.js") + script(src="js/main.js") + diff --git a/src/js/button-box.js b/src/js/button-box.js new file mode 100644 index 0000000..2f36c75 --- /dev/null +++ b/src/js/button-box.js @@ -0,0 +1,77 @@ +export default { + data: function () { + return { + uploaded: false, + cropping: false, + cropped: false, + download: typeof document.createElement('a').download !== 'undefined', + url: '', + name: '' + }; + }, + template: '#button-box', + methods: { + click: function (e) { + const target = e.target; + const action = target.dataset.action || target.parentNode.dataset.action; + + if (action) { + switch (action) { + case 'restore': + this.restore(); + break; + + case 'remove': + this.remove(); + break; + + case 'clear': + case 'crop': + this.cropping = false; + break; + } + + this.$dispatch('broadcast', action); + } + }, + restore: function () { + this.cropped = false; + this.url = ''; + this.name = ''; + }, + remove: function () { + this.uploaded = false; + this.cropping = false; + + if (this.cropped) { + this.restore(); + } + } + }, + events: { + uploaded: function () { + this.uploaded = true; + }, + cropping: function () { + this.cropping = true; + }, + cleared: function () { + this.cropping = false; + }, + restored: function () { + this.restore(); + }, + removed: function () { + this.remove(); + }, + cropped: function (data) { + this.cropped = true; + this.cropping = false; + + if (this.download) { + this.url = data.url; + this.name = data.name; + } + } + } +}; diff --git a/src/js/canvas-box.js b/src/js/canvas-box.js new file mode 100644 index 0000000..3f1f547 --- /dev/null +++ b/src/js/canvas-box.js @@ -0,0 +1,291 @@ +import Cropper from 'cropper'; + +export default { + data: function () { + return { + editable: false, + cropper: false, + cropping: false, + data: null, + image: null, + type: '', + name: '', + url: '', + originalUrl: '' + }; + }, + template: '#canvas-box', + ready: function () { + window.addEventListener('keydown', this.keydown, false); + }, + beforeDestory: function () { + window.removeEventListener('keydown', this.keydown, false); + }, + methods: { + load: function (e) { + if (!this.image) { + this.image = e.target; + this.start(); + } + }, + click: function (e) { + const cropper = this.cropper; + const target = e.target; + let action = ''; + + if (!cropper) { + return; + } + + action = target.dataset.action || target.parentNode.dataset.action; + + switch (action) { + case 'move': + case 'crop': + cropper.setDragMode(action); + break; + + case 'zoom-in': + cropper.zoom(0.1); + break; + + case 'zoom-out': + cropper.zoom(-0.1); + break; + + case 'rotate-left': + cropper.rotate(-90); + break; + + case 'rotate-right': + cropper.rotate(90); + break; + + case 'flip-horizontal': + cropper.scaleX(-this.cropper.getData().scaleX || -1); + break; + + case 'flip-vertical': + cropper.scaleY(-this.cropper.getData().scaleY || -1); + break; + + // No default + } + }, + keydown: function (e) { + const cropper = this.cropper; + const key = e.key || e.keyCode || e.which || e.charCode; + + switch (key) { + + // Undo crop (Key: Ctrl + Z) + case 90: + if (e.ctrlKey) { + e.preventDefault(); + this.restore(true); + } + + break; + + // Delete the image (Key: Delete) + case 46: + this.remove(true); + break; + } + + if (!cropper) { + return; + } + + switch (key) { + + // Crop the image (Key: Enter) + case 13: + this.crop(true); + break; + + // Clear crop area (Key: Esc) + case 27: + this.clear(true); + break; + + // Move to the left (Key: ←) + case 37: + e.preventDefault(); + cropper.move(-1, 0); + break; + + // Move to the top (Key: ↑) + case 38: + e.preventDefault(); + cropper.move(0, -1); + break; + + // Move to the right (Key: →) + case 39: + e.preventDefault(); + cropper.move(1, 0); + break; + + // Move to the bottom (Key: ↓) + case 40: + e.preventDefault(); + cropper.move(0, 1); + break; + + // Enter crop mode (Key: C) + case 67: + cropper.setDragMode('crop'); + break; + + // Enter move mode (Key: M) + case 77: + cropper.setDragMode('move'); + break; + + // Zoom in (Key: I) + case 73: + cropper.zoom(0.1); + break; + + // Zoom out (Key: O) + case 79: + cropper.zoom(-0.1); + break; + + // Rotate left (Key: L) + case 76: + cropper.rotate(-90); + break; + + // Rotate right (Key: R) + case 82: + cropper.rotate(90); + break; + + // Flip horizontal (Key: H) + case 72: + cropper.scaleX(-this.cropper.getData().scaleX || -1); + break; + + // Flip vertical (Key: V) + case 86: + cropper.scaleY(-this.cropper.getData().scaleY || -1); + break; + } + }, + start: function () { + const _this = this; + + if (this.cropper) { + return; + } + + this.cropper = new Cropper(this.image, { + autoCrop: false, + dragMode: 'move', + background: false, + built: function () { + if (_this.data) { + this.cropper.crop().setData(_this.data); + _this.data = null; + } + }, + crop: function (data) { + if (data.width > 0 && data.height > 0 && !_this.cropping) { + _this.cropping = true; + _this.$dispatch('broadcast', 'cropping'); + } + } + }); + }, + stop: function () { + if (this.cropper) { + this.cropper.destroy(); + this.cropper = null; + this.cropping = false; + } + }, + crop: function (dispatch) { + const cropper = this.cropper; + const type = this.type; + + if (this.cropping) { + this.originalUrl = this.url; + this.data = cropper.getData(); + this.url = cropper.getCroppedCanvas(type === 'image/png' ? null : { + fillColor: '#fff' + }).toDataURL(type); + this.stop(); + + if (dispatch) { + this.$dispatch('broadcast', 'cropped', { + url: this.url, + name: this.name + }); + } + } + }, + clear: function (dispatch) { + if (this.cropping) { + this.cropper.clear(); + this.cropping = false; + + if (dispatch) { + this.$dispatch('broadcast', 'cleared'); + } + } + }, + restore: function (dispatch) { + if (!this.cropper) { + this.image = null; + this.url = this.originalUrl; + this.originalUrl = ''; + + if (dispatch) { + this.$dispatch('broadcast', 'restored'); + } + } + }, + remove: function (dispatch) { + + // Disallow to delete image when cropping + if (this.cropping) { + return; + } + + this.stop(); + this.editable = false; + this.data = null; + this.image = null; + this.type = ''; + this.name = ''; + this.url = ''; + this.originalUrl = ''; + + if (dispatch) { + this.$dispatch('broadcast', 'removed'); + } + } + }, + events: { + uploaded: function ({url, type, name}) { + this.editable = true; + this.type = type; + this.name = name; + this.url = url; + }, + remove: function () { + this.remove(); + }, + crop: function () { + this.crop(true); + }, + clear: function () { + this.clear(); + }, + restore: function () { + this.restore(); + } + } +}; diff --git a/src/js/main.js b/src/js/main.js new file mode 100644 index 0000000..e0ca27f --- /dev/null +++ b/src/js/main.js @@ -0,0 +1,18 @@ +import Vue from 'vue'; +import ButtonBox from './button-box.js'; +import UploadBox from './upload-box.js'; +import CanvasBox from './canvas-box.js'; + +window.vm = new Vue({ + el: 'body', + components: { + ButtonBox, + UploadBox, + CanvasBox + }, + events: { + broadcast: function (type, data) { + this.$broadcast(type, data); + } + } +}); diff --git a/src/js/upload-box.js b/src/js/upload-box.js new file mode 100644 index 0000000..7e706c0 --- /dev/null +++ b/src/js/upload-box.js @@ -0,0 +1,63 @@ +export default { + data: function () { + return { + uploaded: false + }; + }, + template: '#upload-box', + methods: { + read: function (file, callback = () => {}) { + let reader = null; + + if (file) { + if (/^image\/\w+$/.test(file.type)) { + reader = new FileReader(); + + reader.onload = () => { + this.uploaded = true; + this.$dispatch('broadcast', 'uploaded', { + type: file.type, + name: file.name, + url: reader.result + }); + + callback(); + }; + + reader.readAsDataURL(file); + } else { + window.alert('Please choose an image file.'); + callback(); + } + } else { + callback(); + } + }, + change: function (e) { + const target = e.target; + const files = target.files; + + this.read(files && files[0], () => { + target.value = ''; + }); + }, + dragover: function (e) { + e.preventDefault(); + }, + drop: function (e) { + const files = e.dataTransfer.files; + + e.preventDefault(); + + this.read(files && files[0]); + } + }, + events: { + remove: function () { + this.uploaded = false; + }, + removed: function () { + this.uploaded = false; + } + } +}; diff --git a/src/upload-box.jade b/src/upload-box.jade new file mode 100644 index 0000000..03c1710 --- /dev/null +++ b/src/upload-box.jade @@ -0,0 +1,5 @@ +script(id="upload-box", type="text/x-template") + div(class="upload", @change="change", @dragover="dragover", @drop="drop", v-show="!uploaded") + p Drop image here or + label(class="browse") browse... + input(class="sr-only", id="file", type="file", accept="image/*")