/*
  allows sliding elements within a container element
*/
(function($){
  $.fn.chameleonShadowPopUp = function(options) {
    var defaults = {
      iSlideDurationInMS:1000,
      sEaseOutFunctionName: 'easeOutExpo'
    };
    var options = $.extend(defaults, options);
    return this.each(function() {
      var obj = $(this);
      var iBlockContentWidth = obj.innerWidth();
      var iBlockContentHeight = obj.innerHeight();
      var sLink = obj.attr('href');
      var sTargetObjectId = '';
      var iLinkIdLocation = sLink.indexOf('#');
      if (iLinkIdLocation != -1) {
        sTargetObjectId = sLink.substr(iLinkIdLocation);
        if (iLinkIdLocation > 0) {
          sLink = sLink.substr(0,iLinkIdLocation);
        } else sLink = '';

        var oTargetDiv = $(sTargetObjectId);

        oTargetDiv.css('display','none');

        // take the content of the target div and move it into our own structure
        var sMoreLinkHTML = '';
        if (sLink != '') {
          sMoreLinkHTML = ' <a href="'+sLink+'" class="detailLink" target="_blank">mehr</a>';
        }
        //var sHTMLBox = '<div class="boxShadow"><div class="boxShadowNE"></div><div class="boxShadowWN"></div><div class="boxShadowN"></div><div class="boxShadowW"><div class="boxShadowE"><div class="boxBody"><a class="buttonFlatAndNarrow closeBox" href="javascript:void();">X</a><div>'+oTargetDiv.html()+sMoreLinkHTML+'</div></div></div></div><div class="boxShadowES"></div><div class="boxShadowSW"></div><div class="boxShadowS"></div></div>';
        var sHTMLBox = '';
        sHTMLBox += '<table class="boxShadow">';
        sHTMLBox += '<tr><td class="NorthWest"></td><td class="North"></td><td class="NorthEast"></td></tr>';
        sHTMLBox += '<tr><td class="West"></td><td class="Content"><div class="boxBody"><a class="buttonFlatAndNarrow closeBox" href="javascript:void();">X</a><div>'+oTargetDiv.html()+sMoreLinkHTML+'</div></div></td><td class="East"></td></tr>';
        sHTMLBox += '<tr><td class="SouthWest"></td><td class="South"></td><td class="SouthEast"></td></tr>';
        sHTMLBox += '</table>';

        // now replace contents
        oTargetDiv.html(sHTMLBox);
        oTargetDiv.css('position','absolute');

        $('body').append(oTargetDiv);
        //oTargetDiv.empty();

        var oCloseButton = $('.closeBox', oTargetDiv);
        oCloseButton.click(function(e) {
          $(this).parent().parent().parent().parent().parent().parent().toggle();
          return false;
        });

        obj.click(function(e) {
          oTargetDiv.css('position','absolute').css('top',e.pageY+'px').css('left',e.pageX+'px');
          oTargetDiv.toggle();
          return false;
        });
      }
    });
  };


})(jQuery);