Mobile Phone/PDA Web Browser Screen Size Detection

Posted 2008-07-29 in Mobile Web by Johann.

iPhone

Photo by mawel. Some rights reserved.

Screen size detection of mobile phones and PDAs seems to be a minefield – I had planned to spend minutes on this…

Screen Size in the User-Agent

IEMobile and Opera Mobile on Windows Mobile and the Palm Blazer browser send the screen size in the user agent string using a WIDTHxHEIGHT form. Examples include Dopod818Pro/Mozilla/4.0 (compatible; MSIE 4.01; Windows CE; PPC; 240x320; Dopod818 Pro) or Xda_trion; 240x320 (compatible; MSIE 6.0; Windows CE; IEMobile 6.12). A simple regular expression like ([0-9]{3})x([0-9]{3}) should work here.

Opera Mini

Opera Mini sends a X-OPERAMINI-PHONE-UA header with the request that contains a handset-specific user agent string whose value ends with …PPC; 240x320 on my PDA.

IEMobile

IEMobile additionally sends a UA-PIXELS: 320x240 header with its requests.

X-OS-PREFS

Featured in older Opera browsers on Symbian. Looks like X-OS-Prefs: fw:176; fh:208; ….

PROFILE, X-WAP-PROFILE, X-WAP-REMOVEDPROFILE, OPT

WAP-era headers that point to a UAProf profile of the mobile device. This URL needs to be loaded and parsed for the prf:ScreenSize element. Seems to be mostly used in Nokia mobile browsers.

UA-PIXELS, X-UP-DEVCAP-SCREENPIXELS, X-JPHONE-DISPLAY

These seem to be present in certain (unmentioned) mobile phones.

Other X-… Headers

There are even more X-… headers.

Given this complexity, does it make sense to invest in a abstraction library like WURFL? I see less of the “old” mobile browsers every day and WURFL is never complete anyway.

6 more jQuery Tips: Text Searching, Page Load Time and Others

Posted 2008-07-22 in JavaScript by Johann.

After the first and the second round of jQuery tips, here are 6 more JavaScript snippets.

Searching for Text with jQuery

This function performs a recursive search for nodes that contain a pattern. Arguments are a jQuery object and a pattern. The pattern can be a string or a regular expression.

$.fn.egrep = function(pat) {
 var out = [];
 var textNodes = function(n) {
  if (n.nodeType == Node.TEXT_NODE) {
   var t = typeof pat == 'string' ?
    n.nodeValue.indexOf(pat) != -1 :
    pat.test(n.nodeValue);
   if (t) {
    out.push(n.parentNode);
   }
  }
  else {
   $.each(n.childNodes, function(a, b) {
    textNodes(b);
   });
  }
 };
 this.each(function() {
  textNodes(this);
 });
 return out;
};

Demo: Highlight all nodes containing a text node that contains the word “jQuery”.

Case-Insensitive Contains Check

By using case-insensitive regular expressions, this becomes rather easy:

var pattern = /exp/i;
$('#id').filter(function() {
 return pattern.test($(this).text());
});

Demo: Turn all list items that contain “bla” bold.

  • Blabla
  • Keks
  • BLA

Super small jquery.js

Many people want an even smaller version of jQuery. The combination of YUI and JavaScript Utility yields a 26807 B jquery-1.2.6.js file which is almost 15 % smaller than the regular size of 31033 B.

Log Page Load Time

With large pages or pages containing inline JavaScript, it is a good idea™ to monitor how long pages take to load. The code below is different from waiting until onload is fired and only measures page load time.

<html>
<head>
<script type="text/javascript">
var t = new Date();
</script>
… (your page) …
<script type="text/javascript">
new Image().src = '/load.gif?' + (new Date().getTime() - t.getTime());
</script>
</body>
<html>

load.gif can be a generic 1*1 pixel GIF. You can extract the data from your log files using grep and sed.

Reload an IFrame

Accessing the contentWindow property to obtain the location object.

$('#iframe').each(function() {
 this.contentWindow.location.reload(true);
});

Demo: Force a reload of the IFrame below.

Callback for IFrame Loading

With the onload event, your code is called when an IFrame has finished loading.

$('#iframe').load(function() {
 // do something
});

Demo: Force a reload of the IFrame below.

I hope you find these tips useful.

Vox Tone Bender Germanium Fuzz

Posted 2008-07-10 in Effects by Johann.

Tone Benders

The Vox Tone Bender is a 60’s Fuzz guitar effect. It’s very similar to the legendary Fuzz Face in design but sounds thinner, more aggressive. Despite the name, this Tone Bender flavour has little in common with the previous three-transistor incarnations.

Vox Tone Bender * 3

Still, these do have Germanium transistors (SFT 363 E and SFT 337) so they must be good, right?

Audio Clips

In the sound sample, I use my Ibanez 2027XVV seven-string guitar into a little amp modeller.

Even though the images above show three Tone Benders, I sold two of them. Sorry.

3 comments

Centralizing Resource Closing for Cleaner Code, Fun and Profit

Posted 2008-07-07 in Java by Johann.

Resources are openend and closed in every software. The opening is obviously different for different resources, but the closing isn’t.

99 % of the time, the closing code looks like this:

finally {
    if (xyz != null) {
        try {
            xyz.close();
        }
        catch (XyzException ex) {
            // Log it, ignore it or flip it and reverse it.
        }
    }
}

That’s a lot of code for such a simple task.

Centralizing Resource Closing

Since most resource classes have a close method, we can simplify this by

  • calling the close method via Reflection,
  • either logging or ignoring any exceptions,
  • using varargs to close multiple objects at once and
  • using static imports to reduce the amount of boilerplate code.

Using these techniques, all of the above code essentially becomes

finally {
    close(xyz);
}

Potential Problems

  1. Not all APIs use close. JSch for example uses disconnect.
  2. More than just close needs to be called in some APIs. For example, the grotesque JMS API forces you to call stop before close.

The Code

Download Resource.java and the test case.

Resource needs log4j in your classpath, the test case additionally needs EasyMock, the EasyMock Class Extension, the Code Generation Library and ASM.

Closing Resources

Import

Assuming you have downloaded the source file and put it in its com.eaio.util package, continue by adding a static import to your classes.

package xyz;

import static com.eaio.util.Resource.close;

Special close methods

Some classes have a special closing method. You can set them up by calling the insteadOfClose method.

Resource.insteadOfClose(MySupahClass.class, "selfDestruct");

The method scanning is recursive and takes interfaces into account so MySupahClass can be an interface or a common superclass.

Before-closing methods

Some classes require other methods to be called before they can be closed.

Resource.beforeClose(Keks.class, "sayGoodbye");

Any implementation of Keks will now have its sayGoodbye method called before close is called.

After-closing methods

Special methods can also be called after a resource has been closed.

Resource.afterClose(Keks.class, "kThxPlzBye");

Varargs

Resource.close will close all resources in the order they are given.

finally {
    close(inStream, outStream, rset, stmt, conn);
}

Any of the arguments can be null or throw an exception.

Logging

Resource (perhaps incorrectly) assumes that nobody is interested in exceptions that happen when resources are closed. To see them, set the logger of com.eaio.util.Resource to DEBUG or TRACE in log4j.properties.

log4j.logger.com.eaio.util.Resource=DEBUG

If the log level is DEBUG, any exceptions will be logged with WARN level in a short format. If the log level is TRACE, the full exception stack trace is logged.

Summary

It’s amazing how much code that does the same is replicated across larger projects. By relying on reflection, a lot of essentialy duplicate code can be removed.

Pages

Page 4 · Page 5 · Page 6 · Page 7 · Page 8 · Page 9 · Page 10 · Next Page »

Subscribe

RSS 2.0, Atom or subscribe by Email.

Top Posts

  1. DynaCloud - a dynamic JavaScript tag/keyword cloud with jQuery
  2. 6 fast jQuery Tips: More basic Snippets
  3. xslt.js version 3.2 released
  4. xslt.js version 3.0 released XML XSLT now with jQuery plugin
  5. Forum Scanners - prevent forum abuse
  6. Automate JavaScript compression with YUI Compressor and /packer/

Navigation