Cystasy
17.06.2015, 15:47
Hey,
Gibt es eine Möglichkeit die Funktion CanvasRenderingContext2D.prototype.drawImage zu überschreiben?
Oder Beispielweise bei einem Aufruf der selbigen die width & height eines Bildes das auf das Canvas gezeichnet wird zu verändern?
Ich habe bereits versucht sie zu hooken, allerdings werden dort komischerweise keine Width & Height als Parameter übergeben, nur X und Y Position sowie das Image() Objekt. Es lässt sich also die Größe nicht beeinflussen durch den Hook - weiß da jemand wie ich das umsetzen kann?
Aktuell sieht mein Hook folgendermaßen aus:
drawImageVR = CanvasRenderingContext2D.prototype.drawImage;
CanvasRenderingContext2D.prototype.drawImage = function()
{
//Diese Argumente möchte ich ändern können
arguments[0] = arguments[0];
arguments[1] = arguments[1];
arguments[2] = arguments[2];
arguments[3] = arguments[3];
arguments[4] = arguments[4];
arguments[5] = arguments[5];
arguments[6] = arguments[6];
arguments[7] = arguments[7];
arguments[8] = arguments[8];
arguments[9] = arguments[9];
drawImageVR.apply(this, arguments);
}
Hier sind beim console.log auf arguments nur arguments[0] bis arguments[2] definiert, der Rest ist undefined.
Und das obwohl der Aufruf von drawImage() explizit mehr als 3 Argumente vom Hauptcode hat.
Die Funktion createElement z.b habe ich schon hooken können damit ich darüber erstellte Canvas abgreifen kann. Ziel des ganzen Unterfangens ist es die wichtigsten Canvas Funktionen zu Hooken, so das ich das zeichnen beliebiger Canvas-Funktionen in fremden Apps (HTML5 Games z.b mit Cardboard Funktion ausstatten) steuern kann. Der Javascriptcode der das ganze hooked wird übrigens als erstes geladen damit es zu keinen Problemen kommt.
Ich bin mir da leider auch nicht zu 100% sicher ob ich überhaupt die richtige Funktion / Schnittstelle hooke, weil ich mich bisher nicht so wirklich gut mit der Browser-Schnittstelle / Interfaces auskenne (außerhalb von window,navigator & co.) .. sollte ich das falsche Interface gehooked haben wär es cool wenn mir jemand helfen könnte das richtige zu finden. Normal müsste es aber passen da ich die X,Y Position des drawImage beeinflussen kann.
p.s: Lese hier grade das es read-only ist - gibt es da dann alternative Möglichkeiten wie ich die Argumente beeinflussen kann? Der eigendliche Hook funktioniert ja scheinbar.
grüße
Gibt es eine Möglichkeit die Funktion CanvasRenderingContext2D.prototype.drawImage zu überschreiben?
Oder Beispielweise bei einem Aufruf der selbigen die width & height eines Bildes das auf das Canvas gezeichnet wird zu verändern?
Ich habe bereits versucht sie zu hooken, allerdings werden dort komischerweise keine Width & Height als Parameter übergeben, nur X und Y Position sowie das Image() Objekt. Es lässt sich also die Größe nicht beeinflussen durch den Hook - weiß da jemand wie ich das umsetzen kann?
Aktuell sieht mein Hook folgendermaßen aus:
drawImageVR = CanvasRenderingContext2D.prototype.drawImage;
CanvasRenderingContext2D.prototype.drawImage = function()
{
//Diese Argumente möchte ich ändern können
arguments[0] = arguments[0];
arguments[1] = arguments[1];
arguments[2] = arguments[2];
arguments[3] = arguments[3];
arguments[4] = arguments[4];
arguments[5] = arguments[5];
arguments[6] = arguments[6];
arguments[7] = arguments[7];
arguments[8] = arguments[8];
arguments[9] = arguments[9];
drawImageVR.apply(this, arguments);
}
Hier sind beim console.log auf arguments nur arguments[0] bis arguments[2] definiert, der Rest ist undefined.
Und das obwohl der Aufruf von drawImage() explizit mehr als 3 Argumente vom Hauptcode hat.
Die Funktion createElement z.b habe ich schon hooken können damit ich darüber erstellte Canvas abgreifen kann. Ziel des ganzen Unterfangens ist es die wichtigsten Canvas Funktionen zu Hooken, so das ich das zeichnen beliebiger Canvas-Funktionen in fremden Apps (HTML5 Games z.b mit Cardboard Funktion ausstatten) steuern kann. Der Javascriptcode der das ganze hooked wird übrigens als erstes geladen damit es zu keinen Problemen kommt.
Ich bin mir da leider auch nicht zu 100% sicher ob ich überhaupt die richtige Funktion / Schnittstelle hooke, weil ich mich bisher nicht so wirklich gut mit der Browser-Schnittstelle / Interfaces auskenne (außerhalb von window,navigator & co.) .. sollte ich das falsche Interface gehooked haben wär es cool wenn mir jemand helfen könnte das richtige zu finden. Normal müsste es aber passen da ich die X,Y Position des drawImage beeinflussen kann.
p.s: Lese hier grade das es read-only ist - gibt es da dann alternative Möglichkeiten wie ich die Argumente beeinflussen kann? Der eigendliche Hook funktioniert ja scheinbar.
grüße