首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图

DIV中的image控件,放大,缩小,复原,拖拽

2012-09-18 来源:读书人网 【读书人网(Reader8.cn):综合教育门户网站】
DIV中的image控件,放大,缩小,还原,拖拽!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN

DIV中的image控件,放大,缩小,还原,拖拽

<!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">
<%@ page import="com.fry.ocp.util.RequestUtil" %>
<%@ page import="com.fry.ocp.util.StringUtil" %>
<%@ page import="com.fry.tog.customizationfeed.Surface" %>
<%@ page import="com.fry.tog.util.Personalizer3Manager" %>
<%@ page import="com.fry.tog.util.personalize3.PersonalizeConstants" %>
<%@ page import="com.fry.tog.util.personalize3.ProgressNode" %>
<%@ page import="java.util.Map, java.util.HashMap" %>
<%@ page import="java.util.List"%>
<%@ page import="com.fry.tog.catalog.PersonalizedSurface"%>
<%@ page import="com.fry.ocp.util.ConvertUtil"%>
<%@ page import="java.util.Iterator"%>
<%@ page import="com.fry.tog.util.PreviewManager"%>
<%@ page import="com.fry.ocp.commerce.*"%>
<%@ page import="com.fry.tog.util.SiteUtil" %>
<%@ page import="com.fry.tog.commerce.TOGProductItem" %>
<%@ page import="com.fry.ocp.catalog.*" %>
<%@ page import="com.fry.tog.util.TOGConstants" %>
<%@ page import="java.util.ArrayList, com.fry.tog.util.MultiSiteWebUtil" %>
<%@ page import="com.fry.ocpx.multisite.site.SiteManager" %>

<%
??? /*

?Copyright (C) 2007 Fry Inc., All Rights Reserved.

?Purpose:
?This page provides a layout for displaying the Product Personalizer Preview.
?*/
%>

<%@ taglib uri='/WEB-INF/ocp-template.tld' prefix='template' %>
<%@ taglib uri="/WEB-INF/ocp-html.tld" prefix="html" %>
<%@ taglib uri="/WEB-INF/ocp-logic.tld" prefix="logic" %>
<%@ taglib uri="/WEB-INF/ocp-user.tld" prefix="user" %>
<%@ taglib uri="/WEB-INF/ocp-site.tld" prefix="site" %>
<%@ taglib uri="/WEB-INF/ocp-util.tld" prefix="util" %>
<%@ taglib uri="/WEB-INF/tog-personalizer.tld" prefix="personalizer" %>
<%@ taglib uri="/WEB-INF/scene7-image.tld" prefix="scene7" %>
<%@ taglib uri="/WEB-INF/ocp-pipeline.tld" prefix="pipeline" %>
<%@ taglib uri="/WEB-INF/ocp-commerce.tld" prefix="commerce" %>
<%@ taglib uri="/WEB-INF/ocp-i18n.tld" prefix="i18n" %>

<site:site id="currentSite"/>
<i18n:bundle base="com.fry.tog.i18n.TOGResourceBundle" locale='<%=SiteManager.getLocale(currentSite, request)%>' />
<personalizer:pipelineSession id="pipelineSession"/>
<commerce:personalizer3Item id="item" pipelineSession="<%= pipelineSession %>" priceItemId="priceItem" />
<%
??? String itemUUID =? request.getParameter("subItemUUID");
??? if(itemUUID==null || itemUUID=="")
??? {
??? ??? itemUUID = request.getParameter("itemUUID");
??? }
??? long productVariantId = item.getLong("ITEM_ID");
??? Product product = ProductVariantManager.findProductVariant(productVariantId).getProduct();
??? ProgressNode currentWorkingProgressNode = (ProgressNode)request.getAttribute(PersonalizeConstants.REQUEST_KEY_WORKINGNODEINFO);
??? int currentSurfaceIndex = currentWorkingProgressNode.getSurfaceIndex();
??? //currentSite.getString("PEGASUS_SWF_URL");??? http://www.mypegasus.com:81
??? String url = currentSite.getString("PEGASUS_SWF_URL")+"/PreviewHandler.ashx";
??? url += "?itemuuid="+itemUUID+"&sequence="+currentSurfaceIndex;
??? System.out.println(url);
%>
<head>
??? <style type="text/css">
??????? #surface_img
??????? {
??????????? border:#000000 1px solid;
??????????? cursor:move;
??????????? position:relative;
??????? }?
?????????
??? </style>
??? <script language="JavaScript" type="text/javascript">
??? var width = 0;
??? var height = 0;
??? var zoomR = 1;

??? function onloadfun(){
??? ??? var oImg = document.getElementById("surface_img");
??? ??? width = oImg.width;
??? ??? height = oImg.height;
??? }
???
??? function ImageChange(args) {
??????? var oImg = document.getElementById("surface_img");
??????? if (args) {
??????? ??? zoomR = zoomR + 0.3;
??????????? if(zoomR > 1.5)
??????????? {
??????????? ??? zoomR = 1.5;
??????????? }
?????????? ??? oImg.width = width * zoomR;
??????????? oImg.height = height * zoomR;
??????? }
??????? else {
??????? ??? zoomR = zoomR - 0.1;
??????????? if(zoomR < 1)
??????????? {
??????????? ??? zoomR = 1;
??????????? }
?????????? ??? oImg.width = width * zoomR;
??????????? oImg.height = height * zoomR;
??????? }
??? }??

??? function ImageFixChange(){
??? ??? var oImg = document.getElementById("surface_img");
??? ??? oImg.width = width;
??? ??? oImg.height = height;
??? ??? zoomR = 1;
??? }?

??? var oBoolean = false, oLeftSpace = 0, oTopSpace = 0;
??? function mStart() {
?????? oBoolean = true;
?????? if (oBoolean) {
????????? var oImg = document.all('surface_img');
????????? oLeftSpace = window.event.clientX - oImg.style.pixelLeft;
????????? oTopSpace = window.event.clientY - oImg.style.pixelTop;
?????? }
??? }

??? function mEnd() {
?????? oBoolean = false;
??? }

??? document.onmousemove = function(event) {
?????? if (window.event.button==1 && oBoolean) {
????????? var oImg = document.all('surface_img');
????????? oImg.style.pixelLeft = window.event.clientX - oLeftSpace;
????????? oImg.style.pixelTop = window.event.clientY - oTopSpace;
????????? return false;
?????? }
??? }
??? </script>
</head>
<body>
???
??? <div id="photo_approve">
??? <div id="views" style= "overflow:auto;width:100%;height:100%">
??? ??? <center>
??? ??? ??? <img src="<%=url %>" id="surface_img" onload="onloadfun()" onMouseDown="mStart();" onMouseUp="mEnd();"/>
??? ??? </center>
<!--??? ??? <iframe allowtransparency="true" src="<%=url%>" id="previFrame" name="previewFrameName" -->
<!--??? ??? ??? frameborder="0" height="100%" width="100%">-->
<!--??? ??? ??? -->
<!--??? ??? </iframe>-->
??? ??? </div>
??? </div>
??? <div id="prevControls" src="personalizer3/b_zoomin.gif" width="98" height="23" alt="DIV中的image控件,放大,缩小,复原,拖拽" border="0" styleonClick="ImageChange(true)"/>
??? ??? <html:img env="images" src="personalizer3/b_zoomout.gif" width="98" height="23" alt="DIV中的image控件,放大,缩小,复原,拖拽" border="0" styleonClick="ImageChange(false)"/>
??? ??? <html:img env="images" src="personalizer3/b_fit.gif" width="98" height="23" alt="DIV中的image控件,放大,缩小,复原,拖拽" border="0" styleonClick="ImageFixChange()"/>
??? </div>
??? ??? <div id="buttons">
??? ??? ??? <html:a href="javascript:submitFlow('previous');"><%/* bak href='< %="/personalize3/checkout/move_item_to_personalizer.cmd?itemUUID="+itemUUID+"&subItemUUID="+subItemUUID% >' */%>
??? ??? ??? ??? <html:img env="images" src="personalizer3/b_returntopersonalizer_blue.gif" stylewidth="169" height="27" alt="DIV中的image控件,放大,缩小,复原,拖拽" border="0"/>
??? ??? ??? </html:a>
??? ??? ??? <html:a styleId="finish_link" href="javascript:submitFlow('next');">
??? ??? ??? ??? <html:img env="images" src="personalizer3/b_i_approve.gif" stylewidth="96" height="27" alt="DIV中的image控件,放大,缩小,复原,拖拽" border="0"/>
??? ??? ??? </html:a>
??? ??? ?</div>
??? <div class="clear"></div>
??? </div>

</body>
</html>