Archive for the ‘Programming’ category

SimpleTabs: A pure javascript easy tab implementation

February 18th, 2010

I’ve written — and lost — at least two reusable tab components in Javascript before. So I’m posting this one here as a reminder to myself to never, ever, ever write one of these again.

There are tons of HTML tabbing classes/functions/extensions/plugins/blahblah out there but almost every one I’ve ever found has been a plugin for [insert Javascript library here]. I don’t see a point in using [insert Javascript library here] just to have 3 tabs on a page, do you?

So here it is, a simple tab class with callbacks that could be extended to do all your tabbing needs at 1.7kb min’d. You could probably get that down to 1k if you really wanted to and didn’t need callbacks. What’s an extra 1.7kb in your Javascript file? You are including a single JS file instead of ten 5kb files, aren’t you?

Source/examples after the break.

» Read more: SimpleTabs: A pure javascript easy tab implementation

Separate RGB Channels from an Image in PHP

January 20th, 2010

Divide an conquer! That’s what I always say. But how do you go about dividing an image up into it’s separate channels–like Photoshop does it?

There are actually two ways to go about doing it. First, is displaying the actual amount of red, green, or blue that is contained in each pixel which results in images that are made up entirely of shades of the color channel that you are viewing. The second is to to simply display the information in an easily understood visual representation by using shades of grey. Both are detailed below.
» Read more: Separate RGB Channels from an Image in PHP

pr() a print_r enhancement for your HTML web page

January 18th, 2010
function pr ($mixed)
{
	echo '<pre>' . htmlentities( utf8_encode( print_r( $mixed, true ) ), ENT_QUOTES, 'utf-8' ) . '</pre>' ;
}

When writing PHP, I often find that I need quick debug access to an Object or Array to see what it contains. PHP provides print_r, which works great–except that the data appears without all the tabbing in regular ol’ HTML. This is annoying for large Arrays or complex Objects.

That is why I created the pr() function. It basically just wraps the output of print_r in pre tags and then your formatting is back.

Depending on the encoding of the data you are passing to and getting from print_r, you may run across problems when combining print_r and htmlentities (with utf-8). If the encodings don’t match, it may return nothing at all! This could either mean that the variable is some kind of empty, or it could mean that htmlentities didn’t like the encoding that was returned by print_r, and crapped all over itself.

So, you first have to convert the data returned by print_r to utf8 (or whatever the encoding of your web page is) before passing it along to htmlentities. Since I try to keep every web page I work on in utf8, I keep this function set up to compliment that.

As long as you have a working utf8_encode, this function should always output pretty, utf-8 encoded data in HTML. If you need to convert to some other encoding beside utf8, you can use mb_convert_encoding.

More examples of image manipulation with PHP

January 14th, 2010

All of these examples use the PHP simple image manipulation class that I created.

Every now and then I write a batch image converter snippet that others might find useful. I figure I’ll post them here for my benefit and yours. These snippets will also serve as a way to better understand the class. As I come up with these in life, I’ll update this post.

All of these examples assume that you’ve already included the class in your file.

» Read more: More examples of image manipulation with PHP

Simple Image Manipulation in PHP (Rotate, Resize, Crop, Flip and Mirror, Thumbnails square and regular)

December 31st, 2009

UPDATE: I’ve added support for PNG alpha transparency which makes this class significantly more useful. Changelog in the class code below.

I keep misplacing this class so I figured I’d post it here so that I know where it is.

I wrote/assembled this class because I wasn’t happy with any of the image manipulation libraries out there. They are either way too complex with a steep learning curve or didn’t work all that great. (I didn’t see any reason to load up a class with 3,000 lines of code just to resize or rotate an image.)

So here it is, a simple class that allows you to open an image, perform common operations, and save. There are no bells and whistles or anything exciting here. Just a collection of commonly used image manipulation functions: Rotate, Flip, Resize, Thumbnail (square and regular), and Crop.

A lot of the class code is original but some of it has been gathered over my life as a programmer from long lost sources. If you recognize your work, leave a comment and I’d be happy to cite you!

» Read more: Simple Image Manipulation in PHP (Rotate, Resize, Crop, Flip and Mirror, Thumbnails square and regular)

Another look at Repeatable Random

December 3rd, 2009

My last post was about a similar subject only with an emphasis on generating an evenly distributed set of random numbers that existed between a minimum and maximum value.

I found this post from Jackson Dunstan about a repeatable random class written in AS3.  In that post, he mentioned that it could easily be ported to Javascript or other languages — and he was right.  Here is that class written in Javascript and as far as I can tell, it does indeed produce a repeatable random set of numbers.

His class works by taking an initial seed number, performs a simple mathematical calculation, and then returns it before making it the new seed number, and starting the cycle over. The result is a set of random numbers that are repeated based on the starting seed number.

A technique such as this is mainly used for video games but it could also be useful in web development to randomly place objects on a page. This code doesn’t do much of anything by itself but is a good jumping off point. See a working example at the bottom of this page.

» Read more: Another look at Repeatable Random

Repeatable Random: An even distribution of pseudo-randomness

December 2nd, 2009

duck_goose_medium

Does the concept of true randomness really exist?  To tackle that question we must first ask ourselves, does free will exist, or are all our lives pre-determined based on some cosmic event that happened billions of years ago?  That is a question I’m not going to even try to answer in this post. Instead, I will provide you with a simple PHP function that can provide you with a repeatable random number generator.

OK, maybe “random number generator” isn’t an accurate name for it. Perhaps hasher-to-evenly-distributed-values generator would be a much better title since that is exactly what it does.

Why would you need such a thing?

Random numbers are great. They allow you to give your web applications some personality. Let’s say you only want to display a message on a web page ~10% of the time. Random numbers allow you to do this. You would simply do something like: if ( rand ( 1, 10 ) == 5 ) echo ‘This is my message. I display about 10% of the time!’;

That’s all well and good, but what if I want to display a random message to my visitors AND make sure they see the exact same one each time? Not possible with plain ol’ random.

However, it is possible with this very simple repeatable_random PHP function.

» Read more: Repeatable Random: An even distribution of pseudo-randomness

Detecting IE with PHP to enable display:table-cell CSS

October 30th, 2009

An ugly hack for an ugly web browser.

I love the display:table-cell.  It gives you the ability to vertically align stuff.  It’s great.  With display:table-cell, you don’t ever need table layouts again.

The problem?  I’m sure you already know or you wouldn’t be reading this.  Internet explorer, the bastard son of the web browsing world, doesn’t support it.  (IE8 does, but IE8 still sucks for other reason.)

My solution involves  (the normally bad idea of) changing output based on user agent strings.

» Read more: Detecting IE with PHP to enable display:table-cell CSS

Getting a weighted random value in PHP

July 15th, 2009

I am mainly posting this code here because I keep misplacing it on my own hard drive.  And that usually leads to it being forgotten and lost…  if there is anything confusing here, don’t hesitate to ask in the comments–I wrote this a bit fast.

What is a weighted random value?  Take a look at this (poor) example…

You have an array of shades of grey in hex:

$colors = array('000','1f1f1f','3f3f3f','666','999','ccc','eaeaea','f0f0f0');

You have a table of data and you want to give each row a random background color that is one of those shades.

Simple, right?  echo $colors[array_rand($colors)];

But, what if you want to return the colors around #999 more often than the rest?  » Read more: Getting a weighted random value in PHP