The jQuery integration for UnityWorks! Media consists of various code snippets to generate the working product. The service is composed of JavaScript, jQuery functionality and Web Services hosted by UnityWorks! Works. The service will automatically display content for the known criteria provided in the snippets below. If the criteria does not match our records, no content nor notification will be displayed at the user level.
The following code is recommended to be place within the
HEAD tags of the html document. The highlighted
###### ID will be provided to you by UnityWorks! Media as a
CTX id.
Integration Code
<!-- UWM - Notification Integration -->
<script type="text/javascript" src="http://www.dealervideos.com/scripts/jquery.js"></script>
<script type="text/javascript" src="http://www.dealervideos.com/scripts/jquery-ui-dialog.js"></script>
<script type="text/javascript" src="http://www.dealervideos.com/scripts/swfobject.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.dealervideos.com/css/uwm.dialog.css" />
<script type="text/javascript" src="http://www.dealervideos.com/integration.svc/script/######"></script>
<script type="text/javascript">
function uwmVideoAvailableHandler(vehicle, ele) {
ele.show();
}
function uwmVideoUnavailableHandler(vehicle, ele) {
ele.hide();
}
</script>
Once the code above has been implemented, please apply any of the following codes anywhere within the
body tags of the html document for each of the vehicles being displayed. The highlighted
¤¤¤ represents the
VIN for the particular video. The lines below will notify the user there is a video available. Each entry in a listing page requires one of the options below with its corresponding
VIN.
Option - Raw Text Notification
<div id="uwm_¤¤¤">Video Notification</div>
Option - Image Notification
<div id="uwm_¤¤¤">
<img src="image.jpg" alt="Click For Video" />
</div>Option - External Class Notification
<div id="uwm_¤¤¤" class="cssClass"></div>
Option - Object Notification
<div id="uwm_¤¤¤">
<table class="cssClass"><tr><td>Objects</td></tr></table>
</div>
If a list of vehicles are present, multiple object will be needed. This will notify the user a video is available for each of the vehicles.
<div id="uwm_¤¤¤">Video Notification 1</div>
<div id="uwm_¤¤¤">Video Notification 2</div>
<div id="uwm_¤¤¤">Video Notification 3</div>
<div id="uwm_¤¤¤">Video Notification 4</div>
In addition, any valid html object is valid for use.
The only requirement is to use an ID with the following value
"uwm_" + vin .
The following icons are available for use for your UnityWorks! Media integration. Save the image or simply replace the image src with the URLs below. For a complete set of icons please refer to the
Complete Integration Icon Sets Page.
Example:
http://www.dealervideos.com/css/fdIcons/0003.jpg
If a jQuery build is already in use within the host website. Please remove the jQuery sources from the snippet above to reduce downloading times and any script conflicts. If the latest jQuery 1.3.2 is currently not in use, UnityWorks! Media suggests to download the latest build to prevent any script conflicts. You can find more information at
jQuery.com