In this post I
Explained about capture the
signature from signature pad to connect the Web application.
You have to use web signuature pad for this application.
.aspx code
<form id="form1"
runat="server">
<asp:HiddenField ID="HiddenField1" runat="server" />
<div id="wPaint" style="position:relative; width:1200px; height:500px;
background:#ACACAC; border:solid black 1px; overflow:hidden;"></div>
<asp:Button ID="BtnSign" runat="server" Text="Save" CssClass="button" OnClientClick="javascript:saveImage();" onclick="BtnSign_Click"
/>
<asp:Button ID="BtnClearSign" runat="server" Text="Clear" CssClass="button" OnClientClick="javascript:loadImage();" />
<script type="text/javascript">
$("#wPaint").wPaint({
image: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAECAQGDHihRBAIECBAgYND9AAECBAgQCAgY9ECJIhAgQIAAAYPuBwgQIECAQEDAoAdKFIEAAQIECBh0P0CAAAECBAICBj1QoggECBAgQMCg+wECBAgQIBAQMOiBEkUgQIAAAQIG3Q8QIECAAIGAgEEPlCgCAQIECBAw6H6AAAECBAgEBAx6oEQRCBAgQICAQfcDBAgQIEAgIGDQAyWKQIAAAQIEDLofIECAAAECAQGDHihRBAIECBAgYND9AAECBAgQCAgY9ECJIhAgQIAAgQMI/gEtiL4PDAAAAABJRU5ErkJggg==",
drawDown:
function(e, element){ $("#canvasDown").val(element.settings.mode +": " + e.pageX + ',' + e.pageY); },
drawMove:
function(e, element){ $("#canvasMove").val(element.settings.mode +": " + e.pageX + ',' + e.pageY); },
drawUp: function(e, element){ $("#canvasUp").val(element.settings.mode
+": " + e.pageX + ',' + e.pageY); }
});
function loadImage()
{
$("#wPaint").wPaint("image", "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAfQCBj1QoggECBAgQMCg+wECBAgQIBAQMOiBEkUgQIAAAQIG3Q8QIECAAIGAgEEPlCgCAQIECBAw6H6AAAECBAgEBAx6oEQRCBAgQICAQfcDBAgQIEAgIGDQAyWKQIAAAQIEDLofIECAAAECAQGDHihRBAIECBAgYND9AAECBAgQCAgY9ECJIhAgQIAAgQMI/gEtiL4PDAAAAABJRU5ErkJggg==");
}
function saveImage()
{
var imageSignData = $("#wPaint").wPaint("image");
document.getElementById('<%=
HiddenField1.ClientID %>').value = imageSignData;
}
</script>
</form>
.cs page code
using System;
using
System.Collections;
using
System.Configuration;
using
System.Data;
using
System.Data.SqlClient;
using
System.Linq;
using
System.Web;
using
System.Web.Security;
using
System.Web.UI;
using System.Web.UI.HtmlControls;
using
System.Web.UI.WebControls;
using
System.Xml.Linq;
using System.IO;
using
System.Drawing;
using
System.Diagnostics;
using
System.Collections.Generic;
using
System.ComponentModel;
using
System.Text;
using
System.Drawing.Imaging;
namespace company
{
public partial class WebSign : System.Web.UI.Page
{
protected
void Page_Load(object
sender, EventArgs e)
{
}
protected
void BtnSign_Click(object
sender, EventArgs e)
{
try
{
string
PATH = Server.MapPath(ResolveUrl("~\\"));
string
strPhoto = HiddenField1.Value; //Get the image from
flash file
int
l = strPhoto.Length;
strPhoto =
strPhoto.Substring(22, l - 22);
byte[]
photo = Convert.FromBase64String(strPhoto);
FileStream
fs = new FileStream(PATH
+ "Sign.png", FileMode.OpenOrCreate, FileAccess.Write);
BinaryWriter
br = new BinaryWriter(fs);
br.Write(photo);
br.Flush();
br.Close();
fs.Close();
string
script2 = "alert('Signature Saved..');";
System.Web.HttpContext.Current.Response.Write("<script
language=\"javascript\">" + script2 + "</script>");
InvertImage();
}
catch
(Exception Ex)
{
string
script3 = "alert('" + Ex + "');";
System.Web.HttpContext.Current.Response.Write("<script
language=\"javascript\">" + script3 + "</script>");
}
}
protected
void InvertImage()
{
Bitmap
bimg = (Bitmap)System.Drawing.Image.FromFile(Server.MapPath("~\\Sign.png"));
Bitmap
img = null;
img = new
Bitmap(bimg.Width, bimg.Height);
for
(int x = 0; x < bimg.Width; x++)
{
for
(int y = 0; y < bimg.Height; y++)
{
//Get
the color
Color
clr = bimg.GetPixel(x, y);
//Invert
the clr
clr = Color.FromArgb(255 - clr.R, 255 - clr.G, 255 -
clr.B);
//Update
the color
img.SetPixel(x, y, clr);
}
}
bimg.Dispose();
img.Save(Server.MapPath("~\\Signature.jpg"),
System.Drawing.Imaging.ImageFormat.Jpeg);
}
}
}


