<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="Telerik.Web.Examples.Signature.ExportAsImage.DefaultCS" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
<title>Telerik ASP.NET Example</title>
<style type="text/css">
.exportLabel {
padding-top: 20px;
}
</style>
</head>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest">
<ClientEvents OnResponseEnd="responseEnd" />
</telerik:RadAjaxManager>
<div class="demo-container">
<div class="demo-containers">
<div class="demo-container">
<h2 class="exportLabel">Sign and export/save</h2>
<telerik:RadButton runat="server" ID="RadButton1" Text="Export as PNG" AutoPostBack="false" OnClientClicked="exportAsPngClicked" />
<telerik:RadButton runat="server" ID="RadButton2" Text="Store on Server as PNG" AutoPostBack="false" OnClientClicked="sendToServer" />
<br /><br />
<telerik:RadSignature runat="server" ID="RadSignature1" Height="270" Width="400">
<ClientEvents OnLoad="signatureLoad" />
</telerik:RadSignature>
</div>
<div class="demo-container">
<h2 class="exportLabel">View the exported signatures</h2>
<telerik:RadFileExplorer RenderMode="Lightweight" ID="FileExplorer1" Configuration-DeletePaths="~/Editor/images/RadSignatureEntries"
Width="400px" Height="319px" runat="server" Configuration-ViewPaths="~/Editor/images/RadSignatureEntries">
</telerik:RadFileExplorer>
</div>
</div>
</div>
<telerik:RadScriptBlock runat="server" ID="RadScriptBlock1">
<script>
var signature;
function signatureLoad(sender, args) {
signature = sender;
}
function exportAsPngClicked(sender, args) {
if(!signature.get_value()) return;
kendo.saveAs({
dataURI: signature.get_value(),
fileName: "signature.png"
})
}
function sendToServer(sender, args) {
if(!signature.get_value()) return;
var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>");
var fileName = "signature.png";
ajaxManager.ajaxRequest(fileName + ";" + signature.get_value());
}
function responseEnd(sender, args) {
var fileExplorer = $find("<%= FileExplorer1.ClientID %>");
fileExplorer.refresh();
signature.set_value('');
}
</script>
</telerik:RadScriptBlock>
</form>
</body>
</html>