<%@ Page Language="VB" AutoEventWireup="false" CodeFile="imagemap2.aspx.vb" Inherits="imagemap2" %>
<!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 runat="server">
<title></title>
<script type="text/javascript" src="js/jquery-1.js"></script>
<script type="text/javascript" src="js/jquery_002.js"></script>
<script type="text/javascript" language="javascript" src="Js/jquery14.js"></script>
<style type="text/css">
.style1
{
width: 100%;
}
</style>
<script language="javascript" type="text/javascript">
var oldDataObject = null;
// document.getElementById("popdiv").style.left = parseInt((screen.width - 1100) / 2) + "px";
// document.getElementById("popdiv").style.top = "80px";
function pageLoad() {
$('.map').maphilight();
$('#starlink2').click(function (e) {
e.preventDefault();
var data = $('#star').data('maphilight') || {};
data.alwaysOn = true;
$('#star').data('maphilight', data).trigger('alwaysOn.maphilight');
});
}
function SetSelection(myObj) {
if (oldDataObject != null) {
var data = $(oldDataObject).data('maphilight') || {};
data.alwaysOn = false;
$(oldDataObject).data('maphilight', data).trigger('alwaysOn.maphilight');
}
var data = $(myObj).data('maphilight') || {
};
data.alwaysOn = true;
$(myObj).data('maphilight', data).trigger('alwaysOn.maphilight');
document.getElementById("txtbox").value = myObj;
oldDataObject = myObj;
// show(myObj)
}
function showbox(aid) {
alert("sdfd");
var url = ("Regform.aspx?myid=" + aid);
aaid = aid;
document.getElementById("popouter").style.display = "inline";
document.getElementById("viewad").src = url.toString();
// alert(document.getElementById("viewad").src);
// var min2 = parseInt(TextBox1.value) / 60;
document.getElementById("divclose").style.display = "inline";
// CountDown();
}
function close2() {
document.getElementById("popouter").style.display = "none";
// obj = document.getElementById("popouter");
//document.body.removeChild(obj);
document.getElementById("viewad").src = "";
}
</script>
<style>
.mymap a
{
background-color: Red;
}
</style>
<style>
#popouter
{
width: 100%;
height: 1100px;
background: url(images/POPbg.png );
z-index: 1200;
position: absolute;
}
#popdiv
{
width: 500px;
background-color: #dedede;
border: solid 4px #FFFFFF;
left: 0px;
top: 100px;
position: absolute;
}
</style>
</head>
<body onload="javascript:pageLoad();">
<form id="form1" runat="server">
<div id="popouter" style="display: none;">
<div id="popdiv">
<%--<div style="text-align:right; padding:5px;" width="900px"><a onClick="closepopup();" style="cursor:pointer;">Close</a></div>--%>
<table>
<tr>
<td style="white-space: nowrap;">
</td>
<td style="white-space: nowrap;">
<div id="SecDiv" style="font-family: @Arial Unicode MS; float: left; font-size: 15px;
font-weight: bold;">
</div>
</td>
<td align="right" style="padding-left: 400px;">
<div id="divclose" style="text-align: right; padding: 5px; display: none; width: 400px;">
<a onclick="close2();" style="cursor: pointer;">Close</a></div>
</td>
</tr>
</table>
<div>
<iframe id="viewad" src="#" height="600px" width="500px"></iframe>
</div>
</div>
</div>
<script type="text/javascript" language="javascript">
$(document).ready(function () {
var x1, x2, y1, y2;
$("#imgDesert").mousedown(function (e) {
$("#current").attr({ id: '' })
box = $('<div style="border:1px #FF00FF solid;position:absolute; background-color:#ff0000; filter:alpha(opacity=20);opacity:0.2">').hide();
$("#imgDesert").append(box);
x1 = e.pageX;
y1 = e.pageY;
box.attr({ id: 'current', "class": "box1" }).css({
top: y1, //offsets
left: x1 //offsets
// document.getElementById("text").innerHTML="xx"
// document.getElementById("text").innerHTML="X1"+x1+" "+" Y1"+y1;
}).fadeIn();
});
$("#imgDesert").mousemove(function (e) {
$("#current").css({
width: Math.abs(e.pageX - x1), //offsets
height: Math.abs(e.pageY - y1) //offsets
}).fadeIn();
});
$("#imgDesert").mouseup(function (e) {
$("#current").attr({ id: '' })
box = $('<div style="border:1px #FF00FF solid;position:absolute; background-color:#ff0000; filter:alpha(opacity=20);opacity:0.2">').hide();
$("#imgDesert").append(box);
x2 = e.pageX;
y2 = e.pageY;
$("#txtbox0").val(x1)
$("#txtbox1").val(y1)
$("#txtbox2").val(x2)
$("#txtbox3").val(y2)
var nid = getnewid()
// alert("t"+nid.value)
$("#txtbox").val(nid.value)
// $("#txtbox").val("x1:" + x1 + " y1:" + y1 + "x2" + x2 + "y2" + y2)
//savetoDB(x1, x2, y1, y2);
});
});
function getnewid() {
var Response = myAjax.nextid();
return Response;
}
function savetoDB(x1, x2, y1, y2) {
// alert("X1 : " + x1 + "\n X2 : " + x2 + "\n Y1 : " + y1 + "\n Y2 : " + y2);
var nid = document.getElementById("txtbox").value;
var x1 = document.getElementById("txtbox0").value;
var y1 = document.getElementById("txtbox1").value;
var x2 = document.getElementById("txtbox2").value;
var y2 = document.getElementById("txtbox3").value;
var Response = myAjax.savedb(nid, x1, y1, x2, y2, 'test');
alert(Response.value);
}
</script>
<br />
<table class="style1">
<tr>
<td>
</td>
<td>
</td>
</tr>
<tr>
<td>
ID
<input id="txtbox" name="txtbox" type="text" />
</td>
<td>
</td>
</tr>
<tr>
<td colspan="2">
X1 <input id="txtbox0" name="txtbox0" type="text" />
Y1
<input id="txtbox1" name="txtbox1" type="text" /> X2
<input id="txtbox2" name="txtbox2" type="text" /> Y2
<input id="txtbox3" name="txtbox3" type="text" />
<input type="button" value="save" onclick="return savetoDB();" />
</td>
</tr>
<tr>
<td>
</td>
<td>
</td>
</tr>
</table>
<div class="map" id="imgDesert">
<img src="images/img/bg1.jpg" class="map" usemap="#features" alt="myimage" /></div>
<asp:Literal ID="Literal1" runat="server"></asp:Literal>
</form>
</body>
</html>
Imports System.Text
Partial Class imagemap2
Inherits System.Web.UI.Page
Dim aj As New myAjax
Dim Con As New SqlConnection(ConfigurationManager.ConnectionStrings("connection").ConnectionString)
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
AjaxPro.Utility.RegisterTypeForAjax(GetType(myAjax))
Con.Open()
Dim cmd As SqlCommand = New SqlCommand("select * from tblsave", Con)
Dim sdr As SqlDataReader = cmd.ExecuteReader()
Dim sb As StringBuilder = New StringBuilder()
sb.Append("<map name='features' id='features'>")
While (sdr.Read())
Dim x1 As Integer = sdr(2).ToString()
Dim y1 As Integer = sdr(3).ToString()
Dim x2 As Integer = sdr(4).ToString()
Dim y2 As Integer = sdr(5).ToString()
x1 = x1 - 0
y1 = y1 - 135
x2 = x2 - 0
y2 = y2 - 135
Dim str As String = "<area shape='rect' class='mymap' id='" & sdr(1).ToString() & "' title='" & sdr(1).ToString() & "' "
str = str & " onclick='javascript:showbox('" & sdr(1).ToString() & "');' coords='" & x1 & "," & y1 & "," & x2 & "," & y2 & "' href='#' />"
'str = str & " coords='" & x1 & "," & y1 & "," & x2 & "," & y2 & "' href='#' />"
sb.Append(str.ToString())
End While
sb.Append("</map>")
Literal1.Text = sb.ToString()
Con.Close()
End Sub
End Class
No comments :
Post a Comment