[Javascript tutorial] Be more annoying with less code

Mentor · 06-01-2007, 05:59 PM

Although there not as common as they used to be, the "Annoying" pages things are still around. You know, those pages when you are swamped with javascript alert box's and have to click through them.

Now if you then look at the source, it apparent that there terribly badly done. They waste alot of code, typing out every message by hand, when a simple function could easily do all the work for them. The most common usage is in the counting.

So this is a quick tutorial to show you how to do it more easily.

Constructs used
- Functions
- For loop
- While Loop
- If statements
- Alert boxes
- Confirmation boxes

The first function covered is counting.

Code:

function PointlessCount(start,end,way)
//Count to a number.
{
	if (way == 0) { 
		//Count forwards
		for (i=start; i<=end; i++) {
			alert(i);
		}
	}
	else if(way == 1) { 
		// count backwards
		for (i=start; i>=end; i--) {
			alert(i);
		} 
	}
}

All it does is simply create a loop and does the counting for you, you just tell it which way to count, and the numbers to start and stop at.

You'd call for it as so.
[code]PointlessCount(1,10,0); // count from 1 to 10
PointlessCount(20,1,1); // count backwards from 20 to 1[/quote]

The first number is the one it starts at.
The second number is the one it ends at
and the third number is which direction to count. 0 = forward. 1 = backwards.

The next function is split up sentences
This is just where you have a sentence, except that each word appears in its own separate alert box. Rather than 10 alerts, why not just write a sentence and make a function do the work for you.

Code:

function OneWordSentance(sentance)
//Show a sentence word by word
{
	var words = sentance.split(" ");
	for (i=0; i<words.length; i++) {
		alert(words[i]);
	}
}

This function simply takes a sentence, then splits it in to an array at each space with the split function. It then loops through the array alerting each word in order as it does so.

It would be called for as follows:

Code:

OneWordSentance("This text is split up, as you may have noticed. Yet didn't require a ton of alerts to do.");

Be even more annoying
As annoying as a long script like this is, the prospects of having to redue it because of one wrong click are even more annoying. This will also stop the holding down enter method somewhat, as users will have to be more cairful where the click. how?

Simply by throwing a while loop in to the mix, and adding a confirm box giving the option to escape. Since ok is selected by default, if there just holding enter down they will miss the opportunity and start it all over again.

Code:

//Create loop. It will keep going till they click cancel
while (answer == true) //is not true
{
	PointlessCount(1,10,0); // count from 1 to 10
	//The chance to escape...
	// if people just enter through it, they will miss the chance to exit every time.
	answer = confirm ("Click OK to go through this again, or cancel tostop"); // DO NOT REMOVE THIS CODE!
}

Selecting cancel will set answer to false, and the annoyance will end.
Selecting ok will just start it from the beginning again.

The full code.
A working example script using all of this, is as follows.

Code:

<Script>
//Annoying script
var answer = true;

//Create loop. It will keep going till they click cancel
while (answer == true) //is not true
{
	//The annoying stuff

	//OneWordSentance("Hello now you clicked this you have to put up with a lot of long and pointless rambling for no apparent reason");
	alert("First lets just count to 10");
	PointlessCount(1,10,0); // count from 1 to 10
	alert("Now lets count backwards from 20");
	PointlessCount(20,1,1); // count backwards from 20 to 1
	OneWordSentance("This text is split up, as you may have noticed. Yet didnt requre a ton of alerts to do it.");
	alert("'How nice' you think to yourself...");
	OneWordSentance("But! did you know");
	alert("Counting forwards and backwards is also done with very few alerts.");
	alert("But do you care?");
	alert("Probably not. so lets just count to 100");
	PointlessCount(1,100,0); 
	alert("STOP!");
	alert("STOP! you will regret it if you don't!");
	alert("You have a chance to escape. Just click Cancel on the next screen!. Don't and you will have to go through this all over again.");

	//The chance to escape...

	// if people just enter through it, they will miss the chance to exit every time.
	answer = confirm ("Click OK to go through this again, or cancel to stop"); // DO NOT REMOVE THIS CODE!
}

function PointlessCount(start,end,way)
//Count to a number.
{
	if (way == 0) { 
		//Count forwards
		for (i=start; i<=end; i++) {
			alert(i);
		}
	}
	else if(way == 1) { 
		// count backwards
		for (i=start; i>=end; i--) {
			alert(i);
		} 
	}
}
function OneWordSentance(sentance)
//Show a sentence word by word
{
	var words = sentance.split(" ");
	for (i=0; i<words.length; i++) {
		alert(words[i]);
	}
}
</script>

I will appreciate any feedback (even if you just think im mad for giving some of the more noobish and annoying members the ability to create even more annoying scripts) or any suggestions on what should be added to it.

Note: Creating an infinite loop would just be evil, not annoying nore a funny prank, just plain mean. Hence why the ability to escape the loop is important and should not under any circumstances be removed.

(if you do get trapped in an infinite loop, you can escape by closing the browser process. Click ctrl-alt-del. Select the processes tab (if there are no tabs double click the edge of the box). Then select your browsers process.
If your in firefox: firefox.exe, If your in IE: IEXPLORE.exe. Right click it and select end process. Your browser will close, then you can just reopen it and carry on browsing normally.)

Edited by Lµke (Forum Moderator): Thread moved to Website Designing Tutorials. Nice Tutorial .

beddy · 06-01-2007, 06:03 PM

hey, its a great idea, there are a lot of them annoying pages about but not alot of tutorials on how to make them lol.
And telling people how to get out of the infinate ones is great aswell + rep

Mentor · 07-01-2007, 10:45 AM

Originally Posted by beddy

hey, its a great idea, there are a lot of them annoying pages about but not alot of tutorials on how to make them lol.
And telling people how to get out of the infinate ones is great aswell + rep

Thanks, the escape method isnt the best really, and its pretty obvious to alot of computer literate people, but i though those who are only cause browsers may not know that u can end an app from the processes, hence have to reboot or go through unnecessary bother in escaping the annoyances "/