salut a tous

j'ai besoin de votre aide , j'ai entrain de coder en javascript et c'est la première fois que je travail avec canvas mon problème c'est ajouter des événements lorsque je fait un dessin sur mes plusieurs " canvas " j'ai utiliser dans mon code la freamwork CreateJs ma question est comment je peut ajouter faire clique pour commencer le dessin et le clique pour stopper le dessin , j'ai deja ajouter 2 function mais ca marche pas puisque je fait le dessin sur plusieurs canvas voici mon code :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
(function (){
 
    var TousLesCanvas = document.getElementsByTagName('canvas');
    var tab = new Array();
    var tab_shape = new Array();
    var stage, shape;
    var color = "#000";
    var size = 10;
 
    for (var i=0; i<TousLesCanvas.length; i++) {
 
      stage = new createjs.Stage(TousLesCanvas[i]);
      tab[ TousLesCanvas[i].id ] = stage;
 
      shape = new createjs.Shape();
      tab_shape[TousLesCanvas[i].id] = shape ;
      stage.addChild(shape);
 
      console.log("stage id : "+stage.id);
 
      TousLesCanvas[i].onmouseover = function (event) {
 
        var oldX, oldY;       
 
        canvas_id = event.target.id;
        console.log("hello man : "+canvas_id);
 
        current_stage = tab[ canvas_id ];
        current_shape = tab_shape[canvas_id];
 
 
 
       function handleMouseDown (evt){
 
      current_stage.addEventListener("stagemousemove", handleMouseMove);
 
      };
 
 
        function handleMouseMove (evt) {
          if (oldX) {
            current_shape.graphics.beginStroke(color)
                    .setStrokeStyle(size, "round")
                    .moveTo(oldX, oldY)
                    .lineTo(evt.stageX, evt.stageY);
            current_stage.update();
          }
          oldX = evt.stageX;
           console.log("X ========" +oldX);
          oldY = evt.stageY;
       console.log("y ========" +oldY);
        };
 
 
       function handleMouseUp(evt){
 
      current_stage.removeEventListener("stagemousemove", handleMouseMove);
 
      };
      };
 
    }
 // end for   
 
 
 
 
 })();//end function