ColdFusion Builder Extensions

Preview:

DESCRIPTION

How to get started doing extension development for ColdFusion Builder

Citation preview

ColdFusion Builder ExtensionsTerry RyanAdobe ColdFusion Evangelisthttp://terrenceryan.com@tpryan

Google Translat

or

Builder Stats

Riaforge Downloa

d

Getting Started Using

Installation

• Install–Packaged Zip files

• Import

Using Extensions

• Available as Context Menus (Right Click thingies) for:–RDS View–Project View–Outline View–Editor

RDS VIEWEDITOR VIEW

PROJECT VIEW

OUTLINE VIEW

Getting Started Writing

Extension Components

• Ide_config.xml• CFML Handlers• Supporting Code

<application>

[Metadata]

[Menu Contributions]

[Handlers]

</application>

ide_config.xml

ide_config.xml

<application><name>DemoExtensions</name><author>Terrence Ryan</author><version>1.0</version><email>terry.ryan@adobe.com</email><description>Simple Extension</description>

[Menu Contributions]

[Handlers]

</application>

Licensing

• Add License agreement to metadata.

ide_config.xml

<application>[Metadata]

<menucontributions ><contribution target="rdsview" >

<menu name="Database Info"><action name=“DBVersion" handlerid="databaseVersion" />

</menu></contribution>

</menucontributions>

[Handlers]

</application>

ide_config.xml<application>

[Metadata]

[Menu Contributions]

<handlers><handler id="databaseVersion" type="CFM"

filename="databaseVersion.cfm" /></handlers>

</application>

ide_config.xml

<application><name>DemoExtensions</name><author>Terrence Ryan</author><version>1.0</version><email>terry.ryan@adobe.com</email><description>Simple Extension</description>

<menucontributions ><contribution target="rdsview" >

<menu name="Database Info"><action name=“DBVersion" handlerid="databaseVersion" /><action name="Inspect Table" handlerid="inspectTables" />

</menu></contribution>

</menucontributions>

<handlers><handler id="databaseVersion" type="CFM"

filename="databaseVersion.cfm" /></handlers>

</application>

Handlers

[Parse IDE input]

[Do something]

[Respond to IDE]

Parse IDE Input

<event> <ide version="2.0"> <callbackurl> http://192.168.180.208:53301/index.cfm?extension=ColdFusion Builder Test Creator </callbackurl>

<rdsview> <database name="cfartgallery"> <table name="APP.ART"> <fields>

<field name="ARTID" type="INTEGER" length="10"/><field name="ARTISTID" type="INTEGER" length="10"/><field name="ARTNAME" type="VARCHAR" length="50"/><field name="DESCRIPTION" type="CLOB" length="2147483647"/><field name="PRICE" type="DECIMAL" length="19"/><field name="LARGEIMAGE" type="VARCHAR" length="30"/><field name="MEDIAID" type="INTEGER" length="10"/><field name="ISSOLD" type="SMALLINT" length="5"/>

</fields> </table> </database> </rdsview> </ide></event>

Parse IDE Input

<cfset XMLDoc = XMLParse(form.ideeventInfo) /><cfset db.dbname=XMLDoc.event.ide.rdsview.database[1].XMLAttributes.name />

[Do something]

[Respond to IDE]

Do Something

[Parse IDE input]

<cfdbinfo datasource="#db.dbname#" name="version" type="version" />

[Respond to IDE]

Respond to IDE

[Parse IDE input]

[Do something]

<cfheader name="Content-Type" value="text/xml"><response status="success" showresponse="true">

<ide ><dialog width="600" height="400" /><body>

<![CDATA[<cf_versionDisplay versionQuery = "#version#" />

]]></body>

</ide></response>

Put it all together

<cfset XMLDoc = XMLParse(form.ideeventInfo) /><cfset db.dbname=XMLDoc.event.ide.rdsview.database[1].XMLAttributes.name />

<cfdbinfo datasource="#db.dbname#" name="version" type="version" />

<cfheader name="Content-Type" value="text/xml"><response status="success" showresponse="true">

<ide ><dialog width="600" height="400" /><body>

<![CDATA[<cf_versionDisplay versionQuery = "#version#" />

]]></body>

</ide></response>

Interacting with IDE

Collecting Input

<menucontributions ><contribution target="rdsview" >

<menu name="Database Info"><action name="Database Version" handlerid="databaseVersion" /><action name="Inspect Table" handlerid="inspectTables">

<input name="showPK" label="Show Primary Key" type="boolean"/><input name="showFK" label="Show Foreign Key" type="boolean"/>

</action></menu>

</contribution></menucontributions>

User input

<event><user>

<input name="showPK" value="true"/><input name="showFK" value="true"/>

</user></event>

Collecting Input

• Types– String– Dir– Boolean– File– Password– List

• Name• Label• Tooltip• Required

• Default• Checked• Pattern• ErrorMessage• HelpMessage

Workspace Keywords

• Leverage Workspace Values– project location– projectname– serverhome– wwwroot

<input name=“outputDir" label=“Output Folder" default="{$projectlocation}" type="dir"/>

Workspace Keywords - Gotchas

• Does not work in RDSview• Keywords are case sensitive

Menu Filters

• Add Context-Menus only to specifi c items– Folders– Projects– Files– Outline Nodes

• Pattern match against name or RegEx<fi lters>

<fi lter type="fi le" pattern=“ index.cfm" /><fi lter type=“cff unction" />

</fi lters>

Menu Filters - Gotchas

*.cfc does not workIt’s a regular expression.*\.cfc

Menus

• RDS View• Project View• Outline View• Editor

RDS View

<event> <ide version="2.0"> <callbackurl> http://192.168.180.208:53301/index.cfm?extension=ColdFusion Builder Test Creator </callbackurl>

<rdsview> <database name="cfartgallery"> <table name="APP.ART"> <fields>

<field name="ARTID" type="INTEGER" length="10"/><field name="ARTISTID" type="INTEGER" length="10"/><field name="ARTNAME" type="VARCHAR" length="50"/><field name="DESCRIPTION" type="CLOB" length="2147483647"/><field name="PRICE" type="DECIMAL" length="19"/><field name="LARGEIMAGE" type="VARCHAR" length="30"/><field name="MEDIAID" type="INTEGER" length="10"/><field name="ISSOLD" type="SMALLINT" length="5"/>

</fields> </table> </database> </rdsview> </ide></event>

Project View

<event> <ide version="2.0"> <callbackurl> http://192.168.180.208:53301/index.cfm?extension=ColdFusion Builder Test Creator </callbackurl>

<projectview projectname="DemoExtensions" projectlocation=”[Project Path]"> <resource path=”[File Path]" type="file"/> </projectview> </ide></event>

Outline View

<event> <ide version="2.0"> <callbackurl> http://192.168.180.208:53301/index.cfm?extension=ColdFusion Builder Test Creator </callbackurl>

<outlineview projectname="FlexGumboDemo" projectlocation="[Project Path]"> <source filename="artists.cfc" path="[FilePath]"> <node type="cffunction"> <function name="getIDName" returntype=" void"> </function> </node> </source> </outlineview> </ide></event>

Editor View

<event> <ide version="2.0"> <callbackurl> http://192.168.180.208:53301/index.cfm?extension=ColdFusion Builder Test Creator </callbackurl>

<editor> <file location="/Users/terryr/Sites/centaur.dev/translator/test.cfm" name="test.cfm" project="Translator"

projectlocation="/Users/terryr/Sites/centaur.dev/translator" projectrelativelocation="test.cfm" />

<selection endcolumn="86" endline="4" startcolumn="1" startline="1"> <text>

Editor contentEditor contentEditor contentEditor content

</text> </selection> </editor> </ide></event>

Getting information via callbacks<event> <ide version="2.0"> <callbackurl> http://192.168.180.208:53301/index.cfm?extension=ColdFusion Builder Test Creator </callbackurl>

…</event>

Getting information via callbacks<cfset callbackURL = XMLParse(form.ideeventinfo).event.ide.callbackurl.XMLText />

<cfsavecontent variable="postData"><response>

<ide><commands>

<command type="getdatasources"></command>

</commands></ide>

</response></cfsavecontent>

<cfhttp method="post" url="#callbackURL#"><cfhttpparam type="body" value="#postData#" >

</cfhttp>

Callback results<?xml version="1.0" encoding="UTF-8"?><event>

<ide version="2.0"><callbackurl>

http://192.168.180.208:53301/index.cfm?extension=Storm Extensions

</callbackurl><command_results>

<command_result type="getdatasources"><datasources>

<datasource name="max2010" server="centaur.dev"/>

<datasource name="webdu" server="centaur.dev"/>

<datasource name="indy" server="centaur.dev"/>

<datasource name="inventory" server="centaur.dev"/>

...</datasources>

</command_result></command_results>

</ide></event>

Callbacks data fetches

• getServers• getDatasources• getTables• getTable• searchFile• getFunctionsAndVariables

Callbacks can perform operations

• refreshProject• refreshFolder• refreshFile• insertText• openFile

Callbacks- Gotchas

IDE has to have them enabled (it does by default)

Creating Dynamic Extensions

• ColdFusion Builder Extensions Responses– XML– HTML– Flash– Eclipse SWT

XML Response to Create Dynamic UI

<response status="success" type="default"><ide message="">

<dialog height="400" width="400" ><input name="location" default="${projectlocation}" /><input name="Generate View" type="boolean" checked="yes" />

</dialog></ide>

</response>

XML Response to Create HTML UI

<response status="success" showresponse="true"><ide >

<dialog width="600" height="400" /><body>

<![CDATA[<p>This is an HTML Response</p>

]]></body>

</ide></response>

Two Browsers

• Internally, ColdFusion Builder utilizes two different browsers to render extensions–Internal browser–System default browser

IDE Browser

Pros• Crappy CSS

Support

Cons• Call backs for more

interaction with the IDE

Native Browser

Pros• Full CSS

Cons• No Callbacks

XML Response to Native Browser

<response status="success" showresponse="true"><ide url="#attributes.messageURL#" >

<dialog width="600" height="400" /></ide>

</response>

Responding to views

<cfheader name="Content-Type" value="text/xml"><response status="success" showresponse="true"><ide ><view id="stormExtensions" title="Storm Extensions Test" icon="" /><body><![CDATA[

…]]></body></ide></response>

<codeassistcontribution> <functions> <function name="linkTo" variableName="event" componentName="" handlerId="CodeAssistHandler"> <parameter index="1" /> </function> </functions> </codeassistcontribution>

Extension Code Assist

<codeassist_response> <proposal display="display_value" insert="insert_this_value" inquotes="true/false"/> </codeassist_response>

Extension Code Assist

Development Tips

Development Tips

• <cfsettings showdebugoutput=“false” />

Development Tips

• Reload / Import ExtensionsPreferences > ColdFusion > Extensions

• Have to do when you alter ide_confi g.xml

Development Tips

• Errors output to Eclipse error logsWindow > Show View > Other > General > Error Log

Development Tips

• Simulate submissions– Capture IDE input to text fi le– Read IDE input from text fi le– Develop like a webapp, until you

are ready for full testing with IDE

Testing and Debugging

Run ColdFusion from command line and

dump to the console

Use a custom tag to dump to the IDE

window

Use ColdFusion Builder Tester Extension

Demo

ColdFusion Builder Tester

Skinning

HTML/CSS/JS

Pros• Easy to write• Compliments other

things you do

Cons• Some Concepts

aren’t well expressed

Flex

Pros• Can do some cool

stuff

Cons• Harder to just

throw together an extensions

Logo

• You can place a logo in the upper right hand corner

<response showresponse="true" ><ide >

<dialog title="Apptacular"

image="handlers/logo.png" width="710"

height="690"/></ide>

</response>

Menu Spacer

• You can add spacers to menu items.

• They’re clickable, but do nothing

<menucontributions ><contribution target="rdsview" >

<menu name="Apptacular"> <action

name="------------------------------" /></menu>

</contribution>

Like an app put ui in Custom tags

Instant Code

Review

Follow up?

• Feel free to contact me–terry.ryan@adobe.com–http://terrenceryan.com–Twitter: @tpryan

Recommended