   ctx.font = "12px Sans-Serif"
   addRectToInstances(ctx, instances, messages)
   addRectToMessages(ctx, instances, messages)
+  offset = getOffset(instances, messages)
+  shiftRectsForMergin(offset.left, instances, messages)
   canvas.height = calcCanvasHeight(messages)
-  ctx.font = "12px Sans-Serif"
-  canvas.width = calcCanvasWidth(ctx, instances)
+  canvas.width = offset.right
   fillBackground(ctx, canvas.width, canvas.height)
   drawInstances(ctx, instances, canvas.height - MESSSAGE_OFFSET - CANVAS_PADDING)
   drawMessages(ctx, messages)
   disableOpenImageButton(false)
 
+# ------------------------------
+
 addRectToInstances = (ctx, instances, messages) ->
-  first = _.min(instances, (obj) -> obj.order)
-  x = CANVAS_PADDING + getInstanceMargin(ctx, instances, messages, first)
+  x = 0
   for obj in instances
     obj.rect = createInstanceRect(ctx, x, obj)
     x += Math.round(obj.rect.width + INSTANCE_OFFSET)
-
-getInstanceMargin = (ctx, instances, messages, instance) ->
-  return 0 unless instance?
-  
-  # TODO noteBodyMargin
-  normalBodyMargin = getMaxNormalBodyMargin(ctx, instance)
-  selfBodyMargin = getMaxSelfBodyMargin(ctx, instance)
-  bodyMargin = Math.max(normalBodyMargin, selfBodyMargin)
-  
-  nameWidth1 = roundInstanceWidth(ctx, instance.name)
-  nameMargin = nameWidth1 / 2
-  gap = Math.round(bodyMargin - nameMargin)
-  return gap if gap > 0
-  
-  return 0
-
-getMaxSelfBodyMargin = (ctx, instance) ->
-  message = _.max(messages, (obj) -> getRelatedSelfBodyWidth(ctx, instance, obj))
-  return 0 unless isValidMessage(message)
-  return 0 unless isSelfMessage(message)
-  return 0 if isNote(message)
-  return 0 unless message.from is instance
-  
-  bodyWidth = ctx.measureText(message.body).width
-  return bodyWidth / 2
-
-getRelatedSelfBodyWidth = (ctx, instance, message) ->
-  return 0 unless message.from is instance
-  return 0 unless isSelfMessage(message)
-  
-  bodyWidth = ctx.measureText(message.body).width
-  return bodyWidth / 2
-
-getMaxNormalBodyMargin = (ctx, instance1) ->
-  message = _.max(messages, (obj) -> getRelatedBodyWidth(ctx, instance1, obj))
-  return 0 unless isValidMessage(message)
-  
-  instance2 = message.to
-  return 0 unless instance2?
-  
-  nameWidth1 = roundInstanceWidth(ctx, instance1.name)
-  nameWidth2 = roundInstanceWidth(ctx, instance2.name)
-  
-  distance = nameWidth1 / 2 + nameWidth2 / 2 + INSTANCE_OFFSET
-  bodyWidth = ctx.measureText(message.body).width
-  return bodyWidth / 2 - distance / 2
-
-getRelatedBodyWidth = (ctx, instance1, message) ->
-  return 0 if isSelfMessage(message)
-  
-  if message.from is instance1
-    instance2 = message.to
-  else if message.to is instance1
-    instance2 = message.from
-  else
-    return 0
-  return 0 unless instance2?
-  
-  nameWidth1 = roundInstanceWidth(ctx, instance1.name)
-  nameWidth2 = roundInstanceWidth(ctx, instance2.name)
-  
-  distance = nameWidth1 / 2 + nameWidth2 / 2 + INSTANCE_OFFSET
-  bodyWidth = ctx.measureText(message.body).width
-  return bodyWidth
 
 createInstanceRect = (ctx, x, obj) ->
   rect = new Object()

  bodyPt = obj.selfMessage.bodyPoint
  drawSelfMessagePath(ctx, obj.selfMessage.rect)
  drawMessageArrowhead(ctx, headPt, true)
  drawMessageText(ctx, bodyPt.x, bodyPt.y, obj.body)

drawSelfMessagePath = (ctx, rect) ->
  ctx.beginPath()

INSTANCE_HEIGHT = 30

CANVAS_PADDING = 15

fillBackground = (ctx, width, height) ->
  ctx.fillStyle = "white"
  ctx.fillRect(0, 0, width, height)
  ctx.fillStyle = "black"

drawMessages = (ctx, messages) ->
  drawMessage(ctx, obj) for obj in messages
