home *** CD-ROM | disk | FTP | other *** search
/ Practical Internet Web Designer 86 / PIWD86.iso / pc / contents / dreamweaver / software / dwmx2004.exe / Disk1 / data1.cab / Configuration_En / Commands / TemplateParams.js < prev    next >
Encoding:
JavaScript  |  2003-09-05  |  15.6 KB  |  598 lines
  1. //  Copyright 2001, 2002, 2003 Macromedia, Inc. All rights reserved.
  2.  
  3. //form fields:
  4. //Background - multiple list listing background colors
  5. //Text - multiple list listing text colors. Contents change when new Background item picked.
  6.  
  7. // ******************* GLOBALS **********************
  8.  
  9. var helpDoc = MM.HELP_templateProperties;
  10.  
  11. //This is the data passed into the dialog, and this is used to return data as well. If declared in C, this 
  12. //object would look something like this: 
  13. //struct { 
  14. //        values;                         //Set of all the template parameters that can be changed 
  15. //                                        //in this dialog. This is an object where the attributes
  16. //                                        //are the names of the params, and the values 
  17. //                                        //are the param values.
  18. //        types;                            //The types for all the params in the dialog. This is an
  19. //                                        //object, the attributes are the template attributes, and 
  20. //                                        //the values are either "boolean", "number", "color" , "text", "URL"
  21. //                                        // NOTE: 'CHOICES' IS NOT CURRENTLY SUPPORTED
  22. //        passthrough;                    //object containing a boolean for each attribute, whether it is passthrough or not.
  23. //        returnValue;                    //passed in as -1, set to 1 for success, 0 for cancel. 
  24. //        };
  25.  
  26. var dialogData = null;
  27. var isFake = false; //Used for debugging 
  28.  
  29. var PLATFORM = navigator.platform;
  30.  
  31. //I cache the DOM objects for the layers, so I don't have to search for them all the time. 
  32. var boolControlLayer = null; 
  33. var numberControlLayer = null; 
  34. var colorControlLayer = null; 
  35. var textControlLayer = null; 
  36. var linkControlLayer = null; 
  37. var noControlLayer = null; 
  38. var passthroughSpan = null; 
  39. var passthroughSpanHTML = null; 
  40.  
  41.  
  42. var targetLayer = null; 
  43.  
  44. //This is the currently visible control layer. 
  45. var curVisibleLayer = null;
  46.  
  47. var errorPending = false; 
  48.  
  49.  
  50. // ******************* API **********************
  51.  
  52. //--------------------------------------------------------------------
  53. // FUNCTION:
  54. //   commandButtons
  55. //
  56. // DESCRIPTION:
  57. //   The list of buttons to display on the right of the dialog,
  58. //   along with the functions to call when they are pressed.
  59. //
  60. // ARGUMENTS:
  61. //   none
  62. //
  63. // RETURNS:
  64. //   javascript array
  65. //--------------------------------------------------------------------
  66.  
  67. function commandButtons()
  68. {
  69.   if (dw.appName == "Contribute")
  70.   {
  71.     return new Array( "PutButtonsOnBottom",
  72.                       "OkButton",        MM.BTN_OK,     "cmdOK()",
  73.                       "CancelButton",    MM.BTN_Cancel, "cmdCancel()",
  74.                       "ApplyButton",     MM.BTN_Apply,  "cmdApply()",
  75.                       "PutButtonOnLeft", MM.BTN_Help,   "displayHelp()" );
  76.   }
  77.   else
  78.   {
  79.     return new Array( MM.BTN_OK,     "cmdOK()",
  80.                       MM.BTN_Cancel, "cmdCancel()",
  81.                       MM.BTN_Help,   "displayHelp()" );
  82.   }
  83. }
  84.  
  85.  
  86.  
  87. function isDomRequired() {return true;} 
  88.  
  89. //Just grab the first argument and stuff it into a global. 
  90. function receiveArguments()
  91.     {        
  92.         dialogData = dw.getDocumentDOM().getTemplateParameters();
  93.         if (dialogData == null)
  94.         {
  95.             alert(MSG_CantRun); 
  96.             return "abort";
  97.         }
  98.     }
  99.  
  100.  
  101. function canAcceptCommand()
  102.     {    
  103.         var curDOM = dw.getDocumentDOM();     
  104.         if (curDOM == null)
  105.             return false; 
  106.  
  107.         //dialogData = dw.getDocumentDOM().getTemplateParameters();
  108.         //if (dialogData == null)
  109.         //    return false;
  110.             
  111.         return (curDOM.getAttachedTemplate().length > 0);
  112.     } //canAcceptCommand
  113.     
  114. function cmdOK()
  115.     {
  116.     if (!isFake)
  117.         {
  118.         var curDOM = dw.getDocumentDOM();
  119.         curDOM.disableLocking();
  120.         if (!curDOM.setTemplateParameters(dialogData))
  121.             return; 
  122.         }
  123.         
  124.     if (errorPending)
  125.         return; 
  126.         
  127.     dialogData.returnValue = 1; 
  128.     window.close();
  129.     } //cmdOK
  130.  
  131. function cmdApply ()
  132.     {
  133.     if (!isFake)
  134.         {
  135.         var curDOM = dw.getDocumentDOM();
  136.         curDOM.disableLocking();
  137.         if (!curDOM.setTemplateParameters(dialogData))
  138.             return; 
  139.         }
  140.         
  141.     if (errorPending)
  142.         return; 
  143.         
  144.     dialogData.returnValue = 1; 
  145.  
  146. }
  147.  
  148. function cmdCancel()
  149.     {
  150.       dialogData.returnValue = 0; 
  151.       window.close();
  152.     } //cmdCancel
  153.  
  154.     
  155.  
  156. //***************** LOCAL FUNCTIONS  ******************
  157.     
  158. function initializeUI()
  159.     {
  160.     errorPending = false; 
  161.     if (dialogData == null)
  162.         {
  163.         window.close(); 
  164.         //alert(MSG_CantRun); 
  165.         return; 
  166.         }
  167.         
  168.     //Find the layer objects. 
  169.     boolControlLayer = findObject("booleanControls", null);     
  170.     numberControlLayer = findObject("numberControls", null); 
  171.     colorControlLayer = findObject("colorControls", null); 
  172.     textControlLayer = findObject("textControls", null); 
  173.     linkControlLayer = findObject("linkControls", null); 
  174.     noControlLayer = findObject("noControls", null); 
  175.  
  176.     passthroughSpan = findObject("passthroughSpan", null); 
  177.   
  178.   // find the table
  179.   var tableObj = findObject("mainTable");
  180.   if (dw.isOSX()){
  181.     tableObj.setAttribute("height","300");
  182.   }
  183.     
  184.     if (passthroughSpanHTML == null) 
  185.         passthroughSpanHTML = passthroughSpan.innerHTML; 
  186.     
  187.     targetLayer = findObject("visibleSpan", null);
  188.     curVisibleLayer = noControlLayer; 
  189.     
  190.       SetupTree();
  191.       SetupControls();
  192.   window.resizeToContents(); 
  193.       //FixControlLayers(null);
  194.     } //initializeUI
  195.  
  196.  
  197. function adjustButtons()
  198. {
  199.   var theStyle;
  200.   if (PLATFORM=="Win32")
  201.   {
  202.     theStyle=document.okLayer.getAttribute("STYLE");
  203.     theStyle=theStyle.replace(/left:\w*;/,LEFT_LAYER).replace(/top:\w*;/,TOP_LAYER);
  204.     document.okLayer.setAttribute("STYLE", theStyle);
  205.     theStyle=document.cancelLayer.getAttribute("STYLE");
  206.     theStyle=theStyle.replace(/left:\w*;/,RIGHT_LAYER).replace(/top:\w*;/,TOP_LAYER);
  207.     document.cancelLayer.setAttribute("STYLE", theStyle);
  208.   }
  209. }
  210.  
  211. //Add the 'categories' tag to the string stream
  212. function AddCategoriesToTreeStream(theStream)
  213.     {
  214.     theStream.push("<mm:treecolumn name='", LABEL_NameCol, "' value='", LABEL_NameCol, "'  width='200'/>"); 
  215.     theStream.push("<mm:treecolumn name='", LABEL_ValueCol, "' value='", LABEL_ValueCol, "' width='130'/>"); 
  216.     } //AddCategoriesToTreeString
  217.     
  218.     
  219. //Add the treenode for this category to the innerHTML string for the tree node
  220. function OpenCatNode(labelString, theStream)
  221.     {
  222.     theStream.push("<mm:treenode selected value = '",labelString,"' id=-1 state='expanded'>");
  223.     } //AddCatNodeToString
  224.     
  225. function CloseCatNode(theStream)
  226.     {
  227.     theStream.push("</mm:treenode>");
  228.     }
  229.  
  230. function GetVisibleValueString(paramName)
  231.     {
  232.     if (dialogData == null)
  233.         return "";
  234.  
  235.     if (dw.appName != "Contribute")
  236.         {
  237.         if (dialogData.passthrough[paramName])
  238.             return LABEL_Passthrough;
  239.         }
  240.         
  241.     if (dialogData.types[paramName] == "boolean")
  242.         {
  243.         var paramValue = dialogData.values[paramName]; 
  244.         return (paramValue == "true") ? LABEL_TRUE : LABEL_FALSE; 
  245.         }
  246.         
  247.     return dialogData.values[paramName];
  248.     } //GetVisibleValueString
  249.     
  250.     
  251. //Add the string for a single node in the tree. Should look something like: 
  252. //<mm:treenode  value = "Conditional 1|<Not Resolved>" paramName="some name" valueType="number" ></mm:treenode> 
  253. function AddParamNode(paramName, theStream, selected)
  254.     {    
  255.     //var selectedString = selected ? "selected" : ""; 
  256.     var selectedString = ""; 
  257.     
  258.     theStream.push("<mm:treenode  value = '", paramName,  "|", GetVisibleValueString(paramName),  
  259.                       "' paramName='", paramName, "' valueType='", dialogData.types[paramName], "' ", selectedString , " ></mm:treenode>"); 
  260.     } //AddParamNode
  261.     
  262.     
  263. //Build and insert the inner HTML for the tree control
  264. function SetupTree()
  265.     {    
  266.     var theStream = new Array();
  267.     theStream.push("");
  268.      
  269.     AddCategoriesToTreeStream(theStream);
  270.     
  271.     var i; 
  272.     var count = 0; 
  273.     
  274.     //Sort the list of params alphabetically. 
  275.     var paramNames = new Array(); 
  276.     for (i in dialogData.values)
  277.         paramNames.push(i); 
  278.     paramNames.sort();
  279.     
  280.     //Add them to the tree
  281.     for (i=0; i<paramNames.length; i++)
  282.         {
  283.         AddParamNode(paramNames[i], theStream, count==0);    
  284.         count++;
  285.         }
  286.     
  287.     if (count == 0)
  288.         theStream.push("<mm:treenode  value = '" + LABEL_NoParams + " | '     paramName='bar' valueType='none' ></mm:treenode>");
  289.             
  290.     //var theTree = findObject("theTreeControl", null); 
  291.     var theTree = dwscripts.findDOMObject("theTreeControl", null); 
  292.     theTree.innerHTML = theStream.join(""); 
  293.       if (theTree.treeNodes.length > 0){
  294.         theTree.treeNodes[0].selected = true;
  295.       }
  296.     } //SetupTree
  297.     
  298.  
  299.     
  300. //Everything is off unless on
  301. function FixControlLayers(selectedTreeNode)
  302.     {        
  303.     if (selectedTreeNode == null || selectedTreeNode.valueType == 'none')
  304.         {                    
  305.         targetLayer.innerHTML = noControlLayer.innerHTML; 
  306.         curVisibleLayer = noControlLayer;     
  307.         passthroughSpan.innerHTML = ""; 
  308.         return;     
  309.         }
  310.     
  311.     // In Ringo, don't show the "pass through" checkbox, because it
  312.     // only makes sense when authoring nested templates.
  313.     if (dw.appName == "Contribute")
  314.         {
  315.         passthroughSpan.innerHTML = "";
  316.         }
  317.     else
  318.         {
  319.         passthroughSpan.innerHTML = passthroughSpanHTML;
  320.  
  321.         if (dialogData.passthrough[selectedTreeNode.paramName])
  322.             {
  323.             targetLayer.innerHTML = LABEL_Passthrough; 
  324.             document.theForm.passthroughCheck.checked = true; 
  325.             curVisibleLayer = noControlLayer;
  326.             return;      
  327.             }
  328.         
  329.         document.theForm.passthroughCheck.checked = false;
  330.         }
  331.  
  332.     var newActiveLayer = noControlLayer; 
  333.  
  334.     switch (selectedTreeNode.valueType)
  335.         {
  336.         case "boolean":
  337.             newActiveLayer = boolControlLayer;  break;
  338.         case "number":
  339.             newActiveLayer = numberControlLayer;  break;
  340.         case "color":
  341.             newActiveLayer = colorControlLayer; break;
  342.         case "text":
  343.             newActiveLayer = textControlLayer;  break;
  344.         case "link":
  345.         case "URL":
  346.             newActiveLayer = linkControlLayer; break;
  347.         }
  348.         
  349.     if (curVisibleLayer != newActiveLayer)
  350.         {
  351.         targetLayer.innerHTML = newActiveLayer.innerHTML; 
  352.         curVisibleLayer = newActiveLayer; 
  353.         }        
  354.     
  355.     //Customize the string for the selected value
  356.     var showString = selectedTreeNode.paramName; 
  357.     if (selectedTreeNode.valueType == "boolean")
  358.         showString = errMsg(LABEL_Show, selectedTreeNode.paramName);
  359.         
  360.     var labelSpan = findObject("propLabel", null); 
  361.     if (labelSpan != null)
  362.         labelSpan.innerHTML = showString; 
  363. } //FixControlLayers
  364.         
  365.  
  366. //Move the values currently stored in this parameter into the controls for it's type. 
  367. function MoveValuesToControl(selectedNode)
  368.     {
  369.     if (selectedNode == null || selectedNode.valueType == 'none')
  370.         return; 
  371.     
  372.     var attrName = selectedNode.paramName; 
  373.     if (dialogData.passthrough[attrName])
  374.         return; //No controls in this case 
  375.         
  376.     var controlName = ""; 
  377.     var controlObj = null;
  378.     switch (selectedNode.valueType)
  379.         {
  380.         case "boolean": controlName = "booleanCheck";     break;
  381.         case "number":     controlName = "numberField";     break; 
  382.         case "color":     controlName = "colorField";      break;
  383.         case "text":     controlName = "textField";          break;    
  384.         
  385.         case "link":     
  386.         case "URL":     
  387.             controlName = "linkField";      break;
  388.         }
  389.     
  390.     if (controlName == "")
  391.         return; 
  392.         
  393.     //Select the control...
  394.     var controlObj = findObject(controlName, null); 
  395.     
  396.     if (controlObj != null)
  397.         {
  398.         
  399.         //If this is a text control, move the focus into it. 
  400.         if (controlName == "booleanCheck")    
  401.             controlObj.checked = (dialogData.values[attrName] == "true");
  402.         else
  403.             {
  404.             controlObj.value = dialogData.values[attrName];
  405.             if (typeof controlObj["focus"] != "undefined")
  406.                   controlObj.focus(); //set focus on textbox
  407.                   
  408.             if (typeof controlObj["select"] != "undefined")
  409.                   controlObj.select(); //set insertion point into textbox
  410.             }
  411.             
  412.         if (selectedNode.valueType == "color")
  413.             {
  414.             controlObj = findObject("colorPicker", null); 
  415.             if (controlObj != null)
  416.                 controlObj.value = dialogData.values[attrName];
  417.             }
  418.         }
  419.  
  420.     } //MoveValuesToControl
  421.     
  422.         
  423.     
  424. // changes the 'resolve' popup to show the possibilities for the current node
  425. function SetupControls()
  426.     {
  427.     var theTree = findObject("theTreeControl", null); 
  428.     
  429.     var selectedTreeNode = theTree.selectedNodes[0];    
  430.     FixControlLayers(selectedTreeNode);
  431.     MoveValuesToControl(selectedTreeNode);
  432.     
  433.     if (selectedTreeNode)
  434.         selectedTreeNode.selected = true; //some bug in the tree control...
  435.     } //SetupControls
  436.  
  437.  
  438. //Once the user picks an entry from the list, store it back in the dialogData object
  439. function StoreNodeValue()
  440.     {
  441.     var selectedNode = findObject("theTreeControl", null).selectedNodes[0];
  442.     if (selectedNode == null)
  443.         return false; 
  444.         
  445.     var controlObj = null; 
  446.     var attrName = selectedNode.paramName; 
  447.     
  448.     switch (selectedNode.valueType)
  449.         {
  450.         case "boolean":
  451.             {
  452.             controlObj = findObject("booleanCheck", null);         
  453.             var isChecked = false; 
  454.             if (typeof    controlObj.checked == "string")
  455.                 isChecked = (controlObj.checked == "true"); 
  456.             else
  457.                 isChecked = controlObj.checked; 
  458.                 
  459.             if (controlObj != null)
  460.                 dialogData.values[attrName] = isChecked ? "true" :  "false";
  461.             break;
  462.             }
  463.             
  464.         case "number":
  465.             {
  466.             controlObj = findObject("numberField", null); 
  467.             if (controlObj != null)
  468.                 {
  469.                 var controlValue = controlObj.value; 
  470.                 if (isNaN(controlValue))
  471.                     {
  472.                     if (errorPending)
  473.                         return false;  
  474.  
  475.                     alert(MSG_isNAN);
  476.                     errorPending = true; 
  477.  
  478.                     return false; 
  479.                     }
  480.                 dialogData.values[attrName] = controlObj.value;
  481.                 }
  482.                 
  483.             break;
  484.             }
  485.  
  486.         case "color":
  487.             {
  488.             controlObj = findObject("colorField", null); 
  489.             if (controlObj != null)
  490.                 dialogData.values[attrName] = controlObj.value;
  491.             break;
  492.             }
  493.             
  494.         case "text":
  495.             {
  496.             controlObj = findObject("textField", null); 
  497.             if (controlObj != null)
  498.                 dialogData.values[attrName] = controlObj.value;
  499.             break;
  500.             }
  501.             
  502.         case "URL":
  503.         case "link":
  504.             {
  505.             controlObj = findObject("linkField", null); 
  506.             if (controlObj != null)
  507.                 dialogData.values[attrName] = controlObj.value;
  508.             break;
  509.             }
  510.         }
  511.         
  512.     errorPending = false;
  513.     if (dw.appName == "Contribute")
  514.         dialogData.passthrough[attrName] = false;
  515.     else
  516.         dialogData.passthrough[attrName] = document.theForm.passthroughCheck.checked;
  517.     
  518.     var newNodeString = attrName + "|" + GetVisibleValueString(attrName); 
  519.     selectedNode.value = newNodeString; 
  520.     return true; 
  521.     } //StoreNodeValue
  522.     
  523.     
  524.     
  525. //Called when one of the controls changes, this either resets the popup menu to reflect the current 
  526. //selected node, or stores the resolution in the tree and data store
  527. function updateUI(itemName)
  528.     {
  529.       switch(itemName)
  530.           {
  531.           case "theTreeControl":
  532.               {
  533.             SetupControls();
  534.  
  535.             break;
  536.               }
  537.               
  538.         case "colorField": 
  539.           case "colorPicker":
  540.               {              
  541.               //If the user types into the color field, move the data into the colorPicker field, 
  542.               //and then store the value. 
  543.             var fieldObj = findObject("colorField", null); 
  544.             var pickerObj = findObject("colorPicker", null); 
  545.             
  546.             if (fieldObj != null && pickerObj != null)
  547.                 {
  548.                 if (itemName == "colorField")
  549.                     pickerObj.value = fieldObj.value; 
  550.                 else
  551.                     {
  552.                     //alert("setting field to " + pickerObj.value);
  553.                     fieldObj.value = pickerObj.value; 
  554.                     }
  555.                 }
  556.                 
  557.             StoreNodeValue();
  558.             break; 
  559.               }
  560.           
  561.           case "boolCheck":
  562.           case "textField":
  563.           case "linkField": 
  564.           case "numberField": 
  565.               {
  566.               StoreNodeValue();
  567.             break;
  568.               }
  569.         
  570.         case "passthroughCheck": 
  571.             {
  572.             if (dw.appName != "Contribute")
  573.                 {
  574.                 var selectedNode = findObject("theTreeControl", null).selectedNodes[0];
  575.                 if (selectedNode == null)
  576.                     return; 
  577.                                 
  578.                 var attrName = selectedNode.paramName; 
  579.                 var isPassthrough = document.theForm.passthroughCheck.checked; 
  580.                 dialogData.passthrough[attrName] = isPassthrough;
  581.             
  582.                 var newNodeString = attrName + "|" + GetVisibleValueString(attrName); 
  583.                 selectedNode.value = newNodeString; 
  584.  
  585.                 FixControlLayers(selectedNode);
  586.                         
  587.                 //Pull the old values out.
  588.                 if (!isPassthrough)
  589.                     MoveValuesToControl(selectedNode);
  590.                 }
  591.             break; 
  592.             }
  593.                 
  594.           } //switch
  595.     } //updateUI
  596.  
  597.  
  598.