Site Level ADF Library Components Overrides

From ADF Docs
Jump to: navigation, search

Overview

By default the latest version of each ADF Library Component is loaded into your sites Application.ADF memory space which allows you to write code like this in your Render Handlers, Custom Scripts or Custom Field Types:

<cfscript>
  application.ADF.scripts.loadJQuery();
  application.ADF.scripts.loadJQueryUI();
</cfscript>

You may however want to make minor (or major) modifications to an ADF Library Component at the site level.

Why would you override an ADF Library Component

One reason you may want to override an ADF Library Component would be to make changes to the component prior to uploading it to the community. Maybe adding a method or changing an existing method. By overriding the component at the site level you will have an opportunity to easily test that change.

Steps to override

  1. Create a directory called "lib" in your sites directory (e.g. /mySite/_cs_apps/lib)
  2. Copy your ADF Library Component from its directory and place it into your /mySite/_cs_apps/lib/ directory
  3. Modify the <cfcomponent> tag to extend the original ADF Library Component. For example, if you wanted to modify date_1_0.cfc in your application the <cfomponent> tag would be changed from this:
<cfcomponent extends="ADF.core.Base">

to:

<cfcomponent extends="ADF.lib.date.date_1_0">
  1. Add two <cfproperty> tags just below the <cfcomponent> tag.
<cfproperty name="version" value="1_0_0">
<cfproperty name="type" value="singleton">

Best practices

You don't have to override the entire component, you can add new methods and override existing methods pretty easily. Using the above example, lets say you wanted to add a new function to the component. A sample of your date_1_0 (located in the /mySite/_cs_apps/lib/ directory) would look like this:

<cfcomponent displayname="date" extends="ADF.lib.date.date_1_0">
	
<cfproperty name="version" value="1_0_0">
<cfproperty name="type" value="singleton">

<cffunction name="compareDateArray" access="public" returnType="array">
 {method code here}
</cffunction>

</cfcomponent>

Notice how the value of the "extends" attribute is pointing to the date_1_0 component loaded into the ADF and notice how there are no other methods in this component. By extending the original date_1_0 component, you automatically gain all of the methods defined in that component - so you need not copy those in.

This allows you to take advantage of any changes made to date_1_0 automatically.