var currentColor = "#000000";

function upload() {
  if(confirm("Want to save?")) {
    $.post('/upload', { imageData : pixel.getDataURL() }, function(data) {
      if(typeof data.thumb != 'undefined') {
        $("#images").prepend(data.thumb);
        pixel.clearCanvas();
      
        FB.ui({
          method: 'feed',
          name: 'My brand new drawing',
          link: data.share_url,
          picture: data.url,
          caption: 'Check my drawing out!',
          description: 'Do you like it?',
          message: 'Check my drawing out!',
          actions: [JSON.stringify({name: 'Draw!', link: 'http://draw.heroku.com/'})]
        },
        function(response) {
          if (response && response.post_id) {
            // alert('Post was published.');
          } else {
            // alert('Post was not published.');
          }
        });
      }
      else {
        alert(data);
      }
    }, "json");
  
    $(this).unbind('click').removeClass('enabled');
    $(this).addClass('disabled');
  }
  
  return false;
}

$(document).ready(function() {
  var canvas = $("#canvas canvas");

  pixel.init(canvas[0]);

  //set it true on mousedown
  canvas.mousedown(function(e) {
    pixel.setDraw(true);
    var x = e.offsetX ? e.offsetX : e.pageX - this.offsetLeft;
    var y = e.offsetY ? e.offsetY : e.pageY - this.offsetTop;
    
    pixel.doAction(x, y, currentColor);
    
    $("#upload.disabled").bind('click', upload).removeClass('disabled');
    $("#upload").addClass('enabled');
  }).mousemove(function(e) {
    var x = e.offsetX ? e.offsetX : e.pageX - this.offsetLeft;
    var y = e.offsetY ? e.offsetY : e.pageY - this.offsetTop;
    
    pixel.doAction(x, y, currentColor);
  });

  //reset it on mouseup
  $(document).mouseup(function() {
    pixel.setDraw(false);
  });
  
  // if shift is pressed set color to transparent
  $(document).keydown(function(e) {
    if(e.keyCode == 16) {
      currentColor = "rgba(0, 0, 0, 0)";
      $(".clearPixel").addClass('active');
    }
  });
  
  // reset color to current active color
  $(document).keyup(function(e) {
    currentColor = $(".color.active").data().color;
    if($(".action.selectable.active").data().action != "clearPixel") {
      $(".clearPixel").removeClass('active');
    }
  });

  // controls
  $("#clear").click(function() {
    if($("#upload").hasClass('enabled') && confirm("Sure?")) {
      pixel.clearCanvas();
    
      $("#upload.enabled").unbind('click').removeClass('enabled');
      $("#upload").addClass('disabled');
    }
  });

  $(".action.selectable").click(function() {
    pixel.setAction($(this).data().action);
    
    $(".action.selectable.active").toggleClass("active");
    $(this).toggleClass("active");
  });

  $(".color").click(function() {
    currentColor = $(this).data().color;
    
    $(".color.active").toggleClass("active");
    $(this).toggleClass("active");
  });
  
  ["undo", "redo"].forEach(function(action) {
    $("." + action).click(function() {
      pixel[action].call();
      return false;
    });
  });
  
  $("#more").click(function() {
    $.get("/drawings?page=" + (currentPage + 1), function(data) {
      if(typeof data == 'object') {
        currentPage++;
        var permalink = "/?page=" + currentPage;
        var sep = "<p class='sep'><a href='" + permalink + "'>" + ((12*(currentPage-1))+1) + " / " + 12*currentPage + "</a></p>"
        
        $("#images")
          .append([sep].concat(data.map(function(d) {
            return d.thumb;
          })).join(" "))
          .append("<script src='http://platform.twitter.com/widgets.js' type='text/javascript'></script>");
        
        // rerender FBML (like buttons)
        FB.XFBML.parse(document.getElementById("images"));
        
        //
        // NODE: doesn't work anymore
        //
        // rerender tweet buttons
        // $('a.twitter-share-button').each(function() {
        //   (new twttr.TweetButton(this)).render();
        // });
      }
      else {
        alert(data);
      }
    }, 'json');
    
    return false;
  });
});
@@ -3179,24 +3179,56 @@
 'object') %7B%0A
+        if(data.length %3E 0) %7B%0A  
         curr
@@ -3238,16 +3238,18 @@
 Page++;%0A
+  
         
@@ -3293,24 +3293,26 @@
 ge;%0A        
+  
 var sep = %22%3C
@@ -3429,32 +3429,34 @@
        %0A        
+  
 $(%22#images%22)%0A   
@@ -3452,16 +3452,18 @@
 mages%22)%0A
+  
         
@@ -3516,24 +3516,26 @@
             
+  
 return d.thu
@@ -3548,16 +3548,18 @@
         
+ 
+ 
 %7D)).join
@@ -3565,16 +3565,18 @@
 n(%22 %22))%0A
+  
         
@@ -3684,32 +3684,34 @@
        %0A        
+  
 // rerender FBML
@@ -3726,16 +3726,18 @@
 uttons)%0A
+  
         
@@ -3798,228 +3798,10 @@
     
- 
-%0A        //%0A        // NODE: doesn't work anymore%0A        //%0A        // rerender tweet buttons%0A        // $('a.twitter-share-button').each(function() %7B%0A        //   (new twttr.TweetButton(this)).render();%0A        // %7D);
+ %7D
 %0A   

fix page out of range case