MACROMEDIA DREAMWEAVER 8-EXTENDING DREAMWEAVER Manual
  1. Manuals
  2. Brands
  3. MACROMEDIA Manuals
  4. Software
  5. DREAMWEAVER 8-EXTENDING DREAMWEAVER
  6. Manual
MACROMEDIA DREAMWEAVER 8-EXTENDING DREAMWEAVER Manual

MACROMEDIA DREAMWEAVER 8-EXTENDING DREAMWEAVER Manual

Extending dreamweaver
Hide thumbs
1
2
Table Of Contents
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
Table of Contents

Advertisement

Quick Links

Download this manual
Extending Dreamweaver

Advertisement

Table of Contents
loading
Need help?

Need help?

Do you have a question about the DREAMWEAVER 8-EXTENDING DREAMWEAVER and is the answer not in the manual?

Questions and answers

Related Manuals for MACROMEDIA DREAMWEAVER 8-EXTENDING DREAMWEAVER

Summary of Contents for MACROMEDIA DREAMWEAVER 8-EXTENDING DREAMWEAVER

  • Page 1 Extending Dreamweaver...
  • Page 2 Other product names, logos, designs, titles, words, or phrases mentioned within this publication may be trademarks, service marks, or trade names of Macromedia, Inc. or other entities and may be registered in certain jurisdictions including internationally.

  • Page 3: Table Of Contents

    Contents Introduction ..........9 Background .
  • Page 4 Chapter 4: User Interfaces for Extensions....111 Designing an extension user interface ......111 Dreamweaver HTML rendering control .
  • Page 5 Chapter 10: Reports ........249 Site reports ..........249 Stand-alone reports.
  • Page 6 Chapter 16: Data Sources ......379 How data sources work ........380 A simple data source example .
  • Page 7 PART 4: APPENDIX Appendix: The Shared Folder ......483 The Shared folder contents ........483 Using the Shared folder .
  • Page 8 Contents...

  • Page 9: Introduction

    Introduction This guide describes the Macromedia Dreamweaver 8 framework and application programming interface (API) that lets you build extensions to Dreamweaver. It provides information about how each type of extension works; the API functions that Dreamweaver calls to implement the various objects, menus, floating panels, server behaviors, and so on, that make up the features of Dreamweaver;...

  • Page 10: Installing An Extension

    To install an extension, use the following procedure: Download and install the Extension Manager, which is available on the Macromedia Downloads website (www.macromedia.com/software/downloads). Log on to the Macromedia Exchange website (www.macromedia.com/exchange).

  • Page 11: Additional Resources For Extension Writers

    To communicate with other developers who are involved in writing extensions, you might want to join the Dreamweaver extensibility newsgroup. You can access the website for this newsgroup at www.macromedia.com/go/extending_newsgrp/. What’s new in Dreamweaver Dreamweaver 8 includes the following new features and interfaces that are extensible. Each of these features has new related functions, which are listed in the Dreamweaver API Reference.
  • Page 12 For information on the new functions that have been added to the Utility API and the JavaScript API, see the Dreamweaver API Reference. Macromedia Press Improve your Dreamweaver skills with books from Macromedia Press. Check out the latest content written by the experts. See www.macromedia.com/go/dw2004_help_mmp. Deprecated functions In Dreamweaver 8, several functions have been deprecated.

  • Page 13: Conventions Used In This Guide

    Errata A current list of known issues can be found in the Extensibility section of the Dreamweaver Support Center (www.macromedia.com/go/extending_errata). Conventions used in this guide The following typographical conventions are used in this guide: font indicates code fragments and API literals, including class names, method...
  • Page 14 Introduction...

  • Page 15: Part 1: Customizing Dreamweaver

    PART 1 Customizing Dreamweaver You can customize Macromedia Dreamweaver 8 to suit your web development needs, including changing settings in dialog boxes, setting preferences in a variety of areas, and changing keyboard shortcuts. You can also customize code hints and code coloring in Code view, the cascading style sheet (CSS) profile, and Dreamweaver’s default HTML formatting.

  • Page 17: Chapter 1: Customizing Dreamweaver

    CHAPTER 1 Customizing Dreamweaver In addition to creating and using Dreamweaver extensions, you can customize Macromedia Dreamweaver in many ways, which lets you work in a manner that’s familiar, comfortable, and efficient for you. Ways to customize Dreamweaver There are several general approaches to customizing Dreamweaver. Some of these approaches are covered in Using Dreamweaver.
  • Page 18 Changing the default file type Customizing the interpretation of third-party tags Customizing workspace layouts Customizing the Code view toolbar Customizing default documents The DocumentTypes/NewDocuments folder contains a default (blank) document of each type that you can create using Dreamweaver. When you create a new blank document by selecting File >...
  • Page 19 Customizing the appearance of dialog boxes The dialog box layouts for objects, commands, and behaviors are specified as HTML forms; they reside in HTML files in the Configuration folder within the Dreamweaver application folder. You edit these forms as you would edit any form in Dreamweaver. For more information, see Using Dreamweaver.
  • Page 20 Changing the default file type By default, Dreamweaver shows all the file types it recognizes in the File > Open dialog box. You can use a pop-up menu in that dialog box to limit the display to certain types of files. If most of your work involves a specific file type (such as ASP files), you can change the default display.
  • Page 21 Customizing the interpretation of third-party tags Server-side technologies such as ASP, Macromedia ColdFusion, JSP, and PHP use special non- HTML code in HTML files; servers create and serve HTML content based on that code. When Dreamweaver encounters non-HTML tags, it compares them with information in its third-party tag files, which define how Dreamweaver reads and displays non-HTML tags.
  • Page 22 String-delimited tags String-delimited tags start with one string and end with another string. They are like empty HTML tags (such as ) in that they don’t surround content and don’t have closing tags. If the tag were a string-delimited tag, the tag specification would happy include the attributes.
  • Page 23 describes what kinds of content the tag can contain and where in an content_model HTML file the tag can appear. Valid values are "block_model" "head_model" , and "marker_model" "script_model" specifies that the tag can contain block-level elements such as block_model and that the tag can appear only in the body section or inside other body-content tags such as , or...
  • Page 24 indicates whether to ignore everything between detect_in_attribute start_string (or between opening and closing tags if those strings are not defined) end_string even when those strings appear inside attribute names or values. You should generally set this to for string-delimited tags. The default is .
  • Page 25 Container None. Example <tagspec tag_name="happy" tag_type="nonempty" render_contents="false" content_model="marker_model" icon="happy.gif" icon_width="18" icon_height="18"></tagspec> How custom tags appear in the Design view The way that custom tags appear in the Design view of the Document window depends on the values of the attributes of the tag.
  • Page 26 Avoiding rewriting third-party tags Dreamweaver corrects certain kinds of errors in HTML code. For details, see Using Dreamweaver. By default, Dreamweaver refrains from changing HTML in files with certain filename extensions, including .asp (ASP), .cfm (ColdFusion), .jsp (JSP), and .php (PHP). This default is set so that Dreamweaver does not accidentally modify the code contained in any such non-HTML tags.

  • Page 27: Customizing Dreamweaver In A Multiuser Environment

    The location of the user’s Configuration folder depends on the user’s platform. Windows 2000 and Windows XP platforms use the following location: drive:\Documents and Settings\username\Application Data\Macromedia\ Dreamweaver 8\Configuration In Windows XP, this folder may be inside a hidden folder.
  • Page 28 Mac OS X platforms use the following location: drive:Users/username/Library/Application Support/Macromedia/Dreamweaver 8/ Configuration To install extensions that all users can use in a multiuser operating system, you must be logged in as Administrator (Windows) or root (Mac OS X). The first time you run Dreamweaver, it copies only some of the configuration files into your user Configuration folder.
  • Page 29 About mm_deleted_files.xml tag syntax The mm_deleted_files.xml file contains a structured list of items that specify configuration files that Dreamweaver is to ignore. These items are specified by XML tags, which you can edit in a text editor. The following sections describe the syntax of the mm_deleted_files.xml tags. Optional attributes are marked in the attribute lists with curly braces ( );...

  • Page 30: Working With Browser Profiles

    Container This tag must be contained in a tag. deleteditems Example <item name="snippets\headers\5columnwith4links.csn" /> Reinstalling and uninstalling Dreamweaver in a multiuser environment After you install Dreamweaver, if you later reinstall it or upgrade to a later version, Dreamweaver automatically makes backup copies of existing user configuration files, so that if you’ve customized those files, you can still access the changes you made.
  • Page 31 You must use a space in the following places: Before the closing angle bracket (>) on the line !ELEMENT After the opening parentheses in a list of values for an attribute Before a closing parentheses in a list of values Before and after each pipe (|) in a list of values.
  • Page 32 Before you create a browser profile for a new version of a browser, check the Macromedia Exchange for Dreamweaver site at www.macromedia.com/exchange/ dreamweaver to see if Macromedia has supplied a browser profile that you can download and install using the Extension Manager.
  • Page 33 Add any new tags or attributes that you know are supported by the browser, using the syntax shown in “About browser-profile formatting” on page If you don’t want to receive error messages about a particular unsupported tag, add it to the list of supported tags.

  • Page 34: Changing Ftp Mappings

    Changing FTP mappings The FTPExtensionMap.txt file (Windows) and the FTPExtensionMapMac.txt file (Macintosh) map filename extensions to FTP transfer modes (ASCII or BINARY). Each line in each of the two files includes a filename extension (such as GIF) and either the word ASCII or the word BINARY, to indicate which of the two FTP transfer modes should be used when transferring a file with that extension.

  • Page 35: Extensible Document Types In Dreamweaver

    Dreamweaver provides an initial document type definition file. This file, named MMDocumentTypes.xml, contains the document type definitions provided by Macromedia: Document type Server...
  • Page 36 Document type Server Internal type File Previous server model extensions model ColdFusion Dynamic Component Dynamic Dynamic php, php3 Library Item DWExtension ASP.NET C# DWTemplate axcs.dwt Template ASP.NET VB DWTemplate axvb.dwt Template ASP JavaScript DWTemplate aspjs.dwt Template ASP VBScript DWTemplate aspvb.dwt Template ColdFusion Template DWTemplate...
  • Page 37 If you need to create a new document type, you can either add your entry to the document definition file that Macromedia provides (MMDocumentTypes.xml) or add a custom definition file to the Configuration/DocumentTypes folder. The NewDocuments subfolder resides in the Configuration/DocumentTypes folder. This subfolder contains default pages (templates) for each document type.
  • Page 38 The following table describes the tags and attributes that you can use within a document type definition file. Element Type Required Description Attribute Parent node. documenttype (root) Unique identifier across all document type definition files. Specifies the associated server model servermodel (case-sensitive);...
  • Page 39 Element Type Required Description Attribute A broad classification of how internaltype Dreamweaver treats a file. The identifies whether the internaltype Design view is enabled for this document and handles special cases such as Dreamweaver templates or extensions. The following values are valid: Dynamic (has special display DWExtension...
  • Page 40 Element Type Required Description Attribute The file extension that is associated with winfileextension the document type on Windows. You specify multiple file extensions by using a comma-separated list. The first extension in the list is the extension that Dreamweaver uses when the user saves document.
  • Page 41 Element Type Required Description Attribute The string that appears as a category title (subtag) item under Blank Document in the New Document dialog box. You can place this string directly in the definition file or point to it indirectly for localization purposes.
  • Page 42 The value of the attribute for the new document type must be internaltype DWTemplate attribute must be set, and the value must be a reference to the identifier of dynamicid an existing dynamic document type. The following example defines a dynamic document type: <documenttype id="PHP_MySQL"...
  • Page 43 The location of the user’s Configuration folder depends on the user’s platform. Windows 2000 and Windows XP platforms use the following location: drive:\Documents and Settings\username\Application Data\Macromedia\Dreamweaver 8\Configuration In Windows XP, this folder may be inside a hidden folder. Mac OS X platforms use the following location:...
  • Page 44 MMString <documenttypes> <documenttypes xmlns:MMString="http://www.macromedia.com/schemes/data/string/"> At the location in the document type definition file where you want to provide a localized string, use the directive to define a placeholder for the localized MMString:loadstring string. You can specify this placeholder in one of the following ways: <description>...
  • Page 45 <loadstring>myJSPDocType/Description</loadstring> </description> <description> <loadstring id="myJSPDocType/Description" /> </description> In these examples, is a unique string identifier that acts as a myJSPDocType/Description placeholder for the localized string. The localized string is defined in the next step. In the Configuration/Strings folder, create a new XML file (or edit an existing file) that defines the localized string.
  • Page 46 Opening a document in Dreamweaver When a user opens a file, Dreamweaver follows a series of steps to identify the document type based on the file’s extension. If Dreamweaver successfully finds a unique document type, Dreamweaver uses that type and loads the associated server model (if any) for the document that the user is opening.
  • Page 47 <panelset> Description Outermost tag, which signals the start of the panel set description. Attributes None. Contents This tag may contain one or more <application>, <document>, or <panelset> tags. Container None. Example <panelset> <!-- panelset tags here --> </panelset> <application> Description Specifies the application window’s initial position and size.
  • Page 48 <document> Description Specifies the Document window’s initial position and size. Attributes rect, maximize specifies the position and size of the Document window. The string is in the form rect “left top right bottom” specified as integers. If the value is , the value maximize...
  • Page 49 specifies the top position of the panel group. Its value can be an integer or a value that is relative to the screen. If the integer value is not on the screen, the panel group appears in the closest screen position possible to make it visible on the screen. Relative values can be “top”...
  • Page 50 is an integer that specifies the height of the panel in pixels. This attribute is height optional. If is not specified, the build-in default for each panel is used. height Width is inherited from the parent. is a number that is the ID of the front panel. activepanel is a Boolean value: if the panel is visible;...
  • Page 51 is a number that indicates the ID for the panel. The following table contains a list of values: Product Panel Flash Properties Actions Align Behaviors Components Component Inspector Color Mixer Color Swatches History Info Library Movie Explorer Output Properties Project Transform Scene Strings...
  • Page 52 Container This tag must be contained in a tag. panelcontainer Example <panelset> <panelframe rect=”196 453 661 987” visible=”true” dock=”floating”> <panelcontainer title=”Color” height=”250” visible=”true” expanded=”true” activepanel=”20”> <panel id=”20”></panel> </panelcontainer> </panelframe> </panelset> Customizing the Code view toolbar The Code view toolbar displays 15 buttons initially. This is a subset of the buttons that are available.
  • Page 53 enabled="dw.getFocus(true) == 'textView' || dw.getFocus(true) == ¬ 'html'" command="if (dw.getFocus(true) == 'textView' || dw.getFocus(true) ¬ == 'html') dw.getDocumentDOM().source.expandAllCodeFragments();" update="onViewChange" /> --> Save the file. To make any buttons that are not visible in the toolbar appear, you remove the comment that surrounds a button in the XML file.
  • Page 54 Customizing Dreamweaver...

  • Page 55: Chapter 2: Customizing Code View

    CHAPTER 2 Customizing Code View Macromedia Dreamweaver 8 uses two devices in Code view that help you enter code quickly and make your code readable and accurate. These two devices are code hints and code coloring. In addition, Dreamweaver validates your code for the target browsers that you specify and allows you to change default HTML formatting.
  • Page 56 Dreamweaver cannot express some types of Code Hints menus through the XML file or the JavaScript API. Both the CodeHints.xml file and the JavaScript API expose a useful subset of the Code Hints engine, but some Dreamweaver functionality is not accessible. For example, there is no JavaScript hook to open a color picker, so Dreamweaver cannot express the Attribute Values menu using JavaScript.
  • Page 57 <menugroup name="Tag Names" enabled="true" id="CodeHints_Tag_Names"> <description> <![CDATA[ When you type '<', a drop-down menu shows all possible tag names. You can edit the list of tag names using the <a href="javascript:dw.popupTagLibraryEditor()"> Tag Library Editor </a>]]> </description> </menugroup> <menugroup name="Function Arguments" enabled="true" id="CodeHints_Function_Arguments">...
  • Page 58 <menugroup> Description Each tag corresponds to a type of menu. You can see the menu types that menugroup Dreamweaver defines by selecting the Code Hints category from the Preferences dialog box. Select Preferences from the Edit menu to display the Preferences dialog box. You can create a new menu group or add to an existing group.
  • Page 59 This attribute lets you specify different lists of function names for ASP-JavaScript (ASP-JS), Java Server Pages (JSP), Macromedia ColdFusion, and so on. You can specify attribute as a comma-separated list of document type IDs. See the doctypes Dreamweaver Configuration/Documenttypes/MMDocumentTypes.xml file for a list of...
  • Page 60 attribute specifies whether the pattern is case-sensitive. The possible casesensitive values for the attribute are , or a subset of the comma- casesensitive true false separated list that you specify for the attribute. The list of document types lets doctypes you specify that the pattern is case-sensitive for some document types but not for others.
  • Page 61 attribute, which is optional, specifies the path to an image file that icon Dreamweaver displays as an icon to the left of the menu text. The location is expressed as a URL, relative to the Configuration folder. attribute, which is optional, specifies a text string to appear in the icon area texticon instead of an image file.
  • Page 62 This attribute lets you specify different lists of function names for ASP-JavaScript (ASP-JS), Java Server Pages (JSP), Macromedia ColdFusion, and so on. You can specify attribute as a comma-separated list of document type IDs. For a list of...

  • Page 63: Code Coloring

    Code coloring Dreamweaver lets you customize or extend the code coloring schemes that you see in Code view so that you can add new keywords to a scheme or add code coloring schemes for new document types. If you develop JavaScript functions to use in your client-side script, for example, you can add the names of these functions to the keywords section so that they display in the color that is specified in Preferences.
  • Page 64 <tagColor id="CodeColor_HTMLTable" text="#009999" /> <syntaxColor id="CodeColor_HTMLComment" text="#999999" italic="true" > … </colorGroup> </codeColors> Colors are specified in red-green-blue (RGB) hexadecimal values. For example, the statement in the preceding XML code assigns a blue-green (teal) color to the ID text="009999" "CodeColor_JavascriptNative" The following excerpt from the codeColoring.xml file illustrates the hierarchy of tags in a code coloring scheme file, and it also illustrates the relationship between the styles file and the scheme file: <codeColoring>...
  • Page 65 Notice that the tags in the Colors.xml file assign color and style syntaxColor tagColor values to an string value. The value is then used in the codeColoring.xml file to assign a style to a scheme tag. For example, the tag in the codeColoring.xml excerpt has defaultTag .
  • Page 66 Contents blockEnd blockStart brackets charStart charEnd charEsc commentStart commentEnd cssProperty cssSelector cssValue defaultAttribute defaultText endOfLineComment entity functionKeyword idChar1 idCharrest ignoreCase ignoreMMTParam ignoreTags keywords numbers operators regexp sampletext searchPattern stringStart stringEnd stringEsc urlProtocol urlProtocols Container tag. codeColoring Example <scheme name="Text" id="Text" doctypes="Text" priority="1">...
  • Page 67 Attributes canNest doctypes name scheme Specifies whether the scheme can nest inside itself. Values are canNest "Yes" "No" The default is "No" Required. Specifies a comma-separated list of doctypes="doc_type1, doc_type2,…" document types into which you can nest this code coloring scheme. Document types are defined in the Dreamweaver Configuration/Document Types/MMDocumentTypes.xml file.
  • Page 68 <charStart> Description Contains a text string that represents the delimiter of the start of a character. You must specify tags in pairs. Multiple … pairs are allowed. charStart charEnd charStart charEnd Attributes None. Example <charStart><![CDATA[']]></charStart> <charEnd> Description Contains a text string that represents the delimiter of the end of a character. You must specify tags in pairs.
  • Page 69 Attributes None. Example <commentStart><![CDATA[<%--]]></commentStart> <commentEnd> Description A text string that delimits the end of a comment block. You must specify the commentStart tags in pairs. Multiple … pairs are allowed. commentEnd commentStart /commentEnd Attributes None. Example <commentEnd><![CDATA[--%>]]></commentEnd> <cssImport/> Description An empty tag that indicates the code coloring rule for the function of the @import style...
  • Page 70 Attributes name A string that assigns a name to the CSS function. name="cssMedia_name" @media Required. An identifier string that maps color and style to this syntax id="id_string" item. Example <cssMedia name="@media" id="CodeColor_CSSMedia" /> <cssProperty/> Description An empty tag that indicates CSS rules and holds code coloring attributes. Attributes name A string that assigns a name to the CSS property.
  • Page 71 <cssValue/> Description An empty tag that indicates CSS rules and holds code coloring attributes. Attributes name A string that assigns a name to the CSS value. name="cssValue_name" Required. An identifier string that maps color and style to this syntax id="id_string" item.
  • Page 72 Example <defaultTag name="Other Tags" id="CodeColor_HTMLTag" /> <defaultText/> Description Optional. If this tag is present, all text that is not defined by any other tag is colored according to the style assigned to this tag. If this tag is omitted, black text is used. Attributes name A string that assigns a name to the CSS Selector.
  • Page 73 Attributes name A string that assigns a name to the entity. name="entity_name" Required. An identifier string that maps color and style to this syntax id="id_string" item. Example <entity name="Special Characters" id="CodeColor_HTMLEntity" /> <functionKeyword> Description Identifies keywords that define a function. Dreamweaver uses these keywords to perform code navigation.
  • Page 74 <idCharRest> Description A list of characters that are to be recognized as the remaining characters in an identifier. If is not specified, all characters of the identifier are validated against this list. idChar1 Attributes name A string that assigns a name to the block.
  • Page 75 <ignoreTags> Description Specifies whether markup tags should be ignored. Values are ; the default is Set to when syntax is for tag markup language that is delimited by . Set to < > when syntax is for a programming language. Attributes None.
  • Page 76 <keywords> Description List of keywords for type specified in category attribute. Multiple tags are allowed. keywords Attributes name A string that assigns a name to the list of keywords. name="keywords_name" Required. An identifier string that maps color and style to this syntax id="id_string"...
  • Page 77 Attributes name A string that assigns a name to the list of operator characters. name="operator_name" Required. An identifier string that maps color and style to this syntax id="id_string" item. Example <operators name="Operator" id="CodeColor_JavaOperator"><![CDATA[+-*/ %<>!?:=&|^~]]></operators> <regexp> Description Specifies a list of tags.
  • Page 78 Attributes doctypes The document types for which this sample doctypes="doc_type1, doc_type2,...” text appears. Example <sampleText doctypes="JavaScript"><![CDATA[/* JavaScript */ function displayWords(arrayWords) { for (i=0; i < arrayWords.length(); i++) { // inline comment alert("Word " + i + " is " + arrayWords[i]); var tokens = new Array("Hello", "world");...
  • Page 79 Attributes name id, wrap A string that assigns a name to the block. name="stringStart_name" stringStart Required. An identifier string that maps color and style to this syntax id="id_string" item. . Defines whether code coloring recognizes text strings that wrap wrap="true" "false"...
  • Page 80 <tagGroup> Description This tag groups one or more tags to which you can assign a unique color and style. Attributes name taglibrary tags Required. An identifier string that maps color and style to this syntax id="id_string" item. A string that Dreamweaver displays in the code color editor. name="display_name"...
  • Page 81 Sample code <!-- #EndEditable --> <p><b><font size="+2">header</font></b></p> <!-- #BeginEditable "test" --> <p>Here's some editable text </p> <p>&nbsp;</p> <!-- #EndEditable --> Example <blockStart doctypes="ASP-JS,ASP-VB, ASP.NET_CSharp, ASP.NET_VB, ColdFusion,CFC, HTML, JSP,LibraryItem,PHP_MySQL" scheme="innerText"><![CDATA[<!--\s*#BeginTemplate]]></blockStart> customText This value tells Dreamweaver to use custom colors to color the block delimiters. Sample code The delimiters for blocks of PHP script, which appear in red, provide an example of the effect of the...
  • Page 82 Example <blockStart doctypes="PHP_MySQL" scheme="outerTag"><![CDATA[<script\s+language="php">]]></blockStart> innerTag This value is identical to the value, except that the tag coloring is taken from the outerTag scheme inside the delimiters. This is currently used for the tag. html nameTag This value specifies that the string is the opening of a tag and string is blockStart...
  • Page 83 Scheme processing Dreamweaver has three basic code coloring modes: CSS mode, Script mode, and Tags mode. In each mode, Dreamweaver applies code coloring only to particular fields. The following chart indicates which fields are subject to code coloring in each mode. Field Tags Script...
  • Page 84 Wildcard characters The following is a list of wildcard characters that Dreamweaver supports, along with the strings to specify them and descriptions of their usage. Wildcard Escape Description string Wildcard Skip all characters in the rule until the character that follows the wildcard is found.
  • Page 85 Escape characters The following is a list of escape characters that Dreamweaver supports, along with the strings to specify them and descriptions of their usage. Escape Escape Description character string Backslash The backslash character (\) is the code coloring escape character, so it must be escaped to be specified in a code coloring rule.
  • Page 86 Scheme precedence Dreamweaver uses the following algorithm to color text syntax in Code view: Dreamweaver determines the initial syntax scheme based on the document type of the current file. The file document type is matched against the scheme.documentType attribute. If no match is found, the scheme where scheme.documentType = "Text"...
  • Page 87 Preferences dialog box. Macromedia recommends that you create backup copies of all XML files before you make changes. You should verify all manual changes before you edit color and style settings using the Preferences dialog box.
  • Page 88 To edit styles for a scheme using the Code Coloring category in the Preferences dialog box, double-click a document type, or click the Edit Coloring Scheme button, to open the Edit Coloring Scheme dialog box. To edit the style for a particular element, select it in the Styles For list. The items listed in the Styles For pane include the fields for the scheme being edited and also the schemes that might appear as blocks within this scheme.
  • Page 89 Code coloring examples The following code coloring examples illustrate the code coloring schemes for a cascading style document and a JavaScript document. The lists of keywords in the JavaScript example are abbreviated for the sake of keeping the example short. CSS code coloring <scheme name="CSS"...
  • Page 90 CSS sample text The following sample text for the CSS scheme illustrates the CSS code coloring scheme: /* Comment */ H2, .head2 font-family : 'Sans-Serif'; font-weight : bold; color : #339999; The following lines from the Colors.xml file provide the color and style values that are seen in the sample text and were assigned by the code coloring scheme: <syntaxColor id="CodeColor_CSSSelector"...
  • Page 91 <searchPattern><![CDATA[=\s*/\e*\\/]]></searchPattern> </regexp> <idChar1>_$abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ</ idChar1> <idCharRest name="Identifier" id="CodeColor_JavascriptIdentifier">_$abcdefghijklmnopqrstuvwxyzABCDEFGH IJKLMNOPQRSTUVWXYZ0123456789</idCharRest> <functionKeyword name="Function Keyword" id="CodeColor_JavascriptFunction">function</functionKeyword> <keywords name="Reserved Keywords" id="CodeColor_JavascriptReserved"> <keyword>break</keyword> . . . </keywords> <keywords name="Native Keywords" id="CodeColor_JavascriptNative"> <keyword>abs</keyword> . . . </keywords> <keywords id="CodeColor_JavascriptNumber"> <keyword>Infinity</keyword> <keyword>Nan</keyword> </keywords> <keywords name="Client Keywords" id="CodeColor_JavascriptClient"> <keyword>alert</keyword> .

  • Page 92: Code Validation

    tokens Array("Hello", "world"); displayWords(tokens); The following lines from the Colors.xml file provide the color and style values that are seen in the sample text and were assigned by the code coloring scheme: <syntaxColor id="CodeColor_JavascriptComment" text="#999999" italic="true" /> <syntaxColor id="CodeColor_JavascriptFunction" text="#000000" bold="true" >...
  • Page 93 Contents tags. property value Container None. Example <css-support> . . . </css-support> <property> Description Defines a supported CSS property for the browser profile. Attributes name, names, supportlevel, message The name of the property for which you are specifying support. name="property_name" A comma-separated list of property names="property_name property_name, ..."...
  • Page 94 attribute defines a message string that message="message_string" message Dreamweaver displays when it finds the property in a document. The message string describes possible limitations or workarounds for the property value. Contents value Container css-support Example <property name="background-color" supportLevel="supported"> <value> Description Defines a list of values supported by the current property.

  • Page 95: Changing Default Html Formatting

    Container property Example <property name="margin"> <value type="units" name="ex" supportLevel="warning" message="The implementation of ex units is buggy in Safari 1.0."/> <value type="units" names="%,em,px,in,cm,mm,pt,pc”/> <value type="named" name="auto"/> <value type="named" name="inherit"/> </property> Changing default HTML formatting To change general code formatting preferences, use the Code Format category of the Preferences dialog box.
  • Page 96 Customizing Code View...

  • Page 97: Part 2: Overview Of Extending Dreamweaver

    PART 2 Overview of Extending Dreamweaver Learn the fundamental concepts of the Macromedia Dreamweaver 8 interface and how to extend Dreamweaver to suit your web development needs. These fundamental concepts include the Dreamweaver folders, extension APIs, Dreamweaver interface components, the Dreamweaver Document Object Model (DOM), and Dreamweaver document types.

  • Page 99: Chapter 3: Extending Dreamweaver

    “Creating an extension” on page The following features of Macromedia Dreamweaver 8 let you create extensions: An HTML parser (also called a renderer), which makes it possible to design user interfaces (UIs) for extensions using form fields, layers, images, and other HTML elements.

  • Page 100: Types Of Dreamweaver Extensions

    Types of Dreamweaver extensions The following list describes the types of Dreamweaver extensions that are documented in this guide: Insert Bar object extensions create changes in the Insert bar. An object is typically used to automate inserting code into a document. It can also contain a form that gathers input from the user and JavaScript that processes the input.
  • Page 101 Server Behavior extensions add blocks of server-side code (ASP, JSP, or ColdFusion) to the document. The server-side code performs tasks on the server when the document is viewed in a browser. Server behaviors appear on the Plus ( ) menu of the Dreamweaver Server Behaviors panel.

  • Page 102: Configuration Folders And Extensions

    You can use the files in the Dreamweaver Configuration folder as examples, but these files are generally more complex than the average extension that is available on the Macromedia Exchange website. For more information on the contents of each subfolder within the Configuration folder, see the Configuration_ReadMe.htm file.
  • Page 103 The Configuration/Shared folder does not correspond to a specific extension type. It is the central repository for utility functions, classes, and images that are used by more than one extension. The files in the Configuration/Shared/Common folder are designed to be useful to a broad range of extensions.
  • Page 104 Multiuser Configuration folders For the multiuser operating systems of Windows XP, Windows 2000, and Macintosh OS X, Dreamweaver creates a separate Configuration folder for each user in addition to the Dreamweaver Configuration folder. Any time Dreamweaver or a JavaScript extension writes to the Configuration folder, Dreamweaver automatically writes to the user Configuration folder instead.

  • Page 105: Extension Apis

    To reload extensions Control-click (Windows) or Option-click (Macintosh) the Categories menu in the Insert bar’s title bar. Select Reload Extensions. Remember that in a multiuser operating system you should edit copies of configuration files in your user Configuration folder rather than editing master configuration files.
  • Page 106 How Dreamweaver processes JavaScript in extensions Dreamweaver checks the Configuration/extension_type folder during startup. If it encounters an extension file within the folder, Dreamweaver processes the JavaScript by completing the following steps: Compiling everything between the beginning and ending tags SCRIPT Executing any code within tags that is not part of a function declaration SCRIPT...

  • Page 107: Localizing An Extension

    Dreamweaver supports the use of event handlers within links. Event handlers in links must use syntax, as shown in the following example: <a href=”#” onMouseDown=alert(‘hi’)>link text</a> Plug-ins (set to at all times) are supported in the of extensions. The play BODY statement, Java applets, and ActiveX controls are not supported document.write()
  • Page 108 Do not write JavaScript code in the HTML files except for required event handlers. This eliminates the need to fix a bug multiple times for multiple translations after the HTML files are replicated and translated into other languages. XML String files Store all strings in XML files in the Dreamweaver Configuration/Strings folder.

  • Page 109: Working With The Extension Manager

    If you create extensions for others users, you must package them according to the guidelines on the Macromedia Exchange website (www.macromedia.com/exchange) under the Help > How to Create an Extension category. After you have written and tested an extension in the Extension Manager, select File >...
  • Page 110 Extending Dreamweaver...

  • Page 111: Chapter 4: User Interfaces For Extensions

    If you plan to submit your extension for Macromedia certification, you need to follow the guidelines that are available within the Extension Manager files on the Macromedia Exchange website (www.macromedia.com/exchange).

  • Page 112: Dreamweaver Html Rendering Control

    UIs are rendered with extra space around them because Dreamweaver uses its HTML rendering engine to display extension UIs. Macromedia has improved form-control rendering to more closely match the browsers. To take advantage of the rendering improvements, you must use one of three new...

  • Page 113: Using Custom Ui Controls In Extensions

    In most cases, statements must go on the first line of a document. However, to avoid DOCTYPE conflicts with extension-specific directives that, in previous versions, were required to be on the first line of a file (such as the comment at the top of a Property inspector file, or the MENU- directive in a command), statements and directives can now be in...
  • Page 114 Editable select lists Extension UIs often contain pop-up lists that are defined using the tag. In select Dreamweaver, you can make pop-up lists in extensions editable by adding editable="true" to the tag. To set a default value, set the attribute and the value that you select editText want the select list to display.
  • Page 115 The following example creates a Command extension that contains an editable select list using common JavaScript functions: To create the example: Create a new blank file in a text editor. Enter the following code: <html> <head> <title>Editable Dropdown Test</title> <script language="javascript"> function getAlert() var i=document.myForm.mySelect.selectedIndex;...
  • Page 116 </select> </td> </tr> </table> </form> </div> </body> </html> Save the file as EditableSelectTest.htm in the Dreamweaver Configuration/Commands folder. To test the example: Restart Dreamweaver. Select Commands > EditableSelectTest. When you select a value from the list, an alert message displays the index of the value and the text.
  • Page 117 The following figure shows an advanced Recordset dialog box that uses a database tree control and a variable grid control: Adding a database tree control The database tree control has the following attributes: Attribute name Description Name of the database tree control name Width and height, in pixels control.style...
  • Page 118 Attribute name Description When this attribute is specified, the tree control does not draw the noexpandbuttons expand Plus (+) or collapse Minus (-) indicators or the associated arrows on the Macintosh. This attribute is useful for drawing multicolumn list controls. When this attribute is specified, the tree control displays a header at showheaders the top that lists the name of each column.
  • Page 119 The following example creates a variable grid control that is 500 pixels wide, with five columns of various widths: <select name="ParamList" style="width:800px;" type="mmparameterlist" columns="Name,SQL Data Type,Direction, Default Value,Run-time Value" columnWidth="100,25,11," size=6> This example creates two blank columns that are 182 pixels wide. (The specified columns total 136.
  • Page 120 Adding tree controls Tree controls display data in a hierarchical format and let users expand and collapse nodes in the tree. The tag lets you create tree controls for any type of information; MM:TREECONTROL unlike the database tree control that is described in “Adding a database tree control”...
  • Page 121 tags have the following attributes: MM:TREECONTROL Attribute name Description Name of the tree control name Optional. Number of rows that show in the control; default is 5 rows size Optional. If the number of nodes in the attribute exceeds theControl theControl the value of the size attribute, scrollbars appear Optional.
  • Page 122 attributes are described in the following table: MM:TREENODE Attribute name Description Name of the node name Contains the content for the given node. For more than one column, value this is a pipe-delimited string. To specify an empty column, place a single space character before the pipe (|).
  • Page 123 The following example adds a node to the top level of a tree: var tree = document.myTreeControl; //add a top-level node to the bottom of the tree tree.innerHTML = tree.innerHTML + ‘<mm:treenode name="node3"¬ value="node3">’; Adding a child node To add a child node to the currently selected node set the innerHTML property of the selected node.

  • Page 124: Adding Flash Content To Dreamweaver

    You might want to keep a text box and a color picker synchronized. The following example creates a text box that synchronizes the color of the text box with the color of the color picker: <input type = "mmcolorbutton" name="fgcolorPicker" onChange="document.fgcolorText.value=this.value">...
  • Page 125 <title>My Flash Movie</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body> <body> <form> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/ swflash.cab#version=6,0,29,0" width="200" height="100"> <param name="movie" value="myFlash.swf"> <param name="quality" value="high"> <embed src="myFlash.swf" quality="high" pluginspage="http:// www.macromedia.com/go/getflashplayer" type="application/x-shockwave- flash" width="200" height="100"></embed> </object> </form> </body> </html> Adding Flash content to Dreamweaver...
  • Page 126 Save the file again. Next, exit and restart Dreamweaver. Select the Command > My Flash Movie menu option, and your Flash content appears in a Dreamweaver dialog box, as shown in the following figure: This example shows a simple implementation of Dreamweaver’s Flash content support. After you are familiar with building objects and commands as well as more sophisticated forms, you can integrate Flash content into your Dreamweaver extensions for a more dynamic user experience.

  • Page 127: Chapter 5: The Dreamweaver Document Object Model

    CHAPTER 5 The Dreamweaver Document Object Model In Macromedia Dreamweaver 8, the Document Object Model (DOM) is a critically important structure for extension builders. It lets you access and manipulate elements within a user’s document and within the extension file.

  • Page 128: Which Document Dom

    Which document DOM? It is important to distinguish between the DOM of the user’s document and the DOM of the extension. The information in this chapter applies to both types of Dreamweaver documents, but the way that you reference each DOM is different. If you are familiar with JavaScript in browsers, you can reference objects in the active document by writing .
  • Page 129 Objects, properties, and methods of the Dreamweaver DOM The following table lists the objects, properties, methods, and events that the Dreamweaver DOM supports. Some properties are read-only when they are accessed as properties of a specific object. A bullet (•) indicates properties that are read-only when they are used in the listed context.
  • Page 130 Object Properties Methods Events In addition to the properties that Only those methods None form are available for all tags: available to all tags (an array of tags:elements • button, checkbox, password, radio, reset, select, submit, text, file, hidden, image, objects) textarea mmcolorbutton...
  • Page 131 Object Properties Methods Events In addition to the properties that Only those methods that None option are available for all tags: are available to all tags text In addition to the properties that None mmcolorbutton onChange are available for all tags: name value Matches Netscape Navigator...
  • Page 132 Property or method Return value that contains all the immediate children of the childNodes • NodeList object. Typically the document has a single child, document object. HTML The JavaScript object that corresponds to the tag. documentElement • HTML This property is shorthand for getting the value of and extracting the tag from document.childNodes...
  • Page 133 Property or method Return value that contains all the immediate children of childNodes • NodeList the tag. The HTML name for the tag, such as , or tagName • BLINK This value always returns in uppercase letters. A string that contains the value of the specified tag attrName attribute.
  • Page 134 Property or method Return value that can be used to step through child tags getElementsByTagName(tagName) NodeList of type (for example, , and so on). tagName If the argument is , the function returns all LAYER tags and all absolutely positioned LAYER ILAYER tags.
  • Page 135 Properties and methods of comment objects A JavaScript object represents each HTML comment. The following table details the properties and methods of comment objects that are taken from DOM Level 1 and are used in Dreamweaver. A bullet (•) marks read-only properties. Property or method Return value nodeType •...
  • Page 136 To find the specific version of Dreamweaver, check first for the existence of appVersion then for the version number, as shown in the following example: if (dreamweaver.appVersion && ¬ dreamweaver.appVersion.indexOf('3.01') != -1){ // execute code object has a property called that lets you query the dreamweaver systemScript...
  • Page 137 PART 3 Extension APIs Learn about functions that you need to write when you create new objects, toolbars, tag editors, floating panels, server behaviors, components, or server models. Chapter 6: Insert Bar Objects ......139 Chapter 7: Commands.

  • Page 139: Chapter 6: Insert Bar Objects

    CHAPTER 6 Insert Bar Objects In Macromedia Dreamweaver, objects insert specific strings of code into a user’s document. Objects commonly reside on the Insert bar, on the Insert menu, or both. Objects let users add content, such as images, layers, and tables, by clicking icons or menu options. You can add items to the Insert bar to automate repetitive tasks for your users or even create dialog boxes for users to set specific attributes.

  • Page 140: How Object Files Work

    The simplest objects contain only the HTML to insert, without a BODY and HEAD tag. For more information, see “Customizing Dreamweaver” on the Macromedia Support Center. The 18 x 18 pixel image that appears on the Insert bar Additions to the insertbar.xml file.

  • Page 141: The Insert Bar Definition File

    After that, its visibility and position are saved in the registry. Insertbar.xml tag hierarchy The following example shows the format and hierarchy of nested tags in the insertbar.xml file: <?xml version="1.0" ?> <!DOCTYPE insertbarset SYSTEM "-//Macromedia//DWExtension insertbar 5.0"> <insertbar xmlns:MMString="http://www.macromedia.com/schemes/data/string/"> <category id="DW_Insertbar_Common" MMString:name="insertbar/categorycommon" folder="Common">...
  • Page 142 Insert bar definition tags The insertbar.xml file contains the following tags and attributes: <insertbar> Description This tag signals the content of the Insert bar definition file. The closing tag </insertbar> specifies the end of the content. Attributes None. Example <insertbar> <category id="DW_Insertbar_Common"...
  • Page 143 <menubutton> Description This tag defines a pop-up menu for the Insert bar. Attributes id, image, {showIf}, {name}, {folder} Example <menubutton id="DW_ImageMenu" name="Images" image="Common\imagemenu.gif" folder="Images"> <button id="DW_Image" image="Common\Image.gif" enabled="" showIf="" file="Common\Image.htm" /> </menubutton> <button /> Description This tag defines a button on the Insert bar that the user clicks to execute the code that the attributes specify.
  • Page 144 <checkbutton /> Description A checkbutton is a button that has a checked or unchecked state. When clicked, a checkbutton appears pressed in and highlighted. When it is unchecked, a checkbutton appears flat. Dreamweaver has Mouse-over, Pressed, Mouse-over-while-pressed, and Disabled- while-pressed states. The command must ensure that clicking the checkbutton causes its state to change.
  • Page 145 If you do not specify , the button always true showIf appears. The possible enablers are _SERVERMODEL_ASP, _SERVERMODEL_ASPNET, (for all versions of Macromedia ColdFusion), _SERVERMODEL_JSP, _SERVERMODEL_CFML (only for UltraDev version 4 of ColdFusion), _SERVERMODEL_CFML_UD4 _SERVERMODEL_PHP, _FILE_TEMPLATE, _VIEW_CODE, _VIEW_DESIGN, _VIEW_LAYOUT,...
  • Page 146 enabled="enabler" Description This attribute specifies that the item is available to the user if the value is . If DW_enabler true you do not specify the function, the item defaults to always enabled. The possible enabled enablers are _SERVERMODEL_ASP, _SERVERMODEL_ASPNET, _SERVERMODEL_JSP, (for all versions of ColdFusion), (only for _SERVERMODEL_CFML...
  • Page 147 Example command="dw.showTagChooser()" file="file_path" Description attribute specifies the path, relative to the Dreamweaver Configuration folder, of an file object file. Dreamweaver derives the tooltip for the object icon from the title of the object file, unless you specify the attribute. name Example file="Templates/Editable.htm"...

  • Page 148: Modifying The Insert Bar

    Modifying the Insert bar You can move objects from one category to another, rename categories, and completely remove objects from the panel. To make the changes appear in the Insert bar, you must either restart Dreamweaver or reload extensions. For information on reloading extensions, see “Reloading extensions”...
  • Page 149 To change the order of categories in the Insert bar: Save a backup copy of insertbar.xml (with a name such as insertbar.backup.xml). Open the original insertbar.xml file. Find the tag that corresponds to the category you want to move, and select that category tag, including all the tags it contains.

  • Page 150: A Simple Insert Object Example

    Edit the insertbar.xml file to identify the location of these new files and set attributes (see “The Insert bar definition file” on page 141) for the button’s appearance. Restart Dreamweaver or reload extensions. The new object appears on the Insert bar in the specified location. Although you can store Object files in separate folders, it’s important that each filename be unique.
  • Page 151 Creating the HTML file The title of the object is specified between the opening and closing tags. You also title specify that the scripting language is JavaScript. To create the HTML file: Create a new blank file. Add the following code: <html>...
  • Page 152 Next, decide whether to use for the next function. The objectTag() insertObject() Strikethrough object simply wraps the tag around the selected text, so it doesn’t meet the criteria for using the function (see “insertObject()” on page 162). insertObject() Within the function, use to determine whether the Code view objectTag()
  • Page 153 To separate the HTML object definition file from the supporting JavaScript functions: Create a new blank file. Paste all the JavaScript functions into the file. Remove the functions from Strikethrough.htm, and add the JavaScript filename to the attribute of the script tag, as shown in the following example: <html>...
  • Page 154 Each tag in the XML file places an icon on the Insert bar and connects it to the button proper HTML file or function. To add the new object to the Insert bar: Find the following line near the beginning of the inserbar.xml file: <category id="DW_Insertbar_Common"...
  • Page 155 To create the function: After the function in Strikethrough.js, create a function called objectTag() by entering the following code: fontColorRed() function fontColorRed(){ var dom = dw.getDocumentDOM(); if (dw.getFocus() == 'textView' || dw.getFocus(true) == 'html'){ var upCaseTag = (dw.getPreferenceString("Source Format", "Tags Upper Case", "") == 'TRUE');...
  • Page 156 Save the file as Strikethrough.htm. Reload the extensions (see “Reloading extensions” on page 104). To test the dialog box: Click the Red Text checkbox. Click OK to perform the function, which adds the strike-through: objectTag() Insert Bar Objects...
  • Page 157 Building an Insert bar pop-up menu The Dreamweaver Insert bar introduces a new organization for objects and now supports pop-up menus to help organize objects into smaller groups, as shown in the following figure. The following example builds a new category on the Insert bar called Editorial and then adds a pop-up menu to that category.
  • Page 158 // Manually wrap tags around selection. var dom = dw.getDocumentDOM(); if (dw.getFocus() == 'textView' || dw.getFocus(true) == 'html'){ var upCaseTag = (dw.getPreferenceString("Source Format", "Tags Upper Case", "") == 'TRUE'); // Manually wrap tags around selection. if (upCaseTag){ dom.source.wrapSelection('<FONT COLOR="#0000FF">','</FONT>'); }else{ dom.source.wrapSelection('<font color="#0000FF">','</font>');...
  • Page 159 To edit insertbar.xml: Find the following line of code near the beginning of the file: <insertbar xmlns:MMString="http://www.macromedia.com/schemes/data/ string/"> tag defines the beginning of all the Insert bar contents. insertbar After that line, add a new tag for the Editorial category you want to create, giving...
  • Page 160 After the Strikethrough object button tag, add the hypertext object, as follows: <button id="DW_Blue_Text" image="Editorial\AddBlue.gif name="Blue Text" file="Editorial\AddBlue.htm"/> The button tag does not have a separate closing tag; it simply ends with “/>”. End the pop-up menu with the closing tag. </menubutton>...

  • Page 161: The Objects Api

    The Objects API This section describes the functions in the Objects API. You must define either the or the function. For details about these functions, see insertObject() objectTag() “insertObject()” on page 162. The remaining functions are optional. canInsertObject() Availability Dreamweaver MX. Description This function determines whether to display the Object dialog box.
  • Page 162 Returns Dreamweaver expects nothing. Example The following example opens the myObjectHelp.htm file in a browser; this file explains how to use the extension: function displayHelp(){ var myHelpFile = dw.getConfigurationPath() + '/ExtensionsHelp/myObjectHelp.htm'; dw.browseDocument(myHelpFile); isDomRequired() Description This function determines whether the object requires a valid DOM to operate. If this function returns a value or if the function is not defined, Dreamweaver assumes that the true...
  • Page 163 Description This function is required if the function is not defined. It is called when the objectTag() user clicks OK. It either inserts code into the user’s document and closes the dialog box or displays an error message and leaves the dialog box open. This works as an alternate function to use in objects instead of the function.
  • Page 164 // do some document manipulation here. Exercise left to the reader return errMsg; objectTag() Description functions are mutually exclusive: If both are defined objectTag() insertObject() in a document, the function is used. For more information, see “insertObject()” objectTag() on page 162.
  • Page 165 windowDimensions() Description This function sets specific dimensions for the Options dialog box. If this function is not defined, the window dimensions are computed automatically. Do not define this function unless you want an Options dialog box that is larger than 640 x 480 pixels.
  • Page 166 Insert Bar Objects...

  • Page 167: Chapter 7: Commands

    CHAPTER 7 Commands Macromedia Dreamweaver 8 commands can perform almost any kind of edit to a user’s current document, other open documents, or any HTML document on a local drive. Commands can insert, remove, or rearrange HTML tags and attributes, comments, and text.

  • Page 168: Adding Commands To The Commands Menu

    Dreamweaver calls the function, if defined, to determine which commandButtons() buttons appear on the right side of the Options dialog box and what code should execute when the user clicks the buttons. Dreamweaver scans the command file for a tag. If a form exists, Dreamweaver calls FORM function, which sizes the Options dialog box that contains the windowDimensions()
  • Page 169 Add the following code to the file to create the form: <!DOCTYPE HTML SYSTEM "-//Macromedia//DWExtension layout-engine 5.0// dialog"> <HTML> <HEAD> <!-- Copyright 2001-2002 Macromedia, Inc. All rights reserved. --> <Title>Make Uppercase or Lowercase</Title> <SCRIPT SRC="Change Selection Case.js"></SCRIPT> </HEAD> <BODY> <form name="uorl">...
  • Page 170 The contents of the tag, , appears in the top bar of Title Make Uppercase or Lowercase the dialog box. Within the form, a table with two cells controls the layout of the elements. Within the table cells are the two radio buttons, Uppercase and Lowercase. The Uppercase button has the attribute, making it the default selection and ensuring that the user checked...
  • Page 171 To determine whether the command should be active or dimmed: Create a new blank file. Add the following code: function canAcceptCommand(){ var theDOM = dw.getDocumentDOM(); // Get the DOM of the current document var theSel = theDOM.getSelection(); // Get start and end of selection var theSelNode = theDOM.getSelectedNode();...
  • Page 172 The next part of the statement ( return && (theSelNode.nodeType == Node.TEXT_NODE checks to see if the selected node type is text. If so, the function canAcceptCommand() returns the value . If the node type is not text, the test continues to see if the node has true children ( ), and if the type of the first child node is text...
  • Page 173 Linking functions to the OK and Cancel buttons When the user clicks OK or Cancel, the extension needs to perform the appropriate action. You determine the appropriate action by specifying which JavaScript function to perform when either button is clicked. To link the OK and Cancel button to functions: Open the file Change Case.js in the Configuration/Commands folder.
  • Page 174 // Get the node that contains the selection. var theSelNode = theDOM.getSelectedNode(); // Get the children of the selected node. var theChildren = theSelNode.childNodes; var i = 0; if (theSelNode.hasChildNodes()){ while (i < theChildren.length){ if (theChildren[i].nodeType == Node.TEXT_NODE){ var selText = theChildren[i].data; var theSel = theDOM.nodeToOffsets(theChildren[0]);...
  • Page 175 function first tests the property changeCase() . The document.forms[0].elements[0].checked document.forms[0].elements[0] property refers to the first element in the first form of the current document object, which is the UI for the extension. The property has the value if the element is checked checked true (or enabled) and...

  • Page 176: The Commands Api

    Testing the extension After you place the files in the Commands folder, you can test the extension. To test the extension: Restart Dreamweaver or reload extensions. For information on reloading extensions, see “Reloading extensions” on page 104. The Change Case entry should now appear on the Commands menu. Type some text in a document.
  • Page 177 Example The following example of the function makes the command available canAcceptCommand() only when the selection is a table: function canAcceptCommand(){ var retval=false; var selObj=dw.getDocumentDOM.getSelectedNode(); return (selObj.nodeType == Node.ELEMENT_NODE && ¬ selObj.tagName=="TABLE");{ retval=true; return retval; commandButtons() Description This function defines the buttons that should appear on the right side of the Options dialog box and their behaviors when they are clicked.
  • Page 178 isDomRequired() Description This function determines whether the command requires a valid DOM to operate. If this function returns a value of or if the function is not defined, Dreamweaver assumes that true the command requires a valid DOM and synchronizes the Design and Code views of the document before executing.
  • Page 179 Arguments platform The value of the argument is either , depending on platform "macintosh" "windows" the user’s platform. Returns Dreamweaver expects a string of the form "widthInPixels,heightInPixels" The returned dimensions are smaller than the size of the entire dialog box because they do not include the area for the OK and Cancel buttons.
  • Page 180 Commands...

  • Page 181: Chapter 8: Menus And Menu Commands

    CHAPTER 8 Menus and Menu Commands Macromedia Dreamweaver 8 creates all its menus from the structure defined in the menus.xml file in the Dreamweaver Configuration/Menus folder. You can rearrange, rename, and remove menu commands by editing the menus.xml file. You can also add, change, and remove keyboard shortcuts for menu commands, although in most cases it is easier to do that using the Keyboard Shortcut Editor (see Dreamweaver Help).

  • Page 182: About The Menus.xml File

    About the menus.xml file The menus.xml file contains a structured list of menu bars, menus, menu commands, separators, shortcut lists, and keyboard shortcuts. These items are described by XML tags that you can edit in a text editor. Be careful when making changes to menus. Dreamweaver ignores any menu or menu command that contains an XML syntax error.
  • Page 183 The menu ID for the menu bar. Each menu ID in the menus.xml file should be unique. Indicates that the menu bar should appear only on the given platform. Valid platform values are "win" "mac" Contents This tag must contain one or more tags.
  • Page 184 Specifies that the menu should appear only if the given Dreamweaver enabler is showIf the value . The possible enablers are: true _SERVERMODEL_ASP, _SERVERMODEL_ASPNET, (for all versions of Macromedia ColdFusion), _SERVERMODEL_JSP, _SERVERMODEL_CFML (for UltraDev version 4 of ColdFusion), _SERVERMODEL_CFML_UD4 _SERVERMODEL_PHP, _FILE_TEMPLATE, _VIEW_CODE, _VIEW_DESIGN, _VIEW_LAYOUT, .
  • Page 185 The keyboard shortcut for the command, if any. Use the following strings to specify modifier keys: specifies the Control key (Windows) or Command key (Macintosh). interchangeably specify the Alt key (Windows) or Option key (Macintosh). specifies the Shift key on both platforms. Shift specifies the Control key on both platforms.
  • Page 186 A JavaScript expression that indicates whether the menu command has a check checked mark next to it in the menu; if the expression evaluates as true, the item appears with a check mark. If present, indicates that a menu command is to be determined dynamically, by dynamic an HTML file;...
  • Page 187 Attributes {app} The name of the application in which the separator is shown. Not currently used. Contents None (empty tag). Container This tag must be contained in a tag. menu Example <separator /> <shortcutlist> Description Specifies a shortcut list in the menus.xml file. Attributes {app}, id, {platform} The name of the application in which the shortcut list is available.
  • Page 188 <shortcut> Description Specifies a keyboard shortcut in the menus.xml file. Attributes key, {app}, {platform}, {file}, {arguments}, {command}, id, {name} The key combination that activates the keyboard shortcut. For syntax details, see <menuitem>. The name of the application in which the shortcut is available. Not currently used. Specifies that the shortcut works only on the indicated platform.
  • Page 189 Container This tag must be contained in a tag. menu Example <tool name="Hand tool" id="com.macromedia.dreamweaver.tools.hand"> <!-- tool tags here --> </tool> <action> Description Contains the key combination and JavaScript to execute when the tool is active and the key combination is pressed.
  • Page 190 Example <action name="Set magnification to 50%" key="5" command="dw.activeViewScale = 0.50" id ="DWTools_Zoom_50" /> <activate> Description Contains the key combination to activate the tool. Attributes {name}, key, id A localized version of the action. name The key combination used to activate the tool. For syntax details, see <menuitem>. A unique ID used to reference the action.

  • Page 191: Changing Menus And Menu Commands

    Container This tag must be contained in a tag. tool Example <override name="Quick switch to Hand tool" key="Space" id="DWTools_Hand_Override" /> Changing menus and menu commands By editing the menus.xml file, you can move menu commands within a menu or from one menu to another, add separators to or remove them from menus, and move menus within a menu bar or even from one menu bar to another.
  • Page 192 To move a menu: Quit Dreamweaver. Make a backup copy of the menus.xml file. Open menus.xml in a text editor such as BBEdit, HomeSite, or Wordpad. (Don’t open it in Dreamweaver.) Cut an entire menu and its contents, from the opening tag to the closing tag.
  • Page 193 Open menus.xml in a text editor such as BBEdit, HomeSite, or Wordpad. (Don’t open it in Dreamweaver.) Look at the Keyboard Shortcut Matrix (available from the Dreamweaver Support Center) and find a shortcut that’s not being used or one that you want to reassign. If you reassign a keyboard shortcut, change it on a printed copy of the matrix for future reference.

  • Page 194: Menu Commands

    Items in the formats pop-up menu for a binding in the Bindings panel are specified in Formats.xml files, in subfolders of the ServerFormats folder. You can add entries to this menu from inside Dreamweaver by using the Add Format dialog box. The Tag Library Editor dialog box menu commands are specified in the TagLibraries/ TagImporters/TagImporters.xml file.
  • Page 195 If you add custom menu commands to Dreamweaver, add them at the top level of the Menus folder or create a subfolder. The Macromedia folder MM is reserved for the menu commands that come with Dreamweaver. Modifying the Commands menu You can add certain kinds of commands to the Commands menu, and change their names, without editing the menus.xml file.
  • Page 196 The command is renamed in the Commands menu. To delete a command you’ve created: Select Commands > Edit Command List. A dialog box appears, listing all the commands you can delete. (Commands that are in the default Commands menu don’t appear on this list and can’t be deleted using this approach.) Select a command to delete.

  • Page 197: A Simple Menu Command Example

    Dreamweaver calls the function, if defined, in the selected Menu receiveArguments() Commands file to let the command process any arguments that pass from the menu item. If it is a dynamic menu item, the ID of the menu item passes as the only argument. Dreamweaver calls the function, if defined, to determine which commandButtons()
  • Page 198 Creating the menu commands Add the following HTML menu tags to the end of the menus.xml file to create a menu called MyMenu that contains the Undo and Redo menu items. <menu name="MyMenu" id="MyMenu_Edit"> <menuitem name="MyUndo" key="Cmd+Z" file="Menus/MyMenu.htm" arguments="'undo'" id="MyMenu_Edit_Undo" /> <menuitem name="MyRedo"...
  • Page 199 function canAcceptCommand() var selarray; if (arguments.length != 1) return false; var bResult = false; var whatToDo = arguments[0]; if (whatToDo == "undo") bResult = dw.canUndo(); else if (whatToDo == "redo") bResult = dw.canRedo(); return bResult; receiveArguments() Dreamweaver calls the function to process any arguments that you receiveArguments() defined for the tag.
  • Page 200 In this command, the function processes the arguments and executes receiveArguments() the command. More complex menu commands might call different functions to execute the command. For example, the following code checks whether the first argument is ; if it "foo" is, it calls the function and passes it the second argument.

  • Page 201: A Dynamic Menu Example

    function looks like the following example code: setMenuText() function setMenuText() if (arguments.length != 1) return ""; var whatToDo = arguments[0]; if (whatToDo == "undo") return dw.getUndoText(); else if (whatToDo == "redo") return dw.getRedoText(); else return ""; Placing the command file in the Menu folder To implement the menu Undo and Redo menu items, you must save the MyMenu.htm command file in the Dreamweaver Configuration/Menus folder or a subfolder that you create.
  • Page 202 Creating the dynamic menu items The following menu tags in the menus.xml file define the Preview in Browser submenu of the File menu: <menu name="_Preview in Browser" id="DWMenu_File_PIB"> <menuitem dynamic name="No Browsers Selected" file="Menus/MM/PIB_Dynamic.htm" arguments="'No Browsers'" id="DWMenu_File_PIB_Default" /> <separator /> <menuitem name="_Edit Browser List..."...
  • Page 203 for (i=0; i<PIB.length; i=i+2) browsers[j] = new String(PIB[i]); if (dw.getPrimaryBrowser() == PIB[i+1]) browsers[j] += "\tF12"; else if (dw.getSecondaryBrowser() == PIB[i+1]) browsers[j] += "\tCmd+F12"; browsers[j] += ";id='"+escQuotes(PIB[i])+"'"; if (itemID == "DWPopup_PIB_Default") browsers[j] = MENU_strPreviewIn + browsers[j]; j = j+1; return browsers; function calls the function to obtain an getDynamicContent()
  • Page 204 function canAcceptCommand() var PIB = dw.getBrowserList(); if (arguments[0] == 'primary' || arguments[0] == 'secondary') return havePreviewTarget(); return havePreviewTarget() && (PIB.length > 0); function in the PIB_Dynamic.js file again retrieves the browser canAcceptCommand() list that was created in Preferences. Then it checks whether the first argument ) is primary or secondary.
  • Page 205 var selFile = selFiles[i]; // For server connections, the files will // already be remote URLs. if (selFile.indexOf("://") == (-1)) var urlPrefix = "file:///"; var strTemp = selFile.substr(urlPrefix.length); if (selFile.indexOf(urlPrefix) == -1) bHavePreviewTarget = false; else if (strTemp.indexOf("/") == -1) bHavePreviewTarget = false;...
  • Page 206 function sets the value as the havePreviewTarget() bHavePreviewTarget false default return value. The function performs two basic tests calling the dw.getFocus() function to determine what part of the application currently has input focus. The first test checks whether the site panel has focus ( ).
  • Page 207 var theBrowser = null; var i=0; var browserList = null; var result = false; if (havePreviewTarget()) // Code to check if we were called from a shortcut key if (whichBrowser == 'primary' || whichBrowser == 'secondary') // get the path of the selected browser if (whichBrowser == 'primary') theBrowser = dw.getPrimaryBrowser();...
  • Page 208 if (whichBrowser == 'primary') result = window.confirm(MSG_NoPrimaryBrowserDefined); else if (whichBrowser == 'secondary') result = window.confirm(MSG_NoSecondaryBrowserDefined); // If the user clicked OK, show the prefs dialog with the browser panel. if (result) dw.showPreferencesDialog('browsers'); The function first sets the variable to the value that Dreamweaver passes, whichBrowser .

  • Page 209: The Menu Commands Api

    If the user pressed the shortcut keys (F12 or Ctrl+F12) and no primary or secondary browser has been specified, a dialog box appears to inform the user. If the user clicks OK, the function calls the function with the argument to let the dw.showPreferencesDialog() browsers user specify a browser at that point.
  • Page 210 Returns Dreamweaver expects an array that contains an even number of elements. The first element is a string that contains the label for the topmost button. The second element is a string of JavaScript code that defines the behavior of the topmost button when it is clicked. The remaining elements define additional buttons in the same manner.
  • Page 211 isCommandChecked() Description Determines whether to display a check mark next to the menu item. Arguments {arg1}, {arg2},...{argN} If it is a dynamic menu item, the unique ID that the function getDynamicContents() specifies is the only argument. Otherwise, if the attribute is defined for a arguments tag, the value of that attribute passes to the function...
  • Page 212 receiveArguments() Description Processes any arguments passed from a menu item or from the function. dw.runCommand() If it is a dynamic menu item, it processes the dynamic menu item ID. Arguments {arg1}, {arg2},...{argN} If it is a dynamic menu item, the unique ID that the function getDynamicContents() specifies is the only argument.
  • Page 213 If the attribute is defined for a tag, the value of that attribute passes arguments menuitem to the function (and to the setMenuText() canAcceptCommand() , and functions) as one or more arguments. isCommandChecked() receiveArguments() attribute is useful for distinguishing between two menu items that call the arguments same menu command.
  • Page 214 Example The following example of sets the dimensions of the Parameters dialog windowDimensions() box to 648 x 520 pixels: function windowDimensions(){ return "648,520"; Menus and Menu Commands...

  • Page 215: Chapter 9: Toolbars

    CHAPTER 9 Toolbars You can create a toolbar for Macromedia Dreamweaver 8 simply by creating a file that defines the toolbar and placing that file in the Configuration/Toolbars folder. Within a toolbar file, you can define items such as check buttons, radio buttons, text boxes, and pop-up menus using a few custom XML tags.
  • Page 216 As with menus, you can specify the functionality of individual toolbar items either through the item attributes or through a command file. Macromedia-authored toolbar command files are stored in the Toolbars/MM folder. The Toolbar API is compatible with the Menu Commands API, so toolbar controls can reuse menu command files.
  • Page 217 You cannot drag and drop toolbars between the document window and the Dreamweaver workspace frame. Toolbars remain a fixed size. A toolbar does not shrink if the container shrinks or if other toolbars are placed next to it. You can show or hide toolbars from the View >Toolbars menu. Toolbars cannot overlap.

  • Page 218: A Simple Toolbar Command File

    A simple toolbar command file This simple example implements a Title text box item as seen on the Dreamweaver Document toolbar. The text box item lets the user enter a name for the current Dreamweaver document. You can implement this toolbar example by performing the following steps: Creating the text box Writing the JavaScript code Creating the text box...
  • Page 219 canAcceptCommand(): enable the toolbar item function consists of one line of code that checks to see whether canAcceptCommand() there is a current Document Object Model (DOM) and whether the document is parsed as HTML. The function returns the results of those tests. If the conditions are true Dreamweaver enables the text box item on the toolbar.

  • Page 220: The Toolbar Definition File

    To see the complete HTML file that contains the JavaScript functions for the Title text box, see the EditTitle.htm file in the Toolbars/MM folder. The MM folder is reserved for Macromedia files. Create another folder inside the Toolbars folder, and place your JavaScript code in that folder.
  • Page 221 <!-- main toolbar --> <toolbar id="DW_Toolbar_Main" label="Document"> <radiobutton id="DW_CodeView" . . ./> <radiobutton id="DW_SplitView" . . ./> <radiobutton id="DW_DesignView" . . ./> <separator/> <checkbutton id="DW_LiveDebug" . . ./> <checkbutton id="DW_LiveDataView" . . ./> <separator/> <editcontrol id="DW_SetTitle" . . ./> <menubutton id="DW_FileTransfer" . . ./> <menubutton id="DW_Preview"...
  • Page 222 Defaults to . Specifies where the container="mainframe" "document" "mainframe" toolbar should dock in the Dreamweaver workspace on Windows. If the container is set to , the toolbar appears in the outer workspace frame and operates on the front "mainframe" document. If the container is set to , the toolbar appears in each document "document"...
  • Page 223 This attribute is required if the attribute relativeTo="toolbar_id" initialPosition specifies . Otherwise, it is ignored. Specifies the ID of the toolbar below which this below toolbar should be positioned. Contents tag contains , and tags as well as individual item toolbar include itemref...
  • Page 224 <itemtype/> Description Defines a single toolbar item. Toolbar items include buttons, radio buttons, check buttons, combo boxes, pop-up menus, and so on. For a list of the types of toolbar items that you can define, see “Toolbar item tags” on page 226.
  • Page 225 Specifies that this item appears on the toolbar only if the specified showIf="script" script returns a value. For example, you can use to show certain buttons only true showIf in a given application or only when a page is written in a server-side language such as ColdFusion, ASP, or JSP.

  • Page 226: Toolbar Item Tags

    Toolbar item tags Each type of toolbar item has its own tag and set of required and optional attributes. You can define items either inside or outside of toolbars. In general, it is better to define them toolbar outside of toolbars and refer to them within toolbars using the tag.
  • Page 227 <checkbutton> Description A check button is a button that has a checked or unchecked state and that executes a specific command when clicked. When it is checked, it appears pressed in and highlighted. When it is not checked, it appears flat. Dreamweaver implements the following states for the check button: Mouse-over, Pressed, Mouse-over-while-pressed, and Disabled-while-pressed.
  • Page 228 Radio buttons act the same as the Code view, Design view, and Split view buttons on the Dreamweaver document toolbar. Attributes id, image, tooltip, checked, command, {showIf}, {disabledImage}, {overImage}, {label}, {file}, {domRequired}, {enabled}, {update}, {arguments} For a description of each attribute, see “Item tag attributes”...
  • Page 229 Contents None. Container tag or the tag. toolbar toolbarset Example <MENUBUTTON ID="DW_CodeNav" image="Toolbars/images/MM/codenav.gif" disabledImage="Toolbars/images/MM/codenav_dis.gif" tooltip="Code Navigation" enabled="dw.getFocus() == 'textView' || dw.getFocus() == 'html'" menuID="DWCodeNavPopup" update="onViewChange"/> <dropdown> Description A dropdown menu is a noneditable menu that executes a specific command when you select an entry and the menu updates itself, based on an attached JavaScript function.
  • Page 230 <combobox> Description A combo box is an editable pop-up menu that executes its command when you select an entry or when the user makes an edit in the text box and switches focus. The menu looks and acts the same as the Font control on the Text Property inspector, except it’s a standard size instead of the small Property inspector size.
  • Page 231 Container tag or the tag. toolbar toolbarset Example <EDITCONTROL ID="DW_SetTitle" label="Title: " tooltip="Document Title" width="150" file="Toolbars/MM/EditTitle.htm"/> <colorpicker> Description A color picker is a panel of colors that does not have an associated text box that executes its command when the user selects a new color. This panel looks and acts the same as the color picker on the Dreamweaver Property inspector.

  • Page 232: Item Tag Attributes

    Item tag attributes The attributes for toolbar item tags have the following meanings: id="unique_id" Required. The attribute is an identifier for the toolbar item. The attribute must be unique within the current file and all files that are included within the current file. The tag uses the item to refer to and include an item within a toolbar.
  • Page 233 If an icon is specified for a color picker, the icon replaces the color picker entirely. If the attribute is also set, the current color appears on top of the icon in the specified colorRect rectangle. Example image="Toolbars/images/MM/codenav.gif" disabledImage="image_path" Optional. Dreamweaver ignores the attribute for items other than buttons, disabledImage check buttons, radio buttons, menu buttons, color pickers, and combo buttons.
  • Page 234 label="label string" Optional. This attribute specifies a label that displays next to the item. Dreamweaver does not automatically add a colon to labels. Labels for nonbutton items are always positioned on the left of the item. Dreamweaver places labels for buttons, check buttons, radio buttons, menu buttons, and combo buttons inside the button and to the right of the icon.
  • Page 235 file="command_file_path" Required for pop-up menus and combo boxes. The attribute is optional for other types file of items. The attribute specifies the path, relative to the Configuration folder, of a file command file that contains JavaScript functions to populate, update, and execute the item. attribute overrides the file enabled...
  • Page 236 Example checked="dw.getDocumentDOM() != null && dw.getDocumentDOM().getView() == 'code'" value="script" This attribute is required for pop-up menus, combo boxes, text boxes, and color pickers. Dreamweaver ignores the attribute for other types of items. value To determine what value to display for pop-up menus and combo boxes, Dreamweaver first calls for each item in the menu.
  • Page 237 The following list shows the possible handlers for , from least to update_frequency_list most frequent. If you do not specify the attribute, the update frequency defaults to update frequency. You can specify multiple update frequencies, separated by commas. The onEdit handlers run on any of the following specified events: executes when the server model of the current page changes.

  • Page 238: The Toolbar Command Api

    Example command="dw.toggleLiveDebug()" arguments="argument_list" Optional. This attribute specifies the comma-separated list of arguments to pass to function in a toolbar command file. If you do not specify the receiveArguments() attribute, Dreamweaver passes the ID of the toolbar item. In addition, pop-up arguments menus, combo boxes, text boxes, and color pickers pass their current value as the first argument, before any arguments that the...
  • Page 239 canAcceptCommand() Availability Dreamweaver MX. Description Determines whether the toolbar item is enabled. The enabled state is the default condition for an item, so you should not define this function unless it returns a value in at least one false case. Arguments For pop-up menus, combo boxes, text boxes, and color pickers, the first argument is the current value within the control.
  • Page 240 getCurrentValue() Availability Dreamweaver MX. Description Returns the current value to display in the item. Dreamweaver calls the getCurrentValue() function for pop-up menus, combo boxes, text boxes, and color pickers. For pop-up menus, the current value should be one of the items in the menu. If the value is not in the pop-up menu, Dreamweaver selects the first item.
  • Page 241 The name is a misnomer because this function should be used even if getDynamicContent() the list of entries in the menu is fixed. For example, the Text_Size.htm file in the Configuration/Menus/MM folder is not a dynamic menu; it is designed to be called from each one of a set of static menu items.
  • Page 242 getMenuID() Availability Dreamweaver MX. Description Only valid for menu buttons. Dreamweaver calls the function to get the ID of getMenuID() the menu that should appear when the user clicks the button. Arguments None. Returns Dreamweaver expects a string that contains a menu ID, which is defined in the menus.xml file.
  • Page 243 menuID = 'DWBrowseOptionsPopup'; return menuID; getUpdateFrequency() Availability Dreamweaver MX. Description Specifies how often to run the handlers for the , and enabled checked showIf value attributes to update the visible state of the item. You must specify the update frequency for toolbar items because they are always visible, unlike menus.
  • Page 244 Description Returns a value that specifies whether the item is selected. For a button, checked means that the button appears on or depressed. The function is equivalent to the isCommandChecked() attribute in a toolbar item tag. checked Arguments For pop-up menus, combo boxes, text boxes, and color pickers, the first argument is the current value within the control.
  • Page 245 else if (style == "Heading 6") bChecked = (textFormat == "h6"); else bChecked = (dw.cssStylePalette.getSelectedStyle() == style); return bChecked; isDOMRequired() Availability Dreamweaver MX. Description Specifies whether the toolbar command requires a valid DOM to operate. If this function returns a value or if the function is not defined, Dreamweaver assumes that the true command requires a valid DOM and synchronizes the Code view and Design view for the...
  • Page 246 Arguments For pop-up menus, combo boxes, text boxes, and color pickers, the first argument is the current value within the control. The function can optionally attach getDynamicContent() individual IDs to items within a pop-up menu. If the selected item in the pop-up menu has an ID attached, Dreamweaver passes that ID to the function instead of receiveArguments()
  • Page 247 Returns Dreamweaver expects a Boolean value: if the item appears; otherwise. true false Example function showif() var retval = false; var dom = dw.getDocumentDOM(); if(dom) var view = dom.getView(); if(view == ‘design’) retval = true; return retval; The toolbar command API...
  • Page 248 Toolbars...

  • Page 249: Chapter 10: Reports

    CHAPTER 10 Reports Macromedia Dreamweaver 8 supports two types of reports: site reports and stand-alone reports. Site reports You use the Reports API to create custom site reports or modify the set of prewritten reports that come with Dreamweaver 8. You can access site reports only through the Reports dialog box.
  • Page 250 How site reports work Reports are accessible through the Site > Reports command. When it is selected, this command displays a dialog box from which the user selects reports to run on a choice of targets. The user selects which files to run the selected reports on using the Report On: pop-up menu.
  • Page 251 You create this extension by performing the following steps: Creating the report definition Writing the JavaScript code This example creates two files in the HTML Reports folder: List images.htm, which contains the report definition, and List Images.js, which contains the JavaScript code specific to this report.
  • Page 252 Writing the JavaScript code Dreamweaver includes the Reports.js file. You can call any of the functions in Reports.js. However, you also have to create the JavaScript file that contains any functions that are specific to your custom site report. To create the JavaScript file: Create the file Configuration/Reports/HTML Reports/List Images.js, with the following content: // Function: configureSettings...

  • Page 253: Stand-Alone Reports

    Stand-alone reports You can use the Results Window API to create a stand-alone report. Stand-alone reports are regular commands that directly use the Results Window API rather than the Reports API. You can access a stand-alone report the same way you access any other command, through the menus or through another command.
  • Page 254 To call the function, the function needs to have access to the addItem() processFile() Results window that was created by the stand-alone command. The processFile() function can also call the function of the Results window object to stopProcessing() stop processing the list of files. A simple stand-alone report example The simple stand-alone report extension lists all the images referenced in a particular file and displays the report in the Results window.
  • Page 255 Writing the JavaScript code Next, you create the JavaScript file that contains any functions that are specific to your stand- alone report. To create the JavaScript file: Create the Listimages.js file in the Configuration/Commands folder with the following code: function stdaloneresultwin() var curDOM = dw.getDocumentDOM("document");...

  • Page 256: The Reports Api

    The Reports API The only required function for the Reports API is the function. All other processFile() functions are optional. processFile() Availability Dreamweaver 4. Description This function is called when there is a file to process. The Report command should process the file without modifying it and use the function, the dw.ResultsPalette.SiteReports()
  • Page 257 Returns Dreamweaver expects a Boolean value: if the report runs successfully; true false target excluded from the report run. endReporting() Availability Dreamweaver 4. Description This function is called at the end of the Report process. Arguments None. Returns Dreamweaver expects nothing. commandButtons() Availability Dreamweaver 4.
  • Page 258 Example The following instance of the function defines the OK, Cancel, and Help commandButtons() buttons. function commandButtons(){ return new Array("OK" , "doCommand()" , "Cancel" , ¬ "window.close()" , "Help" , "showHelp()"); configureSettings() Availability Dreamweaver 4. Description Determines whether the Report Settings button should be enabled in the Reports dialog box when this report is selected.
  • Page 259 Returns Dreamweaver expects a string of the form "widthInPixels,heightInPixels" The returned dimensions are smaller than the size of the entire dialog box because they do not include the area for the OK and Cancel buttons. If the returned dimensions do not accommodate all options, scroll bars appear.
  • Page 260 Reports...

  • Page 261: Chapter 11: Tag Libraries And Editors

    CHAPTER 11 Tag Libraries and Editors Macromedia Dreamweaver 8 users can use tag editors to insert new tags, edit existing tags, and access reference information about tags. Dreamweaver comes with editors for the following languages: HTML, ASP.Net, CFML, JRun, and JSP. You can customize tag editors that come with Dreamweaver, and you can create new tag editors.

  • Page 262: Tag Library File Format

    VTML file. The following figure shows how Dreamweaver organizes the VTML files by markup language: Macromedia HomeSite users can recognize the VTML file structure, but Dreamweaver does not use VTML files in the same way as HomeSite. The most important difference is that Dreamweaver contains its own HTML renderer that displays extension user interfaces (UIs), so the Dreamweaver VTML files are not used in the GUI rendering process.
  • Page 263 </taglibrary> <taglibrary name="ASP.NET Tags" doctypes="ASP.NET_CSharp,ASP.NET_VB"¬ servermodel="ASPNet" prefix="<asp:" tagchooser="ASPNet/TagChooser.xml"¬ id="DWTagLibrary_aspnet"> <tagref name="dataset" file="aspnet/dataset.vtm" prefix="<mm:dataset"/> </taglibrary> </taglibraries> tag groups one or more tags into a tag library. When you import tags or taglibrary create a new set of tags, you can group them into tag libraries. Typically, a taglibrary grouping corresponds to a set of tags that are defined in a JavaServer Pages (JSP) TLD file, an XML document type definition (DTD) file, an ASP.Net name space, or some other logical...
  • Page 264 Attribute Description Mandatory/ optional This can be any string that is different from the Optional taglibrary.id attributes of other tag libraries in taglibrary.ID the file. The Extension Manager uses the ID attribute, so the MXP files can insert new and the files into the taglibrary tags...
  • Page 265 To define tags, Dreamweaver uses a modified version of the Macromedia VTML file format. The following example demonstrates all the elements that Dreamweaver must use to define an individual tag: <tag name="input" bind="value" casesensitive="no" endtag="no"> <tagformat indentcontents="yes" formatcontents="yes" nlbeforetag ¬...
  • Page 266 The following table lists the attributes that define tags: Attribute Description Mandatory/ optional Used by the Data Binding panel. When you Optional tag.bind select a tag of this type, the attribute bind indicates the default attribute for data binding. Specifies whether the tag name is case- Optional tag.casesensitive sensitive.
  • Page 267 Attribute Description Mandatory/ optional The number of newline characters to insert Optional tagformat.nlaftertag after this tag. The name of the attribute, as it appears in the Mandatory attrib.name source code. If omitted, Optional attrib.type attrib.type "text" It can have the following values: —free text content TEXT —a list of enumerated values...

  • Page 268: The Tag Chooser

    The Tag Chooser The Tag Chooser lets you view tags in functional groups so you can easily access frequently used tags. In order to add a tag or a set of tags to the Tag Chooser, you must add them to the tag library.
  • Page 269 The following table lists the tags that are available for use in the TagChooser.xml files: Description Mandatory/ Optional The tag is the outermost tag, which encapsulates Mandatory tclibrary this tag library’s Tag Chooser structure. Value appears in the Tree view node. Mandatory tclibrary.name Value is an HTML string and appears in the Tag...

  • Page 270: A Simple Example Of Creating A New Tag Editor

    The following table lists the attributes of the tag, which represents the tag to insert: ELEMENT Attribute Description Mandatory/ Optional Value appears as a List view item. Mandatory element.name Value that is either placed directly into the code or Mandatory element.value a parameter that passes into visual dialog boxes.
  • Page 271 The location of the user’s Configuration folder depends on the user’s platform. For Windows 2000 and Windows XP platforms: <drive>:\Documents and Settings\<username>\ ¬ Application Data\Macromedia\Dreamweaver 8\Configuration In Windows XP, this folder may be inside a hidden folder. For Mac OS X platforms: <drive>:Users:<username>:Library:Application Support: ¬...
  • Page 272 Creating a tag editor UI To create the cfweather tag editor user interface: Save the cfweather.htm file in the Configuration/Taglibraries/CFML folder: <!DOCTYPE HTML SYSTEM "-//Macromedia//DWExtension layout-engine 5.0// dialog"> <html> <head> <title>CFWEATHER</title> <script src="../../Shared/Common/Scripts/dwscripts.js"></script>...
  • Page 273 // inspectTag() API function defined (required by all tag editors) function inspectTag(tagNodeObj) // call into a common library version of inspectTagCommon defined // in tagDialogCmns.js (note that it's been included) // For more information about this function, look at the comments // for inspectTagCommon in tagDialogCmn.js tagDialog.inspectTagCommon(tagNodeObj, theUIObjects);...
  • Page 274 <tr> <td valign="baseline" align="right" nowrap="nowrap">Type: </td> <td nowrap="nowrap"> <select name="thetempaturescale" id="attr:cfargument:tempaturescale" attname="tempaturescale" editable="false" style="width:200px"> </select> </td> </tr> </table> </div> </body> </html> Verify that the tag editor is working by performing the following steps: Launch Dreamweaver. Type in Code view. cfweather Right click on the tag.

  • Page 275: Tag Editor Apis

    tag appears in the list box on the right. cfweather Select cfweather, and click the Insert button. The tag editor should appear. Tag editor APIs In order to create a new tag editor, you must provide an implementation for the , and functions.
  • Page 276 validateTag() Availability Dreamweaver MX. Description When a user clicks on a node in the tree control or clicks OK, the function performs input validation on the currently displayed HTML form elements. Arguments None. Returns Dreamweaver expects a Boolean value: if the input for HTML form elements is valid; true if input values are not valid.
  • Page 277 Example Continuing the example, in the following code, if the user changes the ZIP code cfweather from 94065 to 53402, in order to update the user’s document to use the new ZIP code, the object must be updated: function applyTag(tag) tag.zip = document.forms[0].zip.value Tag editor APIs...
  • Page 278 Tag Libraries and Editors...

  • Page 279: Chapter 12: Property Inspectors

    CHAPTER 12 Property Inspectors The Property inspector is perhaps the most familiar floating panel in the Macromedia Dreamweaver 8 interface. It is indispensable for defining, reviewing, and changing the name, size, appearance, and other attributes of the selection as well as for launching internal and external editors for the selected element.
  • Page 280 Dreamweaver does not use the Property inspector to display the properties of the current selection. For example, if the server model of the document is Macromedia ColdFusion, but the server model of the Property inspector is ASP, Dreamweaver does not use that Property inspector for selections in the document.

  • Page 281: How Property Inspector Files Work

    How Property inspector files work At start up, Dreamweaver reads the first line of each HTM and HTML file in the Configuration/Inspectors folder, searching for the comment string that defines the type, priority, and selection type of a Property inspector. Files that do not have this comment as their first line are ignored.

  • Page 282: A Simple Property Inspector Example

    A simple Property inspector example The following Property inspector inspects the tag, which is available only in MARQUEE Microsoft Internet Explorer. The example lets you set the value of the attribute in direction the Property inspector. To set the value of the tag’s other attributes, use this example MARQUEE as a model.
  • Page 283 z-index:16; left: 44px; top: 5px">Marquee</SPAN> <!-- If your form fields are in different layers, you must ¬ create a separate form inside each layer and reference it as ¬ shown in the inspectSelection() and setInterjectionTag() ¬ functions. --> <SPAN ID="topLayer" STYLE="position:absolute; z-index:1; left: 125px; ¬ top: 3px;...
  • Page 284 // Get the value of the DIRECTION attribute on the MARQUEE tag. var theDirection = theObj.getAttribute('direction'); // Initialize a variable for the DIRECTION attribute to -1. // This is used to store the menu index that corresponds to // the value of the attribute. // var typeIndex = -1;...

  • Page 285: The Property Inspector Api

    Creating the image You can optionally create the image that appears in the Property inspector. To create the image: Create an image that is 36 pixels wide and 36 pixels high. Save the image as marquee.gif in Configuration/Inspectors. In general, you can save images for Property inspectors in any format that Dreamweaver supports.
  • Page 286 CLASSID "clsid:D27CDB6E- (the class ID for Macromedia Flash Player): AE6D-11cf-96B8-444553540000" function canInspectSelection(){ var theDOM = dw.getDocumentDOM(); var theObj = theDOM.getSelectedNode(); return (theObj.nodeType == Node.ELEMENT_NODE && ¬ theObj.hasAttribute("classid") && ¬...
  • Page 287 inspectSelection() Description Refreshes the contents of the text fields based on the attributes of the current selection. Arguments maxOrMin argument is either , depending on whether the Property maxOrMin inspector is in its expanded or contracted state. Returns Dreamweaver expects nothing. Example The following example of the function gets the value of the...
  • Page 288 Property Inspectors...

  • Page 289: Chapter 13: Floating Panels

    Custom floating panel files are HTML files that reside in the Configuration/Floaters folder inside the Macromedia Dreamweaver 8 application folder. The section of a floating BODY panel file contains an HTML form;...

  • Page 290: How Floating Panel Files Work

    How floating panel files work Custom floating panels can be moved, resized, and tabbed together the same way as the floating panels that are built in to Dreamweaver. Custom floating panels differ from built-in floating panels in the following ways: Custom floating panels display in the default gray.

  • Page 291: A Simple Floating Panel Example

    When the floating panel is visible, the following actions occur: When the selection changes, the function is called, if it is selectionChanged() defined. When the user makes changes to the document, the function is documentEdited() called, if it is defined. Event handlers that are attached to the fields in the floating panel interface execute as the user encounters them.
  • Page 292 To create the HTML file header: Create a new blank document. Enter the following: <!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Script Editor</title> <script language="JavaScript"> The extension defines two floating panels that display either if the (no script selected) user has not selected a script marker or the JavaScript code that underlies a selected script marker.
  • Page 293 Both tags use the attribute to specify the position ( ), size ( style absolute width:422px ), and default setting ( ) of the floating panels. The height:181px visibility visible panel uses the attribute and a series of break ( ) tags to position the text blanklayer center...
  • Page 294 function first calls the function to get the selectionChanged() dw.getDocumentDOM() Document Object Model (DOM) for the user’s document. It then calls the function to see if the selected node for that document is, first, an getSelectedNode() element and, second, a tag.
  • Page 295 If the selected node is not an element, or it is not a tag, the SCRIPT selectionChanged() function makes the floating panel visible and hides the panel. The blanklayer scriptlayer floating panel displays the text , as shown in the blanklayer (no script selected) following figure:...
  • Page 296 updateScript(): write back changes function writes back the selected script when an event occurs updateScript() onBlur in the of the panel. The form element contains the textarea scriptlayer textarea JavaScript code, and the event occurs when loses input focus. onBlur textarea To add the updateScript() function: Open the scriptEditor.htm file that is in the Configuration/Floaters folder.

  • Page 297: The Floating Panel Api

    If you select a script marker in Design view for the current document and then select the Script Editor menu item, it invokes the Script Editor floating panel and displays the JavaScript code that underlies the script marker. If you select the menu item when a script marker has not been selected, it displays the panel that contains the text blanklayer...
  • Page 298 Example // the following instance of displayHelp() opens // in a browser a file that explains how to use // the extension. function displayHelp(){ var myHelpFile = dw.getConfigurationPath() + '/ExtensionsHelp/superDuperHelp.htm'; dw.browseDocument(myHelpFile); documentEdited() Description This function is called when the floating panel becomes visible and after the current series of edits is complete;...
  • Page 299 getDockingSide() Availability Dreamweaver MX. Description Specifies the locations at which a floating panel can dock. The function returns a string that contains some combination of the words "left" "right" "top" , and "bottom" . If the label is in the string, you can dock a floating panel to that side. If the function is missing, you cannot dock a floating panel to any side.
  • Page 300 Example The following example of the function specifies that the first time the initialPosition() floating panel appears, it should be 420 pixels from the left and 20 pixels from the top in Windows, and 390 pixels from the left side of the screen and 20 pixels from the top of the screen on the Macintosh: function initialPosition(platform){ var initPos = "420,20";...
  • Page 301 isATarget() Availability Dreamweaver MX (Windows only). Description Specifies whether other panels can dock to this floating panel. If the function is isATarget() not specified, Dreamweaver prevents other panels from docking to this one. Dreamweaver calls this function when the user tries to combine this panel with others. Arguments None.
  • Page 302 isResizable() Availability Dreamweaver 4. Description Determines whether a user can resize a floating panel. If the function is not defined or returns value, the user can resize the floating panel. If the function returns a value, the true false user cannot resize the floating panel. Arguments None.
  • Page 303 Example The following example of shows a different layer in the floating panel, selectionChanged() depending on whether the selection is a script marker. If the selection is a script marker, Dreamweaver makes the script layer visible. Otherwise, Dreamweaver makes the blank layer visible.
  • Page 304 /* create a flag that specifies whether an edit is being processed, and set it to false. */ document.running = false; /* this function called when document is edited */ function documentEdited(){ /* create a list of all the layers to be processed */ var dom = dw.getDocumentDOM();...

  • Page 305: Chapter 14: Behaviors

    HTML elements accept which events. Files that list events that each browser supports are stored in the Configuration/Behaviors/Events folder within the Macromedia Dreamweaver 8 application folder. Actions are the part of a behavior that you can control; when you write a behavior, you’re really writing an Action file.

  • Page 306: How Behaviors Work

    How Behaviors work When a user selects an HTML element in a Dreamweaver document and clicks the Plus (+) button on the Behaviors panel, the following events occur: Dreamweaver calls the function in each Action file to see whether canAcceptBehavior() this action is appropriate for the document or the selected element.

  • Page 307: A Simple Behavior Example

    Inserting multiple functions in the user’s file Actions can insert multiple functions—the main behavior function plus any number of helper functions—into the section. Two or more behaviors can even share helper functions as HEAD long as the function definition is exactly the same in each Action file. One way of ensuring that shared functions are identical is to store each helper function in an external JavaScript file and insert it into the appropriate Action files using <SCRIPT SRC="externalFile.js">...
  • Page 308 WebTV and modified to perform actions other than going to URLs. To create the behavior extension: Create a new blank file. Add the following to the file: <!DOCTYPE HTML SYSTEM "-//Macromedia//DWExtension layout-engine 5.0 ¬ //dialog"> <html> <head> <title>behavior "Check Browser Brand"</title>...
  • Page 309 "\')"; }else{ return "Please enter URLs in both fields." // Extract the arguments from the function call // in the event handler and repopulate the // parameters form function inspectBehavior(fnCall){ var argArray = getTokens(fnCall, "()',"); var nsURL = unescape(argArray[1]); var ieURL = unescape(argArray[2]); document.theForm.nsURL.value = nsURL;...
  • Page 310 <tr> <td nowrap="nowrap">&nbsp;&nbsp;Go to this URL is the browser is ¬ Microsoft Internet Explorer:<br> <input type="text" name="ieURL" size="50" value=""> &nbsp; <input type="button" name="ieBrowse" value="Browse..." ¬ onClick="browseForURLs('ieURL')"></td> </tr> </table> </form> </body> </html> Save the file as Configuration/Behaviors/Actions/BrowserDependentURL.htm. Creating the HTML files to browse Next, you create the HTML files to browse, the file to go to if the browser is Internet Explorer, and the file to go to if the browser is Netscape Navigator.
  • Page 311 Save the file as netscapecontent.htm in the same directory as the iecontent.htm file. Restart Dreamweaver. Create a new HTML file with the following content: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Which browser</title> </head>...

  • Page 312: The Behaviors Api

    <body onLoad="checkBrowserBrand('netscaptecontent.htm','iecontent.htm')"> </body> </html> Testing the behavior Finally, you can test the behavior. To test the behavior: View the file whichbrowser.htm in your browser. Depending on which browser you are using, either iecontent.htm or netscapecontent.htm appears. The Behaviors API Two Behaviors API functions are required ( applyBehavior() behaviorFunction() the rest are optional.
  • Page 313 Returns Dreamweaver expects a string that contains the function call to be inserted in the user’s document, usually after accepting parameters from the user. If the applyBehavior() function determines that the user made an invalid entry, the function can return an error string instead of the function call.
  • Page 314 behaviorFunction() Description This function inserts one or more functions—surrounded by the following tags, if they don’t yet exist—into the section of the user’s document: HEAD <SCRIPT LANGUAGE="JavaScript"></SCRIPT> Arguments None. Returns Dreamweaver expects either a string that contains the JavaScript functions or a string that contains the names of the functions to be inserted in the user’s document.
  • Page 315 canAcceptBehavior() Description This function determines whether the action is allowed for the selected HTML element and specifies the default event that should trigger the action. Can also check for the existence of certain objects (such as SWF files) in the user’s document and not allow the action if these objects do not appear.
  • Page 316 displayHelp() Description If this function is defined, a Help button appears below the OK and Cancel buttons in the Parameters dialog box. This function is called when the user clicks the Help button. Arguments None. Returns Dreamweaver expects nothing. Example // the following instance of displayHelp() opens // in a browser a file that explains how to use // the extension.
  • Page 317 identifyBehaviorArguments() Description This function identifies arguments from a behavior function call as navigation links, dependent files, URLs, Netscape Navigator 4.0-style references, or object names so that URLs in behaviors can update if the user saves the document to another location and so the referenced files can appear in the site map and be considered dependent files for the purposes of uploading to and downloading from a server.
  • Page 318 Example This simple example of the function works for the Open identifyBehaviorArguments() Browser Window behavior action, which returns a function that always has three arguments (the URL to open, the name of the new window, and the list of window properties): function identifyBehaviorArguments(fnCallStr) { return "URL,other,other";...
  • Page 319 inspectBehavior() Description This function inspects the function call for a previously applied behavior in the user’s document and sets the values of the options in the Parameters dialog box accordingly. If the function is not defined, the default option values appear. inspectBehavior() The inspectBehavior() function must rely solely on information that the applyBehaviorString argument passes to it.
  • Page 320 For more information about the function, see the dwscripts.js file in the unescQuotes() Configuration/Shared/Common/Scripts/CMN folder. windowDimensions() Description This function sets specific dimensions for the Parameters dialog box. If this function is not defined, the window dimensions are computed automatically. Do not define this function unless you want an Parameters dialog box that is larger than 640 x 480 pixels.

  • Page 321: Chapter 15: Server Behaviors

    CHAPTER 15 Server Behaviors Macromedia Dreamweaver 8 provides users with an interface for adding server behaviors into their documents to perform server-side tasks such as filtering records based on user criteria, paging through records, linking result lists to details pages, and inserting records into a result set.

  • Page 322: Dreamweaver Architecture

    Runtime code Runtime code is the set of code blocks that are added to a document when a server behavior is applied. These code blocks usually include some server-side code, such as ASP script that is enclosed in tags. <% ... %> Participants Your server behavior extension inserts code blocks into the user’s document.
  • Page 323 Group files Group files contain a list of participants, and participant files have all server-model-specific code data. Participant files can be used by more than one extension, so several group files can refer to the same participant file. The following example shows a high-level view of the Server Behavior Group EDML file. For a complete list of elements and attributes, see “Group EDML file tags”...

  • Page 324: A Simple Server Behavior Example

    When Dreamweaver adds a server behavior to a document, it needs to have detailed information, including where to insert the code, what the code looks like, and what parameters the Dreamweaver author or data replaced at runtime. Each participant EDML file describes these details for each block of code.
  • Page 325 Creating the dynamic page document First, you create a new ASP document. To create a new dynamic page document: In Dreamweaver, select the File > New menu option. In the New Document dialog box, select Category: Dynamic Page and Dynamic Page: ASP JavaScript Click Create.

  • Page 326: How The Server Behavior Api Functions Are Called

    In the Relative Position pop-up menu, select After the Selection. Click OK. In the Server Behaviors panel, you can see that the Plus (+) menu contains the new server behavior in the pop-up list. Also, in the installation folder for your Dreamweaver files, the Configuration/ServerBehaviors/ASP_Js folder now contains the following three files: The group file: Hello World.edml The participant file: Hello World_block1.edml...
  • Page 327 Sometimes during analysis, a single tag in the user’s document is identified by two or more behaviors as being an instance of that behavior. For example, the function for the Dynamic Attribute behavior might detect an findServerBehaviors() instance of the Dynamic Attribute behavior that is associated with an tag in the input user’s document.
  • Page 328 If the user edits an existing server behavior by double-clicking it, Dreamweaver displays the dialog box, executes the handler on the tag, if one exists, and then calls onLoad BODY function. The function inspectServerBehavior() inspectServerBehavior() populates the form elements with the current parameter values. When the user clicks OK, Dreamweaver calls the function again.

  • Page 329: The Server Behavior Api

    The Server Behavior API You can manage server behaviors with the following API functions. analyzeServerBehavior() Availability Dreamweaver UltraDev 1 Description Lets server behaviors set their properties. incomplete deleted After the function is called for every server behavior on the page, findServerBehaviors() an array of all the behaviors in the user’s document appears.
  • Page 330 Arguments serverBehavior [serverBehaviorArray] argument is a JavaScript object that represents the behavior to serverBehavior analyze. argument is an array of JavaScript objects that represents [serverBehaviorArray] all the server behaviors that are found on a page. Returns Dreamweaver expects nothing. applyServerBehavior() Availability Dreamweaver UltraDev 1.
  • Page 331 canApplyServerBehavior() Availability Dreamweaver UltraDev 1. Description Determines whether a behavior can be applied. Dreamweaver calls this function before the Server Behaviors dialog box appears. If this function returns a value, the Server true Behaviors dialog box appears. If this function returns a value, the Server Behaviors false dialog box does not appear and the attempt to add a server behavior stops.
  • Page 332 Arguments serverBehavior JavaScript object represents the behavior. serverBehavior Returns Dreamweaver expects a Boolean value: if the behavior copies successfully to the true Clipboard; otherwise. false deleteServerBehavior() Availability Dreamweaver UltraDev 1. Description Removes the behavior from the user’s document. It is called when the user clicks the Minus (- ) button on the Server Behaviors panel.
  • Page 333 Example // the following instance of displayHelp() opens // in a browser a file that explains how to use // the extension. function displayHelp(){ var myHelpFile = dw.getConfigurationPath() + '/ExtensionsHelp/superDuperHelp.htm'; dw.browseDocument(myHelpFile); findServerBehaviors() Availability Dreamweaver UltraDev 1. Description Searches the user’s document for instances of itself. For each instance it finds, the function creates a JavaScript object, and it attaches state findServerBehaviors() information as JavaScript properties of the object.
  • Page 334 Description Determines the settings for the Server Behavior dialog box, based on the specified behavior object. Dreamweaver calls the function when a user opens a inspectServerBehavior() Server Behavior dialog box. Dreamweaver calls this function only when a user edits an existing behavior.

  • Page 335: Server Behavior Implementation Functions

    Returns Dreamweaver expects a Boolean value: if the behavior pastes successfully from the true Clipboard; otherwise. false Server behavior implementation functions These functions can be added or edited within the HTML script files or the specified JavaScript files that are listed within the HTML script file. dwscripts.findSBs() Availability Dreamweaver MX (this function replaces the...
  • Page 336 dwscripts.applySB() Availability Dreamweaver MX (this function replaces the function from earlier versions applySB() of Dreamweaver). Description Inserts or updates runtime code for the server behavior. If the parameter has a sbObj null value, it inserts new runtime code; otherwise, it updates existing runtime code that is indicated by the object.

  • Page 337: Editing Edml Files

    dwscripts.deleteSB() Availability Dreamweaver MX (this function replaces the function from earlier versions of deleteSB() Dreamweaver). Description Deletes all the participants of the server behavior instance. The entire participant is sbObj deleted, unless the EDML file indicates special delete instructions with the tag.
  • Page 338 Regular expressions You must understand regular expressions as they are implemented in JavaScript 1.5. You must also know when it is appropriate to use them in the server behavior EDML files. For example, regular expressions cannot be used in values, but they are used in the content of quickSearch tag to find and extract data.
  • Page 339 This process searches the user’s document, and if there is a match, extracts the parameter values. The first parenthetical subexpression ( ) extracts the value for . The second subexpression ( ) extracts the value for [^\r\n]* new_url The character sequence matches any character that is not a linefeed, for the "[^\r\n]*"...

  • Page 340: Group Edml File Tags

    CDATA <%= %> aren’t processed. Instead, the Extension Data Manager (EDM) receives the uninterpreted text, as shown in the following example: <% if (Recordset1.EOF) Response.Redirect("http://www.macromedia.com"); %> In the following EDML definitions, the locations where the tag is recommended are CDATA indicated in the examples.
  • Page 341 Parent group Type Attribute. Required serverBehavior Description attribute indicates which server behavior can use the group. When any serverBehavior of the group’s participant strings are found in the document, the server behavior quickSearch that is indicated by the attribute has Dreamweaver call the serverBehavior function.
  • Page 342 Multiple versions of a server behavior can differ, depending on which data source you use. For example, the Repeat Region server behavior is designed for the standard Recordset.htm data source. If Dreamweaver is extended to support a new type of data source (such as a COM object), you can set in a group file with a different implementation dataSource="COM.htm"...
  • Page 343 Parent group Type Attribute. Required Value The value is a unique string that determines which group to apply, as shown in the following example: <group serverBehavior="myServerBehavior.htm" ¬ subType="longVersion"> This group attribute defines the long version of the subtype. You would myServerBehavior also have a version with the attribute.
  • Page 344 Value The value is a plain text string that can include parameter names to make each instance unique, as shown in the following example: <title>Redirect If Empty (@@recordsetName@@)</title> <groupParticipants> Description This tag contains an array of declarations. groupParticipant Parent group Type Block tag.
  • Page 345 Value value is the exact name (without the .edml extension) of a single participantName participant file that is listed as a group participant, as shown in the following example. See “name” on page 345. <groupParticipants selectParticipant="redirectIfEmpty_link"> <groupParticipant> Description This tag represents the inclusion of a single participant in the group. Parent groupParticipants Type...
  • Page 346 Value The value is the exact name (without the .edml extension) of any participant file, as shown in the following example: <groupParticipant name="redirectIfEmpty_init"> This example refers to the redirectIfEmpty_init.edml file. partType Description This attribute indicates the type of participant. Parent groupParticipant Type Attribute.

  • Page 347: Participant Edml Files

    Participant EDML files These tags and attributes are valid within the EDML participant files. <participant> Description This tag contains all the specifications for a single participant. Parent None. Type Block tag. Required Yes. <participant> attributes The following items are valid attributes of the participant tag. version Description This attribute defines which version of Dreamweaver server behavior processing the current...
  • Page 348 Parent participant Type Attribute. Required <quickSearch> Description This tag is a simple search string that is used for performance reasons. It cannot be a regular expression. If the string is found in the current document, the rest of the search patterns are called to locate specific instances.
  • Page 349 <insertText> Description This tag provides information about what to insert in the document and where to insert it. It contains the text to insert. Parts of the text that are customized should be indicated by using format. @@parameterName@@ In some cases, such as a translator-only participant, you might not need this tag. Parent implementation Type...
  • Page 350 Parent insertText Type Attribute. Required Yes. Values aboveHTML[+weight] belowHTML[+weight] beforeSelection replaceSelection wrapSelection afterSelection beforeNode replaceNode afterNode firstChildOfNode lastChildOfNode nodeAttribute[+attribute] value inserts the text above the tag (suitable only for aboveHTML[+weight] HTML server code). The weight can be an integer from and is used to preserve relative order among different participants.
  • Page 351 value inserts the text before a node, which is a specific location in the beforeNode DOM. When a function such as is called to make the insertion, dwscripts.applySB() the node pointer must pass in as a parameter. The user-definable name of this paramObj parameter must be specified by the attribute (see...
  • Page 352 Required This attribute is required only if the insert location contains the word node Value value is a user-specified name for the node parameter that passes with the tagtype__Tag parameter object to the function. For example, if you insert some text dwscripts.applySB() into a form, you might use a parameter.
  • Page 353 <searchPatterns> attributes The following items are valid attributes of the searchPatterns tag. whereToSearch Description This attribute specifies where to search for the participant text. This attribute is related to the insert location, so be sure to set each attribute carefully (see “location”...
  • Page 354 value searches only within the HTML comments , as shown in the comment <! ... > following example: <searchPatterns whereToSearch="comment"> This example searches tags such as <!-- my comment here --> value searches only within raw text sections, as shown in the following example: text <searchPatterns whereToSearch="text">...
  • Page 355 value is used if no pattern is given. It is always considered a match, and the <empty> entire value is assigned to the first parameter. In the following example, to identify the participant text , you can define a simple pattern, followed by <%= RS1.Field.Items("author_id") %>...
  • Page 356 The parameter names should match the ones that are specified in the insertion text and the update parameters. Parent searchPattern Type Attribute. Required Yes. Values , ... paramName1 paramName2 Each parameter name should be the exact name of a parameter that is used in the insertion text.
  • Page 357 Required Values attribute+attribName tagOnly innerOnly value (default) searches the entire tag that is specified in the whereToSearch attribute. value searches only within the value of the specified attribute+attribName attribute, as shown in the following example: <searchPatterns whereToSearch="tag+FORM"> <searchPattern limitSearch="attribute+ACTION"> /MY_PATTERN/ </searchPattern>...
  • Page 358 Values true false The value is if the is not necessary to identify the participant. true searchPattern The value is (default) if the tag is required. false searchPattern For example, consider the following simple recordset string: <% var Recordset1 = Server.CreateObject("ADODB.Recordset"); Recordset1.ActiveConnection = "dsn=andescoffee;";...
  • Page 359 Type Block tag. Required <updatePattern> Description This tag is a specific type of regular expression that lets you update participant text precisely. There should be at least one update pattern definition for every unique parameter that is declared in the insertion text (of the form @@paramName@@ Parent updatePatterns...
  • Page 360 The literal parentheses, as well as other special regular expression characters, are escaped by preceding them with a backslash (\). The middle expression, defined as , is updated with the latest value that passed in for parameters , respectively. The values "rs"...
  • Page 361 Type Attribute. Required Yes. Values The value is the exact name of a parameter that is used in the insertion text. In the following example, if the insertion text contains an value, you should have a parameter with @@rs@@ that name: <updatePattern paramName="rs">pattern</updatePattern>...
  • Page 362 Parent delete Type Attribute. Required Values none tagOnly innerOnly attribute+attribName attribute+* value (default) deletes the entire directive or tag. For attributes, it deletes the entire definition. value is never automatically deleted. none value removes only the outer tag but leaves the contents of the tagOnly innerHTML tag intact.
  • Page 363 Type Block tag. Required <searchPatterns> Description This tag lets Dreamweaver find each specified instance in a document. If multiple search patterns are defined, they must all be found within the text being searched (the search patterns have a logical AND relationship), unless they are marked as optional using the isOptional flag.
  • Page 364 <translation> Description This tag contains a single translation instruction that includes the location for the participant, what type of translation to perform, and the content that should replace the participant text. Parent translations Type Block tag. Required <translation> attributes The following items are valid attributes of the translation tag. whereToSearch Description This attribute specifies where to search for the text, which is related to the insert location, so...
  • Page 365 Type Attribute. Required translationType Description This attribute indicates the type of translation to perform. These types are preset and give the translation specific functionality. For example, if you specify , any data that "dynamic data" is translated should behave the same as Dreamweaver dynamic data; that is, it should have the dynamic data placeholder look in the Design view (curly braces ({}) notation with dynamic background color) and appear in the Server Behaviors panel.
  • Page 366 value indicates that the translated tags define the tabbed region start <CFLOOP> beginning of a tabbed outline, as shown in the following example: <translation whereToSearch="CFLOOP" translationType="tabbed region start"> value indicates that the translated tags define the tabbed region end </CFLOOP> end of a tabbed outline, as shown in the following example: <translation whereToSearch="CFLOOP"...
  • Page 367 <attributes> Description This tag contains a list of attributes to add to the translated tag that is specified by the tag. Alternatively, if the tag is not defined and the openTag openTag searchPattern specifies , this tag contains a list of translated attributes to add to the tag that is found. Parent translation Type...
  • Page 368 <display> Description This tag is an optional display string that should be inserted in the translation. Parent translation Type Block tag. Required Values value is any string comprising text and HTML. It can include parameter displayString references that are extracted by the parameter patterns. For example, causes the translation to render as <display>{@@rs@@.@@col@@}</display>...

  • Page 369: Server Behavior Techniques

    Server behavior techniques This section covers the common and advanced techniques that create and edit server behaviors. Most of the suggestions involve specific settings in the EDML files. Finding server behaviors Writing search patterns In order to update or delete server behaviors, you must provide a way for Dreamweaver to find each instance in a document.
  • Page 370 The search string is defined as a regular expression by starting and ending with a slash (/) and is followed by , which means that it is not case-sensitive. Within the regular expression, special characters such as parentheses () and periods (.) are escaped by preceding them with a backslash (\).
  • Page 371 How participants are matched If a server behavior has more than one participant, the participants must be identified in the user’s document and matched. If the user applies multiple instances of the server behavior to a document, each group of participants must be matched accordingly.
  • Page 372 There are two instances of Test listed in the Server Behaviors panel. If the user tries to add a third instance to the page and names it " ", nothing is added because it already exists. Within the tag, matching can also use position information. In the following example, html there are two participants, one that is added before the selection and another that is added after the selection:...
  • Page 373 This server behavior no longer works correctly because only one parameter is named total To solve this problem, make sure that there is a parameter with a unique value and can be used to match the participants. In the following example, you could make the variable total name unique using the column name:...
  • Page 374 Look for the attribute within the tag. limitSearch searchPattern If the attribute value starts with , the remaining string is assumed to be the attribute+ attribute name (no spaces are allowed in the attribute name). If these four steps are successful, Dreamweaver assumes a tag/attribute combination. Otherwise, Dreamweaver starts looking for tags with a attribute...
  • Page 375 This example might use the following search patterns: <quickSearch>Response.Write</quickSearch> <searchPatterns whereToSearch="directive"> <searchPattern paramNames="rs,new__url"> /if\s*\((\w+)\.EOF\)\s*Response\.Redirect\("([^\r\n]*)"\)/i </searchPattern> </searchPatterns> The user might add another test to a particular instance of this code, as shown in the following example: <% if (Recordset1.EOF || x > 2) Response.Redirect("some_url_here") %> The search patterns fail because they are looking for a parenthesis after the parameter.
  • Page 376 Deleting server behaviors Default deletion and dependency counts The user can delete an instance that is selected in the Server Behaviors panel by clicking the Minus (-) button or pressing Delete. All the participants are removed except for the ones that are shared by other server behaviors. Specifically, if more than one server behavior has a participant pointer to the same node, the node is not deleted.
  • Page 377 If a JavaScript file has the directive and an HTML file references it (by SHARE-IN-MEMORY using the tag with the attribute), Dreamweaver loads the JavaScript into a SCRIPT memory location where the code is implicitly included in all HTML files thereafter. Because JavaScript files that are loaded into this central location share memory, the files cannot duplicate any declarations.
  • Page 378 Server Behaviors...

  • Page 379: Chapter 16: Data Sources

    CHAPTER 16 Data Sources The Macromedia Dreamweaver 8 Data Sources API functions let you add data sources, which appear in the Plus (+) menu in the Bindings panel (for related information, see the function in the Dreamweaver API Reference). dreamweaver.dbi.getDataSources() Data source files are stored in the Configuration/DataSources/ServerModelName folder.

  • Page 380: How Data Sources Work

    How data sources work Dreamweaver users can add dynamic data by using the Bindings panel. The dynamic data objects that are shown on the Plus (+) menu are based on the server model that is specified for the page. For example, users can insert recordsets, commands, request variables, session variables, and application variables for ASP applications.
  • Page 381 Request NameOfRequestVariable NameOfAnotherRequestVariable Session NameOfSessionVariable If the user double-clicks on a data source name in the Bindings panel to edit the data source, Dreamweaver calls the function to handle the user edits editDynamicSource() within the tree. If the user clicks the Minus (-) button, Dreamweaver gets the current node selection from the tree and passes it to the function, which deletes the code that deleteDynamicSource()

  • Page 382: A Simple Data Source Example

    A simple data source example This extension adds a custom data source to the Bindings panel for Macromedia ColdFusion documents. Users can specify the variable they want from the new data source.
  • Page 383 When a user clicks on the Bindings Plus (+) menu, Dreamweaver searches the DataSources folder for the current server model to gather all available data sources defined in the folder’s HTML (HTM) files. So, to make a new data source available to the user, you need to create a data source definition file that simply provides the name of the data source using the TITLE tag and the location of all supporting JavaScript files using the...
  • Page 384 To create the EDML file: Create a new blank file. Enter the following: <participant> <quickSearch><![CDATA[#]]></quickSearch> <insertText location="replaceSelection"><![CDATA[<cfoutput>#MyDatasource.@@bindin gName@@#</cfoutput>]]></insertText> <searchPatterns whereToSearch="tag+cfoutput"> <searchPattern paramNames="sourceName,bindingName"><![CDATA[/ #(?:\s*\w+\s*\()?(MyDatasource)\.(\w+)\b[^#]*#/i]]></searchPattern> </searchPatterns> </participant> Save the file as MyDatasource_DataRef.edml in the Configuration/DataSources/ ColdFusion folder. Creating the JavaScript file that implements the Data Sources API functions After you have defined the name of the data source, the name of the supporting script files, and the code for the working Dreamweaver document, you need to specify the JavaScript...
  • Page 385 var theResponse = MM.MyDatasourceContents; if (theResponse.length) var siteURL = dw.getSiteRoot(); if (siteURL.length) dwscripts.addListValueToNote(siteURL, "MyDatasource", theResponse); else alert(MM.MSG_DefineSite); else alert(MM.MSG_DefineMyDatasource); function findDynamicSources() var retList = new Array(); var siteURL = dw.getSiteRoot() if (siteURL.length) var bindingsArray = dwscripts.getListValuesFromNote(siteURL, "MyDatasource"); if (bindingsArray.length > 0) // Here you create an instance of the DataSource class as defined in // DataSourceClass.js file to store the return values.
  • Page 386 var retVal = new Array(); var siteURL = dw.getSiteRoot(); // For localized object name... if (sourceName != "MyDatasource") sourceName = "MyDatasource"; if (siteURL.length) var bindingsArray = dwscripts.getListValuesFromNote(siteURL, sourceName); retVal = getDataSourceBindingList(bindingsArray, DATASOURCELEAF_FILENAME, true, "MyDatasource.htm"); return retVal; function generateDynamicDataRef(sourceName, bindingName, dropObject) var paramObj = new Object();...
  • Page 387 var params = extPart.findInString("MyDatasource_DataRef", expression); if (params) retArray[0] = params.sourceName; retArray[1] = params.bindingName; return retArray; function deleteDynamicSource(sourceName, bindingName) var siteURL = dw.getSiteRoot(); if (siteURL.length) //For localized object name if (sourceName != "MyDatasource") sourceName = "MyDatasource"; dwscripts.deleteListValueFromNote(siteURL, sourceName, bindingName); Save this file MyDatasource.js in the Configuration/DataSources/ColdFusion. Creating the supporting command files for user input function contains the command addDynamicSource()
  • Page 388 To create the command definition file: Create a new blank file. Enter the following: <!DOCTYPE HTML SYSTEM "-//Macromedia//DWExtension layout-engine 5.0// dialog"> <html> <head> <title>MyDatasource Variable</title> <script src="MyDatasource_Variable.js"></script> <SCRIPT SRC="../Shared/MM/Scripts/CMN/displayHelp.js"></SCRIPT> <SCRIPT SRC="../Shared/MM/Scripts/CMN/string.js"></SCRIPT> <link href="../fields.css" rel="stylesheet" type="text/css"> </head> <body> <form> <div ALIGN="center">...
  • Page 389 function okClicked(){ var nameObj = document.forms[0].theName; if (nameObj.value) { if (IsValidVarName(nameObj.value)) { MM.MyDatasourceContents = nameObj.value; MM.retVal = "OK"; window.close(); } else { alert(nameObj.value + " " + MM.MSG_InvalidParamName); } else { alert(MM.MSG_NoName); Save the file as MyDatasource_Variable.js in the Configuration/Commands folder. Testing the new data source You can now open Dreamweaver (or restart it if you already have it open), and open a ColdFusion file or create a new one.
  • Page 390 Click the MyDatasource data source option, and the MyDatasource Variable dialog box you created appears: Enter a value in the dialog box and click OK. The Bindings panel displays the data source in a tree with the variable from the dialog box under the data source name: Drag the variable to your document, and Dreamweaver will insert the appropriate code from the EDML file:...

  • Page 391: The Data Sources Api

    The Data Sources API The functions in the Data Sources API let you find, add, edit, and delete data sources and also generate and inspect dynamic data objects. addDynamicSource() Availability Dreamweaver UltraDev 1. Description This function adds a dynamic data source. Because there is one implementation of this function in each data source file, Dreamweaver calls the appropriate implementation of the function when you select a data source from the Plus (+) menu.
  • Page 392 For example, in Dreamweaver, if the selection is a recordset or command, the function calls the deleteDynamicSource() function. If the selection is a dw.serverBehaviorInspector.deleteServerBehavior() request, session, or application variable, the function remembers that the variable was deleted and does not continue to display it. After the function returns, deleteDynamicSource() Dreamweaver erases the contents of the data source tree and calls the...
  • Page 393 editDynamicSource() Availability Dreamweaver MX. Description This function is called when the user double-clicks a data source name in the Bindings panel to edit the data source. You can implement this function to handle user edits in the tree. Otherwise, the server behavior that matches the data source is automatically invoked. The extension developer can use this function to override the default implementation of server behaviors and provide a custom handler.
  • Page 394 Returns Dreamweaver expects an array of JavaScript objects where each object can have as many as five properties, which are described in the following list: property is the label string that appears to the right of the icon for each parent title node.
  • Page 395 Arguments sourceName bindingName argument is the name of the top-level node that is associated with the sourceName child node. argument is the name of the child node from which you want to bindingName generate a dynamic data object. Returns Dreamweaver expects a string, which can be passed to the formatDynamicDataRef() function to format it before inserting it in a user’s document.
  • Page 396 property is the simple name of the file in which the dataSource function is defined. For example, the findDynamicSources() findDynamicSources() function in the Session.htm file, which is located in the Configuration/DataSources/ ASP_Js folder, sets the property to . This property is required. dataSource session.htm property is the name of the server behavior that is associated with the data...
  • Page 397 Arguments string argument is the dynamic data object. string Returns Dreamweaver expects an array of two elements (parent name and child name) for the matched node; it returns a value if no matches are found. null The Data Sources API...
  • Page 398 Data Sources...

  • Page 399: Chapter 17: Server Formats

    Server Formats Chapter 16, “Data Sources,” on page 379, discusses how Macromedia Dreamweaver 8 inserts dynamic data into a user’s document by adding a server expression at the appropriate location. When a visitor requests the document from the web server, that server expression is converted to a value from a database, the contents of a request variable, or some other dynamic value.

  • Page 400: How Data Formatting Works

    One example might be to create a new currency format. Essentially, all currency formatting consists of converting a number to a string, inserting commas and decimal points, and inserting a currency symbol, such as a dollar ($) sign. The Currency format data type collects all the common parameters and prompts you for the required values.
  • Page 401 The following example shows the tag for the string: format "Currency - default" <format file="Currency" title="Currency - default" ¬ expression="<%\s*=\s*FormatCurrency\(.*, -1, -2, -2, -2\)\s*%>|¬ <%\s*=\s*DoCurrency\(.*, -1, -2, -2, -2\)\s*%>" NumDigitsAfterDecimal=-1 IncludeLeadingDigit=-2 ¬ UseParensForNegativeNumbers=-2 GroupDigits=-2/> The format type for this format is .

  • Page 402: When The Data Formatting Functions Are Called

    When the data formatting functions are called The data formatting functions are called in the following scenarios: In the Dynamic Data or the Dynamic Text dialog box, the user selects a node from the data source tree and a format from the Format menu. When the user selects the format, Dreamweaver calls the function and passes the return value generateDynamicDataRef()

  • Page 403: The Server Formats Api

    The Server Formats API The server formats API consists of the following data formatting functions. applyFormat() Availability Dreamweaver UltraDev 1. Description This function can edit a user’s document by adding a format function declaration to it. When a user selects a format from the Format text field in the Dynamic Data or the Dynamic Text dialog box or in the Bindings panel, Dreamweaver makes two changes to the user’s document: It adds the appropriate format function before the HTML tag (if it’s not already there), and it changes the dynamic data object to call the appropriate format function.
  • Page 404 Description Commits the changes to a format that was created using the Edit Format dialog box. Users can create, edit, or delete formats with the Edit Format List dialog box. This function is called to commit any modifications that are made to a format. It can also set other, arbitrarily named properties on the object.
  • Page 405 Returns Dreamweaver expects nothing. formatDynamicDataRef() Availability Dreamweaver UltraDev 1. Description Adds the format function call to the dynamic data object. When a user selects a format from the Format text box in the Dynamic Data or the Dynamic Text dialog box or in the Bindings panel, Dreamweaver makes two changes to the user’s document: It adds the appropriate format function before the HTML tag (if it’s not already there), and it changes the dynamic data object to call the appropriate format function.
  • Page 406 inspectFormatDefinition() Availability Dreamweaver UltraDev 1. Description Initializes form controls when a user edits a format in the Edit Format List dialog box. Arguments format argument is a JavaScript object that describes the format to apply. The format JavaScript object is the node that corresponds to the tag in the Formats.xml file.

  • Page 407: Chapter 18: Components

    Different technologies offer programmers different ways to accomplish this encapsulation, and different names describe these strategies: functions, modules, and others. Macromedia Dreamweaver 8 uses the term component to refer to some of the more popular and modern encapsulation strategies, including web services, JavaBeans, and ColdFusion components (CFCs).

  • Page 408: Extending The Components Panel

    For example, ASP.NET supports web services but not JavaBeans. Macromedia ColdFusion also supports web services and CFCs. When you add a new component type to the Components panel, it must be server-model specific. For example, if a Dreamweaver user is working on a ColdFusion site, only Web Services and CF Components should appear in the drop-down list in the Components panel.

  • Page 409: Components Panel Files

    Extensibility lets you add new component types to the panel. There are several general steps that you need to follow when adding a new component type to the Components panel: Add the component to the list of available component types for the appropriate server model(s).
  • Page 410 classlocation="d:\music\music.jar"></javabean> </javabeans> JavaBeans should contain the logic for saving themselves in the multiuser configuration folder, so the next time the user launches an application, the component loads itself again from the saved data file. Adding a service component To add a new lightweight directory access protocol (LDAP) service using Dreamweaver MX: Using existing component type files as a model (such as the files in the application folder Configuration/Components/Common/WebServices), create all the required files, plus the...
  • Page 411 Write the JavaScript code to implement the new server component. The extension file (HTM) defines the locations of the JavaScript code in the tag. SCRIPT These JavaScript files can reside in the Shared folder, in the same folder as the extension file, or in the Common folder for code that applies to multiple server models.

  • Page 412: Components Panel Api Functions

    For example, the following WebServicesClass node has web methods as its children: this.name = "TrafficLocatorWebService"; this.image = "Components/Common/WebServices/WebServices.gif"; this.hasChildren = true; this.toolTipText = "TrafficLocatorWebService"; this.isCodeViewDraggable = true; // the following allows of enabling/disabling of the button that appears // above the Component Tree this.allowDelete = true;...
  • Page 413 getContextMenuId() Availability Dreamweaver MX. Description Returns the Context Menu ID for the component type. Every component type can have a context menu associated with it. The Context Menu pop-up menus are defined in the ComponentNameMenus.xml file, and they work the same way as the menu.xml file. The menu string can be static or dynamic.
  • Page 414 getCodeViewDropCode() Availability Dreamweaver MX. Description This function gets the code that is dragged and dropped in Code view from the Components panel or the code that is cut, copied, or pasted from the Components panel. Arguments componentRec argument is an object. componentRec Returns The string that contains the code for the component.
  • Page 415 JavaScript "handler" expression, such as " ": dw.browseDocument('http://www.macromedia.com') handler opens a dialog box to set the current site. "Event:SetCurSite" handler opens a dialog box to create a new site.
  • Page 416 Example The following example sets four steps for ColdFusion components, and provides a hypertext link in the fourth step so the user can enter the RDS user name and password: function getSetupSteps() var doSDK = false; dom = dw.getDocumentDOM(); if (dom && dom.serverModel) var aServerModelName = dom.serverModel.getDisplayName();...
  • Page 417 Description Dreamweaver calls this function before the Components tab appears. Dreamweaver then calls function if the function returns zero or a getSetupSteps() setupStepsCompleted() positive integer. Arguments None. Returns An integer that represents the number of setup steps the user has completed, as described in the following list: A value of either zero or a positive integer indicates the number of completed steps.
  • Page 418 Returns A Boolean value that indicates whether the drop operation was successful: if successful; true otherwise. false Example The following example determines if the component is a table or view, and then returns the appropriate value: bHandled function handleDesignViewDrop(componentRec) var bHandled = false; if (componentRec) if ((componentRec.objectType == "Table")|| (componentRec.objectType == "View"))
  • Page 419 Arguments componentRec argument is an object that contains the following properties: componentRec property is the name of the tree node item. name property is an optional icon for the tree node item. If this icon is omitted, image Dreamweaver uses a default icon. property is a Boolean value that indicates whether the tree node hasChildren item is expandable: if...
  • Page 420 toolbarControls() Availability Dreamweaver MX. Description Every component type returns a list of objects, which represents the toolBarButtonRec toolbar icons, in left-to-right order. Each object contains the following toolBarButtonRec properties: Property Description Name Path to image file image Optional; path to disabled image searches for the toolbar button disabledImage Optional;...
  • Page 421 Example The following example assigns properties to the toolbar buttons: function toolbarControls() var toolBarBtnArray = new Array(); dom = dw.getDocumentDOM(); var plusButton = new ToolbarControlRec(); var aServerModelName = null; if (dom && dom.serverModel) aServerModelName = dom.serverModel.getDisplayName(); else //look in the site for potential server model aServerModelName = site.getServerDisplayNameForSite();...
  • Page 422 minusButton.command = "clickedDelete()"; minusButton.enabled = "(dw.serverComponentsPalette.getSelectedNode() != null && dw.serverComponentsPalette.getSelectedNode() && ((dw.serverComponentsPalette.getSelectedNode().objectType=='Root') || (dw.serverComponentsPalette.getSelectedNode().objectType == 'Error') || (dw.serverComponentsPalette.getSelectedNode().objectType == 'MissingProxyGen')))"; toolBarBtnArray.push(minusButton); if(aServerModelName != null && aServerModelName.indexOf(".NET") >= 0) var deployWServiceButton = new ToolbarControlRec(); deployWServiceButton.image= DEPLOYSUPPORTBUTTONUP; deployWServiceButton.pressedImage= DEPLOYSUPPORTBUTTONDOWN; deployWServiceButton.disabledImage= DEPLOYSUPPORTBUTTONUP; deployWServiceButton.toolStyle= "right"; deployWServiceButton.toolTipText= MM.MSG_WebServicesDeployToolTipText;...

  • Page 423: Chapter 19: Server Models

    You might want to create a specialized server model. Macromedia suggests that you create a new server model rather than editing any of the ones that come with Dreamweaver. (For information regarding creating new document types that are supported by your server model, “Extensible document types in Dreamweaver”...

  • Page 424: The Server Model Api Functions

    All Dreamweaver-defined server models return a value of 1, so third-party server models can override the file-extension association. Arguments argument is the Macromedia document object, which is returned by the function. dreamweaver.getDocumentDOM() Returns Dreamweaver expects an integer that indicates the priority that you give to the server model for the file extension.
  • Page 425 getFileExtensions() Availability Dreamweaver UltraDev 1, deprecated in Dreamweaver MX. Description Returns the document file extensions with which a server model can work. For example, the ASP server model supports .asp and .htm file extensions. This function returns an array of strings, and Dreamweaver uses these strings to populate the Default Page Extension list that is found in the App Server category in the Site Definition dialog box.
  • Page 426 function returns a map of these signature declarations. getLanguageSignatures() Extension developers can use this map to generate language-specific code blocks that Dreamweaver drops on the page (based on the appropriate server model for the page) when the user drags and drops a Web Services method, for example. For examples of how to write this function, see the HTML implementation files for the JSP and the ASP.Net server models.
  • Page 427 Description This function returns a JavaScript object that can be accessed from within the JavaScript code. You can retrieve this object by calling the JavaScript dom.serverModel.getServerInfo() function. Furthermore, , and are special serverName serverLanguage serverVersion properties, which you can access through the following JavaScript functions: dom.serverModel.getServerName() dom.serverModel.getServerLanguage() dom.serverModel.getServerVersion()
  • Page 428 If you want a file in the ServerFormats folder to apply only to a specific scripting language, add the following statement so it is the first line in the HTML file: <!-- SCRIPTING-LANGUAGE=XXX --> In this example, represents the scripting language. This statement causes the server behavior to appear in the Plus (+) menu of the Server Behaviors panel only when the currently selected scripting language is Arguments...
  • Page 429 Arguments None. Returns Dreamweaver expects an array of objects where each object contains the following three properties: property is a regular expression that matches the opening script startPattern delimiter (such as "<%" property is a regular expression that matches the closing script delimiter endPattern (such as "%>"...
  • Page 430 Description This function returns the folder name to use for this server model within the Configuration folder. You can access this value from JavaScript by calling the function. dom.serverModel.getFolderName() Arguments None. Returns Dreamweaver expects a string, such as "ASP_JS" getServerSupportsCharset() Availability Dreamweaver MX.
  • Page 431 Arguments None. Returns Dreamweaver expects an array of version objects, each with a version name and version value, as listed in the following examples: ASP version 2.0 ADODB version 2.1 The Server Model API functions...
  • Page 432 Server Models...

  • Page 433: Chapter 20: Data Translators

    Data Translators Data translators translate specialized markup—server-side includes, conditional JavaScript statements, or other code such as PHP3, JSP, CFML, or ASP—into code that Macromedia Dreamweaver 8 can read and display. In Dreamweaver, you can translate attributes within tags as well as entire tags or blocks of code. All data translators—block/tag or attribute—are HTML files.

  • Page 434: How Data Translators Work

    How data translators work Dreamweaver handles all translator files the same way, regardless of whether they translate entire tags or only attributes. At startup, Dreamweaver reads all the files in the Configuration/ Translators folder and calls the function to obtain information about getTranslatorInfo() the translator.

  • Page 435: Determining What Kind Of Translator To Use

    Determining what kind of translator to use All translators must contain the functions, getTranslatorInfo() translateMarkup() and they must reside in the Configuration/Translators folder. They differ, however, in the kind of code that they insert into the user’s document and in how that code must be inspected, as described in the following list: To translate small pieces of server markup that determine attribute values or that conditionally add attributes to a standard HTML tag, write an attribute translator.
  • Page 436 attribute must be unique within the tag. If it is likely that your mmTranslatedValue translator needs to translate more than one attribute in a single tag, you must add a routine in the translator that appends numbers to the attribute (for example, mmTranslatedValue , and so on).

  • Page 437: Inspecting Translated Attributes

    Inspecting translated attributes When server markup specifies a single attribute and the attribute is represented in a Property inspector, Dreamweaver displays the server markup in the Property inspector, as shown in the following figure: The markup appears whether or not a translator is associated with it. The translator runs whenever the user edits the server markup that appears in the Property inspector.
  • Page 438 The syntax of the XML tags is shown in the following example: <MM:BeginLock translatorClass="translatorClass" ¬ type="tagNameOrType" depFiles="dependentFilesList" ¬ orig="encodedOrignalMarkup"> Translated content <MM:EndLock> The italicized values in this example have the following significance: value is the unique identifier for the translator; it is the first string translatorClass in the array that the function returns.

  • Page 439: Creating Property Inspectors For Locked Content

    [<A TARGET="_top" HREF="/support/">support</A>] [<A TARGET="_top" HREF="/company/">about us</A>] [<A TARGET="_top" HREF="/help/">help</A>] </CENTER> <!-- end footer --> <MM:EndLock> Creating Property inspectors for locked content After you create a translator, you need to create a Property inspector for the content so the user can change its properties (for example, the file to be included or one of the conditions in a conditional statement).
  • Page 440 Another problem is inherent in inspecting translated content. When you call the function, the values that return by default are offsets into the dom.getSelection() untranslated source. To expand the selection properly so that the locked region (and only the locked region) is selected, use the following technique: var currentDOM = dw.getDocumentDOM();...
  • Page 441 document.layers['timelayer'].document.timeForm.timefield.¬ value = timeValue; After you parse the attribute to populate the boxes in the Property inspector for the orig translated tag, the next step is probably to set the value of the attribute if the user orig changes the value in any of the text boxes. You might find restrictions against making changes in a locked region.

  • Page 442: Finding Bugs In Your Translator

    Finding bugs in your translator If the function contains certain types of errors, the translator loads translateMarkup() properly, but it fails without an error message when you invoke it. Although failing silently prevents Dreamweaver from becoming unstable, it can hinder development, especially when you need to find one small syntax error in multiple lines of code.

  • Page 443: A Simple Attribute Translator Example

    statements in strategic spots throughout the function alert() translateMarkup() so you can make sure you’re getting the proper branches and so you can check the values of variables and properties at different points: for (var i=0; i< foo.length; i++){ alert("we're at the top of foo.length array, and the value ¬ of i is "...
  • Page 444 Creating the icon Next, you create the icon for Poco tags. To create the icon: Create an image file that is 18 x 18 pixels for the Poco tags icon. Save the file as poco.gif in the Configuration/ThirdPartyTags folder. Creating the attribute translator You create an HTML file that contains the functions necessary for the attribute translator.
  • Page 445 // the conditional statement var trueStart; // The beginning of the true case var falseStart; // The beginning of the false case var trueValue; // The HTML that would render in the true case var attName; // The name of the attribute that is being' // set conditionally.
  • Page 446 transValue = attName + '="' + trueValue + '"'; transAtt = ' mmTranslatedValue' + count + '="' + ¬ escape(transValue) + '"'; outStr = outStr.substring(0,end+4) + transAtt + ¬ outStr.substring(end+4); // If attAndValue is true, and tokens is greater than // 1, then trueValue is a series of attribute/value // pairs, not just one.

  • Page 447: A Simple Block/Tag Translator Example

    returnArray[0] = "Pound_Conditional"; // The translatorClass returnArray[1] = "Pound Conditional Translator"; // The title returnArray[2] = "2"; // The number of extensions returnArray[3] = "html"; // The first extension returnArray[4] = "htm"; // The second extension returnArray[5] = "1"; // The number of expressions returnArray[6] = "<#";...
  • Page 448 * markup to be translated, the regular expressions that * a document containing the markup to be translated * would match (whether the translator should run on all * files, no files, in files with the specified * extensions, or in files matching the specified * expressions).
  • Page 449 return ""; // As long as start, which is equal to the location in inStr of the // KENT tag, is not equal to -1 (that is, as long as there is another // KENT tag in the document) while (start != -1){ // Copy everything up to the start of the KENT tag.
  • Page 450 //Assemble the lock tags and the replacement HTML. var replCode = start + ' depFiles="' + depFiles + '"'; replCode = replCode + ' orig="%3Ckent%3E">\n'; replCode = replCode + imgTag; replCode = replCode + end; return replCode; /****************************************************************** * The getImage() function determines which image to display * based on the day of the week, the time of day and the * user's platform.
  • Page 451 // Now determine which photo to show based on whether it's a workday or // weekend; what time it is; and, if it's a time and day when Kent is // working, what platform the user is on. //If it's not Sunday if (day != 0){ //And it's between 10am and noon, inclusive if (SFhour >= 10 &&...

  • Page 452: The Data Translator Api

    Save the file as kent.htm in the Configuration/Translators folder. The Data Translator API This section describes the functions used to define translators for Dreamweaver. getTranslatorInfo() Description This function provides information about the translator and the files it can affect. Arguments None.
  • Page 453 string specifies when this translator executes. The following list gives the runDefault possible string values: String Definition Sets the translator to always execute. "allFiles" Sets the translator to never execute. "noFiles" Sets the translator to execute for files that have one of the file "byExtension"...
  • Page 454 transArray[11] = "50"; return transArray; translateMarkup() Description This function performs the translation. Arguments docName siteRoot docContent argument is a string that contains the file:// URL for the document to be docName translated. argument is a string that contains the file:// URL for the root of the site siteRoot that contains the document to be translated.
  • Page 455 liveDataTranslateMarkup() Availability Dreamweaver UltraDev 1. Description This function translates documents when users are using the Live Data window. When the user selects the View > Live Data command or clicks the Refresh button, Dreamweaver calls function instead of the function. liveDataTranslateMarkup() translateMarkup() Arguments...
  • Page 456 Data Translators...

  • Page 457: Chapter 21: C-Level Extensibility

    CHAPTER 21 C-Level Extensibility The C-level extensibility mechanism lets you implement Macromedia Dreamweaver 8 extensibility files using a combination of JavaScript and custom C code. You define functions using C, bundle them in a dynamic linked library (DLL) or a shared library, save the library in the Configuration/JSExtensions folder within the Dreamweaver application folder, and then call the functions from JavaScript using the Dreamweaver JavaScript interpreter.
  • Page 458 function accepts a list of arguments from the user, retrieves the readContentsOfFile() filename argument, reads the contents of the file, and returns the contents of the file. For more information about the JavaScript data structures and functions that appear in the function, see “C-level extensibility and the JavaScript interpreter”...

  • Page 459: C-Level Extensibility And The Javascript Interpreter

    The following example shows how the function for the library MM_Init() myLibrary might look: void MM_Init() JS_DefineFunction("readContentsOfFile", readContentsOfFile, 1); Your library must include exactly one instance of the following macro: /* MM_STATE is a macro that expands to some definitions that are * needed to interact with Dreamweaver.

  • Page 460: Data Types

    Data types The JavaScript interpreter defines the following data types. typedef struct JSContext JSContext A pointer to this opaque data type passes to the C-level function. Some functions in the API accept this pointer as one of their arguments. typedef struct JSObject JSObject A pointer to this opaque data type passes to the C-level function.

  • Page 461: The C-Level Api

    The C-level API The C-level extensibility API consists of the following functions: typedef JSBool (*JSNative)(JSContext *cx, JSObject *obj, unsigned int argc, jsval *argv, jsval *rval) Description This function signature describes C-level implementations of JavaScript functions in the following situations: pointer is a pointer to an opaque structure, which must be passed to JSContext some of the functions in the JavaScript API.
  • Page 462 Arguments char *name JSNative call unsigned int nargs argument is the name of the function as it is exposed to JavaScript. name argument is a pointer to a C-level function. The function must accept the same call arguments as , and it must return a , which indicates success readContentsOfFile JSBool...
  • Page 463 Arguments JSContext *cx jsval v long *lp argument is the opaque pointer that passes to the JavaScript function. JSContext argument is the structure from which the integer is to be extracted. jsval argument is a pointer to a 4-byte integer. This function stores the converted value Returns A Boolean value: indicates success;...
  • Page 464 argument is a pointer to a Boolean value. This function stores the JSBool converted value in Returns A Boolean value: indicates success; indicates failure. JS_TRUE JS_FALSE JSBool JS_ValueToObject() Description This function extracts a function argument from a structure, converts it to an object (if jsval possible), and passes the converted value back to the caller.
  • Page 465 argument is a pointer to the structure into which the contents of the string jsval should be copied. Returns A Boolean value: indicates success; indicates failure. JS_TRUE JS_FALSE JSBool JS_DoubleToValue() Description This function stores a floating-point number return value in a structure.
  • Page 466 JSVal JS_IntegerToValue() Description This function converts a long integer value to structure. JSVal Arguments argument is the long integer value that you want to convert to a structure. jsval Returns structure that contains the integer that was passed to the function as an argument. JSVal JSVal JS_ObjectToValue() Description...
  • Page 467 Typically, this argument is passed in and converted using the JS_ValueToObject() function. Returns A pointer to a null-terminated string. The caller should not free this string when it finishes. JSObject *JS_NewArrayObject() Description This function creates a new object that contains an array of JSVals Arguments JSContext *cx...
  • Page 468 JSBool JS_GetElement() Description This function reads a single element of an array object. Arguments JSContext *cx JSObject *obj unsigned int index jsval *v argument is the opaque pointer that passes to the JavaScript function. JSContext argument is a pointer to an array object. argument is an integer index into the array.
  • Page 469 JSBool JS_ExecuteScript() Description This function compiles and executes a JavaScript string. If the script generates a return value, it returns in *rval Arguments JSContext *cx JSObject *obj char *script unsigned int sz jsval *rval argument is the opaque pointer that passes to the JavaScript function. JSContext argument is a pointer to the object in whose context the script executes.

  • Page 470: File Access And Multiuser Configuration Api

    JS_FALSE File Access and Multiuser Configuration Macromedia recommends that you always use the File Access and Multiuser Configuration API to access the file system through C-level extensions. For files other than configuration files, the functions access the specified file or folder.
  • Page 471 ", Files/Macromedia/Dreamweaver/Configuration/Objects/Common/Table.htm Dreamweaver searches for a Table.htm file in the C:/Documents and Settings/username/ Macromedia/Dreamweaver/Configuration/Objects/Common folder and, if it exists, uses it instead. C-level extensions, or shared libraries, must use the File Access and Multiuser Configuration API to read and write to the Dreamweaver Configuration folder. Using the File Access and Multiuser Configuration API lets Dreamweaver read and write to the user Configuration folder and ensures that the file operations do not fail due to insufficient access privileges.
  • Page 472 Snippets panel list. If a C-level extension calls the function for the file:///c|Program MM_ConfigFileExists() Files/Macromedia/Dreamweaver/Configuration/Snippets/javascript/onepixelborder.csn URL, it returns a value of . Likewise, if a JavaScript extension tries to call false dw.getDocumentDom("file:///c|Program Files/Macromedia/Dreamweaver/...
  • Page 473 Dreamweaver Configuration folder, subject to filtering by the mm_deleted_files.xml file. Examples JSObject *jsobj_array; jsobj_array = MM_GetConfigFolderList("file:///¬ c|/P rogram Files/Macromedia/Dreamweaver/Configuration", "directories" ); JSBool MM_ConfigFileExists() Availability Dreamweaver MX. Description This function checks whether the specified file exists. If it is a file in a configuration folder, the function searches for the file in the user Configuration folder or the Dreamweaver Configuration folder.
  • Page 474 int MM_OpenConfigFile() Availability Dreamweaver MX. Description This function opens the file and returns an operating system file handle. You can use the operating system file handle in calls to system file functions. You must close the file handle with a call to the system function.
  • Page 475 Example char *dwConfig = "file:///c|/ rogram Files/Macromedia/Dreamweaver/ Configuration/Extensions.txt"; int = fileno; if(MM_ConfigFileExists(dwConfig)) fileno = MM_OpenConfigFile(dwConfig, "read"); JSBool MM_GetConfigFileAttributes() Availability Dreamweaver MX. Description This function finds the file and returns the attributes of the file. You can set any of the arguments except if you do not need the value.
  • Page 476 JS_TRUE JS_FALSE JS_FALSE the file does not exist or an error occurs while getting the attributes. Example char dwConfig = "file:///c|/ rogram Files/Macromedia/Dreamweaver/ Configuration/Extensions.txt"; unsigned long attrs; unsigned long filesize; unsigned long modtime; unsigned long createtime; MM_GetConfigAttributes(dwConfig, &attrs, &filesize, &modtime, &createtime);...
  • Page 477 Example char *dwConfig = "file:///c|/ rogram Files/Macromedia/Dreamweaver/ Configuration/Extensions.txt"; unsigned long attrs; attrs = (MM_FILEATTR_NORMAL | MM_FILEATTR_RDONLY); int fileno = 0; if(MM_SetConfigFileAttrs(dwConfig, attrs)) fileno = MM_OpenConfigFile(dwConfig); JSBool MM_CreateConfigFolder() Availability Dreamweaver MX. Description This function creates a folder in the specified location.
  • Page 478 Returns A Boolean value: indicates success; indicates failure. JS_TRUE JS_FALSE Example char *dwConfig = "file:///c|/ rogram Files\Macromedia\Dreamweaver \Configuration\Objects"; MM_RemoveConfigFolder(dwConfig); JSBool MM_DeleteConfigFile() Availability Dreamweaver MX. Description This function deletes the file, if it exists. If the file exists below the Dreamweaver Configuration folder, the function marks the file for deletion in the mm_deleted_files.xml...

  • Page 479: Calling A C Function From Javascript

    JS_TRUE JS_FALSE Example char dwConfig = "file:///c:| rogram Files\Macromedia\Dreamweaver \Configuration\Objects\insertbar.xml"; MM_DeleteConfigFile(dwConfig); Calling a C function from JavaScript After you understand how C-level extensibility works in Dreamweaver and its dependency on certain data types and functions, it’s useful to know how to build a library and call a function.
  • Page 480 When the build operation finishes, the Sample.bundle file appears in the folder that contains Sample.mcp. The Mach-O Bundle that is generated can only be used in Macromedia Dreamweaver 8. Earlier versions of Dreamweaver do not recognize it. To build the shared library on the Macintosh using Apple Xcode 1.5 or greater: Open Sample.xcode.

  • Page 481: Part 4: Appendix

    Find information about supporting files and reference resources that can aid in developing Macromedia Dreamweaver 8 extensions. Appendix: The Shared Folder ......483...

  • Page 483: Appendix: The Shared Folder

    HTML files in the Configuration folder that include these JavaScript files so that you can investigate how they are used. Generally, you use the functions and resources in the Common and Macromedia (MM) folders or add resources to the Common folder for use in new extensions. You should always look in the Shared/Common/Scripts folder first for utilities and functions.
  • Page 484 The Common folder The Common folder has shared scripts and classes for use in third-party extensions. CodeBehindMgr.js Contains functions for creating a code-behind document. A code-behind document lets you create distinct pages that separate the code for user interface (UI) logic from the code for a UI design.
  • Page 485 GridControlClass.js Use this class to create and manipulate an editable grid. You add a special select list in your HTML, and attach this class to it in JavaScript to manipulate the grid. ImageButtonClass.js This class makes it easy to control the Pressed/Mouse-over- while-pressed/Mouse-over/Disabled-while-pressed look of a button.
  • Page 486 The Scripts folder The Scripts subfolder contains the following utility functions: CFCutilities.js Contains utility functions related to Macromedia ColdFusion components. Functions parse attributes from within the opening tag of a given node, parse a CFC tree, get the current URL DOM, get the CFC DOM, and more.
  • Page 487 Also, houses functionality shared between the UI implementations and mediates switches between the UIs. sbUtils.js Contains shared functions for use within Macromedia server behaviors. The class in the Configuration/Shared/ dwscripts Common/Scripts folder contains more general purpose utilities.
  • Page 488 GridControlClass.js Older version of the in the Common folder. GridControlClass See the GridControlClass.js file in the Shared/Common/ Scripts folder. ImageButtonClass.js Older version of the in the Common folder. ImageButtonClass See the ImageButtonClass.js file in the Shared/Common/ Scripts folder. ListControlClass.js Older version of the in the Common folder.
  • Page 489 DOM.js Contains general helper functions for working with the Dreamweaver DOM. Includes functions that get the root node of the active document, find a tag of a given name, create a list of nodes from the specified starting node, check whether a given tag is contained inside another tag, perform various operations on behavior functions, and more.
  • Page 490 niceName.js Contains functions that convert an array of Object references to an array of simpler names. quickString.js Contains functions that aggregate smaller strings without doing a memory allocation each time. string.js Contains a generic set of functions for manipulating and parsing text strings.

  • Page 491: Using The Shared Folder

    Using the Shared folder Look first in the Dreamweaver Configuration/Shared/Common folder for useful extension code because this folder contains the most current and commonly used functionality. Extensions can leverage the resources in the Shared folder for their own functionality. An object, command, or other extension can specify one of the JavaScript files in the Shared folder as a source file in a tag, and then use the function in the body of the file or in...
  • Page 492 The Shared Folder...

  • Page 493: Index

    Index arguments attribute 238 array object 128 action files 305 attribute translators action tag 189 about 435 activate tag 190 creating 435 addDynamicSource() 391 debugging 442 alert() 128 sample code 443 analyzeServerBehavior() 329 attributes APIs, types of arguments 238 Behaviors 312 checked 235 C-level extensibility 461 colorRect 234...
  • Page 494 behaviors API 312 C extensibility API helper functions 307 JS_BooleanToValue() 465 inserting multiple functions with 307 JS_DoubleToValue() 465 required functions 312 JS_ExecuteScript() 469 sample code 307 JS_GetArrayLength() 467 user experience 306 JS_GetElement() 468 Behaviors API JS_IntegerToValue() 466 applyBehavior() 312 JS_NewArrayObject() 467 behaviorFunction() 314 JS_ObjectToValue() 466 canAcceptBehavior() 315...
  • Page 495 closeTag tag 368 description tag 58 code coloring function tag 61 about 63 menu tag 59 blockEnd tag 66 menugroup tag 58 blockStart tag 66 menuitem tag 60 brackets tag 67 code snippet extensions, definition 101 charEnd tag 68 code validation 92 charEsc tag 68 CodeHints.xml file charStart tag 68...
  • Page 496 conventions, in this guide 13 for tags or blocks of code 437 copyServerBehavior() 331 kinds of 435 css-support tag, code validation 92 user experience 434 cssImport tag, code coloring 69 database controls 116 cssMedia tag, code coloring 69 database tree controls 117 cssProperty tag, code coloring 70 date object 128 cssSelector tag, code coloring 70...
  • Page 497 opening, procedure for 46 partType attribute 346 tags in definition file 38 quickSearch 348 document, opening 46 searchPatterns 352, 353, 363 documentEdited() 298 selectParticipant attribute 344 documentElement property 131 subType attribute 342 DOM. <italic>See Document Object Model. title 343 domRequired attribute 235 translation 364 Dreamweaver DOM 129 translations 363...
  • Page 498 extensions, reloading 104, 105 Extensions.txt file 43 generateDynamicDataRef() 394 external JavaScript files 106 generateDynamicSourceBindings() 395 getAttribute() 132 getCodeViewDropCode() 414 getComponentChildren() 412 file (field) object 128 getContextMenuId() 413 file attribute 147, 235 getCurrentValue() 240 file type, changing default 20 getDockingSide() 299 files getDynamicContent() 210, 240 CodeHints.xml 56...
  • Page 499 id attribute 144, 232 JavaScript idChar1 tag, code coloring 73 controls 113 idCharRest tag, code coloring 74 external files 106 identifyBehaviorArguments() 317 URLs 106 ignoreCase tag, code coloring 74 JS_BooleanToValue() 465 ignoreMMTParams tag, code coloring 74 JS_DefineFunction() 461 ignoreTags tag, code coloring 75 JS_DoubleToValue() 465 image attribute 145, 232 JS_ExecuteScript() 469...
  • Page 500 item tag 29 tag syntax 29 manipulating tree control content 122 MM_GetConfigFileAttributes() 475 math object 128 MM_GetConfigFolderList() 472 menu command extensions, definition 100 mm_jsapi.h file menu commands including 459 about 194 sample 479 sample code 197 MM_OpenConfigFile() 474 user experience 196 MM_returnValue 307 Menu Commands API MMDocumentTypes.xml file 35...
  • Page 501 Objects API Property inspectors canInsertObject() 161 *LOCKED* keyword 439 displayHelp() 161 comment at top of file 279 insertObject() 162 custom 279 isDomRequired() 162 file structure 279 objectTag() 164 lightning bolt icon 437 windowDimensions() 165 locked content, for 439 objectTag() 164 overview 279 onBlur event 128 sample code 282...
  • Page 502 Server Formats API applyFormat() 403 sampleText tag, code coloring 77 applyFormatDefinition() 403 scheme block delimiter coloring 80 deleteFormat() 404 scheme processing formatDynamicDataRef() 405 code coloring 83 inspectFormatDefinition() 406 escape characters 85 Server Model API maximum string length 85 about 423 precedence 86 canRecognizeDocument() 424 wildcard characters 84...
  • Page 503 dropdown tag 229 editcontrol tag 230 tag attribute 147 file definition 220 Tag Chooser 268 how commands work 217 Tag Dialog extensions, definition 100 how toolbars work 215 Tag editor API include/ tag 223 applyTag() 276 item tags 226 inspectTag() 275 itemref/ tag 224 validateTag() 276 itemtype/ tag 224...
  • Page 504 unescape() 128 uninstalling 30 files 128 update attribute 236 structure 339 updatePattern tag 359, 360 tree view 128 updatePatterns tag 358 XML files URL property 131 CodeHints.xml 56 insertbar.xml 150 menus.xml 182 MMDocumentTypes.xml 35 toolbars.xml 215 validateTag() 276 XML tag value attribute 236 codehints 57 value tag, code validation 94...

This manual is also suitable for:

Dreamweaver 8

Table of Contents