У меня критическая проблема!
function EventCu(element){
var self = this;
this.elem = element;
this.k = 0;
this.ev = [];
this.func = [];
this.r = [];
this.g = [];
this.b = [];
this.ac = [];
this.works = [];
this.def = -1;
this.prev = -1;
this.canvas = document.createElement("canvas");
this.ctx = this.canvas.getContext("2d");
this.canvas.width = this.elem.width;
this.canvas.height = this.elem.height;
this.addMark = function(data,event,r,g,b,func){
this.mark = document.createElement("canvas");
this.ctx2 = this.mark.getContext("2d");
this.mark.width = this.elem.width;
this.mark.height = this.elem.height;
this.idat = new Image();
this.idat.src = data;
this.ctx2.clearRect(0,0,this.mark.width,this.mark.height);
this.ctx2.drawImage(this.idat,0,0);
this.mdat = this.ctx2.getImageData(0,0,this.mark.width,this.mark.height);
for(this.x=0; this.x<this.mark.width; this.x++)
for(this.y=0; this.y<this.mark.height; this.y++)
{
this.j = (this.mark.width*this.y + this.x)*4
this.mdat.data[this.j+0] = r;
this.mdat.data[this.j+1] = g;
this.mdat.data[this.j+2] = b;
if(this.mdat.data[this.j+3]>0){
this.mdat.data[this.j+3]=255;
}
}
this.ctx2.putImageData(this.mdat,0,0);
this.data = new Image();
this.data.src = this.mark.toDataURL();
this.ctx.drawImage(this.data,0,0);
this.ev[this.k] = event;
this.func[this.k] = func;
this.r[this.k] = r;
this.g[this.k] = g;
this.b[this.k] = b;
this.k++;
}
self.elem.addEventListener("mouseover",function(){
for(self.i=0;self.i<self.k;self.i++){
self.ac[self.i] = true;
}
},false);
self.elem.addEventListener("click",function(e){
self.d = self.ctx.getImageData(0,0,self.canvas.width,self.canvas.height);
self.x = e.pageX - self.elem.offsetLeft;
self.y = e.pageY - self.elem.offsetTop;
self.f = (self.y*self.canvas.width + self.x)*4;
for(self.i=0;self.i<self.k;self.i++){
if(
self.d.data[self.f+0]==self.r[self.i] &
self.d.data[self.f+1]==self.g[self.i] &
self.d.data[self.f+2]==self.b[self.i] &
self.d.data[self.f+3]==255 &
self.ev[self.i]=="click")
{
self.func[self.i]();
}
}
},false);
self.elem.addEventListener("mousedown",function(e){
self.d = self.ctx.getImageData(0,0,self.canvas.width,self.canvas.height);
self.x = e.pageX - self.elem.offsetLeft;
self.y = e.pageY - self.elem.offsetTop;
self.f = (self.y*self.canvas.width + self.x)*4;
for(self.i=0;self.i<self.k;self.i++){
if(
self.d.data[self.f+0]==self.r[self.i] &
self.d.data[self.f+1]==self.g[self.i] &
self.d.data[self.f+2]==self.b[self.i] &
self.d.data[self.f+3]==255 &
self.ev[self.i]=="mousedown")
{
self.func[self.i]();
}
}
},false);
self.elem.addEventListener("mouseup",function(e){
self.d = self.ctx.getImageData(0,0,self.canvas.width,self.canvas.height);
self.x = e.pageX - self.elem.offsetLeft;
self.y = e.pageY - self.elem.offsetTop;
self.f = (self.y*self.canvas.width + self.x)*4;
for(self.i=0;self.i<self.k;self.i++){
if(
self.d.data[self.f+0]==self.r[self.i] &
self.d.data[self.f+1]==self.g[self.i] &
self.d.data[self.f+2]==self.b[self.i] &
self.d.data[self.f+3]==255 &
self.ev[self.i]=="mouseup")
{
self.func[self.i]();
}
}
},false);
this.defs = function(){
self.def = -1;
self.prev = -1;
}
this.hovers = function(e){
self.d = self.ctx.getImageData(0,0,self.canvas.width,self.canvas.height);
self.x = e.pageX - self.elem.offsetLeft;
self.y = e.pageY - self.elem.offsetTop;
self.f = (self.y*self.canvas.width + self.x)*4;
for(self.i=0;self.i<self.k;self.i++){
if(
self.d.data[self.f+0]==self.r[self.i] &
self.d.data[self.f+1]==self.g[self.i] &
self.d.data[self.f+2]==self.b[self.i] &
self.d.data[self.f+3]==255 &
self.ev[self.i]=="mouseover")
{
self.prev = self.def;
self.def = self.i;
}
}
if(self.prev!=self.def)
{
self.func[self.def]();
}
}
self.elem.addEventListener("mousemove",this.hovers,false);
self.elem.addEventListener("mouseout",this.defs,false);
}
mouseout ведет себя как "mousemove".
Я никак не могу избавиться от этой проблемы!