
/******************************************
* Popup Box- By Jim Silver @ jimsilver47@yahoo.com
* Visit http://www.dynamicdrive.com/ for full source code
* This notice must stay intact for use
******************************************/

	//function getCoord()
	//{
		//var obj = document.getElementById("add_element");
		//alert(obj);
		//obj.add_element = new Object();
		function findPos(nameVar){
			var obj = document.getElementById(nameVar);
			var posX = obj.offsetLeft;var posY = obj.offsetTop;
			while(obj.offsetParent){
				posX=posX+obj.offsetParent.offsetLeft;
				posY=posY+obj.offsetParent.offsetTop;
			if(obj==document.getElementsByTagName('body')[0]){break}
			else{obj=obj.offsetParent;}
		}
		alert(posX+'-'+posY)
		}
		//sessvars.lefty.toString();
		//sessvars.toppy.toString();
	//}
	
	
	
function hideDiv(varDivName)
{
	crossobj=ns6? document.getElementById(varDivName) : document.all[varDivName]
	if (ie4||ns6)
	crossobj.style.visibility="hidden"
	else if (ns4)
	document.varDivName.visibility="hide"
}

function showDiv(varDivName)
{
	crossobj=ns6? document.getElementById(varDivName) : document.all.varDivName
	if (ie4||ns6)
	crossobj.style.visibility="visible"
	else if (ns4)
	document.varDivName.visibility="show"
}

var ns4=document.layers
var ie4=document.all
var ns6=document.getElementById&&!document.all

//drag drop function for NS 4////
/////////////////////////////////

var dragswitch=0
var nsx
var nsy
var nstemp

function drag_dropns(name){
if (!ns4)
return
temp=eval(name)
temp.captureEvents(Event.MOUSEDOWN | Event.MOUSEUP)
temp.onmousedown=gons
temp.onmousemove=dragns
temp.onmouseup=stopns
}

function gons(e){
temp.captureEvents(Event.MOUSEMOVE)
nsx=e.x
nsy=e.y
}
function dragns(e){
if (dragswitch==1){
temp.moveBy(e.x-nsx,e.y-nsy)
return false
}
}

function stopns(){
temp.releaseEvents(Event.MOUSEMOVE)
}

//drag drop function for ie4+ and NS6////
/////////////////////////////////


function drag_drop(e){
if (ie4&&dragapproved){
crossobj.style.left=tempx+event.clientX-offsetx
crossobj.style.top=tempy+event.clientY-offsety
return false
}
else if (ns6&&dragapproved){
crossobj.style.left=tempx+e.clientX-offsetx+"px"
crossobj.style.top=tempy+e.clientY-offsety+"px"
return false
}
}

function initializedrag(e){
crossobj=ns6? document.getElementById("showimage") : document.all.showimage
var firedobj=ns6? e.target : event.srcElement
var topelement=ns6? "html" : document.compatMode && document.compatMode!="BackCompat"? "documentElement" : "body"
while (firedobj.tagName!=topelement.toUpperCase() && firedobj.id!="dragbar"){
firedobj=ns6? firedobj.parentNode : firedobj.parentElement
}

if (firedobj.id=="dragbar"){
offsetx=ie4? event.clientX : e.clientX
offsety=ie4? event.clientY : e.clientY

tempx=parseInt(crossobj.style.left)
tempy=parseInt(crossobj.style.top)

dragapproved=true
document.onmousemove=drag_drop
}
}
document.onmouseup=new Function("dragapproved=false")

////drag drop functions end here//////

function hidebox(){
crossobj=ns6? document.getElementById("showimage") : document.all.showimage
if (ie4||ns6)
crossobj.style.visibility="hidden"
else if (ns4)
document.showimage.visibility="hide"
document.getElementById('holder').innerHTML="\n"+ 
"<div id='showimage' style='position:relative; width:540px; z-index:200; '>\n"+
"</div>\n"+
"";
}
function showbox(){
crossobj=ns6? document.getElementById("showimage") : document.all.showimage
if (ie4||ns6)
crossobj.style.visibility="visible"
else if (ns4)
document.showimage.visibility="show"
}

function infoDiv(imageName,imageProp,setX)
{
	
	
	var newImage = imageProp;
	
	document.getElementById('holder').innerHTML="\n"+ 
			"<div id='showimage' style='position:relative; width:540px; height:302px  z-index:200; background-image: url(images/prod_sample_pop-up.gif); background-repeat:no-repeat'>\n"+
				"<table border='0' width='540' cellspacing='0' cellpadding='0' border='0'>\n"+
				  "<tr>\n"+
					"<td width='418' ></td>\n"+
					"<td style='cursor:hand; width:122px; text-align:left'><a href='#' onClick='hidebox();return false'><img src='images/prod_sample_close.gif' width='122' height='27' border=0></a></td>\n"+
				  "</tr>\n"+
				  "<tr>\n"+
					"<td style='text-align:center; vertical-align:top; width:534px; height:277px; padding-left:5px' colspan='2'>\n"+
				
				"<!-- PUT YOUR CONTENT BETWEEN HERE -->\n"+
				
				" " + newImage + "\n"+
				
				"<!-- END YOUR CONTENT HERE -->\n"+
				
					"</td>\n"+
					"</tr>\n"+
				"</table>\n"+
			"</div>\n"+
		"";
	
	var obj = document.getElementById(imageName);
			var posX = obj.offsetLeft;var posY = obj.offsetTop;
			while(obj.offsetParent){
				posX=posX+obj.offsetParent.offsetLeft;
				posY=posY+obj.offsetParent.offsetTop;
				if(obj==document.getElementsByTagName('body')[0]){break}
				else{obj=obj.offsetParent;}
			}
		
	var newX = setX;
	var newY = posY;
	
	function moveIt()
	{
		var obj = document.getElementById('add_element');
		var obj2 = document.getElementById('holder');
		obj2.style.top = newY + 'px';
		obj2.style.left = newX + 'px';
		//alert(posX+'-'+posY)
	}
	moveIt();
	//newdiv = document.createElement("<div id='showimage' style='position:absolute; height:100px; width:250px; left:400px; top:1100px; z-index:200; background-color:#000'>fsdfsdfsdfs</div>");
	//newdiv.innerHTML = "this is where it happens";
	//container = document.getElementById("container");
	//container.appendChild(newdiv);

}

function bulletDiv(imageName,setX)
{
	
	
	
		function findPos(imageName){
			
		}
	
	var newImage = imageName;
	if (newImage == "vector_formats"){
	document.getElementById('holder').innerHTML="\n"+ 
			"<div id='showimage' style='position:relative; width:540px; height:228px  z-index:200; background-image: url(images/prod_sample_pop-up228.gif); background-repeat:no-repeat'>\n"+
				"<table border='0' width='540' cellspacing='0' cellpadding='0' border='0'>\n"+
				  "<tr>\n"+
					"<td style='width:408px; text-align:left; padding-left:10px; padding-top:2px; font-weight:bold; font-size:16px; font-family:Arial, Helvetica, sans-serif; color:#666666'>Vector Format Features</td>\n"+
					"<td style='cursor:hand; width:122px; text-align:left'><a href='#' onClick='hidebox();return false'><img src='images/prod_bullets_close.gif' width='122' height='27' border=0></a></td>\n"+
				  "</tr>\n"+
				  "<tr>\n"+
					"<td style='text-align:left; vertical-align:top; width:534px; height:277px; padding-left:0px; padding-right:10px; font-size:12px; font-family:Arial, Helvetica, sans-serif;' colspan='2' >\n"+
				
				"<!-- PUT YOUR CONTENT BETWEEN HERE -->\n"+
								"<br />\n"+
                                "<ul class='li_shift'>\n"+
								"<li><span>Includes enhanced reading, writing, and rendering of vector images</span></li>\n"+
								"<li><span>Reads and writes DWG and DXF file formats for release version 16 of AutoCAD, including AutoCAD 2006</span></li>\n"+
								"<li><span>Creates applications that render 3D wireframe objects</span></li>\n"+ 
								"<li><span>Creates applications that render solid 3D objects with adjustable lighting for shading purposes</span></li>\n"+
								"<li><span>Supports reading and writing SVG file format</span></li>\n"+
                                "</ul>\n"+
				
				
				"<!-- END YOUR CONTENT HERE -->\n"+
				
					"</td>\n"+
					"</tr>\n"+
				"</table>\n"+
			"</div>\n"+
		"";
	}
	if (newImage == "file_loading"){
	document.getElementById('holder').innerHTML="\n"+ 
			"<div id='showimage' style='position:relative; width:540px; height:302px  z-index:200; background-image: url(images/prod_sample_pop-up.gif); background-repeat:no-repeat'>\n"+
				"<table border='0' width='540' cellspacing='0' cellpadding='0' border='0'>\n"+
				  "<tr>\n"+
					"<td style='width:408px; text-align:left; padding-left:10px; padding-top:2px; font-weight:bold; font-size:16px; font-family:Arial, Helvetica, sans-serif; color:#666666'>File Loading &amp; Saving Features</td>\n"+
					"<td style='cursor:hand; width:122px; text-align:left'><a href='#' onClick='hidebox();return false'><img src='images/prod_bullets_close.gif' width='122' height='27' border=0></a></td>\n"+
				  "</tr>\n"+
				  "<tr>\n"+
					"<td style='text-align:left; vertical-align:top; width:534px; height:277px; padding-left:0px; padding-right:10px; font-size:12px; font-family:Arial, Helvetica, sans-serif;' colspan='2' >\n"+
				  "<table border='0' width='520' cellspacing='0' cellpadding='0' border='0'>\n"+
				  "<tr>\n"+
					"<td style='text-align:left; vertical-align:top; width:260px; height:277px; padding-left:0px; padding-right:10px; font-size:12px; font-family:Arial, Helvetica, sans-serif;' colspan='2' >\n"+
				
				"<!-- PUT YOUR CONTENT BETWEEN HERE -->\n"+
								"<br />\n"+
                                "<ul class='li_shift'>\n"+
								"<li><span>Supports highly flexible image file reading and writing</span></li>\n"+
								"<li><span>Enables access to all pages of any multi-page file</span></li>\n"+
								"<li><span>Offers robust save options for complete format control of all supported formats</span></li>\n"+
								"<li><span>Delivers fast TIFF, JPEG, GIF, MO:DCA, and Group IV processing</span></li>\n"+
								"<li><span>Includes Simple URL Loading (regular image loading APIs) and Advanced Loading (special API to load a file from URL, FTP, or Gopher)</span></li>\n"+
                                "</ul>\n"+
				
				
				"<!-- END YOUR CONTENT HERE -->\n"+
				
					"</td>\n"+
					"<td style='text-align:left; vertical-align:top; width:260px; height:277px; padding-left:0px; padding-right:10px; font-size:12px; font-family:Arial, Helvetica, sans-serif;' colspan='2' >\n"+
								"<br />\n"+
                                "<ul class='li_shift'>\n"+
								"<li><span>Features a call-back mechanism for adding your own algorithms during load and save </span></li>\n"+
								"<li><span>Allows access to each line of an image while loading and saving</span></li>\n"+
								"<li><span>Supports the replacement of IO functions (read, write, seek, etc.) with your own functions, if desired</span></li>\n"+
								"<li><span>Reads from memory, path, URL, FTP, port, and more</span></li>\n"+
								"<li><span>Reads any sub-region of an image</span></li>\n"+
                                "</ul>\n"+
					"</td>\n"+
					"</tr>\n"+
				"</table>\n"+
					"</td>\n"+
					"</tr>\n"+
				"</table>\n"+
			"</div>\n"+
		"";
	}
	if (newImage == "image_editing"){
	document.getElementById('holder').innerHTML="\n"+ 
			"<div id='showimage' style='position:relative; width:540px; height:302px  z-index:200; background-image: url(images/prod_sample_pop-up.gif); background-repeat:no-repeat'>\n"+
				"<table border='0' width='540' cellspacing='0' cellpadding='0' border='0'>\n"+
				  "<tr>\n"+
					"<td style='width:408px; text-align:left; padding-left:10px; padding-top:2px; font-weight:bold; font-size:16px; font-family:Arial, Helvetica, sans-serif; color:#666666'>Photo &amp; Color Image Processing & Editing Features</td>\n"+
					"<td style='cursor:hand; width:122px; text-align:left'><a href='#' onClick='hidebox();return false'><img src='images/prod_bullets_close.gif' width='122' height='27' border=0></a></td>\n"+
				  "</tr>\n"+
				  "<tr>\n"+
					"<td style='text-align:left; vertical-align:top; width:534px; height:277px; padding-left:0px; padding-right:10px; font-size:12px; font-family:Arial, Helvetica, sans-serif;' colspan='2' >\n"+
				
				"<!-- PUT YOUR CONTENT BETWEEN HERE -->\n"+
								"<br />\n"+
                                "<ul class='li_shift' style=\"line-height:10px\">\n"+
								"<li style=\"line-height:10px\"><span>Image Maintenance, such as Crop, Resize, Thumbnail Creation, Encryption, and Decryption</span></li>\n"+
"<li style=\"line-height:10px\"><span>Image Transformation, such as Rotate </span></li>\n"+
"<li style=\"line-height:10px\"><span>Area Detection and Processing, using a predefined or custom pixel checking method</span></li>\n"+
"<li><span>Region of Interest (ROI) support permits specification of a shape, such as Ellipse, Polygon, Freehand, or a 1-bit mask, for identifying pixels to include/exclude from image processing algorithms</span></li>\n"+
"<li><span>Powerful Color Reduction methods available for maximum quality and minimum size, using Dithering or Halftone</span></li>\n"+
"<li><span>Advanced filtering, including Sharpen, Smooth, and Convolution</span></li>\n"+
"<li><span>Red-Eye Removal removes the \"red eye\" effect in color images by converting the red color in the eye to the new specified color</span></li>\n"+
"<li><span>Special Effects, including Mosaic, Perspective, Solarize, Blur, Diffuse, Pinch, and more</span></li>\n"+
                                "</ul>\n"+
                                "<br /><br /><br />\n"+
				
				
				"<!-- END YOUR CONTENT HERE -->\n"+
				
					"</td>\n"+
					"</tr>\n"+
				"</table>\n"+
			"</div>\n"+
		"";
	}
	
	if (newImage == "color_processing"){
	document.getElementById('holder').innerHTML="\n"+ 
			"<div id='showimage' style='position:relative; width:540px; height:302px  z-index:200; background-image: url(images/prod_sample_pop-up.gif); background-repeat:no-repeat'>\n"+
				"<table border='0' width='540' cellspacing='0' cellpadding='0' border='0'>\n"+
				  "<tr>\n"+
					"<td style='width:408px; text-align:left; padding-left:10px; padding-top:2px; font-weight:bold; font-size:16px; font-family:Arial, Helvetica, sans-serif; color:#666666'>Photo &amp; Color Image Processing & Editing Features</td>\n"+
					"<td style='cursor:hand; width:122px; text-align:left'><a href='#' onClick='hidebox();return false'><img src='images/prod_bullets_close.gif' width='122' height='27' border=0></a></td>\n"+
				  "</tr>\n"+
				  "<tr>\n"+
					"<td style='text-align:left; vertical-align:top; width:534px; height:277px; padding-left:0px; padding-right:10px; font-size:12px; font-family:Arial, Helvetica, sans-serif;' colspan='2' >\n"+
				
				"<!-- PUT YOUR CONTENT BETWEEN HERE -->\n"+
								"<br />\n"+
                                "<ul class='li_shift'>\n"+
								"<li><span>Advanced Image Processing methods, such as Adjust Brightness and Contrast, Reduce or Promote Bit Depth, and Sepia</span></li>\n"+
								"<li><span>ICC color profile support allows for accurate color display</span></li>\n"+
								"<li><span>Pantone channels support for true image representation</span></li>\n"+
								"<li><span>Blending and Combining Images combines data from two or more images, such as Alpha Blend</span></li>\n"+
								"<li><span>Color Promotion functions increase the bit depth, or number of bits per pixel, of an image</span></li>\n"+
								"<li><span>Contrast Alteration functions operate by altering the range of pixel intensities that occur in an image, or by redistributing the occurrence frequency of the pixel intensities</span></li>\n"+
								"<li><span>Image Analysis provides a histogram-generating function while another function provides a count of different colors in the specified rectangle of an image</span></li>\n"+
                                "</ul>\n"+
                                "<br /><br /><br />\n"+
				
				
				"<!-- END YOUR CONTENT HERE -->\n"+
				
					"</td>\n"+
					"</tr>\n"+
				"</table>\n"+
			"</div>\n"+
		"";
	}
	if (newImage == "twain_scanning"){
	document.getElementById('holder').innerHTML="\n"+ 
			"<div id='showimage' style='position:relative; width:540px; height:302px  z-index:200; background-image: url(images/prod_sample_pop-up.gif); background-repeat:no-repeat'>\n"+
				"<table border='0' width='540' cellspacing='0' cellpadding='0' border='0'>\n"+
				  "<tr>\n"+
					"<td style='width:408px; text-align:left; padding-left:10px; padding-top:2px; font-weight:bold; font-size:16px; font-family:Arial, Helvetica, sans-serif; color:#666666'>TWAIN Scanning Features</td>\n"+
					"<td style='cursor:hand; width:122px; text-align:left'><a href='#' onClick='hidebox();return false'><img src='images/prod_bullets_close.gif' width='122' height='27' border=0></a></td>\n"+
				  "</tr>\n"+
				  "<tr>\n"+
					"<td style='text-align:left; vertical-align:top; width:534px; height:277px; padding-left:0px; padding-right:10px; font-size:12px; font-family:Arial, Helvetica, sans-serif;' colspan='2' >\n"+
				  "<table border='0' width='520' cellspacing='0' cellpadding='0' border='0'>\n"+
				  "<tr>\n"+
					"<td style='text-align:left; vertical-align:top; width:260px; height:277px; padding-left:0px; padding-right:10px; font-size:12px; font-family:Arial, Helvetica, sans-serif;' colspan='2' >\n"+
				
				"<!-- PUT YOUR CONTENT BETWEEN HERE -->\n"+
								"<br />\n"+
                                "<ul class='li_shift'>\n"+
								"<li><span>Provides comprehensive support for the latest TWAIN devices including scanners, digital cameras, and video capture boards</span></li>\n"+
								"<li><span>Works with multi-page and single page scanning, with configurable parameters</span></li>\n"+
								"<li><span>Easily works with TWAIN v1.6, v1.7, v1.8, and v1.9</span></li>\n"+
								"<li><span>Quickly defines the TWAIN transfer mode</span></li>\n"+
								"<li><span>Programatically controls the display of the TWAIN UI</span></li>\n"+
                                "</ul>\n"+
				
				
				"<!-- END YOUR CONTENT HERE -->\n"+
				
					"</td>\n"+
					"<td style='text-align:left; vertical-align:top; width:260px; height:277px; padding-left:0px; padding-right:10px; font-size:12px; font-family:Arial, Helvetica, sans-serif;' colspan='2' >\n"+
								"<br />\n"+
                                "<ul class='li_shift'>\n"+
								"<li><span>Controls all scanner capabilities within your program</span></li>\n"+
								"<li><span>Interfaces with TWAIN data source listing </span></li>\n"+
								"<li><span>Indicates the brightness and contrast during acquisition</span></li>\n"+
								"<li><span>Defines the resolution for acquisition </span></li>\n"+
								"<li><span>Offers a single call function to initiate the scanning process</span></li>\n"+
								"<li><span>Uses events to control the scanning process</span></li>\n"+
                                "</ul>\n"+
					"</td>\n"+
					"</tr>\n"+
				"</table>\n"+
					"</td>\n"+
					"</tr>\n"+
				"</table>\n"+
			"</div>\n"+
		"";
	}
	if (newImage == "annotation"){
	document.getElementById('holder').innerHTML="\n"+ 
			"<div id='showimage' style='position:relative; width:540px; height:302px  z-index:200; background-image: url(images/prod_sample_pop-up.gif); background-repeat:no-repeat'>\n"+
				"<table border='0' width='540' cellspacing='0' cellpadding='0' border='0'>\n"+
				  "<tr>\n"+
					"<td style='width:408px; text-align:left; padding-left:10px; padding-top:2px; font-weight:bold; font-size:16px; font-family:Arial, Helvetica, sans-serif; color:#666666'>Annotation Features</td>\n"+
					"<td style='cursor:hand; width:122px; text-align:left'><a href='#' onClick='hidebox();return false'><img src='images/prod_bullets_close.gif' width='122' height='27' border=0></a></td>\n"+
				  "</tr>\n"+
				  "<tr>\n"+
					"<td style='text-align:left; vertical-align:top; width:534px; height:277px; padding-left:0px; padding-right:10px; font-size:12px; font-family:Arial, Helvetica, sans-serif;' colspan='2' >\n"+
				
				  "<table border='0' width='520' cellspacing='0' cellpadding='0' border='0'>\n"+
				  "<tr>\n"+
					"<td style='text-align:left; vertical-align:top; width:260px; height:277px; padding-left:0px; padding-right:10px; font-size:12px; font-family:Arial, Helvetica, sans-serif;' colspan='2' >\n"+
				
				"<!-- PUT YOUR CONTENT BETWEEN HERE -->\n"+
								"<br />\n"+
                                "<ul class='li_shift'>\n"+
								"<li><span>Includes support for WinForms, WPF, and ASP.NET</span></li>\n"+
								"<li><span>Offers easy to implement UI elements with XML-based annotation for images and medical data</span></li>\n"+
								"<li><span>Provides comprehensive Annotation Support, including Adding, Editing, Burning-In, and Deleting</span></li>\n"+
								"<li><span>Contains the Accusoft Redlining Toolkit&#8482; (ART), enabling annotation on images and documents such as Lines, Arrows, Highlighting, Sticky Notes, and much more</span></li>\n"+
                                "</ul>\n"+
				
				
				"<!-- END YOUR CONTENT HERE -->\n"+
				
					"</td>\n"+
					"<td style='text-align:left; vertical-align:top; width:260px; height:277px; padding-left:0px; padding-right:10px; font-size:12px; font-family:Arial, Helvetica, sans-serif;' colspan='2' >\n"+
								"<br />\n"+
                                "The ART component provides the ability to annotate images and documents, including \"sticky\" note attachments, highlights, arrows, markers, free-form text, and other indicators. It also includes redaction capabilities for censoring sensitive documents. Annotations can be merged with an image or kept in a separate file and overlaid on the image at display time. In this way, the original image is never directly altered. The ART component is a flexible and powerful annotation toolkit. It provides a convenient way to add annotations, drawings, hyperlinks, and more to your images.\n"+
					"</td>\n"+
					"</tr>\n"+
				"</table>\n"+
					"</td>\n"+
					"</tr>\n"+
				"</table>\n"+
			"</div>\n"+
				
				
				
				
				
				
				
		"";
	}
	
	var obj = document.getElementById(imageName);
			var posX = obj.offsetLeft;var posY = obj.offsetTop;
			while(obj.offsetParent){
				posX=posX+obj.offsetParent.offsetLeft;
				posY=posY+obj.offsetParent.offsetTop;
				if(obj==document.getElementsByTagName('body')[0]){break}
				else{obj=obj.offsetParent;}
			}
		
	var newX = setX;
	var newY = posY;
	
	function moveIt()
	{
		var obj = document.getElementById('add_element');
		var obj2 = document.getElementById('holder');
		obj2.style.top = newY + 'px';
		obj2.style.left = newX + 'px';
		//alert(posX+'-'+posY)
	}
	moveIt();
	//newdiv = document.createElement("<div id='showimage' style='position:absolute; height:100px; width:250px; left:400px; top:1100px; z-index:200; background-color:#000'>fsdfsdfsdfs</div>");
	//newdiv.innerHTML = "this is where it happens";
	//container = document.getElementById("container");
	//container.appendChild(newdiv);

}
