Monthly Archives: December 2007

Browsers, CSS, HTML, JavaScript, Web Development

Show PNG transparency in IE6

3 Comments

Every web developer knows that develop cross-browsers web applications is a real pain in the ass. To complicate the things a little bit, the change from IE6 to IE7 bring many differences that turn the develop process harder.

One key limitation in the old Internet Explorer 6 (IE6) is the Portable Network graphics (PNG) transparency problem. In this version of IE, pages that contain PNG images with transparent background are shown wrong. The background of the image is shown gray rather than transparent.

To solve this problem Microsoft recommends that web developers use the AlphaImageLoader filter. This is specific IE CSS filter that can be used with images to show the PNG transparency. The filter can be used as shown below:

<html>
<head>Show PNG transparency in IE6</head>
<body style=”background-color:#FFFFFF;”>
<!– Div that handles the transparent image –>
<div style=”height:400; width:400;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,
src=’image.png’, sizingMethod=scale);” >
</div>
</body>
</html>

AlphaImageLoader has two parameters, the src and the sizingMethod. The first one is used to set the source image file to be filtered and the second one is used to set the sizing behavior that the object and the image have. The sizingMethod can take three values:
crop – Clips the image to fit the dimensions of the object;
image – Default. The object fits the dimensions of the image;
scale – The images changes its size to fill the object;

This CSS filter can be used as an object in JavaScript. This way, there is another property called enabled to set or disable the filter.

Form more information about AlphaImageLoader filter check MSDN website.

Linux, Operating Systems

Linux File System

Leave a comment

As promised I’m writing an “article” about Linux file system to clear up most of the doubts a newbie, like me, might have in relation to this subject.
The most famous FS(I’m gonna refer to File System by FS from now on, just to make my life easier… me very lazy you know!) are ext3, Reiserfs, JFS2 and XFS.All of this are Journaled File systems, ok this means that before it even writes the data to the main file system it logs its changes into a journal, that is in specially-allocated area.This is a very good thing because it lessens the probability of sh*t happening due to a power failure or one of those dreadful system crashes.

Ok lets start with ext3, its an extension of the ext2 FS( duh like the name did not give that little secret up ), although the performance and security is not as good as the others FSs it holds a big advantage that it allows in-place upgrades from the popular ext2 file system without having to back up and restore data as well as requiring lower CPU consumption than ReiserFS and XFS.Due to the “bridge” that exits between ext3 and ext2, the FS is putted back due to the more recent goodies that exist on the more recent FSs, stuff like dynamic allocation of i-nodes and variable block sizes.Using the “fsck” is a no-no while the FS is mounted for writing, a dump taken while it is mounted read-write mode can create corrupt data within the dumpfile.

if you want to defrag ext3 on the FS level forget it, unless you are really in the mood to cross between ext3 and ext2, cause you’ll have to use e2defrag, but it makes you convert to ext2, and when running the defragmenter it may result in a loss of some data.

XFS is a high-performance journaling file system created by Silicon Graphics for their IRIX operating system.A 64 bit FS that support files up to a system size of 8 exabytes( abbreviation EB, and the equivalent of 1EB is 1,152,921,504,606,846,976 bytes…. can u imagine the amount of porn that could be oO?), but on 32-bit linux operating system the size of file system size is reduced to 16 Terabytes.
There is no undelete utility for XFS, can not be shrunk. There are some compatibility issues between different architectures, due to journaling-optimization though XFS provides a utility to solve this problem.The FS delays allocation and ordering of meta-data and data flush to disk. XFS may choose not to write data to the disk when it is received, so loss of data during crash is more likely.Creation and deletion of directory entries is a much slower metadata operation than other file systems.

When ReiserFS was introduced, it offered features then unseen in existing Linux file systems, such as Metadata-only journaling (also block journaling, since Linux 2.6.8), its most-publicised advantage over what was the stock Linux file system at the time, ext2. Online resizing (growth only), with an volume manager named as LVM. Since then, Namesys has also provided tools to resize (both grow and shrink) ReiserFS file systems offline.Tail packing, a scheme to reduce internal fragmentation(handy indeed).

JSF also know as Journaled file system, a 64-bit File System created by the IBM brainiacs, made to be used with AIX, eComStation, OS/2 and Linux operating systems.On this FS recent benchmarks report that it is fast, reliable and that it shows a pretty good performance on many levels. Also told to be light and efficient with the system resources.

Let me remind that this is just a poor attempt of mine to enlighten the few of you who had the courage to read until this point, if you really want to get some heavy duty info about this, then you should go check Wikipedia(Thats were i got ma info!).Remenber people “wikipedia knows all” this is as truth as the truth from House ,”Every body Lies!”. I finish this post with some more detailed info on a couple of FSs.

— EXT3 —

Limits:
Max file size 16GiB – 2TiB
Max number of files Variable
Max filename size 255 bytes
Max volume size 2TiB – 32TiB
Allowed characters in filenames All bytes except NULL and ‘/’
Features:
Dates recorded modification (mtime), attribute modification (ctime), access (atime)
Date range December 14, 1901 – January 18, 2038
Date resolution 1s
Attributes No-atime, append-only, synchronous-write, no-dump, h-tree (directory), immutable, journal, secure-delete, top (directory), allow-undelete
File system permissions Unix permissions, ACLs and arbitrary security attributes (Linux 2.6 and later)
Transparent compression No
Transparent encryption No (provided at the block device level)
Supported operating systems Linux, BSD, Windows (through an IFS)

—XFS—

Limits:
Max file size 8 exabytes
Max filename size 255 bytes
Max volume size 8 exabytes
Allowed characters in filenames All bytes except NULL
Features:
Dates recorded Yes
Date resolution 1ns
Attributes Yes
File system permissions Yes
Transparent compression No
Transparent encryption No (provided at the block device level)
Supported operating systems IRIX, Linux, FreeBSD (experimental)

—ReiserFS—

Limits:
Max file size 8 TiB
Max number of files 232 (~4 billion)
Max filename size 4032 bytes, limited to 255 by Linux VFS
Max volume size 16 TiB [4] * see Warning
Allowed characters in filenames All bytes except NULL and ‘/’
Features:
Dates recorded modification (mtime), metadata change (ctime), access (atime)
Date range December 14, 1901 – January 18, 2038
Date resolution 1s
Forks Extended attributes
File system permissions Unix permissions, ACLs and arbitrary security attributes
Transparent compression No
Transparent encryption No
Supported operating systems Linux

PHP, Web Development, XpertMailer

Send e-mail with inline image attachment

1 Comment

Since I start coding in PHP that one of the key feature were send and simple e-mail by a form. This can be done with many API’s that exist to work with the e-mail system. With the evolution of the Internet, sending e-mails with a design and not only with text has become to be normal and widely used. I’ve used many solutions like php mailer, xpert mailer, version 2 and 4, code igniter e-mail class, but still using the version 2 of xpert mailer, also known as XPM2.This older version, already with lack of support by its developers is simpler and easier to include in one project and do everything I need to send e-mail, from normal text based e-mail to rich content e-mail in html and attachments.

There are many ways for doing that by using html e-mails. This task isn’t as simple as it looks like, because html e-mail has some limitations and some rules that we can’t break if we want to see our e-mail well formed. One of the principal limitations is use a table based layout instead of a div one.

While using rich e-mails we face some difficulties and issues. The way we put images on the html e-mail is important. We’ve to choices to doing that.

  1. The first one is use full path to an image that is store in a web server accessible everywhere. This has some problems because we may not have space on a web server to put the files. Another problem is the limitation of the domain. If we want to change our domain or use our script in another one, we’ve to change all image and file path.
  2. Another way to put files on the e-mail, especially images, is putting them inline of the e-mail like an embed attachment. This solves the problems described but is much hard to use and to understand. Some API’s are simplifying the programmers work by offering a simpler to use Mime content inside an e-mail. The XPM2 have this feature and turns it simply to use when we do it right.

The code shown below is simple and sends an example e-mail with an inline image.

// XPM2 with attach inline example
require(“xpm2-0.1/smtp.php”);

// Create XPM instance
$mail = new smtp();

// Select delivery mode
$mail->Delivery(‘local’);

// Set timeout
$mail->TimeOut(10);

// Set e-mail priority
$mail->Priority(‘Normal’);

// Set from e-mail
$mail->From(“test@ws4.org”,”Test”);

// Set to e-mail
$mail->addTo(“protech@ws4.org”,”ProTech”);

// Set body content has HTML dining is encoding
$mail->Html(‘<html><head><title>Test</title></head><body>Test<br /><img src=”image.jpg” alt=”Inline image” /></body></html>’,’ISO-8859-1′, ‘base64’);

// Attach file to the e-mail
$mail->AttachFile(‘image.jpg’, false, ‘autodetect’, ‘inline’ );

// Send e-mail and set the subject and it’s encoding
$sent = $mail->Send(‘Hello World!’,’ISO-8859-1′, ‘base64’);

// Check the status and see the result if error
echo $sent ? ‘Success’ : $mail->result;

The method attach file is used to add files to the e-mail, either as a normal attachment and an inline one. If we see the parameters we find a disposition that allows us to define the type of attachment. Using the second parameter we can set a name or use the full file name. Is this example, I attach an image as inline content and use it in html. It’s so easy and clean.

This API also allow you to choose the better way to send your e-mails using local, relay and client letting you use your servers e-mail layer or connecting to an SMTP server. Other feature is the possibility to connect to a throw POP3.

See the documentation about XPM2

I haven’t use the XPM4 because I had some header encoding issues and haven’t tried to fix the problem yet. Besides, I still use XPM2 because allows sending e-mail the way I like and is too small and easy to deploy and integrate with some frameworks, like Code Igniter.

Operating Systems, Products

The Story of the new Laptop

1 Comment

Well here i was, just finished arriving home, minding on my own business, after a stressful ride home from university,when the delivery enterprise arrived with my new laptop, a brand new Toshiba L-40, all wrapped up in a nice box.I took it out ,with the help of my cat, and turned it on, so far so good.Windows Vista and every thing,just one little problem…it came with a very very gay theme, that i couldn’t take out, my solution…recovery CD, simple, effective, and for my surprise it was fast! i thought to myself “less work for me”,but(and there is always a but, as far as my not so vast experience in the computer tech world) as soon as the windows was fully booted i noticed the never ending number of programs running on start up.

Curiosity took me to see what every application did.So i had a Toshiba infoCenter,desktopSms, a trial version of Norton(that not even was enabled),and a few more things that i don’t recall right now.So i got my self busy preparing my new, fresh out of the box, laptop.Started out by running msconfig and unchecking those programs, that i didn’t like to see that much, on the startup.Next went to the program manager and uninstall Norton and every thing else that i didn’t like. Ok so i got myself a Windows Vista ready for my activities.

But why stick only with one O.S. when u can have two!! Fetched my ubuntu 7.10 distro slipped it on the dvd-rom tray and rebooted the laptop.

A new installation started…so i thoughted.To my surprise it did not start installation has it was supposed to.It was a LiveCd, which it is great, always useful when a person is in a tight situation, but it was not the case, at the moment i needed an installer.So i started thinking ” i was sure i selected the Start & install option in the start menu of the cd”… and i did! there it was right in front of me this big icon saying INSTALL i putted two and two together, and there it was the O.S. install interface.

Pretty simple it was, just select the language, the keyboard layout, the partion(even has automatic option, but i prefer manual), ok on the partition department i like to divide my disk in 3 parts (/home,/ and swap) and the type of partition “ext3″(dunno why i choose this one maybe cause its always the first one on the list,need to investigate this).With the partition business done, off to the account config, full name just for info on the system(don’t need this but i like to be picky sometimes), account name! ok here i always choose a small name in lowercase mode, this way its easy and fast to type(here i am picky mode again), next password…no need to tell every that it should be alphanumeric(numbers and letters), more than 6 digits and don’t forget to put it in upper and lower case(can’t be safe enough =P).

Account department done, finally installation starts.Now i have Windows vista and ubuntu 7.10 with a grub loader to choose which one i want to load.Happy?! well no i still need eclipse and java to be able to do some work at my university. Ok so i go console mode, start up by making a backup of my source list (found in /etc/apt/source.list) and changing it by putting the repositories easily found on ubuntuguide.org.

Now for the best part, i have to install packages in Linux, ohhh noo it sooo hardd, i can’t do it =( probably thats what you are thinking right now, well my friend you are wrong, nothing more simple actually, just do sudo apt-get install “program”,et voila, and it does everything for you.Easier then putting pre-cooked meals on the microwave.after a few of this and i got myself a laptop ready to do some programing.

Ok so you don’t feel that much at ease with the console, no piggy the dudes from ubuntu thought about that, just use the synaptic package manager(use the menu system->administration->synaptic package manager)this is a graphic interface that does the same as apt-get and a little more. After all this i finally was happy with what i got,for now at least.Lets see how long will take me to blow up this two O.S.(my record time was 48hours with windows xp =x).

-I finish this Post with a nice picture of the Toshiba L-40 with his very interesting original theme.

Toshiba L-4o with not so good theme

ps-Forgot to mention, but i got this laptotp trough a deal from the local school, therefore the theme…

JavaScript, Web Development

Detect cookie support with JavaScript

Leave a comment

Cookies, also known as web cookies, HTTP Cookies or just cookies, are a mechanism that allow the store of that in the client’s browser. This information is sent by a server to the web browser and then sent back without change each time the browser access that server. Cookies are used for several purposes such authentication, tracking or just to hold specific information, such users preferences in a web site. The idea and name was inspired in the well-known concept “magic cookie” from UNIX.

This mechanism is so common between developers that most of the times we forget to check the client browser support for them. When we develop an application that uses cookies we must check their support to avoid some errors. This can be done in several ways, such with server side scripting. The code bellow shows a simple way to check cookies support with JavaScript.

<script type=”text/javascript”>
var cookiesON = false;
if (typeof navigator.cookieEnabled==”undefined”)
{
//if other than IE4+ and NS6+
var date = new Date();
document.cookie = “checkCookie=”+date.getTime();
cookiesON = (document.cookie.indexOf(“checkCookie”)!=-1)? true : false
}
else
{
//if IE4+ or NS6+
cookiesON = (navigator.cookieEnabled)? true : false;
}

//Do something
if (cookiesON)
alert(‘Cookies ON’);
else
alert(‘Cookies OFF’);
</script>

One problem that comes with the web development is the need to develop cross-browser applications. This way, in the above code you see two different ways of check cookie support in JavaScript.

  • The first one checks cookies on browsers different from IE4+ and NS6+ by trying to put a dummy value in the cookie and read it. If we could read it, is because cookies are enabled. There is no problem by storing the dummy value because this one is removed when the browser is closed. This is the behavior when isn’t specified a expire date.
  • We could use the same verification for all browsers. However, browsers like IE4+ or NS6+ have the cookie support information built-in with a navigator property “cookieEnabled”.