The Original Jelani Harris

There are times that you do not want a form to automatically submit when a user hits the enter key. Or if you want to do some validation via javascript before you allow the submit to go through.

//Bind this keypress function to all of the input tags
$("input").keypress(function (evt) {
//Deterime where our character code is coming from within the event
var charCode = evt.charCode || evt.keyCode;
if (charCode  == 13) { //Enter key's keycode
return false;
}
});

By returning false in the keypress function it tells the browser not to allow the enter key event.

When dealing with tag inputs from users, I find myself having to make sure they they don’t enter in any blank or empty tags. Then I realized that I needed to find out how to remove undesirable elements not only from the Php side, but also from the Javascript side as well. Thus, here are some functions that may help some other people out if they’re searching for similar functionality.

In PHP

    foreach ($my_array as $key => $value) {
      //We check to make sure that the value is either null or just an empty string
      if (is_null($value) || $value=="") {
        unset($my_array[$key]);
      }
    }

An easier way to clean arrays is to use php’s array_filter function without a callback parameter. By default that function is set to remove elements that contain a false (or a 0), null or a “”. I mean seriously, look at how much cleaner it is:

   //This prunes out 'false', '0', 'null' or ''
   $my_array = array_filter($my_array);

In JavaScript

We can mimic the functionality of Php’s array_filter in Javascript by using the Array.filter function.

   var my_array = [1,2,3,'4','', 0, null, 'false'];
   function emptyElement(element) {
	//Removes nulls, zeros (also falses), text version of false, and blank element
	if (element == null || element == 0 || element.toString().toLowerCase() == 'false' || element == '')
		return false;
		else return true;
	}
 
	var my_array = [0,'false',1,null, 2,'',3,'4',false];
	my_array = my_array.filter(emptyElement);
   }

Then my_array will include 1,2,3,4.

I hope this was somewhat useful.

When I first started to use Flash CS3 in Vista I noticed that all of my flash movies were performing very very slowly.

Honestly .. I’m not sure why. But, here’s how you can make it perform better.

Here's how to speed up flash CS3 for vista

1. Navigate to your Program Files -> Adobe folder(s) -> Adobe Flash CS3 and find the Flash.exe.
2. Right click on that file and goto the Compatibility tab.
3. Check “run this program in compatibility mode”, and voila, suddenly it’s running as fast as it did on XP. Happy coding!

The replaceAll function in the java.lang.String class replaces each substring found in that matches the regular expression to replace.

String sentence = "The sly brown fox jumped over the lazy fox.";
String result = sentence.replaceAll("fox", "doggie");
System.out.println("Input: " + sentence);
System.out.println("Output: " + result);

Would output:

Input: The sly brown fox jumped over the lazy fox.
Output: The sly brown doggie jumped over the lazy doggie.

However there are cases where we want to replaceall substrings and ignore the case, or make it case insensitive.

String sentence = "The sly brown Fox jumped over the lazy foX.";
String result = sentence.replaceAll("fox", "dog");
System.out.println("Input: " + sentence);
System.out.println("Output: " + result);

Input: The sly brown Fox jumped over the lazy foX.
Output: The sly brown Fox jumped over the lazy foX.

To create the case sensitive version of replaceAll we do not need to create a new wrapper function or create a utility class somewhere. All we need to do is prepend the Case-insensitve pattern modifier (?i) before our regex to indicate that we don’t care about the case sensitivity of the regex.

String sentence = "The sly brown Fox jumped over the lazy foX.";
String result = sentence.replaceAll("(?i)fox", "dog");
System.out.println("Input: " + sentence);
System.out.println("Output: " + result);

Input: The sly brown Fox jumped over the lazy foX.
Output: The sly brown dog jumped over the lazy dog.

One of the only Google app (apart from Gmail) that I use the most Google Notebook will have no more updates. Before I signed up to Google I used to keep all of the websites that I thought were useful in my bookmarks and that became really messy really quickly. Also with the useful firefox extension I can now just right click and add to notebook if I ever run across a website that I want to return to later.

Google notebook isn’t perfect. I just wish they would continue making it a better product. But now that I think about it, Google is an company that makes most of it’s revenue selling advertisements online (that I hardly see due to AdBlock) and I don’t see how they could’ve made their Notebook app a profitable endeavor. I know that I wouldn’t pay for a “pro” version, and that their ads  would be GreaseMonkey‘d out or plain ignored – all I want is a list of bookmarks not solicitations!

Now I’m going to search online for other alternatives to replace and to transfer all of my bookmarks to. I’m looking at delicious right now – I just don’t like sharing my bookmarks with the world too much. But maybe I’ll let it go once I get my lifestream properly set up on here.

I just have to say that the newest version of WordPress is really, really slick.  My favorite part is that now WordPress can upgrade itself and I don’t have to rely on a plugin to automatically upgrade my wordpress pages for me.

At first it really disturbed me at how fast wordpress would push out updates, but now I really don’t need to worry about it anymore. WordPress has now become it’s own little platform. It’s almost like SaaS (Software as a Service), but it’s running locally on your server.

Now I just need to make some plugins.

Guess what? It’s not possible! in Opera 7.20, IE 5.5 or IE 6.0. Instead what happens is that it’s treated like a regular table without the scrollbars. Also, the styling specified for the tbody is applied to every tr row. How lame.

Another reason why we all should just stop supporting IE 6.0.

Here is something useful that I discovered in my programming for the Apparatus Complex. I needed to strip out the anchor portion of a link and leave the rest of the url intact. For example I wanted:

http://www.jelaniharris.com/blog/I-love-apple-pies#comments

To look like:

http://www.jelaniharris.com/blog/I-love-apple-pies

Here’s the ideal way to do this with Javascript:

1
2
3
4
5
6
7

	//Grab our current Url
	var url = window.location.toString();
	//Remove anchor from url
	var anchor_index = url.indexOf('#');
    if (anchor_index != -1) {
    	url = url.substring(0, anchor_index);
    }

It doesn’t get any easier than that. What this code does is that it grabs the URL from the current window, and then finds the index into the string where the ‘#’ is. Then if it exists, it truncates the string up to the ‘#’.

I officially declare JQuery to be the best javascript library out there. So much documentation, so many plugins, so many interesting things you can DO with that library. I just lost 7-8 hours, implementing a prototype of a feature for my discussion site, Apparatus Complex. In particular it’s a meta-game that I’m developing so that users can compete with each other in a role-playing game  while they wait for the site to update itself with content from other people.

So I had a crazy idea of using jquery and ajax to let people drag and drop equipment into slots, and then dynamically update what that piece of equipment would do to their statistics. Doing this in flash is really easy, I first got the drag and drop implemented (so easy with the Jquery UI), then I set the restrictions on which column each orb could belong in, and then I added the automatic update of the statistics just moments later. It was simply brilliant and it was pretty darn efficient. If you want to play around with this, it’s located right here. The equipment orbs are generated randomly and so are the names.

By the way, MooTools and Prototype and Scriptalicious are okay as well. I’m just really impressed with JQuery right now.

Recently I was working on a few functions that I didn’t want to have activated immediately after hovered over a div. I neededthe functions to activate after a half a second of hovering by the user. To do this I created this this piece of code.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

var display_timeout = 0;
$(".orb_space").hover(function () {
 
		if(display_timeout != 0) {
				clearTimeout(display_timeout);
		}
 
                // save a reference to 'this' so we can use it in timeout function
		var this_element = this;
                display_timeout = setTimeout(function() {
				display_timeout = 0;
				// perform things with this_element here buy referencing it like $(this_element)
				if (!$(this_element).hasClass('magic')) {
					performRollinMagic();
				}
			}, 500);
 
	},
		function () {
			if(display_timeout != 0) {
				clearTimeout(display_timeout);
			}
			performRolloutStuff();
		}
);

Let’s go through line by line to see what’s happening here.

Lines 2: The JQuery hover function has two parameters. The first parameter is for the function to call when the user hovers onto the element, and the second one is for when the user hovers out. Lines 4-16 consist of the first function and lines 19-24 consist of the second.

Lines 4-6: So if we happen to flash our mouse over the element very fast twice, this will make sure that we only have one timeout function happening.

Line 9: When we in the setTimeout function we need to remember a reference to our current element so that we don’t have to do some tricky DOM navigation to get the hover activated element with the setTimeout event. It’s just easier to just make a variable to remember the element.

Lines 11-15: First we reset the display_timeout variable, and then we can perform our necessary hover actions in this setTimeout function. The 500 indicates that we want this function to occur after 500ms.

Lines 20-23: This looks very familiar doesn’t it? It’s the same thing from lines 4-6. This is so that if the user rolls out of the hover element, the timer countdown will immediately stop and the hoverin functions will not occur.