$(document).ready(function()
{
  var self = this;

  $("a.zoom, a.show_zoom").fancybox();
  
  $('body').ajaxError(function(e, xhr, settings){
    if (xhr.status == "403") // Forbidden
    {
      var $window = popup_open(xhr.responseText);
        $window.find("input[type='submit']").click(function(event){
          postForm($window);
          return false;
        });
    }
      
  })

  $("span.user a, a.user, a.usertext").live("mouseover", function(event){
    var $target = $(this);
    var $span = $target.parent();
    var url = $target.attr( "href" );
    var id = $target.attr( "id" );
    var rel = $span.attr( "rel" );
    //var position = $target.position();

    
    if (rel) {
      this.timeoutID = window.setTimeout(function(){
         if(typeof self.userinfo == "object") {
            $(self.userinfo).remove();
            delete self.userinfo;
          }

         self.userinfo = $( "<div class='info user' style='position: absolute; display: none; top: 0px; left: -2px'></div>").appendTo($span);


         $(self.userinfo).load(rel, function(){
           var height = $(self.userinfo).outerHeight();
           $(self.userinfo).css('top', -(height+8)+"px");
           $(self.userinfo).fadeIn();
         });
      }, 500);
    }
  });


  $("span.user a, a.user, a.usertext").live("mouseout", function(event){

   if(typeof this.timeoutID == "number") {
      window.clearTimeout(this.timeoutID);
      delete this.timeoutID;
    }

    self.mouseoutID = window.setTimeout(function(){
      if(typeof self.userinfo == "object") {
        $(self.userinfo).remove();
        delete self.userinfo;
      }
    },0);
  });

  $("div.icon a").live("click", function(event){
    var $target = $(this);
    var url = $target.attr( "href" );
    var id = $target.attr( "id" );
    var value = id.slice(5);

    $("div.icon").find("img.user").removeClass('active');

    $target.blur();
    $target.find("img.user").addClass('active');

    $("div.icon").next().val(value);
  });

  $("#messages img.close").live("click", function(event){
    var $target = $(this);
    $target.parent().fadeOut();
  });

  $("#comment_list img.close").live("click", function(event){
    var $target = $(this);
    var url = $target.attr( "rel" );
    var title = $target.attr( "title" );

    if (confirm(title+'?'))
    {
      jQuery.getJSON(url, function(data){
        $target.parent().fadeOut();
      });
    }
    
  });

  $("#photodetail_content a.add_picture_link").live("click", function(event){
    var $target = $(this);
    var url = $target.attr( "rel" );
    var title = $target.attr( "title" );

    var $div = $('#photodetail_content div.image');
    $div.addClass("mark");
    $target.css("color", "#ffd800");

    $target.blur();

    
    jQuery.get(url, function(data){
      $('#user_links').prepend(data);
    });
    $div.removeClass("mark");
    $target.css("color", "inherit");
    

  });
  
  

  $("#photodetail_content a.add_picture_marker").live("click", function(event){
    var $target = $(this);
    var url = $target.attr( "rel" );
    var title = $target.attr( "title" );
    
    var $img = $('#photodetail_content div.image img');
    var $div = $('#photodetail_content div.image');

    $target.blur();
    
    if (!self.bind)
    {
      $img.css("cursor", "crosshair");
      $target.css("color", "#ffd800");
      $div.addClass("mark");

      var offset_img = $img.offset();
      var offset_a = $img.parent().offset()
      var diff_left = offset_img.left - offset_a.left;

      jQuery.post(url, function(data){
        jQuery.each(data, function(index, value){
          var $marker = addMarker($div, $img, Math.floor(value.x), Math.floor(value.y), Math.floor(diff_left), value.user_id);
          $marker.addClass('marked');
        });
      }, 'json');
      
      $img.bind({
        click: function(event) {
          $img.parent().blur();
          
          var dim_y = Math.round(event.pageY - offset_img.top);
          var dim_x = Math.round(event.pageX - offset_img.left);

          //alert('The mouse cursor is at (X:' + event.pageX + ', Y:' + event.pageY + ') - (Left:' + dim_x + ', Top:' + dim_y + ')');

          addMarkerList($div, $img, url, dim_x, dim_y, Math.floor(diff_left));

          return false;
        }
      });
      self.bind = true;
    } else {
      unbind();
    }

    function unbind()
    {
      $div.find('div').remove();
      $div.removeClass("mark");
      $img.css("cursor", "inherit");
      $target.css("color", "inherit");
      $img.unbind();
      self.bind = false;
    }

    function markUser($list){
      $list.find("button").cick(function(){
         alert("click");
      });
    }

    $div.find("img.close").live("click", function(event){
      unbind();
    });

  });

  function addMarkerList($div, $img, url, dim_x, dim_y, diff_left){

    $div.find('div:not(.marked)').remove();

    var $marker = addMarker($div, $img, dim_x, dim_y, diff_left, 0);

    var $list = $('<div class="list" style="display: none;"></div>');
    $div.append($list);

    var dim = calcPosition(dim_y, dim_x, $marker, $img);

    $list.css('top', dim.y - dim.h);
    $list.css('left', dim.x + dim.w + diff_left);

    $list.load(url, function(){
      $(this).find("button").click(function(){
         //
         var $button = $(this);
         var button_url = $button.attr( "rel" );
         var button_id = $button.attr( "id" );

         jQuery.post(button_url, {x:dim.x, y:dim.y}, function(data){
           $('#user_marker').prepend(data);
           $marker.addClass('marked');
           $marker.attr( "id", "marker_"+button_id);
           $list.fadeOut();
         });
      });

      $(this).fadeIn();
    });

  }

  function addMarker($div, $img, dim_x, dim_y, diff_left, user_id){

    var $marker = $('<div class="marker" style="display: none;" id="marker_item_'+user_id+'"></div>');
    $div.append($marker);

    var dim = calcPosition(dim_y, dim_x, $marker, $img);
    
    $marker.css('top', dim.y - dim.h);
    $marker.css('left', dim.x - dim.w + diff_left);
    $marker.fadeIn();

    return $marker;
  }

  function calcPosition(dim_y, dim_x, $marker, $img){
    var height = $img.innerHeight();
    var width = $img.innerWidth();

    var m_h = $marker.outerHeight() / 2;
    var m_w = $marker.outerWidth() / 2;

    if (dim_y - m_h < 0)
      dim_y = m_h;
    else if (dim_y + m_h > height)
      dim_y = height - m_h;

    if (dim_x - m_w < 0)
      dim_x = m_w;
    else if (dim_x + m_w > width)
      dim_x = width - m_w;

    return {x: dim_x, y: dim_y, h: m_h, w: m_w};
  }

  $("#user_marker span.user").live("mouseover", function(event){
    var $target = $(this);
    var id = $target.attr( "id" );
    var dim = id.split(",");
    
    var $img = $('#photodetail_content div.image img');
    var $div = $('#photodetail_content div.image');

    var offset_img = $img.offset();
    var offset_a = $img.parent().offset()
    var diff_left = offset_img.left - offset_a.left;
    
    var $marker = addMarker($div, $img, Math.floor(dim[0]), Math.floor(dim[1]), Math.floor(diff_left), 'show');
  });

  $("#user_marker span.user").live("mouseout", function(event){
    $div = $('#photodetail_content div.image');
    $div.find("#marker_item_show").remove();
  });

  $("#user_marker img.close, #user_links img.close").live("click", function(event){
    var $target = $(this);
    var url = $target.attr( "rel" );
    var title = $target.attr( "title" );
    $div = $('#photodetail_content div.image');

    if (confirm(title+'?'))
    {
      jQuery.getJSON(url, function(data){
        if (data && data.user_id){
          $div.find("#marker_item_"+data.user_id).remove();
        }
        $target.parent().remove();
      });
    }

  });

  $("#user_favorites img.close").live("click", function(event){
    var $target = $(this);
    var url = $target.attr( "rel" );
    var title = $target.attr( "title" );

    if (confirm(title+'?'))
    {
      jQuery.getJSON(url, function(data){
        $target.parent().remove();
      });
    }

  });

  // Like Button

  $("button.button_like_event").live("click", function(event){
      var $target = $(this);
      var url = $target.attr( "rel" );

      jQuery.get(url, function(data){
        $target.next().html(data);
        $target.fadeOut();
      });
      
      return false;

  });
  
  // Invite Friends // Report User + Picture // Send Link =>> Show Popup Form
  
  $("a.invite_friends, a.send_report, a.send_link").live("click", function(event){
    var $target = $(this);
    var url = $target.attr( "href" );
    
    jQuery.get(url, function(data){
      var $window = popup_open(data);
      $window.find("input[type='submit']").click(function(event){
        postForm($window);
        return false;
      });
    });
    
    return false;
    
  });
  
  
  // Download Image
  $("a.download_image").live("click", function(event){
    var $target = $(this);
    var url = $target.attr( "rel" );
    
    if (url)
    {
      jQuery.get(url, function(data){

      });

      return false;
    }
    
  });

  $("ul#login_nav li.profile div ul li.friends a, ul#login_nav li.profile div ul li.inbox a").live("click", function(event){
      var $target = $(this);
      var url = $target.attr( "href" );
      var title = $target.attr( "title" );

      $target.blur();

      $('ul#login_nav li.profile').find("#show_box").remove();

      if ($target.hasClass("active")){
        $("ul#login_nav li.profile div ul li.friends a, ul#login_nav li.profile div ul li.inbox a").removeClass("active");
      } else  {
        $("ul#login_nav li.profile div ul li.friends a, ul#login_nav li.profile div ul li.inbox a").removeClass("active");

        jQuery.getJSON(url, function(data){
          $target.addClass("active");
          $target.html(""+data.num_items);
          var $box = $("<div style='display: none' class='login_box' id='show_box'>"+data.content+"</div>");
          $('ul#login_nav li.profile').append($box);
          $box.fadeIn();
          $target.parent().removeClass("new");
        });
      }
      return false;
  });
  
  // Friend Add Button
  $("button.button_add_friend").live("click", function(event){
      var $target = $(this);
      var url = $target.attr( "rel" );
      var title = $target.attr( "title" );

      jQuery.getJSON(url, function(data){
        $target.fadeOut();
      });
      
      return false;
  });

  // Friend Request Button
  $("ul.list button.button_friend_accept").live("click", function(event){
      var $target = $(this);
      var url = $target.attr( "rel" );
      var title = $target.attr( "title" );

      jQuery.getJSON(url, function(data){
        
        $("ul#login_nav li.profile div ul li.friends a").html(""+data.num_requests);
        
        if (data.accepted){
          $target.parent().removeClass('unread');
          $target.parent().html(""+data.accepted);
        } else{
          $target.parent().fadeOut();
        }

        if (data.num_requests == 0)
          $("ul#login_nav li.profile div ul li.friends a, ul#login_nav li.profile div ul li.inbox a").removeClass("active");
          $('ul#login_nav li.profile').find("#show_box").remove();
      });

  });
  
  // Contest Request Button
  $("button.button_contest_request").live("click", function(event){
      var $target = $(this);
      var url = $target.attr( "rel" );
      var title = $target.attr( "title" );

      jQuery.get(url, function(data){
        if (data == "")
          $target.fadeOut();
        else
          $target.parent().html(data);
      });

  });

  $("ul.button_list li").live("mouseover", function(event){
    var $target = $(this);
    var url = $target.attr( "rel" );
    if (url)
      $(this).addClass('active');
  });

  $("ul.button_list li").live("mouseout", function(event){
    var $target = $(this);
    var url = $target.attr( "rel" );
    if (url)
      $(this).removeClass('active');
  });

  $("ul.button_list li").live("click", function(event){
    var $target = $(this);
    var url = $target.attr( "rel" );
    if (url)
    {
      $('ul#login_nav li.profile').find("#show_box").remove();
      $("ul#login_nav li.profile div ul li.friends a, ul#login_nav li.profile div ul li.inbox a").removeClass("active");
      jQuery.get(url, function(data){
        var $window = popup_open(data);
        $window.find("input[type='submit']").click(function(event){
          postForm($window);
          return false;
        });
      });
    }
  });

  $("button.button_new_message, button.button_suggest_friends").live("click", function(event){
      var $target = $(this);
      var url = $target.attr( "rel" );
      var title = $target.attr( "title" );

      jQuery.get(url, function(data){
        var $window = popup_open(data);
        $window.find("input[type='submit']").click(function(event){
          postForm($window);
          return false;
        });
      });

    return false;
  });
  
  $("ul.message_list p > a, a.button_new_message").live("click", function(event){
      var $target = $(this);
      var url = $target.attr( "href" );
      var title = $target.attr( "title" );

      jQuery.get(url, function(data){
        var $window = popup_open(data);
        $window.find("input[type='submit']").click(function(event){
          postForm($window);
          return false;
        });
      });

    return false;
  });
  
  // User select
  
  $("div.select_user a").live("click", function(event){
      var $target = $(this);
      var user_id = $target.attr( "rel" );
      var title = $target.attr( "title" );
      var $input = $target.parents("li").find("input");
      var value = $input.val();
      var values = new Array();
      
      if (value)
        values = value.split(",");
      
      if (jQuery.inArray(user_id, values) != "-1")
      {
        values.splice(values.indexOf(user_id), 1);
        $target.find("img").removeClass("active");
      }
      else
      {
        values.push(user_id);
        $target.find("img").addClass("active");
      }
        
      
      $input.val(values.join(","));
      
    return false;
  });

  // Form Show / Hide
  $("fieldset legend").live("click", function(event){
    var $target = $(this);
    
    $target.parent().find("form").toggle();
    
  });
  
  function popup_open(data, title){
    var $bg = $('<div id="popup_bg"></div>');
    var $window = $('<div id="popup_window" style="display: none;"><div class="content">'+data+'</div></div>');
    var $close = $('<div class="close"></div>');
    var $h5 = $('<h4>'+title+'</h4>');

    $('body').append($bg);
    $('body').append($window);
    $window.append($close);

    if (title)
      $window.prepend($h5);

    var height = $bg.innerHeight() / 2;
    var width = $bg.innerWidth() / 2;

    var m_h = $window.outerHeight() / 2;
    var m_w = $window.outerWidth() / 2;

    //alert("height "+height+" m_h "+m_h);

    $window.css("top", Math.floor(height - m_h));
    $window.css("left", Math.floor(width - m_w));

    $window.fadeIn();

    $("#popup_window div.close, #popup_window input.cancel").live("click", function(event){
        popup_close($window);
    });

    return $window;
  }

  $("div.status input").live({
    "focus": function(event){
      var $target = $(this);
      $target.addClass("active");
      self.status = $target.val();
      $target.val("");
    },
    "blur": function(event){
      var $target = $(this);
      $target.removeClass("active");
      $target.val(self.status);
    }
  });

  $("div.status form").live({
    "submit": function(event){
      var $target = $(this);
      var $input = $target.find("input");

      jQuery.post($target.attr('action'), $target.serialize(), function(data){
        self.status = $input.val();
        $input.blur();
        
        var $data = $(data);
        $data.css("display", "none");
        $('#tabbar_content div.feed ul').prepend($data);
        $data.delay(500).fadeIn(1000);
        
      });

      return false;
    }
  });

  $("div.post form").live({
    "submit": function(event){
      var $target = $(this);
      var $input = $target.find("input");

      jQuery.post($target.attr('action'), $target.serialize(), function(data){
        $input.blur();
        $input.val("");
        var $data = $(data);
        $data.css("display", "none");
        $('#tabbar_content div.feed ul').prepend($data);
        $data.delay(500).fadeIn(1000);
      });

      return false;
    }
  });

  $("#page_user_side form textarea").live({
    "focus": function(event){
      var $target = $(this);
      $target.addClass("active");
      $("#page_user_side form").find("button").show();
    },
    "blur": function(event){
      var $target = $(this);
      $target.removeClass("active");
      
    }
  });

  $("#page_user_side form ").live({

    "submit": function(event){
      var $target = $(this);
      var $input = $target.find("textarea");

      jQuery.post($target.attr('action'), $target.serialize(), function(data){
        $input.val(data);
        $input.blur();
        $("#page_user_side form").find("button").hide();
      });

      return false;
    }
  });

  $("a.feed_like").live("click", function(event){
    var $target = $(this);
    var $div = $target.parents("div.content").find("div.likes");
    var url = $target.attr( "href" );
    
    jQuery.getJSON(url, function(data){
      $target.html(data.link);
      $div.html(data.content);
    });
    
    return false;
  });
  
  $("a.feed_comment").live("click", function(event){
    var $target = $(this);
    var $div = $target.parents("div.content").find("div.comment");
    
    $div.show();
    $div.find("input").focus();
    
    return false;
  });
  
  $("div.feed ul li div > div.comment input").live("focus", function(event){
    var $target = $(this);
    var $img = $target.parents("div.comment").find("img");

    $target.addClass("focus");
    $target.val("");
    $img.fadeIn();
  });
  
  $("div.feed ul li div > div.comment input").live("blur", function(event){
    var $target = $(this);
    var $img = $target.parents("div.comment").find("img");

    $target.removeClass("focus");
    $target.val($target.attr( "title" ));
    $img.hide();
  });
  
  $("div.feed ul li div > div.comment form").live("submit", function(event){
    var $target = $(this);
    var $div = $target.parents("div.content").find("div.comments");
    var url = $target.attr( "action" );
    
    if ($target.find("input").val())
    {
      jQuery.getJSON(url, $target.serialize(), function(data){
        $div.html(data.content);
        $target.find("input").blur();
      });
    }
    
    return false;
  });
  
  $("div.feed ul li div > div.comments div.remove_icon").live("click", function(event){
    var $target = $(this);
    var $div = $target.parent();
    var url = $target.attr( "rel" );
    
    if (confirm($target.attr("title")))
    {
      jQuery.get(url, function(data){
        $div.fadeOut();
      });
      
      
    }
    
    return false;
  });

  $("#tabbar_navi a").live("click", function(event){
    var $target = $(this);
    var url = $target.attr( "href" );
    var $loader = $("<div class='loading'></div>");
    
    $target.blur();
    $("#tabbar_navi li").removeClass("active");
    $("#tabbar_content").html($loader);
    
    $target.parent().addClass("active");
    
    $("#tabbar_content").load(url);
    
    return false;
  });

  // Sidebar Delete Friend Link
  $("a.delete_friend").live("click", function(event){
    var $target = $(this);
    var url = $target.attr( "href" );

    $target.blur();
    
    jQuery.get(url, function(data){
      $target.parent().fadeOut();
    });

    return false;
  });

  $("form.search input").live({
    "focus": function(event){
      var $target = $(this);
      $target.addClass("active");
      self.search = $target.val();
      $target.val("");
    },
    "blur": function(event){
      var $target = $(this);
      var value = $target.val();
      $target.removeClass("active");

      if (value.length == 0)
        $target.val(self.search);
    }
  });

  $("form#user_search").live({
    "submit": function(event){
      var $target = $(this);
      var $input = $target.find("input[type=text]");
      var $dummy = $target.find("input[type=hidden]");

      if ($input.val() == $dummy.val() || $input.val().length < 2)
        return false;
    }
  });

   $("#tabbar a.expand, div.feed a.expand, fieldset a.expand, #tabbar a.album_photo").live("click", function(event){
      var $target = $(this);
      
      $target.fancybox();
      $target.triggerHandler('click');

      return false;
   });

   $("#page_user_content #tabbar .remove, #page_content #tabbar .remove, #page_content fieldset .remove").live("mouseover", function(event){
      $("#tabbar").find("div#tabbar_content > div.remove_icon").remove();
      $("fieldset").parent().find("div.remove_icon").remove();

      var $target = $(this);
      var url = $target.attr( "rel" );
      var title = $target.attr( "title" );
      var $close = $('<div class="remove_icon"></div>');
      
      var margin = $target.outerWidth() - $target.width();
      
      var position = $target.position();
      //alert("left: " + position.left + ", top: " + position.top );
      $target.offsetParent().append($close);
      $close.css("top", position.top + 5);
      $close.css("left", position.left + $target.outerWidth() - 20);

      //$target.append($close);
      $close.click(function(){
        if (confirm("Wirklich löschen?")){
          jQuery.get(url, function(data){
            $target.fadeOut(function(){
              $target.remove();
              $close.remove();
            });
          });
        }
      })
      
      event.stopPropagation();
   });


  $("div.expand_items a").live("click", function(event){
    var $target = $(this);
    var url = $target.attr( "href" );
    
    if ($target.parents("ul").length)
      var $box = $target.parents("ul");
    else
      var $box = $target.parents("div.box");

    var $div = $box.find("div.more_items");
    var $loader = $("<div class='loading'></div>");

    $div.css("background", "white");
    $div.css("padding", "2px");
    $div.html($loader);

    jQuery.get(url, function(data){
      $div.remove();
      $box.append(data);
    });

    return false;
  });
  
  $("#tabbar a.album").live("click", function(event){
    var $target = $(this);
    var url = $target.attr( "href" );
    var $box = $target.parents("#tabbar_content");
    var $loader = $("<div class='loading'></div>");

    $box.html($loader);

    jQuery.get(url, function(data){
      $box.html(data);
    });

    return false;
  });
  

  $(document).keyup(function(event) {
    var $box = $('#photodetail_content');

    if ($box.is("div"))
    {
      if (event.which == '37') {
        location.href = $box.find("a.prev").attr("href");
      }

      if (event.which == '39') {
        location.href = $box.find("a.next").attr("href");
      }

      if (event.which == '38') {
        location.href = $("a.up").attr("href");
      }
    }
  });
 
 
  //  Delete User Form
  $("form.form_delete").live({
    "submit": function(event){
      var $target = $(this);
      var $input = $target.find("input");

      if ($input.val() == "on")
      {
        return confirm($input.next().html())
      }

      return false;
    }
  });
  
  
  // Choose user album
  $("#form_choose_album select#album").live({
    "change": function(event){
      var $target = $(this);
      var $form = $target.parents("form");
      var url = $form.attr( "action" );
      var $box = $target.parents("fieldset");
    
      $box.fadeOut();
          
      jQuery.get(url, $form.serialize(), function(data){
        $box.html(data);
        $box.stop(false, true).show();
        init_photo_manager();
      });

      return false;
    }
  });
  
  // Edit user album
  $("#form_edit_album input[type='button']").live({
    "click": function(event){
      var $target = $(this);
      var $form = $target.parents("form");
      var url = $form.attr( "action" );
      var $box = $target.parents("fieldset");
      var status = true;
      var post_data = $form.serializeArray();
      
      if ($target.attr("name") == "delete")
        status = confirm($target.attr("title")+"?") 
        
      post_data.push({name:"method", value:$target.attr("name")});
      
      //console.log(post_data);
    
      if (status)
      {
        $box.fadeOut();
        
        jQuery.post(url, jQuery.param(post_data), function(data){
          $box.html(data);
          $box.stop(false, true).show();
          init_photo_manager();
        });
      }
      return false;
    }
  });
  
  
  // Edit User Photo
  $("#user_photo_manager a").live("click", function(event){
      var $target = $(this);
      var url = $target.attr( "rel" );
      var title = $target.attr( "title" );

      jQuery.get(url, function(data){
        var $window = popup_open(data);
        $window.find("input[type='submit']").click(function(event){
          postForm($window);
          return false;
        });
      });

    return false;
  });

  function postForm($window){
    jQuery.post($("#popup_window form").attr('action'), $("#popup_window form").serialize(), function(data){
       $window.find("div.content").html(data);

       if (data) {
         $window.find("input[type='submit']").click(function(event){
           postForm($window);
           event.stopPropagation();
           return false;
         })
       } else {
         popup_close($window);
       }

    });

    return false;
  }

  function popup_close($window){
    $window.fadeOut(function(){
      $("#popup_bg").hide();
      $("#popup_bg").remove();
      $window.remove();
    });
  }
});

function sendComment(url){

  //alert($("form#comment").serialize());

  jQuery.post(url, $("form#comment").serialize(), function(data){
    $("form#comment textarea").val("");

    $item = $("<div style='display: none'>"+data+"</div>");
    $('#comment_list').append($item);
    $item.delay(500).fadeIn();
  });

  return false;
}