A few note on z-index

z-index is widely used in dropdown menu/block to make one div on the top of the other. Here are a few I learned from.

1. Z-index only works on "realtive" or "absolute" position.
2. Higher z-index layer usually on the top of lower one, but in IE7, it's not that obviously. To fix IE7's z-index problem, you need to make sure, set z-index for the same stacking layers. (See example below)

<div id="p1" style="position:relative">
   <div id="c1" style="position:relative; z-index:10">
         I want to be on the top!!!
   </div>
</div>

<div id="p2" style="position:relative; z-index:5">
   <div id="c2" style="position:relative; z-index:5">
        I can be on the bottom!!!
    </div>
</div>

In order to make the above example works in IE7, you have to set 'p1' to have z-index higher than 'p2'.
3. Don't set parent layer's overflow is hidden, that will children cannot overlay.

Good luck

adsense code "break" the site in Firefox 3.6

I have adsnese code in a website, and today I found it broke the website in Firefox 3.6. When I open the site, right after it loads, it redirect to a blank page.

After pinning down, I found it was caused by adsnese code. It may not be wrong by adsense code, because I put it in a stickey div, so then the ad can stay after page scroll. However, Firefox 3.6 just does not like it.

OK, OK, I moved it from the stickey div.

Div does not float right in IE

straging layout in IE8

IE is strict someitmes. For exmaple,

<div id="left-p" style="float: left;">
<form>
abcdefef...
abddedfdfdf....</form>
</div>

<div id="right-p" style="float: right;">
<div id="t1&quot;">
</div>
<div id="t2&quot;">
</div>
</div>

In the Firefox and Chrome, the code works fine, but in IE, the div[id=t2] may not float right.

I have no complaint with IE this time, the above code is bad, so we should not have partial
form in the a div and partial in another div.

web page is not centerized in ipad

The ipad2's screen resolution is good to view a webpage having designed width as 960px. Recently, I am working a new site,

and the site looks good in the desktop, but in ipad2 the web page is not centerized, but align to left and leave some space

at right. Finally I figure it out that some invisibly div, in my case it's big drop down manu, which flow out of the page, so

when viewing in the ipad browser, it treat the web page as whatever width including the invisible area, so then shink the

whole webpage and align to left.

Actually this also caused the browser in the desktop to have extra horizontal scroll bar when the window is resize to one

less than than whatever width including the invisible area.

The fix I did is reposition the big drop down manu to not overflow the designed width.

How to install GD Extension on EC2

If you're using Amazon EC2 with Amazon Linux AMI, you my find GD Extension is not installed by default. The following are steps to get it installed.

• check if PHP GD is installed or not by 'rpm -qa | grep php', if you see 'php-gd-5.3.8-3.20.amzn1.i686" or similar, then you are fine and can stop here.
• If not, then run command, 'sudo yum install php-gd'
• And restrat apache by 'sudo /etc/init.d/httpd restart'
Cheer!

Set Magic Quotes Runtime is deprecated

I see a lot of error in logs regarding set magic quotes runtime is deprecated on one of my wordpress site running the nginx server. The error is like the following,

2011/11/07 12:02:48 [error] 15798#0: *130087 FastCGI sent in stderr: \"PHP Deprecated:  Function set_magic_quotes_runtime() is deprecated in /var/www/example/content/wp-settings.php on line 32\" while reading response header from upstream, client: 173.13.114.113, server: www.example.com, request: \"GET /news/ HTTP/1.1\", upstream: \"fastcgi://unix:/var/run/www/php.sock:\", host: \"www.example.com\", referrer: \"http://www.example.com/\"

I already turn off Deprecated error in php.ini, but Not sure why it does not stop. The bad thing is that a lot of deprecated errors make the important error message hidden, so I got the fix this. Finally, the solution is edit wp-settings.php on line 32 to

//set_magic_quotes_runtime( 0 );
//110711 - Since this function is depracted as of PHP 5.3, use ini_set('magic_quotes_runtime', 0); instead.
@ini_set( 'magic_quotes_runtime', 0);

Ref: http://php.net/manual/en/function.set-magic-quotes-runtime.php

How to disable autosave and wp post revisions

Just a short note.

define('WP_POST_REVISIONS', false);

function disable_autosave() {
wp_deregister_script('autosave');
}
add_action( 'wp_print_scripts', 'disable_autosave' );

HTML entities in Textarea tag

Maybe this is obvious, but I just leaned it. See the example below,

<textarea>
techrecorder&reg;
</textarea>

I expected to see the '&reg;' but it gives me '®' So when the value of textara tag is presented by convering all of html entities code to the code result, for exmaple, '&lt;' to '<' and '&quot;' to '"'. So if you wanted to show html entities code in textarea, you have to escape &, for example,

<textarea>
techrecorder&amp;reg;
</textarea>

selectall_arrayref vs. selectall_hashref

Both selectall_arrayref and selectall_hashref are method that combines "prepare", "execute" and "fetchall_arrayref" into a single call. The former returns a reference to an array containing a reference to an array (or hash, see below) for each row of data fetched. And the latter returns a reference to a hash containing one entry, at most, for each row, as returned by fetchall_hashref(). Note that selectall_hashref return the ordered list of result as statement intented to, for example,

$sql = \"select ename from employee order by ename\"; 
$hash_ref = $dbh->selectall_hashref($statement, \"ename\");

The %$hash_ref does not contant the ordered list of ename, because it's hash. So the get the ordered list, you need to sort the hash. like

sort(%$hash_ref);

In some case, the statement has "order by" multiple fields, it's not easy to sort hash to having the same order as statement trying to, so you may just use selectall_arrayref, which can also return a reference to a hash, for example,

$sql = \"select ename, eage from employee order by ename, eage\";
my $emps = $dbh->selectall_arrayref(
      $sql,
      { Slice => {} }
  );
  foreach my $emp ( @$emps ) {
      print \"Employee: $emp->{ename}\n\";
  }

For more perl dbi usage, click here http://search.cpan.org/~timb/DBI/DBI.pm

Restore Slave When it broke

When something goes wrong, slave throws error, one symptom will be that a lot of mysqld-relay-bin.xxxx files are accumulated in /var/lib/mysql/. So you try to restart slave, but got error,

ERROR 1201 (HY000): Could not initialize master info structure; more error messages can be found in the MySQL error log

And you check mysql error log (usually at /var/log/mysqld.log), it says "111014 3:30:47 [ERROR] Error reading slave log configuration". How to do? The simple solution is that,

• Stop slave, by "slave stop;" at mysql command line.
• Remove all mysqld-relay-bin.xxxx.
• Remove master.info and relay-log.info
• Then start slave by "slave start"

That should work, but you may lost some positions. And if you wanted to start slave at current replcate log file, then you can run one more command before starting slave.

CHANGE MASTER TO MASTER_LOG_FILE='your_current_replog.000693', MASTER_LOG_POS=certain_pos (I used 4);

Good luck!

Three Steps to Setup SMTP Mail in Debian

Step one

Install Pear (PHP Extension and Application Repository) by the following command,

apt-get install php-pear

Step two

Install Pear Mail Package by the following command,

pear install Mail-1.2.0

Note: the latest version of Mail package at the time I am writing is 1.2.0, check this page for the current version.

Setp three

Install Net_SMTP, which is required to send SMTP mail. You can use the following command to install it.

pear install Net_SMTP

Done!

The following is the script you can use to test,

<?php
include(\"Mail.php\");

function sendmail_smtp($to, $subject, $body){

   $from = \"you@gmail.com\";

   $host = \"ssl://smtp.gmail.com\";
   $port = \"465\";
   $username = \"you@gmail.com\";
   $password = \"yourpass\";

   $headers = array ('From' => $from,
     'To' => $to,
     'Subject' => $subject);
   $smtp = Mail::factory('smtp',
     array ('host' => $host,
       'port' => $port,
       'auth' => true,
       'username' => $username,
       'password' => $password));

   $mail = $smtp->send($to, $headers, $body);

   if (PEAR::isError($mail)) {
      echo(\"<p>\" . $mail->getMessage() . \"</p>\");
   } else {
      echo(\"<p>Message successfully sent!</p>\");
   }

}
?>

Now, you can use Pear SMPT to send mail on any server even your home server without seting up a mail server. Is it cool?

PHP mail does not work

The OS is linux, and the webserver is apache, and in php.ini file the mail is set as 'sendmail_path = /usr/sbin/sendmail -t -i'. The problem is that php mail() function does not work, although it returns 1 like it's successful. In this case you will not find any help by looking into apache error log. The debugging should start from maillog, which is located at /var/log/ if you are not specify the different loction in the php.ini. I saw the errors like,

delay=00:00:06, xdelay=00:00:02, mailer=relay, pri=120481, relay=*****, dsn=4.5.0, stat=Operating system error
sendmail[24572]: ruleset=try_tls, arg1=mail.***.com, relay=mail.***.com, reject=451 4.3.0 Temporary system failure. Please try again later.

which is actually hard to tell what's going on. I actually tested it mail function thru command line. Accidentally I found if I am root, I was able to send the mail. And I dig more into mail log, I found some useful error logs (note that those logs were generated by the test through url, not command line), like

sendmail[24572]: p8S0pDSY024569: SYSERR(apache): db_map_open: cannot pre-open database /etc/mail/access.db: Permission denied

So then the issue is clear. I checked the /etc/mail/access.db, the mod was 640, so changed to 644, and it sloved the problem.

Just some note I wrote yesterday

My client wanted to update a webpage with a monthly image, and image extension could be gif, png, jpg, etc. What I need to do is to dynamic check the image in the monthly_tips folder, if there is current month's image, then use it, if not, use the previous month's image, if not, then use a default image.

//get current month, ex: 201109
$ym = date("Ym");

//get last month, ex: 201108
$last_ym = date("Ym",strtotime("-1 months"));

//check if current month's image exists, note that image name like YYYYMM.png, YYYYMM.jpg, etc.
$img = glob("monthly_tips/" . $ym . ".*");
if(count($img) && 0)
  $safty_img = $img[0];
else{//if not found, then check the last month
  $cpath = dirname(__FILE__);
  $img = glob("monthly_tips/" . $last_ym . ".*");
  $default = null;
  //if found the last month's img, then copy it to last.png
  if(count($img)){
    $lastimg = $cpath . "/" . $img[0];
    $path_parts = pathinfo($lastimg);
    $default = 'last.' . $path_parts['extension'];
    $default_path = $cpath . "/monthly_tips/" . $default;
    copy($lastimg, $default_path);
  }
  else{
    $img = glob("monthly_tips/last.*");
    if(count($img))
    $default = $img[0];
  } 
  if($default && file_exists($cpath . "/monthly_tips/" . $default))
    $safty_img = "monthly_tips/" . $default;
  else
    $safty_img = "monthly_tips/default.png"; //worst case;
}

echo $safty_img;

OK, I actually made this way to complicate, and you may not understand what I tried to do here. And my final solution is actually quite simple. The idea is just to use the latest update image in that folder by the following code.

function glob_rsort_latest( $patt ) {
    $rtn = array();
    if ( ( $files = @glob($patt) ) === false ) {
        return $rtn;
    }
    if ( !count($files) ) {
        return $rtn;
    }

    foreach ( $files as $filename ) {
        $rtn[$filename] = filemtime($filename);
    }
    arsort($rtn);
    reset($rtn);
    return $rtn;
}

$files = glob_rsort_latest( 'monthly_tips/*.*' ) ;
if(count($files)){
    $imgs = array_keys($files);
    $safy_img = $imgs[0];
}

Headache of ISO-8859-1 to UTF8

In Perl, you can use encode ('UTF-8', $iso-text-str) to convert ISO-8859-1 encoded string to UTF-8 encoded string. And in PHP, you can use utf8_encode($iso-text-str) to do the converting.
However, you may be out of luck, for after being converted, some characters could be funky and not what you wanted to see. I think this is because, some characters in UTF8 are invisible, like x80 - x9f (see the following ISO-8859-1 characters list images)

Because I  only care of those regular characters, like \x20-\x7F or \xA9 or \xAE or \x99,  I strip other characters before applying encoding function.
In Perl

$content =~ s/[^(\x20-\x7F|\xA9|\xAE|\x99)]+//g;
$content = encode('utf8', $content);

In PHP

$content = preg_replace('/[^(\x20-\x7F|\xA9|\xAE|\x99|\n)]+/', "", $content);
$content = utf8_encode($content);

UPDATE: Actually, I found that in Perl, encode function cannot correctly convert \x99 to ™. Finally my solution is the following,

open (FILE,  ">$your_file") || die "couldn't write to epcmf file\n";
   binmode(FILE, ":UTF-8");

   $title =~ s/[^(\x20-\x7F|\xA9|\xAE|\x99)]+//g;
   $title =~ s/\x99/™/g;
   $title =~ s/\xAE/®/g;
   $title =~ s/\xA9/©/g;
   print FILE $title;

Note:

1. You should edit your script in UTF-8, for example, in PUTTY, you can change your character set to UTF-8 at Configuration > Windows > Translation
2. UTF-8 is different to utf8, so in make sure you write it as binmode(FILE, ":UTF-8");

Reset Chrome Profiles - Ubuntu 11.04

If your chrome browser is messed up, such as icon of bookmark and/or plugin is missing, cannot load your profile, etc. You may want to reset your profiles. If you use Chrome Sync, then it's very safe to just rename profiles folder, and restart chrome, and then set up Chrome Sync using your existing sync account, after that everything should be back to normal.
The chrome profile folder is under ~/.config/chromium/Default.

How to center dynamic ul

A UL is a block element, it'll take up the whole width of its container. If you remove float:left and set a width to it, then margin:0 auto will work, but only the ul will center and not the li, unless you know exactly what the width of the UL should be. If you do not know what the ul width should be(e.g. dynamic list menu), then you need to float:left the UL and li, put it in a div, and use this trick to center http://pmob.co.uk/pob/centred-float.htm

Connect to VPN via Sonicwall NetExtender

I was trying to connect to company's VPN via Sonicwall NetExtender. The version of NetExtender that I can get from my company is 3.5.629, which works fine in my Windows7 desktop, but it does not work in my Ubuntu 11.04. After doing Access Authentication, I was able to connect to server, but eventually I was logout, and the following are some error message I got.

Using SSL Encryption Cipher 'DHE-RSA-AES256-SHA'
Using new PPP frame encoding mechanism
pppd: no device specified and stdin is not a tty
SSL_read ZERO RETURN
SSL-VPN logging out...
SSL-VPN connection is terminated.
Exiting NetExtender client
Connection interrupted.  Reconnecting... 

I spent sometime Googling, and finally I found out the solution. In short, I need a newer version of NetExtender, which you can download it at  Sonicwall demo page,
https://sslvpn.demo.sonicwall.com/cgi-bin/welcome
(note that you need to use "demo" as username and "password" as password to login, and then click NetExtender to download it. I did that in Firefox, and it should popup the download link, and then you can use Active Manager to extract it.

Here are some note:
1. Before you install the newer version, you must uninstall the old version, if you already installed it. (Go to netExtenderClient folder, and run "sudo ./uninstall")
2. You need root to run netExtender (or, sudo ./netExtender)
3. You can also run sudo ./netExtenderGui (the one has user interface), but it may require java.

Hope this helps for someone who has the same problem.

phpmyadmin cannot import - ubuntu 11.04

"No data was received to import. Either no file name was submitted, or the file size exceeded the maximum size permitted by your PHP configuration. See FAQ 1.16."

Most of time when you see this error, you can just follow the instruction in FAQ1.16 to make some changes in php.ini, such as file_uploads, upload_max_filesize, memory_limit, upload_tmp_dir, max_input_time and post_max_size.
If all of these does not work for you, then it could be the file/directory permission problem. Check the files under /var/lib/phpmyadmin, there are two files, config.inc.php, blowfish_secret.inc.php, and one folder, tmp. Make sure tmp is writeable by APACHE RUN USER, which can be set at /var/apache2/envvars.

Good luck!

how to install two firefoxs in ubuntu 11.04

Firefox 5 is out now. My ubuntu has updated Firefox Browser to 5, and it works fine, and I do feel it's faster, but the problem is that some add-ons does not work in the new Firefox. If this is a case for you too, or you just like to have old Firefox in your machine, here is how I did it. 1. Go to Mozilla Old download page at http://www.mozilla.com/en-US/firefox/all-older.html, and pick one and download it. 2. Unzip the file and save it to somewhere, says, /home/adam/firefox. 3. Close the existing firefox, and at your command line, change directory to firefox folder, and then enter the following command

./firefox &

Note that you have close exiting Firefox, otherwise, it will trigger the Firefox 5 not Firefox 3. And you can click the file named firefox to open it, but you have to select RUN, not open it in the text editor.

Order of ClassPath

You can define multiple ClassPath, like

CLASSPATH=$CLASSPATH:/usr/local/apache/lucene/lucene-core-2.0.0.jar:/usr/local/apache/lucene/src/:/usr/local/apache/lucene/src/lucene-classes.jar:.
export CLASSPATH

But the order of ClassPath is important. Basically it is first come first server, if Java Interpreter find the class in the first class path, then it will ignore the the one in the later class path. See the detail from Oracle java doc

The order in which you specify multiple class path entries is important. The Java interpreter will look for classes in the directories in the order they appear in the class path variable. In the example above, the Java interpreter will first look for a needed class in the directory C:\java\MyClasses. Only if it doesn't find a class with the proper name in that directory will the interpreter look in the C:\java\OtherClasses directory.