A dynamic menu example

This example implements the Dreamweaver Preview in Browser submenu that displays a list of available browsers. The example also opens the current file, or the selected files in the Site panel, in the user-specified browser. Implementing this dynamic menu consists of the following steps:

• Creating the dynamic menu items
  
  
• Writing the JavaScript code
  
  

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" >   <menuitem dynamic name="No Browsers Selected"      file="Menus/MM/PIB_Dynamic.htm" arguments="'No Browsers'"      />   <separator />   <menuitem name="_Edit Browser List..." enabled="true"     command="dw.editBrowserList()"  />   </menu> 

The first menuitem tag defines the default menu item No Browsers Selected, which appears on the submenu if you have not specified any browsers for the Preview in Browser item in Preferences. If you specified the Microsoft Internet Explorer browser, however, the submenu would look like the following figure:

The name attribute for the first menu item specifies the command file PIB_Dynamic.htm. This file contains the following line:

 <SCRIPT LANGUAGE="javascript" src="/books/4/533/1/html/2/PIB_Dynamic.js"></SCRIPT> 

The script tag includes the JavaScript code in the PIB_Dynamic.js file, which supplies the JavaScript code that interacts with the Preview in Browser submenu. This code could be saved directly in the PIB_Dynamic.htm file, but storing it in a separate file allows multiple commands to include the same code.

Writing the JavaScript code

Because the first menuitem tag contains the dynamic attribute, Dreamweaver calls the getdynamicContent() function in the PIB_Dynamic.js file, which is shown in the following example:

 function getDynamicContent(itemID) {   var browsers = null;   var PIB = null;   var i;   var j=0;   browsers = new Array();   PIB = dw.getBrowserList();   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; } 

The getdynamicContent() function calls the dw.getBrowserList() function to obtain an array of the browser names that have been specified in the Preview in Browser section of Dreamweaver Preferences. This array contains the name of each browser and the path to the executable file. Next, for each item in the array (i=0; i<PIB.length; i=i+2), the getdynamicContents() function moves the name of the browser (PIB[i]) into a second array called browsers (browsers[j] = new String(PIB[i]);). If the browser has been designated as the primary or secondary browser, the function appends the names of the keyboard shortcut keys that invoke them. Next it appends the string ";DWPopup_PIB_Default", the function prefixes the array item with the string Preview in. After it constructs an entry for each browser listed in Preferences, the getdynamicContent() function returns the array browsers to Dreamweaver. If no browsers have been selected in Preferences, the function returns the value null, and Dreamweaver displays No Browsers Selected in the menu.

canAcceptCommand()

Dreamweaver next calls the canAcceptCommand() function for each menuitem tag that references a command file with the file attribute. If the canAcceptCommand() function returns the value false, the menu item is dimmed. If the canAcceptCommand() function returns the value true, Dreamweaver enables the item on the menu. If the function returns TRue or is not defined, Dreamweaver calls the isCommandChecked() function to determine whether to display a check mark next to the menu item. If the isCommandChecked() function is not defined, no check mark appears.

 function canAcceptCommand() {   var PIB = dw.getBrowserList();   if (arguments[0] == 'primary' || arguments[0] == 'secondary')     return havePreviewTarget();   return havePreviewTarget() && (PIB.length > 0); } 

The canAcceptCommand() function in the PIB_Dynamic.js file again retrieves the browser list that was created in Preferences. Then it checks whether the first argument (arguments[0]) is primary or secondary. If so, it returns the value returned by the havePreviewTarget() function. If not, it tests the call to the havePreviewTarget() function and tests whether any browsers have been specified (PIB.length > 0). If both tests are true, the function returns the value true. If either or both of the tests are false, the function returns the value false.

havePreviewTarget()

The havePreviewTarget() function is a user-defined function that returns the value TRue if Dreamweaver has a valid target to display in the browser. A valid target is a document or a selected group of files in the site panel. The havePreviewTarget() function looks like the following example:

 function havePreviewTarget() {   var bHavePreviewTarget = false;   if (dw.getFocus(true) == 'site')   {     if (site.getFocus() == 'remote')     {       bHavePreviewTarget = site.getRemoteSelection().length > 0 &&                       site.canBrowseDocument();     }     else if (site.getFocus() != 'none')     {       var selFiles = site.getSelection();       if (selFiles.length > 0)       {         var i;         bHavePreviewTarget = true;         for (i = 0; i < selFiles.length; i++)         {           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;             else if (!DWfile.exists(selFile))               bHavePreviewTarget = false;             else if (DWfile.getAttributes(selFile).indexOf("D") != -1)               bHavePreviewTarget = false;           }           else           {             bHavePreviewTarget = true;           }         }       }     }   }   else if (dw.getFocus() == 'document' ||     dw.getFocus() == 'textView' || dw.getFocus("true") == 'html' )   {     var dom = dw.getDocumentDOM('document');     if (dom != null)     {       var parseMode = dom.getParseMode();       if (parseMode == 'html' || parseMode == 'xml')         bHavePreviewTarget = true;     }   }   return bHavePreviewTarget; } 

The havePreviewTarget() function sets the value bHavePreviewTarget to false as the 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 (if (dw.getFocus(true) == 'site')). If the site panel does not have focus, the second test checks to see if a document (dw.getFocus() == 'document'), Text view (dw.getFocus() == 'textView'), or the Code inspector (dw.getFocus("true") == 'html') has focus. If neither test is true, the function returns the value false.

If the site panel has focus, the function checks whether the view setting is Remote view. If it is, the function sets bHavePreviewTarget to true if there are remote files (site.getRemoteSelection().length > 0) and the files can be opened in a browser (site.canBrowseDocument()). If the view setting is not Remote view, and if the view is not None, the function gets a list of the selected files (var selFiles = site.getSelection();) in the form of file:/// URLs.

For each item in the selected list, the function tests for the presence of the character string "://". If it is not found, the code performs a series of tests on the list item. If the item is not in the form of a file:/// URL (if (selFile.indexOf(urlPrefix) == -1)), it sets the return value to false. If the remainder of the string following the file:/// prefix does not contain a slash (/) (if (strTemp.indexOf("/") == -1)), it sets the return value to false. If the file does not exist (else if (!DWfile.exists(selFile))), it sets the return value to false. Last, it checks to see if the specified file is a folder (else if (DWfile.getAttributes(selFile).indexOf("D") != -1)). If selfile is a folder, the function returns the value false. Otherwise, if the target is a file, the function sets bHavePreviewTarget to the value TRue.

If a document, Text view, or the Code inspector has input focus (else if (dw.getFocus() == 'document' || dw.getFocus() == 'textView' || dw.getFocus("true") == 'html' )), the function gets the DOM and checks to see if the document is an HTML or an XML document. If so, the function sets bHavePreviewTarget to true. Finally, the function returns the value stored in bHavePreviewTarget.

receiveArguments()

Dreamweaver calls the receiveArguments() function to let the command process any arguments that pass from the menu item. For the Preview in Browsers menu, the receiveArguments() function invokes the browser that the user selects. The receiveArguments() function looks like the following example:

 function receiveArguments() {   var whichBrowser = arguments[0];   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();       }       else if (whichBrowser == 'secondary')       {         theBrowser = dw.getSecondaryBrowser();       }       // Match the path with the name of the corresponding browser       // that appears in the menu.       browserList = dw.getBrowserList();       while(i < browserList.length)       {         if (browserList[i+1] == theBrowser)           theBrowser = browserList[i];         i+=2;       }     }     else       theBrowser = whichBrowser;     // Only launch the browser if we have a valid browser selected.     if (theBrowser != "file:///" && typeof(theBrowser) != "undefined" && theBrowser.length  > 0)     {       if (dw.getFocus(true) == 'site')       {         // Only get the first item of the selection because         // browseDocument() can't take an array.         //dw.browseDocument(site.getSelection()[0],theBrowser);         site.browseDocument(theBrowser);       }       else         dw.browseDocument(dw.getDocumentPath('document'),theBrowser);     }     else     {       // Otherwise, F12 or Ctrl+F12 was pressed, ask if the user wants       // to specify a primary or secondary browser now.       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 whichBrowser to the value that Dreamweaver passes, arguments[0]. Along with setting other default values, the function also sets result to a default value of false.

After variables are initialized, the receiveArguments() function calls the user-defined function havePreviewTarget() and tests the result. If the result of the test is true, the function checks to see if the user selected the primary or secondary browser. If so, the function sets the variable theBrowser to the path of the executable file that starts the browser (dw.getPrimaryBrowser() or dw.getSecondaryBrowser()). The function then performs a loop that examines the list of browsers returned by dw.getBrowsersList(). If the path to a browser in the list matches the path to the primary or secondary browser, the function sets the variable theBrowser to the matching value in browserList. This value contains the name of the browser and the path to the executable file that starts the browser. If havePreviewTarget() returns the value false, the function sets the variable theBrowser to the value of the variable whichBrowser.

Next, the receiveArguments() function tests the variable theBrowser to make sure that it does not begin with a path, that it is not "undefined", and that it has a length greater than 0. If all these conditions are true, and if the Site panel has focus, the receiveArguments() function calls the site.browseDocument() function to invoke the selected browser with the files selected in the Site panel. If the Site panel does not have focus, the receiveArguments() function calls the function dw.browseDocument() and passes it the path of the current document and the value of the variable theBrowser, which specifies the name of the browser with which to open the document.

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 dw.showPreferencesDialog() with the browsers argument to let the user specify a browser at that point.