home *** CD-ROM | disk | FTP | other *** search
/ Chip 2002 January / 01_02.iso / software / netscape62win / browser.xpi / bin / chrome / comm.jar / content / editor / EdImageMap.js < prev    next >
Encoding:
JavaScript  |  2001-06-28  |  11.6 KB  |  354 lines
  1. /*
  2.  * The contents of this file are subject to the Netscape Public
  3.  * License Version 1.1 (the "License"); you may not use this file
  4.  * except in compliance with the License. You may obtain a copy of
  5.  * the License at http://www.mozilla.org/NPL/
  6.  *
  7.  * Software distributed under the License is distributed on an "AS
  8.  * IS" basis, WITHOUT WARRANTY OF ANY KIND, either express or
  9.  * implied. See the License for the specific language governing
  10.  * rights and limitations under the License.
  11.  *
  12.  * The Original Code is Mozilla Communicator client code, released
  13.  * March 31, 1998.
  14.  *
  15.  * The Initial Developer of the Original Code is Netscape
  16.  * Communications Corporation. Portions created by Netscape are
  17.  * Copyright (C) 1999-2000 Netscape Communications Corporation. All
  18.  * Rights Reserved.
  19.  *
  20.  * Contributor(s):
  21.  *   Dan Haddix (dan6992@hotmail.com)
  22.  *   Brian King (briano9@yahoo.com)
  23.  */
  24.  
  25. var tHide = false;
  26. var highCont = false;
  27. var imageElement = null;
  28. var mapName = '';
  29. var imageMap = null;
  30. var imageEl;
  31. var srcInputValue = null;
  32. var marquee = null;
  33. var frameDoc = null;
  34. var buttonArray = new Array();
  35.  
  36. function Startup(){
  37.   if (!InitEditorShell())
  38.     return;
  39.   doSetOKCancel(finishMap, null);
  40.   initDialog();
  41. }
  42.  
  43. function doHelpButton()
  44. {
  45.   openHelp("chrome://help/content/help.xul?imagemap_properties");
  46. }
  47.  
  48. function initDialog(){
  49.   //Get image element from parent
  50.   imageElement = window.arguments[0];
  51.   if (!imageElement) //If not an image close window
  52.   {
  53.     window.close();
  54.     return;
  55.   }
  56.  
  57.   //Get image map from parent
  58.   imageMap = window.arguments[1];
  59.   if (!imageMap) //If no image map close window
  60.     window.close();
  61.  
  62.   //find parent inputs
  63.   var srcInput = window.opener.document.getElementById("srcInput");
  64.   var widthInput = window.opener.document.getElementById("widthInput");
  65.   var heightInput = window.opener.document.getElementById("heightInput");
  66.  
  67.   //check for relative url
  68.   if (!((srcInput.value.indexOf("http://") != -1) || (srcInput.value.indexOf("file://") != -1))){
  69.     if (editorShell.editorDocument.location == "about:blank"){
  70.       alert(GetString("ImapRelative"));
  71.       window.close();
  72.       //TODO: add option to save document now
  73.     }
  74.     else{
  75.       var edDoc = new String(editorShell.editorDocument.location);
  76.       var imgDoc = new String(srcInput.value);
  77.       imgDoc = imgDoc.split("../");
  78.       var len = imgDoc.length;
  79.       for (var i=0; i<len; i++){
  80.         if (edDoc.length > (String(editorShell.editorDocument.location.protocol).length+2))
  81.           edDoc = edDoc.substring(0, edDoc.lastIndexOf("/"));
  82.       }
  83.       imgDoc = edDoc+"/"+imgDoc[imgDoc.length-1];
  84.       srcInputValue = imgDoc;
  85.     }
  86.   }
  87.   else{
  88.     srcInputValue = srcInput.value;
  89.   }
  90.  
  91.   //Set iframe pointer
  92.   frameDoc = window.frames[0].document;
  93.  
  94.   //Fill button array
  95.   buttonArray[0] = document.getElementById("pointerButton");
  96.   buttonArray[1] = document.getElementById("rectButton");
  97.   buttonArray[2] = document.getElementById("cirButton");
  98.   buttonArray[3] = document.getElementById("polyButton");
  99.  
  100.   //Create marquee
  101.   var marquee = frameDoc.createElement("div");
  102.   marquee.setAttribute("id", "marquee");
  103.   frameDoc.body.appendChild(marquee);
  104.  
  105.   //Create background div
  106.   var bgDiv = frameDoc.createElement("div");
  107.   if ( bgDiv ) {
  108.     bgDiv.setAttribute("id", "bgDiv");
  109.     frameDoc.body.appendChild(bgDiv);
  110.   }
  111.  
  112.   //Place Image
  113.   var newImg = frameDoc.createElement("img");
  114.   if ( newImg ) {
  115.     newImg.setAttribute("src", srcInputValue);
  116.     if (parseInt(widthInput.value) > 0)
  117.       newImg.setAttribute("width", widthInput.value);
  118.     if (parseInt(heightInput.value) > 0)
  119.       newImg.setAttribute("height", heightInput.value);
  120.     newImg.setAttribute("id", "mainImg");
  121.     imageEl = frameDoc.getElementById("bgDiv").appendChild(newImg);
  122.     imageEl.addEventListener("error", imgError, false);
  123.   }
  124.  
  125.   //Resize background DIV to fit image
  126.   fixBgDiv();
  127.  
  128.   //Recreate Image Map if it exists
  129.   recreateMap();
  130. }
  131.  
  132. function imgError(){
  133.   alert(GetString("ImapError")+" " + srcInputValue+"."+GetString("ImapCheck"));
  134. }
  135.  
  136. function fixBgDiv(){
  137.   imageEl = frameDoc.getElementById("mainImg");
  138.   if (imageEl.offsetWidth != 0){
  139.     frameDoc.getElementById("bgDiv").style.width = imageEl.offsetWidth;
  140.     frameDoc.getElementById("bgDiv").style.height = imageEl.offsetHeight;
  141.   }
  142.   else
  143.     setTimeout("fixBgDiv()", 100);
  144. }
  145.  
  146. function hideToolbar(){
  147.   // Check to see if toolbar is already hidden
  148.   if (tHide){
  149.     // If it is show it
  150.     document.getElementById("toolbar").setAttribute("collapsed", "false");
  151.     // Set the menu items text back to "Hide Toolbar"
  152.     document.getElementById("view_hidetoolbar").setAttribute("label", GetString("HideToolbar"));
  153.     tHide = false
  154.   }
  155.   else{
  156.     // If not hide it
  157.     document.getElementById("toolbar").setAttribute("collapsed", "true");
  158.     //Set the menu items text to "Show Toolbar"
  159.     document.getElementById("view_hidetoolbar").setAttribute("label", GetString("ShowToolbar"));
  160.     tHide = true;
  161.   }
  162. }
  163.  
  164. function highContrast(){
  165.   if (highCont == true){
  166.     frameDoc.getElementById("bgDiv").style.background = "url('chrome://editor/skin/images/Map_checker.gif')";
  167.     frameDoc.getElementById("bgDiv").style.backgroundColor = "white";
  168.     imageEl.style.setProperty("-moz-opacity", "1.0", true);
  169.     document.getElementById("Map:Contrast").setAttribute("checked", "false");
  170.     document.getElementById("Map:Contrast").setAttribute("toggled", "false");
  171.     highCont = false;
  172.   }
  173.   else{
  174.     frameDoc.getElementById("bgDiv").style.background = "url('')";
  175.     frameDoc.getElementById("bgDiv").style.backgroundColor = "#D2D2D2";
  176.     imageEl.style.setProperty("-moz-opacity", ".3", true);
  177.     document.getElementById("Map:Contrast").setAttribute("checked", "true");
  178.     document.getElementById("Map:Contrast").setAttribute("toggled", "true");
  179.     highCont = true;
  180.   }
  181. }
  182.  
  183. function recreateMap(){
  184.   var areaCollection = imageMap.childNodes;
  185.   var areaColLen = areaCollection.length;
  186.   for(var j=0; j<areaColLen; j++){
  187.       area = areaCollection[j];
  188.       shape = area.getAttribute("shape");
  189.       shape = shape.toLowerCase();
  190.       coords = area.getAttribute("coords");
  191.       href = area.getAttribute("href");
  192.       target = area.getAttribute("target");
  193.       alt = area.getAttribute("alt");
  194.       if (shape == "rect")
  195.         Rect(coords, href, target, alt, true);
  196.       else if (shape == "circle")
  197.         Circle(coords, href, target, alt, true);
  198.       else
  199.         Poly(coords, href, target, alt, true);
  200.     }
  201. }
  202.  
  203. function finishMap(){
  204.   if (!setMapName())
  205.     return false;
  206.   if (!deleteAreas())
  207.     return false;
  208.  
  209.   spots = frameDoc.getElementsByName("hotspot");
  210.   var len = spots.length;
  211.   if (len >= 1){
  212.     for(i=0; i<len; i++){
  213.       dump(i+"\n");
  214.       curSpot = spots[i];
  215.       if (curSpot.getAttribute("class") == "rect")
  216.         createRect(curSpot);
  217.       else if (curSpot.getAttribute("class") == "cir")
  218.         createCir(curSpot);
  219.       else
  220.         createPoly(curSpot);
  221.     }
  222.     //editorShell.editorDocument.body.appendChild(imageMap);
  223.     //returnValue = "test";
  224.     //window.arguments[0] = "test"; //editorShell.editorDocument.body.appendChild(imageMap); //editorShell.InsertElementAtSelection(imageMap, false);
  225.     //dump(window.arguments[0]+"\n");
  226.     dump("imageMap.childNodes.length = "+imageMap.childNodes.length+"\n");
  227.   }
  228.   return true;
  229. }
  230.  
  231. function setMapName(){
  232.   //imageMap = editorShell.CreateElementWithDefaults("map");
  233.   //dump(imageMap+"\n");
  234.   //imageMap = frameDoc.createElement("map");
  235.  
  236.   mapName = imageMap.getAttribute("name");
  237.   if (mapName == ""){
  238.     mapName = String(frameDoc.getElementById("mainImg").getAttribute("src"));
  239.   mapName = mapName.substring(mapName.lastIndexOf("/"), mapName.length);
  240.   mapName = mapName.substring(mapName.lastIndexOf("\\"), mapName.length);
  241.     mapName = mapName.substring(1, mapName.lastIndexOf("."));
  242.     if (mapName == ""){
  243.       // BUG causes substring to return nothing when
  244.       // parameters are 1 & 13 (i.e. string.substring(1, 13);)
  245.       mapName = "hack";
  246.   }
  247.   imageMap.setAttribute("name", mapName);
  248. }
  249.   return true;
  250. }
  251.  
  252. function createRect(which){
  253.   //newRect = editorShell.CreateElementWithDefaults("area");
  254.   newRect = frameDoc.createElement("area");
  255.   newRect.setAttribute("shape", "rect");
  256.   coords = parseInt(which.style.left)+","+parseInt(which.style.top)+","+(parseInt(which.style.left)+parseInt(which.style.width))+","+(parseInt(which.style.top)+parseInt(which.style.height));
  257.   newRect.setAttribute("coords", coords);
  258.   if (which.getAttribute("hsHref") != ""){
  259.     newRect.setAttribute("href", which.getAttribute("hsHref"));
  260.   }
  261.   else{
  262.     newRect.setAttribute("nohref", "");
  263.   }
  264.   if (which.getAttribute("hsTarget") != ""){
  265.   newRect.setAttribute("target", which.getAttribute("hsTarget"));
  266.   }
  267.   if (which.getAttribute("hsAlt") != ""){
  268.   newRect.setAttribute("alt", which.getAttribute("hsAlt"));
  269.   }
  270.   //newRect.removeAttribute("id");
  271.   imageMap.appendChild(newRect);
  272. }
  273.  
  274. function createCir(which){
  275.   //newCir = editorShell.CreateElementWithDefaults("area");
  276.   var newCir = frameDoc.createElement("area");
  277.   if ( !newCir )
  278.     return;
  279.  
  280.   newCir.setAttribute("shape", "circle");
  281.   radius = Math.floor(parseInt(which.style.width)/2);
  282.   coords = (parseInt(which.style.left)+radius)+","+(parseInt(which.style.top)+radius)+","+radius;
  283.   newCir.setAttribute("coords", coords);
  284.   if (which.getAttribute("hsHref") != "")
  285.     newCir.setAttribute("href", which.getAttribute("hsHref"));
  286.   else{
  287.     newCir.setAttribute("nohref", "");
  288.   }
  289.   if (which.getAttribute("hsTarget") != ""){
  290.     newCir.setAttribute("target", which.getAttribute("hsTarget"));
  291.   }
  292.   if (which.getAttribute("hsAlt") != ""){
  293.     newCir.setAttribute("alt", which.getAttribute("hsAlt"));
  294.   }
  295.   //newCir.removeAttribute("id");
  296.   imageMap.appendChild(newCir);
  297. }
  298.  
  299. function createPoly(which){
  300.   //newPoly = editorShell.CreateElementWithDefaults("area");
  301.   var newPoly = frameDoc.createElement("area");
  302.   if ( !newPoly )
  303.     return;
  304.  
  305.   newPoly.setAttribute("shape", "poly");
  306.   var coords = '';
  307.   var len = which.childNodes.length;
  308.   for(l=0; l<len; l++){
  309.     coords += (parseInt(which.style.left)+parseInt(which.childNodes[l].style.left))+","+(parseInt(which.style.top)+parseInt(which.childNodes[l].style.top))+",";
  310.   }
  311.   coords = coords.substring(0, (coords.length-1));
  312.   newPoly.setAttribute("coords", coords);
  313.   if (which.getAttribute("hsHref") != "")
  314.     newPoly.setAttribute("href", which.getAttribute("hsHref"));
  315.   else{
  316.     newPoly.setAttribute("nohref", "");
  317.   }
  318.   if (which.getAttribute("hsTarget") != ""){
  319.     newPoly.setAttribute("target", which.getAttribute("hsTarget"));
  320.   }
  321.   if (which.getAttribute("hsAlt") != ""){
  322.     newPoly.setAttribute("alt", which.getAttribute("hsAlt"));
  323.   }
  324.   //newPoly.removeAttribute("id");
  325.   imageMap.appendChild(newPoly);
  326. }
  327.  
  328. function hotSpotProps(which){
  329.   var currentRect = null;
  330.   var currentCir = null;
  331.   if (which == null)
  332.     return;
  333.   hotSpotWin = window.openDialog("chrome://editor/content/EdImageMapHotSpot.xul", "_blank", "chrome,close,titlebar,modal", which);
  334. }
  335.  
  336. function deleteAreas(){
  337.   dump("deleteAreas called\n");
  338.   area = imageMap.firstChild;
  339.   while (area != null){
  340.     dump(area+"\n");
  341.     imageMap.removeChild(area);
  342.     area = imageMap.firstChild;
  343.   }
  344.   return true;
  345. }
  346.  
  347. // This is contained in editor.js (should be in a common js file
  348. // I did not want to include the whole file so I copied the function here
  349. // It retrieves strings from editor string bundle
  350. function GetString(id)
  351. {
  352.   return editorShell.GetString(id);
  353. }
  354.