Tag Archives: blackberry

Where Do I find My WiFi MAC Address on My BlackBerry? CodeUnit 05 AUG 2011

To get your BlackBerry MAC address off most of the recent BlackBerry models is pretty simple.

Navigate to the home screen (the one with all the icons on it) and select the Options launcher. Click on that and then scroll down and select the Status option.

The resulting screen will show your MAC address, amongst the other useful bits of information you might not have known regarding your current device!

Nifty.

BlackBerry QR Code Reader CodeUnit 27 APR 2011

QR Codes are useful ways to visually encode data like URLs or Contact Details or just about any string you want to in a nice black and white square diagram. To read them, you basically just need to take a picture of them and then let a QR Code Reader handle the rest. So what is the easiest way to read QR codes on your BlackBerry?

Well the easiest way turns out to be the standard BlackBerry IM workhorse of choice for most people, BlackBerry Messenger or BBM if you prefer the acronym.

Simply open BBM and then select “Scan a Group Barcode”. The camera will open and once you have the desired QR code in focus, the system will prompt you that it has picked up a QR code and will want to know what to do next – like browse to the URL for example!

Simple and nifty.

Web on the BlackBerry: Customize File Upload Input Style CodeUnit 21 DEC 2009

blackberry8820One of the things we do here at Touchwork is create web-based audit capture systems which are intended for use on mobile phones by various auditor class people. One such system that we currently run at the Manchester Airports Group came back to report that the photo upload button was in fact not behaving correctly on the BlackBerry, the most likely culprit being the minimized styling we employ on the mobile site itself.

Of course, seeing that the file upload button seems to be working perfectly fine on other makes of phone currently in use, I took the decision to implement a fix exclusively for BlackBerry devices and so inserted a check based on the user agent passed back by the phone:

if (strpos(strtolower($_SERVER['HTTP_USER_AGENT']),'blackberry') === false)
{
//carry out normal code
} else {
//do blackberry-specific stuff
}

The next step was then to figure out just how I was going to solve my particular problem. Remembering that I have no javascript or other client-side scripting tools available to me, the solution would have to lie in plain old CSS trickery – and that’s exactly what I (with some help off the web) came up with!

So the solution?

Well essentially it is a matter of tweaking the file input type’s opacity to zero, thereby leaving it functional but at the same time invisible to the user browsing the page. Next is to make use of a label and size it so that is overlays the input box and essentially becomes a faux button, as clicking on it is actually triggering the file upload button that is lurking unseen above it.

So simple enough, but it works like a charm, the only drawback being of course that a user doesn’t get notified on the screen once he has selected a valid file to upload – but I guess we can’t both have our cake and eat it as well after all!

So, the mark-up you’ll need for this little trick is:

And the styling to be applied to this is:

/* FILE UPLOAD CSS TRICK FOR BLACKBERRY */
.file-upload {
	overflow: hidden;
	display: inline-block;
	position: relative;
	vertical-align: middle;
	text-align: center;

	/* Cosmetics */
	color: #fff;
	border: 2px solid #ff872f;
	background: #ffb36f;

	/* Nice if your browser can do it */
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	text-shadow: #000 1px 1px 4px;
    }

.file-upload:hover {
	background: #ff872f;
	}

.file-upload.focus {
	outline: 2px solid yellow;
	}

.file-upload input {
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	font-size: 70px;

	/* Loses tab index in webkit if width is set to 0 */
	opacity: 0;
	filter: alpha(opacity=0);
	}

.file-upload strong {
	font: normal 1.4em arial,sans-serif;
	}	

.file-upload span {
	position: absolute;
	top: 0;
	left: 0;
	display: inline-block;

	/* Adjust button text vertical alignment */
	padding-top: .45em;
	}

/* Adjust the button size */
.file-upload { height: 2.5em; }
.file-upload,
.file-upload span {	width: 9em; }	

.file-upload-status {
	margin-left: 10px;
	vertical-align: middle;
	padding: 7px 11px;
	font-weight: bold;
	font-size: 16px;
	color: #888;
	background: #f8f8f8;
	border: 3px solid #ddd;
	}
/* END FILE UPLOAD CSS TRICK FOR BLACKBERRY */