±
ESA-Hinweise
ESA - Veranstaltung an THM Fachbereich MNI
Einleitung …
Maus und
Canvas
Maus-Daten …
Geräte
Event
Maus-Events …
Geräte
Event
Einleitung Maus und Canvas
Maus und Canvas
Unterscheide
geräte-spezifische Daten
von User-spez. Daten
Betriebs-system hat
geräte-spezifische Daten
Maus-Daten und Event ( Code-Schnipsel )
function
get_ctx(id) {
return doc.getElementById(id).getContext(
'2d'
);
}
function
init_M(id, ev_typ) {
var ctx = get_ctx(id);
ev_typ = ev_typ ||
"click"
;
if (!M.id) { M.id = {}; }
M.id.ev_typ = ev_typ;
M.id.w = ctx.canvas.width;
M.id.w = ctx.canvas.width;
M.id.h = ctx.canvas.height;
M.id.rect = ctx.getBoundingClientRect();
M.id.i = [];
M.id.j = [];
M.id.inside = [];
}
Maus-Events ( Code-Schnipsel )
function add_canvas_event
(id, evt_name, func_pre, func_post) {
// global ist M = Mause-Objekt
var ctx = get_ctx(id);
if (!M.id) { init_M(id); }
if (M.id.i.length > MAX_MAUS_PKTE) {
alert(
"ERR: Überlauf bei "
+ M.id.typ);
// oder i = i % MAX_MAUS_PKTE;
}
ctx.addEventListener(evt_name,
function
(event) {
event = event || win.event; if (func_pre) { func_pre(event); }
M.id.typ = event.type;
M.id.i.push(event.clientX - M.id.rect.left);
M.id.j.push(event.clientY - M.id.rect.top);
M.id.inside = !((M.id.i < 0) || (M.id.j < 0)
|| (M.id.i > m.w) || (M.id.j > m.h));
if (func_post) { func_post(event); }
}, false);
}