Posted By

dreamlusion on 08/24/08

Tagged

ajax
aspnet

Versions (?)

Last Edited at 08/24/08 05:12pm

Statistics

Viewed 1176 times

Favorited by 0 user(s)

Related snippets

ImgX Controls / ASP.NET AJAX Demo Page with Scanning, Upload and Thumbnail generation.

/ Published in: C#

To run this demo, you need to download and install the trial verson of ImgX Controls from [here](http://www.atalasoft.com/download/ImgX64.exe). You may also want to download a scanner emulator (TWAIN data source), such as _TWAIN WG sample source_ available with the TWAIN Toolkit [here](http://www.twain.org/devfiles/twainkit.exe).

Expand | Embed | Plain Text

Copy this code and paste it in your HTML

<%@ Page Language="C#" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<script runat="server">
	public bool ThumbnailCallback()
	{
		return false;
	}
 
	protected override void OnInit(EventArgs e)
	{
		base.OnInit(e);
		string id = Request.Params["id"];
 
		if (!string.IsNullOrEmpty(id) && Session[id] as byte[] != null)
		{
			byte[] thumbnailBytes = null;
 
			/*
			 * Microsoft Support: Bitmap and Image constructor dependencies (http://support.microsoft.com/Default.aspx?id=814675)
			 * Google: "A generic error occurred in GDI+." 2147467259 (http://www.google.gr/search?num=100&hl=en&q=%22A+generic+error+occurred+in+GDI%2B.%22+2147467259)
			 * In sort, we must keep the originating stream of an Image as long as we want to do computations with that image.
			 */
 
			using (System.IO.MemoryStream msImage = new System.IO.MemoryStream(Session[id] as byte[]))
			{
				System.Drawing.Image image = System.Drawing.Image.FromStream(msImage);
 
				using (System.IO.MemoryStream msThumbnail = new System.IO.MemoryStream())
				{
					System.Drawing.Image.GetThumbnailImageAbort myCallback =
						new System.Drawing.Image.GetThumbnailImageAbort(ThumbnailCallback);
 
					int factor = 10;
					try
					{
						factor = Int32.Parse(Request.Params["factor"]);
					}
					catch
					{
						// Ignore.
					}
 
					System.Drawing.Image thumbnail = image.GetThumbnailImage(image.Width / factor, image.Height / factor, null, IntPtr.Zero);
					thumbnail.Save(msThumbnail, System.Drawing.Imaging.ImageFormat.Jpeg);
					thumbnailBytes = new byte[msThumbnail.Length];
 
					msThumbnail.Seek(0, System.IO.SeekOrigin.Begin);
					msThumbnail.Read(thumbnailBytes, 0, thumbnailBytes.Length);
				}
			}
 
			Response.ContentType = "image/jpeg";
			Response.BinaryWrite(thumbnailBytes);
		}
	}
 
	[System.Web.Services.WebMethod]
	public static string Upload(string encodedImage)
	{
		if (string.IsNullOrEmpty(encodedImage))
			throw new ArgumentException(string.Empty, "encodedImage");
 
		string id = (new Random()).Next().ToString();
		HttpContext.Current.Session[id] = System.Convert.FromBase64String(encodedImage);
 
		return id;
	}
</script>
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
	<title></title>
</head>
<body>
	<form id="form1" runat="server">
	<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true">
	</asp:ScriptManager>
 
	<script type="text/javascript">
		function ButtonFirst_Click(evt) {
			evt.preventDefault();
 
			var imgx = $get('ImgX');
			imgx.Images.Current = imgx.Images(0);
 
			UpdateView();
		}
 
		function ButtonPrevious_Click(evt) {
			evt.preventDefault();
 
			var imgx = $get('ImgX');
			imgx.Images.Current = imgx.Images(imgx.Images.Current.Index - 1);
 
			UpdateView();
		}
 
		function ButtonNext_Click(evt) {
			evt.preventDefault();
 
			var imgx = $get('ImgX');
			imgx.Images.Current = imgx.Images(imgx.Images.Current.Index + 1);
 
			UpdateView();
		}
 
		function ButtonLast_Click(evt) {
			evt.preventDefault();
 
			var imgx = $get('ImgX');
			imgx.Images.Current = imgx.Images(imgx.Images.Count - 1);
 
			UpdateView();
		}
 
		function pageLoad(sender, e) {
			// Attach event handlers.
			$addHandler($get('<%= ButtonScan.ClientID %>'), 'click', ButtonScan_Click);
			$addHandler($get('<%= Slider1.ClientID %>'), 'change', Slider1_Change);
			$addHandler($get('<%= ButtonUpdateThumbnail.ClientID %>'), 'click', ButtonUpdateThumbnail_Click);
			$addHandler($get('<%= ButtonFirst.ClientID %>'), 'click', ButtonFirst_Click);
			$addHandler($get('<%= ButtonPrevious.ClientID %>'), 'click', ButtonPrevious_Click);
			$addHandler($get('<%= ButtonNext.ClientID %>'), 'click', ButtonNext_Click);
			$addHandler($get('<%= ButtonLast.ClientID %>'), 'click', ButtonLast_Click);
			$get('ImgXTwain').attachEvent('ImageAcquired', ImgXTwain_ImageAcquired);
 
			// ImgX initialization.
			var imgx = $get('ImgX');
			imgx.AutoZoomType = 1;
 
			UpdateView();
		}
		function Slider1_Change(evt) {
			$get('ImgX').Zoom = evt.target.value / 100;
		}
 
		function ButtonUpdateThumbnail_Click(evt) {
			evt.preventDefault();
			var imgx = $get('ImgX');
 
			var imageType = 1; // enum value for jpeg
 
			if (imgx.Images.Count > 1) {
				imageType = 3; // enum value for Tiffs
				imgx.ImgX.TIFCompression = 4; // Set packbits compression for 8, 24, 32 bit images.
			}
 
			// Get a base64 string representing our encoded image.
			var tempElement = (new ActiveXObject("Microsoft.XMLDOM")).createElement("tempElement");
			tempElement.dataType = "bin.base64";
			tempElement.nodeTypedValue = imgx.Export.ToMemoryFileVariant(imageType);
 
			// Upload
			PageMethods.Upload(tempElement.text, Upload_Success);
		}
 
		function Upload_Success(result, context, methodName) {
			var img = $get('<%=Image1.ClientID %>');
			img.src = '?id=' + result;
		}
 
		function ButtonScan_Click(evt) {
			evt.preventDefault();
			$get('ImgXTwain').Acquire(false, theForm.ImgX.hWnd);
		}
 
		function ImgXTwain_ImageAcquired(image) {
 
			var imgx = $get('ImgX');
 
			// Set scanning options. These must be set before image acquisition.
			imgx.AutoZoom = $get('<%=CheckBoxAutoZoom.ClientID %>').checked;
			imgx.AutoCrop = $get('<%=CheckBoxAutoCrop.ClientID %>').checked;
			imgx.Images.Add(theForm.ImgX.Support.GetImageFromVariant(image), 0, false);
 
			UpdateView();
		}
 
		function UpdateView() {
			var imgx = $get('ImgX');
 
			$get('<%=ButtonUpdateThumbnail.ClientID %>').disabled = imgx.Images.Count == 0;
 
			if (imgx.Images.Count < 2) {
				$get('<%=ButtonPrevious.ClientID %>').disabled =
					$get('<%=ButtonFirst.ClientID %>').disabled =
					$get('<%=ButtonLast.ClientID %>').disabled =
					$get('<%=ButtonNext.ClientID %>').disabled = true;
			}
			else {
				$get('<%=ButtonPrevious.ClientID %>').disabled =
					$get('<%=ButtonFirst.ClientID %>').disabled = imgx.Images.Current.Index == 0;
				$get('<%=ButtonLast.ClientID %>').disabled =
					$get('<%=ButtonNext.ClientID %>').disabled = imgx.Images.Count == imgx.Images.Current.Index + 1;
			}
 
			if (imgx.Images.Count > 0) {
				$get('SpanCurrent').innerHTML = imgx.Images.Current.Index + 1;
				$get('SpanCount').innerHTML = imgx.Images.Count;
			}
			else {
				$get('SpanCurrent').innerHTML = $get('SpanCount').innerHTML = 0;
			}
 
			$find("<%=SliderExtender1.ClientID%>").set_Value(Math.round(imgx.Zoom * 100));
		}
	</script>
 
	<div>
		<div style="display: none">
			<object id="ImgXTwain" classid="CLSID:354D91A8-E3C9-491F-BB89-0FB27DEEED86">
			</object>
		</div>
		<div style="float: left; position: relative; top: 25px; margin: 5px;">
			<ajaxToolKit:SliderExtender ID="SliderExtender1" runat="server" TargetControlID="Slider1"
				Minimum="1" RaiseChangeOnlyOnMouseUp="false" Orientation="Vertical" BoundControlID="Slider1_BoundControl">
			</ajaxToolKit:SliderExtender>
			<asp:TextBox ID="Slider1" runat="server"></asp:TextBox>
			<asp:Label ID="Slider1_BoundControl" runat="server"></asp:Label>%
		</div>
		<div style="float: left">
			<asp:Panel ID="Panel3" runat="server" Style="text-align: center;">
				<asp:Button ID="ButtonFirst" runat="server" Text="<< First" />
				<asp:Button ID="ButtonPrevious" runat="server" Text="< Previous" />
				<span id="SpanCurrent"></span>&nbsp;of&nbsp;<span id="SpanCount"></span>
				<asp:Button ID="ButtonNext" runat="server" Text="Next >" />
				<asp:Button ID="ButtonLast" runat="server" Text="Last >>" />
			</asp:Panel>
			<object id="ImgX" classid="clsid:111A5E7A-EAAC-433A-B56B-0AF470BE6306" style="width: 353px;
				height: 500px;">
				<param name="BackColor" value="16777215" />
				<param name="MouseTool" value="2" />
				<param name="AntialiasDisplay" value="True" />
				<param name="Center" value="True" />
				<param name="UndoLevels" value="3" />
			</object>
		</div>
		<div style="float: left; width: 400px; margin-left: 10px">
			<asp:Panel ID="Panel1" runat="server" GroupingText="Scan">
				<asp:Button ID="ButtonScan" runat="server" Text="Scan" Style="float: right" />
				<asp:CheckBox ID="CheckBoxAutoZoom" runat="server" Text="AutoZoom" Checked="true" />
				<asp:CheckBox ID="CheckBoxAutoCrop" runat="server" Text="AutoCrop" Checked="true" />
			</asp:Panel>
			<asp:Panel ID="Panel2" runat="server" GroupingText="Thumbnail">
				<asp:Button ID="ButtonUpdateThumbnail" runat="server" Text="Update" Style="float: right" />
				<asp:Image ID="Image1" runat="server" />
			</asp:Panel>
			<asp:Panel ID="Panel5" runat="server" GroupingText="Edit">
				<asp:Button ID="ButtonRemove" runat="server" Text="Remove" ToolTip="Remove image from collection" />
			</asp:Panel>
		</div>
	</div>
	</form>
</body>
</html>