Embed Prizm Viewer in a Web Page

To integrate Prizm Viewer into your web application, you need to incorporate appropriate HTML tags in your web page. The HTML tags for integrating Prizm on a web page is specific to the browser you target. However, both types of tags can be included in the same HTML, such that your HTML is the same regardless of your browser.

Internet Explorer Browser

The following example will integrate Prizm Viewer in your web page for Internet Explorer using the HTML <Object> tag. This example will only work with Internet Explorer browsers:

Example	Copy Code
<OBJECT ID="PrizmControl" CLASSID="CLSID:7A2633F0-33D5-4F5E-93BE-74ACBEE7F7EA" ><PARAM NAME="SRC" VALUE="http://server/images/test.tif"></OBJECT>

When using the <Object> tag, you must use the CLASSID value included in the example above.

Using this approach, you will find that you will need to click on Prizm Viewer in the web page before you are able to interact with the control. To circumvent this problem, you can insert the following text in your HTML:

Example	Copy Code
<script src="EmbedPrizm.js"></script>

Next, you will need to generate a file (i.e., EmbedPrizm.js), that contains the following JavaScript content:

Example	Copy Code
document.write('<OBJECT ID="PrizmViewer1" CLASSID="CLSID:7A2633F0-33D5-4F5E-93BE-74ACBEE7F7EA"') document.write(' height="100%" width="100%">') document.write(' <PARAM NAME="SRC" VALUE="images/morning-coffee.jpg"/>') document.write('</OBJECT>')

Example

Copy Code

document.write('<OBJECT ID="PrizmViewer1" CLASSID="CLSID:7A2633F0-33D5-4F5E-93BE-74ACBEE7F7EA"')
document.write('        height="100%" width="100%">')
document.write('   <PARAM NAME="SRC" VALUE="images/morning-coffee.jpg"/>')
document.write('</OBJECT>')

Print from Internet Explorer

Prizm® Viewer supports printing via the print button on the Internet Explorer toolbar. You will need to implement the following HTML to support printing from Internet Explorer.

To preserve the layout of your page when you print it, use a specific, non-relative value instead of a percentage. Instead of setting the height in the OBJECT tag, set the height from the onLoad event in the BODY tag:

Example	Copy Code
<BODY onload="javascript:myControl.height=document.body.offsetHeight * 0.75;"> <OBJECT id="myControl" classid="clsid:8E27C92B-1264-101C-8A2F-040224009C02" >

Firefox Browser

The following example will integrate Prizm Viewer in your web page for Firefox browsers using the HTML <Embed> tag:

Example	Copy Code
<EMBED SRC=" http://server/images/test.tif " TYPE="image/tif">

Combined Browsers

If your web application is intended for use with Internet Explorer and Firefox browsers, you need to nest the HTML <Embed> tag inside the HTML <Object> tag. Internet Explorer will ignore the <Embed> tag; Firefox ignores the <Object> tag. The following example demonstrates how to nest <Object> and <Embed> tags such that Prizm Viewer will integrate on a web page that supports Internet Explorer, and Firefox browsers.

Insert the following into your HTML page:

Example	Copy Code
<script src="EmbedPrizm.js"></script>

Next, you will need to generate a file (i.e., EmbedPrizm.js), that contains the following JavaScript content:

Example	Copy Code
document.write('<OBJECT ID="PrizmViewer1" CLASSID="CLSID:7A2633F0-33D5-4F5E-93BE-74ACBEE7F7EA"') document.write(' height="100%" width="100%">') document.write(' <PARAM NAME="SRC" VALUE="images/morning-coffee.jpg"/>') document.write(' <EMBED SRC="images/morning-coffee.jpg" type="image/TIF" ') document.write(' height="100%" width="100%"> ') document.write(' </EMBED>') document.write('</OBJECT>')

Example

Copy Code

document.write('<OBJECT ID="PrizmViewer1" CLASSID="CLSID:7A2633F0-33D5-4F5E-93BE-74ACBEE7F7EA"')
document.write('        height="100%" width="100%">')
document.write('   <PARAM NAME="SRC" VALUE="images/morning-coffee.jpg"/>')
document.write('   <EMBED SRC="images/morning-coffee.jpg" type="image/TIF" ')
document.write('          height="100%" width="100%"> ')
document.write('   </EMBED>')
document.write('</OBJECT>')