Canvas выкусывает середину из больших картинок

 var img;
 var tttAlt = 0;
 var tttLong = 0;
 var tttScale = 0;
 
 var canvas = document.getElementById('canvas'),
   ctx = canvas.getContext('2d');
 
 function draw() {
   var ctx = document.getElementById('canvas').getContext('2d');
   img = new Image();
   var f = document.getElementById("uploadimage").files[0],
     url = window.zURL || window.URL,
     src = url.createObjectURL(f);
   img.src = src;
   img.onload = function() {
     ctx.drawImage(img, 0, 0, img.width, img.height, 0, 0, canvas.width, (img.height * canvas.width) / img.width); //вписывание в ширину
   };
 };
 
 document.getElementById("uploadimage").addEventListener("change", draw, false)
 
 function Move(a) {
   switch (a) {
     case 'plus':
       tttScale = tttScale + 50;
       break;
     case 'mines':
       tttScale = tttScale - 50;
       break;
     default:
       alert('fall');
   }
   var ctx = document.getElementById('canvas').getContext('2d');
   ctx.fillStyle = '#FF8F00';
   ctx.fillRect(0, 0, canvas.width, canvas.height);
   ctx.drawImage(img, 0, 0, img.width, img.height, tttLong, tttAlt, canvas.width + tttScale, ((img.height * canvas.width) / img.width) + tttScale);
 }
 
 function doCanvas() {
   ctx.fillStyle = '#FF8F00';
   ctx.fillRect(0, 0, canvas.width, canvas.height);
   ctx.fillStyle = '#fff';
 };