Create an HTML file containing the mm:browsercontrol API. This HTML file must be placed in the configuration/PreviewExtensions/ directory.
Last updated on
Apr 27, 2021
Code view functions include operations that are related to editing document source code (and that have subsequent impact on the Design view). The functions in this section let you add navigational controls to Code views within a Split document view or the Code inspector window.
ShowPreview()
Availability
Dreamweaver CC (2015 release)
Description
The ShowPreview API lets you generate a custom preview that can be displayed in a pop-up whenever Dreamweaver users hover their mouse over assets or text in Code view. For example, if you want to display a preview of all the parameters of a JavaScript function when users hover their mouse over that function, you can do so using this API.
The preview is displayed when users hover their mouse over text in Code view and are static for 100 milliseconds.
Implementation
-
-
Implement the JavaScript API, ShowPreview, to load after the mm:browserControl API gets loaded from the HTML file. This API will be called whenever users stop hovering their mouse in Code view.
Note:The ShowPreview API will not be called if there is no text at the point where the mouse is hovered or if the mouse is hovered beyond the end of line.
This API will be called on each of the extensions placed within the configuration/PreviewExtensions/ directory, one after another in the alphabetical order of the extension HTML file name. Once the ShowPreview API is handled by an extension, none of the other extensions get a change to handle it.
The pop-up window that contains the preview is a plain, basic mode-less window. You have to specify the content of the preview pop-up and Dreamweaver can load the content within the pop-up.
You cannot customize the dismissal of the pop-up. Dreamweaver dismisses the pop-up if users:
- start moving the mouse again (after pausing)
- start typing
- click some of the Dreamweaver menus
- minimize Dreamweaver
- perform an action that results in another pop-up to be displayed
Arguments
docType, lineContent, mouseOffsetInContent, currentColorTheme
- docType: This is the extension of the file that is currently opened in Code view. For example, CSS, HTML, and PHP.
- lineContent: This is a string that contains the content of the entire line on which the user's mouse is positioned.
- mouseOffsetInContent: This is a number that indicates the number of the character at which the mouse is positioned within the lineContent string. The lineContent string offset starts from 0. So if this value is 10 , then it means the mouse points to the 11th character in the string.
- currentColorTheme: This indicates the color theme of the Code view. The value is either black or white. For all drak color themes, the value is black and for all light color themes, the value is white. You can use this parameter to decide an appropriate skin for the preview.
Returns
- CanHandle: This property can have three possible values:
- 0 : The extension is not willing to handle this request. In this case none of the other return values are important, so they are omitted .
- 1 : The extension is asking Dreamweaver that it will handle the preview right away. The extension will pass back the other fields of the return value as appropriate so that Dreamweaver can display the preview.
- 2: The extension is asking Dreamweaver that it will handle the preview, but not right away. The extension will return all the preview parameters at a later point in time in a seperate API setAssetPreviewParameters on a Dreamweaver JavaScript object.
- HighLight: A boolean value true or false. This indicates whether or not a specific part of the text in Code view must be highlighted when the preview pop-up is displayed.
- Start: A number indicates the start offset of the character from where the highlight should begin. This number is the offset within the lineContent string that is passed by Dreamweaver to the ShowPreview API. If the highlight is false, this offset is ignored.
- end: A number indicates the end offset of the character where the highlight should end. This number is the offset within the lineContent string that was passed by Dreamweaver to the ShowPreview API. If highlight is false, this offset is ignored.
- PreviewMode: This can have two different strings as its value:
- atmouse: Dreamweaver will pop up the preview starting from the current mouse point. This is the same location as mouseOffsetInContent indicates in ShowPreview API.
- equispace: Dreamweaver will pop up the preview equispaced, starting from the highlight start (start in return value) and enindg where the highlight ends (end in return value).
- Width: This is the width of the browser that will be popped at the earlier specifed location (atmouse or equispaced). This value is in pixels.
- Height: This is the height of the browser that will be popped at the earlier specifed location (atmouse or equispaced). This value is in pixels.
dw.setAssetPreviewParameters()
This API can be called on a Dreamweaver JavaScript object when the preview extension returns the CanHandle value as 2, which means that the extension will handle this hover event, but other parameters (as described in the Returns section above) will be passed later.
This API enables the extension to do some asynchronous processing, if required, before passing the return value of ShowPreview API. For example, querying data from a server and fetching values for showing the preview, which is asynchronous in nature.
Note: Dreamweaver will wait for the other parameters of return value for the ShowPreview API only until the users move their mouse. If any mouse happens after the ShowPreview return value is received, then subsequent call to setAssetPreviewParameters will not have any effect .
Example
Preview.html placed in the configuration/PreviewExtensions/ directory:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Sample Preview</title>
<script type="text/javascript" src="SamplePreviewScripts/SamplePreview.js"></script>
<style>
body {
margin: 0;
padding: 0;
}
#browserControl {
margin: 0;
padding: 0;
width: 150px;
height: 150px;
}
</style>
</head>
<body onResize="onResize();">
<mm:browsercontrol id="browserControl" />
</body>
</html>
SamplePreview.js:
function onResize() {
"use strict";
var brsCtrl = document.getElementById(browserControl);
brsCtrl.loadHTML(previewHTML); //This previewHTML is the preview which you might want to show
}
//DW extension API : this will be called from DW
//param: docType type of the currently active document opened in code view
//param: linecontent content of the whole physical line on which the mouse is hovering on
//param: mouseOffsetInContent mouse location in terms of offset inside the lineContent starting with 0
//param: colorTheme current color theme ( Black / White)
function ShowPreview(docType, lineContent, mouseOffsetInContent, currentColorTheme) {
if (docType !== undefined && lineContent !== undefined && mouseOffsetInContent !== undefined && currentColorTheme !== undefined) {
var docTypeString = docType.toString();
var lineContentString = lineContent.toString();
var currentColorThemeString = currentColorTheme.toString();
//this will do the actual processing to decide if extension wanst to show the preview
var ret = businessLogicProcessing(docTypeString,lineContentString,mouseOffsetInContent,currentColorThemeString);
if( ret)
{
//Incase extension wants to provide the preview parameters just now
return {
CanHandle : 1,
HighLight: true,
PreviewMode: equispaced,
Start: 100 , //Offset inside lineContentString where the highlight will start
End: 200,//Offset inside lineContentString where the highlight will end
Width: 100, //100 px of the width for the preview
Height: 150 //150 px of the height for the preview
};
//Incase extension wants to provide the preview params later
return{
CanHandle : 2
};
}
else
{
return{
CanHandle : 0
};
}
}
}
function providePreviewParamsLater() {
//This will be invoked when extension feels it is ready to pass back the remaining preview params :
var retVal = {
HighLight: true,
PreviewMode: equispaced,
Start: 100 , //Offset inside lineContentString where the highlight will start
End: 200,//Offset inside lineContentString where the highlight will end
Width: 100, //100 px of the width for the preview
Height: 150 //150 px of the height for the preview
};
dw.setAssetPreviewParameters(retVal);
}
dom.formatRange()
Availability
Dreamweaver MX.
Description
Applies Dreamweaver automatic syntax formatting to a specified range of characters in the Code view, according to the settings in the Preferences > Code Format dialog box.
Arguments
startOffset, endOffset
The startOffset argument is an integer that represents the beginning of the specified range as the offset from the beginning of the document.
The endOffset argument is an integer that represents the end of the specified range as the offset from the beginning of the document.
Returns
Nothing.
dom.formatSelection()
Availability
Dreamweaver MX.
Description
Applies Dreamweaver automatic syntax formatting to the selected content (the same as selecting the Commands > Apply Source Formatting to Selection option) according to the settings in the Preferences > Code Format dialog box.
Arguments
None.
Returns
Nothing.
dom.getShowNoscript()
Availability
Dreamweaver MX.
Description
Gets the current state of the noscript content option (from the View > Noscript Content menu option). On by default, the noscript tag identifies page script content that can be rendered, or not (by choice), in the browser.
Arguments
None.
Returns
A Boolean value: true if the noscript tag content is currently rendered; false otherwise.
dom.getAutoValidationCount()
Availability
Dreamweaver MX 2004.
Description
Gets the number of errors, warnings, and information messages for the last auto-validation (also known as an inline validation) of the document. Currently only a target-browser check is performed during auto-validation (see dom.runValidation()).
Note:
This function returns only the results that are currently in the results window for the document. If you want to make sure that the counts are up-to-date, you can call dom.runValidation() before calling this function.
Arguments
None.
Returns
An object with the following properties:
The numError property, which is the number of errors
The numWarning property, which is the number of warnings
The numInfo property, which is the number of information messages
Example
theDom = dw.getDocumentDOM(); theDom.runValidation(); theDom.getAutoValidationCount();
dom.isDesignViewUpdated()
Availability
Dreamweaver 4.
Description
Determines whether the Design view and Text view content is synchronized for those Dreamweaver operations that require a valid document state.
Arguments
None.
Returns
A Boolean value: true if the Design view (WYSIWYG) is synchronized with the text in the Text view; false otherwise.
dom.isSelectionValid()
Availability
Dreamweaver 4.
Description
Determines whether a selection is valid, meaning it is currently synchronized with the Design view, or if it needs to be moved before an operation occurs.
Arguments
None.
Returns
A Boolean value: true if the current selection is in a valid piece of code; false if the document has not been synchronized, because the selection is not updated.
dom.setShowNoscript()
Availability
Dreamweaver MX.
Description
Sets the noscript content option on or off (the same as selecting the View > Noscript Content option). On by default, the noscript tag identifies page script content that can be rendered, or not (by choice), in the browser.
Arguments
{bShowNoscript}
The bShowNoscript argument, which is optional, is a Boolean value that indicates whether the noscript tag content should be rendered; true if the noscript tag content should be rendered, false otherwise.
Returns
Nothing.
dom.source.arrowDown()
Availability
Dreamweaver 4.
Description
Moves the insertion point down the Code view document, line by line. If content is already selected, this function extends the selection line by line.
Arguments
{nTimes}, {bShiftIsDown}
The nTimes argument, which is optional, is the number of lines that the insertion point must move. If nTimes is omitted, the default is 1.
The bShiftIsDown argument, which is optional, is a Boolean value that indicates whether content is being selected. If bShiftIsDown is true, the content is selected.
Returns
Nothing.
dom.source.arrowLeft()
Availability
Dreamweaver 4.
Description
Moves the insertion point to the left in the current line of the Code view. If content is already selected, this function extends the selection to the left.
Arguments
{nTimes}, {bShiftIsDown}
The nTimes argument, which is optional, is the number of characters that the insertion point must move. If nTimes is omitted, the default is 1.
The bShiftIsDown argument, which is optional, is a Boolean value that indicates whether content is being selected. If bShiftIsDown is true, the content is selected.
Returns
Nothing.
dom.source.arrowRight()
Availability
Dreamweaver 4.
Description
Moves the insertion point to the right in the current line of the Code view. If content is already selected, this function extends the selection to the right.
Arguments
{nTimes}, {bShiftIsDown}
The nTimes argument, which is optional, is the number of characters that the insertion point must move. If nTimes is omitted, the default is 1.
The bShiftIsDown argument, which is optional, is a Boolean value that indicates whether content is being selected. If bShiftIsDown is true, the content is selected; otherwise it is not.
Returns
Nothing.
dom.source.arrowUp()
Availability
Dreamweaver 4.
Description
Moves the insertion point up the Code view document, line by line. If content is already selected, this function extends the selection line by line.
Arguments
{nTimes}, {bShiftIsDown}
The nTimes argument is the number of lines that the insertion point must move. If nTimes is omitted, the default is 1.
The bShiftIsDown argument is a Boolean value that indicates whether content is being selected. If bShiftIsDown is true, the content is selected.
Returns
Nothing.
dom.source.balanceBracesTextView()
Availability
Dreamweaver 4.
Description
This function is a Code view extension that enables parentheses balancing. You can call dom.source.balanceBracesTextView() to extend a currently highlighted selection or insertion point. The extension is from the opening of the surrounding parenthetical statement to the end of the statement. It is to balance the following characters: [], {}, and (). Subsequent calls expand the selection through further levels of punctuation nesting.
Arguments
None.
Returns
Nothing.
dom.source.doCodeNavItem()
Availability
Dreamweaver 4.
Description
This function loads the Code Navigator and populates it with targets for the current selection. However, it does not by itself do any navigation or open any related file.
Arguments
None
Returns
A Boolean value: true if the Code Navigator is opened; false if it cannot be opened because the current selection has no navigation targets.
dom.source.endOfDocument()
Availability
Dreamweaver 4.
Description
Places the insertion point at the end of the current Code view document. If content is already selected, this function extends the selection to the end of the document.
Arguments
bShiftIsDown
The bShiftIsDown argument is a Boolean value that indicates whether content is being selected. If bShiftIsDown is true, the content is selected.
Returns
Nothing.
dom.source.endOfLine()
Availability
Dreamweaver 4.
Description
Places the insertion point at the end of the current line. If content is already selected, this function extends the selection to the end of the current line.
Arguments
bShiftIsDown
The bShiftIsDown argument is a Boolean value that indicates whether content is being selected. If bShiftIsDown is true, the content is selected.
Returns
Nothing.
dom.source.endPage()
Availability
Dreamweaver 4.
Description
Moves the insertion point to the end of the current page or to the end of the next page if the insertion point is already at the end of a page. If content is already selected, this function extends the selection page by page.
Arguments
{nTimes}, {bShiftIsDown}
The nTimes argument, which is optional, is the number of pages that the insertion point must move. If nTimes is omitted, the default is 1.
The bShiftIsDown argument, which is optional, is a Boolean value that indicates whether content is being selected. If bShiftIsDown is true, the content is selected.
Returns
Nothing.
dom.source.getCurrentLines()
Availability
Dreamweaver 4.
Description
Returns the line numbers for the specified offset locations from the beginning of the document.
Arguments
None.
Returns
The line numbers for the current selection.
dom.source.getSelection()
Description
Gets the selection in the current document, which is expressed as character offsets into the document’s Code view.
Arguments
None.
Returns
A pair of integers that represent offsets from the beginning of the source document. The first integer is the opening of the selection; the second is the closing of the selection. If the two numbers are equal, the selection is an insertion point. If there is no selection in the source, both numbers are -1.
dom.source.getLineFromOffset()
Availability
Dreamweaver MX.
Description
Takes an offset into the source document.
Arguments
None.
Returns
The associated line number, or -1 if the offset is negative or past the end of the file.
dom.source.getText()
Availability
Dreamweaver 4.
Description
Returns the text string in the source between the designated offsets.
Arguments
startOffset, endOffset
The startOffset argument is an integer that represents the offset from the beginning of the document.
The endOffset argument is an integer that represents the end of the document.
Returns
A string that represents the text in the source code between the offsets start and end.
dom.source.getValidationErrorsForOffset()
Availability
Dreamweaver MX 2004.
Description
Returns a list of validation errors at the specified offset, or it searches from the offset for the next error. If none are found the function, returns null.
Arguments
offset, {searchDirection}
The offset argument is a number that specifies the offset in the code for which the function will return any errors.
The searchDirection argument, which is optional, is a string that specifies "empty", "forward" or "back". If specified, the function searches forward or back from the given offset to the next characters with errors and returns them. If not specified, the function simply checks for errors at the given offset.
Returns
An array of objects or the value null. Each object in the array has the following properties:
The message object is a string that contains the error message.
The floaterName object is a string that contains the name of the results window. You can pass this value to the showResults() or setFloaterVisibility() functions.
The floaterIndex object is an index of items in the floater results list.
The start object is the opening index of underlined code.
The end object is the closing index of underlined code.
Note:
The returned floater indexes should not be stored because they can change frequently, such as when documents are opened or closed.
Example
The following example calls getValidationErrorsForOffset() to check for any errors at the offset of the current selection. If the function returns an error, the code calls the alert() function to display the error message to the user.
var offset = dw.getDocumentDOM().source.getSelection()[0];
var errors = dw.getDocumentDOM().source.getValidationErrorsForOffset(offset);
if ( errors && errors.length > 0 )
alert( errors[0].message );
dom.source.indentTextview()
Availability
Dreamweaver 4.
Description
Moves selected Code view text one tab stop to the right.
Arguments
None.
Returns
Nothing.
dom.source.insert()
Availability
Dreamweaver 4.
Description
Inserts the specified string into the source code at the specified offset from the beginning of the source file. If the offset is not greater than or equal to zero, the insertion fails and the function returns false.
Arguments
offset, string
The offset argument is the offset from the beginning of the file where the string must be inserted.
The string argument is the string to insert.
Returns
A Boolean value: true if successful; false otherwise.
dom.source.nextWord()
Availability
Dreamweaver 4.
Description
Moves the insertion point to the beginning of the next word (or words, if specified) in the Code view. If content is already selected, this function extends the selection to the right.
Arguments
{nTimes}, {bShiftIsDown}
The nTimes argument, which is optional, is the number of words that the insertion point must move. If nTimes is omitted, the default is 1.
The bShiftIsDown argument, which is optional, is a Boolean value that indicates whether content is being selected. If bShiftIsDown is true, the content is selected.
Returns
Nothing.
dom.source.outdentTextview()
Availability
Dreamweaver 4.
Description
Moves selected Code view text one tab stop to the left.
Arguments
None.
Returns
Nothing.
dom.source.pageDown()
Availability
Dreamweaver 4.
Description
Moves the insertion point down the Code view document, page by page. If content is already selected, this function extends the selection page by page.
Arguments
{nTimes}, {bShiftIsDown}
The nTimes argument, which is optional, is the number of pages that the insertion point must move. If nTimes is omitted, the default is 1.
The bShiftIsDown argument, which is optional, is a Boolean value that indicates whether content is being selected. If bShiftIsDown is true, the content is selected.
Returns
Nothing.
dom.source.pageUp()
Availability
Dreamweaver 4.
Description
Moves the insertion point up the Code view document, page by page. If content is already selected, this function extends the selection page by page.
Arguments
{nTimes}, {bShiftIsDown}
The nTimes argument, which is optional, is the number of pages that the insertion point must move. If nTimes is omitted, the default is 1.
The bShiftIsDown argument, which is optional, is a Boolean value that indicates whether content is being selected. If bShiftIsDown is true, the content is selected.
Returns
Nothing.
dom.source.previousWord()
Availability
Dreamweaver 4.
Description
Moves the insertion point to the beginning of the previous word (or words, if specified) in Code view. If content is already selected, this function extends the selection to the left.
Arguments
{nTimes}, {bShiftIsDown}
The nTimes argument, which is optional, is the number of words that the insertion point must move. If nTimes is omitted, the default is 1.
The bShiftIsDown argument, which is optional, is a Boolean value that indicates whether content is being selected. If bShiftIsDown is true, the content is selected.
Returns
Nothing.
dom.source.replaceRange()
Availability
Dreamweaver 4.
Description
Replaces the range of source text between startOffset and endOffset with string. If startOffset is greater than endOffset or if either offset is not a positive integer, it does nothing and returns false. If endOffset is greater than the number of characters in the file, it replaces the range between startOffset and the end of the file. If both startOffset and endOffset are greater than the number of characters in the file, it inserts the text at the end of the file.
Arguments
startOffset, endOffset, string
The startOffset argument is the offset that indicates the beginning of the block to replace.
The endOffset argument is the offset that indicates the end of the block to replace.
The string argument is the string to insert.
Returns
A Boolean value: true if successful; false otherwise.
dom.source.scrollEndFile()
Availability
Dreamweaver 4.
Description
Scrolls the Code view to the bottom of the document file without moving the insertion point.
Arguments
None.
Returns
Nothing.
dom.source.scrollLineDown()
Availability
Dreamweaver 4.
Description
Scrolls the Code view down line by line without moving the insertion point.
Arguments
nTimes
The nTimes argument is the number of lines to scroll. If nTimes is omitted, the default is 1.
Returns
Nothing.
dom.source.scrollLineUp()
Availability
Dreamweaver 4.
Description
Scrolls the Code view up line by line without moving the insertion point.
Arguments
nTimes
The nTimes argument is the number of lines to scroll. If nTimes is omitted, the default is 1.
Returns
Nothing.
dom.source.scrollPageDown()
Availability
Dreamweaver 4.
Description
Scrolls the Code view down page by page without moving the insertion point.
Arguments
nTimes
The nTimes argument is the number of pages to scroll. If nTimes is omitted, the default is 1.
Returns
Nothing.
dom.source.scrollPageUp()
Availability
Dreamweaver 4.
Description
Scrolls the Code view up page by page without moving the insertion point.
Arguments
nTimes
The nTimes argument is the number of pages to scroll. If nTimes is omitted, the default is 1.
Returns
Nothing.
dom.source.scrollTopFile()
Availability
Dreamweaver 4.
Description
Scrolls the Code view to the top of the document file without moving the insertion point.
Arguments
None.
Returns
Nothing.
dom.source.selectParentTag()
Availability
Dreamweaver 4.
Description
This function is a Code view extension that enables tag balancing. You can call dom.source.selectParentTag() to extend a currently highlighted selection or insertion point from the surrounding open tag to the closing tag. Subsequent calls extend the selection to additional surrounding tags until there are no more enclosing tags.
Arguments
None.
Returns
Nothing.
dom.source.setCurrentLine()
Availability
Dreamweaver 4.
Description
Puts the insertion point at the beginning of the specified line. If the lineNumber argument is not a positive integer, the function does nothing and returns false. It puts the insertion point at the beginning of the last line if lineNumber is larger than the number of lines in the source.
Arguments
lineNumber
The lineNumber argument is the line at the beginning of which the insertion point is placed.
Returns
A Boolean value: true if successful; false otherwise.
dom.source.startOfDocument()
Availability
Dreamweaver 4.
Description
Places the insertion point at the beginning of the Code view document. If content is already selected, this function extends the selection to the beginning of the document.
Arguments
bShiftIsDown
The bShiftIsDown argument is a Boolean value that indicates whether content is being selected. If bShiftIsDown is true, the content is selected.
Returns
Nothing.
dom.source.startOfLine()
Availability
Dreamweaver 4.
Description
Places the insertion point at the beginning of the current line. If content is already selected, this function extends the selection to the beginning of the current line.
Arguments
bShiftIsDown
The bShiftIsDown argument is a Boolean value that indicates whether content is being selected. If bShiftIsDown is true, the content is selected.
Returns
Nothing.
dom.source.topPage()
Availability
Dreamweaver 4.
Description
Moves the insertion point to the top of the current page or to the top of the previous page if the insertion point is already at the top of a page. If content is already selected, this function extends the selection page by page.
Arguments
{nTimes}, {bShiftIsDown}
The nTimes argument, which is optional, is the number of pages that the insertion point must move. If nTimes is omitted, the default is 1.
The bShiftIsDown argument, which is optional, is a Boolean value that indicates whether content is being selected. If bShiftIsDown is true, the content is selected.
Returns
Nothing.
dom.source.wrapSelection()
Availability
Dreamweaver 4.
Description
Inserts the text of startTag before the current selection and the text of endTag after the current selection. The function then selects the entire range between, and including, the inserted tags. If the current selection was an insertion point, then the function places the insertion point between the startTag and endTag. (startTag and endTag don’t have to be tags; they can be any arbitrary text.)
Arguments
startTag, endTag
The startTag argument is the text to insert at the beginning of the selection.
The endTag argument is the text to insert at the end of the selection.
Returns
Nothing.
dom.synchronizeDocument()
Availability
Dreamweaver 4.
Description
Synchronizes the Design and Code views.
Arguments
None.
Returns
Nothing.
