Writing the javascript code – Adobe Extending Dreamweaver CS4 User Manual
Page 230

224
EXTENDING DREAMWEAVER CS4
Floating panels
<!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
(no script selected)
if the user has not selected a
script marker or the JavaScript code that underlies a selected script marker. The following code defines these two
floating panels, or absolutely positioned (AP) elements, called
blanklayer
and
scriptlayer
:
Create the two floating panels
1
Add the following code after the header in the HTML file:
<body>
<div id="blanklayer" style="position:absolute; width:422px; ¬
height:181px; z-index:1; left: 8px; top: 11px; ¬
visibility: hidden">
<center>
<br>
<br>
<br>
<br>
<br>
(no script selected)
</center>
</div>
<div id="scriptlayer" style="position:absolute; width:422px; ¬
height:181px; z-index:1; left: 8px; top: 11px; ¬
visibility: visible">
<form name="theForm">
<textarea name="scriptCode" cols="80" rows="20" wrap="VIRTUAL" ¬
onBlur="updateScript()"></textarea>
</form>
</div>
</body>
</html>
2
Save the file as scriptEditor.htm in the Configuration/Floaters folder.
Both
div
tags use the
style
attribute to specify the position (
absolute
), size (
width:422px
and
height:181px
),
and default
visibility
setting (
visible
) of the floating panels. The
blanklayer
panel uses the
center
attribute
and a series of break (
br
) tags to position the text in the center of the panel. The
scriptlayer
panel creates a form
with a single
textarea
to display the selected JavaScript code. The
textarea
tag also specifies that when an
onBlur
event occurs, indicating that the selected code has changed, the
updateScript()
function is called to write the
changed text back to the document.
Writing the JavaScript code
The JavaScript code for the Script Editor consists of one floating panel function that Dreamweaver calls,
selectionchanged()
, and one user-defined function,
updateScript().