CODEWITHSUNDEEP
javascriptjquerysvg
Ankur
Ankur

Reputation: 187

Fire Events in Pairs

I have a data structure with two svg circles. I have added a listener to my document such that on every click 2 circles are created in the same place.Then I want one of the circles to follow my mouse until I click again. Hereafter, the data structure is created on every click similarly. I cannot understand how to disable the behaviour of the 1st click and then reenable after the 2nd click. How do I do this?

document.click(function(e){
    c1 = document.circle(e.offsetX,e.offsetY,8);//create a circle 1st
    document.unclick();
    document.click(function(ev){
        c2 = document.circle(ev.offsetX,ev.offsetY,8);
        document.line(c1.attr("cx"),c1.attr("cy"),c2.attr("cx"),c2.attr("cy"));
        }
    document.unclick();
    }

Now I want to activate the 1st event again. How can I do this?

Upvotes: 0

Views: 38

Answers (1)

Arnaud Gueras
Arnaud Gueras

Reputation: 2062

You can use one click event and a counter var

var counter=0, c1, c2;
document.click(function(e){
    counter++;
    switch(counter) {
       case 1:
           c1 = document.circle(e.offsetX,e.offsetY,8);//create a circle 1st
       break;
       case 2:
           c2 = document.circle(ev.offsetX,ev.offsetY,8);
           document.line(c1.attr("cx"),c1.attr("cy"),c2.attr("cx"),c2.attr("cy"));
           counter = 0;
       break;
    }
}

Upvotes: 1

Related Questions