⭐ 欢迎来到虫虫下载站! | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站

📄 photo.jsp

📁 JSP购物车(SQLserver版) ================== 简单的JSP电子商务网站购物车 带结算功能,带注册系统 大二时自己编写的,供大家参考学习 功能不是很详尽,美工
💻 JSP
字号:
<%@ page language="java" contentType="text/html;charset=UTF-8" %><%@ include file="inc/common.jsp" %><%
UserJsp userJsp = new UserJsp(request,response);
%><!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>
<title>修改头像(${basic.name})</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="keywords" content="${basic.keywords}"/>
<meta name="description" content="${basic.description}"/>
<meta name="author" content="YeQiangWei.com"/>
<link href="images/favicon.ico" rel="Bookmark" /> 
<link href="images/favicon.ico" rel="icon" type="image/x-icon" />
<link href="images/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<club:html type="css" />
<style>
/* 在线切图 */
#borderDiv{border:1px solid #fff; padding:5px; filter:alpha(opacity='30'), -moz-opacity:0.9;}
#borderDiv:after{line-height:28px; content: '.'; display:block; clear:both; visibility:hidden; height:0;}
#outerDiv{z-index:20; border:4px dashed #333; margin:0px; padding:0px;  corlor:#FF3300; position:absolute;}
#innerDiv{filter:alpha(opacity='50'); -moz-opacity:0.5;  margin:0px; padding:0px; background:#fff; cursor:pointer; height:100%; width:100%;}
#picDiv img{z-index:20; border:1px solid #ff6600;}
</style>
<script type="text/javascript" src="/club/scripts/common.js"></script>
<script type="text/javascript">
var theobject = null;
var eS;
var eSs;
var IntX;
var IntY;
var DiyW;
var DiyH;
var img_width;
var img_height;
var d=0;
var px = (!is_ie)?"px":"";
function ResizeObject(){
	this.el  = null;     /*pointer to the object*/
	this.dir  = "";      /*type of current resize (n, s, e, w, ne, nw, se, sw)*/
	this.grabx = null;   /*Some useful values*/
	this.graby = null;
	this.width = null;
	this.height = null;
	this.left = null;
	this.top = null;
}
function getReal(el, type, value){
	var temp = el;
	while ((temp != null) && (temp.id != "outerDiv")) {
		if (eval("temp." + type) == value) {
			el = temp;
			return el;
		}
		temp = temp.srcElement;
	}
	return el;
}

function getDirection(el,e){
	var xPos, yPos, offset, dir;
	dir = "";
	if(is_ie){
		xPos = window.event.offsetX;
		yPos = window.event.offsetY;
	}else{
		xPos = e.clientX;
		yPos = e.clientY;
	}
	offset = 8; 
	if (yPos<offset) dir += "n";
	else if (yPos > el.offsetHeight-offset) dir += "s";
	if (xPos<offset) dir += "w";
	else if (xPos > el.offsetWidth-offset) dir += "e";
	return dir;
}
function init(intX, intY, top_, left_, oType){
	IntX=intX;
	IntY=intY;
	c.o("outerDiv").style.left=left_+px;
	c.o("outerDiv").style.top=top_+px;
	c.o("outerDiv").style.width=intX+px;
	c.o("outerDiv").style.height=intY+px;
	eS=intX/intY;
	if(oType){eSs=true;}
	var img = new Image();  
	img.src =  c.o("photo").src;
	if(is_ie){
		img_width = img.width;
		img_height = img.height;
	}else{
		img_width = c.o("img_width").value+px;
		img_height = c.o("img_height").value+px;
	}
	c.o("picDiv").style.width = img_width;
	c.o("picDiv").style.height = img_height;
}
function doDown(e){
	var el = (!is_ie)?getReal(e.target, "className", "resizeMe"):getReal(event.srcElement, "className", "resizeMe");
	if (el == null) {
		theobject = null;
		return;
	}
	dir = getDirection(el,e);
	if (dir == "") return;
	theobject = new ResizeObject();
	theobject.el = el;
	theobject.dir = dir;
	var _x = ((!is_ie)?e.pageX:event.clientX+document.body.scrollLeft);
	var _y = ((!is_ie)?e.pageY:event.clientY+document.body.scrollTop);
	if(is_ie){
		theobject.width = el.offsetWidth;
		theobject.height = el.offsetHeight;
		theobject.left = el.offsetLeft;
		theobject.top = el.offsetTop;
		theobject.grabx = _x;
		theobject.graby = _y;
	}else{
		theobject.width = el.offsetWidth+px;
		theobject.height = el.offsetHeight+px;
		theobject.left = el.offsetLeft+px;
		theobject.top = el.offsetTop+px;
		theobject.grabx = _x+px;
		theobject.graby = _y+px;
	}
	if(is_ie){
		window.event.returnValue = false;
		window.event.cancelBubble = true;
	}else{
		e.preventDefault = false;
		e.cancelBubble = true;
	}
}
function doUp(){
	theobject = null;
}
function find(qq,e){
	d=qq;
	if(is_ie){
		x=document.body.scrollLeft+event.clientX-d.style.pixelLeft;
		y=document.body.scrollTop+event.clientY-d.style.pixelTop;
	}else{
		x=e.pageX;
		y=e.pageY;
	}
}
function dragit(e){
	if(d==0){
		return false;
	}else{
		var _x = 0;
		var _y = 0;
		if(is_ie){
			_x = document.body.scrollLeft+event.clientX;
			_y = document.body.scrollTop+event.clientY;
		}else{
			_x=e.pageX;
			_y=e.pageY;
		}
		if(d.style.pixelLeft>20){
			d.style.pixelLeft= (_x-x)+px;
		}else{
			d.style.pixelLeft=(21)+px;
		}
		if(d.style.pixelTop>10){
			d.style.pixelTop = (_y-y)+px;
		}else{
			d.style.pixelTop=(2)+px;
		}
	}
}
function doMove(e){
	var el, xPos, yPos, str, xMin, yMin;
	xMin = 8; /*The smallest width possible*/
	yMin = 8; /* eight */
	if(is_ie){
		el = getReal(event.srcElement, "className", "resizeMe");
	}else{
		el = getReal(e.target, "className", "resizeMe");
	}
	if (el.className == "resizeMe") {
		str = getDirection(el,e);
	/* Fix the cursor	*/
	if (str == "") str = "pointer";
		else str += "-resize";
		el.style.cursor = str;
	}
	/* Dragging starts here */
	if(theobject != null) {
		var _x = 0;
		var _y = 0;
		if(is_ie){
			_x = window.event.clientX;
			_y = window.event.clientY;
		}else{
			_x=e.pageX;
			_y=e.pageY;
		}
		var _w = 0;
		var _h = 0;
		var _l = 0;
		var towidth = (!is_ie)?parseInt(theobject.width.replace("px","")):theobject.width;
		var toheight = (!is_ie)?parseInt(theobject.height.replace("px","")):theobject.height;
		var tograbx = (!is_ie)?parseInt(theobject.grabx.replace("px","")):theobject.grabx;
		var tograby = (!is_ie)?parseInt(theobject.graby.replace("px","")):theobject.graby;
		if (dir.indexOf("e") != -1)
			_w = Math.max(xMin, (towidth + _x - tograbx));
			theobject.el.style.width = _w+px;
			if(eSs)
			_h =  theobject.el.style.width.replace("px","")/eS;
			theobject.el.style.height = _h+px;
		if (dir.indexOf("s") != -1)
			_h = (Math.max(yMin, toheight + _y - tograby));		
			theobject.el.style.height = _h+px;
			if(eSs)
			_w =(theobject.el.style.height.replace("px","")*eS);
			theobject.el.style.width = _w+px;
		if (dir.indexOf("w") != -1) {
			_l = Math.min(theobject.left + _x - tograbx, theobject.left + towidth - xMin) ;
			_w = Math.max(xMin, towidth - _x + tograbx);
			theobject.el.style.left = _l+px;
			theobject.el.style.width = _w+px;
		}
		if (dir.indexOf("n") != -1) {
			/*
			theobject.el.style.top = Math.min(theobject.top + window.event.clientY - theobject.graby, theobject.top + theobject.height - yMin);
			theobject.el.style.height = Math.max(yMin, theobject.height - window.event.clientY + theobject.graby);
			*/
		}
		if(is_ie){
			window.event.returnValue = false;
			window.event.cancelBubble = true;
		}else{
			e.preventDefault = false;
			e.cancelBubble = true;
		}
		d=0;
	}
}
function cut(){
	c.setHtml("chklink",c.getHtml("chking"));
	var pic_top = c.o("picDiv").offsetTop;
	var pic_left = c.o("picDiv").offsetLeft;
	var div_top = c.o("outerDiv").offsetTop;
	var div_left = c.o("outerDiv").offsetLeft;
	var img_x = img_width-((img_width+pic_left)-div_left)-5; /*截图X坐标 根据页面调整 x坐标本页偏移8*/
	var img_y = img_height-((img_height+pic_top)-div_top)-140; /*截图Y坐标 根据页面调整 y坐标本页偏移100*/
	var img_x_end = c.o("outerDiv").offsetWidth-8;
	var img_y_end = c.o("outerDiv").offsetHeight-8;
	var now = new Date();
	var path = c.o("photopath").value;
	var params = "w=";
	params += 100;
	params += "&h=";
	params += 100;
	params += "&x=";
	params += img_x;
	params += "&y=";
	params += img_y;
	params += "&x_=";
	params += img_x_end;
	params += "&y_=";
	params += img_y_end;
	params += "&r="+now.getTime();
	params += "&act=clip";
	params += "&p=";
	params += path;
	params += "&userId="+c.o("userId").value;
	params += "&photo="+c.o("photo").src;
	myxmlhttp = CreateXmlHttpReq(imageXmlHttpHandler);
	XmlHttpPOST(myxmlhttp, "/club/photoUpload.do", params);
}
function imageXmlHttpHandler(){
	if (myxmlhttp.readyState !=4 ) {
		return;
	}
	html = myxmlhttp.responseText;
	var txts = html.parseJSON(); 
	if(txts["bea"]){
		c.o("photo").src = txts["photo"];
		c.setHtml("chklink",c.getHtml("success"));
		init(150,150,120,200,true);
	}else{
		c.setHtml("chklink",c.getHtml("error"));
	}
}
</script>
</head>
<body>
<%@ include file="inc/nav.jsp" %>
<div class="sitemap">
<ul>
<li>您的位置:</li><li><a href="/club/" target="_parent">社区首页</a>&gt;&gt;</li><li><a href="/club/main.jsp" target="_self">进站画面</a>&gt;&gt;</li><li><h3>修改头像</h3></li>
</ul>
</div><%@ include file="inc/msgHint.jsp" %>
<div class="sidebar"><%
int userId = 0;
if(user!=null){
	userId = user.getUserId();
}
if(request.getAttribute("photopath")==null){
%>
<table class="tabpart">
<tr><td><club:link type="photo" url="" request="<%=request%>" object="<%=userJsp.findOnly()%>" rel="self" /></td></tr>
<tr><td>上传您电脑中的图片</td></tr>
<tr>
<td>
<form name="fileup" id="fileup" method="post" action="/club/photoUpload.do?act=upload&userId=<%=userId%>" target="_self" ENCTYPE="multipart/form-data" onsubmit="c.p('qwSubmit',true);"> 
<input id="files" name="files[]" type="file" class="file" />
<input name="qwSubmit" id="qwSubmit" type="submit" class="btn" value="上传" />
</form> 
</td>
</tr>
</table><%
}else{%>
<table class="tabpart" id="ptab">
<tr>
<td>
[<span id="chklink"><a style="cursor:pointer;" onclick="javascript:cut();">剪切并保存为个人头像</a></span>]
<div class="hide" id="success"><font color="red">头像保存成功</font></div>
<div class="hide" id="error"><a href="photo.jsp">意外错误,头像生成失败!请重新尝试!</a></div>
<div class="hide" id="chking">请稍等,系统正在为您生成头像</div>
<input id="photopath" name="photopath" type="hidden" value="<%=request.getAttribute("photopath")%>" />
<input id="userId" name="userId" type="hidden" value="<%=ParamUtils.getStringParameter(request,"userId","0")%>" />
</td>
</tr>
<tr>
<td>
<div id="borderDiv" style="border:1px solid;">
	<div id="outerDiv" class="resizeMe">
	<div id="innerDiv" ondblclick="cut();" onmouseup="d=0" onmouseleave="d=0"></div>
	</div>
	<div id="picDiv"><img name="photo" id="photo" name="photo"  onload="c.o('img_width').value=this.width; c.o('img_height').value=this.height;" src="<%=request.getAttribute("photourl")%>"  border="1"  align="absmiddle"/></div>
</div>
</td>
</tr>
</table>
<input type="hidden" id="img_width" name="width" value="1"/>
<input type="hidden" id="img_height" name="height" value="1"/>
<script type="text/javascript">
document.body.onmousedown = function(e){
	doDown(e);
}
c.o("outerDiv").onmousemove = function(e){
	doMove(e);
}
c.o("innerDiv").onmousedown = function(e){
	find(c.o('outerDiv'),e);
}

c.o("innerDiv").onmousemove = function(e){
	dragit(e);
}
document.body.onmouseup = function(e){
	doUp(e);
}
init(150,150,150,20,true);
c.hint("拖动方框到合适的位置,双击剪裁图片作为您的头像!");
</script>
<%}%>
</div>
<%@ include file="inc/footer.jsp" %>
</body>
</html>
<!-- Powered by www.YeQiangWei.com -->

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -