Daily Bits

Top 10 Ubuntu Linux Games

by 2 Comments

Many Windows users are reluctant to switch to Linux because they like to play games once in a while. While this theory holds true to hardcore gamers (the Windows platform does have some exclusive and popular titles), the same cannot be said about casual gamers.

The open source community has being busy developing a myriad of games for the Linux platform, and most of them are as fun as their PC counterparts. Recently I came across an article titled “Top Ubuntu Linux Games,” which listed the most popular ones. Here they are:

  1. Tremulous
  2. Grid Wars
  3. VDrift
  4. World of Padman
  5. Nexuiz
  6. Scorched 3D
  7. Glest
  8. Battle for Wesnoth
  9. Urban Terror
  10. BZFlag

Getting Started with PHP: Part 2 – Variables

by 2 Comments

This is part 2 in a series of articles aimed at helping you get started programming with PHP. In part 1 of the series, I covered the basic building blocks of a PHP script, and then showed how to write a simple Hello World! program in PHP. In this article, I will cover one of the most basic tools for creating more interesting programs: variables.

Variables are used to store data inside of your program. This data can be a wide variety of things, such as numbers, character strings, or even lists. In PHP, variables must begin with a dollar sign, followed by the name of the variable. The variable name must begin with either a letter or an underscore, followed by any combination of letters, numbers and underscores. Here are a few examples of valid variable names:

<?php
$my_variable;
$anotherVArIabLe;
$_1more;
?>

To make your programs more readable, it is usually a good idea to give your variables names that indicate what they are being used for. If you had a variable that was used to keep track of the subtotal for a sale, you might name it something like $subtotal. One important thing to note is that the variable name is case-sensitive, so $myvariable and $myVArIabLe would be seen as 2 different variables. It is usually a good idea to pick a naming convention, and stick with it. That way you don’t end up digging through your code to find a bug, trying to figure out which variables are being used for what.

Declaring and Initializing Variables

When we declare a variable in PHP, we can also assign a value to that variable at the same time. Let’s take a look at an example:

<?php
$variable1 = 7;
$variable2 = "abra cadabra";
?>

After this code is executed, $variable1 contains the number 7, and $variable2 contains the character string “abra cadabra”.

Basic Variable Operations

Once we have initialized our variables, there are a number of operations that we can perform on them. For numeric variables, we can perform mathematical operations:

<?php
$variable1 = 4;
$variable2 = 2;
echo $variable1 + $variable2;
echo $variable1 - $variable2;
echo $variable1 * $variable2;
echo $variable1 / $variable2;
?>

As we learned in the previous article, the echo function displays in the web browser whatever comes after it. The 4 echo commands in the code above would display 6, 2, 8 and 2, respectively.

We can perform similar operations on character strings, although it doesn’t make much sense to multiply 2 character strings together (what would “Hello” * “World!” equal?). Instead, we can concatenate 2 strings together using a period;

<?php
$variable1 = "Hello";
$variable2 = " World!";
echo $variable1 . $variable2;
?>

The echo command above would result in “Hello World!” being displayed to the screen. Not very exciting, I know, but I’m sure you can think of some more interesting uses for this.

For Next Time

After reading the first 2 articles in this series, you should be able to start writing programs in PHP that are a little more interesting. Try thinking of some more interesting uses for variables than just what I showed in the examples. Stay tuned for the next article in this series, which will focus on program control structures (if/else blocks, for/while loops). Now we’re really getting somewhere!

You can already read Getting Started with PHP: Part 3 – Program Control Structures.

The Dangers of the Blogging Rumor Mill

by 12 Comments

Darius Monsef posted a fascinating article over at YoungGoGetter this weekend that points to some of the current major weaknesses in blogging.

bloggingrumor.jpg

He writes about contacting Nissan to confirm a story regarding their new color changing paint technology, a story that he picked up on several blogs last week, only to find out that Nissan had no idea what he was talking about. In his search to uncover where exactly this bad information came from, he traced a history of posts that embellished the original story with minor lies, and yet others that referenced the information in those posts as fact. When all was said and done, he revealed what must be an embarrassing incident for some top-name blogs like Engadget, Gizmodo, and Wired.

He boils it down like this:

So in only 3 days, the details of the story went from:

‘color changing paint technology is being viewed by Nissan and other auto companies’
to…
‘Nissan talking up their bogus but juicy claim to have developed a self-healing paint system that can actually change color based on your mood, will be on production vehicles by 2010.’

It’s incidents like this that give blogging a bad name. Sure, not all bloggers have had formal journalism training (I certainly haven’t), but it shouldn’t require a journalism degree to realize that you should always check your sources and never embellish a story with misinformation.

So how did this happen? It appears as if some of the defining characteristics of blogging ended up failing us: For one thing, the blogosphere is basically a giant echo chamber. Many blogs tend to cover the same stories, and subsequently, they often source each other. While this leads to a fascinating level of conversation unheard of in traditional print media, it also leads to the spread of misinformation if a story is poisoned along the way. Darius likens what occurred in this instance to a childhood game of telephone, and I find that to be a fitting description.

In addition, bloggers don’t have the same restrictions with editorial oversight as a traditional media outlet. There isn’t much in the way of fact checkers and editors making sure your entire story is kosher. While this allows bloggers to respond to news in a more immediate and unfiltered fashion, it also means that there is very little in the way to stop bloggers from writing inaccurate stories, either on purpose or accidentally. In truth, it’s tough to be one’s own editor, which is why I recommend finding a blogging buddy if you need a fresh pair of eyes on a story.

Of course, traditional media outlets aren’t without similar gaffs, but that still doesn’t excuse this fiasco. Blogging is still a very young form of journalism, and bloggers have to realize that everything they do, from catching great stories, to embarrassments such as this, are all viewed more critically than most other forms of journalism. This is even more true for professional bloggers, like the folks working for Engadget and Gizmodo, because they are viewed as the most “legitimate” sorts of blogs. Hopefully this incident will serve as a cautionary tale for budding bloggers, as well as a reminder to those involved about journalistic integrity.

PNG Alpha Transparency in Internet Explorer

by 8 Comments

Most casual web developers (and a fair number of professional developers) use JPEG or GIF images on the web, but there is another contender out there: PNG, which stands for Portable Network Graphics.

Why use PNG?

  • Better compression without loss of quality (i.e., you don’t get those weird "artifacts" that show up when you crunch a JPEG image)
  • Larger color palette than GIF
  • It’s open source!

Alpha Transparency

Probably the most exciting part about PNG files is that they support full alpha transparency. What does this mean? Well, with a GIF image, you can knock out a specific color and have transparency. With a PNG image you can do that, plus you can choose to have elements be semi-transparent.

Here are two example images. Note: this is simulated, but these are the kind of effects you could achieve:

Simulated GIF Effect

gif-simulated.png

Simulated PNG Effect

png-simulated.png

But what about Internet Explorer?

This is obviously a huge boost to web design, but the problem, as is often the case, is Internet Explorer. Prior to IE7, IE did not support alpha transparency. You could use PNG images and get all the other perks, but it would substitute a light grayish color in place of your transparency.

Every other major browser from the last few years could handle PNG alpha transparency, but unless you wanted to have duplicate versions of your site, one with PNGs and a simpler version of the design with GIFs for IE, most developers avoided PNG images. However, there has been a solution under our noses the whole time that I recently discovered: AlphaImageLoader Filter.

The AlphaImageLoader Filter

AlphaImageLoader is a proprietary IE function, and with it, you can utilize alpha transparency in PNG files. All you do is insert some code into your image tag, and presto, instant transparency support. This example is for a graphic of a smiley face that is 200px by 250px, where PATH represents the path to the image file:

<img src="PATH" alt="Smiley Face" width="200" height="250" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='PATH',sizingMethod='scale');" />

Basically, this little bit of faux-CSS coding loads the filter and processes the image before displaying it. Note that you must specify a height and width for the area that the image will fill (this is known in CSS as a "bounding box"). However, if you always write valid code, you will have included this information already.

Customizing AlphaImageLoader

You have a few options with this filter to control how IE processes the image. These are especially useful if you are using PNG files to create a transparent background for an element. If you put the following words as the value for "sizingMethod" you will get the following effects:

  • crop: this crops off the edges of the image that don’t fit into the bounding box
  • image: this is the default, and resizes the bounding box to fit the image
  • scale: this scales (up or down) the image to fit the bounding box

The Catch

Unsurprisingly, this is not a piece of valid CSS, and if you put this in your document, it will no longer validate properly. The solution? Conditional Comments. As I explained in a previous post, you can use another piece of proprietary IE functionality to hide the offending, IE-specific coding from other browsers and the W3C validation tools. I would suggest moving the information out of the actual HTML tag and into an external CSS file that you could pull up in IE only. Here’s what that might look like:

iefix.css

STYLENAME {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader
(src='PATH',sizingMethod='scale');
}

from the head section of your HTML file

<link href="stylesheets/styles.css" media="all" rel="stylesheet" type="text/css" />
<!--[if lt IE7]>
<link href="stylesheets/iefix.css" media="all" rel="stylesheet" type="text/css" />
<![endif]-->

Overall, PNG images are the way to go, and as we move farther and farther into faster loading web sites that need to look just as slick as print media, you’ll find that PNG images can fulfill those needs. And now that you’re equipped with this little trick, your your new designs will be supported by all the modern browsers.

Check out the official documentation about the AlphaImageLoader filter from Microsoft’s site.

Firefox 3 Beta Available

by 4 Comments

Firefox fans can already download and start playing with the Firefox 3 beta version 1. Here are some of the features that the new version should pack:

  • improved security and malware protection
  • improved password and download management
  • more personalization options with bookmarks and searches
  • improved HTML rendering and font architecture
  • performance improvements

I will probably start using Firefox 3 as soon as it comes out, but I need to second what Duncan Riley said on TechCrunch. The main issues with Firefox right now are the memory leaks and crashes, and according to him there is no evidence that this new version will solve these problems for good.

I found the memory leak issue especially harsh under Ubuntu Linux, which is my current operating system. Hopefully beta testers will report this problem.

Flock: Pretty, But Still Not Very Useful

by 4 Comments

Version 1.0 of the much anticipated Flock browser was finally released earlier this month following more than two years of development. The release was met with much fanfare, but despite the amount of time and energy put into Flock, at this point it remains little more than a piece of eye candy.

Flock is a very good browser, being that it is basically Firefox in a shinier skin. But it falls somewhat short in the other areas of functionality it boasts.

flockbrowserpic.jpg

Flock’s blog editor, for instance, is woefully less powerful than the alternative browser-based tool Scribefire, and light years behind corresponding desktop tools like MarsEdit, Ecto and the newly-popular Windows Live Writer.

Similarly, Flock’s built-in RSS feed reader is polished and easy to use, but currently can’t hold a candle to the likes of NetNewswire, FeedDemon and Newsfire.

The bits of Flock that shine the brightest are the Facebook sidebar and the browser’s integration with online photo storing sites Flickr and Photobucket.

However, despite the Facebook sidebar’s impressive functionality, it still pales somewhat in comparison to simply leaving Facebook open in one of your browser tabs. And while the photo uploading and sharing tools are likewise well implemented, the millions who turn to Kodak, Google and various smaller providers for their online photo storing needs have been left out in the cold.

Some will argue that while Flock may not be the best of breed at any of the individual functions it performs, it does provide the benefit of being able to do all those things from within a single application. But at a time when many new computers are offered with at least 1GB of RAM, and additional memory can be purchased dirt cheap, is it really a problem to have a separate blog editor, feed reader and Internet browser open at the same time? Surely the added functionality of the more feature-rich individual applications trumps eliminating the need to switch windows, a task that the ctrl+tab (cmd+tab on Macs) keystroke makes negligible.

There are purists who insist that an Internet browser is for browsing only, and should not be made to accomplish tasks it was not originally intended for. At present I am inclined to side with those purists (using Safari with no add-ons is a blazingly fast and pleasant browsing experience), though I do hold out hope that Flock, or someone else, will eventually manage to create a browser/blog editor/feed reader that is better than the respective standalone applications without consuming the bulk of a computer’s available memory.

Flock is a positive step in what could be “the right direction,” but after two years of development some hoped for a little more solid functionality to go along with the spit-shined exterior.