$(window).load (function () {
  adjustContainerHeights ();}
);
$(document).ready(function(){

  // setup
  var sw=836 // site width
  var aw=50 // activities tab width
  var mw=50 // muuseum tab width
  var ww=$("#wrapper").width(); // wrapper/screen width
  var activitiesversion="activities_in.html";
  var muuseumversion="muuseum_in.html";
  var museumExpandedClass = "museum_expanded";
  var museumCollapsedClass = "museum_collapsed";
  var activitiesExpandedClass = "activities_expanded";
  var activitiesCollapsedClass = "activities_collapsed";
  var museumUrl = '/';
  var activitiesUrl = '/activities';
  var url = window.location.href.split ("/");
  if (url[3] == 'hrv' || url[3] == 'activities') {
    activitiesUrl = window.location;
  }
  else {
    museumUrl = window.location;
  }

  $('#museum h3').data('offsetTop', $('#museum h3').offset ().top).css ({position : 'absolute', left:'0px', top:'0px'}).before ('<span class="museum_placeholder"></span>');
  $('#activities h3').data('offsetTop', $('#activities h3').offset ().top).css ({position : 'absolute',left:'0px', top:'0px'}).before ('<span class="activities_placeholder"></span>');

  $(window).scroll (function () {
    //console.log ($('#museum h3').offset ().top);
    //console.log ($(window).scrollTop ());
    var diff = $(window).scrollTop () - $('#museum h3').data ('offsetTop') + 20;
      if ($('#museum h3').data ('offsetTop') < $(window).scrollTop ()) {
        $('#museum h3')
          .stop ()
          .animate (
            {top : diff + 'px'},
            200
          );
      }
      else {
        $('#museum h3')
          .stop ()
          .animate (
            {top : '0px'},
            200
          );
      }

    // ACC
    diff = $(window).scrollTop () - $('#activities h3').data ('offsetTop') + 20;
      if ($('#activities h3').data ('offsetTop') < $(window).scrollTop ()) {
        $('#activities h3')
          .stop ()
          .animate (
            {top : diff + 'px'},
            200
          );
      }
      else {
        $('#activities h3')
          .stop ()
          .animate (
            {top : '0px'},
            200
          );
      }

  });

  // ponasanje activities taba
  var activitiesIn = function () {
    //console.log ('activities IN');
    $("#activities h3").unbind ("click", activitiesIn);
    if($('#activities').hasClass (activitiesCollapsedClass)) {
      // Uvuci activities tab
      $('#activities').animate (
      {
        marginRight:-(aw)+"px"
      },
      400,
      "swing",
      // Izvuci prošireni activities tab i uvuci museum tab
      function () {
        $('#activities').css ({
          "width":sw+"px",
          "margin-right":-(sw)+"px"
        })
        .load (activitiesUrl + " #activities > *", function () {
        // Get new height
        if ($('a#moreBlogPosts').length == 1) {
          $('a#moreBlogPosts').click (function () {
            $('ul.news.hidden').slideDown (200);
            $('a#moreBlogPosts').remove ();
            return false;
          });
        }
        var height = 55;
        var noContent = false;
        if ($('#activities').hasClass ('no_content')) {
          $('#activities').removeClass ('no_content');
          noContent = true;
        }
        $('#activities > *:not(h3)').each (function () {height += $(this).outerHeight ();});
         if (noContent) {
          $('#activities').addClass ('no_content');
        }
        //console.log (height);
        $('#activities').animate (
        {
          marginRight:((ww/2)+(sw/2))-sw-53+"px",
          height:height + 'px'
        },
        600,
        "swing",
        function () {
          $('#activities')
          .removeAttr ('style')
          .removeClass (activitiesCollapsedClass)
          .addClass (activitiesExpandedClass);
        }
        );
        $('#museum').animate (
        {
          marginLeft:-(ww+sw/2)+"px"
        },
        600,
        "swing",
        // Izvuci smanjeni museum tab
        function () {
          $('#museum').css ({
            "width":mw+"px",
            "marginLeft":-(ww/2+mw)+"px"
          });
          $('#museum > *').css ({display: 'none'});
          $('#museum').load ("/ajax/museum-digest", function () {
            $('#museum')
              //.removeAttr ('style')
              .removeClass (museumExpandedClass)
              .addClass (museumCollapsedClass);
            $('#museum').css ({display:'none', height: '0px'});
            adjustContainerHeights ();
            $('#museum').css ({display:'block'});
            $('#museum').animate (
              {
                marginLeft:"0px"
              },
              400,
              "swing"
            );
          });

        });
      });
      });
    }
    $("#museum h3").click(museumIn);
    return false;
  }

  // ponasanje museum taba
  var museumIn = function () {
    //console.log ('museum IN');
    $("#museum h3").unbind ("click",museumIn);
    if($('#museum').hasClass (museumCollapsedClass)) {
      // Uvuci museum tab
      $('#museum').animate ({
        marginLeft:-mw+"px"
      },
      600,
      "swing",
      // izvuci museum tabi i sakrij activities tab
      function () {
        $('#museum').css ({
          "width":sw+"px",
          "margin-left":-sw+"px"
        });
        $('#museum').load (museumUrl + " #museum > *", function () {
        // Get new height
        var height = 0;
        var noContent = false;
        if ($('#museum').hasClass ('no_content')) {
          $('#museum').removeClass ('no_content');
          noContent = true;
        }
        $('#museum > *:not(h3)').each (function () {height += $(this).outerHeight ();});
        if (noContent) {
          $('#museum').addClass ('no_content');
        }
        $('#museum').animate (
        {
          marginLeft: (ww/2) - (sw/2) - 60 + "px",
          height: height + 'px'
        },
        400,
        "swing",
        function () {
          $('#museum')
          .removeAttr ('style')
          .removeClass (museumCollapsedClass)
          .addClass (museumExpandedClass);
        }
        );
        $('#activities').animate (
        {
          marginRight:-(ww/2+sw)+"px"
        },
        600,
        "swing",
        // izvuci activities tab
        function () {
          $('#activities').css({
            "width":aw+"px",
            "margin-right":-(ww+aw)+"px"
          });
          $('#activities').load("/ajax/activities-digest", function () {
            $('#activities')
              //.removeAttr ('style')
              .removeClass (activitiesExpandedClass)
              .addClass (activitiesCollapsedClass);
            $('#activities').css ({display:'none', height: '0px'});
            adjustContainerHeights ();
            $('#activities').css ({display:'block'});
            $('#activities').animate({
                marginRight:"0px"
              },400,"swing"
          );
            });
        });
      });
      });
    }
    $("#activities h3").click(activitiesIn);
    return false;
  }

  // korekcija s obzirom na sirinu ekrana
  if(ww>1270) {
    aw=249;
    mw=249;
    activitiesversion="activities_iw.html";
    muuseumversion="muuseum_iw.html";
    museumCollapsedClass = 'museum_collapsed2';
    activitiesCollapsedClass = 'activities_collapsed2';
    if($('#activities').hasClass('activities_collapsed')) {
      $('#activities')
        .addClass (activitiesCollapsedClass)
        .removeClass ('activities_collapsed');
    //$('#activities').load("ajax/"+activitiesversion);
    }
    if($('#museum').hasClass('museum_collapsed')) {
      $('#museum')
        .addClass (museumCollapsedClass)
        .removeClass ('museum_collapsed');
    //$('#museum').load("ajax/"+muuseumversion);
    }
  }
  else {
    $('#activities, #museum').addClass ('no_content');
    $('#activities_content').remove ();
  }
  adjustContainerHeights ();

  // inicijalno bindanje za klik
  if($('#activities').hasClass(activitiesCollapsedClass)) {
    $("#activities h3").click(activitiesIn);
  }
  if($('#museum').hasClass(museumCollapsedClass)) {
    $("#museum h3").click(museumIn);
  }


  $("#activities").click (function (eventObject) {
    //console.log ('activities click');
    if (eventObject.target.nodeName == 'H3') {
      //console.log ('act h3');
      activitiesIn ();
      return true;
    }
    if (eventObject.target.nodeName != 'A' && eventObject.target.nodeName != 'IMG'
      && ($('#activities').hasClass ('activities_collapsed') || $('#activities').hasClass ('activities_collapsed2'))) {
      $("#activities h3").click ();
      return false;
    }
    else {
      //console.log ('act else');
      return true;
    }
  });

  $("#museum").click (function (eventObject) {
    //console.log ('Museum click');
    if (eventObject.target.nodeName == 'H3') {
      //console.log ('mus h3');
      museumIn ();
      return true;
    }
    if (eventObject.target.nodeName != 'A' && eventObject.target.nodeName != 'IMG'
      && ($('#museum').hasClass ('museum_collapsed') || $('#museum').hasClass ('museum_collapsed2'))) {
      $("#museum h3").click ();
      return false;
    }
    else {
      //console.log ('mus else');
      return true;
    }
  });

  $('input#editImage').change (function () {
    if ($(this).attr ('checked')) {
      $('div#editImages').show ();
      setClickBehaviour();
      setTimeout("setCropTool();", 1000);
    }
    else {
      $('div#editImages').hide();
    }
  });

  setTimeout ('finalContainerHeightCheck()', 200);

});

function finalContainerHeightCheck () {
  var mHeight = $('#museum').outerHeight ();
  var aHeight = $('#activities').outerHeight ();
  if (mHeight != aHeight) {
    adjustContainerHeights ();
  }
}

function adjustContainerHeights () {
  //var height = $('div#wrapper').height ();
  var mHeight = $('#museum').outerHeight ();
  var aHeight = $('#activities').outerHeight ();
  //console.log ('Museum height: ' + mHeight);
  //console.log ('Activities height: ' + aHeight);
  if (mHeight >= aHeight) {
    $('div#activities').height (mHeight);
    if (!$('div#activities').hasClass ('activities_expanded')) {
      $('div#museum').css ({height : 'auto'});
    }

  }
  else {
    $('div#museum').height (aHeight);
    //$('div#activities').css ({height : 'auto'});
  }
}


// Addon

var mainPhotoSet = false;
var api;

var googleMap = {
  map : null,
  initialize : null,
  placeMarker : null,
  marker : null
};

googleMap.initialize = function (id) {
  var myLatlng = new google.maps.LatLng (45.814444, 15.978241);
  var myOptions = {
    zoom: 3,
    zoomControl: true,
    zoomControlOptions: {
      style: google.maps.ZoomControlStyle.LARGE
    },
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    draggableCursor : 'crosshair',
    draggingCursor : 'pointer'
  }
  googleMap.map = new google.maps.Map (document.getElementById (id), myOptions);

  google.maps.event.addListener (googleMap.map, 'click', function (event) {
    googleMap.placeMarker (event.latLng);
  });

  if ($('#latitude').val() != '' && $('#longitude').val() != '') {
    googleMap.marker = new google.maps.Marker ({
      position: new google.maps.LatLng ($('#latitude').val(), $('#longitude').val()),
      map: googleMap.map,
      draggable : true
    });
  }
}

// Map click
googleMap.placeMarker = function (location) {
  if (googleMap.marker != null) {
    googleMap.marker.setMap (null);
  }
  googleMap.marker = new google.maps.Marker ({
    position: location,
    map: googleMap.map,
    draggable : true
  });
  $('#latitude').val (location.lat());
  $('#longitude').val (location.lng());

  // Marker drag
  google.maps.event.addListener (googleMap.marker, 'drag', function (event) {
    $('#latitude').val (event.latLng.lat());
    $('#longitude').val (event.latLng.lng());
  });

//this.map.setCenter (location);
}

function readCookie(name) {
  var nameEQ = name + "=";
  var ca = document.cookie.split(';');
  for(var i=0;i < ca.length;i++) {
    var c = ca[i];
    while (c.charAt(0)==' ') c = c.substring(1,c.length);
    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
  }
  return null;
}

$(document).ready (function () {

  if ($('a.project_more').length == 1) {
    $('a.project_more').click (function () {
      $('#activities').css ({minHeight : $('#activities').height () + 'px', height : 'auto'});
      $('a.project_more')
        .unbind ('click')
        .removeAttr ('href')
        .css ({color : '#000'});
      $('div#project_more').slideDown (200, function () {
        $('div#project_more').removeClass ('hidden');
      });
      return false;
    });
  }

  if ($('a#moreProjectPosts').length == 1) {
    $('a#moreProjectPosts').click (function () {
      $('ul.news.hidden').slideDown (200);
      $('a#moreProjectPosts').remove ();
      return false;
    });
  }

  if ($('a#moreBlogPosts').length == 1) {
    $('a#moreBlogPosts').click (function () {
      $('ul.news.hidden').slideDown (200);
      $('a#moreBlogPosts').remove ();
      return false;
    });
  }

  if ($('.mainPhoto').length == 1) {
    mainPhotoSet = true;
  }

  if ($('#yesplease').length == 1) {
    $('#yesplease').click (function () {
      $('div.additional').css ({
        'display' : 'block'
      });
    });
  }

  if ($('#formMap').length == 1) {
    googleMap.initialize ('formMap');
  }

  if ($('img#cropImage').length == 1 && $('#editImages').length != 1) {
    setClickBehaviour ();
    setTimeout("setCropTool();", 1000);
  }

  if ($('#images').length == 1) {
    $('#images').uploadify ({
      'uploader'        : '/js/uploadify/uploadify.swf',
      'script'          : '/user/upload/uploadify',
      'scriptData'      : {
        'sess_id' : $('input#sessid').val()
      },
      'cancelImg'       : '/js/uploadify/cancel.png',
      'auto'            : true,
      'fileDataName'    : 'images[]',
      'fileExt'         : '*.jpg',
      'fileDesc'        : 'JPEG Image Files',
      'multi'           : true,
      'removeCompleted' : true,
      'onComplete'      : function (event, ID, fileObj, response, data) {
        pieceUploadOnComplete (event, ID, fileObj, response, data)
      },
      'onOpen'          : function (event, ID, fileObj) {
        pieceUploadOnOpen (event, ID, fileObj)
      }
    });
  }
});

function pieceUploadOnComplete (event, ID, fileObj, response, data) {
  $('#loader'+ID).remove ();
  // Handle error
  $('p.error').remove ();
  if (response == 'error') {
    var $errorMessage = $('<p class="error">An error occured while uploading the image, please make sure the image is JPEG/JPG and of minimal width (780px). </p>');
    $('#form_photos').before ($errorMessage);
  }
  else {
    if (!mainPhotoSet) {
      mainPhotoSet = true;
      $('p.form_label.hidden').removeClass ('hidden');
      $('#photo_crop').append (getUploadedPieceImageHTML(response, '', 'cropImage'));
      $('#form_photos').append ('<li class="selectPhoto mainPhoto"><span>Main photo</span>' + getUploadedPieceImageHTML (response, 'mainPhoto', '') + '<a href="#">Remove</a></li>');
      var img = $('img#cropImage')[0];
      var filename = $('#form_photos li.mainPhoto img').attr('src').split ('/');
      filename = filename[filename.length - 1];
      $('input#mainFilename').val (filename);
      // Bad?
      setTimeout("setCropTool();", 1000);
    }
    else {
      $('#form_photos').append ('<li class="selectPhoto"><span>&nbsp;</span>' + getUploadedPieceImageHTML (response, '', '') + '<a href="#">Remove</a></li>');
    }
    $('form').append ('<input type="hidden" name="filenames[]" value="' + response + '" />');
  }
  // Set click behaviour
  setClickBehaviour ();
}

function setClickBehaviour () {
  $('li.selectPhoto img').click (function () {imageClick (this)});
}

function imageClick (clickedItem) {
  if ($('#photo_crop img').length > 0) {
      $('li.mainPhoto span').text (' ');
      $('li.mainPhoto').removeClass ('mainPhoto');
      $(clickedItem)
      .addClass ('mainPhoto')
      .parent ('li').addClass ('mainPhoto');
      $('#photo_crop img').attr ('src', $(clickedItem).attr ('src'));
      $('li.mainPhoto span').text ('Main photo');
      var filename = $(clickedItem).attr('src').split ('/');
      filename = filename[filename.length - 1];
      $('input#mainFilename').val (filename);
      api.destroy();
      setCropTool (true);
    }
}

function pieceUploadOnOpen (event, ID, fileObj) {
  $('div#images' + ID).append ('<img id="loader'+ID+'" style="position: absolute; top: 10px; right: 10px;" src="/images/ajax-loader.gif">');
}

function getUploadedPieceImageHTML (filename, className, id) {
  return '<img id="'+id+'" src="/img/piece/original/'+ filename +'" class="'+ className +'" alt="" />';
}

function setCropTool (force) {
  if (force == undefined) {
    force = false;
  }
  if ($('#x1').val () == '' && !force) {
    api = $.Jcrop ('img#cropImage', {
      'aspectRatio' : 1,
      'minSize' : [193, 193],
      'setSelect' : [20, 20, 213, 213],
      'onChange': setCropCoordinates,
      'onSelect': setCropCoordinates
    });
  }
  else {
    api = $.Jcrop ('img#cropImage', {
      'aspectRatio' : 1,
      'minSize' : [193, 193],
      'setSelect' : [$('#x1').val (), $('#y1').val (), $('#x2').val (), $('#y2').val ()],
      'onChange': setCropCoordinates,
      'onSelect': setCropCoordinates
    });
  }
  $('#activities, #museum').css ({height : 'auto'});
  adjustContainerHeights ();
}

function setCropCoordinates (c) {
  $('#x1').val(c.x);
  $('#y1').val(c.y);
  $('#x2').val(c.x2);
  $('#y2').val(c.y2);
  $('#cropWidth').val(c.w);
  $('#cropHeight').val(c.h);
}


/* Show more */

$(document).ready (function () {

  var $showMoreUnsorted = $('a#showMoreUnsorted');
  if ($showMoreUnsorted.length == 1) {
    $showMoreUnsorted.click (function () {
      return clickFuncShowMore (this, 'collection', 'ul#unsortedPieces');
    });
  }

  var $showMoreUploads = $('a#showMoreUploads');
  if ($showMoreUploads.length == 1) {
    $showMoreUploads.click (function () {
      return clickFuncShowMore (this, 'uploaded', 'ul#otherUploadedPieces');
    });
  }

  var $showMoreCollections = $('a#showMoreCollections');
  if ($showMoreCollections.length == 1) {
    $showMoreCollections.click (function () {
      return clickFuncShowMore (this, '', 'ul#collections');
    });
  }

  var $showMoreFollowing = $('a#showMoreFollowing');
  if ($showMoreFollowing.length == 1) {
    $showMoreFollowing.click (function () {
      return clickFuncShowMore (this, '', 'ul#followingUsers');
    });
  }

  var $showMoreFollowed = $('a#showMoreFollowed');
  if ($showMoreFollowed.length == 1) {
    $showMoreFollowed.click (function () {
      return clickFuncShowMore (this, '', 'ul#followedUsers');
    });
  }

  var $showMoreLastMonth = $('a#showMoreLastMonth');
  if ($showMoreLastMonth.length == 1) {
    $showMoreLastMonth.click (function () {
      return clickFuncShowMore (this, '', 'ul#lastMonthPieces');
    });
  }

  var $showMoreMostLiked = $('a#showMoreMostLiked');
  if ($showMoreMostLiked.length == 1) {
    $showMoreMostLiked.click (function () {
      return clickFuncShowMore (this, '', 'ul#mostLikedPieces');
    });
  }

  var $showMoreMostCollected = $('a#showMoreMostCollected');
  if ($showMoreMostCollected.length == 1) {
    $showMoreMostCollected.click (function () {
      return clickFuncShowMore (this, '', 'ul#mostCollectedPieces');
    });
  }

  var $showMoreMostCommented = $('a#showMoreMostCommented');
  if ($showMoreMostCommented.length == 1) {
    $showMoreMostCommented.click (function () {
      return clickFuncShowMore (this, '', 'ul#mostCommentedPieces');
    });
  }

  var $showMoreCategory = $('a#showMoreCategory');
  if ($showMoreCategory.length == 1) {
    $showMoreCategory.click (function () {
      return clickFuncShowMore (this, '', 'ul#categoryPieces');
    });
  }

  var $showMoreLatestUploads= $('a#showMoreLatestUploads');
  if ($showMoreLatestUploads.length == 1) {
    $showMoreLatestUploads.click (function () {
      return clickFuncShowMore (this, '', 'ul#latestUploads');
    });
  }

  var $showMoreStream = $('a#showMoreStream');
  if ($showMoreStream.length == 1) {
    $showMoreStream.click (function () {
      return clickFuncShowMore (this, '', 'ul#stream');
    });
  }

  // Function definition
  function clickFuncShowMore (clickedObject, uri, listSelector) {
    var $this = $(clickedObject);
    if ($this.data ('start') == undefined
      || $this.data ('uri') == undefined
      || $this.data ('count') == undefined) {
      return false;
    }
    $this.unbind ('click');
    // Show loader icon
    $this.prepend ('<img id="showMoreUnsortedLoader" src="/images/ajax-loader-purple.gif">');
    $.ajax ({
      type: 'POST',
      url: '/ajax/show-more/' + $this.data ('uri') + '/' + uri,
      data: {
        'start' : $this.data ('start')
      },
      success: function (data, textStatus, XMLHttpRequest) {
        $(listSelector).append (data);
        $('img#showMoreUnsortedLoader').remove ();
        if ($(listSelector + ' li').length == $this.data ('count')) {
          $this.remove ();
        }
        else {
          $this.data ('start', $(listSelector + ' li').length);
          $this.click (function () {
            return clickFuncShowMore (clickedObject, uri, listSelector)
          });
        }
        setTimeout ('adjustContainerHeights ()', 200);
      },
      error: function (XMLHttpRequest, textStatus, exception) {
        $('img#showMoreUnsortedLoader').remove ();
      },
      dataType: 'html'
    });
    return false;
  }

});

/* Nivo slider */

$(window).load(function() {
  if ($('#pieceimage img').length > 1) {
    $('#pieceimage').nivoSlider({
      effect:'fade', //Specify sets like: 'fold,fade,sliceDown'
      slices:15,
      animSpeed:200, //Slide transition speed
      pauseTime:3000,
      startSlide:0, //Set starting Slide (0 index)
      directionNav:true, //Next & Prev
      directionNavHide:true, //Only show on hover
      controlNav:false, //1,2,3...
      controlNavThumbs:false, //Use thumbnails for Control Nav
      controlNavThumbsFromRel:false, //Use image rel for thumbs
      controlNavThumbsSearch: '.jpg', //Replace this with...
      controlNavThumbsReplace: '_thumb.jpg', //...this in thumb Image src
      keyboardNav:false, //Use left & right arrows
      pauseOnHover:true, //Stop animation while hovering
      manualAdvance:true, //Force manual transitions
      captionOpacity:0.8, //Universal caption opacity
      beforeChange: function(){},
      afterChange: function(){
        if ($('#activities #pieceimage').length == 1) {
          $('#activities').css ({height : 'auto'});
          adjustContainerHeights ();
        }
      },
      slideshowEnd: function(){}, //Triggers after all slides have been shown
      lastSlide: function(){}, //Triggers when last slide is shown
      afterLoad: function(){
        if ($('#activities #pieceimage').length == 1) {
          $('#activities').css ({height : 'auto'});
          adjustContainerHeights ();
        }
      } //Triggers when slider has loaded
    });

    $('.nivoSlider').live('click', function() {
      $('.nivo-nextNav', this).trigger('click');
    });

  }
  else if ($('#pieceimage img').length == 1) {
    //$('#pieceimage img').addClass ('singleImage');
    $('#activities').css ({height : 'auto'});
    adjustContainerHeights ();
  }

});

/* Private set editing */

$(document).ready (function () {

  // Image selecting
  $('div.imagecontrol').click (function () {
    var $this = $(this);
    var id = $this.attr ('id').split ('_');
    if ($this.hasClass ('imagecontrolmarked')) {
      $this.removeClass ('imagecontrolmarked');
      $('input#check_' + id[1]).val ('0');
    }
    else {
      $this.addClass ('imagecontrolmarked');
      $('input#check_' + id[1]).val ('1');
    }
    return false;
  });

  $('a#addPieces, a#removePieces').click (function () {
    $(this).parent ('form').submit ();
    return false;
  });

  // Edit set name
  $('a#editSet').click (editSetClick);

  function editSetClick () {
    if ($('input#setTitleInput').length == 1) {
      // Submit change
      $.ajax ({
        type: 'POST',
        url: '/ajax/edit/set/' + $('a#editSet').data ('uri'),
        data: {
          'title' : $('input#setTitleInput').val ()
        },
        success: function (data, textStatus, XMLHttpRequest) {
          $('a#editSet').data ('uri', data.uri);
          $('a#deleteSet').attr ('href', '/user/me/' + data.uri + '/delete');
          $('input#setTitleInput').remove ();
          $('span#setTitle').text (data.title);
          $('a#editSet').text ('Edit set name');
          $('a#editSet').click (editSetClick);
        },
        error: function (XMLHttpRequest, textStatus, exception) {
        // handle error
        },
        dataType: 'json'
      });
      $('a#editSet').unbind ('click');
    }
    else {
      // Show text input
      $('a#editSet').text ('Save set name');
      var currentTitle = $('span#setTitle').text ();
      $('span#setTitle')
      .text ('')
      .append ('<input name="title" id="setTitleInput" type="text" value="'+ currentTitle +'" />');
      $('input#setTitleInput').keypress(function(event) {
        if (event.which == '13') {
          $('a#editSet').click ();
        }
      });
    }
    return false;
  }


  /*
   * Add new set
   */
  var $addNewSetLink = $('a#addSet');
  if ($addNewSetLink.length == 1) {
    $addNewSetLink.click (function () {
      return addNewSetClick (this);
    });
  }

});

function addNewSetClick (target) {
  var $this = $(target);
  $this.unbind ('click');
  $this.text ('Save');
  var html = '<form id="addSetForm" class="rightCol" action="/user/me/add/set" method="post"><label>New set name</label><input type="text" name="title" /></form>';
  $this.after (html);
  $this.insertAfter ('form#addSetForm');
  $this.click (function () {
    return saveNewSetClick ('form#addSetForm')
  })
  return false;
}

function saveNewSetClick (formSelector) {
  $(formSelector).submit ();
  return false;
}

/* Add or remove current piece from set */

$(document).ready (function () {

  $('li a.setlink').click (function () {
    removeSetClick (this);
    return false;
  });

  $('a#addToSetLink').click (function () {
    addSetClick (this);
    return false;
  });

});

function removeSetClick (clickedElement) {
  var $this = $(clickedElement);
  $this.unbind ('click');
  var setUri = $this.data ('setUri');
  showLoader ($this[0], $this.data ('setUri'));
  $.ajax ({
    type: 'POST',
    url: '/ajax/set/remove-piece',
    data: {
      'pieceId' : $this.data ('pieceId'),
      'setUri' : $this.data ('setUri')
    },
    success: function (data, textStatus, XMLHttpRequest) {
      if (data.success == 1) {
        $('select#addSetList').append ('<option value="'+ $this.data ('setUri') +'">'+ $this.data ('setTitle') +'</option>');
        $('li#set_' + setUri).remove ();
        if ($('ul#piecesets li').length == 0) {
          $('p#piecesetsParagraph').text ('This piece is in your collection.');
          $('p#addSetListParagraph').text ('You can add it to your sets.');
        }
      }
      removeLoader ($this[0], $this.data ('setUri'));
    },
    error: function (XMLHttpRequest, textStatus, exception) {
    // handle error
    },
    dataType: 'json'
  });
}

function addSetClick (clickedElement) {
  var $this = $(clickedElement);
  $this.unbind ('click');
  var setUri = $('select#addSetList').val ();
  showLoader ($this[0], setUri);
  $.ajax ({
    type: 'POST',
    url: '/ajax/set/add-piece',
    data: {
      'pieceId' : $this.data ('pieceId'),
      'setUri' : setUri
    },
    success: function (data, textStatus, XMLHttpRequest) {
      if (data.success == 1) {
        $('select#addSetList option[value="'+ setUri +'"]').remove ();
        if ($('ul#piecesets').length == 0) {
          $('p#piecesetsParagraph').after ('<ul id="piecesets"></ul>');
        }
        $('ul#piecesets').append (
          '<li id="set_'+ setUri +'"><a href="'+ data.url +'">'+ data.title +'</a><a class="setlink" href="#" id="remove_'+ setUri +'">Remove from this set</a></li>'
          );

        $('a#remove_'+ setUri).data (
        {
          'pieceId' : $this.data ('pieceId'),
          'setUri' : setUri,
          'setTitle' : data.title
        }
        );

        $('li a.setlink').click (function () {
          removeSetClick (this);
          return false;
        })

        $('p#piecesetsParagraph').text ('This piece is in your collection, in the following sets:');
        $('p#addSetListParagraph').text ('You can add it to other sets:');
      }
      removeLoader ($this[0], setUri);
      $this.click (function () {
        addSetClick (this);
        return false;
      });
    },
    error: function (XMLHttpRequest, textStatus, exception) {
    // handle error
    },
    dataType: 'json'
  });
}

function showLoader (targetSelector, id) {
  $(targetSelector).append ('<img id="loader'+ id +'" style="position: absolute; top: 10px; right: 10px;" src="/images/ajax-loader.gif">');
}

function removeLoader (targetSelector, id) {
  $('img#loader' + id, targetSelector).remove ();
}

/*
 * Add to collection, like and blah.
 */

$(document).ready (function () {

  $('a#actionadd').click (function () {
    addPieceToCollectionClick (this);
    return false;
  });

  $('a#actionlike').click (function () {
    likePieceClick (this);
    return false;
  });

  $('a#actionblah').click (function () {
    dislikePieceClick (this);
    return false;
  });

  $('a#followUser').click (function () {
    followUserClick (this);
    return false;
  });

  $('a#sendComment').click (function () {
    sendCommentClick (this);
    return false;
  });

  $('a#changeDescription').click (function () {
    changeDescriptionClick (this);
    return false;
  });

  $('a#changeAvatar').click (function () {
    changeAvatarClick (this);
    return false;
  });

  $('a.removePieceImage').click (function () {
    removePieceImage (this);
    return false;
  });
});

function removePieceImage (clickedElement) {
  var $this = $(clickedElement);
  $this.unbind ('click');
  var imageFilename = $this.next ('input').val ();
  if (imageFilename != undefined) {
    $.ajax ({
      type: 'POST',
      url: '/ajax/remove-piece-image',
      data: {
        'filename' : imageFilename
      },
      success: function (data, textStatus, XMLHttpRequest) {
        if (data.success == 1) {
          $this.parents('li.selectPhoto').remove ();
        }
      },
      error: function (XMLHttpRequest, textStatus, exception) {
      // handle error
      },
      dataType: 'json'
    });
  }
}

function addPieceToCollectionClick (clickedElement) {
  var $this = $(clickedElement);
  $this.unbind ('click');
  var pieceId = $this.data ('pieceId');
  if (pieceId != undefined) {
    $.ajax ({
      type: 'POST',
      url: '/ajax/add-to-collection',
      data: {
        'pieceId' : pieceId
      },
      success: function (data, textStatus, XMLHttpRequest) {
        if (data.success == 1) {
          $this.attr ('id', 'actionadd2');
          window.location.reload ();
        }
      },
      error: function (XMLHttpRequest, textStatus, exception) {
      // handle error
      },
      dataType: 'json'
    });
  }
}

function likePieceClick (clickedElement) {
  var $this = $(clickedElement);
  $this.unbind ('click');
  var pieceId = $this.data ('pieceId');
  if (pieceId != undefined) {
    $.ajax ({
      type: 'POST',
      url: '/ajax/like',
      data: {
        'pieceId' : pieceId
      },
      success: function (data, textStatus, XMLHttpRequest) {
        if (data.success == 1) {
          $this.attr ('id', 'actionlike2');
          // Increase likes count
          var likesCount = parseInt ($this.siblings ('span.num').text ());
          $this.siblings ('span.num').text (++likesCount);
          // Check if disliked before
          if ($('a#actionblah2').length == 1) {
            $('a#actionblah2').attr ('id', 'actionblah');
            var dislikesCount = parseInt ($('a#actionblah').siblings('span.num').text ());
            $('a#actionblah').siblings ('span.num').text (--dislikesCount);
          }
        }
      },
      error: function (XMLHttpRequest, textStatus, exception) {
      // handle error
      },
      dataType: 'json'
    });
  }
}

function dislikePieceClick (clickedElement) {
  var $this = $(clickedElement);
  $this.unbind ('click');
  var pieceId = $this.data ('pieceId');
  if (pieceId != undefined) {
    $.ajax ({
      type: 'POST',
      url: '/ajax/dislike',
      data: {
        'pieceId' : pieceId
      },
      success: function (data, textStatus, XMLHttpRequest) {
        if (data.success == 1) {
          $this.attr ('id', 'actionblah2');
          // Increase dislikes count
          var dislikesCount = parseInt ($this.siblings ('span.num').text ());
          $this.siblings ('span.num').text (++dislikesCount);
          // Check if liked before
          if ($('a#actionlike2').length == 1) {
            $('a#actionlike2').attr ('id', 'actionlike');
            var likesCount = parseInt ($('a#actionlike').siblings ('span.num').text ());
            $('a#actionlike').siblings ('span.num').text (--likesCount);
          }
        }
      },
      error: function (XMLHttpRequest, textStatus, exception) {
      // handle error
      },
      dataType: 'json'
    });
  }
}

function followUserClick (clickedElement) {
  var $this = $(clickedElement);
  $this.unbind ('click');
  var username = $this.data ('uri');
  if (username != undefined) {
    $.ajax ({
      type: 'POST',
      url: '/ajax/follow',
      data: {
        'uri' : username
      },
      success: function (data, textStatus, XMLHttpRequest) {
        if (data.success == 1) {
          $this.replaceWith ('<span>You are following this user.</span>');
        }
      },
      error: function (XMLHttpRequest, textStatus, exception) {
      // handle error
      },
      dataType: 'json'
    });
  }
}

function sendCommentClick (clickedElement) {
  var $this = $(clickedElement);
  $this.unbind ('click');
  var pieceId = $this.data ('pieceId');
  if (pieceId != undefined) {
    $.ajax ({
      type: 'POST',
      url: '/ajax/comment',
      data: {
        'pieceId' : pieceId,
        'comment' : $('textarea#commentfield').val()
      },
      success: function (data, textStatus, XMLHttpRequest) {
        if (data.success == 1 && data.comment != undefined) {
          $('ul#piececomments').prepend ('<li><img width="24" height="24" src="' + data.avatar + '" alt="" /><a href="' + data.url + '">' + data.username + '</a><span>Moments ago!</span><p>' + data.comment + '</p></li>');
        }
      },
      error: function (XMLHttpRequest, textStatus, exception) {
      // handle error
      },
      dataType: 'json'
    });
  }
}

function changeDescriptionClick (clickedElement) {
  var $this = $(clickedElement);
  var userUri = $this.data ('userUri');
  if (userUri != undefined) {
    // POST Data if textbox already shown
    if ($this.data ('active') == 1) {
      $this.unbind ('click');
      $this.text (' Saving..."');
      $this.prepend ('<img src="/images/ajax-loader-purple.gif" alt="loader" />');
      $.ajax ({
        type: 'POST',
        url: '/ajax/description',
        data: {
          'userUri' : userUri,
          'description' : $('textarea#description').val ()
        },
        success: function (data, textStatus, XMLHttpRequest) {
          if (data.success == 1) {
            $('textarea#description').replaceWith ('<p id="userbrief">' + $('textarea#description').val () + '</p>');
            $this.text ('Change this text');
            $this.data ('active', 0);
            $this.bind ('click', function () {
              changeDescriptionClick (clickedElement);
              return false;
            });
          }
        },
        error: function (XMLHttpRequest, textStatus, exception) {
        // handle error
        },
        dataType: 'json'
      });
    }
    // Show textarea
    else {
      $('p#userbrief').replaceWith ('<textarea id="description">' + $('p#userbrief').text () + '</textarea>');
      $this.text ('Save text');
      $this.data ('active', 1);
    }
  }
}

function changeAvatarClick (clickedElement) {
  var $this = $(clickedElement);
  var userUri = $this.data ('userUri');
  var sessionId = $this.data ('sessionId');
  if (userUri != undefined) {
    $this.unbind ('click');
    $this.replaceWith ('<input type="file" name="uploadAvatar[]" id="uploadAvatar" />');
    $('#uploadAvatar').uploadify ({
      'uploader'        : '/js/uploadify/uploadify.swf',
      'script'          : '/ajax/avatar',
      'scriptData'      : {
        'sess_id' : sessionId,
        'userUri' : userUri
      },
      'cancelImg'       : '/js/uploadify/cancel.png',
      'auto'            : true,
      'fileDataName'    : 'uploadAvatar[]',
      'fileExt'         : '*.jpg',
      'fileDesc'        : 'JPEG Image Files',
      'multi'           : false,
      'removeCompleted' : true,
      'onComplete'      : function (event, ID, fileObj, response, data) {
        $('img#useravatar').attr ('src', '/img/avatar/' + response);
        $('#uploadAvatar').replaceWith ('<a id="changeAvatar" class="moregreen">Change avatar</a>');
        $('#uploadAvatarUploader, #uploadAvatarQueue').remove ();

        $('a#changeAvatar').data ('userUri', userUri);
        $('a#changeAvatar').data ('sessionId', sessionId);
        $('a#changeAvatar').click (function () {
          changeAvatarClick ('a#changeAvatar');
          return false;
        })
      },
      'onOpen'          : function (event, ID, fileObj) {
        $('div#uploadAvatar' + ID).append ('<img id="loader'+ID+'" style="position: absolute; top: 10px; right: 10px;" src="/images/ajax-loader.gif">');
      }
    });
  }
}