home *** CD-ROM | disk | FTP | other *** search
/ Maximum CD 1999 June / maximum-cd-1999-06.iso / Fireworks 2 / data1.cab / Program_Files / Settings / HTML_Code / Imagemap.htt < prev    next >
Encoding:
Text File  |  1999-03-01  |  10.4 KB  |  324 lines
  1. // Fireworks generic HTML & JavaScript for single images & imagemaps.
  2. // Version 2.0 24JAN99
  3.  
  4. // To export HTML without comments change the value of variable doComments to "false".
  5. var doComments=true;
  6.  
  7. // When doComments is set to "true" the WRITE_HTML_COMMENT and WRITE_JS_COMMENT functions
  8. // include HTML and JavaScript in the exported file.
  9. function WRITE_HTML_COMMENT(str) {
  10.     if (doComments) WRITE_HTML("<!--"+str+"-->\n");
  11. }
  12.  
  13. function WRITE_JS_COMMENT(str) {
  14.     if (doComments) WRITE_HTML("/* "+str+" */\n");
  15. }
  16.  
  17. // Write general comments for copying and pasting Fireworks-generated code into existing HTML documents.
  18. WRITE_HTML_COMMENT("To put this html into an existing HTML document, you must copy the JavaScript and");
  19. WRITE_HTML_COMMENT("paste it in a specific location within the destination HTML document. You must then copy");
  20. WRITE_HTML_COMMENT("and paste code for the image with map in a different location.");
  21. WRITE_HTML("\n");
  22.  
  23.  
  24. WRITE_HTML("<html>\n");
  25. WRITE_HTML("\n");
  26.  
  27. WRITE_HTML("<head>\n");
  28. WRITE_HTML("\n");
  29.  
  30. // Use Base Name from export dialog as document title.
  31. WRITE_HTML("<title>", exportDoc.filename, "</title>\n");
  32. WRITE_HTML("\n");
  33.  
  34. // Write Meta tags.
  35. WRITE_HTML("<meta http-equiv=\"Content-Type\" content=\"text/html; charset=");
  36. var charSet = App.getPref("HtmlCharSet");
  37. if (charSet == "") charSet = "iso-8859-1";
  38. WRITE_HTML(charSet + "\">\n"); 
  39. WRITE_HTML("<meta name=\"description\" content=\"Fireworks Image Map\">\n");
  40. WRITE_HTML("\n");
  41.  
  42. // Write HTML target and date created.
  43. var d = new Date();
  44. WRITE_HTML("<!-- Fireworks 2.0  Generic target.  \n    Created ", d, " -->\n");
  45. WRITE_HTML("\n");
  46.  
  47. // Declare variables for processing Behaviors.
  48. var hasImagemap = false;
  49. var hasStatusMessages = false;
  50.  
  51. var kActionStatusMessage = 1;
  52. var kActionSwapImage = 2;
  53. var kActionRadioGroup = 3;
  54.  
  55. var kEventMouseOver = 0;
  56. var kEventOnClick = 1;
  57. var kEventMouseOut = 2;
  58.  
  59. // Write a client-side imagemap
  60. if (exportDoc.clientMap) { 
  61.     var i = 0;
  62.     while (i < imagemap.numberOfURLs) {
  63.         hasImagemap = true; // at least 1 url in the imagemap.
  64.         for (var j=0; j<imagemap[i].behaviors.numberOfBehaviors; j++) {
  65.             var curBehavior = imagemap[i].behaviors[j];
  66.             if (curBehavior.action == kActionStatusMessage) {
  67.                 hasStatusMessages = true;
  68.             }
  69.         }
  70.         i++;
  71.     }
  72.     if (exportDoc.hasBackgroundLink) {
  73.         hasImagemap = true;
  74.     }
  75. }
  76.  
  77. /* Note: In simple imagemaps using the template Imagemap.htt, the only available 
  78.    behavior is the status bar message. Otherwise, the Slices.htt template is used. */
  79. function ProcessBehavior(theCurBehaviors) {
  80.     var gotJavascript = false;
  81.     var overStat = false;
  82.     var hitStat = false;
  83.     var outStat = false;
  84.     var eraseStatOnRestore = false;
  85.     for (var i=0; i<theCurBehaviors.numberOfBehaviors; i++) {
  86.         var curBehavior = theCurBehaviors[i];
  87.         var curJavascript = "";
  88.         var gotStat = false;
  89.         if (curBehavior.action == kActionStatusMessage) {
  90.             gotJavascript = true;
  91.             gotStat = true;
  92.             var statMsg = curBehavior.statusText;
  93.             var restore = curBehavior.restoreOnMouseout;
  94.             curJavascript += "dmim('" + statMsg + "');";
  95.             if (restore) {
  96.                 eraseStatOnRestore =  true;
  97.             }
  98.         } else {
  99.             continue;
  100.         }
  101.         if (curBehavior.event == kEventMouseOver) {
  102.             javaOver += curJavascript;
  103.             if (gotStat) overStat = true;
  104.         }
  105.         if (curBehavior.event == kEventMouseOut) {
  106.             javaOut += curJavascript;
  107.             if (gotStat) outStat = true;
  108.         }
  109.         if (curBehavior.event == kEventOnClick) {
  110.             javaClick += curJavascript;
  111.             if (gotStat) hitStat = true;
  112.         }
  113.     }
  114.     if (eraseStatOnRestore) {
  115.         javaOut += "dmim('');" ;
  116.         outStat = true;
  117.     }
  118.     var ret = "return document.MM_returnValue";
  119.     if (overStat) javaOver += ret;
  120.     if (outStat) javaOut += ret;
  121.     if (hitStat) javaClick += ret;
  122.     return(gotJavascript);
  123. }
  124.  
  125.  
  126. // Write comment for start of JavaScript copy/paste section.
  127. if (hasStatusMessages) {
  128.     WRITE_HTML_COMMENT("-- Copy the JavaScript code including the opening and closing script tags, and paste"); 
  129.     WRITE_HTML_COMMENT("it into the head section of the destination document. If the destination document already"); 
  130.     WRITE_HTML_COMMENT("contains a script section, do not include the script tags when copying. --");
  131.     WRITE_HTML("\n");
  132.     WRITE_HTML_COMMENT("-------------------- BEGIN COPYING THE JAVASCRIPT SECTION HERE --------------------");
  133.     WRITE_HTML("\n");
  134.     
  135.     // Begin Script. Hide Script from non-javascript-enabled browsers.
  136.     WRITE_HTML("<script language=\"JavaScript\">\n");
  137.     WRITE_HTML("<!-- hide this script from non-javascript-enabled browsers\n");
  138.     WRITE_HTML("\n");
  139.     
  140.     // Write function for status bar message.                                                                               
  141.     WRITE_HTML("// Function that displays status bar messages.\n")
  142.     WRITE_HTML("\n");
  143.     WRITE_HTML("var showMsg = navigator.userAgent != \"Mozilla/4.0 (compatible; MSIE 4.0; Mac_PowerPC)\";\n")
  144.     WRITE_HTML("function dmim(msgStr) {\n")
  145.     WRITE_HTML("  document.MM_returnValue = false;\n")
  146.     WRITE_HTML("  if (showMsg) {\n") 
  147.     WRITE_HTML("     window.status = msgStr;\n")
  148.     WRITE_HTML("     document.MM_returnValue = true;\n")
  149.     WRITE_HTML("  }\n")
  150.     WRITE_HTML("}\n")
  151.     WRITE_HTML("\n");
  152.     
  153.     // Stop hiding script from non-javascript-enabled browsers. End script.
  154.     WRITE_HTML("// stop hiding -->\n");
  155.     WRITE_HTML("</script>\n");
  156.     WRITE_HTML("\n");
  157.     
  158.     // End JavaScript copy/paste section.
  159.     WRITE_HTML_COMMENT("-------------------------- STOP COPYING THE JAVASCRIPT HERE --------------------------");
  160.     WRITE_HTML("\n");
  161. }
  162.  
  163. // Close head tag.
  164. WRITE_HTML("</head>\n");
  165. WRITE_HTML("\n");
  166.  
  167. // Begin body tag. Set background color to Fireworks document canvas color.
  168. WRITE_HTML("<body bgcolor=\"#", exportDoc.backgroundColor, "\">\n");
  169. WRITE_HTML("\n");
  170.  
  171. // Write comment for start of image map copy/paste section.
  172. WRITE_HTML_COMMENT("-- Copy the image and map code, and paste the data where ")
  173. WRITE_HTML_COMMENT("you want the image to appear in the destination document. --")
  174. WRITE_HTML("\n");
  175. WRITE_HTML_COMMENT("-------------------------- BEGIN COPYING HERE --------------------------")
  176. WRITE_HTML("\n");
  177.  
  178. // If a server-side image map is being export, write comment on replacing file path.
  179. if (exportDoc.serverMap) {
  180.     WRITE_HTML("<!--   ----------------------------------- NOTE ----------------------------------   --->\n");
  181.     WRITE_HTML("<!--   Replace the text in the following HREF tag with the path to your map file's    -->\n");
  182.     WRITE_HTML("<!--   location on the server. The \"", exportDoc.pathBase, ".map\" file generated by Fireworks needs to be  -->\n");
  183.     WRITE_HTML("<!--   placed in a directory with a CGI Application capable of interpreting the Image -->\n");
  184.     WRITE_HTML("<!--   Map information. If you are unsure about this, contact your web site           -->\n");
  185.     WRITE_HTML("<!--   administrator.                                                                 -->\n");
  186.     WRITE_HTML("\n");
  187.     
  188.     // Generate link to image map file.
  189.     WRITE_HTML("<a href=\"path_to_map_file/", exportDoc.pathBase, ".map\">\n");
  190. }
  191.  
  192. // Write image tag.
  193. WRITE_HTML("<img src=\"", exportDoc.filename,"\" "); 
  194.  
  195. // Determine width and height of image.
  196. WRITE_HTML("width=\"", exportDoc.width, "\" height=\"", exportDoc.height, "\"");
  197.  
  198. // If document has hotspots name the image map.
  199. if (hasImagemap) {
  200.     WRITE_HTML(" usemap=\"#", exportDoc.imagename, "\"")
  201. }
  202.  
  203. // Declare and write alt text.
  204. var altText = exportDoc.altText;
  205.  
  206. if (altText!="") {
  207.     WRITE_HTML(" alt=\"", altText, "\"");
  208. }
  209.  
  210. // If a server-side image map has been requested write ismap tag.
  211. if (exportDoc.serverMap) {
  212.     WRITE_HTML(" ismap");
  213. }
  214.  
  215. WRITE_HTML(" border=\"0\" >\n");
  216.  
  217. if (exportDoc.serverMap) {
  218.     WRITE_HTML("</a>\n");
  219. }
  220. WRITE_HTML("\n");
  221.  
  222. // Write client-side image map.
  223. if (hasImagemap) {
  224.     WRITE_HTML("<map name=\"", exportDoc.imagename, "\">\n");
  225.  
  226.     var i = 0;
  227.     while (i < imagemap.numberOfURLs) {
  228.         var curImagemap = imagemap[i];
  229.         var behaviors = curImagemap.behaviors;
  230.         var javaOver = "";
  231.         var javaOut = "";
  232.         var javaClick = "";
  233.         var gotJavascript = ProcessBehavior(behaviors);
  234.  
  235.         // Write the area tag with shape definitions.
  236.         WRITE_HTML("<area shape=\"");
  237.         WRITE_HTML(curImagemap.shape); // Shapes are rect poly and circle
  238.         WRITE_HTML("\" coords=\"");
  239.         for (var j=0; j<curImagemap.numCoords; j++) {
  240.             if (j>0) WRITE_HTML(",");
  241.             // polygon has n coords.
  242.             // rect has 2 coords, topLeft, and botomRight.
  243.             // circle has one coord, center; plus radius.
  244.             WRITE_HTML(curImagemap.xCoord(j), ",", curImagemap.yCoord(j)); 
  245.         }
  246.         if (curImagemap.shape == "circle") {
  247.             // Write the radius for circle hotspots.
  248.             WRITE_HTML(", ", curImagemap.radius);
  249.         }
  250.         WRITE_HTML("\"");
  251.         var href = " href=\"#\"";
  252.         if (curImagemap.hasHref) {
  253.             href = " href=\"";
  254.             href += curImagemap.href;
  255.             href += "\"";
  256.             if (curImagemap.hasTargetText) {
  257.                 href += " target=\"";
  258.                 href += curImagemap.targetText;
  259.                 href += "\"";
  260.             }
  261.         }
  262.  
  263.         // Write status bar message commands.
  264.         if (javaOut != "") {
  265.             WRITE_HTML(" onMouseOut=\"", javaOut, "\" ");
  266.         }
  267.         if (javaOver != "") {
  268.             WRITE_HTML(" onMouseOver=\"", javaOver, "\" ");
  269.         }
  270.         if (javaClick != "") {
  271.             WRITE_HTML(" onClick=\"", javaClick, "\" ");
  272.         }
  273.         WRITE_HTML(href);
  274.         
  275.         // Write alt text for hotspot.
  276.         var altText = "";
  277.         if (curImagemap.hasAltText) {
  278.             altText = curImagemap.altText;
  279.         } else {
  280.             altText = exportDoc.altText;
  281.         }
  282.  
  283.         if (altText!="") {
  284.             WRITE_HTML(" title=\"", altText, "\"");
  285.             WRITE_HTML(" alt=\"", altText, "\"");
  286.         }
  287.  
  288.         WRITE_HTML(" >\n");
  289.         i++;
  290.     } 
  291.     
  292.     // Write the image's default URL here.
  293.     if (exportDoc.hasBackgroundLink && exportDoc.backgroundLink.href != "") {
  294.         var curImagemap = exportDoc.backgroundLink;
  295.         WRITE_HTML("<area shape=\"rectangle\" coords=\"0,0, ", exportDoc.width, ",", exportDoc.height, "\" ");
  296.         WRITE_HTML("href=\"", curImagemap.href, "\"");
  297.         if (curImagemap.hasTargetText) {
  298.             WRITE_HTML("\n  target=\"", curImagemap.targetText, "\"");
  299.         }
  300.         var altText = exportDoc.altText;
  301.         if (altText!="") {
  302.             WRITE_HTML(" title=\"", altText, "\"");
  303.             WRITE_HTML(" alt=\"", altText, "\"");
  304.         }
  305.         WRITE_HTML(">\n");
  306.     }    
  307.     WRITE_HTML("</map>\n")
  308.     WRITE_HTML("\n");
  309.     
  310.     WRITE_HTML_COMMENT("   Image Map created with Macromedia Fireworks 2.0   ")
  311. }
  312.  
  313. WRITE_HTML("\n");
  314.  
  315. // End map copy/paste section.
  316. WRITE_HTML_COMMENT("----------------------------- STOP COPYING HERE ----------------------------")
  317.  
  318. WRITE_HTML("\n");
  319. WRITE_HTML("</body>\n");
  320.  
  321. WRITE_HTML("\n");
  322. WRITE_HTML("</html>\n");
  323.  
  324.