Mobile Phone/PDA Web Browser Screen Size Detection
Posted 2008-07-29 in Mobile Web by Johann.
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.
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.
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
- Not all APIs use
close
. JSch for example usesdisconnect
. - More than just
close
needs to be called in some APIs. For example, the grotesque JMS API forces you to callstop
beforeclose
.
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
- DynaCloud - a dynamic JavaScript tag/keyword cloud with jQuery
- 6 fast jQuery Tips: More basic Snippets
- xslt.js version 3.2 released
- xslt.js version 3.0 released XML XSLT now with jQuery plugin
- Forum Scanners - prevent forum abuse
- Automate JavaScript compression with YUI Compressor and /packer/