Doubts about the ObjEvent() function

[Gianni 803]

Hello and happy new Year to everybody!

I'm trying to catch some events occuring within a browser control by simply using the ObjEvent() function.
I think I'm not using that function in a proper way since some events are captured, while other are not.

more precisely, events like those listed in this page are working:
https://msdn.microsoft.com/en-us/library/aa769764(v=vs.85).aspx

while other events listed in other "interfaces", as in the following links, does not works.
https://msdn.microsoft.com/en-us/library/hh801967(v=vs.85).aspx

For exemple, Here I would like to catch events like "DragOver" and/or "Drop" fired while dragging the image on the web control, but I'm not been able to obtain a result.
Those events are listed in the HTMLDocumentEvents4 interface or also in the HTMLImgEvents interface, but I failed to use them.

Any hint that can help to see what I'm doing wrong, or even better that can show how to achieve the result by using the ObjEvent() function (if it's possible?) is welcome.
Thanks a lot.

Here is the simple script that I'm using for my tests:

expandcollapse popup

#include <GUIConstantsEx.au3>
#include <string.au3>

; read html page from bottom of this script
; and write it to a file on disk for later
; usage by the $oIE.navigate
CreateHtmlPage()

Example()
Exit

Func Example()
    Local $hGUIMain = GUICreate("Event Test", 540, 400)

    ; We generate the Browser Control...
    Global $oIE = ObjCreate("Shell.Explorer.2")

    ; and we embed it into the AutoIt GUI
    $hIE = GUICtrlCreateObj($oIE, 5, 5, 530, 390)

    GUISetState() ;Show GUI

    ; load in the browser our previously created web page
    $oIE.navigate('file:///' & @ScriptDir & '\Page.html')

    Do ; wait for document
        Sleep(250)
        $oDocument = $oIE.document
    Until IsObj($oDocument)
    $oDocument.execCommand("Refresh")


    ; --- Setup catch of events ---

    Local $oEventObjects[2]
    $oImage = $oDocument.getElementById('drag1') ; Object reference to The image on the page

    ; https://msdn.microsoft.com/en-us/library/aa769764(v=vs.85).aspx
    ; HTMLDocumentEvents2 interface (catch OnClick, OnMouseOver, .... etc

    ; ObjEvent() "Handles incoming events from the given Object."
    ;   ObjEvent($oParam1, $sParam2 [,$sParam3])
    ; Parameters
    ;               $oParam1 A variable containing an Object from which you want to receive events
    ;
    ;               $sParam2 The prefix of the functions you define to handle receiving events.
    ;                        The prefix is appended by the Objects method name.
    ;
    ;               $sParam3 "interface name" [optional] name of an Event interface to use.
    ;                        Note: It must be a supported as outgoing for the Object AND it must be of type DISPATCH.


    ; Using third parameter as "HTMLDocumentEvents2" as event interface, or even leaving it blank,
    ; is the only way by which I've been able to catch some events from the browser control

    ; OK, events listed here are catched --> https://msdn.microsoft.com/en-us/library/aa769764(v=vs.85).aspx
    $oEventObjects[0] = ObjEvent($oDocument, "IEEvent2_") ;, "HTMLDocumentEvents2")

    ; when I try to catch events fired by the Image dragged on the web page
    ; following attempts do not work (no event is captured and passed to AutoIt)

    ; $oEventObjects[1] = ObjEvent($oDocument, "IEEvent2_", "HTMLDocumentEvents2")
    ; $oEventObjects[1] = ObjEvent($oDocument, "IEEvent2_", "HTMLDocumentEvents4")
    ; $oEventObjects[1] = ObjEvent($oImage, "IEEvent2_", "HTMLDocumentEvents2")
    ; $oEventObjects[1] = ObjEvent($oImage, "IEEvent2_")
    $oEventObjects[1] = ObjEvent($oImage, "IEEvent2_", "HTMLImgEvents2")
    ; -----------------------------

    ; Loop until the user exits.
    While 1
        Switch GUIGetMsg()
            Case $GUI_EVENT_CLOSE
                ExitLoop
        EndSwitch
    WEnd

    ; the end
    For $i = 0 To UBound($oEventObjects) - 1
        $oEventObjects[$i].Stop ; Tell IE we don't want to receive events.
        $oEventObjects[$i] = 0
    Next
    $oEventObject = 0 ; Kill the Event Object
    $oIE = 0 ; Remove IE from memory (not really necessary).
    GUIDelete($hGUIMain) ; Remove GUI
EndFunc   ;==>Example

; below function should be fired by events
; occurred in the browser's objects
; --- events management zone ---
Volatile Func IEEvent2_onClick($oEvent)
    ConsolePrint("mouse click:")
EndFunc   ;==>IEEvent2_onClick

Volatile Func IEEvent2_onDblClick($oEvent)
    ConsolePrint("mouse DoubleClick:")
EndFunc   ;==>IEEvent2_onDblClick

; Drag related events
Volatile Func IEEvent2_onDragstart($oEvent)
    ConsolePrint("Drag action started")
EndFunc   ;==>IEEvent2_onDragstart

; --- following events are not catched --- ???
Volatile Func IEEvent2_onDragOver($oEvent)
    ConsolePrint("DragOver event")
EndFunc   ;==>IEEvent2_onDragOver

Volatile Func IEEvent2_onDrop($oEvent)
    ConsolePrint("Drop action performed ")
EndFunc   ;==>IEEvent2_onDrop
; ------------------------------

Func ConsolePrint($sMsg)
    ConsoleWrite($sMsg & @CRLF)
EndFunc   ;==>ConsolePrint

Func CreateHtmlPage()
    Local $sStart = @LF & "#cs;HTML"
    Local $sEnd = "#ce;HTML" & @CR
    Local $aArray = _StringBetween(FileRead(@ScriptFullPath), $sStart, $sEnd)
    Local $sPage = @ScriptDir & '\Page.html'
    Local $hFile = FileOpen($sPage, 2) ;  $FO_OVERWRITE (2) = Write mode (erase previous contents)
    FileWrite($hFile, $aArray[0])
    FileFlush($hFile)
    FileClose($hFile)
EndFunc   ;==>CreateHtmlPage

; example got from here: http://www.w3schools.com/html/tryit.asp?filename=tryhtml5_draganddrop2
#cs;HTML
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <style>
    #div1, #div2 {
    float: left;
    width: 214px;
    height: 214px;
    margin: 5px;
    padding: 10px;
    border: 1px solid black;
    }
    </style>
    <script>

    function allowDrop(ev) {ev.preventDefault();}

    function drag(ev)   {ev.dataTransfer.setData("text", ev.target.id);}

    function drop(ev)   {
    ev.preventDefault();
    var data = ev.dataTransfer.getData("text");
    ev.target.appendChild(document.getElementById(data));}

    </script>
    </head>
    <body>

    <h2>Drag and Drop</h2>
    <p>Drag the image back and forth between the two div elements.</p>

    <div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)">

    <img src="https://www.autoitscript.com/forum/uploads/monthly_2016_01/Chimp.jpg.688f81fa865450e2913b5dc2cb56215f.thumb.jpg.96a6bfa47c0fb8476f39aaf55ad68ed0.jpg"
    draggable="true" ondragstart="drag(event)" id="drag1" width="214" height="214">
    </div>

    <div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div>

    </body>
    </html>
#ce;HTML
;

 

Edited January 1, 2017 by Chimp

[Gianni 803]

Hi,

What Follows works on systems with IE11 (doesn't works with IE9).
After further tests I've seen that:
If I want for example receive events from a DIV element, I have to pass to the ObjEvent() function an Object variable that points to that DIV,
But a strange "phenomenon" happens, that is:
If I get the Object reference to the DIV using this statement:

$oDiv1 = $oDocument.getElementById('div1')

The ObjEvent() function will not work,
while If I get the Object reference to that same DIV  by means of a reference to the global javascript object, then the ObjEvent() will work.

$oDiv1 = $ohJS.div1

.... this is strange because both ways used to get a reference to the DIV returns an object reference pointing to the same DIV (or in appearence it seems so).

anyway, the following listing works quite well and it can manage the events fired within the browser control directly in AutoIt.
Here the Drag&Drop of the Chimp picture is totally managed by AutoIt Functions.

Does someone knows why two Object variables, pointing to the same DIV, behave differently on the ObjEvent() function?

 

expandcollapse popup

#include <GUIConstantsEx.au3>
#include <string.au3>
#include <file.au3>

Global $oDocument

Example()
Exit

Func Example()
    ; read html page from bottom of this script
    ; and write it to a temp file on disk for later
    ; usage by the $oIE.navigate
    Local $sFilename = CreateHtmlPage()

    Local $hGUIMain = GUICreate("Event Test", 540, 400)

    ; We generate the Browser Control...
    Global $oIE = ObjCreate("Shell.Explorer.2")

    ; and we embed it into the AutoIt GUI
    $hIE = GUICtrlCreateObj($oIE, 5, 5, 530, 390)

    GUISetState() ;Show GUI

    ; load in the browser the previously created web page
    $oIE.navigate('file:///' & $sFilename)

    Do ; wait for document
        Sleep(250)
        $oDocument = $oIE.document
    Until IsObj($oDocument)
    ; $oDocument.execCommand("Refresh")

    ; $ohJS is a reference to the javascript Global Obj
    ; JSglobal is a variable created within the HTML
    ; https://msdn.microsoft.com/en-us/library/52f50e9t(v=vs.94).aspx
    ; -------------------------------------------------
    Global $ohJS = $oIE.document.parentwindow.JSglobal

    ; --- Setup catch of events ---

    ; The following array holds Handles returned by ObjEvent()
    ; (since this array is Local within a function, it will be
    ;  automatically destroyed when exiting from the function)
    Local $oEventObjects[3], $oDiv1, $oDiv2

    ; GETTING RFERENCE TO THE TARGET OBJ IN THIS WAY WILL NOT WORK
     $oDiv1 = $oDocument.getElementById('div1') ; Object reference to The DIV1 obj
     _ObjDescription($oDiv1, "refereced via $oDocument") ; show obj details just for debug
    ;  $oDiv2 = $oDocument.getElementById('div2') ; Object reference to The DIV2 obj

    ; GETTING RFERENCE IN THIS WAY WILL WORK INSTEAD (!!??) (don't ask me why.....)
     $oDiv1 = $ohJS.div1 ; Object reference to The DIV1 obj
     _ObjDescription($oDiv1, "refereced via $ohJS js gloaba obj") ; show obj details just for debug
     $oDiv2 = $ohJS.div2 ; Object reference to The DIV2 obj

    $oEventObjects[0] = ObjEvent($oDiv1, "IEEvent2_", "HTMLElementEvents2")
    _ObjDescription($oEventObjects[0], "ObjEvent for div1") ; show obj details just for debug
    $oEventObjects[1] = ObjEvent($oDiv2, "IEEvent2_", "HTMLElementEvents2")
    $oEventObjects[1] = ObjEvent($oDocument, "DocEvent2_", "HTMLDocumentEvents2")
    ; -----------------------------
    ConsoleWrite(@CR & @CR & @CR & "--- Events log ---" & @CR)
    ; Loop until the user exits.
    While 1
        Switch GUIGetMsg()
            Case $GUI_EVENT_CLOSE
                ExitLoop
        EndSwitch
    WEnd

    ; the end
    $oIE = 0 ; Remove IE from memory (not really necessary).
    GUIDelete($hGUIMain) ; Remove GUI
    FileDelete($sFilename)
EndFunc   ;==>Example

; following function should be fired by events
; occurred in the browser's objects
;
; The function automatically called by an event
; will receive as parameter an Event Obj.
; This obj is loaded with many properties related to
; the object that fired the event. See following link:
; https://msdn.microsoft.com/en-us/library/aa703876(v=vs.85).aspx

; --- events management zone ---
Volatile Func DocEvent2_onClick($oEvent)
    ConsolePrint("mouse click on " & $oEvent.srcElement.NodeName) ; & " ID:" & $oEvent.srcElement.ID)
EndFunc   ;==>DocEvent2_onClick

Volatile Func DocEvent2_onDblClick($oEvent)
    ConsolePrint("mouse DoubleClick:")
EndFunc   ;==>DocEvent2_onDblClick

; Drag related events
Volatile Func IEEvent2_onDragstart($oEvent)
    ConsolePrint("Drag of element " & $oEvent.srcElement.ID & " started")
    ; we save the data that we want to send to the drop element int the "dataTransfer" object
    $oEvent.dataTransfer.setData("text", $oEvent.srcElement.ID)
EndFunc   ;==>IEEvent2_onDragstart

Volatile Func IEEvent2_onDragOver($oEvent)
    Local Static $iX, $iY
    ; ConsoleWrite("Cancelabe? " & $ohJS.event.cancelable & @CRLF)
    $ohJS.event.preventDefault()
    If $iX <> $oEvent.x Or $iY <> $oEvent.y Then
        ; remember previous position
        $iX = $oEvent.x
        $iY = $oEvent.y
        ConsolePrint( _
                "DragOver " & $oEvent.srcElement.NodeName & " ID: " & $oEvent.srcElement.ID & _
                ". mouse pos is X:" & $oEvent.x & " y:" & $oEvent.y)
    EndIf
EndFunc   ;==>IEEvent2_onDragOver

Volatile Func IEEvent2_onDrop($oEvent)
    ConsolePrint("Drop event on " & $oEvent.srcElement.ID & ".")
    $ohJS.event.preventDefault()
    If _
            ($oEvent.srcElement.ID = "div1" Or $oEvent.srcElement.ID = "div2") _
            And $oEvent.dataTransfer.getData("text") = "chimp" Then ; allowed only chimp dropped on div1 or div2
        ; we move the dragged element (the ID is into the 'dataTransfer' object) to the dropped target
        $oEvent.srcElement.appendChild($oDocument.getElementById($oEvent.dataTransfer.getData("text")))
        ConsolePrint( $oEvent.dataTransfer.getData("text") & " dropped.")
    Else
        ConsolePrint("Dropping '" & $oEvent.dataTransfer.getData("text") & "' is not allowed")
    EndIf
EndFunc   ;==>IEEvent2_onDrop
; ------------------------------

Func ConsolePrint($sMsg)
    ConsoleWrite($sMsg & @CRLF)
EndFunc   ;==>ConsolePrint

Func _ObjDescription(ByRef $oObj, $msg = "") ; for debug purpose
    ConsoleWrite('--Debug:----------------------------------------------------------------------------' & @CRLF & _
            "[" & $msg & "]" & @CRLF)
    If IsObj($oObj) Then
        ConsoleWrite( _
                'The name of the Object:.......................' & ObjName($oObj, $OBJ_NAME) & @CRLF & _
                'Description string of the Object:.............' & ObjName($oObj, $OBJ_STRING) & @CRLF & _
                'The ProgID of the Object:.....................' & ObjName($oObj, $OBJ_PROGID) & @CRLF & _
                'file associated with the obj in the Registry:.' & ObjName($oObj, $OBJ_FILE) & @CRLF & _
                'Module name in which the object runs:.........' & ObjName($oObj, $OBJ_MODULE) & @CRLF & _
                "CLSID of the object's coclass:................" & ObjName($oObj, $OBJ_CLSID) & @CRLF & _
                "IID of the object's interface:................" & ObjName($oObj, $OBJ_IID) & @CRLF)
    Else
        ConsoleWrite("Is not an object" & @CRLF)
    EndIf
EndFunc   ;==>_ObjDescription

Func CreateHtmlPage()
    Local $sStart = @LF & "#cs;HTML"
    Local $sEnd = "#ce;HTML" & @CR
    Local $aArray = _StringBetween(FileRead(@ScriptFullPath), $sStart, $sEnd)
    Local $sPage = _TempFile(@ScriptDir, Default, ".html")
    Local $hFile = FileOpen($sPage, 2) ;  $FO_OVERWRITE (2) = Write mode (erase previous contents)
    FileWrite($hFile, $aArray[0])
    FileFlush($hFile)
    FileClose($hFile)
    Return $sPage
EndFunc   ;==>CreateHtmlPage

#cs;HTML
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <script type="text/javascript">
    var JSglobal = (1,eval)("this");
    </script>
    <style>
    #div1, #div2 {
    float: left;
    width: 214px;
    height: 214px;
    margin: 5px;
    padding: 10px;
    border: 1px solid black;}
    </style>
    </head>
    <body>
    <h2>Drag and Drop</h2>
    <p>Drag the image back and forth between the two div elements.</p>
    <div id="div1">
    <img src="https://www.autoitscript.com/forum/uploads/monthly_2016_01/Chimp.jpg.688f81fa865450e2913b5dc2cb56215f.thumb.jpg.96a6bfa47c0fb8476f39aaf55ad68ed0.jpg"
    draggable="true" id="chimp" width="214" height="214">
    </div>
    <div id="div2"></div>
    </body>
    </html>
#ce;HTML
;

 

Edited January 7, 2017 by Chimp