       @pointRef.set { x, y, nickname: KD.nick() }
       @stateRef.set yes
 
-    @canvas.on "mouseup", (e) =>
-      @context.closePath()
-      @startDrawing = no
-      @stateRef.set   no
-
-      @drawedQueue.unshift KD.nick(), @userColors[KD.nick()]
-      @linesRef.push @drawedQueue.join "|"
-      @drawedQueue.length = 0
-
+  bindMouseMoveCanvas: ->
     @canvas.on "mousemove", (e) =>
       if @startDrawing
         x = e.offsetX


        @pointRef.set { x, y, nickname: KD.nick() }

    @container.addSubView @canvas

    @workspaceRef.onDisconnect().remove()  if @amIHost

    if @isJoinedASession
      @context.closePath()
      @linesRef.once "value", (snapshot) =>
        value = snapshot.val()
        return unless value
        @context.beginPath()
        for own key, points of value
          pointsArr = points.split "|"
          [username, color]     = pointsArr.splice 0, 2
          @userColors[username] = color

          @context.closePath()
          @context.beginPath()
          for point, index in pointsArr
            [x, y] = point.split ","
            @context.moveTo x, y  if index is 0
            @addPoint x, y, username

    @isContextMoved = yes

    @pointRef.on "value", (snapshot) =>

class CollaborativeDrawingPane extends CollaborativePane

  constructor: (options = {}, data) ->

    options.cssClass = KD.utils.curry "ws-drawing-pane", options.cssClass

    super options, data

