How to issue mouse events using Javascript in your macro

Share your tips, tricks and favorite iMacros macros, scripts and applications for web automation in general here.

Moderator: iMacros Moderators

How to issue mouse events using Javascript in your macro

by davidpoor on Tue Nov 06, 2012 2:12 pm

iMacros for Firefox does not support DS commands or the SIZE command so we need a work-around if we need to properly control mouse events. .

This workaround is for times when you need explicit mouse events: mouse down, mouse up, double click, or click. (The click event is needed when the TAG command does not work).

To simulate the DS commands by positioning, you would need accurate X/Y locations which are relative to the left and top of the active screen. However, many many web pages are centered when there is a large active area, so the X coordinates may not be valid. While it may be possible to recalculate the X/Y coordinates based on the actual screen area, it is, at best, difficult to issue mouse commands by X/Y coordinates alone.

So, this is based first on (a) locating the HTML object, and then (b) issuing a "Mouse Event" for that object.

DS_Mouse.iim: Save the following as DS_Mouse.iim (it should be all one very long line):
Code: Select all
URL GOTO=javascript:var<SP>_DS_button="LMR".indexOf("{{_DS_Command}}".charAt(0));if(_DS_button<0){_DS_button=0;}var<SP>_DS_fn="click";switch("{{_DS_Command}}".substring(1)){case<SP>"DOWN":_DS_fn="mousedown";break;case<SP>"UP":_DS_fn="mouseup";break;case<SP>"DBLCLK":_DS_fn="dblclick";break;case<SP>"OVER":_DS_fn="mouseover";_DS_button=0;}var<SP>_DS_obj=document.getElementById("{{_DS_ObjectId}}");var<SP>_DS_event=document.createEvent("MouseEvents");_DS_event.initMouseEvent(_DS_fn,1,1,window,0,0,0,0,0,0,0,0,0,_DS_button,null);_DS_obj.dispatchEvent(_DS_event);_DS_obj.focus();


USING DS_Mouse.iim:

In your controlling program, set the id of the HTML object and the command to be executed, then call the macro.

    The HTML object must have an id attribute, e.g. <div id="someElementId">. If the target object does not have an id, you will need to modify the macro and use a different technique to select the HTML object.

    The function must be one of the supported DS Functions:

      Mouse position: MOVETO
      Left button: CLICK, LDOWN, LUP, LDBLCLK
      Middle button: MDOWN, MUP, MDBLCLK
      Right button: RDOWN, RUP, RDBLCLK

To control the mouse, you need only add three lines to your program such as:
Code: Select all
   iimSet("_DS_ObjectId","someElementid");
   iimSet("_DS_Command","LDOWN");
   iimPlay("DS_Mouse.iim");


TECHNICAL: The _DS_Mouse.iim macro uses javascript to create and execute a mouse event on the specified object, using
the following code:

Code: Select all
URL GOTO=javascript:

//  NOTE:  Because the variables are all global, they are relatively long

//  Get the button: 0=left, 1=middle, 2=right
var _DS_button="LMR".indexOf("{{_DS_Command}}".charAt(0));
if (_DS_button<0){_DS_button=0;}

//  Convert the DS Command to a mouse eventr function
var _DS_fn="click";
switch("{{_DS_Command}}.substring(1)){
    case "DOWN":_DS_fn="mousedown"; break;
    case "UP":_DS_fn="mouseup"; break;
    case "DBLCLK":_DS_fn="dblclick";break;
    case "OVETO":_DS_fn="mouseover";
_DS_button=0;}
   
//  Get the target   
var _DS_obj=document.getElementById("{{_DS_ObjectId}}");

//  Create and dispatch the mouse event
var _DS_event=document.createEvent("MouseEvents");
_DS_event.initMouseEvent(_DS_fn,1,1,window,0,0,0,0,0,0,0,0,0,_DS_button,null);
_DS_obj.dispatchEvent(_DS_event);

//  The following is here only to prevent the javascript from being treated as a new page to display
_DS_obj.focus();


The actual macro is made up of the following lines concatenated together

Code: Select all
URL<SP>GOTO=javascript:
var<SP>_DS_button="LMR".indexOf("{{_DS_Command}}".charAt(0));
if(_DS_button<0){_DS_button=0;}
var<SP>_DS_fn="click";
switch("{{_DS_Command}}.substring(1)){
case<SP>"DOWN":_DS_fn="mousedown";break;
case<SP>"UP":_DS_fn="mouseup";break;
case<SP>"DBLCLK":_DS_fn="dblclick";break;
case<SP>"OVETO":_DS_fn="mouseover";_DS_button=0;}
var<SP>_DS_obj=document.getElementById("{{_DS_ObjectId}}");
var<SP>_DS_event=document.createEvent("MouseEvents");
_DS_event.initMouseEvent(_DS_fn,1,1,window,0,0,0,0,0,0,0,0,0,_DS_button,null);
_DS_obj.dispatchEvent(_DS_event);
_DS_obj.focus();


November 15, 2012: Added support for MOVETO as "mouseover" event.
davidpoor
 
Posts: 33
Joined: Fri May 23, 2008 1:45 pm

Return to How-To's and useful iMacros: All other topics

Who is online

Users browsing this forum: No registered users and 1 guest

-->