@ -0,0 +1,9 @@ |
|||||
|
<IfModule mod_rewrite.c> |
||||
|
Options +FollowSymlinks -Multiviews |
||||
|
RewriteEngine On |
||||
|
|
||||
|
RewriteCond %{REQUEST_FILENAME} !-d |
||||
|
RewriteCond %{REQUEST_FILENAME} !-f |
||||
|
# RewriteRule ^(.*)$ index.php/$1 [QSA,PT,L] |
||||
|
RewriteRule ^(.*)$ index.php [L,E=PATH_INFO:$1] |
||||
|
</IfModule> |
||||
@ -0,0 +1,703 @@ |
|||||
|
@charset "utf-8"; |
||||
|
/*公用开始*/ |
||||
|
img,div,i,em,a,body,p,H1,ul,li { |
||||
|
border-style:none; |
||||
|
list-style-type:none; |
||||
|
margin:0; |
||||
|
padding:0; |
||||
|
text-decoration:none |
||||
|
} |
||||
|
/*公用结束*/ |
||||
|
/*缓冲效果开始 2.3加入的*/ |
||||
|
#shearphoto_main { |
||||
|
visibility:hidden; |
||||
|
margin:0 auto; |
||||
|
} |
||||
|
#shearphoto_loading { |
||||
|
width:100px; |
||||
|
text-align:center; |
||||
|
line-height:130px; |
||||
|
color:#999; |
||||
|
margin:0 auto; |
||||
|
background:url(../images/loading.gif) no-repeat |
||||
|
} |
||||
|
/*缓冲效果结束*/ |
||||
|
/*头部部份开始*/ |
||||
|
.header { |
||||
|
height:65px; |
||||
|
margin-bottom:10px; |
||||
|
width:100%; |
||||
|
overflow:hidden; |
||||
|
background:url(../images/bg_headLine1.png) no-repeat 290px #505153; |
||||
|
} |
||||
|
.header A { |
||||
|
-moz-border-radius:5px; |
||||
|
border-radius:5px; |
||||
|
color:#FFF; |
||||
|
display:inline-block; |
||||
|
float:left; |
||||
|
font-size:15px; |
||||
|
font-weight:700; |
||||
|
line-height:50px; |
||||
|
text-align:center; |
||||
|
width:150px; |
||||
|
margin:7px 0 0 100px; |
||||
|
background:#3E8BFF; |
||||
|
} |
||||
|
.header A:hover { |
||||
|
text-decoration: underline; |
||||
|
background-color: #0F6FFF; |
||||
|
} |
||||
|
.header img { |
||||
|
display:inline-block; |
||||
|
float:left; |
||||
|
margin-left:20px |
||||
|
} |
||||
|
.header strong { |
||||
|
color:#FFF; |
||||
|
display:block; |
||||
|
float:right; |
||||
|
height:60px; |
||||
|
line-height:60px; |
||||
|
margin-right:20px |
||||
|
} |
||||
|
/*头部部份结束*/ |
||||
|
/*预览开始*/ |
||||
|
#shearphoto_main #preview { |
||||
|
float:left; |
||||
|
position: relative; |
||||
|
} |
||||
|
#shearphoto_main #preview a { |
||||
|
display:inline; |
||||
|
float:left; |
||||
|
-moz-border-radius:5px; |
||||
|
border-radius:5px; |
||||
|
-moz-box-shadow:1px 1px 3px 1px #999; |
||||
|
box-shadow:1px 1px 3px 1px #999; |
||||
|
overflow: hidden; |
||||
|
position: relative; |
||||
|
} |
||||
|
#shearphoto_main #preview a img { |
||||
|
position: relative; |
||||
|
} |
||||
|
/*预览结束*/ |
||||
|
.bottom a:hover { |
||||
|
color: #39F; |
||||
|
text-decoration: underline; |
||||
|
} |
||||
|
/*旋转开始*/ |
||||
|
#Shearbar #LeftRotate { |
||||
|
margin:0 10px; |
||||
|
} |
||||
|
#Shearbar #LeftRotate em,#Shearbar #RightRotate em { |
||||
|
display:inline-block; |
||||
|
height:21px; |
||||
|
vertical-align:middle; |
||||
|
width:15px; |
||||
|
margin:1px 3px 0 0; |
||||
|
background:url(../images/bch.jpg) no-repeat; |
||||
|
} |
||||
|
#Shearbar #LeftRotate,#Shearbar #RightRotate { |
||||
|
-moz-border-radius:5px; |
||||
|
border:1px solid #CCC; |
||||
|
border-radius:5px; |
||||
|
color:#666; |
||||
|
cursor:pointer; |
||||
|
float:left; |
||||
|
font-size:12px; |
||||
|
margin-top:-5px; |
||||
|
text-align:center; |
||||
|
width:50px; |
||||
|
} |
||||
|
#Shearbar #LeftRotate:hover,#Shearbar #RightRotate:hover { |
||||
|
border:1px solid #919191; |
||||
|
color:#414141 |
||||
|
} |
||||
|
#Shearbar #RightRotate { |
||||
|
margin-left:10px |
||||
|
} |
||||
|
#Shearbar #RightRotate em { |
||||
|
background-position:-91px 0; |
||||
|
margin:1px 0 0 3px; |
||||
|
} |
||||
|
#Shearbar .hint { |
||||
|
color:#333; |
||||
|
display:block; |
||||
|
float:left; |
||||
|
font-size:12px; |
||||
|
font-style:normal; |
||||
|
height:19px; |
||||
|
line-height:15px; |
||||
|
width:19px |
||||
|
} |
||||
|
#Shearbar .hint.L,#Shearbar .hint.R { |
||||
|
background:url(../images/zoom.png) no-repeat -2px -1px |
||||
|
} |
||||
|
#Shearbar .hint.R { |
||||
|
background-position: -43px -1px |
||||
|
} |
||||
|
/*旋转结束*/ |
||||
|
/*选择图片方式开始*/ |
||||
|
#shearphoto_main #SelectBox { |
||||
|
background:url(../images/bg.png); |
||||
|
position:absolute; |
||||
|
z-index:180 |
||||
|
} |
||||
|
#SelectBox #selectImage input { |
||||
|
height: 50px; |
||||
|
width: 224px; |
||||
|
background-color: #FFF; |
||||
|
filter:alpha(opacity=0); |
||||
|
opacity:0; |
||||
|
position: absolute; |
||||
|
float: left; |
||||
|
cursor: pointer; |
||||
|
display: block; |
||||
|
} |
||||
|
.displayNone { |
||||
|
display: none; |
||||
|
} |
||||
|
#SelectBox #selectImage,#SelectBox #PhotoLoading,#SelectBox #camerasImage { |
||||
|
-moz-border-radius:10px; |
||||
|
border-radius:10px; |
||||
|
-moz-box-shadow:2px 2px 7px 1px #3e4044; |
||||
|
box-shadow:2px 2px 7px 1px #3e4044; |
||||
|
display:block; |
||||
|
height:50px; |
||||
|
outline:0 none; |
||||
|
position:absolute; |
||||
|
width:223px; |
||||
|
overflow:hidden; |
||||
|
margin:-37px 0 0 -112px; |
||||
|
background:url(../images/Select_en-us.jpg) no-repeat; |
||||
|
} |
||||
|
#SelectBox #PhotoLoading { |
||||
|
background-position:0 -160px; |
||||
|
left:50%; |
||||
|
top:70% |
||||
|
} |
||||
|
#SelectBox #selectImage { |
||||
|
background-position:0 -15px; |
||||
|
left:50%; |
||||
|
top:35% |
||||
|
} |
||||
|
#SelectBox #camerasImage { |
||||
|
background-position:0 -85px; |
||||
|
left:50%; |
||||
|
top:79% |
||||
|
} |
||||
|
#SelectBox #selectImage:hover,#SelectBox #PhotoLoading:hover,#SelectBox #camerasImage:hover { |
||||
|
border:3px solid #666; |
||||
|
margin:-37px 0 0 -112px; |
||||
|
} |
||||
|
/*选择图片方式结束*/ |
||||
|
/*工具条开始*/ |
||||
|
#shearphoto_main #Shearbar { |
||||
|
padding-top:10px; |
||||
|
width:442px; |
||||
|
margin:0 auto; |
||||
|
} |
||||
|
#Shearbar .Psava { |
||||
|
clear:both; |
||||
|
height:40px; |
||||
|
padding:20px 0 0 65px |
||||
|
} |
||||
|
#Shearbar .Psava #againIMG ,#Shearbar .Psava #saveShear { |
||||
|
background:url(../images/btn5.jpg) no-repeat; |
||||
|
color:#666; |
||||
|
float:left; |
||||
|
line-height:31px; |
||||
|
margin-right:20px; |
||||
|
text-align:center; |
||||
|
width:79px; |
||||
|
height: 31px; |
||||
|
} |
||||
|
#Shearbar .Psava #againIMG:hover { |
||||
|
background-position: 0px -31px; |
||||
|
} |
||||
|
#Shearbar .Psava #saveShear { |
||||
|
background-position: -79px 0px; |
||||
|
color:#FFF; |
||||
|
} |
||||
|
#Shearbar .Psava #saveShear:hover { |
||||
|
background-position:-79px -31px |
||||
|
} |
||||
|
#Shearbar #ZoomDist { |
||||
|
float:left; |
||||
|
height:20px; |
||||
|
position:relative; |
||||
|
width:120px |
||||
|
} |
||||
|
#Shearbar #ZoomDist #ZoomBar { |
||||
|
background:url(../images/ZoomBar.gif) no-repeat; |
||||
|
filter:alpha(opacity=80); |
||||
|
opacity:0.8; |
||||
|
height:20px; |
||||
|
left:0; |
||||
|
position:absolute; |
||||
|
width:15px |
||||
|
} |
||||
|
#ZoomDist #Zoomcentre { |
||||
|
filter:alpha(opacity=100); |
||||
|
height:9px; |
||||
|
left:50%; |
||||
|
top:25px; |
||||
|
position:absolute; |
||||
|
width:10px; |
||||
|
margin-left:-4px; |
||||
|
background:url(../images/Zoomcentre.jpg) no-repeat |
||||
|
} |
||||
|
#ZoomDist .progress { |
||||
|
-moz-border-radius:15px; |
||||
|
border-radius:15px; |
||||
|
background:#999; |
||||
|
display:block; |
||||
|
float:left; |
||||
|
height:8px; |
||||
|
margin-top:4px; |
||||
|
overflow:hidden; |
||||
|
width:100% |
||||
|
} |
||||
|
/*工具条结束*/ |
||||
|
/*主功能界面开始*/ |
||||
|
#shearphoto_main #black { |
||||
|
position:absolute; |
||||
|
z-index:99 |
||||
|
} |
||||
|
#shearphoto_main .primary { |
||||
|
float: left; |
||||
|
} |
||||
|
#shearphoto_main #main { |
||||
|
-moz-user-select:none; |
||||
|
-ms-user-select:none; |
||||
|
-webkit-user-select:none; |
||||
|
background:url(../images/bg.png); |
||||
|
overflow:hidden; |
||||
|
position:relative; |
||||
|
z-index:50; |
||||
|
border: 1px solid #CCC; |
||||
|
float: left; |
||||
|
} |
||||
|
#main .BigImg { |
||||
|
float:left; |
||||
|
position:relative; |
||||
|
z-index:51 |
||||
|
} |
||||
|
.MoveImg { |
||||
|
position:relative; |
||||
|
z-index:98; |
||||
|
max-width:300%; |
||||
|
} |
||||
|
#preview_img{ |
||||
|
max-width:300%; |
||||
|
} |
||||
|
#main #imgID { |
||||
|
display:block; |
||||
|
z-index:51 |
||||
|
} |
||||
|
#main #movebox { |
||||
|
position:absolute; |
||||
|
z-index:100; |
||||
|
float: left; |
||||
|
} |
||||
|
/*动态边框开始*/ |
||||
|
#movebox #borderTop,#movebox #borderLeft,#movebox #borderRight,#movebox #borderBottom { |
||||
|
background:url(../images/border.gif) #FFF; |
||||
|
display:inline-block; |
||||
|
filter:alpha(opacity=50); |
||||
|
opacity:0.5; |
||||
|
overflow:hidden; |
||||
|
position:absolute; |
||||
|
z-index:104; |
||||
|
} |
||||
|
#movebox #borderTop { |
||||
|
height:1px; |
||||
|
left:0; |
||||
|
top:0; |
||||
|
width:100%; |
||||
|
} |
||||
|
#movebox #borderLeft { |
||||
|
height:100%; |
||||
|
left:0; |
||||
|
top:0; |
||||
|
width:1px; |
||||
|
} |
||||
|
#movebox #borderRight { |
||||
|
height:100%; |
||||
|
right:0; |
||||
|
top:0; |
||||
|
width:1px; |
||||
|
} |
||||
|
#movebox #borderBottom { |
||||
|
bottom:0; |
||||
|
height:1px; |
||||
|
left:0; |
||||
|
width:100%; |
||||
|
} |
||||
|
/*动态边框结束*/ |
||||
|
/*拉伸截框的八个点开始*/ |
||||
|
#main #movebox #BottomRight,#main #movebox #TopRight,#main #movebox #Topleft,#main #movebox #Bottomleft,#main #movebox #Topmiddle,#main #movebox #leftmiddle,#main #movebox #Rightmiddle,#main #movebox #Bottommiddle { |
||||
|
background:#000; |
||||
|
border:1px solid #FFF; |
||||
|
bottom:-5px; |
||||
|
cursor:nw-resize; |
||||
|
display:block; |
||||
|
filter:alpha(opacity=50); |
||||
|
height:8px; |
||||
|
opacity:0.5; |
||||
|
overflow:hidden; |
||||
|
position:absolute; |
||||
|
right:-5px; |
||||
|
width:8px; |
||||
|
z-index:105; |
||||
|
} |
||||
|
#main #movebox #Bottomleft { |
||||
|
bottom:-5px; |
||||
|
cursor:ne-resize; |
||||
|
left:-5px |
||||
|
} |
||||
|
#main #movebox #Bottommiddle { |
||||
|
bottom:-5px; |
||||
|
cursor:n-resize; |
||||
|
left:50%; |
||||
|
margin-left:-5px |
||||
|
} |
||||
|
#main #movebox #Rightmiddle { |
||||
|
cursor:e-resize; |
||||
|
margin-top:-5px; |
||||
|
right:-5px; |
||||
|
top:50% |
||||
|
} |
||||
|
#main #movebox #TopRight { |
||||
|
cursor:ne-resize; |
||||
|
right:-5px; |
||||
|
top:-5px |
||||
|
} |
||||
|
#main #movebox #Topleft { |
||||
|
cursor:nw-resize; |
||||
|
left:-5px; |
||||
|
top:-5px |
||||
|
} |
||||
|
#main #movebox #Topmiddle { |
||||
|
cursor:n-resize; |
||||
|
left:50%; |
||||
|
margin-left:-5px; |
||||
|
top:-5px |
||||
|
} |
||||
|
#main #movebox #leftmiddle { |
||||
|
cursor:e-resize; |
||||
|
left:-5px; |
||||
|
margin-top:-5px; |
||||
|
top:50% |
||||
|
} |
||||
|
/*拉伸截框的八个点结束*/ |
||||
|
#main #relat { |
||||
|
position:relative; |
||||
|
z-index:60 |
||||
|
} |
||||
|
#main #smallbox { |
||||
|
background:url(); |
||||
|
overflow:hidden; |
||||
|
position:relative; |
||||
|
z-index:100 |
||||
|
} |
||||
|
/*主功能界面结束*/ |
||||
|
/*上滚下滚提示的CSS*/ |
||||
|
#main .point { |
||||
|
width:100%; |
||||
|
line-height:35px; |
||||
|
font-size:12px; |
||||
|
position:absolute; |
||||
|
z-index:200; |
||||
|
filter:alpha(opacity=70); |
||||
|
opacity:0.7; |
||||
|
} |
||||
|
.point i { |
||||
|
display:inline-block; |
||||
|
height:16px; |
||||
|
width:15px; |
||||
|
float:left; |
||||
|
margin:10px 10px 0 20px; |
||||
|
background:url(../images/bg_repno.png) no-repeat; |
||||
|
} |
||||
|
/*上滚下滚提示的CSS结束*/ |
||||
|
/*截图完成后的CSS开始*/ |
||||
|
#shearphoto_main .complete { |
||||
|
float:left; |
||||
|
overflow:hidden; |
||||
|
position:absolute; |
||||
|
width:100%; |
||||
|
z-index:250; |
||||
|
padding:10px 0 0 40px; |
||||
|
background:url(../images/bg.jpg) #CCC; |
||||
|
} |
||||
|
.complete .completeTxt { |
||||
|
-moz-border-radius:10px; |
||||
|
-moz-box-shadow:0 0 15px 0 #666; |
||||
|
border-radius:10px; |
||||
|
bottom:30px; |
||||
|
box-shadow:0 0 15px 0 #666; |
||||
|
position:absolute; |
||||
|
right:30px; |
||||
|
text-align:center; |
||||
|
width:280px; |
||||
|
padding:30px 0; |
||||
|
background:#FBFDFF; |
||||
|
} |
||||
|
.complete .completeTxt a { |
||||
|
color:#FFF; |
||||
|
display:block; |
||||
|
font-size:14px; |
||||
|
line-height:40px; |
||||
|
width:128px; |
||||
|
margin:0 auto; |
||||
|
background:url(../images/bg_index.gif) no-repeat 0 -2px; |
||||
|
} |
||||
|
.complete .completeTxt a:hover { |
||||
|
background-position: -137px -2px |
||||
|
} |
||||
|
.complete .completeTxt p { |
||||
|
color:#666; |
||||
|
font-size:12px; |
||||
|
font-weight:700; |
||||
|
margin:10px 0; |
||||
|
} |
||||
|
.complete .completeTxt strong { |
||||
|
font-size:14px |
||||
|
} |
||||
|
.complete img { |
||||
|
border:1px solid #CCC; |
||||
|
display:inline-block; |
||||
|
float:left; |
||||
|
margin:5px 5px; |
||||
|
padding:2px; |
||||
|
} |
||||
|
.complete .completeTxt strong i { |
||||
|
display:inline-block; |
||||
|
height:16px; |
||||
|
width:15px; |
||||
|
vertical-align:middle; |
||||
|
margin:-3px 5px 0 0; |
||||
|
background:url(../images/bg_repno.png) no-repeat; |
||||
|
} |
||||
|
/*截图完成后的CSS结束*/ |
||||
|
/*弹出相册开始*/ |
||||
|
#photoalbum { |
||||
|
-moz-border-radius:10px; |
||||
|
-moz-box-shadow:3px 3px 10px 0 #000; |
||||
|
border:8px solid #999; |
||||
|
border-radius:10px; |
||||
|
box-shadow:3px 3px 10px 0 #000; |
||||
|
display:none; |
||||
|
height:300px; |
||||
|
left:50%; |
||||
|
position:absolute; |
||||
|
top:59%; |
||||
|
width:465px; |
||||
|
z-index:210; |
||||
|
margin:-178px 0 0 -240.5px; |
||||
|
background:#DFEFFF; |
||||
|
} |
||||
|
#photoalbum h1 { |
||||
|
background:#999; |
||||
|
color:#FFF; |
||||
|
font-size:15px; |
||||
|
height:40px; |
||||
|
line-height:30px; |
||||
|
padding-left:10px; |
||||
|
width:455px |
||||
|
} |
||||
|
#photoalbum i { |
||||
|
background:url(../images/fancybox_sprite.png) no-repeat; |
||||
|
display:block; |
||||
|
float:left; |
||||
|
height:37px; |
||||
|
left:429px; |
||||
|
position:absolute; |
||||
|
top:0; |
||||
|
cursor:pointer; |
||||
|
width:36px |
||||
|
} |
||||
|
#photoalbum ul { |
||||
|
height:auto; |
||||
|
width:100% |
||||
|
} |
||||
|
#photoalbum ul li { |
||||
|
border:1px solid #CCC; |
||||
|
cursor:pointer; |
||||
|
display:inline; |
||||
|
float:left; |
||||
|
height:133px; |
||||
|
margin:5px; |
||||
|
padding:2px; |
||||
|
width:47%; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
#photoalbum ul li img { |
||||
|
width:100% |
||||
|
} |
||||
|
#photoalbum ul li:hover { |
||||
|
border:1px solid #09F |
||||
|
} |
||||
|
/*弹出相册结束*/ |
||||
|
/*弹出拍照开始*/ |
||||
|
#CamBox { |
||||
|
-moz-border-radius:10px; |
||||
|
border-radius:10px; |
||||
|
left:67%; |
||||
|
position:absolute; |
||||
|
-moz-box-shadow:5px 5px 10px 0 #3b3b3f; |
||||
|
box-shadow:5px 5px 10px 0 #3b3b3f; |
||||
|
width:350px; |
||||
|
z-index:250; |
||||
|
display:none; |
||||
|
top:95%; |
||||
|
margin:-285px 0 0 -276px; |
||||
|
background:url(../images/cam_bg.jpg) #d5d5d5; |
||||
|
} |
||||
|
#CamBox #CamFlash { |
||||
|
height:300px; |
||||
|
width:300px; |
||||
|
margin:0 auto; |
||||
|
background:#fff; |
||||
|
} |
||||
|
#CamBox #timing { |
||||
|
color:#F60; |
||||
|
display:none; |
||||
|
font-size:36px; |
||||
|
font-weight:700; |
||||
|
height:220px; |
||||
|
left:50%; |
||||
|
line-height:200px; |
||||
|
position:absolute; |
||||
|
text-align:center; |
||||
|
top:50%; |
||||
|
width:200px; |
||||
|
margin:-100px 0 0 -100px; |
||||
|
} |
||||
|
#CamBox .cambar { |
||||
|
height:60px; |
||||
|
padding-top:20px; |
||||
|
width:300px; |
||||
|
margin:0 auto; |
||||
|
} |
||||
|
#CamBox .cambar a { |
||||
|
background:url(../images/btn5.jpg) no-repeat; |
||||
|
float:left; |
||||
|
height:31px; |
||||
|
line-height:31px; |
||||
|
text-align:center; |
||||
|
width:79px |
||||
|
} |
||||
|
#CamBox .lens { |
||||
|
background:url(../images/cam.png) no-repeat 50%; |
||||
|
height:40px; |
||||
|
width:100% |
||||
|
} |
||||
|
#CamBox .cambar #camClose,#CamBox .cambar #setCam { |
||||
|
color: #333; |
||||
|
} |
||||
|
#CamBox .cambar #setCam { |
||||
|
margin-right: 30px; |
||||
|
} |
||||
|
#CamBox .cambar #camClose:hover,#CamBox .cambar #setCam:hover { |
||||
|
background-position: 0 -31px; |
||||
|
} |
||||
|
#CamBox .cambar #CamOk { |
||||
|
background-position: -79px 0; |
||||
|
color: #fff; |
||||
|
margin-right: 30px; |
||||
|
} |
||||
|
#CamBox .cambar #CamOk:hover { |
||||
|
background-position: -79px -31px; |
||||
|
} |
||||
|
/*弹出拍照结束*/ |
||||
|
/*图片特效*/ |
||||
|
#shearphoto_main .Effects { |
||||
|
color:#FFF; |
||||
|
overflow-x:hidden; |
||||
|
width:155px; |
||||
|
display:none; |
||||
|
float:left; |
||||
|
border-color:#CCC; |
||||
|
border-style:solid none; |
||||
|
border-width:1px; |
||||
|
background:url(../images/Effects/cardboard.png); |
||||
|
} |
||||
|
#shearphoto_main .Effects .EffectsStrong { |
||||
|
border-bottom:solid 1px #676767; |
||||
|
display:block; |
||||
|
font-size:14px; |
||||
|
height:30px; |
||||
|
line-height:30px; |
||||
|
text-align:center; |
||||
|
width:100% |
||||
|
} |
||||
|
#shearphoto_main .Effects a { |
||||
|
border-bottom:solid 1px #676767; |
||||
|
color:#FFF; |
||||
|
display:block; |
||||
|
vertical-align:middle; |
||||
|
text-shadow:#000 0 2px 0; |
||||
|
width:100%; |
||||
|
padding:5px 0 7px; |
||||
|
} |
||||
|
#shearphoto_main .Effects a:hover, #shearphoto_main .Effects .Aclick { |
||||
|
background-color: #A7A7A7; |
||||
|
} |
||||
|
#shearphoto_main .Effects a img { |
||||
|
-moz-border-radius:3px; |
||||
|
border-radius:3px; |
||||
|
display:inline-block; |
||||
|
height:42px; |
||||
|
vertical-align:middle; |
||||
|
-moz-box-shadow:0 0 5px 0 #000; |
||||
|
box-shadow:0 0 5px 0 #000; |
||||
|
width:70px; |
||||
|
margin:2px 7px 0; |
||||
|
} |
||||
|
::-webkit-scrollbar { |
||||
|
height:13px; |
||||
|
width:13px |
||||
|
} |
||||
|
::-webkit-scrollbar-thumb { |
||||
|
background:padding-box #c2c2c2; |
||||
|
border:1px solid #979797; |
||||
|
min-height:28px |
||||
|
} |
||||
|
::-webkit-scrollbar-thumb:hover { |
||||
|
background:#929292; |
||||
|
border:1px solid #636363 |
||||
|
} |
||||
|
::-webkit-scrollbar-track-piece { |
||||
|
background:#f5f5f5; |
||||
|
border-left:1px solid #d2d2d2 |
||||
|
} |
||||
|
/*图片特效结束*/ |
||||
|
/*底部开始*/ |
||||
|
.bottom { |
||||
|
width:1000px; |
||||
|
left:2px; |
||||
|
color:#666; |
||||
|
clear:both; |
||||
|
text-align:center; |
||||
|
margin:0 auto; |
||||
|
padding:0 0 10px 5px |
||||
|
} |
||||
|
.bottom span { |
||||
|
vertical-align:middle; |
||||
|
display:inline-block; |
||||
|
margin:0 5px 0 2px |
||||
|
} |
||||
|
.bottom a { |
||||
|
color: #666; |
||||
|
} |
||||
|
.header h1 a { |
||||
|
font-size: 14px; |
||||
|
color: #fff; |
||||
|
} |
||||
|
.bottom span img { |
||||
|
border-radius:30px; |
||||
|
-moz-border-radius:30px; |
||||
|
} |
||||
|
/*底部结束*/ |
||||
@ -0,0 +1,703 @@ |
|||||
|
@charset "utf-8"; |
||||
|
/*公用开始*/ |
||||
|
img,div,i,em,a,body,p,H1,ul,li { |
||||
|
border-style:none; |
||||
|
list-style-type:none; |
||||
|
margin:0; |
||||
|
padding:0; |
||||
|
text-decoration:none |
||||
|
} |
||||
|
/*公用结束*/ |
||||
|
/*缓冲效果开始 2.3加入的*/ |
||||
|
#shearphoto_main { |
||||
|
visibility:hidden; |
||||
|
margin:0 auto; |
||||
|
} |
||||
|
#shearphoto_loading { |
||||
|
width:100px; |
||||
|
text-align:center; |
||||
|
line-height:130px; |
||||
|
color:#999; |
||||
|
margin:0 auto; |
||||
|
background:url(../images/loading.gif) no-repeat |
||||
|
} |
||||
|
/*缓冲效果结束*/ |
||||
|
/*头部部份开始*/ |
||||
|
.header { |
||||
|
height:65px; |
||||
|
margin-bottom:10px; |
||||
|
width:100%; |
||||
|
overflow:hidden; |
||||
|
background:url(../images/bg_headLine1.png) no-repeat 290px #505153; |
||||
|
} |
||||
|
.header A { |
||||
|
-moz-border-radius:5px; |
||||
|
border-radius:5px; |
||||
|
color:#FFF; |
||||
|
display:inline-block; |
||||
|
float:left; |
||||
|
font-size:15px; |
||||
|
font-weight:700; |
||||
|
line-height:50px; |
||||
|
text-align:center; |
||||
|
width:150px; |
||||
|
margin:7px 0 0 100px; |
||||
|
background:#3E8BFF; |
||||
|
} |
||||
|
.header A:hover { |
||||
|
text-decoration: underline; |
||||
|
background-color: #0F6FFF; |
||||
|
} |
||||
|
.header img { |
||||
|
display:inline-block; |
||||
|
float:left; |
||||
|
margin-left:20px |
||||
|
} |
||||
|
.header strong { |
||||
|
color:#FFF; |
||||
|
display:block; |
||||
|
float:right; |
||||
|
height:60px; |
||||
|
line-height:60px; |
||||
|
margin-right:20px |
||||
|
} |
||||
|
/*头部部份结束*/ |
||||
|
/*预览开始*/ |
||||
|
#shearphoto_main #preview { |
||||
|
float:left; |
||||
|
position: relative; |
||||
|
} |
||||
|
#shearphoto_main #preview a { |
||||
|
display:inline; |
||||
|
float:left; |
||||
|
-moz-border-radius:5px; |
||||
|
border-radius:5px; |
||||
|
-moz-box-shadow:1px 1px 3px 1px #999; |
||||
|
box-shadow:1px 1px 3px 1px #999; |
||||
|
overflow: hidden; |
||||
|
position: relative; |
||||
|
} |
||||
|
#shearphoto_main #preview a img { |
||||
|
position: relative; |
||||
|
} |
||||
|
/*预览结束*/ |
||||
|
.bottom a:hover { |
||||
|
color: #39F; |
||||
|
text-decoration: underline; |
||||
|
} |
||||
|
/*旋转开始*/ |
||||
|
#Shearbar #LeftRotate { |
||||
|
margin:0 10px; |
||||
|
} |
||||
|
#Shearbar #LeftRotate em,#Shearbar #RightRotate em { |
||||
|
display:inline-block; |
||||
|
height:21px; |
||||
|
vertical-align:middle; |
||||
|
width:15px; |
||||
|
margin:1px 3px 0 0; |
||||
|
background:url(../images/bch.jpg) no-repeat; |
||||
|
} |
||||
|
#Shearbar #LeftRotate,#Shearbar #RightRotate { |
||||
|
-moz-border-radius:5px; |
||||
|
border:1px solid #CCC; |
||||
|
border-radius:5px; |
||||
|
color:#666; |
||||
|
cursor:pointer; |
||||
|
float:left; |
||||
|
font-size:12px; |
||||
|
margin-top:-5px; |
||||
|
text-align:center; |
||||
|
width:50px; |
||||
|
} |
||||
|
#Shearbar #LeftRotate:hover,#Shearbar #RightRotate:hover { |
||||
|
border:1px solid #919191; |
||||
|
color:#414141 |
||||
|
} |
||||
|
#Shearbar #RightRotate { |
||||
|
margin-left:10px |
||||
|
} |
||||
|
#Shearbar #RightRotate em { |
||||
|
background-position:-91px 0; |
||||
|
margin:1px 0 0 3px; |
||||
|
} |
||||
|
#Shearbar .hint { |
||||
|
color:#333; |
||||
|
display:block; |
||||
|
float:left; |
||||
|
font-size:12px; |
||||
|
font-style:normal; |
||||
|
height:19px; |
||||
|
line-height:15px; |
||||
|
width:19px |
||||
|
} |
||||
|
#Shearbar .hint.L,#Shearbar .hint.R { |
||||
|
background:url(../images/zoom.png) no-repeat -2px -1px |
||||
|
} |
||||
|
#Shearbar .hint.R { |
||||
|
background-position: -43px -1px |
||||
|
} |
||||
|
/*旋转结束*/ |
||||
|
/*选择图片方式开始*/ |
||||
|
#shearphoto_main #SelectBox { |
||||
|
background:url(../images/bg.png); |
||||
|
position:absolute; |
||||
|
z-index:180 |
||||
|
} |
||||
|
#SelectBox #selectImage input { |
||||
|
height: 50px; |
||||
|
width: 224px; |
||||
|
background-color: #FFF; |
||||
|
filter:alpha(opacity=0); |
||||
|
opacity:0; |
||||
|
position: absolute; |
||||
|
float: left; |
||||
|
cursor: pointer; |
||||
|
display: block; |
||||
|
} |
||||
|
.displayNone { |
||||
|
display: none; |
||||
|
} |
||||
|
#SelectBox #selectImage,#SelectBox #PhotoLoading,#SelectBox #camerasImage { |
||||
|
-moz-border-radius:10px; |
||||
|
border-radius:10px; |
||||
|
-moz-box-shadow:2px 2px 7px 1px #3e4044; |
||||
|
box-shadow:2px 2px 7px 1px #3e4044; |
||||
|
display:block; |
||||
|
height:50px; |
||||
|
outline:0 none; |
||||
|
position:absolute; |
||||
|
width:223px; |
||||
|
overflow:hidden; |
||||
|
margin:-37px 0 0 -112px; |
||||
|
background:url(../images/Select_zh-cn.jpg) no-repeat; |
||||
|
} |
||||
|
#SelectBox #PhotoLoading { |
||||
|
background-position:0 -160px; |
||||
|
left:50%; |
||||
|
top:70% |
||||
|
} |
||||
|
#SelectBox #selectImage { |
||||
|
background-position:0 -15px; |
||||
|
left:50%; |
||||
|
top:35% |
||||
|
} |
||||
|
#SelectBox #camerasImage { |
||||
|
background-position:0 -85px; |
||||
|
left:50%; |
||||
|
top:79% |
||||
|
} |
||||
|
#SelectBox #selectImage:hover,#SelectBox #PhotoLoading:hover,#SelectBox #camerasImage:hover { |
||||
|
border:3px solid #666; |
||||
|
margin:-37px 0 0 -112px; |
||||
|
} |
||||
|
/*选择图片方式结束*/ |
||||
|
/*工具条开始*/ |
||||
|
#shearphoto_main #Shearbar { |
||||
|
padding-top:10px; |
||||
|
width:442px; |
||||
|
margin:0 auto; |
||||
|
} |
||||
|
#Shearbar .Psava { |
||||
|
clear:both; |
||||
|
height:40px; |
||||
|
padding:20px 0 0 65px |
||||
|
} |
||||
|
#Shearbar .Psava #againIMG ,#Shearbar .Psava #saveShear { |
||||
|
background:url(../images/btn5.jpg) no-repeat; |
||||
|
color:#666; |
||||
|
float:left; |
||||
|
line-height:31px; |
||||
|
margin-right:20px; |
||||
|
text-align:center; |
||||
|
width:79px; |
||||
|
height: 31px; |
||||
|
} |
||||
|
#Shearbar .Psava #againIMG:hover { |
||||
|
background-position: 0px -31px; |
||||
|
} |
||||
|
#Shearbar .Psava #saveShear { |
||||
|
background-position: -79px 0px; |
||||
|
color:#FFF; |
||||
|
} |
||||
|
#Shearbar .Psava #saveShear:hover { |
||||
|
background-position:-79px -31px |
||||
|
} |
||||
|
#Shearbar #ZoomDist { |
||||
|
float:left; |
||||
|
height:20px; |
||||
|
position:relative; |
||||
|
width:120px |
||||
|
} |
||||
|
#Shearbar #ZoomDist #ZoomBar { |
||||
|
background:url(../images/ZoomBar.gif) no-repeat; |
||||
|
filter:alpha(opacity=80); |
||||
|
opacity:0.8; |
||||
|
height:20px; |
||||
|
left:0; |
||||
|
position:absolute; |
||||
|
width:15px |
||||
|
} |
||||
|
#ZoomDist #Zoomcentre { |
||||
|
filter:alpha(opacity=100); |
||||
|
height:9px; |
||||
|
left:50%; |
||||
|
top:25px; |
||||
|
position:absolute; |
||||
|
width:10px; |
||||
|
margin-left:-4px; |
||||
|
background:url(../images/Zoomcentre.jpg) no-repeat |
||||
|
} |
||||
|
#ZoomDist .progress { |
||||
|
-moz-border-radius:15px; |
||||
|
border-radius:15px; |
||||
|
background:#999; |
||||
|
display:block; |
||||
|
float:left; |
||||
|
height:8px; |
||||
|
margin-top:4px; |
||||
|
overflow:hidden; |
||||
|
width:100% |
||||
|
} |
||||
|
/*工具条结束*/ |
||||
|
/*主功能界面开始*/ |
||||
|
#shearphoto_main #black { |
||||
|
position:absolute; |
||||
|
z-index:99 |
||||
|
} |
||||
|
#shearphoto_main .primary { |
||||
|
float: left; |
||||
|
} |
||||
|
#shearphoto_main #main { |
||||
|
-moz-user-select:none; |
||||
|
-ms-user-select:none; |
||||
|
-webkit-user-select:none; |
||||
|
background:url(../images/bg.png); |
||||
|
overflow:hidden; |
||||
|
position:relative; |
||||
|
z-index:50; |
||||
|
border: 1px solid #CCC; |
||||
|
float: left; |
||||
|
} |
||||
|
#main .BigImg { |
||||
|
float:left; |
||||
|
position:relative; |
||||
|
z-index:51 |
||||
|
} |
||||
|
.MoveImg { |
||||
|
position:relative; |
||||
|
z-index:98; |
||||
|
max-width:300%; |
||||
|
} |
||||
|
#preview_img{ |
||||
|
max-width:300%; |
||||
|
} |
||||
|
#main #imgID { |
||||
|
display:block; |
||||
|
z-index:51 |
||||
|
} |
||||
|
#main #movebox { |
||||
|
position:absolute; |
||||
|
z-index:100; |
||||
|
float: left; |
||||
|
} |
||||
|
/*动态边框开始*/ |
||||
|
#movebox #borderTop,#movebox #borderLeft,#movebox #borderRight,#movebox #borderBottom { |
||||
|
background:url(../images/border.gif) #FFF; |
||||
|
display:inline-block; |
||||
|
filter:alpha(opacity=50); |
||||
|
opacity:0.5; |
||||
|
overflow:hidden; |
||||
|
position:absolute; |
||||
|
z-index:104; |
||||
|
} |
||||
|
#movebox #borderTop { |
||||
|
height:1px; |
||||
|
left:0; |
||||
|
top:0; |
||||
|
width:100%; |
||||
|
} |
||||
|
#movebox #borderLeft { |
||||
|
height:100%; |
||||
|
left:0; |
||||
|
top:0; |
||||
|
width:1px; |
||||
|
} |
||||
|
#movebox #borderRight { |
||||
|
height:100%; |
||||
|
right:0; |
||||
|
top:0; |
||||
|
width:1px; |
||||
|
} |
||||
|
#movebox #borderBottom { |
||||
|
bottom:0; |
||||
|
height:1px; |
||||
|
left:0; |
||||
|
width:100%; |
||||
|
} |
||||
|
/*动态边框结束*/ |
||||
|
/*拉伸截框的八个点开始*/ |
||||
|
#main #movebox #BottomRight,#main #movebox #TopRight,#main #movebox #Topleft,#main #movebox #Bottomleft,#main #movebox #Topmiddle,#main #movebox #leftmiddle,#main #movebox #Rightmiddle,#main #movebox #Bottommiddle { |
||||
|
background:#000; |
||||
|
border:1px solid #FFF; |
||||
|
bottom:-5px; |
||||
|
cursor:nw-resize; |
||||
|
display:block; |
||||
|
filter:alpha(opacity=50); |
||||
|
height:8px; |
||||
|
opacity:0.5; |
||||
|
overflow:hidden; |
||||
|
position:absolute; |
||||
|
right:-5px; |
||||
|
width:8px; |
||||
|
z-index:105; |
||||
|
} |
||||
|
#main #movebox #Bottomleft { |
||||
|
bottom:-5px; |
||||
|
cursor:ne-resize; |
||||
|
left:-5px |
||||
|
} |
||||
|
#main #movebox #Bottommiddle { |
||||
|
bottom:-5px; |
||||
|
cursor:n-resize; |
||||
|
left:50%; |
||||
|
margin-left:-5px |
||||
|
} |
||||
|
#main #movebox #Rightmiddle { |
||||
|
cursor:e-resize; |
||||
|
margin-top:-5px; |
||||
|
right:-5px; |
||||
|
top:50% |
||||
|
} |
||||
|
#main #movebox #TopRight { |
||||
|
cursor:ne-resize; |
||||
|
right:-5px; |
||||
|
top:-5px |
||||
|
} |
||||
|
#main #movebox #Topleft { |
||||
|
cursor:nw-resize; |
||||
|
left:-5px; |
||||
|
top:-5px |
||||
|
} |
||||
|
#main #movebox #Topmiddle { |
||||
|
cursor:n-resize; |
||||
|
left:50%; |
||||
|
margin-left:-5px; |
||||
|
top:-5px |
||||
|
} |
||||
|
#main #movebox #leftmiddle { |
||||
|
cursor:e-resize; |
||||
|
left:-5px; |
||||
|
margin-top:-5px; |
||||
|
top:50% |
||||
|
} |
||||
|
/*拉伸截框的八个点结束*/ |
||||
|
#main #relat { |
||||
|
position:relative; |
||||
|
z-index:60 |
||||
|
} |
||||
|
#main #smallbox { |
||||
|
background:url(); |
||||
|
overflow:hidden; |
||||
|
position:relative; |
||||
|
z-index:100 |
||||
|
} |
||||
|
/*主功能界面结束*/ |
||||
|
/*上滚下滚提示的CSS*/ |
||||
|
#main .point { |
||||
|
width:100%; |
||||
|
line-height:35px; |
||||
|
font-size:12px; |
||||
|
position:absolute; |
||||
|
z-index:200; |
||||
|
filter:alpha(opacity=70); |
||||
|
opacity:0.7; |
||||
|
} |
||||
|
.point i { |
||||
|
display:inline-block; |
||||
|
height:16px; |
||||
|
width:15px; |
||||
|
float:left; |
||||
|
margin:10px 10px 0 20px; |
||||
|
background:url(../images/bg_repno.png) no-repeat; |
||||
|
} |
||||
|
/*上滚下滚提示的CSS结束*/ |
||||
|
/*截图完成后的CSS开始*/ |
||||
|
#shearphoto_main .complete { |
||||
|
float:left; |
||||
|
overflow:hidden; |
||||
|
position:absolute; |
||||
|
width:100%; |
||||
|
z-index:250; |
||||
|
padding:10px 0 0 40px; |
||||
|
background:url(../images/bg.jpg) #CCC; |
||||
|
} |
||||
|
.complete .completeTxt { |
||||
|
-moz-border-radius:10px; |
||||
|
-moz-box-shadow:0 0 15px 0 #666; |
||||
|
border-radius:10px; |
||||
|
bottom:30px; |
||||
|
box-shadow:0 0 15px 0 #666; |
||||
|
position:absolute; |
||||
|
right:30px; |
||||
|
text-align:center; |
||||
|
width:280px; |
||||
|
padding:30px 0; |
||||
|
background:#FBFDFF; |
||||
|
} |
||||
|
.complete .completeTxt a { |
||||
|
color:#FFF; |
||||
|
display:block; |
||||
|
font-size:14px; |
||||
|
line-height:40px; |
||||
|
width:128px; |
||||
|
margin:0 auto; |
||||
|
background:url(../images/bg_index.gif) no-repeat 0 -2px; |
||||
|
} |
||||
|
.complete .completeTxt a:hover { |
||||
|
background-position: -137px -2px |
||||
|
} |
||||
|
.complete .completeTxt p { |
||||
|
color:#666; |
||||
|
font-size:12px; |
||||
|
font-weight:700; |
||||
|
margin:10px 0; |
||||
|
} |
||||
|
.complete .completeTxt strong { |
||||
|
font-size:14px |
||||
|
} |
||||
|
.complete img { |
||||
|
border:1px solid #CCC; |
||||
|
display:inline-block; |
||||
|
float:left; |
||||
|
margin:5px 5px; |
||||
|
padding:2px; |
||||
|
} |
||||
|
.complete .completeTxt strong i { |
||||
|
display:inline-block; |
||||
|
height:16px; |
||||
|
width:15px; |
||||
|
vertical-align:middle; |
||||
|
margin:-3px 5px 0 0; |
||||
|
background:url(../images/bg_repno.png) no-repeat; |
||||
|
} |
||||
|
/*截图完成后的CSS结束*/ |
||||
|
/*弹出相册开始*/ |
||||
|
#photoalbum { |
||||
|
-moz-border-radius:10px; |
||||
|
-moz-box-shadow:3px 3px 10px 0 #000; |
||||
|
border:8px solid #999; |
||||
|
border-radius:10px; |
||||
|
box-shadow:3px 3px 10px 0 #000; |
||||
|
display:none; |
||||
|
height:300px; |
||||
|
left:50%; |
||||
|
position:absolute; |
||||
|
top:59%; |
||||
|
width:465px; |
||||
|
z-index:210; |
||||
|
margin:-178px 0 0 -240.5px; |
||||
|
background:#DFEFFF; |
||||
|
} |
||||
|
#photoalbum h1 { |
||||
|
background:#999; |
||||
|
color:#FFF; |
||||
|
font-size:15px; |
||||
|
height:40px; |
||||
|
line-height:30px; |
||||
|
padding-left:10px; |
||||
|
width:455px |
||||
|
} |
||||
|
#photoalbum i { |
||||
|
background:url(../images/fancybox_sprite.png) no-repeat; |
||||
|
display:block; |
||||
|
float:left; |
||||
|
height:37px; |
||||
|
left:429px; |
||||
|
position:absolute; |
||||
|
top:0; |
||||
|
cursor:pointer; |
||||
|
width:36px |
||||
|
} |
||||
|
#photoalbum ul { |
||||
|
height:auto; |
||||
|
width:100% |
||||
|
} |
||||
|
#photoalbum ul li { |
||||
|
border:1px solid #CCC; |
||||
|
cursor:pointer; |
||||
|
display:inline; |
||||
|
float:left; |
||||
|
height:133px; |
||||
|
margin:5px; |
||||
|
padding:2px; |
||||
|
width:47%; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
#photoalbum ul li img { |
||||
|
width:100% |
||||
|
} |
||||
|
#photoalbum ul li:hover { |
||||
|
border:1px solid #09F |
||||
|
} |
||||
|
/*弹出相册结束*/ |
||||
|
/*弹出拍照开始*/ |
||||
|
#CamBox { |
||||
|
-moz-border-radius:10px; |
||||
|
border-radius:10px; |
||||
|
left:67%; |
||||
|
position:absolute; |
||||
|
-moz-box-shadow:5px 5px 10px 0 #3b3b3f; |
||||
|
box-shadow:5px 5px 10px 0 #3b3b3f; |
||||
|
width:350px; |
||||
|
z-index:250; |
||||
|
display:none; |
||||
|
top:95%; |
||||
|
margin:-285px 0 0 -276px; |
||||
|
background:url(../images/cam_bg.jpg) #d5d5d5; |
||||
|
} |
||||
|
#CamBox #CamFlash { |
||||
|
height:300px; |
||||
|
width:300px; |
||||
|
margin:0 auto; |
||||
|
background:#fff; |
||||
|
} |
||||
|
#CamBox #timing { |
||||
|
color:#F60; |
||||
|
display:none; |
||||
|
font-size:36px; |
||||
|
font-weight:700; |
||||
|
height:220px; |
||||
|
left:50%; |
||||
|
line-height:200px; |
||||
|
position:absolute; |
||||
|
text-align:center; |
||||
|
top:50%; |
||||
|
width:200px; |
||||
|
margin:-100px 0 0 -100px; |
||||
|
} |
||||
|
#CamBox .cambar { |
||||
|
height:60px; |
||||
|
padding-top:20px; |
||||
|
width:300px; |
||||
|
margin:0 auto; |
||||
|
} |
||||
|
#CamBox .cambar a { |
||||
|
background:url(../images/btn5.jpg) no-repeat; |
||||
|
float:left; |
||||
|
height:31px; |
||||
|
line-height:31px; |
||||
|
text-align:center; |
||||
|
width:79px |
||||
|
} |
||||
|
#CamBox .lens { |
||||
|
background:url(../images/cam.png) no-repeat 50%; |
||||
|
height:40px; |
||||
|
width:100% |
||||
|
} |
||||
|
#CamBox .cambar #camClose,#CamBox .cambar #setCam { |
||||
|
color: #333; |
||||
|
} |
||||
|
#CamBox .cambar #setCam { |
||||
|
margin-right: 30px; |
||||
|
} |
||||
|
#CamBox .cambar #camClose:hover,#CamBox .cambar #setCam:hover { |
||||
|
background-position: 0 -31px; |
||||
|
} |
||||
|
#CamBox .cambar #CamOk { |
||||
|
background-position: -79px 0; |
||||
|
color: #fff; |
||||
|
margin-right: 30px; |
||||
|
} |
||||
|
#CamBox .cambar #CamOk:hover { |
||||
|
background-position: -79px -31px; |
||||
|
} |
||||
|
/*弹出拍照结束*/ |
||||
|
/*图片特效*/ |
||||
|
#shearphoto_main .Effects { |
||||
|
color:#FFF; |
||||
|
overflow-x:hidden; |
||||
|
width:155px; |
||||
|
display:none; |
||||
|
float:left; |
||||
|
border-color:#CCC; |
||||
|
border-style:solid none; |
||||
|
border-width:1px; |
||||
|
background:url(../images/Effects/cardboard.png); |
||||
|
} |
||||
|
#shearphoto_main .Effects .EffectsStrong { |
||||
|
border-bottom:solid 1px #676767; |
||||
|
display:block; |
||||
|
font-size:14px; |
||||
|
height:30px; |
||||
|
line-height:30px; |
||||
|
text-align:center; |
||||
|
width:100% |
||||
|
} |
||||
|
#shearphoto_main .Effects a { |
||||
|
border-bottom:solid 1px #676767; |
||||
|
color:#FFF; |
||||
|
display:block; |
||||
|
vertical-align:middle; |
||||
|
text-shadow:#000 0 2px 0; |
||||
|
width:100%; |
||||
|
padding:5px 0 7px; |
||||
|
} |
||||
|
#shearphoto_main .Effects a:hover, #shearphoto_main .Effects .Aclick { |
||||
|
background-color: #A7A7A7; |
||||
|
} |
||||
|
#shearphoto_main .Effects a img { |
||||
|
-moz-border-radius:3px; |
||||
|
border-radius:3px; |
||||
|
display:inline-block; |
||||
|
height:42px; |
||||
|
vertical-align:middle; |
||||
|
-moz-box-shadow:0 0 5px 0 #000; |
||||
|
box-shadow:0 0 5px 0 #000; |
||||
|
width:70px; |
||||
|
margin:2px 7px 0; |
||||
|
} |
||||
|
::-webkit-scrollbar { |
||||
|
height:13px; |
||||
|
width:13px |
||||
|
} |
||||
|
::-webkit-scrollbar-thumb { |
||||
|
background:padding-box #c2c2c2; |
||||
|
border:1px solid #979797; |
||||
|
min-height:28px |
||||
|
} |
||||
|
::-webkit-scrollbar-thumb:hover { |
||||
|
background:#929292; |
||||
|
border:1px solid #636363 |
||||
|
} |
||||
|
::-webkit-scrollbar-track-piece { |
||||
|
background:#f5f5f5; |
||||
|
border-left:1px solid #d2d2d2 |
||||
|
} |
||||
|
/*图片特效结束*/ |
||||
|
/*底部开始*/ |
||||
|
.bottom { |
||||
|
width:1000px; |
||||
|
left:2px; |
||||
|
color:#666; |
||||
|
clear:both; |
||||
|
text-align:center; |
||||
|
margin:0 auto; |
||||
|
padding:0 0 10px 5px |
||||
|
} |
||||
|
.bottom span { |
||||
|
vertical-align:middle; |
||||
|
display:inline-block; |
||||
|
margin:0 5px 0 2px |
||||
|
} |
||||
|
.bottom a { |
||||
|
color: #666; |
||||
|
} |
||||
|
.header h1 a { |
||||
|
font-size: 14px; |
||||
|
color: #fff; |
||||
|
} |
||||
|
.bottom span img { |
||||
|
border-radius:30px; |
||||
|
-moz-border-radius:30px; |
||||
|
} |
||||
|
/*底部结束*/ |
||||
|
After Width: | Height: | Size: 31 KiB |
|
After Width: | Height: | Size: 59 KiB |
|
After Width: | Height: | Size: 61 KiB |
|
After Width: | Height: | Size: 47 KiB |
|
After Width: | Height: | Size: 8.1 KiB |
|
After Width: | Height: | Size: 13 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 2.8 KiB |
|
After Width: | Height: | Size: 2.8 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 2.0 KiB |
|
After Width: | Height: | Size: 2.4 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 2.5 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 2.4 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 46 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 462 B |
|
After Width: | Height: | Size: 2.8 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 2.8 KiB |
|
After Width: | Height: | Size: 329 B |
|
After Width: | Height: | Size: 4.8 KiB |
|
After Width: | Height: | Size: 3.1 KiB |
|
After Width: | Height: | Size: 4.6 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 4.9 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 4.1 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
@ -0,0 +1,723 @@ |
|||||
|
try{ |
||||
|
Array.prototype.del = function(a) { |
||||
|
a.sort(); |
||||
|
for (var b = this.concat([]), c = a.length - 1; c >= 0; c--) b = b.slice(0, a[c]).concat(b.slice(a[c] + 1)); |
||||
|
return b; |
||||
|
}, |
||||
|
|
||||
|
HTMLImageElement.prototype.loadOnce = function(a) { |
||||
|
var b = 0; |
||||
|
this.onload = function() { |
||||
|
b || a.call(this, null), b++; |
||||
|
}; |
||||
|
}, function(a) { |
||||
|
var b = { |
||||
|
lib:[], |
||||
|
init:function() { |
||||
|
this.require("config"); |
||||
|
}, |
||||
|
module:function(a, b) { |
||||
|
this.lib[a] = b.call(null, this); |
||||
|
}, |
||||
|
require:function(a) { |
||||
|
var b = this, c = document.createElement("script"); |
||||
|
document.body.appendChild(c), c.src = "./js/module/" + a + ".js", c.onload = c.onerror = function(a) { |
||||
|
b.handlerror(a); |
||||
|
}; |
||||
|
}, |
||||
|
handlerror:function() {}, |
||||
|
destroySelf:function(b) { |
||||
|
throw delete ShearPhoto[a], Error(b); |
||||
|
}, |
||||
|
reflect:function(a, b, c) { |
||||
|
return a = this.lib.config.getModuleName(a), this.lib[a].process(b, c); |
||||
|
}, |
||||
|
reflectEasy:function(a) { |
||||
|
return a = this.lib.config.getEasyFun(a), this.lib.easy.getFun(a); |
||||
|
}, |
||||
|
add:function(a, b, c, d, e, f, g, h) { |
||||
|
return this.lib.addLayer.add(a, b, c, d, e, f, g, h); |
||||
|
}, |
||||
|
applyMatrix:function() {} |
||||
|
}; |
||||
|
ShearPhoto[a] = function(b, c, d) { |
||||
|
if (!(this instanceof ShearPhoto[a])) return new ShearPhoto[a](b, c, d); |
||||
|
this.startTime = +new Date(); |
||||
|
var e = document.createElement("canvas"), f = e.getContext("2d") , imgWidth , imgHeight; |
||||
|
isNaN(b) ? (e.width = parseInt(b.width), e.height = parseInt(b.height), c = getComputedStyle(b), |
||||
|
imgWidth = parseInt(c.getPropertyValue("width")), imgHeight = parseInt(c.getPropertyValue("height")), |
||||
|
isNaN(imgWidth) ? f.drawImage(b, 0, 0) :f.drawImage(b, 0, 0, imgWidth, imgHeight)) :(e.width = b, |
||||
|
e.height = c, f.fillStyle = d || "#fff", f.fillRect(0, 0, b, c)), this.canvas = e, |
||||
|
this.context = f, this.imgData = f.getImageData(0, 0, e.width, e.height), this.name = a + "_" + Math.random(), |
||||
|
this.canvas.id = this.name, this.layers = [], b = document.createElement("canvas"), |
||||
|
b.width = e.width, b.height = e.height; |
||||
|
}, ShearPhoto[a].module = function(a, c) { |
||||
|
b.module(a, c); |
||||
|
}, ShearPhoto[a].dorsyMath = function() { |
||||
|
return b.lib.dorsyMath; |
||||
|
}, ShearPhoto[a].prototype = { |
||||
|
act:function(a) { |
||||
|
var c = [], c = Array.prototype.slice.call(arguments, 1); |
||||
|
return b.reflect(a, this.imgData, c), this; |
||||
|
}, |
||||
|
view:function(a, b, c, d, e) { |
||||
|
var f = this.clone(); |
||||
|
return f.type = 1, this.addLayer(f, "正常", 0, 0), f.act(a, b, c, d, e), this; |
||||
|
}, |
||||
|
excute:function() { |
||||
|
var a = this.layers, b = a.length; |
||||
|
a[b - 1] && 1 == a[b - 1][0].type && (this.imgData = a[b - 1][0].imgData, delete a[b - 1]); |
||||
|
}, |
||||
|
cancel:function() { |
||||
|
var a = this.layers, b = a.length; |
||||
|
a[b - 1] && 1 == a[b - 1][0].type && delete a[b - 1]; |
||||
|
}, |
||||
|
show:function(b, c) { |
||||
|
var d, e, f, g, h = new ShearPhoto[a](this.canvas.width, this.canvas.height); |
||||
|
for (h.add(this, "正常", 0, 0, c), this.tempPsLib = h, d = 0; d < this.layers.length; d++) e = this.layers[d], |
||||
|
f = e[0].layers, g = e[0], f[f.length - 1] && 1 == f[f.length - 1][0].type && (g = f[f.length - 1][0]), |
||||
|
h.add(g, e[1], e[2], e[3], c); |
||||
|
return this.context.clearRect(0, 0, this.canvas.width, this.canvas.height), this.context.putImageData(h.imgData, 0, 0), |
||||
|
b ? document.querySelector(b).appendChild(this.canvas) :document.body.appendChild(this.canvas), |
||||
|
this; |
||||
|
}, |
||||
|
replace:function(a) { |
||||
|
return a && (a.onload = function() {}, a.src = this.save()), this; |
||||
|
}, |
||||
|
add:function() { |
||||
|
var a, c, d, e, f, g = []; |
||||
|
for (d = 0; d < arguments.length; d++) if (d) switch (typeof arguments[d]) { |
||||
|
case "string": |
||||
|
/\d+%/.test(arguments[d]) ? c = arguments[d].replace("%", "") :/[RGB]+/.test(arguments[d]) ? f = arguments[d] :a = arguments[d]; |
||||
|
break; |
||||
|
|
||||
|
case "number": |
||||
|
g.push(arguments[d]); |
||||
|
break; |
||||
|
|
||||
|
case "boolean": |
||||
|
e = arguments[d]; |
||||
|
} |
||||
|
return d = g[0] || 0, g = g[1] || 0, this.imgData = b.add(this.imgData, arguments[0].imgData, a || "正常", c / 100 || 1, d, g, e || !1, f || "RGB"), |
||||
|
this; |
||||
|
}, |
||||
|
addLayer:function(a, b, c, d) { |
||||
|
return this.layers.push([ a, b, c, d ]), this; |
||||
|
}, |
||||
|
clone:function() { |
||||
|
var b = new ShearPhoto[a](this.canvas.width, this.canvas.height); |
||||
|
return b.context.putImageData(this.imgData, 0, 0), b.imgData = b.context.getImageData(0, 0, this.canvas.width, this.canvas.height), |
||||
|
b; |
||||
|
}, |
||||
|
swap:function(a, b) { |
||||
|
var c = this.layers[a]; |
||||
|
return this.layers[a] = this.layers[b], this.layers[b] = c, this; |
||||
|
}, |
||||
|
deleteLayers:function(a) { |
||||
|
this.layers = this.layers.del(a); |
||||
|
}, |
||||
|
save:function(b, c) { |
||||
|
var d, e, f, g, h; |
||||
|
if (!this.layers.length) return c ? (this.context.putImageData(this.imgData, 0, 0), |
||||
|
this.canvas.toDataURL(c, .9)) :(this.context.putImageData(this.imgData, 0, 0), this.canvas.toDataURL()); |
||||
|
for (d = new ShearPhoto[a](this.canvas.width, this.canvas.height), d.add(this, "正常", 0, 0, b), |
||||
|
this.tempPsLib = d, e = 0; e < this.layers.length; e++) f = this.layers[e], g = f[0].layers, |
||||
|
h = f[0], g[g.length - 1] && 1 == g[g.length - 1][0].type && (h = g[g.length - 1][0]), |
||||
|
d.add(h, f[1], f[2], f[3], b); |
||||
|
return this.context.clearRect(0, 0, this.canvas.width, this.canvas.height), this.context.putImageData(d.imgData, 0, 0), |
||||
|
c ? this.canvas.toDataURL(c, .9) :this.canvas.toDataURL(); |
||||
|
}, |
||||
|
drawRect:function() { |
||||
|
var a, b, c, d, e, f; |
||||
|
for ((a = document.getElementById("imgRect")) || (a = document.createElement("canvas"), |
||||
|
a.id = "imgRect", document.body.appendChild(a), a.width = parseInt(this.canvas.width), |
||||
|
a.height = parseInt(this.canvas.height)), b = a.getContext("2d"), b.clearRect(0, 0, a.width, a.height), |
||||
|
c = [], d = this.tempPsLib.imgData.data, e = 0, f = d.length; f > e; e++) c[d[e]] ? c[d[e]]++ :c[d[e]] = 1; |
||||
|
for (b.beginPath(), b.moveTo(0, a.height), e = d = 0; 255 > e; e++) c[e] > d && (d = c[e]); |
||||
|
for (e = 0; 255 > e; e++) f = c[e] || 0, f = a.height - .8 * (f / d) * a.height, |
||||
|
b.lineTo(e / 256 * a.width, f, 1, 1); |
||||
|
b.lineTo(a.width + 10, a.height), b.fill(); |
||||
|
}, |
||||
|
ps:function(a) { |
||||
|
var c; |
||||
|
return c = b.reflectEasy(a).call(this), this.logTime("组合效果" + a), c; |
||||
|
}, |
||||
|
logTime:function(a) { |
||||
|
console.log(a + ": " + (+new Date() - this.startTime) / 1e3 + "s"); |
||||
|
}, |
||||
|
ctx:function(a) { |
||||
|
var b = this.ctxContext; |
||||
|
return b.putImageData(this.imgData, 0, 0), a.call(b), this.imgData = b.getImageData(0, 0, this.canvas.width, this.canvas.height), |
||||
|
this; |
||||
|
} |
||||
|
}; |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("ImageEnhance", function() { |
||||
|
return { |
||||
|
process:function(a) { |
||||
|
for (var b = a.data, c = 0, d = b.length; d > c; c += 4) ; |
||||
|
return a.data = b, a; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("addLayer", function() { |
||||
|
return { |
||||
|
add:function(a, b, c, d, e, f, g, h) { |
||||
|
var i, j, k, l, m, n, o, p; |
||||
|
for (g = a.data, i = b.data, e = e || 0, f = f || 0, d = d || 1, h = h || "RGB", |
||||
|
/[RGB]+/.test(h) || (h = "RGB"), k = h.replace("R", "0").replace("G", "1").replace("B", "2"), |
||||
|
h = a.width, l = i.length, b = b.width, k = [ -1 < k.indexOf("0"), -1 < k.indexOf("1"), -1 < k.indexOf("2") ], |
||||
|
o = 0, p = g.length; p > o; o += 4) if (m = o / 4, n = parseInt(m / h), m %= h, |
||||
|
n -= f, m -= e, n = n * b + m, n *= 4, n >= 0 && l - 4 > n && b > m && m >= 0) for (m = 0; 3 > m && 0 != i[n + 3]; m++) switch (g[o + 3] = i[n + 3], |
||||
|
c) { |
||||
|
case "颜色减淡": |
||||
|
k[m] && (j = g[o + m] + g[o + m] * i[n + m] / (255 - i[n + m]), g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
break; |
||||
|
|
||||
|
case "变暗": |
||||
|
k[m] && (j = g[o + m] < i[n + m] ? g[o + m] :i[n + m], g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
break; |
||||
|
|
||||
|
case "变亮": |
||||
|
k[m] && (j = g[o + m] > i[n + m] ? g[o + m] :i[n + m], g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
break; |
||||
|
|
||||
|
case "正片叠底": |
||||
|
k[m] && (j = parseInt(g[o + m] * i[n + m] / 255), g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
break; |
||||
|
|
||||
|
case "滤色": |
||||
|
k[m] && (j = parseInt(255 - (255 - g[o + m]) * (255 - i[n + m]) / 255), g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
break; |
||||
|
|
||||
|
case "叠加": |
||||
|
k[m] && (j = 127.5 >= g[o + m] ? g[o + m] * i[n + m] / 127.5 :255 - (255 - g[o + m]) * (255 - i[n + m]) / 127.5, |
||||
|
g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
break; |
||||
|
|
||||
|
case "强光": |
||||
|
k[m] && (j = 127.5 >= i[n + m] ? g[o + m] * i[n + m] / 127.5 :g[o + m] + (255 - g[o + m]) * (i[n + m] - 127.5) / 127.5, |
||||
|
g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
break; |
||||
|
|
||||
|
case "差值": |
||||
|
k[m] && (j = g[o + m] > i[n + m] ? g[o + m] - i[n + m] :i[n + m] - g[o + m], g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
break; |
||||
|
|
||||
|
case "排除": |
||||
|
k[m] && (j = g[o + m] + i[n + m] - g[o + m] * i[n + m] / 127.5, g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
break; |
||||
|
|
||||
|
case "点光": |
||||
|
k[m] && (j = g[o + m] < 2 * i[n + m] - 255 ? 2 * i[n + m] - 255 :g[o + m] < 2 * i[n + m] ? g[o + m] :2 * i[n + m], |
||||
|
g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
break; |
||||
|
|
||||
|
case "颜色加深": |
||||
|
k[m] && (j = 255 - 255 * (255 - g[o + m]) / i[n + m], g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
break; |
||||
|
|
||||
|
case "线性加深": |
||||
|
k[m] && (j = g[o + m] + i[n + m], j = j > 255 ? j - 255 :0, g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
break; |
||||
|
|
||||
|
case "线性减淡": |
||||
|
k[m] && (j = g[o + m] + i[n + m], j = j > 255 ? 255 :j, g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
break; |
||||
|
|
||||
|
case "柔光": |
||||
|
k[m] && (j = 127.5 > i[n + m] ? ((2 * i[n + m] - 255) * (255 - g[o + m]) / 65025 + 1) * g[o + m] :(2 * i[n + m] - 255) * (Math.sqrt(g[o + m] / 255) - g[o + m] / 255) + g[o + m], |
||||
|
g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
break; |
||||
|
|
||||
|
case "亮光": |
||||
|
k[m] && (j = 127.5 > i[n + m] ? 255 * (1 - (255 - g[o + m]) / (2 * i[n + m])) :g[o + m] / (2 * (1 - i[n + m] / 255)), |
||||
|
g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
break; |
||||
|
|
||||
|
case "线性光": |
||||
|
k[m] && (j = g[o + m] + 2 * i[n + m] - 255, j = j > 255 ? 255 :j, g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
break; |
||||
|
|
||||
|
case "实色混合": |
||||
|
k[m] && (j = i[n + m] < 255 - g[o + m] ? 0 :255, g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
break; |
||||
|
|
||||
|
default: |
||||
|
k[m] && (j = i[n + m], g[o + m] = (1 - d) * g[o + m] + d * j); |
||||
|
} |
||||
|
return a; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("brightness", function() { |
||||
|
return { |
||||
|
process:function(a, b) { |
||||
|
var c, d, e, f, g, h; |
||||
|
for (c = a.data, d = b[0] / 50, e = Math.tan((45 + 44 * ((b[1] || 0) / 50)) * Math.PI / 180), |
||||
|
f = 0, g = c.length; g > f; f += 4) for (h = 0; 3 > h; h++) c[f + h] = (c[f + h] - 127.5 * (1 - d)) * e + 127.5 * (1 + d); |
||||
|
return a; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("applyMatrix", function(a) { |
||||
|
return { |
||||
|
process:function(b) { |
||||
|
var c, d, e, f, g, h, i, j, k, l, m, n, o, p; |
||||
|
for (c = b.data, d = b.width, e = new a.lib.dorsyMath.Matrix([ -2, -4, -4, -4, -2, -4, 0, 8, 0, -4, -4, 8, 24, 8, -4, -4, 0, 8, 0, -4, -2, -4, -4, -4, -2 ], 25, 1), |
||||
|
f = [], g = 0, h = c.length; h > g; g += 4) if (i = g / 4, j = parseInt(i / d), |
||||
|
k = i % d, 0 != j && 0 != k) { |
||||
|
for (l = [ [], [], [] ], m = -2; 3 > m; m++) for (n = j + m, o = -2; 3 > o; o++) for (p = 4 * (n * d + (k + o)), |
||||
|
i = 0; 3 > i; i++) l[i].push(c[p + i]); |
||||
|
for (j = new a.lib.dorsyMath.Matrix(l, 3, matrixSize).mutiply(e), i = 0; 3 > i; i++) f[g + i] = j.data[i]; |
||||
|
f[g + 4] = c[g + 4]; |
||||
|
} |
||||
|
for (g = 0, h = c.length; h > g; g++) c[g] = f[g] || c[g]; |
||||
|
return b; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("config", function() { |
||||
|
var a = { |
||||
|
"灰度处理":"toGray", |
||||
|
"反色":"toReverse", |
||||
|
"灰度阈值":"toThresh", |
||||
|
"高斯模糊":"gaussBlur", |
||||
|
"亮度":"brightness", |
||||
|
"浮雕效果":"embossment", |
||||
|
"查找边缘":"borderline", |
||||
|
"色相/饱和度调节":"setHSI", |
||||
|
"马赛克":"mosaic", |
||||
|
"油画":"oilPainting", |
||||
|
"腐蚀":"corrode", |
||||
|
"锐化":"sharp", |
||||
|
"添加杂色":"noise", |
||||
|
"曲线":"curve", |
||||
|
"暗角":"darkCorner", |
||||
|
"喷点":"dotted" |
||||
|
}, b = { |
||||
|
"美肤":"softenFace", |
||||
|
"素描":"sketch", |
||||
|
"自然增强":"softEnhancement", |
||||
|
"紫调":"purpleStyle", |
||||
|
"柔焦":"soften", |
||||
|
"复古":"vintage", |
||||
|
"黑白":"gray", |
||||
|
"仿lomo":"lomo", |
||||
|
"亮白增强":"strongEnhancement", |
||||
|
"灰白":"strongGray", |
||||
|
"灰色":"lightGray", |
||||
|
"暖秋":"warmAutumn", |
||||
|
"木雕":"carveStyle", |
||||
|
"粗糙":"rough" |
||||
|
}; |
||||
|
return { |
||||
|
getModuleName:function(b) { |
||||
|
return a[b] || b; |
||||
|
}, |
||||
|
getEasyFun:function(a) { |
||||
|
return b[a] || a; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("corrode", function() { |
||||
|
return { |
||||
|
process:function(a, b) { |
||||
|
var c, d, e, f, g, h, i, j, k; |
||||
|
for (c = parseInt(b[0]) || 3, d = a.data, e = a.width, f = a.height, g = 0; e > g; g++) for (h = 0; f > h; h++) for (i = parseInt(2 * Math.random() * c) - c, |
||||
|
j = parseInt(2 * Math.random() * c) - c, k = h * e + g, i = (h + i) * e + g + j, |
||||
|
j = 0; 3 > j; j++) d[4 * k + j] = d[4 * i + j]; |
||||
|
return a; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("curve", function(a) { |
||||
|
return { |
||||
|
process:function(b, c) { |
||||
|
var d, e, f, g, h, i, j, k; |
||||
|
for (d = a.lib.dorsyMath.lagrange(c[0], c[1]), e = b.data, f = b.width, g = b.height, |
||||
|
h = 0; f > h; h++) for (i = 0; g > i; i++) for (j = i * f + h, k = 0; 3 > k; k++) e[4 * j + k] = d(e[4 * j + k]); |
||||
|
return b; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("darkCorner", function(a) { |
||||
|
return { |
||||
|
process:function(b, c) { |
||||
|
var d, e, f, g, h, i, j, k, l, m, n, o, p, q; |
||||
|
for (d = parseInt(c[0]) || 3, e = c[1] || 30, f = b.data, g = b.width, h = b.height, |
||||
|
i = 2 * g / 3, j = 1 * h / 2, k = a.lib.dorsyMath.distance([ i, j ]), d = k * (1 - d / 10), |
||||
|
l = 0; g > l; l++) for (m = 0; h > m; m++) for (n = m * g + l, o = 0; 3 > o; o++) p = f[4 * n + o], |
||||
|
q = (a.lib.dorsyMath.distance([ l, m ], [ i, j ]) - d) / (k - d), 0 > q && (q = 0), |
||||
|
p = (0 * Math.pow(1 - q, 3) + .06 * q * Math.pow(1 - q, 2) + 3 * .3 * q * q * (1 - q) + 1 * Math.pow(q, 3)) * p * e / 255, |
||||
|
f[4 * n + o] -= p; |
||||
|
return b; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("dorsyMath", function(a) { |
||||
|
var b = { |
||||
|
FFT1:function(a) { |
||||
|
function c() { |
||||
|
var g, h, i, j, k, l, m, n, o, p, q; |
||||
|
for (e++, g = d / Math.pow(2, e), h = d / g, i = 0; g > i; i++) for (j = i * h, |
||||
|
k = (i + 1) * h - 1, l = e, m = Math.pow(2, l - 1), n = 0; k - m >= j; j++) o = j + m, |
||||
|
p = n * d / Math.pow(2, l), q = p + d / 4, a[j] instanceof b.C || (a[j] = new b.C(a[j])), |
||||
|
a[o] instanceof b.C || (a[o] = new b.C(a[o])), p = a[j].plus(a[o].mutiply(f[p])), |
||||
|
q = a[j].plus(a[o].mutiply(f[q])), a[j] = p, a[o] = q, n++; |
||||
|
g > 1 && c(); |
||||
|
} |
||||
|
for (var d = a.length, e = 0, f = [], g = 0; d > g; g++) f[g] = this.exp(-2 * Math.PI * g / d); |
||||
|
return c(), a; |
||||
|
}, |
||||
|
DFT:function() {}, |
||||
|
Matrix:function(a, b, c) { |
||||
|
var d, e, f = []; |
||||
|
if (b) { |
||||
|
if (isNaN(b) ? (d = /(\d+)\*/.exec(b)[1], b = /\*(\d+)/.exec(b)[1]) :(d = b, b = c), |
||||
|
a[0] && a[0][0]) for (c = 0; d > c; c++) for (f[c] = [], e = 0; b > e; e++) f[c][e] = a[c][e] || 0; else for (c = 0; d > c; c++) for (f[c] = [], |
||||
|
e = 0; b > e; e++) f[c][e] = a[c * b + e] || 0; |
||||
|
this.m = d, this.n = b; |
||||
|
} else this.m = a.length, this.n = a[0].length; |
||||
|
this.data = f; |
||||
|
}, |
||||
|
C:function(a, b) { |
||||
|
this.r = a || 0, this.i = b || 0; |
||||
|
}, |
||||
|
exp:function(a, c) { |
||||
|
a = a || 0, c = c || 1; |
||||
|
var d = new b.C(); |
||||
|
return d.r = c * Math.cos(a), d.i = c * Math.sin(a), d; |
||||
|
}, |
||||
|
lagrange:function(a, b) { |
||||
|
var c = a.length; |
||||
|
return function(d) { |
||||
|
var e, f, g, h, i; |
||||
|
for (e = 0, f = 0; c > f; f++) { |
||||
|
for (g = 1, h = 1, i = 0; c > i; i++) i != f && (g *= a[f] - a[i], h *= d - a[i]); |
||||
|
e += b[f] * (h / g); |
||||
|
} |
||||
|
return e; |
||||
|
}; |
||||
|
}, |
||||
|
applyMatrix:function(c, d, e) { |
||||
|
var f, g, h, i, j, k, l, m, n, o, p, q, r, s, t; |
||||
|
for (e = e || 0, f = c.data, g = c.width, h = d.length, d = new b.Matrix(d, h, 1), |
||||
|
i = [], j = -(Math.sqrt(h) - 1) / 2, k = 0, l = f.length; l > k; k += 4) if (m = k / 4, |
||||
|
n = parseInt(m / g), o = m % g, 0 != n && 0 != o) { |
||||
|
for (p = [ [], [], [] ], q = j; -j >= q; q++) for (r = n + q, s = j; -j >= s; s++) for (t = 4 * (r * g + (o + s)), |
||||
|
m = 0; 3 > m; m++) p[m].push(f[t + m]); |
||||
|
for (n = new a.lib.dorsyMath.Matrix(p, 3, h).mutiply(d), m = 0; 3 > m; m++) i[k + m] = n.data[m]; |
||||
|
i[k + 4] = f[k + 4]; |
||||
|
} |
||||
|
for (k = 0, l = f.length; l > k; k++) i[k] && (f[k] = i[k] < e ? i[k] :f[k]); |
||||
|
return c; |
||||
|
}, |
||||
|
RGBToHSI:function(a, b, c) { |
||||
|
var d = (a - b + a - c) / 2 / Math.sqrt((a - b) * (a - b) + (a - c) * (b - c)) || 0, d = Math.acos(d), d = c > b ? 2 * Math.PI - d :d, e = 1 - 3 * Math.min(a, b, c) / (a + b + c); |
||||
|
return d > 2 * Math.PI && (d = 2 * Math.PI), 0 > d && (d = 0), { |
||||
|
H:d, |
||||
|
S:e, |
||||
|
I:(a + b + c) / 3 |
||||
|
}; |
||||
|
}, |
||||
|
HSIToRGB:function(a, b, c) { |
||||
|
if (0 > a ? (a %= 2 * Math.PI, a += 2 * Math.PI) :a %= 2 * Math.PI, a <= 2 * Math.PI / 3) var d = c * (1 - b), e = c * (1 + b * Math.cos(a) / Math.cos(Math.PI / 3 - a)), f = 3 * c - (e + d); else a <= 4 * Math.PI / 3 ? (a -= 2 * Math.PI / 3, |
||||
|
e = c * (1 - b), f = c * (1 + b * Math.cos(a) / Math.cos(Math.PI / 3 - a)), d = 3 * c - (f + e)) :(a -= 4 * Math.PI / 3, |
||||
|
f = c * (1 - b), d = c * (1 + b * Math.cos(a) / Math.cos(Math.PI / 3 - a)), e = 3 * c - (f + d)); |
||||
|
return { |
||||
|
R:e, |
||||
|
G:f, |
||||
|
B:d |
||||
|
}; |
||||
|
}, |
||||
|
applyInHSI:function(a, b) { |
||||
|
var c, d, e, f; |
||||
|
for (c = a.data, d = 0, e = c.length; e > d; d += 4) f = this.RGBToHSI(c[d], c[d + 1], c[d + 2]), |
||||
|
b(f), 1 < f.S && (f.S = 1), 0 > f.S && (f.S = 0), f = this.HSIToRGB(f.H, f.S, f.I), |
||||
|
c[d] = f.R, c[d + 1] = f.G, c[d + 2] = f.B; |
||||
|
}, |
||||
|
applyInCoordinate:function() {}, |
||||
|
distance:function(a, c) { |
||||
|
return c = c || [ 0, 0 ], a = new b.C(a[0], a[1]), c = new b.C(c[0], c[1]), a.minus(c).distance(); |
||||
|
}, |
||||
|
xyToIFun:function(a) { |
||||
|
return function(b, c, d) { |
||||
|
return 4 * (c * a + b) + (d || 0); |
||||
|
}; |
||||
|
}, |
||||
|
xyCal:function(a, b, c, d, e) { |
||||
|
var f, g, h; |
||||
|
for (f = this.xyToIFun(a.width), g = 0; 3 > g; g++) h = f(b, c, g), a[h] = d(a[h]); |
||||
|
e && (a[h + 1] = e(a[h + 1])); |
||||
|
} |
||||
|
}; |
||||
|
return b.Matrix.prototype = { |
||||
|
plus:function(a) { |
||||
|
var c, d, e; |
||||
|
if (this.m != a.m || this.n != a.n) throw Error("矩阵加法行列不匹配"); |
||||
|
for (c = new b.Matrix([], this.m, this.n), d = 0; d < this.m; d++) for (e = 0; e < this.n; e++) c.data[d][e] = this.data[d][e] + a.data[d][e]; |
||||
|
return c; |
||||
|
}, |
||||
|
minus:function(a) { |
||||
|
var c, d, e; |
||||
|
if (this.m != a.m || this.n != a.n) throw Error("矩阵减法法行列不匹配"); |
||||
|
for (c = new b.Matrix([], this.m, this.n), d = 0; d < this.m; d++) for (e = 0; e < this.n; e++) c.data[d][e] = this.data[d][e] - a.data[d][e]; |
||||
|
return c; |
||||
|
}, |
||||
|
mutiply:function(a) { |
||||
|
var c, d, e, f, g; |
||||
|
if (this.n != a.m) throw Error("矩阵乘法行列不匹配"); |
||||
|
for (c = new b.Matrix([], this.m, a.n), d = 0; d < this.m; d++) for (e = 0; e < a.n; e++) { |
||||
|
for (f = 0, g = 0; g < this.n; g++) f += this.data[d][g] * a.data[g][e]; |
||||
|
c.data[d][e] = f; |
||||
|
} |
||||
|
return c; |
||||
|
} |
||||
|
}, b.C.prototype = { |
||||
|
plus:function(a) { |
||||
|
var c = new b.C(); |
||||
|
return c.r = this.r + a.r, c.i = this.i + a.i, c; |
||||
|
}, |
||||
|
minus:function(a) { |
||||
|
var c = new b.C(); |
||||
|
return c.r = this.r - a.r, c.i = this.i - a.i, c; |
||||
|
}, |
||||
|
mutiply:function(a) { |
||||
|
var c = new b.C(); |
||||
|
return c.r = this.r * a.r - this.i * a.i, c.i = this.r * a.i + this.i * a.r, c; |
||||
|
}, |
||||
|
divide:function(a) { |
||||
|
var c = new b.C(), d = a.mutiply(a.conjugated()); |
||||
|
return a = this.mutiply(a.conjugated()), c.r = a.r / d.r, c.i = a.i / d.r, c; |
||||
|
}, |
||||
|
conjugated:function() { |
||||
|
return new b.C(this.r, -this.i); |
||||
|
}, |
||||
|
distance:function() { |
||||
|
return Math.sqrt(this.r * this.r + this.i * this.i); |
||||
|
} |
||||
|
}, b; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("dotted", function(a) { |
||||
|
return { |
||||
|
process:function(b, c) { |
||||
|
var d, e, f, g, h, i, j, k, l, m, n, o, p, q; |
||||
|
for (d = parseInt(c[0]) || 1, e = parseInt(c[1]) || 1, f = b.data, g = b.width, |
||||
|
h = b.height, i = 2 * d + 1, j = [], k = e * e, e = -d; d > e; e++) for (l = -d; d > l; l++) e * e + l * l > k && j.push([ e, l ]); |
||||
|
for (d = a.lib.dorsyMath.xyToIFun(g), e = 0, g = parseInt(g / i); g > e; e++) for (l = 0, |
||||
|
k = parseInt(h / i); k > l; l++) for (m = parseInt((e + .5) * i), n = parseInt((l + .5) * i), |
||||
|
o = 0; o < j.length; o++) p = m + j[o][0], q = n + j[o][1], f[d(p, q, 3)] = 225, |
||||
|
f[d(p, q, 2)] = 225, f[d(p, q, 0)] = 225, f[d(p, q, 1)] = 225; |
||||
|
return b; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("easy", function() { |
||||
|
return { |
||||
|
getFun:function(b) { |
||||
|
return { |
||||
|
softenFace:function() { |
||||
|
return this.clone().add(this.act("高斯模糊", 10), "滤色").act("亮度", -10, 5); |
||||
|
}, |
||||
|
sketch:function() { |
||||
|
var a = this.act("灰度处理").clone(); |
||||
|
return this.add(a.act("反色").act("高斯模糊", 8), "颜色减淡").act("锐化", 1); |
||||
|
}, |
||||
|
softEnhancement:function() { |
||||
|
return this.act("曲线", [ 0, 190, 255 ], [ 0, 229, 255 ]); |
||||
|
}, |
||||
|
purpleStyle:function() { |
||||
|
var a = this.clone(); |
||||
|
return this.add(a.act("高斯模糊", 3), "正片叠底", "RG"); |
||||
|
}, |
||||
|
soften:function() { |
||||
|
var a = this.clone(); |
||||
|
return this.add(a.act("高斯模糊", 6), "变暗"); |
||||
|
}, |
||||
|
vintage:function() { |
||||
|
return this.clone(), this.act("灰度处理").add(ShearPhoto[a](this.canvas.width, this.canvas.height, "#808080").act("添加杂色").act("高斯模糊", 4).act("色相/饱和度调节", 32, 19, 0, !0), "叠加"); |
||||
|
}, |
||||
|
gray:function() { |
||||
|
return this.act("灰度处理"); |
||||
|
}, |
||||
|
lomo:function() { |
||||
|
return this.clone().add(this.clone(), "滤色").add(this.clone(), "柔光").add(this.clone().act("反色"), "正常", "20%", "B").act("暗角", 6, 200); |
||||
|
}, |
||||
|
strongEnhancement:function() { |
||||
|
return this.clone().add(this.clone().act("曲线", [ 0, 50, 255 ], [ 0, 234, 255 ]), "柔光"); |
||||
|
}, |
||||
|
strongGray:function() { |
||||
|
return this.act("灰度处理").act("曲线", [ 0, 61, 69, 212, 255 ], [ 0, 111, 176, 237, 255 ]); |
||||
|
}, |
||||
|
lightGray:function() { |
||||
|
return this.act("灰度处理").act("曲线", [ 0, 60, 142, 194, 255 ], [ 0, 194, 240, 247, 255 ]); |
||||
|
}, |
||||
|
warmAutumn:function() { |
||||
|
var a = this.clone().act("色相/饱和度调节", 36, 47, 8, !0).act("暗角", 6, 150); |
||||
|
return this.add(a, "叠加"); |
||||
|
}, |
||||
|
carveStyle:function() { |
||||
|
var a = this.clone().act("马赛克").act("查找边缘").act("浮雕效果"); |
||||
|
return this.add(a, "线性光"); |
||||
|
}, |
||||
|
rough:function() { |
||||
|
return this.add(ShearPhoto[a](this.canvas.width, this.canvas.height, "#000").act("喷点").act("反色").act("浮雕效果"), "叠加"); |
||||
|
} |
||||
|
}[b]; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("embossment", function() { |
||||
|
return { |
||||
|
process:function(a) { |
||||
|
var b, c, d, e, f, g, h, i, j; |
||||
|
for (b = a.data, c = a.width, d = [], e = 0, f = b.length; f > e; e += 4) if (g = e / 4, |
||||
|
h = parseInt(g / c), i = g % c, g = 4 * ((h - 1) * c + (i - 1)), j = 4 * (h + 1) * c + 4 * (i + 1), |
||||
|
0 != h && 0 != i) { |
||||
|
for (h = 0; 3 > h; h++) d[e + h] = b[g + h] - b[j + h] + 127.5; |
||||
|
d[e + 4] = b[e + 4]; |
||||
|
} |
||||
|
for (e = 0, f = b.length; f > e; e++) b[e] = d[e] || b[e]; |
||||
|
return a; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("gaussBlur", function() { |
||||
|
return { |
||||
|
process:function(a, b, c) { |
||||
|
var d, e, f, g, h, i, j = a.data, k = a.width, l = a.height, m = [], n = 0; |
||||
|
for (b = Math.floor(b) || 3, c = c || b / 3, d = 1 / (Math.sqrt(2 * Math.PI) * c), |
||||
|
g = -1 / (2 * c * c), h = 0, c = -b; b >= c; c++, h++) f = d * Math.exp(g * c * c), |
||||
|
m[h] = f, n += f; |
||||
|
for (h = 0, c = m.length; c > h; h++) m[h] /= n; |
||||
|
for (d = 0; l > d; d++) for (c = 0; k > c; c++) { |
||||
|
for (n = e = f = g = 0, i = -b; b >= i; i++) h = c + i, h >= 0 && k > h && (h = 4 * (d * k + h), |
||||
|
e += j[h] * m[i + b], f += j[h + 1] * m[i + b], g += j[h + 2] * m[i + b], n += m[i + b]); |
||||
|
h = 4 * (d * k + c), j[h] = e / n, j[h + 1] = f / n, j[h + 2] = g / n; |
||||
|
} |
||||
|
for (c = 0; k > c; c++) for (d = 0; l > d; d++) { |
||||
|
for (n = e = f = g = 0, i = -b; b >= i; i++) h = d + i, h >= 0 && l > h && (h = 4 * (h * k + c), |
||||
|
e += j[h] * m[i + b], f += j[h + 1] * m[i + b], g += j[h + 2] * m[i + b], n += m[i + b]); |
||||
|
h = 4 * (d * k + c), j[h] = e / n, j[h + 1] = f / n, j[h + 2] = g / n; |
||||
|
} |
||||
|
return a.data = j, a; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("borderline", function(a) { |
||||
|
return { |
||||
|
process:function(b) { |
||||
|
return a.lib.dorsyMath.applyMatrix(b, [ 0, 1, 0, 1, -4, 1, 0, 1, 0 ], 250); |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("mosaic", function() { |
||||
|
return { |
||||
|
process:function(a, b) { |
||||
|
var c, d, e, f, g, h, i, j, k, l, m, n, o; |
||||
|
for (c = parseInt(b[0]) || 3, d = a.data, e = a.width, f = a.height, c = 2 * c + 1, |
||||
|
g = 0, h = parseInt(e / c); h > g; g++) for (i = 0, j = parseInt(f / c); j > i; i++) { |
||||
|
for (k = [], l = [ 0, 0, 0 ], m = 0; c > m; m++) for (n = 0; c > n; n++) o = (i * c + m) * e + g * c + n, |
||||
|
l[0] += d[4 * o], l[1] += d[4 * o + 1], l[2] += d[4 * o + 2]; |
||||
|
for (k[0] = l[0] / (c * c), k[1] = l[1] / (c * c), k[2] = l[2] / (c * c), m = 0; c > m; m++) for (n = 0; c > n; n++) o = (i * c + m) * e + g * c + n, |
||||
|
d[4 * o] = k[0], d[4 * o + 1] = k[1], d[4 * o + 2] = k[2]; |
||||
|
} |
||||
|
return a; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("noise", function() { |
||||
|
return { |
||||
|
process:function(a, b) { |
||||
|
var c, d, e, f, g, h, i, j, k; |
||||
|
for (c = parseInt(b[0]) || 100, d = a.data, e = a.width, f = a.height, g = 0; e > g; g++) for (h = 0; f > h; h++) for (i = h * e + g, |
||||
|
j = 0; 3 > j; j++) k = parseInt(2 * Math.random() * c) - c, d[4 * i + j] += k; |
||||
|
return a; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("oilPainting", function() { |
||||
|
return { |
||||
|
process:function(a, b) { |
||||
|
var c, d, e, f, g, h, i, j, k; |
||||
|
for (c = parseInt(b[0]) || 16, d = a.data, e = a.width, f = a.height, g = 0; e > g; g++) for (h = 0; f > h; h++) { |
||||
|
for (i = h * e + g, j = 0, k = 0; 3 > k; k++) j += d[4 * i + k]; |
||||
|
for (j /= 3, j = parseInt(j / c) * c, k = 0; 3 > k; k++) d[4 * i + k] = j; |
||||
|
} |
||||
|
return a; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("setHSI", function(a) { |
||||
|
return { |
||||
|
process:function(b, c) { |
||||
|
return c[0] = c[0] / 180 * Math.PI, c[1] = c[1] / 100 || 0, c[2] = 255 * (c[2] / 100) || 0, |
||||
|
c[3] = c[3] || !1, a.lib.dorsyMath.applyInHSI(b, function(a) { |
||||
|
c[3] ? (a.H = c[0], a.S = c[1]) :(a.H += c[0], a.S += c[1]), a.I += c[2]; |
||||
|
}), b; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("sharp", function() { |
||||
|
return { |
||||
|
process:function(a, b) { |
||||
|
var c, d, e, f, g, h, i, j, k; |
||||
|
for (c = b[0] || .6, d = a.data, e = a.width, f = 0, g = d.length; g > f; f += 4) if (h = f / 4, |
||||
|
i = parseInt(h / e), j = h % e, 0 != i && 0 != j) for (k = 4 * ((i - 1) * e + (j - 1)), |
||||
|
i = 4 * ((i - 1) * e + j), h = 4 * (h - 1), j = 0; 3 > j; j++) d[f + j] += (d[f + j] - (d[i + j] + d[h + j] + d[k + j]) / 3) * c; |
||||
|
return a; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("toGray", function() { |
||||
|
return { |
||||
|
process:function(a) { |
||||
|
var b, c, d, e; |
||||
|
for (b = a.data, c = 0, d = b.length; d > c; c += 4) e = parseInt((b[c] + b[c + 1] + b[c + 2]) / 3), |
||||
|
b[c + 2] = b[c + 1] = b[c] = e; |
||||
|
return a.data = b, a; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("toReverse", function() { |
||||
|
return { |
||||
|
process:function(a) { |
||||
|
for (var b = a.data, c = 0, d = b.length; d > c; c += 4) b[c] = 255 - b[c], b[c + 1] = 255 - b[c + 1], |
||||
|
b[c + 2] = 255 - b[c + 2]; |
||||
|
return a.data = b, a; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"), function(a) { |
||||
|
ShearPhoto[a].module("toThresh", function(a) { |
||||
|
return { |
||||
|
process:function(b, c) { |
||||
|
var d, e, f; |
||||
|
for (b = a.lib.toGray.process(b), d = b.data, c = c[0] || 128, e = 0, f = d.length; f > e; e++) (e + 1) % 4 && (d[e] = d[e] > c ? 255 :0); |
||||
|
return b.data = d, b; |
||||
|
} |
||||
|
}; |
||||
|
}); |
||||
|
}("psLib"); |
||||
|
}catch(e){} |
||||
@ -0,0 +1,183 @@ |
|||||
|
window.ShearPhoto.MINGGE(function() { |
||||
|
var relativeUrl= SHEAR.PATH_RES+"/shearphoto";//by rainfer,相对路径
|
||||
|
var avatarUrl= SHEAR.PATH_AVATAR;//by rainfer,头像路径
|
||||
|
relativeUrl = relativeUrl.replace(/(^\s*)|(\s*$)/g, "");//去掉相对路径的所有空格
|
||||
|
relativeUrl === "" || (relativeUrl += "/");//在相对地址后面加斜框,不需要用户自己加
|
||||
|
var publicRelat= document.getElementById("relat"); //"relat"对像
|
||||
|
var publicRelatImg=publicRelat.getElementsByTagName("img"); //"relat"下的两张图片对像
|
||||
|
var Shear = new ShearPhoto; |
||||
|
Shear.config({ |
||||
|
relativeUrl:relativeUrl, //取回相对路径
|
||||
|
avatarUrl:avatarUrl,//by rainfer,头像路径
|
||||
|
traverse:true,//可选 true,false 。 是否在拖动或拉伸时允许历遍全图(是否让大图动呢),
|
||||
|
translate3d:false, //是否开启3D移动,CPU加速。可选true false。默认关闭的
|
||||
|
HTML5:true,//可选 true,false 是否使用HTML5进行切图
|
||||
|
HTML5MAX:500, //默认请设0 (最大尺寸做事), HTML上传截图最大宽度, 宽度越大,HTML5截出来的图片容量越大,服务器压力就大,截图就更清淅
|
||||
|
HTML5Quality:0.9, //截好的截图 0至1范围可选(可填小数) HTML5切图的质量 为1时 最高
|
||||
|
HTML5FilesSize:50, //如果是HTML5切图时,选择的图片不能超过多少,单位M
|
||||
|
HTML5Effects:true,//是否开启图片特效功能给用户 可选true false, 提示:有HTML5浏览器才会开启的!当然开启HTML5切图,该设置才有效
|
||||
|
HTML5ZIP:[900,0.9],//HTML5截图前载入的大图 是否压缩图片(数组成员 是数字)
|
||||
|
preview:[150],// 开启动态预览图片 (数组成员整数型,禁止含小数点 可选false 和数组)
|
||||
|
url:relativeUrl+"php/shearphoto.php", //后端处理地址
|
||||
|
scopeWidth:400, //可拖动范围宽 也就是"main"对象的初始大小(整数型,禁止含小数点) 宽和高的值最好能一致
|
||||
|
scopeHeight:400, //可拖动范围高 也就是"main"对象的初始大小(整数型,禁止含小数点) 宽和高的值最好能一致
|
||||
|
proportional:[1/1,100,133], |
||||
|
Min:50, //截框拉伸或拖拽不能少于多少PX(整数型,禁止含小数点)
|
||||
|
Max:500, //一开始启动时,图片的宽和高,有时候图片会很大的,必须要设置一下(整数型,禁止含小数点)
|
||||
|
backgroundColor:"#000", //遮层色
|
||||
|
backgroundOpacity:0.6, //遮层透明度-数字0-1 可选
|
||||
|
Border:0, //截框的边框大小 0代表动态边框。大于0表示静态边框,大于0时也代表静态边框的粗细值
|
||||
|
BorderStyle:"solid", //只作用于静态边框,截框的边框类型,其实是引入CSS的border属性,和CSS2的border属性是一样的
|
||||
|
BorderColor:"#09F", //只作用于静态边框,截框的边框色彩
|
||||
|
relat:publicRelat, //请查看 id:"relat"对象
|
||||
|
scope:document.getElementById("main"),//main范围对象
|
||||
|
ImgDom:publicRelatImg[0], //截图图片对象(小)
|
||||
|
ImgMain:publicRelatImg[1], //截图图片对象(大)
|
||||
|
black:document.getElementById("black"),//黑色遮层对象
|
||||
|
form:document.getElementById("smallbox"),//截框对象
|
||||
|
ZoomDist:document.getElementById("ZoomDist"),//放大工具条,可从HTML查看此对象,不作详细解释了
|
||||
|
ZoomBar:document.getElementById("ZoomBar"), //放大工具条,可从HTML查看此对象
|
||||
|
to:{ |
||||
|
BottomRight:document.getElementById("BottomRight"),//拉伸点中右
|
||||
|
TopRight:document.getElementById("TopRight"),//拉伸点上右,下面如此类推,一共8点进行拉伸,下面不再作解释
|
||||
|
Bottomleft:document.getElementById("Bottomleft"), |
||||
|
Topleft:document.getElementById("Topleft"), |
||||
|
Topmiddle:document.getElementById("Topmiddle"), |
||||
|
leftmiddle:document.getElementById("leftmiddle"), |
||||
|
Rightmiddle:document.getElementById("Rightmiddle"), |
||||
|
Bottommiddle:document.getElementById("Bottommiddle") |
||||
|
}, |
||||
|
Effects:document.getElementById("shearphoto_Effects") || false, |
||||
|
DynamicBorder:[document.getElementById("borderTop"),document.getElementById("borderLeft"),document.getElementById("borderRight"),document.getElementById("borderBottom")], |
||||
|
SelectBox:document.getElementById("SelectBox"), //选择图片方式的对象
|
||||
|
Shearbar:document.getElementById("Shearbar"), //截图工具条对象
|
||||
|
UpFun:function() { //鼠标健松开时执行函数
|
||||
|
Shear.MoveDiv.DivWHFun(); //把截框现时的宽高告诉JS
|
||||
|
} |
||||
|
}); |
||||
|
Shear.complete=function(serverdata) {//截图成功完成时,由shearphoto.php返回数据过来的成功包
|
||||
|
//alert(SHEAR.URL);//你可以调试一下这个返回包
|
||||
|
var point = this.arg.scope.childNodes[0]; |
||||
|
point.className === "point" && this.arg.scope.removeChild(point); |
||||
|
var complete = document.createElement("div"); |
||||
|
complete.className = "complete"; |
||||
|
complete.style.height = this.arg.scopeHeight + "px"; |
||||
|
this.arg.scope.insertBefore(complete, this.arg.scope.childNodes[0]); |
||||
|
var length = serverdata.length,creatImg; |
||||
|
for (var i = 0; i < length; i++) |
||||
|
{ |
||||
|
creatImg = document.createElement("img"); |
||||
|
complete.appendChild(creatImg); |
||||
|
creatImg.src=this.arg.avatarUrl +"/"+ serverdata[i]["ImgUrl"]; |
||||
|
} |
||||
|
this.HTML5.EffectsReturn(); |
||||
|
this.HTML5.BOLBID && this.HTML5.URL.revokeObjectURL(this.HTML5.BOLBID); |
||||
|
var this_ = this; |
||||
|
this_.preview.close_(); |
||||
|
////by rainfer,增加ajax开始
|
||||
|
$.post(SHEAR.URL, |
||||
|
{'imgurl':serverdata[0]['ImgUrl']}, |
||||
|
function(data){ |
||||
|
if(data.code==1){ |
||||
|
layer.alert(data.msg, {icon: 6}, function(index){ |
||||
|
layer.close(index); |
||||
|
window.location.href=data.url; |
||||
|
}); |
||||
|
}else{ |
||||
|
layer.alert(data.msg, {icon: 5}, function(index){ |
||||
|
layer.close(index); |
||||
|
}); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
var photoalbum = document.getElementById("photoalbum");//相册对象
|
||||
|
var ShearPhotoForm = document.getElementById("ShearPhotoForm");//FORM对象
|
||||
|
ShearPhotoForm.UpFile.onclick=function(){return false}//一开始时先不让用户点免得事件阻塞
|
||||
|
var up = new ShearPhoto.frameUpImg({ |
||||
|
url:relativeUrl+"php/upload.php", //HTML5切图时,不会用到该文件,后端处理地址
|
||||
|
FORM:ShearPhotoForm, //FORM对象传到设置
|
||||
|
UpType:new Array("jpg", "jpeg", "png", "gif"),//图片类限制,上传的一定是图片,你就不要更改了
|
||||
|
FilesSize:2, //选择的图片不能超过 单位M(注意:是非HTML5时哦)
|
||||
|
HTML5:Shear.HTML5, |
||||
|
HTML5FilesSize:Shear.arg.HTML5FilesSize, |
||||
|
HTML5ZIP:Shear.arg.HTML5ZIP, |
||||
|
erro:function(msg) { |
||||
|
Shear.pointhandle(3e3, 10, msg, 0, "#f82373", "#fff"); |
||||
|
}, |
||||
|
fileClick:function(){//先择图片被点击时,触发的事件
|
||||
|
Shear.pointhandle(-1);//关闭提示,防止线程阻塞事件冒泡
|
||||
|
}, |
||||
|
preced:function(fun) { //点击选择图,载入图片时的事件
|
||||
|
try{ |
||||
|
photoalbum.style.display = "none"; //什么情况下都关了相册
|
||||
|
camClose.onclick(); //什么情况下都关了视频
|
||||
|
}catch (e){console.log("在加载图片时,发现相册的对象检测不到,错误代码:"+e);} |
||||
|
Shear.pointhandle(0, 10, "正在为你加载图片,请你稍等哦......", 2, "#307ff6", "#fff",fun); |
||||
|
} |
||||
|
}); |
||||
|
|
||||
|
up.run(function(data,True) {//upload.php成功返回数据后
|
||||
|
True || (data = ShearPhoto.JsonString.StringToJson(data)); |
||||
|
if (data === false) { |
||||
|
Shear.SendUserMsg("错误:请保证后端环境运行正常", 5e3, 0, "#f4102b", "#fff", true,true); |
||||
|
return; |
||||
|
} |
||||
|
if (data["erro"]) { |
||||
|
Shear.SendUserMsg("错误:" + data["erro"], 5e3, 0, "#f4102b", "#fff", true,true); |
||||
|
return; |
||||
|
} |
||||
|
Shear.run(data["success"],true); |
||||
|
}); |
||||
|
|
||||
|
try{ |
||||
|
var AllType= {".jpg":"image/jpeg", ".jpeg":"image/jpeg", ".gif":"image/jpeg", ".png":"image/png"}; |
||||
|
var URLType =function(url){ |
||||
|
return AllType[/\.[^.]+$/.exec(url)] || "image/jpeg";//取后缀
|
||||
|
} |
||||
|
var DE = document.documentElement; |
||||
|
var PhotoLoading = document.getElementById("PhotoLoading"); |
||||
|
var photoalbumLi = photoalbum.getElementsByTagName("li"); |
||||
|
var photoalbumLifun = function() { |
||||
|
var serveUrl= this.getElementsByTagName("img")[0].getAttribute("serveUrl"); |
||||
|
Shear.HTML5.ImagesType=URLType(serveUrl);//告诉HTML5,图片的类型
|
||||
|
Shear.run(serveUrl); //通过API 接口,加载图片
|
||||
|
photoalbum.style.display = "none"; |
||||
|
}; |
||||
|
|
||||
|
for (var i = 0; i < photoalbumLi.length; i++) photoalbumLi[i].onclick = photoalbumLifun;//为相册的每张照加入一个点击事件
|
||||
|
PhotoLoading.onclick = function() { //从相册选取事件
|
||||
|
photoalbum.style.display = "block"; |
||||
|
|
||||
|
|
||||
|
}; |
||||
|
document.getElementById("close").onclick = function() { //关闭相册事件
|
||||
|
photoalbum.style.display = "none"; |
||||
|
}; |
||||
|
}catch (e){console.log("相册对象检测有误,错误代码:"+e );} |
||||
|
|
||||
|
Shear.addEvent(document.getElementById("saveShear"), "click", function() { //按下截图事件,提交到后端的shearphoto.php接收
|
||||
|
Shear.SendPHP({shearphoto:"",mingge:""});//我们示例截图并且传参数,后端文件shearphoto.php用 示例:$_POST["shearphoto"] 接收参数,不需要传参数请清空Shear.SendPHP里面的参数示例 Shear.SendPHP();
|
||||
|
|
||||
|
}); |
||||
|
|
||||
|
Shear.addEvent(document.getElementById("LeftRotate"), "click", function() {//向左旋转事件
|
||||
|
Shear.Rotate("left"); |
||||
|
}); |
||||
|
|
||||
|
Shear.addEvent(document.getElementById("RightRotate"), "click", function() { //向右旋转事件
|
||||
|
Shear.Rotate("right"); |
||||
|
}); |
||||
|
|
||||
|
Shear.addEvent(document.getElementById("againIMG"), "click", function() { //重新选择事件
|
||||
|
Shear.preview.close_(); |
||||
|
Shear.again(); |
||||
|
Shear.HTML5.EffectsReturn(); |
||||
|
Shear.HTML5.BOLBID && Shear.HTML5.URL.revokeObjectURL(Shear.HTML5.BOLBID); |
||||
|
Shear.pointhandle(3e3, 10, "已取消!重新选择", 2, "#fbeb61", "#3a414c"); |
||||
|
}); |
||||
|
var shearphoto_loading=document.getElementById("shearphoto_loading"); |
||||
|
var shearphoto_main=document.getElementById("shearphoto_main"); |
||||
|
shearphoto_loading && shearphoto_loading.parentNode.removeChild(shearphoto_loading); |
||||
|
shearphoto_main.style.visibility="visible"; |
||||
|
}); |
||||
@ -0,0 +1,185 @@ |
|||||
|
window.ShearPhoto.MINGGE(function() { |
||||
|
var relativeUrl= SHEAR.PATH_RES+"/shearphoto";//by rainfer,相对路径
|
||||
|
var avatarUrl= SHEAR.PATH_AVATAR;//by rainfer,头像路径
|
||||
|
relativeUrl = relativeUrl.replace(/(^\s*)|(\s*$)/g, "");//去掉相对路径的所有空格
|
||||
|
relativeUrl === "" || (relativeUrl += "/");//在相对地址后面加斜框,不需要用户自己加
|
||||
|
var publicRelat= document.getElementById("relat"); //"relat"对像
|
||||
|
var publicRelatImg=publicRelat.getElementsByTagName("img"); //"relat"下的两张图片对像
|
||||
|
var Shear = new ShearPhoto; |
||||
|
Shear.config({ |
||||
|
relativeUrl:relativeUrl, //取回相对路径
|
||||
|
avatarUrl:avatarUrl,//by rainfer,头像路径
|
||||
|
traverse:true,//可选 true,false 。 是否在拖动或拉伸时允许历遍全图(是否让大图动呢),
|
||||
|
translate3d:false, //是否开启3D移动,CPU加速。可选true false。默认关闭的
|
||||
|
HTML5:true,//可选 true,false 是否使用HTML5进行切图
|
||||
|
HTML5MAX:500, //默认请设0 (最大尺寸做事), HTML上传截图最大宽度, 宽度越大,HTML5截出来的图片容量越大,服务器压力就大,截图就更清淅
|
||||
|
HTML5Quality:0.9, //截好的截图 0至1范围可选(可填小数) HTML5切图的质量 为1时 最高
|
||||
|
HTML5FilesSize:50, //如果是HTML5切图时,选择的图片不能超过多少,单位M
|
||||
|
HTML5Effects:true,//是否开启图片特效功能给用户 可选true false, 提示:有HTML5浏览器才会开启的!当然开启HTML5切图,该设置才有效
|
||||
|
HTML5ZIP:[900,0.9],//HTML5截图前载入的大图 是否压缩图片(数组成员 是数字)
|
||||
|
preview:[100],// 开启动态预览图片 (数组成员整数型,禁止含小数点 可选false 和数组)
|
||||
|
url:relativeUrl+"php/shearphoto.php", //后端处理地址
|
||||
|
scopeWidth:300, //可拖动范围宽 也就是"main"对象的初始大小(整数型,禁止含小数点) 宽和高的值最好能一致
|
||||
|
scopeHeight:300, //可拖动范围高 也就是"main"对象的初始大小(整数型,禁止含小数点) 宽和高的值最好能一致
|
||||
|
proportional:[1/1,100,133], |
||||
|
Min:50, //截框拉伸或拖拽不能少于多少PX(整数型,禁止含小数点)
|
||||
|
Max:300, //一开始启动时,图片的宽和高,有时候图片会很大的,必须要设置一下(整数型,禁止含小数点)
|
||||
|
backgroundColor:"#000", //遮层色
|
||||
|
backgroundOpacity:0.6, //遮层透明度-数字0-1 可选
|
||||
|
Border:0, //截框的边框大小 0代表动态边框。大于0表示静态边框,大于0时也代表静态边框的粗细值
|
||||
|
BorderStyle:"solid", //只作用于静态边框,截框的边框类型,其实是引入CSS的border属性,和CSS2的border属性是一样的
|
||||
|
BorderColor:"#09F", //只作用于静态边框,截框的边框色彩
|
||||
|
relat:publicRelat, //请查看 id:"relat"对象
|
||||
|
scope:document.getElementById("main"),//main范围对象
|
||||
|
ImgDom:publicRelatImg[0], //截图图片对象(小)
|
||||
|
ImgMain:publicRelatImg[1], //截图图片对象(大)
|
||||
|
black:document.getElementById("black"),//黑色遮层对象
|
||||
|
form:document.getElementById("smallbox"),//截框对象
|
||||
|
ZoomDist:document.getElementById("ZoomDist"),//放大工具条,可从HTML查看此对象,不作详细解释了
|
||||
|
ZoomBar:document.getElementById("ZoomBar"), //放大工具条,可从HTML查看此对象
|
||||
|
to:{ |
||||
|
BottomRight:document.getElementById("BottomRight"),//拉伸点中右
|
||||
|
TopRight:document.getElementById("TopRight"),//拉伸点上右,下面如此类推,一共8点进行拉伸,下面不再作解释
|
||||
|
Bottomleft:document.getElementById("Bottomleft"), |
||||
|
Topleft:document.getElementById("Topleft"), |
||||
|
Topmiddle:document.getElementById("Topmiddle"), |
||||
|
leftmiddle:document.getElementById("leftmiddle"), |
||||
|
Rightmiddle:document.getElementById("Rightmiddle"), |
||||
|
Bottommiddle:document.getElementById("Bottommiddle") |
||||
|
}, |
||||
|
Effects:document.getElementById("shearphoto_Effects") || false, |
||||
|
DynamicBorder:[document.getElementById("borderTop"),document.getElementById("borderLeft"),document.getElementById("borderRight"),document.getElementById("borderBottom")], |
||||
|
SelectBox:document.getElementById("SelectBox"), //选择图片方式的对象
|
||||
|
Shearbar:document.getElementById("Shearbar"), //截图工具条对象
|
||||
|
UpFun:function() { //鼠标健松开时执行函数
|
||||
|
Shear.MoveDiv.DivWHFun(); //把截框现时的宽高告诉JS
|
||||
|
} |
||||
|
}); |
||||
|
Shear.complete=function(serverdata) {//截图成功完成时,由shearphoto.php返回数据过来的成功包
|
||||
|
//alert(SHEAR.URL);//你可以调试一下这个返回包
|
||||
|
var point = this.arg.scope.childNodes[0]; |
||||
|
point.className === "point" && this.arg.scope.removeChild(point); |
||||
|
var complete = document.createElement("div"); |
||||
|
complete.className = "complete"; |
||||
|
complete.style.height = this.arg.scopeHeight + "px"; |
||||
|
this.arg.scope.insertBefore(complete, this.arg.scope.childNodes[0]); |
||||
|
var length = serverdata.length,creatImg; |
||||
|
for (var i = 0; i < length; i++) |
||||
|
{ |
||||
|
creatImg = document.createElement("img"); |
||||
|
complete.appendChild(creatImg); |
||||
|
creatImg.src=this.arg.avatarUrl +"/"+ serverdata[i]["ImgUrl"]; |
||||
|
} |
||||
|
this.HTML5.EffectsReturn(); |
||||
|
this.HTML5.BOLBID && this.HTML5.URL.revokeObjectURL(this.HTML5.BOLBID); |
||||
|
var this_ = this; |
||||
|
this_.preview.close_(); |
||||
|
////by rainfer,增加ajax开始
|
||||
|
$.post(SHEAR.URL, |
||||
|
{'imgurl':serverdata[0]['ImgUrl']}, |
||||
|
function(data){ |
||||
|
if(data.code==1){ |
||||
|
layer.alert(data.msg, {icon: 6}, function(index){ |
||||
|
layer.close(index); |
||||
|
window.location.href=data.url; |
||||
|
}); |
||||
|
}else{ |
||||
|
layer.alert(data.msg, {icon: 5}, function(index){ |
||||
|
layer.close(index); |
||||
|
}); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
var photoalbum = document.getElementById("photoalbum");//相册对象
|
||||
|
var ShearPhotoForm = document.getElementById("ShearPhotoForm");//FORM对象
|
||||
|
ShearPhotoForm.UpFile.onclick=function(){return false}//一开始时先不让用户点免得事件阻塞
|
||||
|
var up = new ShearPhoto.frameUpImg({ |
||||
|
url:relativeUrl+"php/upload.php", //HTML5切图时,不会用到该文件,后端处理地址
|
||||
|
FORM:ShearPhotoForm, //FORM对象传到设置
|
||||
|
UpType:new Array("jpg", "jpeg", "png", "gif"),//图片类限制,上传的一定是图片,你就不要更改了
|
||||
|
FilesSize:2, //选择的图片不能超过 单位M(注意:是非HTML5时哦)
|
||||
|
HTML5:Shear.HTML5, |
||||
|
HTML5FilesSize:Shear.arg.HTML5FilesSize, |
||||
|
HTML5ZIP:Shear.arg.HTML5ZIP, |
||||
|
erro:function(msg) { |
||||
|
Shear.pointhandle(3e3, 10, msg, 0, "#f82373", "#fff"); |
||||
|
}, |
||||
|
fileClick:function(){//先择图片被点击时,触发的事件
|
||||
|
Shear.pointhandle(-1);//关闭提示,防止线程阻塞事件冒泡
|
||||
|
}, |
||||
|
preced:function(fun) { //点击选择图,载入图片时的事件
|
||||
|
try{ |
||||
|
photoalbum.style.display = "none"; //什么情况下都关了相册
|
||||
|
camClose.onclick(); //什么情况下都关了视频
|
||||
|
}catch (e){console.log("在加载图片时,发现相册的对象检测不到,错误代码:"+e);} |
||||
|
Shear.pointhandle(0, 10, "正在为你加载图片,请你稍等哦......", 2, "#307ff6", "#fff",fun); |
||||
|
} |
||||
|
}); |
||||
|
|
||||
|
up.run(function(data,True) {//upload.php成功返回数据后
|
||||
|
True || (data = ShearPhoto.JsonString.StringToJson(data)); |
||||
|
if (data === false) { |
||||
|
Shear.SendUserMsg("错误:请保证后端环境运行正常", 5e3, 0, "#f4102b", "#fff", true,true); |
||||
|
return; |
||||
|
} |
||||
|
if (data["erro"]) { |
||||
|
Shear.SendUserMsg("错误:" + data["erro"], 5e3, 0, "#f4102b", "#fff", true,true); |
||||
|
return; |
||||
|
} |
||||
|
Shear.run(data["success"],true); |
||||
|
}); |
||||
|
|
||||
|
try{ |
||||
|
var AllType= {".jpg":"image/jpeg", ".jpeg":"image/jpeg", ".gif":"image/jpeg", ".png":"image/png"}; |
||||
|
var URLType =function(url){ |
||||
|
return AllType[/\.[^.]+$/.exec(url)] || "image/jpeg";//取后缀
|
||||
|
} |
||||
|
var DE = document.documentElement; |
||||
|
var PhotoLoading = document.getElementById("PhotoLoading"); |
||||
|
var photoalbumLi = photoalbum.getElementsByTagName("li"); |
||||
|
var photoalbumLifun = function() { |
||||
|
var serveUrl= this.getElementsByTagName("img")[0].getAttribute("serveUrl"); |
||||
|
Shear.HTML5.ImagesType=URLType(serveUrl);//告诉HTML5,图片的类型
|
||||
|
Shear.run(serveUrl); //通过API 接口,加载图片
|
||||
|
photoalbum.style.display = "none"; |
||||
|
}; |
||||
|
|
||||
|
for (var i = 0; i < photoalbumLi.length; i++) photoalbumLi[i].onclick = photoalbumLifun;//为相册的每张照加入一个点击事件
|
||||
|
PhotoLoading.onclick = function() { //从相册选取事件
|
||||
|
photoalbum.style.display = "block"; |
||||
|
|
||||
|
|
||||
|
}; |
||||
|
document.getElementById("close").onclick = function() { //关闭相册事件
|
||||
|
photoalbum.style.display = "none"; |
||||
|
}; |
||||
|
}catch (e){console.log("相册对象检测有误,错误代码:"+e );} |
||||
|
|
||||
|
Shear.addEvent(document.getElementById("saveShear"), "click", function() { //按下截图事件,提交到后端的shearphoto.php接收
|
||||
|
Shear.SendPHP({shearphoto:"",mingge:""});//我们示例截图并且传参数,后端文件shearphoto.php用 示例:$_POST["shearphoto"] 接收参数,不需要传参数请清空Shear.SendPHP里面的参数示例 Shear.SendPHP();
|
||||
|
|
||||
|
}); |
||||
|
|
||||
|
Shear.addEvent(document.getElementById("LeftRotate"), "click", function() {//向左旋转事件
|
||||
|
Shear.Rotate("left"); |
||||
|
}); |
||||
|
|
||||
|
Shear.addEvent(document.getElementById("RightRotate"), "click", function() { //向右旋转事件
|
||||
|
Shear.Rotate("right"); |
||||
|
}); |
||||
|
|
||||
|
Shear.addEvent(document.getElementById("againIMG"), "click", function() { //重新选择事件
|
||||
|
Shear.preview.close_(); |
||||
|
Shear.again(); |
||||
|
Shear.HTML5.EffectsReturn(); |
||||
|
Shear.HTML5.BOLBID && Shear.HTML5.URL.revokeObjectURL(Shear.HTML5.BOLBID); |
||||
|
Shear.pointhandle(3e3, 10, "已取消!重新选择", 2, "#fbeb61", "#3a414c"); |
||||
|
}); |
||||
|
|
||||
|
|
||||
|
var shearphoto_loading=document.getElementById("shearphoto_loading"); |
||||
|
var shearphoto_main=document.getElementById("shearphoto_main"); |
||||
|
shearphoto_loading && shearphoto_loading.parentNode.removeChild(shearphoto_loading); |
||||
|
shearphoto_main.style.visibility="visible"; |
||||
|
}); |
||||
@ -0,0 +1,21 @@ |
|||||
|
<?php |
||||
|
define('IOURL', dirname(dirname(__FILE__))); //锁定相对目录 |
||||
|
define('ROOT', dirname(dirname(IOURL)) . DIRECTORY_SEPARATOR);//网站根目录,//DIRECTORY_SEPARATOR 是斜杠符,为兼容WINDOW和LINUX,设置头像保存路径 |
||||
|
define('ShearURL', ROOT . 'data'. DIRECTORY_SEPARATOR . 'upload' . DIRECTORY_SEPARATOR . 'avatar' . DIRECTORY_SEPARATOR); |
||||
|
$ShearPhoto["config"] = array( |
||||
|
"proportional" => 1 / 1,//比例截图 |
||||
|
"quality" => 85,// 截图质量,0为一般质量(质量大概75左右), 0-100可选 |
||||
|
"force_jpg" => true,// 是否强制截好的图片是JPG格式 可选 true false |
||||
|
"width" => array(//自定义设置生成截图的张数,大小,在这设,看好下面! |
||||
|
//array(0,true,"name0"),//此时的0 代表以用户取当时截取框的所截的大小为宽 |
||||
|
//array(-1,true,"name1"),//此时的-1 代表以原图为基准,获得截图 |
||||
|
array(200, true, ""),//@参数1要生成的宽 (高度不用设,系统会按比例做事), @参数2:是否为该图加水印,water参数要有水印地址才有效true或false @参数3:图片后面添加字符串 |
||||
|
), |
||||
|
"water" => false,//只接受PNG水印,当然你对PHP熟练,你可以对主程序进行修改支持其他类型水印,不设就"water"=>false |
||||
|
"water_scope" => 100, //图片少于多少不添加水印!没填水印地址,这里不起任何作用 |
||||
|
"temp" => ShearURL . "temp", //等待截图的大图文件。就是上传图片的临时目录 |
||||
|
"tempSaveTime" => 600,//临时图片(也就是temp内的图片)保存时间,需要永久保存请设为0。单位秒 |
||||
|
"saveURL" => ShearURL,//截好后的图片。储存的目录位置,后面不要加斜杠 |
||||
|
"filename" => uniqid("")//截好后的图片的文件名字定义!要生成多个文件时 系统会自动在后面补上 |
||||
|
); |
||||
|
?> |
||||
@ -0,0 +1,264 @@ |
|||||
|
<?php |
||||
|
header('Content-type:text/html;charset=utf-8'); //编码 |
||||
|
error_reporting(E_ALL & ~E_NOTICE & ~E_WARNING); //关闭错误提示 |
||||
|
require("shearphoto.config.php"); //加载设置文件 |
||||
|
class ShearPhoto |
||||
|
{ |
||||
|
public $erro = false; |
||||
|
|
||||
|
protected function rotate($src, $R) |
||||
|
{ |
||||
|
$arr = array(90, 180, 270); |
||||
|
if (in_array($R, $arr)) { |
||||
|
$rotatesrc = imagerotate($src, $R, 0); |
||||
|
imagedestroy($src); |
||||
|
} else { |
||||
|
return $src; |
||||
|
} |
||||
|
return $rotatesrc; |
||||
|
} |
||||
|
|
||||
|
public function html5_run(&$PHPconfig, &$JSconfig) |
||||
|
{ |
||||
|
$ShearPhoto["config"] = $PHPconfig; |
||||
|
if (is_bool($PHPconfig["proportional"])) { |
||||
|
$PHPconfig["proportional"] = $JSconfig["P"]; |
||||
|
} elseif ($PHPconfig["proportional"] != $JSconfig["P"]) { |
||||
|
$this->erro = "JS设置的比例和PHP设置不一致!"; |
||||
|
return false; |
||||
|
} |
||||
|
require("shearphoto.up.php"); |
||||
|
$tempurl = $PHPconfig["temp"] . DIRECTORY_SEPARATOR . "shearphoto.lock"; |
||||
|
!file_exists($tempurl) && file_put_contents($tempurl, "ShearPhoto Please don't delete"); |
||||
|
$this->delTempImg($PHPconfig["temp"], $PHPconfig["tempSaveTime"]); |
||||
|
$imagecreatefrom = $this->imagecreatefrom($_FILES['UpFile']['tmp_name'], $int_type[2]); |
||||
|
if (!$imagecreatefrom) return false; |
||||
|
list($src, $GdFun) = $imagecreatefrom; |
||||
|
return $this->compression($src, $PHPconfig, $JSconfig, $int_type[2], $GdFun); |
||||
|
} |
||||
|
|
||||
|
protected function delTempImg($temp, $deltime) |
||||
|
{ |
||||
|
if ($deltime == 0) return; |
||||
|
$dir = opendir($temp); |
||||
|
$time = time(); |
||||
|
while (($file = readdir($dir)) !== false) { |
||||
|
if ($file != "." and $file != ".." and $file != "shearphoto.lock") { |
||||
|
$fileUrl = $temp . DIRECTORY_SEPARATOR . $file; |
||||
|
$pastTime = $time - filemtime($fileUrl); |
||||
|
if ($pastTime < 0 || $pastTime > $deltime) @unlink($fileUrl); |
||||
|
} |
||||
|
} |
||||
|
closedir($dir); |
||||
|
} |
||||
|
|
||||
|
public function run(&$JSconfig, &$PHPconfig) |
||||
|
{ |
||||
|
$tempurl = $PHPconfig["temp"] . DIRECTORY_SEPARATOR . "shearphoto.lock"; |
||||
|
!file_exists($tempurl) && file_put_contents($tempurl, "ShearPhoto Please don't delete"); |
||||
|
$this->delTempImg($PHPconfig["temp"], $PHPconfig["tempSaveTime"]); |
||||
|
//var_dump($JSconfig["url"]); |
||||
|
if (!isset($JSconfig["url"]) || !isset($JSconfig["R"]) || !isset($JSconfig["X"]) || !isset($JSconfig["Y"]) || !isset($JSconfig["IW"]) || !isset($JSconfig["IH"]) || !isset($JSconfig["P"]) || !isset($JSconfig["FW"]) || !isset($JSconfig["FH"])) { |
||||
|
$this->erro = "服务端接收到的数据缺少参数"; |
||||
|
return false; |
||||
|
} |
||||
|
//var_dump($JSconfig["url"]); |
||||
|
if (!file_exists($JSconfig["url"])) { |
||||
|
$this->erro = "此图片路径有误"; |
||||
|
return false; |
||||
|
} |
||||
|
foreach ($JSconfig as $k => $v) { |
||||
|
if ($k !== "url") { //验证是否为数字除了url参数之外 |
||||
|
if (!is_numeric($v)) { |
||||
|
$this->erro = "传递的参数有误"; |
||||
|
return false; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
if (is_bool($PHPconfig["proportional"])) { |
||||
|
$PHPconfig["proportional"] = $JSconfig["P"]; |
||||
|
} elseif ($PHPconfig["proportional"] != $JSconfig["P"]) { |
||||
|
$this->erro = "JS设置的比例和PHP设置不一致!"; |
||||
|
return false; |
||||
|
} |
||||
|
list($w, $h, $type) = getimagesize($JSconfig["url"]); |
||||
|
$strtype = image_type_to_extension($type); |
||||
|
$type_array = array( |
||||
|
".jpeg", |
||||
|
".gif", |
||||
|
".png", |
||||
|
".jpg" |
||||
|
); |
||||
|
if (!in_array(strtolower($strtype), $type_array)) { |
||||
|
$this->erro = "无法读取图片"; |
||||
|
return false; |
||||
|
} |
||||
|
|
||||
|
if ($JSconfig["R"] == 90 || $JSconfig["R"] == 270) { |
||||
|
list($w, $h) = array( |
||||
|
$h, |
||||
|
$w |
||||
|
); |
||||
|
} |
||||
|
return $this->createshear($PHPconfig, $w, $h, $type, $JSconfig); |
||||
|
} |
||||
|
|
||||
|
protected function imagecreatefrom($url, $type) |
||||
|
{ |
||||
|
switch ($type) { |
||||
|
case 1: |
||||
|
$src = @imagecreatefromgif($url); |
||||
|
$GdFun = array( |
||||
|
"imagegif", |
||||
|
".gif" |
||||
|
); |
||||
|
break; |
||||
|
|
||||
|
case 2: |
||||
|
$src = @imagecreatefromjpeg($url); |
||||
|
$GdFun = array( |
||||
|
"imagejpeg", |
||||
|
".jpg" |
||||
|
); |
||||
|
break; |
||||
|
|
||||
|
case 3: |
||||
|
$src = @imagecreatefrompng($url); |
||||
|
$GdFun = array( |
||||
|
"imagepng", |
||||
|
".png" |
||||
|
); |
||||
|
break; |
||||
|
|
||||
|
default: |
||||
|
$this->erro = "不支持的类型"; |
||||
|
return false; |
||||
|
break; |
||||
|
} |
||||
|
return array($src, $GdFun); |
||||
|
} |
||||
|
|
||||
|
protected function createshear(&$PHPconfig, $w, $h, $type, &$JSconfig) |
||||
|
{ |
||||
|
$imagecreatefrom = $this->imagecreatefrom($JSconfig["url"], $type); |
||||
|
if (!$imagecreatefrom) return false; |
||||
|
list($src, $GdFun) = $imagecreatefrom; |
||||
|
$src = $this->rotate($src, $JSconfig["R"]); |
||||
|
$dest = imagecreatetruecolor($JSconfig["IW"], $JSconfig["IH"]); |
||||
|
$white = imagecolorallocate($dest, 255, 255, 255); |
||||
|
imagefill($dest, 0, 0, $white); |
||||
|
imagecopy($dest, $src, 0, 0, $JSconfig["X"], $JSconfig["Y"], $w, $h); |
||||
|
imagedestroy($src); |
||||
|
return $this->compression($dest, $PHPconfig, $JSconfig, $type, $GdFun); |
||||
|
} |
||||
|
|
||||
|
protected function CreateArray(&$PHPconfig, &$JSconfig) |
||||
|
{ |
||||
|
$arr = array(); |
||||
|
if ($PHPconfig["proportional"] > 0) { |
||||
|
$proportion = $PHPconfig["proportional"]; |
||||
|
} else { |
||||
|
$proportion = $JSconfig["IW"] / $JSconfig["IH"]; |
||||
|
} |
||||
|
$water_or = isset($PHPconfig["water"]) && $PHPconfig["water"] && file_exists($PHPconfig["water"]) && is_numeric($PHPconfig["water_scope"]); |
||||
|
if (!file_exists($PHPconfig["saveURL"])) { |
||||
|
if (!mkdir($PHPconfig["saveURL"], 0777, true)) { |
||||
|
$this->erro = "目录权限有问题"; |
||||
|
return false; |
||||
|
} |
||||
|
} |
||||
|
$file_url = $PHPconfig["saveURL"] . $PHPconfig["filename"]; |
||||
|
foreach ($PHPconfig["width"] as $k => $v) { |
||||
|
($v[0] == 0) ? ($v[0] = $JSconfig["FW"]) : ($v[0] == -1) and ($v[0] = $JSconfig["IW"]); |
||||
|
$height = $v[0] / $proportion; |
||||
|
$suffix = isset($v[2]) ? $v[2] : "0"; |
||||
|
$arr[$k] = array( |
||||
|
$v[0], |
||||
|
$height, |
||||
|
$file_url . $suffix, |
||||
|
($v[1] === true and $water_or === true and $v[0] > $PHPconfig["water_scope"] and $height > $PHPconfig["water_scope"]) |
||||
|
); |
||||
|
} |
||||
|
return array( |
||||
|
$water_or, |
||||
|
$arr |
||||
|
); |
||||
|
} |
||||
|
|
||||
|
protected function compression($DigShear, &$PHPconfig, &$JSconfig, $type, $GdFun) |
||||
|
{ |
||||
|
require 'zip_img.php'; |
||||
|
$arrimg = $this->CreateArray($PHPconfig, $JSconfig); |
||||
|
if (count($arrimg[1]) < 1) { |
||||
|
$this->erro = "系统没有检测到处理截图的命令!"; |
||||
|
return false; |
||||
|
} |
||||
|
$arrimg[0] and $arrimg[0] = $PHPconfig["water"]; |
||||
|
$zip_photo = new zip_img(array( |
||||
|
"dest" => $DigShear, |
||||
|
"GdFun" => $GdFun, |
||||
|
"quality" => isset($PHPconfig["quality"]) ? $PHPconfig["quality"] : false, |
||||
|
"force_jpg" => isset($PHPconfig["force_jpg"]) && $PHPconfig["force_jpg"], |
||||
|
"water" => $arrimg[0], |
||||
|
"water_scope" => $PHPconfig["water_scope"], |
||||
|
"w" => $JSconfig["IW"], |
||||
|
"h" => $JSconfig["IH"], |
||||
|
"type" => $type, |
||||
|
"zip_array" => $arrimg[1] |
||||
|
)); |
||||
|
return $zip_photo->run($this); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
/*........................普通截取时开始..........................*/ |
||||
|
|
||||
|
if (isset($_POST["JSdate"])) {//普通截取时 |
||||
|
$ShearPhoto["JSdate"] = json_decode(trim(stripslashes($_POST["JSdate"])), true); |
||||
|
$Shear = new ShearPhoto; //类实例开始 |
||||
|
if(stripos($ShearPhoto['JSdate']['url'],'file/photo/')){ |
||||
|
$ShearPhoto['JSdate']['url']=IOURL.'/file/photo/' . basename($ShearPhoto['JSdate']['url']); |
||||
|
}else{ |
||||
|
$ShearPhoto['JSdate']['url']=$ShearPhoto['config']['temp'] . DIRECTORY_SEPARATOR . basename($ShearPhoto['JSdate']['url']); |
||||
|
} |
||||
|
$result = $Shear->run($ShearPhoto["JSdate"], $ShearPhoto["config"]); //传入参数运行 |
||||
|
if ($result === false) { //切图失败时 |
||||
|
echo '{"erro":"' . $Shear->erro . '"}'; //把错误发给JS /请匆随意更改"erro"的编写方式,否则JS出错 |
||||
|
exit; |
||||
|
} else { |
||||
|
$dirname = pathinfo($ShearPhoto["JSdate"]["url"]); |
||||
|
$ShearPhotodirname = $dirname["dirname"] . DIRECTORY_SEPARATOR . "shearphoto.lock"; //认证删除的密钥 |
||||
|
file_exists($ShearPhotodirname) && @unlink($ShearPhoto["JSdate"]["url"]); //密钥存在,当然就删掉原图 |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
/*........................普通截取时结束..........................*/ |
||||
|
|
||||
|
|
||||
|
elseif (isset($_POST["ShearPhotoIW"]) && |
||||
|
isset($_POST["ShearPhotoIH"]) && |
||||
|
isset($_POST["ShearPhotoFW"]) && |
||||
|
isset($_POST["ShearPhotoFH"]) && |
||||
|
isset($_POST["ShearPhotoP"]) && |
||||
|
is_numeric($JSconfig["P"]=trim($_POST["ShearPhotoP"]))&& |
||||
|
is_numeric($JSconfig["IW"]=trim($_POST["ShearPhotoIW"]))&& |
||||
|
is_numeric($JSconfig["IH"]=trim($_POST["ShearPhotoIH"]))&& |
||||
|
is_numeric($JSconfig["FW"]=trim($_POST["ShearPhotoFW"]))&& |
||||
|
is_numeric($JSconfig["FH"]=trim($_POST["ShearPhotoFH"]))){ |
||||
|
$Shear = new ShearPhoto; //类实例开始 |
||||
|
$result =$Shear->html5_run($ShearPhoto["config"],$JSconfig);//加载HTML5已切好的图片独有方法 |
||||
|
if ($result === false) { //切图失败时 |
||||
|
echo '{"erro":"' . $Shear->erro . '"}'; //把错误发给JS /请匆随意更改"erro"的编写方式,否则JS出错 |
||||
|
exit; |
||||
|
} |
||||
|
} |
||||
|
/*........................HTML5截取时结束..........................*/ |
||||
|
|
||||
|
/*........错误的操作................*/ |
||||
|
else {die('{"erro":"错误的操作!或缺少参数或错误参数"}');} |
||||
|
/*........错误的操作................*/ |
||||
|
|
||||
|
|
||||
|
$str_result = json_encode($result); |
||||
|
echo str_replace("\/", "/", $str_result); //去掉无用的字符修正URL地址,再把数据传弟给JS |
||||
|
?> |
||||
@ -0,0 +1,59 @@ |
|||||
|
<?php |
||||
|
$ini_set = array( |
||||
|
'max_size' => 2 * 1024 * 1024, //文件大小限制设置 M单位 |
||||
|
'out_time' => 60, //上传超时设置 |
||||
|
'list' => $ShearPhoto["config"]["temp"].DIRECTORY_SEPARATOR, //上传路径 |
||||
|
'whitelist' => array( |
||||
|
".jpeg", |
||||
|
".gif", |
||||
|
".png", |
||||
|
".jpg")//上传的文件后缀 |
||||
|
); |
||||
|
/*设置部份结束*/ |
||||
|
ini_set('max_execution_time', $ini_set['out_time']); |
||||
|
function HandleError($erro = '系统错误') { |
||||
|
die('{"erro":"'.$erro.'"}'); |
||||
|
} |
||||
|
if (!isset($_FILES['UpFile'])) { |
||||
|
HandleError(); |
||||
|
} |
||||
|
if (isset($_FILES['UpFile']['error']) && $_FILES['UpFile']['error'] != 0) { |
||||
|
$uploadErrors = array( |
||||
|
0 => '文件上传成功', |
||||
|
1 => '上传的文件超过了 php.ini 文件中的 upload_max_filesize directive 里的设置', |
||||
|
2 => '上传的文件超过了 HTML form 文件中的 MAX_FILE_SIZE directive 里的设置', |
||||
|
3 => '上传的文件仅为部分文件', |
||||
|
4 => '没有文件上传', |
||||
|
6 => '缺少临时文件夹' |
||||
|
); |
||||
|
HandleError($uploadErrors[$_FILES['UpFile']['error']]); |
||||
|
} |
||||
|
if (!isset($_FILES['UpFile']['tmp_name']) || !@is_uploaded_file($_FILES['UpFile']['tmp_name'])) { |
||||
|
HandleError('无法找到上传的文件,上传失败'); |
||||
|
} |
||||
|
if (!isset($_FILES['UpFile']['name'])) { |
||||
|
HandleError('上传空名字文件名'); |
||||
|
} |
||||
|
$POST_MAX_SIZE = ini_get('post_max_size'); |
||||
|
$unit = strtoupper(substr($POST_MAX_SIZE, -1)); |
||||
|
$multiplier = $unit == 'M' ? 1048576 : ($unit == 'K' ? 1024 : ($unit == 'G' ? 1073741824 : 1)); |
||||
|
if ((int)$_SERVER['CONTENT_LENGTH'] > $multiplier * (int)$POST_MAX_SIZE && $POST_MAX_SIZE) { |
||||
|
HandleError('超过POST_MAX_SIZE的设置值,请查看PHP.ini的设置'); |
||||
|
} |
||||
|
$file_size = @filesize($_FILES['UpFile']['tmp_name']); |
||||
|
if (!$file_size || $file_size > $ini_set['max_size']) { |
||||
|
HandleError('零字节文件 或 上传的文件已经超过所设置最大值'); |
||||
|
} |
||||
|
$UpFile = array(); |
||||
|
$int_type = getimagesize($_FILES['UpFile']['tmp_name']); |
||||
|
$str_type = image_type_to_extension($int_type[2]); |
||||
|
if (!in_array(strtolower($str_type) , $ini_set['whitelist'])) { |
||||
|
HandleError('不允许上传此类型文件'); |
||||
|
} |
||||
|
$str_type==".jpeg" && ($str_type=".jpg"); |
||||
|
$UpFile['filename']=uniqid("temp_")."_".mt_rand(100,999).$str_type; |
||||
|
|
||||
|
$UpFile['file_url'] = $ini_set['list'] . $UpFile['filename']; |
||||
|
|
||||
|
file_exists($ini_set['list']) or @mkdir($ini_set['list'], 511,true); |
||||
|
?> |
||||
@ -0,0 +1,13 @@ |
|||||
|
<?php |
||||
|
header('Content-type:text/html;charset=utf-8'); |
||||
|
error_reporting(E_ALL & ~E_NOTICE & ~E_WARNING); |
||||
|
require("shearphoto.config.php"); |
||||
|
require("shearphoto.up.php"); |
||||
|
if (!move_uploaded_file($_FILES['UpFile']['tmp_name'], $UpFile['file_url'])) { |
||||
|
HandleError('后端获取不到文件写入权限。原因:move_uploaded_file()函数-无法写入文件'); |
||||
|
} |
||||
|
$UpFile['file_url']=str_replace(array(ShearURL,"\\"),array("","/"),$UpFile['file_url']); |
||||
|
|
||||
|
|
||||
|
echo('{"success":"'.$UpFile['file_url'].'"}'); |
||||
|
?> |
||||
@ -0,0 +1,76 @@ |
|||||
|
<?php |
||||
|
class zip_img { |
||||
|
protected $arg; |
||||
|
protected $waterimg = false; |
||||
|
protected $GDfun = false; |
||||
|
protected $result = array(); |
||||
|
protected $quality = false; |
||||
|
final function __construct($arg) { |
||||
|
$this->arg = $arg; |
||||
|
if ($arg["force_jpg"]) { |
||||
|
$this->quality = $arg["quality"]; |
||||
|
$this->GDfun = array( |
||||
|
"imagejpeg", |
||||
|
".jpg" |
||||
|
); |
||||
|
} else { |
||||
|
$this->GDfun = $arg["GdFun"]; |
||||
|
$this->quality =0; |
||||
|
} |
||||
|
if ($arg["water"]) { |
||||
|
list($W, $H, $type) = @getimagesize($arg["water"]); |
||||
|
if ($type == 3) { |
||||
|
$this->waterimg = array( |
||||
|
imagecreatefrompng($arg["water"]) , |
||||
|
$W, |
||||
|
$H |
||||
|
); |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
protected function zip_img($dest, $width, $height, $save_url, $water) { |
||||
|
$createsrc = imagecreatetruecolor($width, $height); |
||||
|
imagecopyresampled($createsrc, $dest, 0, 0, 0, 0, $width, $height, $this->arg["w"], $this->arg["h"]); |
||||
|
$water and $createsrc = $this->add_water($createsrc, $width, $height); |
||||
|
return $this->saveimg($createsrc, $save_url, $width, $height); |
||||
|
} |
||||
|
protected function add_water($src, $width, $height) { |
||||
|
imagecopy($src, $this->waterimg[0], $width - $this->waterimg[1] - 10, $height - $this->waterimg[2] - 10, 0, 0, $this->waterimg[1], $this->waterimg[2]); |
||||
|
return $src; |
||||
|
} |
||||
|
protected function saveimg($createsrc, $save_url, $width, $height) { |
||||
|
$save_url.= $this->GDfun[1]; |
||||
|
$GDW = $this->quality ? @call_user_func($this->GDfun[0], $createsrc, $save_url, $this->quality) : @call_user_func($this->GDfun[0], $createsrc, $save_url); |
||||
|
imagedestroy($createsrc); |
||||
|
array_push($this->result, array( |
||||
|
"ImgUrl" => str_replace(array( |
||||
|
ShearURL, |
||||
|
"\\" |
||||
|
) , array( |
||||
|
"", |
||||
|
"/" |
||||
|
) , $save_url) , |
||||
|
"ImgName" => basename($save_url) , |
||||
|
"ImgWidth" => $width, |
||||
|
"ImgHeight" => $height |
||||
|
)); |
||||
|
return $GDW; |
||||
|
} |
||||
|
final function __destruct() { |
||||
|
@imagedestroy($this->arg["dest"]); |
||||
|
$this->waterimg[0] and @imagedestroy($this->waterimg[0]); |
||||
|
} |
||||
|
public function run($this_) { |
||||
|
$dest = $this->arg["dest"]; |
||||
|
$zip_array = $this->arg["zip_array"]; |
||||
|
foreach ($zip_array as $k => $v) { |
||||
|
list($width, $height, $save_url, $water) = $v; |
||||
|
if (!$this->zip_img($dest, $width, $height, $save_url, $this->waterimg and $water)) { |
||||
|
$this_->erro = "后端获取不到文件写入权限。原因:" . $this->GDfun[0] . "()函数-无法写入文件"; |
||||
|
return false; |
||||
|
} |
||||
|
} |
||||
|
return $this->result; |
||||
|
} |
||||
|
} |
||||
|
?> |
||||
@ -0,0 +1,281 @@ |
|||||
|
/*! |
||||
|
* Stylesheet for the Date Range Picker, for use with Bootstrap 3.x |
||||
|
* |
||||
|
* Copyright 2013 Dan Grossman ( http://www.dangrossman.info ) |
||||
|
* Licensed under the Apache License v2.0 |
||||
|
* http://www.apache.org/licenses/LICENSE-2.0 |
||||
|
* |
||||
|
* Built for http://www.improvely.com |
||||
|
*/ |
||||
|
.clear{ clear:both;} |
||||
|
.daterangepicker.dropdown-menu { |
||||
|
max-width: none; |
||||
|
z-index: 3000; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker.opensleft .ranges, .daterangepicker.opensleft .calendar { |
||||
|
float: left; |
||||
|
margin: 4px; |
||||
|
} |
||||
|
|
||||
|
/*.daterangepicker.opensright .ranges, .daterangepicker.opensright .calendar {*/ |
||||
|
.daterangepicker.opensright .calendar { |
||||
|
float: right; |
||||
|
margin: 4px; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker .ranges { |
||||
|
margin:4px; |
||||
|
text-align: left; |
||||
|
padding:0px 20px; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker .ranges .range_inputs>div { |
||||
|
float: left; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker .ranges .range_inputs>div:nth-child(2) { |
||||
|
padding-left: 11px; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker .ranges .range_inputs .applyBtn{ |
||||
|
float:right; |
||||
|
} |
||||
|
.daterangepicker .ranges .range_inputs .cancelBtn{ |
||||
|
float:right;margin-right:10px; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.daterangepicker .calendar { |
||||
|
display: none; |
||||
|
max-width: 290px; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker.show-calendar .calendar { |
||||
|
display: block; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker .calendar.single .calendar-date { |
||||
|
border: none; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker .calendar th, .daterangepicker .calendar td { |
||||
|
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; |
||||
|
white-space: nowrap; |
||||
|
text-align: center; |
||||
|
min-width: 32px; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker .daterangepicker_start_input label, |
||||
|
.daterangepicker .daterangepicker_end_input label { |
||||
|
color: #333; |
||||
|
display: block; |
||||
|
font-size: 11px; |
||||
|
font-weight: normal; |
||||
|
height: 20px; |
||||
|
line-height: 20px; |
||||
|
margin-bottom: 2px; |
||||
|
text-shadow: #fff 1px 1px 0px; |
||||
|
text-transform: uppercase; |
||||
|
padding-right:10px; |
||||
|
float:left; |
||||
|
height:34px; |
||||
|
line-height:34px; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker .ranges input { |
||||
|
font-size: 11px; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker .ranges .input-mini { |
||||
|
background-color: #eee; |
||||
|
border: 1px solid #ccc; |
||||
|
border-radius: 4px; |
||||
|
color: #555; |
||||
|
display: block; |
||||
|
font-size: 11px; |
||||
|
height: 34px; |
||||
|
line-height: 34px; |
||||
|
vertical-align: middle; |
||||
|
margin: 0 0 10px 0; |
||||
|
padding: 0 6px; |
||||
|
width: 84px; |
||||
|
float:left; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker .ranges ul { |
||||
|
list-style: none; |
||||
|
margin: 0; |
||||
|
padding: 0; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker .ranges li { |
||||
|
font-size: 13px; |
||||
|
background: #f5f5f5; |
||||
|
border: 1px solid #f5f5f5; |
||||
|
color: #08c; |
||||
|
padding: 3px 12px; |
||||
|
margin-bottom: 8px; |
||||
|
-webkit-border-radius: 5px; |
||||
|
-moz-border-radius: 5px; |
||||
|
border-radius: 5px; |
||||
|
cursor: pointer; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker .ranges li.active, .daterangepicker .ranges li:hover { |
||||
|
background: #08c; |
||||
|
border: 1px solid #08c; |
||||
|
color: #fff; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker .calendar-date { |
||||
|
border: 1px solid #ddd; |
||||
|
padding: 4px; |
||||
|
border-radius: 4px; |
||||
|
background: #fff; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker .calendar-time { |
||||
|
text-align: center; |
||||
|
margin: 8px auto 0 auto; |
||||
|
line-height: 30px; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker { |
||||
|
position: absolute; |
||||
|
background: #fff; |
||||
|
top: 100px; |
||||
|
left: 20px; |
||||
|
padding: 4px; |
||||
|
margin-top: 1px; |
||||
|
-webkit-border-radius: 4px; |
||||
|
-moz-border-radius: 4px; |
||||
|
border-radius: 4px; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker.opensleft:before { |
||||
|
position: absolute; |
||||
|
top: -7px; |
||||
|
right: 9px; |
||||
|
display: inline-block; |
||||
|
border-right: 7px solid transparent; |
||||
|
border-bottom: 7px solid #ccc; |
||||
|
border-left: 7px solid transparent; |
||||
|
border-bottom-color: rgba(0, 0, 0, 0.2); |
||||
|
content: ''; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker.opensleft:after { |
||||
|
position: absolute; |
||||
|
top: -6px; |
||||
|
right: 10px; |
||||
|
display: inline-block; |
||||
|
border-right: 6px solid transparent; |
||||
|
border-bottom: 6px solid #fff; |
||||
|
border-left: 6px solid transparent; |
||||
|
content: ''; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker.opensright:before { |
||||
|
position: absolute; |
||||
|
top: -7px; |
||||
|
left: 9px; |
||||
|
display: inline-block; |
||||
|
border-right: 7px solid transparent; |
||||
|
border-bottom: 7px solid #ccc; |
||||
|
border-left: 7px solid transparent; |
||||
|
border-bottom-color: rgba(0, 0, 0, 0.2); |
||||
|
content: ''; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker.opensright:after { |
||||
|
position: absolute; |
||||
|
top: -6px; |
||||
|
left: 10px; |
||||
|
display: inline-block; |
||||
|
border-right: 6px solid transparent; |
||||
|
border-bottom: 6px solid #fff; |
||||
|
border-left: 6px solid transparent; |
||||
|
content: ''; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker table { |
||||
|
width: 100%; |
||||
|
margin: 0; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker td, .daterangepicker th { |
||||
|
text-align: center; |
||||
|
width: 20px; |
||||
|
height: 20px; |
||||
|
-webkit-border-radius: 4px; |
||||
|
-moz-border-radius: 4px; |
||||
|
border-radius: 4px; |
||||
|
cursor: pointer; |
||||
|
white-space: nowrap; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker td.off { |
||||
|
color: #999; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker td.disabled { |
||||
|
color: #999; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker td.available:hover, .daterangepicker th.available:hover { |
||||
|
background: #eee; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker td.in-range { |
||||
|
background: #ebf4f8; |
||||
|
-webkit-border-radius: 0; |
||||
|
-moz-border-radius: 0; |
||||
|
border-radius: 0; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker td.active, .daterangepicker td.active:hover { |
||||
|
background-color: #357ebd; |
||||
|
border-color: #3071a9; |
||||
|
color: #fff; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker td.week, .daterangepicker th.week { |
||||
|
font-size: 80%; |
||||
|
color: #ccc; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker select.monthselect, .daterangepicker select.yearselect { |
||||
|
font-size: 12px; |
||||
|
padding: 1px; |
||||
|
height: auto; |
||||
|
margin: 0; |
||||
|
cursor: default; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker select.monthselect { |
||||
|
margin-right: 2%; |
||||
|
width: 56%; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker select.yearselect { |
||||
|
width: 40%; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.ampmselect { |
||||
|
width: 50px; |
||||
|
margin-bottom: 0; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker_start_input { |
||||
|
float: left; |
||||
|
} |
||||
|
|
||||
|
.daterangepicker_end_input { |
||||
|
float: left; |
||||
|
padding-left: 11px |
||||
|
} |
||||
|
|
||||
|
.daterangepicker th.month { |
||||
|
width: auto; |
||||
|
} |
||||
@ -0,0 +1,25 @@ |
|||||
|
目录说明 |
||||
|
======================== |
||||
|
|
||||
|
```bash |
||||
|
├── Uploader.swf # SWF文件,当使用Flash运行时需要引入。 |
||||
|
├ |
||||
|
├── webuploader.js # 完全版本。 |
||||
|
├── webuploader.min.js # min版本 |
||||
|
├ |
||||
|
├── webuploader.flashonly.js # 只有Flash实现的版本。 |
||||
|
├── webuploader.flashonly.min.js # min版本 |
||||
|
├ |
||||
|
├── webuploader.html5only.js # 只有Html5实现的版本。 |
||||
|
├── webuploader.html5only.min.js # min版本 |
||||
|
├ |
||||
|
├── webuploader.noimage.js # 去除图片处理的版本,包括HTML5和FLASH. |
||||
|
├── webuploader.noimage.min.js # min版本 |
||||
|
├ |
||||
|
├── webuploader.custom.js # 自定义打包方案,请查看 Gruntfile.js,满足移动端使用。 |
||||
|
└── webuploader.custom.min.js # min版本 |
||||
|
``` |
||||
|
|
||||
|
## 示例 |
||||
|
|
||||
|
请把整个 Git 包下载下来放在 php 服务器下,因为默认提供的文件接受是用 php 编写的,打开 examples 页面便能查看示例效果。 |
||||
@ -0,0 +1,28 @@ |
|||||
|
.webuploader-container { |
||||
|
position: relative; |
||||
|
} |
||||
|
.webuploader-element-invisible { |
||||
|
position: absolute !important; |
||||
|
clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ |
||||
|
clip: rect(1px,1px,1px,1px); |
||||
|
} |
||||
|
.webuploader-pick { |
||||
|
position: relative; |
||||
|
display: inline-block; |
||||
|
cursor: pointer; |
||||
|
background: #00b7ee; |
||||
|
padding: 10px 15px; |
||||
|
color: #fff; |
||||
|
text-align: center; |
||||
|
border-radius: 3px; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
.webuploader-pick-hover { |
||||
|
background: #00a2d4; |
||||
|
} |
||||
|
|
||||
|
.webuploader-pick-disable { |
||||
|
opacity: 0.6; |
||||
|
pointer-events:none; |
||||
|
} |
||||
|
|
||||
@ -0,0 +1,33 @@ |
|||||
|
<?php $config=config('view_replace_str');?> |
||||
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
||||
|
<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
||||
|
|
||||
|
<title>{:lang('error')}</title> |
||||
|
<link type="text/css" rel="stylesheet" href="<?php echo $config['__PUBLIC__']; ?>jump_style/base.css"> |
||||
|
<link type="text/css" rel="stylesheet" href="<?php echo $config['__PUBLIC__']; ?>jump_style/global.css"> |
||||
|
<link type="text/css" rel="stylesheet" href="<?php echo $config['__PUBLIC__']; ?>jump_style/404.css"> |
||||
|
</head> |
||||
|
<body> |
||||
|
<div class="wrap"> |
||||
|
<div class="errors"> |
||||
|
<div class="text"> |
||||
|
<h4>{:lang('reason')}</h4> |
||||
|
<h4><?php echo (is_array($msg))?implode("|",$msg):$msg;; ?>!</h4> |
||||
|
<p>SZCAEE:{:lang('automatically')} <a id="href" href="<?php echo($url); ?>">{:lang('jump')}</a> {:lang('wait second')} <b id="wait"><?php echo($wait); ?></b></p> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<script type="text/javascript"> |
||||
|
(function(){ |
||||
|
var wait = document.getElementById('wait'),href = document.getElementById('href').href; |
||||
|
var interval = setInterval(function(){ |
||||
|
var time = --wait.innerHTML; |
||||
|
if(time <= 0) { |
||||
|
location.href = href; |
||||
|
clearInterval(interval); |
||||
|
}; |
||||
|
}, 1000); |
||||
|
})(); |
||||
|
</script> |
||||
|
</body></html> |
||||
@ -0,0 +1,34 @@ |
|||||
|
<!doctype html> |
||||
|
<html> |
||||
|
<head> |
||||
|
<meta charset="utf-8"> |
||||
|
<title>访问错误--页面跳转中...</title> |
||||
|
<head> |
||||
|
<meta http-equiv=content-type content="text/html; charset=utf-8"> |
||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
||||
|
<link href="/public/jump_style/css/style.css" type="text/css" rel="stylesheet"> |
||||
|
<meta http-equiv="refresh" content="500;url=#"> |
||||
|
</head> |
||||
|
<body> |
||||
|
<div class="container"> |
||||
|
<div class="container_3_3"><span>{:config('sys_name')}</span></div> |
||||
|
<div class="container_1"><img src="/public/jump_style/images/404.png"></div> |
||||
|
<div class="container_2"><img src="/public/jump_style/images/3.22.gif" ></div> |
||||
|
<div class="container_3"> |
||||
|
<div class="container_3_1"><span>SORRY,你要访问的页面弄丢了</span></div> |
||||
|
<div class="container_3_2"><span>你可以通过以下方式重新访问......</span></div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="maincolumn"> |
||||
|
<div class="maincolumn_bg"> |
||||
|
<ul> |
||||
|
<li class="index"><a href="{:url('home/Index/index')}">返回首页</a></li> |
||||
|
<li class="about"><a href="{:url('home/Listn/index',['id'=>18]')}">关于我们</a></li> |
||||
|
<li class="contact"><a href="{:url('home/Listn/contact')}">联系我们</a></li> |
||||
|
</ul> |
||||
|
</div> |
||||
|
<div></div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</body> |
||||
|
</html> |
||||