Couple of days ago I came across a fantastic challenging application in Facebook which is called “click test”. This application measures your click per second and you have to click as much as you can in 10 seconds. For sure in my 130 friend there are many who can click more than me, but I had to do my bests especially a friend of mine (Kambiz) who is not only good at typing and clicking but also good programming. What should I do! should I left the battle or keep challenging? Of course I have to stay in this battle. I tried to score a good click per second but honestly the best I did was about 90 clicks per second which is lower than lots of my friends. 

What is “click test” application? This is a simple but ton that you have to click on with a countdown timer which runs inside browser. Ok, the first thing pops in mind is writing a simple application to simulate clicking on this button. Ohhh, you have to find browser windows handle then use SendMessage with appropriate (wParam, lParam) parameters to simulate clicking on specific area of window. That sounds great. But the fact is I’m more JavaScript and HTML guy than *API* guy. So let Keep It Simple Stupid (KISS).

If you view source of “test” application page you’ll face huge amount of complex source code which is really complicated. At the be ginning I wanted to find the function which is responsible for counting down t from 10 to zero and then increase it but the code is really messy and it takes time to find the function you want. Should I inspect all HTML and Jscript source code? The answer is No

Recently browsers are delivered with quite sophisticated feature for developers. For example Internet Explorer 8 has got famous feature which is called “Developer Tools” and you can activate it by pressing F12. Having pressed F12, nice window will be displayed to help you debug your HTML and JavaScript. 

Ok to find start button you can press Ctrl+B or select Find -> Select element by click. 

Then move your mouse to element that you want inside browse. 

As soon as you move your mouse inside browse you’ll notice that browser mark current element by bordering it. So find start button and then click on it. Gotcha! Developer tools automatically scrolls to input tag related to selected element. You can also scroll horizontally to find “onmouseup” which is actually responsible for counting your clicks. Ok, double click inside onmouseup and then press Ctrl+A to select all body of onmouseup. 

So I can copy this element into clipboard and then paste in notepad. You may also have somthing similar to following:

fbjs_sandbox.instances.a130168443678744.bootstrap();
return fbjs_dom.eventHandler.call([fbjs_dom.get_instance(this,130168443678744),function(a130168443678744_event)
{a130168443678744_game.update($FBJS.ref(this).getForm())},130168443678744],new fbjs_event(event));

Actually this is an event handler and this code runs every time you click on your mouse button. But it’s rather complicated. It calls a function at first and then calls another function. So If I want to change this code I have to find these functions and then change body of them. 

But what if I don’t change any code and just make this event handler to run multiple times per click. That is sound good idea. So let copy and paste event handler for couple of times. But I should notice that second function call has “return” and I have to remove it for my new copies, and just leave it for last one.

fbjs_sandbox.instances.a130168443678744.bootstrap(); fbjs_dom.eventHandler.call([fbjs_dom.get_instance(this,130168443678744),function(a130168443678744_event) {a130168443678744_game.update($FBJS.ref(this).getForm())},130168443678744],new fbjs_event(event)); 
fbjs_sandbox.instances.a130168443678744.bootstrap();fbjs_dom.eventHandler.call([fbjs_dom.get_instance(this,130168443678744),function(a130168443678744_event) {a130168443678744_game.update($FBJS.ref(this).getForm())},130168443678744],new fbjs_event(event)); 
fbjs_sandbox.instances.a130168443678744.bootstrap();return fbjs_dom.eventHandler.call([fbjs_dom.get_instance(this,130168443678744),function(a130168443678744_event) {a130168443678744_game.update($FBJS.ref(this).getForm())},130168443678744],new fbjs_event(event));

As you see I copied all code for three times and left return just for last call. It means my clicks will be tripled and I can register 150 clicks just for 50. It’s good. So let’s copy this code back to onmouseup element it is ready for testing. 

Enjoy it!

Developing ASP.NET web controls is always interlocked with creating javascript codes in order to create client side functions. Moreover, a developer always has a tendency to release minimum files, most of the time an assembly (DLL) which includes all requirements for web control, is best case. This post is an attempt to represent how to embed JS file in an assembly.

First of all you have to create an ASP.Net AJAX-Enabled Web Site  named "EmbededJSTest" and add System.Web.Extensions references to project . In order to add this assembly you have to install  ASP.NET AJAX 1.0. Add another Web control library project to solution named "EmbededJSControl". Add project reference of "EmbededJSControl" to "EmbededJSTest".

Create a JavaScript File to project named "JSResource.js". Open js file and write code:

function HelloWorld()

{

alert('Hello World!');

}

Save and close this file

In property page of this file change the value of "Build Action" Property to "Embedded Resource".

Open AssemblyInfo.cs  at the end of file add following line

[assembly: System.Web.UI.WebResource("EmbededJSControl.JSResource.js", "application/x-javascript")]

Open Default.aspx file in source mode. Change ScriptManager Control to following:

<asp:ScriptManager ID="ScriptManager1" runat="server" >

<Scripts>

<asp:ScriptReference Assembly="EmbededJSControl" Name="EmbededJSControl.JSResource.js" />

</Scripts>

</asp:ScriptManager>

Add a HTML button :

<input id="Button1" type="button" value="Hello" onclick="HelloWorld()" />

Save file and close this file.

 Execute project and click on Hello button.

 By applying this method in your Web Control projects there is no need to release js file with assembly dll's.

You can also download source sample here