Expand Microsoft SharePoint to Create the Ultimate Document Management Solution

• Download sample code 
• Dynamic Web TWAIN 30-day Free Trial

Introduction 

Microsoft SharePoint is often used on company intranets with the goal of keeping information centralized and easily accessible to all relevant parties. However, not only information needs to be centralized. Companies spend a huge amount of resources on IT to ensure that all computers are updated with the latest versions of tools and software. Having a SharePoint server that provides software tools can alleviate the need for synchronizing all that software across systems. Dynamic Web TWAIN is a web document processing SDK that can combine with SharePoint’s management features to create the ultimate document management solution for your company.

Dynamsoft provides an ActiveX control for Dynamic Web TWAIN, which can be accessed through the Internet Explorer browser naturally. Although Microsoft SharePoint is most commonly accessed through Internet Explorer, when other browsers are used Dynamic Web TWAIN can also be integrated through a browser plug-in. The following article explains how Dynamic Web TWAIN can be integrated into SharePoint as an object supporting both ActiveX and browser plug-in methods.

Key Features

• Natural integration into SharePoint as a Web Part.
• Upload files directly to SharePoint Libraries after scanning and editing the images.
• ActiveX plug-in for Internet Explorer users.
• Browser plug-in which supports other browsers: Firefox, Chrome, Opera, Safari.

Procedure

There are two common methods used to insert custom code into SharePoint: by using “Edit HTML source” on a Page or Content Editor, or by using custom Web Parts. While the first option is simple, it isn’t very modular and makes copying code messy and error prone. In this tutorial, we’re going to focus on the second method: using a custom Web Part.

A Web Part is a modular “object” that can be inserted into any SharePoint page easily. It is created using an .ascx source file that contains HTML, JavaScript, and/or .NET code. In our case, we have no need for any server side scripting, so we will just have HTML and JavaScript. We will use Visual Studio 2010 with SharePoint development tools installed to create the Web Part.

Step 1. Deployment

For the purpose of this tutorial, we’re assuming that you already have an installation of Dynamic Web TWAIN on your computer, or have downloaded a trial version. Go to your Dynamic Web TWAIN installation folder, and take a look at the files prefixed with Dynamic inside. In our case, we’re using the trial version, and we have:

• DynamicWebTWAIN.cab: for 32-bit IE on Windows
• DynamicWebTWAINx64.cab: for 64-bit IE on Windows
• DynamicWebTwain.xpi: for Firefox on Windows
• DynamicWebTWAINMacEditionTrial.pkg: for Mac OS
• DynamicWebTWAINPlugIn.msi: for Chrome, Safari and Opera on Windows

These are the files required on the server side for Dynamic Web TWAIN. We’ll upload them to the SharePoint layouts folder so that they can be accessed through the SharePoint server. Find your SharePoint LAYOUTS folder. Typically, this is located at: C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS.

Inside that folder, create a new folder called DynamicWebTWAIN or whatever you wish. Copy all the previously mentioned files into this new folder. You are now ready to move on and create a Web Part to use these files.

Note: In our example, we also include a .lpk license file, which you can generate if you have a license, and a twain_associate.pdf file. The twain_associate.pdf file is just a sample image to be loaded into TWAIN by our sample code.

Step 2. Load and upload images to your SharePoint Library

In Visual Studio create a new Web Part to contain Dynamic Web TWAIN. To do this, go to File -> New Project -> SharePoint -> 2010 -> Visual Web Part.

Visual Studio will ask some questions about your server setup, and then create a new .ascx file for you with a few headers. Below those headers, you will insert your HTML and JavaScript code for integrating Dynamic Web TWAIN. Here, you may insert any code which you use for other web pages outside of SharePoint, and it should work fine. For this tutorial I will demonstrate a simple implementation of Dynamic Web TWAIN, which will load an image and upload it into a SharePoint library.

//Load a test image
WebTWAIN.HTTPDownload("dynamsharepoint", "/_layouts/DynamicWebTWAIN/twain_associate.pdf");
WebTWAIN.HTTPUploadThroughPut("dynamsharepoint", 0, "/TWAIN%20Uploads/twain_associate.pdf");

The DynamicWebTWAIN folder should be absolute paths, starting with the hostname of your SharePoint server. In our case, that hostname is dynamsharepoint. The layouts folder is accessed using the _layouts virtual path.

if (ExplorerType() == "IE" && (navigator.userAgent.indexOf("Win64") == -1 || navigator.userAgent.indexOf("x64") == -1)) {
    strObjectActiveX = "<object id='mainDynamicWebTwainIE' style='width: 300px; height: 300px;' " + 
      "codebase='http://dynamsharepoint/_layouts/DynamicWebTWAIN/DynamicWebTWAIN.cab#version=7,0' " + 
      "class='divcontrol'" + "classid='clsid:FFC6F181-A5CF-4ec4-A441-093D7134FBF2' viewastext> " + 
      strObjectActiveX;
    var objDivx86 = document.getElementById("maindivIEx86");

    objDivx86.style.display = "inline";
    objDivx86.innerHTML = strObjectActiveX;
    var obj = document.getElementById("maindivPlugin");

    obj.style.display = "none";

    WebTWAIN = document.getElementById("mainDynamicWebTwainIE");
} //if IE 32 bit, direct users to use DynamicWebTWAIN.cab

Step 3. Test

Now that your Web Part has been created in Visual Studio, it’s time to test it through SharePoint. In the Visual Studio Debug menu, click Start Debugging (or press F5 on your keyboard). This will begin to debugging process, and start your default browser. Once you are logged into SharePoint, edit any Page. While editing the page, switch to the Insert tab under Editing Tools, and then click Web Part. (The Web Part button may take a few moments to become available).

Once the Web Part dialog comes up, select Custom and select the Web Part you just created in Visual Studio. Lastly, click the add button on the right to add it to the page.

After adding the Web Part, save and view your Page. You should now have a functioning WebTWAIN object on your page. If you do not see it, be sure to check your JavaScript console to identify any errors in your code. If Dynamic Web TWAIN loaded successfully, there should be a WebTWAIN object in the JavaScript console.

You may see in the above image that there is a “TWAIN Uploads” library. In our sample code, we uploaded the image to TWAIN uploads through PUT. If you’re using the sample code, be sure to create a new library called TWAIN Uploads to allow for the upload. Once the folder has been created, visit the WebTWAIN object page again, and the image should be uploaded into the folder as seen below.

Uploading scanned images directly to SharePoint allows for them to be tracked by SharePoint’s internal version control features. This kind of integration is very powerful for document management.

Just like that, you’ve unlocked the features of Dynamic Web TWAIN within SharePoint. Now that everything is tested and working, you can think about placing the Web Part onto your production Sharepoint server permanently. If you do not know how to proceed with this, you can view Microsoft’s documentation on deploying Web Parts.

Conclusion

For companies that use Microsoft SharePoint for their intranets or websites, WebTWAIN is the perfect option to implement a centralized document management tool. Using a web tool takes away from the need for installation and updating software across systems, which fits perfectly with Microsoft SharePoint.

Combining the powerful management features of Microsoft SharePoint with a document processing solution like Dynamic WebTWAIN results in a complete document management solution that will keep your company organized. Scanned documents can be tracked through version control, protected through access control, and viewed on your intranet. For more information about Dynamic WebTWAIN, visit the Dynamsoft website.

Download the Sample

To try out the integration with SharePoint, you can download the free trial of Dynamic Web TWAIN here: Dynamic Web TWAIN 30-day Free Trial.