PJ568
2 years ago
parent
347345ec52
commit
6faf5c92c2
@ -0,0 +1,2 @@
|
|||||||
|
/*! @source http://purl.eligrey.com/github/FileSaver.js/blob/master/FileSaver.js */
|
||||||
|
var saveAs=saveAs||function(e){"use strict";if(typeof e==="undefined"||typeof navigator!=="undefined"&&/MSIE [1-9]\./.test(navigator.userAgent)){return}var t=e.document,n=function(){return e.URL||e.webkitURL||e},r=t.createElementNS("http://www.w3.org/1999/xhtml","a"),o="download"in r,a=function(e){var t=new MouseEvent("click");e.dispatchEvent(t)},i=/constructor/i.test(e.HTMLElement)||e.safari,f=/CriOS\/[\d]+/.test(navigator.userAgent),u=function(t){(e.setImmediate||e.setTimeout)(function(){throw t},0)},s="application/octet-stream",d=1e3*40,c=function(e){var t=function(){if(typeof e==="string"){n().revokeObjectURL(e)}else{e.remove()}};setTimeout(t,d)},l=function(e,t,n){t=[].concat(t);var r=t.length;while(r--){var o=e["on"+t[r]];if(typeof o==="function"){try{o.call(e,n||e)}catch(a){u(a)}}}},p=function(e){if(/^\s*(?:text\/\S*|application\/xml|\S*\/\S*\+xml)\s*;.*charset\s*=\s*utf-8/i.test(e.type)){return new Blob([String.fromCharCode(65279),e],{type:e.type})}return e},v=function(t,u,d){if(!d){t=p(t)}var v=this,w=t.type,m=w===s,y,h=function(){l(v,"writestart progress write writeend".split(" "))},S=function(){if((f||m&&i)&&e.FileReader){var r=new FileReader;r.onloadend=function(){var t=f?r.result:r.result.replace(/^data:[^;]*;/,"data:attachment/file;");var n=e.open(t,"_blank");if(!n)e.location.href=t;t=undefined;v.readyState=v.DONE;h()};r.readAsDataURL(t);v.readyState=v.INIT;return}if(!y){y=n().createObjectURL(t)}if(m){e.location.href=y}else{var o=e.open(y,"_blank");if(!o){e.location.href=y}}v.readyState=v.DONE;h();c(y)};v.readyState=v.INIT;if(o){y=n().createObjectURL(t);setTimeout(function(){r.href=y;r.download=u;a(r);h();c(y);v.readyState=v.DONE});return}S()},w=v.prototype,m=function(e,t,n){return new v(e,t||e.name||"download",n)};if(typeof navigator!=="undefined"&&navigator.msSaveOrOpenBlob){return function(e,t,n){t=t||e.name||"download";if(!n){e=p(e)}return navigator.msSaveOrOpenBlob(e,t)}}w.abort=function(){};w.readyState=w.INIT=0;w.WRITING=1;w.DONE=2;w.error=w.onwritestart=w.onprogress=w.onwrite=w.onabort=w.onerror=w.onwriteend=null;return m}(typeof self!=="undefined"&&self||typeof window!=="undefined"&&window||this.content);if(typeof module!=="undefined"&&module.exports){module.exports.saveAs=saveAs}else if(typeof define!=="undefined"&&define!==null&&define.amd!==null){define("FileSaver.js",function(){return saveAs})}
|
||||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,48 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>ImageEditor Demo</title>
|
||||||
|
<link type="text/css" href="tui-color-picker.css" rel="stylesheet">
|
||||||
|
<link rel="stylesheet" href="tui-image-editor.css">
|
||||||
|
<style>
|
||||||
|
|
||||||
|
html,
|
||||||
|
body {
|
||||||
|
height: 100%;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div id="tui-image-editor-container"></div>
|
||||||
|
<!-- 依赖的第三方库 -->
|
||||||
|
<script type="text/javascript" src="fabric.js"></script>
|
||||||
|
<!-- 一些工具函数 -->
|
||||||
|
<script type="text/javascript" src="tui-code-snippet.min.js"></script>
|
||||||
|
<!-- 颜色选择 -->
|
||||||
|
<script type="text/javascript" src="tui-color-picker.js"></script>
|
||||||
|
<!-- 文件下载的库 -->
|
||||||
|
<script type="text/javascript" src="FileSaver.min.js"></script>
|
||||||
|
<!-- 核心库 -->
|
||||||
|
<script src="tui-image-editor.js"></script>
|
||||||
|
<script>
|
||||||
|
var imageEditor = new tui.ImageEditor('#tui-image-editor-container', {
|
||||||
|
includeUI: {
|
||||||
|
initMenu: 'filter',
|
||||||
|
menuBarPosition: 'left'
|
||||||
|
},
|
||||||
|
cssMaxWidth: 700,
|
||||||
|
cssMaxHeight: 500,
|
||||||
|
usageStatistics: false
|
||||||
|
});
|
||||||
|
window.onresize = function () {
|
||||||
|
imageEditor.ui.resizeEditor();
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,154 @@
|
|||||||
|
/*!
|
||||||
|
* TOAST UI Color Picker
|
||||||
|
* @version 2.2.6
|
||||||
|
* @author NHN FE Development Team <dl_javascript@nhn.com>
|
||||||
|
* @license MIT
|
||||||
|
*/
|
||||||
|
.tui-colorpicker-clearfix {
|
||||||
|
zoom: 1;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-clearfix:after {
|
||||||
|
content: '';
|
||||||
|
display: block;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-vml {
|
||||||
|
behavior: url("#default#VML");
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-container {
|
||||||
|
width: 152px;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-palette-container {
|
||||||
|
width: 152px;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-palette-container ul {
|
||||||
|
width: 152px;
|
||||||
|
margin: 0px;
|
||||||
|
padding: 0px;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-palette-container li {
|
||||||
|
float: left;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0 3px 3px 0;
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-palette-button {
|
||||||
|
display: block;
|
||||||
|
border: none;
|
||||||
|
overflow: hidden;
|
||||||
|
outline: none;
|
||||||
|
margin: 0px;
|
||||||
|
padding: 0px;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-palette-button.tui-colorpicker-selected {
|
||||||
|
border: 2px solid #000;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-palette-button.tui-colorpicker-color-transparent {
|
||||||
|
barckground-repeat: repeat;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAOCAYAAAD0f5bSAAABfGlDQ1BJQ0MgUHJvZmlsZQAAKJFjYGAqSSwoyGFhYGDIzSspCnJ3UoiIjFJgv8PAzcDDIMRgxSCemFxc4BgQ4MOAE3y7xsAIoi/rgsxK8/x506a1fP4WNq+ZclYlOrj1gQF3SmpxMgMDIweQnZxSnJwLZOcA2TrJBUUlQPYMIFu3vKQAxD4BZIsUAR0IZN8BsdMh7A8gdhKYzcQCVhMS5AxkSwDZAkkQtgaInQ5hW4DYyRmJKUC2B8guiBvAgNPDRcHcwFLXkYC7SQa5OaUwO0ChxZOaFxoMcgcQyzB4MLgwKDCYMxgwWDLoMjiWpFaUgBQ65xdUFmWmZ5QoOAJDNlXBOT+3oLQktUhHwTMvWU9HwcjA0ACkDhRnEKM/B4FNZxQ7jxDLX8jAYKnMwMDcgxBLmsbAsH0PA4PEKYSYyjwGBn5rBoZt5woSixLhDmf8xkKIX5xmbARh8zgxMLDe+///sxoDA/skBoa/E////73o//+/i4H2A+PsQA4AJHdp4IxrEg8AAAGbaVRYdFhNTDpjb20uYWRvYmUueG1wAAAAAAA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJYTVAgQ29yZSA1LjQuMCI+CiAgIDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+CiAgICAgIDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiCiAgICAgICAgICAgIHhtbG5zOmV4aWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20vZXhpZi8xLjAvIj4KICAgICAgICAgPGV4aWY6UGl4ZWxYRGltZW5zaW9uPjEzPC9leGlmOlBpeGVsWERpbWVuc2lvbj4KICAgICAgICAgPGV4aWY6UGl4ZWxZRGltZW5zaW9uPjE0PC9leGlmOlBpeGVsWURpbWVuc2lvbj4KICAgICAgPC9yZGY6RGVzY3JpcHRpb24+CiAgIDwvcmRmOlJERj4KPC94OnhtcG1ldGE+CghrN1AAAABzSURBVCgVldKxEYAgDAXQD5VOpLuwgi4jlrTMqF00oOd5Aia/CcV/F4oYOgNlrLjvVyCEVJchBjEC25538PeaWTzRMBLxvIL7UZwFwL06qoA6aoAy+gFfJABvJAQPUoCMlICRRd8BzgHzJL4ok9aJ67l4AK9AxVKhHryUAAAAAElFTkSuQmCC");
|
||||||
|
}
|
||||||
|
.tui-colorpicker-palette-hex {
|
||||||
|
font-family: monospace;
|
||||||
|
display: inline-block;
|
||||||
|
*display: inline;
|
||||||
|
zoom: 1;
|
||||||
|
width: 60px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-palette-preview {
|
||||||
|
display: inline-block;
|
||||||
|
*display: inline;
|
||||||
|
zoom: 1;
|
||||||
|
width: 12px;
|
||||||
|
height: 12px;
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
vertical-align: middle;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-palette-toggle-slider {
|
||||||
|
display: inline-block;
|
||||||
|
*display: inline;
|
||||||
|
zoom: 1;
|
||||||
|
vertical-align: middle;
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-slider-container {
|
||||||
|
margin: 5px 0 0 0;
|
||||||
|
height: 122px;
|
||||||
|
zoom: 1;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-slider-container:after {
|
||||||
|
content: '';
|
||||||
|
display: block;
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-slider-left {
|
||||||
|
float: left;
|
||||||
|
width: 120px;
|
||||||
|
height: 120px;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-slider-right {
|
||||||
|
float: right;
|
||||||
|
width: 32px;
|
||||||
|
height: 120px;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-svg {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-slider-handle {
|
||||||
|
position: absolute;
|
||||||
|
overflow: visible;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 1px;
|
||||||
|
height: 1px;
|
||||||
|
z-index: 2;
|
||||||
|
opacity: 0.9;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-svg-slider {
|
||||||
|
width: 120px;
|
||||||
|
height: 120px;
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-vml-slider {
|
||||||
|
position: relative;
|
||||||
|
width: 120px;
|
||||||
|
height: 120px;
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-vml-slider-bg {
|
||||||
|
position: absolute;
|
||||||
|
margin: -1px 0 0 -1px;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 122px;
|
||||||
|
height: 122px;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-svg-huebar {
|
||||||
|
float: right;
|
||||||
|
width: 18px;
|
||||||
|
height: 120px;
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-vml-huebar {
|
||||||
|
width: 32px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.tui-colorpicker-vml-huebar-bg {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
width: 18px;
|
||||||
|
height: 121px;
|
||||||
|
}
|
||||||
|
|
||||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Loading…
Reference in new issue