Adobe 38040334 Extending Dreamweaver - Page 294

A simple data source example

Page 294 highlights

DREAMWEAVER CS3 288 Extending Dreamweaver Dreamweaver calls the inspectDynamicDataRef() function to convert the dynamic data object back from the code in the user's document to an item in the tree. (This process is the reverse of what occurs when the generateDynamicDataRef() function is called.) If the inspectDynamicDataRef() function returns an array that contains two elements, Dreamweaver shows with a visual cue which item in the tree is bound to the current selection. 8 Every time the user changes the selection, Dreamweaver calls the inspectDynamicDataRef() function to determine whether the new selection is dynamic text or a tag with a dynamic attribute. If it is dynamic text, Dreamweaver displays the bindings for the current selection in the Bindings panel. 9 Using the Dynamic Data or the Dynamic Text dialog box or the Bindings panel, it's possible to change the data format for a dynamic text object or a dynamic attribute that the user has already added to the page. When the format changes, Dreamweaver calls the generateDynamicDataRef() function to get the string to insert into the user's document and passes that string to the formatDynamicDataRef() function (see "formatDynamicDataRef()" on page 304). The string that the formatDynamicDataRef() function returns is inserted in the user's document. 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. This example creates a data source called MyDatasource, which includes a MyDatasource.js JavaScript file, a MyDatasource_DataRef.edml file, and MyDatasource Variable command files to implement a dialog box for users to enter the name of a specific variable. The MyDatasource example is based on the implementation of the Cookie Variable data source and the URL Variable data source. The files for these data sources reside in the Configuration/DataSources/ColdFusion folder. You create this data source by performing the following steps: • "Creating the data source definition file" on page 288 • "Creating the EDML file" on page 289 • "Creating the JavaScript file that implements the Data Sources API functions" on page 289 • "Creating the supporting command files for user input" on page 292 • "Testing the new data source" on page 294 Creating the data source definition file The data source definition file tells Dreamweaver the name of the data source as it will appear in the Bindings Plus (+) menu and also tells Dreamweaver where to find the supporting JavaScript files for the data source implementation. 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 script tag. In addition, several supporting files are necessary for implementing this data source. In general, you might not need to use the functions in these supporting files, but they are often useful (and necessary in this example). For example, the dwscriptsServer.js file contains the dwscripts.stripCFOutputTags() function used in the implementation of this data source. And, using the DataSourceClass.js file, you create an instance of the DataSource class to use as the return value of the findDynamicSources() function.

  • 1
  • 2
  • 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

DREAMWEAVER CS3
Extending Dreamweaver
288
Dreamweaver calls the
inspectDynamicDataRef()
function to convert the dynamic data object back from the code
in the user’s document to an item in the tree. (This process is the reverse of what occurs when the
generateDynamicDataRef()
function is called.) If the
inspectDynamicDataRef()
function returns an array that
contains two elements, Dreamweaver shows with a visual cue which item in the tree is bound to the current selection.
8
Every time the user changes the selection, Dreamweaver calls the
inspectDynamicDataRef()
function to
determine whether the new selection is dynamic text or a tag with a dynamic attribute. If it is dynamic text,
Dreamweaver displays the bindings for the current selection in the Bindings panel.
9
Using the Dynamic Data or the Dynamic Text dialog box or the Bindings panel, it’s possible to change the data
format for a dynamic text object or a dynamic attribute that the user has already added to the page. When the format
changes, Dreamweaver calls the
generateDynamicDataRef()
function to get the string to insert into the user’s
document and passes that string to the
formatDynamicDataRef()
function (see “formatDynamicDataRef()” on
page 304). The string that the
formatDynamicDataRef()
function returns is inserted in the user’s document.
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.
This example creates a data source called MyDatasource, which includes a MyDatasource.js JavaScript file, a
MyDatasource_DataRef.edml file, and MyDatasource Variable command files to implement a dialog box for users
to enter the name of a specific variable. The MyDatasource example is based on the implementation of the Cookie
Variable data source and the URL Variable data source. The files for these data sources reside in the
Configuration/DataSources/ColdFusion folder.
You create this data source by performing the following steps:
“Creating the data source definition file” on page 288
“Creating the EDML file” on page 289
“Creating the JavaScript file that implements the Data Sources API functions” on page 289
“Creating the supporting command files for user input” on page 292
“Testing the new data source” on page 294
Creating the data source definition file
The data source definition file tells Dreamweaver the name of the data source as it will appear in the Bindings Plus
(+) menu and also tells Dreamweaver where to find the supporting JavaScript files for the data source implemen-
tation.
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
script
tag.
In addition, several supporting files are necessary for implementing this data source. In general, you might not need
to use the functions in these supporting files, but they are often useful (and necessary in this example). For example,
the dwscriptsServer.js file contains the
dwscripts.stripCFOutputTags()
function used in the implementation of
this data source. And, using the DataSourceClass.js file, you create an instance of the DataSource class to use as the
return value of the
findDynamicSources()
function.