Custom Snap-In implementation
In This Topic
Snap-Ins are very powerful interface elements that can be used for various purposes. DocuVieware™ comes with several handy built-in snap-ins such as the Thumbnails, Bookmarks, Text Search or Annotations palette.
This tutorial shows how to create a very simple Custom Snap-In with a button that will trigger a Custom Action server-side to return a message.
You are going to implement a Custom Snap-In that will contain a simple button which action will be to send a "ping" command to the server and it will reply with a "pong" message.
DocuVieware™ requires .NET Framework 4.6 or above.
The screenshots have been taken using Visual Studio and GdPicture.NET™ 14, it may differ from the current release.
Preparing the Custom Snap-In content
You are going to implement a simple button which action will be to send a "ping" command to the server and it will reply with a "pong" message.
Step 1: Add the custom Snap-In content in the Page_Load code behind (that will be Default.aspx.cs).
You want to do this only when the page is not in a PostBack context.
A custom snap-in is created using the AddCustomSnapIn method that takes several mandatory elements:
- a title, that's what is displayed on top of it when it is selected, in other words it is the snap-in label, here it is "Custom Snap-In"
- an icon, in this tutorial it is a very simple lightning bolt SVG icon
- a content, that is the HTML content your Snap-In will contain, in this tutorial it is just a simple <div> with a <button> in it
Please note the onclick event on the button, it calls the ping() function but you will implement it later on since it needs to be done client side.
Step 2: Add two more things: the HexConverter utility function and the Custom Action handler that will send the message to the client.
Step 3: Add the custom action event handler in the Global.asax.cs file like this:
Now you are ready to proceed to client side.
Preparing your Custom Action client side
Add a <script> tag in the <head> section of the page, like this:
Compile and start the page, the custom Snap-In icon will appear in the left panel.
Now, if you select it and click on the ping button, it will trigger the custom action and you should see a "Pong" message coming back from the server.