var DarkLayer = {
  
  init: function() {
    
    this.resizeLayer();
    
    var appearOptions = {
        delay: 4.0,
        from: 0.0,
        to: 0.15,
        duration: 3.0
        };
    
    new Effect.Parallel(
        [
          new Effect.Appear(
            "dark-layer-top",
            appearOptions
            ),
          new Effect.Appear(
            "dark-layer-left",
            appearOptions
            ),
          new Effect.Appear(
            "dark-layer-right",
            appearOptions
            ),
          ],
        {
          sync: true
          }
        );
    
    return;
    
  },
  
  resizeLayer: function() {
    
    var rightLayerWidth = document.viewport.getWidth() - 780;
    
    $("dark-layer-right").setStyle({ width: rightLayerWidth + "px" });
    
    var contentHeight = $("header").getHeight() + $("main").getHeight();
    var viewportHeight = document.viewport.getHeight();
    
    if (contentHeight > viewportHeight)
      var layerHeight = contentHeight;
    else
      var layerHeight = viewportHeight;
    
    layerHeight -= 215;
    
    $("dark-layer-left").setStyle({ height: layerHeight + "px" });
    $("dark-layer-right").setStyle({ height: layerHeight + "px" });
    
    return;
    
  },
  
  increaseFontSize: function() {
    
    $("content-inner").setStyle({ fontSize: "120%" });
    
  },
  
  normalizeFontSize: function() {
    
    $("content-inner").setStyle({ fontSize: "100%" });
    
  },
  
  hideLayer: function() {
    
    var fadeOptions = {
        from: 0.15,
        to: 0.0,
        duration: 0.3
        };
    
    new Effect.Parallel(
        [
          new Effect.Fade(
            "dark-layer-top",
            fadeOptions
            ),
          new Effect.Fade(
            "dark-layer-left",
            fadeOptions
            ),
          new Effect.Fade(
            "dark-layer-right",
            fadeOptions
            ),
          ],
        {
          sync: true
          }
        );
    
    return;
    
  }
  
};

document.observe("dom:loaded", function() {
  
  DarkLayer.init();
  
});

Event.observe(window, 'resize', function() {
  
  DarkLayer.resizeLayer();
  
});