209 lines
7.4 KiB
PHP
209 lines
7.4 KiB
PHP
<?php echo 'Discuz!应用中心开发者-简约设计';exit;?>
|
|
|
|
<!--{template common/header}-->
|
|
<link rel="stylesheet" href="{$_G['style']['styleimgdir']}/avatar/cropper.min.css">
|
|
<link rel="stylesheet" href="{$_G['style']['styleimgdir']}/avatar/ImgCropping.css">
|
|
<style type="text/css">
|
|
.l-btn{ background-color: $_G['style']['zhuti']; border-color: $_G['style']['zhuti']; vertical-align: top;}
|
|
</style>
|
|
|
|
<!-- header start -->
|
|
<header class="header_xin">
|
|
<div class="hdc_xin cl" id="byg_header">
|
|
<div class="header_z cl">
|
|
<a href="javascript:;" class="shouye">
|
|
<img src="<!--{avatar($_G['uid'], 'middle', true)}-->" alt="头像"/>
|
|
<!--{if $_G[member][newpm] || $post_notice_new}-->
|
|
<img src="{$_G['style']['styleimgdir']}/new_pm.png" alt="提醒" class="new_pm"/>
|
|
<!--{/if}-->
|
|
</a>
|
|
<em>›</em>
|
|
<span>修改头像</span>
|
|
</div>
|
|
<a href="javascript:history.back();" title="返回上一页" class="header_y">
|
|
<img src="{$_G['style']['styleimgdir']}/houtui.png" alt="返回"/></a>
|
|
</div>
|
|
</header>
|
|
<!-- header end -->
|
|
|
|
<style>
|
|
.avatar_pop{ display: none; position: fixed; top: 2rem; left: .2rem; z-index: 1006; width: 3.15rem; padding: .2rem .1rem; border-radius: .1rem; background: #fff; text-align: center;}
|
|
.avatar_pop p{ line-height: .26rem; font-size: .17rem;}
|
|
.avatar_pop p img{ height: .16rem; padding: .05rem .02rem; vertical-align: top;}
|
|
.avatar_pop a{ display: none; font-size: .14rem; color: #06f;}
|
|
</style>
|
|
<div class="avatar_pop">
|
|
<p><img src="{$_G['style']['styleimgdir']}/lanjiazai.gif" alt="等待"/>图片上传中，预计时间：<span>*</span>s</p>
|
|
<a href="home.php?mod=space&do=profile&mycenter=1">如果没有自动返回，请点击这里</a>
|
|
</div>
|
|
<div class="cover_div avatar_pop_cover" style="z-index:1005;"></div>
|
|
|
|
<div class="tailoring-container">
|
|
<div class="black-cloth" onclick="closeTailor(this)"></div>
|
|
<div class="tailoring-content">
|
|
<div class="tailoring-content-one">
|
|
<label title="上传图片" for="chooseImg" class="l-btn choose-btn">
|
|
<input type="file" name="file" accept="image/*" id="chooseImg" class="hidden" onchange="selectImg(this)">
|
|
上传图片
|
|
</label>
|
|
<div class="close-tailoring" onclick="closeTailor(this)">×</div>
|
|
</div>
|
|
<div class="tailoring-content-two">
|
|
<div class="tailoring-box-parcel">
|
|
<img id="tailoringImg">
|
|
</div>
|
|
<div class="preview-box-parcel">
|
|
<div class="square previewImg"></div>
|
|
<div class="circular previewImg"></div>
|
|
</div>
|
|
</div>
|
|
<div class="tailoring-content-three">
|
|
<button class="l-btn cropper-reset-btn">复位</button>
|
|
<button class="l-btn cropper-rotate-btn">旋转</button>
|
|
<button class="l-btn cropper-scaleX-btn">镜像</button>
|
|
<button class="l-btn sureCut" id="sureCut">确定</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<form id="avatarform" enctype="multipart/form-data" method="post" autocomplete="off" action="home.php?mod=spacecp&ac=avatar">
|
|
<input type="hidden" id="avatar1" name="avatar1" />
|
|
<input type="hidden" id="avatar2" name="avatar2" />
|
|
<input type="hidden" id="avatar3" name="avatar3" />
|
|
<input type="hidden" name="formhash" value="{FORMHASH}" />
|
|
</form>
|
|
<iframe name="rectframe" id="rectframe" style="display: none;"></iframe>
|
|
|
|
<script src="{$_G['style']['styleimgdir']}/avatar/cropper.min.js"></script>
|
|
<script>
|
|
function bygsjw(id) {
|
|
return !id ? null : document.getElementById(id);
|
|
}
|
|
var data = "{echo implode(",", $uc_avatarflash);}".split(',');
|
|
var src = bygsjw('avatarform').action;
|
|
<!--{if isset($_G['setting']['mobile']['forum'])}-->
|
|
bygsjw('avatarform').action = data[data.indexOf('stl_src')+1];
|
|
<!--{else}-->
|
|
bygsjw('avatarform').action = data[data.indexOf('src')+1].replace('images/camera.swf?inajax=1', 'index.php?m=user&a=rectavatar&base64=yes');
|
|
<!--{/if}-->
|
|
bygsjw('avatarform').target='rectframe';
|
|
|
|
(window.onresize = function () {
|
|
var win_height = jQuery(window).height();
|
|
var win_width = jQuery(window).width();
|
|
if (win_width <= 768){
|
|
jQuery(".tailoring-content").css({
|
|
"top": (win_height - jQuery(".tailoring-content").outerHeight())/3,
|
|
"left": 0
|
|
});
|
|
}else{
|
|
jQuery(".tailoring-content").css({
|
|
"top": (win_height - jQuery(".tailoring-content").outerHeight())/3,
|
|
"left": (win_width - jQuery(".tailoring-content").outerWidth())/2
|
|
});
|
|
}
|
|
})();
|
|
|
|
function selectImg(file) {
|
|
if (!file.files || !file.files[0]){
|
|
return;
|
|
}
|
|
var reader = new FileReader();
|
|
reader.onload = function (evt) {
|
|
var replaceSrc = evt.target.result;
|
|
jQuery('#tailoringImg').cropper('replace', replaceSrc,false);
|
|
}
|
|
reader.readAsDataURL(file.files[0]);
|
|
}
|
|
|
|
jQuery('#tailoringImg').cropper({
|
|
aspectRatio: 1/1,
|
|
preview: '.previewImg',
|
|
guides: false,
|
|
autoCropArea: 0.5,
|
|
movable: false,
|
|
dragCrop: true,
|
|
movable: true,
|
|
resizable: true,
|
|
zoomable: false,
|
|
mouseWheelZoom: false,
|
|
touchDragZoom: true,
|
|
rotatable: true,
|
|
crop: function(e) {
|
|
}
|
|
});
|
|
|
|
jQuery(".cropper-rotate-btn").on("click",function () {
|
|
jQuery('#tailoringImg').cropper("rotate", 45);
|
|
});
|
|
|
|
jQuery(".cropper-reset-btn").on("click",function () {
|
|
jQuery('#tailoringImg').cropper("reset");
|
|
});
|
|
|
|
var flagX = true;
|
|
jQuery(".cropper-scaleX-btn").on("click",function () {
|
|
if(flagX){
|
|
jQuery('#tailoringImg').cropper("scaleX", -1);
|
|
flagX = false;
|
|
}else{
|
|
jQuery('#tailoringImg').cropper("scaleX", 1);
|
|
flagX = true;
|
|
}
|
|
flagX != flagX;
|
|
});
|
|
|
|
jQuery("#sureCut").on("click",function () {
|
|
if (jQuery("#tailoringImg").attr("src") == null ) {
|
|
return false;
|
|
} else {
|
|
var canvas = jQuery('#tailoringImg').cropper('getCroppedCanvas',{width: 200,height: 200});
|
|
var dataURL = canvas.toDataURL("image/jpeg");
|
|
jQuery('#avatar1').val(dataURL.substr(dataURL.indexOf(",") + 1));
|
|
|
|
canvas = jQuery('#tailoringImg').cropper('getCroppedCanvas',{width: 120,height: 120});
|
|
dataURL = canvas.toDataURL("image/jpeg");
|
|
jQuery('#avatar2').val(dataURL.substr(dataURL.indexOf(",") + 1));
|
|
|
|
canvas = jQuery('#tailoringImg').cropper('getCroppedCanvas',{width: 48,height: 48});
|
|
dataURL = canvas.toDataURL("image/jpeg");
|
|
jQuery('#avatar3').val(dataURL.substr(dataURL.indexOf(",") + 1));
|
|
|
|
jQuery.ajax({
|
|
type: "POST",
|
|
url: jQuery("#avatarform").attr('action'),
|
|
data: jQuery('#avatarform').serialize(),
|
|
beforeSend: function() {
|
|
jQuery(".avatar_pop, .avatar_pop_cover").show();
|
|
},
|
|
complete: function() {
|
|
var avatar_pop_num = 4;
|
|
var avatar_pop_time = setInterval(function() {
|
|
if(avatar_pop_num == 0) {
|
|
clearInterval(avatar_pop_time);
|
|
jQuery(".avatar_pop p").html("上传完成");
|
|
jQuery(".avatar_pop a").show();
|
|
} else {
|
|
avatar_pop_num--;
|
|
jQuery(".avatar_pop p span").html(avatar_pop_num);
|
|
}
|
|
}, 1000);
|
|
setTimeout(function(){
|
|
jQuery.ajax({
|
|
url: 'home.php?mod=spacecp&ac=avatar',
|
|
type: 'GET',
|
|
dataType: 'html',
|
|
success: function(s){}
|
|
});
|
|
}, 5000);
|
|
setTimeout(function(){closeTailor();}, 6000);
|
|
}
|
|
});
|
|
}
|
|
});
|
|
|
|
function closeTailor() {
|
|
window.location.href="{$_G[siteurl]}home.php?mod=space&do=profile&mycenter=1&mobile=2";
|
|
}
|
|
</script>
|
|
|
|
<!--{template common/footer}-->
|