// FILE Shadow.js
// Contains the implementation of class Shadow. 
// This class is used to drop the shadow around html elements.

function Shadow(parentElement, shadowedElement, shadowElementPrefix)
{

   if (typeof (Shadow._initialized) == 'undefined')
   {
      Shadow.prototype.DropShadow = DropShadow;
      Shadow.prototype.PrepareShadowImagesForElement = PrepareShadowImagesForElement;
      Shadow.prototype.CreateShadowElement = CreateShadowElement;
   }
   Shadow._initialized = true;

   this.parentElement = parentElement;
   this.shadowedElement = shadowedElement;
   this.displayed = false;

   this.PrepareShadowImagesForElement(shadowElementPrefix)


   return;

   function PrepareShadowImagesForElement(shadowElementPrefix)
   {
      this.shadowCornerRightTop = this.CreateShadowElement(shadowElementPrefix, "ShadowCornerRightTop");
      this.shadowEdgeRight = this.CreateShadowElement(shadowElementPrefix, "ShadowEdgeRight");
      this.shadowCornerRightBottom = this.CreateShadowElement(shadowElementPrefix, "ShadowCornerRightBottom");
      this.shadowEdgeBottom = this.CreateShadowElement(shadowElementPrefix, "ShadowEdgeBottom");
      this.shadowCornerLeftBottom = this.CreateShadowElement(shadowElementPrefix, "ShadowCornerLeftBottom");
   }

   function CreateShadowElement(shadowElementPrefix, shadowName)
   {
      var imageElement = document.createElement("img");
      imageElement.setAttribute("id", shadowElementPrefix + "_" + shadowName);
      imageElement.setAttribute("src", "Images/Shadows/" + shadowName + ".png");
      imageElement.style["display"] = "none";
      imageElement.style["position"] = "absolute";
      imageElement.zIndex = 5;
      this.parentElement.appendChild(imageElement);

      return imageElement;
   }

   function DropShadow()
   {
      if (!this.displayed)
      {
         this.shadowCornerRightTop.style["display"] = "block";
         this.shadowEdgeRight.style["display"] = "block";
         this.shadowCornerRightBottom.style["display"] = "block";
         this.shadowEdgeBottom.style["display"] = "block";
         this.shadowCornerLeftBottom.style["display"] = "block";

         this.displayed = true;
      }

      var shadowedElementWidth = parseInt(this.shadowedElement.style["width"]);
      var shadowedElementHeight = parseInt(this.shadowedElement.style["height"]);

      var debugOffset = 0;

      var imageWidthInt = 26;
      var imageHeightInt = 26;

      var imageWidthPx = imageWidthInt.toString() + "px";
      var imageHeightPx = imageHeightInt.toString() + "px";

      var borderWidthCompensator = 2;     // Used to compensate for the width of the border of the shadowed element;
      // Where we have 
      var leftCornerPx = (0 - debugOffset).toString() + "px";
      var rightCornerPx = (shadowedElementWidth - (imageWidthInt / 2) + borderWidthCompensator + debugOffset).toString() + "px";
      var topCornerPx = (0 - debugOffset).toString() + "px";
      var bottomCornerPx = (shadowedElementHeight - (imageHeightInt / 2) + borderWidthCompensator + debugOffset).toString() + "px";
      var bottomEdgeWidthPx = (shadowedElementWidth - (imageWidthInt + imageWidthInt / 2) + borderWidthCompensator + (2 * debugOffset)).toString() + "px";
      var rightEdgeHeightPx = (shadowedElementHeight - (imageHeightInt + imageHeightInt / 2) + borderWidthCompensator + (2 * debugOffset)).toString() + "px";
      var topCoordinateOfRightEdgeImagePx = (imageHeightInt - debugOffset).toString() + "px";
      var leftCoordinateOfBottomEdgeImagePx = (imageWidthInt - debugOffset).toString() + "px";


      this.shadowCornerRightTop.style["left"] = rightCornerPx;
      this.shadowCornerRightTop.style["top"] = topCornerPx;
      this.shadowCornerRightTop.style["width"] = imageWidthPx;
      this.shadowCornerRightTop.style["height"] = imageHeightPx;

      this.shadowEdgeRight.style["left"] = rightCornerPx;
      this.shadowEdgeRight.style["top"] = topCoordinateOfRightEdgeImagePx;
      this.shadowEdgeRight.style["width"] = imageWidthPx;
      this.shadowEdgeRight.style["height"] = rightEdgeHeightPx;

      this.shadowCornerRightBottom.style["left"] = rightCornerPx;
      this.shadowCornerRightBottom.style["top"] = bottomCornerPx;
      this.shadowCornerRightBottom.style["width"] = imageWidthPx;
      this.shadowCornerRightBottom.style["height"] = imageHeightPx;

      this.shadowEdgeBottom.style["left"] = leftCoordinateOfBottomEdgeImagePx;
      this.shadowEdgeBottom.style["top"] = bottomCornerPx;
      this.shadowEdgeBottom.style["width"] = bottomEdgeWidthPx;
      this.shadowEdgeBottom.style["height"] = imageHeightPx;

      this.shadowCornerLeftBottom.style["left"] = leftCornerPx;
      this.shadowCornerLeftBottom.style["top"] = bottomCornerPx;
      this.shadowCornerLeftBottom.style["width"] = imageWidthPx;
      this.shadowCornerLeftBottom.style["height"] = imageHeightPx;

   }

}