Posted By

dreamlusion on 08/24/08


Tagged

ajax aspnet imgx


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

umang_nine


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


 / Published in: C#
 

URL: http://dreamlusion.eucoding.com/doku.php?id=blog:2008:08:imgx_controls_aspnet_ajax

To run this demo, you need to download and install the trial verson of ImgX Controls from here. You may also want to download a scanner emulator (TWAIN data source), such as TWAIN WG sample source available with the TWAIN Toolkit here.

  1. <%@ Page Language="C#" %>
  2.  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4.  
  5. <script runat="server">
  6. public bool ThumbnailCallback()
  7. {
  8. return false;
  9. }
  10.  
  11. protected override void OnInit(EventArgs e)
  12. {
  13. base.OnInit(e);
  14. string id = Request.Params["id"];
  15.  
  16. if (!string.IsNullOrEmpty(id) && Session[id] as byte[] != null)
  17. {
  18. byte[] thumbnailBytes = null;
  19.  
  20. /*
  21. * Microsoft Support: Bitmap and Image constructor dependencies (http://support.microsoft.com/Default.aspx?id=814675)
  22. * 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)
  23. * In sort, we must keep the originating stream of an Image as long as we want to do computations with that image.
  24. */
  25.  
  26. using (System.IO.MemoryStream msImage = new System.IO.MemoryStream(Session[id] as byte[]))
  27. {
  28. System.Drawing.Image image = System.Drawing.Image.FromStream(msImage);
  29.  
  30. using (System.IO.MemoryStream msThumbnail = new System.IO.MemoryStream())
  31. {
  32. System.Drawing.Image.GetThumbnailImageAbort myCallback =
  33. new System.Drawing.Image.GetThumbnailImageAbort(ThumbnailCallback);
  34.  
  35. int factor = 10;
  36. try
  37. {
  38. factor = Int32.Parse(Request.Params["factor"]);
  39. }
  40. catch
  41. {
  42. // Ignore.
  43. }
  44.  
  45. System.Drawing.Image thumbnail = image.GetThumbnailImage(image.Width / factor, image.Height / factor, null, IntPtr.Zero);
  46. thumbnail.Save(msThumbnail, System.Drawing.Imaging.ImageFormat.Jpeg);
  47. thumbnailBytes = new byte[msThumbnail.Length];
  48.  
  49. msThumbnail.Seek(0, System.IO.SeekOrigin.Begin);
  50. msThumbnail.Read(thumbnailBytes, 0, thumbnailBytes.Length);
  51. }
  52. }
  53.  
  54. Response.ContentType = "image/jpeg";
  55. Response.BinaryWrite(thumbnailBytes);
  56. }
  57. }
  58.  
  59. [System.Web.Services.WebMethod]
  60. public static string Upload(string encodedImage)
  61. {
  62. if (string.IsNullOrEmpty(encodedImage))
  63. throw new ArgumentException(string.Empty, "encodedImage");
  64.  
  65. string id = (new Random()).Next().ToString();
  66. HttpContext.Current.Session[id] = System.Convert.FromBase64String(encodedImage);
  67.  
  68. return id;
  69. }
  70. </script>
  71.  
  72. <html xmlns="http://www.w3.org/1999/xhtml">
  73. <head runat="server">
  74. <title></title>
  75. </head>
  76. <body>
  77. <form id="form1" runat="server">
  78. <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true">
  79. </asp:ScriptManager>
  80.  
  81. <script type="text/javascript">
  82. function ButtonFirst_Click(evt) {
  83. evt.preventDefault();
  84.  
  85. var imgx = $get('ImgX');
  86. imgx.Images.Current = imgx.Images(0);
  87.  
  88. UpdateView();
  89. }
  90.  
  91. function ButtonPrevious_Click(evt) {
  92. evt.preventDefault();
  93.  
  94. var imgx = $get('ImgX');
  95. imgx.Images.Current = imgx.Images(imgx.Images.Current.Index - 1);
  96.  
  97. UpdateView();
  98. }
  99.  
  100. function ButtonNext_Click(evt) {
  101. evt.preventDefault();
  102.  
  103. var imgx = $get('ImgX');
  104. imgx.Images.Current = imgx.Images(imgx.Images.Current.Index + 1);
  105.  
  106. UpdateView();
  107. }
  108.  
  109. function ButtonLast_Click(evt) {
  110. evt.preventDefault();
  111.  
  112. var imgx = $get('ImgX');
  113. imgx.Images.Current = imgx.Images(imgx.Images.Count - 1);
  114.  
  115. UpdateView();
  116. }
  117.  
  118. function pageLoad(sender, e) {
  119. // Attach event handlers.
  120. $addHandler($get('<%= ButtonScan.ClientID %>'), 'click', ButtonScan_Click);
  121. $addHandler($get('<%= Slider1.ClientID %>'), 'change', Slider1_Change);
  122. $addHandler($get('<%= ButtonUpdateThumbnail.ClientID %>'), 'click', ButtonUpdateThumbnail_Click);
  123. $addHandler($get('<%= ButtonFirst.ClientID %>'), 'click', ButtonFirst_Click);
  124. $addHandler($get('<%= ButtonPrevious.ClientID %>'), 'click', ButtonPrevious_Click);
  125. $addHandler($get('<%= ButtonNext.ClientID %>'), 'click', ButtonNext_Click);
  126. $addHandler($get('<%= ButtonLast.ClientID %>'), 'click', ButtonLast_Click);
  127. $get('ImgXTwain').attachEvent('ImageAcquired', ImgXTwain_ImageAcquired);
  128.  
  129. // ImgX initialization.
  130. var imgx = $get('ImgX');
  131. imgx.AutoZoomType = 1;
  132.  
  133. UpdateView();
  134. }
  135. function Slider1_Change(evt) {
  136. $get('ImgX').Zoom = evt.target.value / 100;
  137. }
  138.  
  139. function ButtonUpdateThumbnail_Click(evt) {
  140. evt.preventDefault();
  141. var imgx = $get('ImgX');
  142.  
  143. var imageType = 1; // enum value for jpeg
  144.  
  145. if (imgx.Images.Count > 1) {
  146. imageType = 3; // enum value for Tiffs
  147. imgx.ImgX.TIFCompression = 4; // Set packbits compression for 8, 24, 32 bit images.
  148. }
  149.  
  150. // Get a base64 string representing our encoded image.
  151. var tempElement = (new ActiveXObject("Microsoft.XMLDOM")).createElement("tempElement");
  152. tempElement.dataType = "bin.base64";
  153. tempElement.nodeTypedValue = imgx.Export.ToMemoryFileVariant(imageType);
  154.  
  155. // Upload
  156. PageMethods.Upload(tempElement.text, Upload_Success);
  157. }
  158.  
  159. function Upload_Success(result, context, methodName) {
  160. var img = $get('<%=Image1.ClientID %>');
  161. img.src = '?id=' + result;
  162. }
  163.  
  164. function ButtonScan_Click(evt) {
  165. evt.preventDefault();
  166. $get('ImgXTwain').Acquire(false, theForm.ImgX.hWnd);
  167. }
  168.  
  169. function ImgXTwain_ImageAcquired(image) {
  170.  
  171. var imgx = $get('ImgX');
  172.  
  173. // Set scanning options. These must be set before image acquisition.
  174. imgx.AutoZoom = $get('<%=CheckBoxAutoZoom.ClientID %>').checked;
  175. imgx.AutoCrop = $get('<%=CheckBoxAutoCrop.ClientID %>').checked;
  176. imgx.Images.Add(theForm.ImgX.Support.GetImageFromVariant(image), 0, false);
  177.  
  178. UpdateView();
  179. }
  180.  
  181. function UpdateView() {
  182. var imgx = $get('ImgX');
  183.  
  184. $get('<%=ButtonUpdateThumbnail.ClientID %>').disabled = imgx.Images.Count == 0;
  185.  
  186. if (imgx.Images.Count < 2) {
  187. $get('<%=ButtonPrevious.ClientID %>').disabled =
  188. $get('<%=ButtonFirst.ClientID %>').disabled =
  189. $get('<%=ButtonLast.ClientID %>').disabled =
  190. $get('<%=ButtonNext.ClientID %>').disabled = true;
  191. }
  192. else {
  193. $get('<%=ButtonPrevious.ClientID %>').disabled =
  194. $get('<%=ButtonFirst.ClientID %>').disabled = imgx.Images.Current.Index == 0;
  195. $get('<%=ButtonLast.ClientID %>').disabled =
  196. $get('<%=ButtonNext.ClientID %>').disabled = imgx.Images.Count == imgx.Images.Current.Index + 1;
  197. }
  198.  
  199. if (imgx.Images.Count > 0) {
  200. $get('SpanCurrent').innerHTML = imgx.Images.Current.Index + 1;
  201. $get('SpanCount').innerHTML = imgx.Images.Count;
  202. }
  203. else {
  204. $get('SpanCurrent').innerHTML = $get('SpanCount').innerHTML = 0;
  205. }
  206.  
  207. $find("<%=SliderExtender1.ClientID%>").set_Value(Math.round(imgx.Zoom * 100));
  208. }
  209. </script>
  210.  
  211. <div>
  212. <div style="display: none">
  213. <object id="ImgXTwain" classid="CLSID:354D91A8-E3C9-491F-BB89-0FB27DEEED86">
  214. </object>
  215. </div>
  216. <div style="float: left; position: relative; top: 25px; margin: 5px;">
  217. <ajaxToolKit:SliderExtender ID="SliderExtender1" runat="server" TargetControlID="Slider1"
  218. Minimum="1" RaiseChangeOnlyOnMouseUp="false" Orientation="Vertical" BoundControlID="Slider1_BoundControl">
  219. </ajaxToolKit:SliderExtender>
  220. <asp:TextBox ID="Slider1" runat="server"></asp:TextBox>
  221. <asp:Label ID="Slider1_BoundControl" runat="server"></asp:Label>%
  222. </div>
  223. <div style="float: left">
  224. <asp:Panel ID="Panel3" runat="server" Style="text-align: center;">
  225. <asp:Button ID="ButtonFirst" runat="server" Text="<< First" />
  226. <asp:Button ID="ButtonPrevious" runat="server" Text="< Previous" />
  227. <span id="SpanCurrent"></span>&nbsp;of&nbsp;<span id="SpanCount"></span>
  228. <asp:Button ID="ButtonNext" runat="server" Text="Next >" />
  229. <asp:Button ID="ButtonLast" runat="server" Text="Last >>" />
  230. </asp:Panel>
  231. <object id="ImgX" classid="clsid:111A5E7A-EAAC-433A-B56B-0AF470BE6306" style="width: 353px;
  232. height: 500px;">
  233. <param name="BackColor" value="16777215" />
  234. <param name="MouseTool" value="2" />
  235. <param name="AntialiasDisplay" value="True" />
  236. <param name="Center" value="True" />
  237. <param name="UndoLevels" value="3" />
  238. </object>
  239. </div>
  240. <div style="float: left; width: 400px; margin-left: 10px">
  241. <asp:Panel ID="Panel1" runat="server" GroupingText="Scan">
  242. <asp:Button ID="ButtonScan" runat="server" Text="Scan" Style="float: right" />
  243. <asp:CheckBox ID="CheckBoxAutoZoom" runat="server" Text="AutoZoom" Checked="true" />
  244. <asp:CheckBox ID="CheckBoxAutoCrop" runat="server" Text="AutoCrop" Checked="true" />
  245. </asp:Panel>
  246. <asp:Panel ID="Panel2" runat="server" GroupingText="Thumbnail">
  247. <asp:Button ID="ButtonUpdateThumbnail" runat="server" Text="Update" Style="float: right" />
  248. <asp:Image ID="Image1" runat="server" />
  249. </asp:Panel>
  250. <asp:Panel ID="Panel5" runat="server" GroupingText="Edit">
  251. <asp:Button ID="ButtonRemove" runat="server" Text="Remove" ToolTip="Remove image from collection" />
  252. </asp:Panel>
  253. </div>
  254. </div>
  255. </form>
  256. </body>
  257. </html>

Report this snippet  

You need to login to post a comment.