Whirix Technical Blog

Cross browser Horizontal Rule (hr-tag)

2009-06-28T21:14:00.000-07:00

What:


hr {
  background:#d0d0d0;
  color:#d0d0d0;
  margin:15px 0;
  height:1px;
  border:none;
}

Why:

because Chrome creates some borders
because FireFox set color from css background value
but IE set color from css color value

Installation of Mac OS X and iPhone SDK to Intel PC

2009-06-18T01:57:00.000-07:00

This is a very quick note about installing of Mac OS X and iPhone SDK to my Intel PC.

Install Kalyway 10.5.2, follow this detailed guide
Upgrade to version 10.5.3 required by iPhone SDK 2.2, for details see forum topic on insanelymac.com (Upgrading to 10.5.3 part)
Install NVinject extensions if you have NVidia card (like me) to enable high screen resolutions
Install iPhone SDK (can be taken from Apple's web site)

Have fun!

swfmill compilation problem

2009-01-21T01:09:00.000-08:00

You can get compilation error when compile swfmill (http://www.swfmill.org) with GCC-4.3.x or higher. Mostly it will look like:

swft_css.cpp:197: error: 'strcmp' was not declared in this scope

The reason is GCC-developers have split some header files. So some functions are in other header files now. More about it is here: http://gcc.gnu.org/gcc-4.3/porting_to.html (see section header Header dependency cleanup).

To resolve the problem open file src/swft/swft_css.cpp in an editor and add the line in the top of the file:

#include <cstring>

The same problem also exists for file src/swft/swft_import_mp3.cpp and the solution is the same.

How to make native SQL queries in Doctrine ORM

2008-12-05T04:15:00.000-08:00

Sometimes you have situation which require writing of native SQL query in project fully based on Doctrine ORM. Doing DQL queries is very easy, but simple SQL queries maybe difficult to execute because you have to reuse database connection opened inside Doctrine.

Example given below is easy to understand and use in your project(s). Enjoy!

// get Doctrine_Connection object
$con = Doctrine_Manager::getInstance()->connection();
// execute SQL query, receive Doctrine_Connection_Statement
$st = $con->execute("...............");
// fetch query result
$result = $st->fetchAll();

Cross browser min-height (IE6 and others)

2008-11-14T06:15:00.000-08:00

IE6 ignores CSS 'min-height' property. Fortunately it works with 'height' property exactly like other modern browsers with 'min-height'. That's why there is a possibility to write cross browser CSS, here it is:

min-height: 100px;
height: auto !important;
height: 100px;

Three lines instead of one, but it works excellent in all major browsers including IE6. Modern browsers accept 'min-height', then second line set 'height' to be automatic because there is !important keyword, which makes third line ignored. Now IE6: it ignores first line, then make height automatic but due to IE6 bug it also ignores !important keyword. That's why third line overwrites automatic height property and IE6 shows desired result.

This technique is actually well known by many web developers and very effective as you see. So I hope this help someone to save valuable time, and it's worth to place this post as part of blog knowledge base.

Logging in Shell Scripts

2008-05-16T05:52:00.000-07:00

This post describe two methods of setting up logger when doing shell scripts. First method is useful when your script has permission to write in system log.

# setup
log='logger -t logger-id'
# usage
$log "log message..."

Second method use redirect of standard output to your log file.

# setup
function log() {
   echo "`date +'%Y-%m-%d %H:%M:%S'` [$$] $1" >> script.log
}
# usage
log "log message..."

Dynamic TinyMCE / TinyMCE and AJAX

2008-05-16T05:41:00.000-07:00

Quick note about adding and removing TinyMCE editor when working with AJAX style pages. Standard initialization tinyMCE.init() is not accepatable but we can use another function to add/remove editor dynamically.


// add editor
tinyMCE.execCommand("mceAddControl", true, elementId);

// remove editor
tinyMCE.execCommand("mceRemoveControl", true, elementId);

Problem with AJAX upload in Safari

2008-05-16T05:32:00.000-07:00

There is good example which shows how to make AJAX style upload via hidden IFRAME. But Safari and Konqueror browsers open new window. This happen because of CSS property display: none; used to hide IFRAME.

Just remove this property and use different method of hiding - move IFRAME object outside of your window:


left:-100px;
top:-100px;
width:1px;
height:1px;

How to force download file in IE

2008-05-14T21:34:00.000-07:00

IE open files inside itself by default, if it knows the file type, for example: images, word documents. To make it download instead of open file, you need to send additional HTTP header in response: Content-disposition: attachment; filename=my_file.ico Additionally you need to send some headers to prevent caching of content in browser.

Short example for PHP:


$fp = fopen($icoFile, 'r');

// cache control headers
header("Pragma: public");
header("Expires: 0"); // set expiration time
header("Cache-Control: must-revalidate, post-check=0, pre-check=0");
// send the right headers
header("Content-Type: text/plain");
header("Content-Length: " . filesize($icoFile));
header("Content-disposition: attachment; filename=" . basename($icoFile));

fpassthru($fp);
fclose($fp);

Mapping 12 hours time format (am/pm) in 24 hours

2008-05-14T21:25:00.000-07:00

Java SSLHandshakeException

2008-05-14T21:06:00.000-07:00

Sometime you get SSLHandshakeException in Java when sending HTTPS requests. Most likely your JVM can not verify SSL certificate because it was given by unknown authority. You can install this authority public key, first download it here. Now install it in your keystore, for example:


x29:~ # /opt/jdk/bin/keytool -keystore /opt/jdk/jre/lib/security/cacerts -import -alias usertrust -file /home/yura/UTN-USERFirst-Hardware.crt -trustcacerts
Enter keystore password:  changeit
Owner: CN=UTN-USERFirst-Hardware, OU=http://www.usertrust.com, O=The USERTRUST Network, L=Salt Lake City, ST=UT, C=US
Issuer: CN=UTN-USERFirst-Hardware, OU=http://www.usertrust.com, O=The USERTRUST Network, L=Salt Lake City, ST=UT, C=US
Serial number: 44be0c8b500024b411d3362afe650afd
Valid from: Sat Jul 10 01:10:42 NOVST 1999 until: Wed Jul 10 01:19:22 NOVST 2019
Certificate fingerprints:
         MD5:  4C:56:41:E5:0D:BB:2B:E8:CA:A3:ED:18:08:AD:43:39
         SHA1: 04:83:ED:33:99:AC:36:08:05:87:22:ED:BC:5E:46:00:E3:BE:F9:D7
Trust this certificate? [no]:  yes
Certificate was added to keystore

Check webapper.net blog for additional details.

How to check web site in Safari (Mac OS) and other browsers

2008-05-14T20:23:00.000-07:00

There is a couple of nice web services which render your web site in different browsers and return simple image. It's not ideal testing method but better than nothing :)

http://www.danvine.com/icapture/
http://browsershots.org/ (has several minutes delay)

SSH public key authentication

2008-05-14T20:20:00.000-07:00

Continue knowledgebase posts...

There are two great articles describing process of configuring SSH public key authentication: in Russian and in English.

Install IE6 and IE7 together

2008-04-16T00:11:00.000-07:00

See this article if you want to use IE6 and IE7 together on one Windows machine.

CSS best practices

2008-04-15T23:35:00.000-07:00

This is first knowledgebase-style post. We are trying to use our technical blog like knowledgebase (kb) platform.

Some CSS best practices and suggestions

Validate CSS
Use Shorthand CSS if possible
Do not create empty CSS styles
CSS YahooUI classes maybe useful: Reset, Fonts, Grids
CSS Sprites allows to combine several small images into one map, generator can help sometimes
How to make nice menus from <ul> and <li>
Great instruction which explain CSS Positioning
Nice article about putting footer in bottom of the browser with CSS (Russian language)

The Development Process We Persistently Build

2007-07-17T06:09:00.000-07:00

We have spent some time to draw the process we want to work with. And we do. Because the approach gives a good and reliable way to do the right things. Yes, we like lean development and we learn it every day. Everyday we think how to apply the lean principles to the Whirix company. Actually the only reason we do that is it makes our customers happy.

Create customized repeat playlist in Red5

2007-07-04T06:36:00.000-07:00

`Red5 server` is good alternative for FMS in some projects. For example you want to add audio streaming to your web site to play recorded MP3 files organized in playlists. This is like personal radio station. Good feature for such radio station is repeat playlists that play your songs one by one, and after last return to first.

Problem with Red5 default playlist implementation raise when you want to implement such thing. Unfortunately it never goes to second item of your list, it always play first item. Thanks to Red5 authors, they have added great feature to playlist implementation, this is `IPlaylistController` You just need your own controller implementation attached to playlist.

Controller source code:

import org.red5.server.api.stream.IPlaylist;
import org.red5.server.api.stream.IPlaylistController;

/**
* Playlist controller that cycle items in the
* following order: 1,2,3, 1,2,3, ...
*/
public class LongRepeatController implements IPlaylistController {
/** {@inheritDoc} */
public int nextItem(IPlaylist playlist, int itemIndex) {
 return new ControllerImpl(playlist.getItemSize(), itemIndex).next();
}

/** {@inheritDoc} */
public int previousItem(IPlaylist playlist, int itemIndex) {
 return new ControllerImpl(playlist.getItemSize(), itemIndex).previous();
}

/**
 * Controller implementation subclass.
 * Logic isolated here for easy testing.
 */
protected class ControllerImpl {
 /** Total list size */
 protected int size;

 /** Current item index */
 protected int current;

 /**
  * C-tor
  */
 public ControllerImpl(int size, int current) {
  this.size = size;
  this.current = current;
 }

 /**
  * @return Next play item
  */
 public int next() {
  if (current<0 || current>=size) {
   return -1;
  }
  if (current==(size-1)) {
   return 0;
  } else {
   return (current + 1);
  }
 }

 /**
  * @return Previous play item
  */
 public int previous() {
  if (current<0 || current>=size) {
   return -1;
  }
  if (current==0) {
   return (size-1);
  } else {
   return (current - 1);
  }
 } 
}
}

Simple unit test for this simple class ;-)

import junit.framework.TestCase;

/**
* Test for long repeat playlist
*/
public class LongRepeatControllerTest extends TestCase {
/** Testing wrapper */
protected class LongRepeatControllerTester extends LongRepeatController {
 public int next(int size, int cur) {
  return new ControllerImpl(size, cur).next();
 }

 public int previous(int size, int cur) {
  return new ControllerImpl(size, cur).previous();
 }
}

/** Test for next */
public void testNext() {
 LongRepeatControllerTester tester = new LongRepeatControllerTester();
 assertEquals(-1, tester.next(5, -2));
 assertEquals(1, tester.next(5, 0));
 assertEquals(3, tester.next(5, 2));
 assertEquals(0, tester.next(5, 4));
 assertEquals(-1, tester.next(5, 6));
}

/** Test for previous */
public void testPrevious() {
 LongRepeatControllerTester tester = new LongRepeatControllerTester();
 assertEquals(-1, tester.previous(5, -2));
 assertEquals(-1, tester.previous(5, 5));
 assertEquals(2, tester.previous(5, 3));
 assertEquals(0, tester.previous(5, 1));
 assertEquals(4, tester.previous(5, 0));
}
}

Now just attach new controller to playlist (server stream) object:

serverStream.setRepeat(true);
serverStream.setPlaylistController(new LongRepeatController());

That's it!

Screenshots of Web Pages

2007-05-24T03:24:00.000-07:00

It is not a problem to make a screenshots of web pages if you have running firefox on your desktop. But if you can’t start X11 (X.org), it is not so trivial. So the post is about how to create screenshots of web pages via firefox without X11 (X.org) server.

Unfortunately Firefox can’t work without a display it can connect to. Fortunately there are standard tools which allow to create the necessary environment without starting of X11 (X.org) server. Xvfb tool must be installed.

First of all extract the Firefox to some folder and start it in order to allow it to create profile in your home directory. Right now you need Xvfb.

$> Xvfb -ac -screen :0 1024x768x16 2>&1 > /dev/null &
$> firefox

Now you can terminate Firefox with Ctrl-C and continue the setup. We need a minimal Firefox application panels to make a good screenshots. Thus the Firefox have to be started in a full screen mode. The extension Autohide is very useful here. Just install it:

$> firefox -install-global-extension autohide.xpi

This command does not need X11 environment and will be successful. After the installation firefox will understand new command line option -fullscreen.

Also Firefox noises with various popups: yellow bar with prompt for plugin install, confirmation for previous session restoring, etc. The following setup strings disable most of them:

user_pref("browser.sessionstore.enabled", false);
user_pref("browser.sessionstore.resume_from_crash", false);
user_pref("browser.startup.page", 0);
user_pref("plugin.default_plugin_disabled", false);
user_pref("privacy.popups.disable_from_plugins", 3);
user_pref("alerts.totalOpenTime", 1);
user_pref("security.enable_ssl2", false);
user_pref("security.enable_ssl3", false);

The strings have to be placed in the file ~/.mozilla/firefox/XXXXX.nameofprofile/prefs.js Please see the site http://kb.mozillazine.org/Knowledge_Base for explanation of all this options. The topic is not about it.

If the Firefox and Xvfb are installed you can try to make a screenshot.

# first of all we have to start Xvfb (if not started yet)
$> Xvfb -ac -screen :0 1024x768x16 2>&1 > /dev/null &

$> firefox --display=:0 http://www.google.com/ \
  -silent -nosplash -fullscreen 2>&1 > /dev/null

# dump X screen to file
$> xwd -root -out -display :0 screen.xwd

# convert dump file to some usual format
# and crop possible scrollers of Firefox
$> convert screen.xwd -crop 1005x768 screen.png

# care about closing of Xvfb and firefox
$> kill `pidof firefox`
$> kill `pidof Xvfb`

The same, for explanation of what is Xvfb, xwd, convert, pidof and kill tools please see the corresponding man pages, since it is not a subject of this topic.

FFmpeg Compilation

2007-05-17T03:14:00.000-07:00

How to compile ffmpeg with all almost all possible codecs.

Library Versions

a52dec-0.7.4.tar.gz
amrnb-6.1.0.3.tar.bz2
amrwb-7.0.0.0.tar.bz2
faac-1.24.tar.gz
faad2-2.0.tar.gz
lame-3.97.tar.gz
libogg-1.1.3.tar.gz
libvorbis-1.1.2.tar.gz
libtheora-mmx-1.0alpha5.zip
x264-snapshot-20070515-2245.tar.bz2 (with yasm-0.6.0.tar.gz )
xvidcore-1.1.2.tar.bz2
ffmpeg-checkout-snapshot.tar.bz2 (snapshort from 2007-05-09)

Actually the latest versions of all the libraries was got. Excluding faad and faac. The given pair is the only combination which I was able to compile and make work with ffmpeg.

Compilation Process

Suggestion: it is very useful to start ldconfig after every library compilation.

faad2 must be compiled (with option --with-mp4v2) before faac
- Possible problem 1: when doing make it fails with error about missing separator. Fix: remove the target rpm at the bottom of Makefile, after editing the bottom of the file must look like that:
```
...
# Tell versions [3.59,3.63) of GNU make to not export all variables.
# Otherwise a system limit (for SysV at least) may be exceeded.
.NOEXPORT:
```
- Possible problem 2: invalid initializer for virtual method when compiling. Fix: in files mp4property.h and rtphint.h fix all virtual methods defined with NULL. Example:
```
virtual void SetCount(u_int32_t count) = NULL;
```
  replace to
```
virtual void SetCount(u_int32_t count) = 0;
```
  There are several methods in the files defines in such style, fix them all.
faac ensure that it’ll be build with mp4v2 from compiled faad. After configuration complete, check:
```
cat config.log | grep 'with MP4'
```
it must found string *** Building with MP4 support ***
libogg must be compiled before vorbis, ensure that vorbis config found libogg
libtheora-mmx must be compiled after libogg and vorbis
x264 must be compiled with --enable-shared

ffmpeg

./configure --enable-shared --enable-libfaad \
--enable-libfaadbin --enable-libfaac \
--enable-libvorbis --enable-libogg \
--enable-libtheora --enable-xvid \
--enable-libmp3lame --enable-liba52 \
--enable-liba52bin --enable-libamr-nb \
--enable-libamr-wb --enable-gpl --enable-x264

a52 it is not a mistake that the library is listed after ffmpeg.
- Possible problem: If I configure a52 with the flag --enable-shared before ffmpeg compilation, then the ffmpeg compilation failed. If I do not recompile a52 after, ffmpeg can’t open shared a52 library because it is compiled as static by default. The way I was able to make it work:
  1. compile a52 without flags and install
  2. compile and install ffmpeg (see above)
  3. AGAIN configure a52 with flag --enable-shared, compile and install

Safari Ajax Problem

2007-05-03T20:04:00.000-07:00

Ajax (or AJAX) is shorthand for "Asynchronous JavaScript and XML". It's clear that this technology imply asynchronous communication, but XmlHttpRequest object can do synchronized calls to server. Avoid this practice because it's not working in Safari browser.

We have used phpRequest class for such calls (http://www.phphacks.com/content/view/52/33/). It has execute() method which sends request to server, wait for response, and return it as result. Example of the code:


 var httpReq = new phpRequest('myScript.php');
 var resp = httpReq.execute();
 // do something with resp...
 alert(resp);

This approach is not works in Safari browser (not sure about version number). Small refactoring of this code and new method executeWithCallback() makes everyone happy :-)


 var httpReq = new phpRequest('myScript.php');
 var cb = function(resp) {
     // do something with resp...
     alert(resp);
 };
 httpReq.executeWithCallback(cb);

Code for executeWithCallback() is trivial I suppose. So, make your code really asynchronous to make it robust and avoid problems like this. Good example is SAJAX library: http://www.modernmethod.com/sajax

JsUnit integration

2007-04-24T05:50:00.000-07:00

Today we tried to integrate JsUnit. One of issues was how to execute JavaScript tests within other unit tests (PHPUnit of version 2).

The tests must be easy to execute, but at first sight it looks like you should insert urls to your tests in JsUnit runner and click Run button every time to look at test results. Fortunately JsUnit understands query strings: testPage and autoRun. It makes life much better...

The first attempt was calling JsUnit runner via iframe in the test result page. It was unsuccessful because the runner uses some top elements from the page. And if the page is displayed in the iframe then the elements are got from PHPUnit test page result, not from runner's page itself. So the attempt was failed.

The next thought was to open test pages in JavaScript popup windows. We have done the following: install the JsUnit into tests/js/jsunit folder and create a tests/JavaScriptTest.php file with the test method:

function testJavaScript() {
 $jsTestPath =  $_SERVER["SERVER_NAME"] .       
   dirname($_SERVER["SCRIPT_NAME"]) . '/js';

  $tests = array();
  foreach (glob("js/*.html") as $filename) {
   $tests[] = basename($filename);
  }

  echo "<script language='JavaScript'>\n";
  foreach ($tests as $test) {
    $fullPath = "http://{$jsTestPath}" .
      "/jsunit/testRunner.html?testPage=" .
      "{$jsTestPath}/{$test}&autoRun=true";

    echo "window.open('{$fullPath}', '{$test}', " .
      "'location=1,status=1,scrollbars=1,width=950,height=500');\n";
  }
  echo "</script>\n";
}

It just scans for test pages in tests/js folder and generate JavaScript for opening them in a separate popups. We found it is very useful. Every time you run your test suites it execute JavaScript tests too. If a test is failed you can fix the code and run the failed test page until success without restarting of server side tests.

It is rather hard to say how to use JsUnit for testing AJAX stuffs or for visual (DOM) manipulations. Because it requires to create rather expansive environment. But if you have pure calculation JavaScript methods (for example something like hex2rgb color convertion, etc) then it could add a lot of stability to your project.

Other note is the JavaScriptTest should not be executed from your Cruise Control system (in case you don't use JsUnit server of course).