Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #37637

Re: Where does it make sense to put the mouseOver "canvas" mouseOut "canvas"

Show all headers | View raw

jonas.thornvall wrote on 29 Oct 2019 in comp.lang.javascript: 

> I am just starting with a visual editor for notes, but the whole thing
> with where to put things in event drive code is very fuzzy for me. The
> first thing i want to do is check if mouse in over the editor canvas
> because then i start "the click listeners on regions". 
> 
> The only thing i can come up with is to put it directly when canvas
> loaded. Does it make sense?
> 
> function main_canvas_init() {
>   mainCanvas = document.getElementById("maincanvas");
>   ctm = mainCanvas.getContext("2d");
>   ctm.font = "12px Arial";
>   mget_canvas_res();     
>   mset_canvas_resolution();
>   mainCanvas.addEventListener("mouseover", function(evt) {
>      startMouseListener();
>      //alert("mouse in");
>   }, false);
>   mainCanvas.addEventListener("mouseout", function(evt) {
>      stopMouseListener();
>      //alert("mouse out");               
>   }, false);
>}
> 

You can always add it later, I trust:

document.getElementById("maincanvas").addEventListener("mouseout"...

=========

To avoid confusion with globals or semi-globals, 
use 'let' and 'const' for local variables in functions.

Learn to use .querySelector() and .querySelectorAll().

Handy shortcuts:

const qs = (selector,context) => 
   (context || document).querySelector(selector);

const qsa = (selector,context) => 
   Array.from((context || document).querySelectorAll(selector));

So you could write:

qs("#maincanvas").addEventListener("mouseout" ...

or referencing the 4th instance of a class:

qsa(".canvases")[3].addEventListener("mouseout" ...


-- 
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

Back to comp.lang.javascript | Previous | Next — Previous in thread | Next in thread | Find similar | Unroll thread

Thread

Where does it make sense to put the mouseOver "canvas" mouseOut "canvas" Jonas Thörnvall <jonas.thornvall@gmail.com> - 2019-10-29 02:18 -0700
  Re: Where does it make sense to put the mouseOver "canvas" mouseOut "canvas" "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2019-10-29 10:42 +0100
    Re: Where does it make sense to put the mouseOver "canvas" mouseOut "canvas" Jonas Thörnvall <jonas.thornvall@gmail.com> - 2019-10-29 03:07 -0700
      Re: Where does it make sense to put the mouseOver "canvas" mouseOut "canvas" "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2019-10-29 11:32 +0100
        Re: Where does it make sense to put the mouseOver "canvas" mouseOut "canvas" Jonas Thörnvall <jonas.thornvall@gmail.com> - 2019-10-29 06:10 -0700
          Re: Where does it make sense to put the mouseOver "canvas" mouseOut "canvas" "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2019-10-29 23:11 +0100
            Re: Where does it make sense to put the mouseOver "canvas" mouseOut "canvas" Jonas Thörnvall <jonas.thornvall@gmail.com> - 2019-10-29 23:18 -0700
              Re: Where does it make sense to put the mouseOver "canvas" mouseOut "canvas" luserdroog <luser.droog@gmail.com> - 2019-10-30 00:10 -0700
                Re: Where does it make sense to put the mouseOver "canvas" mouseOut "canvas" Jonas Thörnvall <jonas.thornvall@gmail.com> - 2019-10-30 01:01 -0700

csiph-web