electroplankton

Text

Charge iPad from PC

ASUS Ai CharrgerClaims of being 50% faster may be applicable to the iPod or iPhone but one thing is for sure, you generally can’t recharge your iPad from a PC USB port because they’re usually limited to 500mA current whereas your iPad needs 1,000mA (1A).

The stupendously simple ASUS Ai Charger gizmo installs a tiny ~1KB start-up triggered process that instructs your motherboard, either desktop or laptop, to crank up the current limit on the USB ports.

My HP EliteBook 8440p has 4 built-in USB ports so I assume it can, at the minimum, deliver 4 x 500mA or 2,000mA. As long as my other USB devices aren’t greater than 1,000mA I won’t be exceedingly the standard capacity. The receiver for my wireless mouse says it draws 15mA; the peak current consumption during write for a USB memory stick that I can find is 110mA.

I reckon I’m good unless I start plugging in some of the 10 USB Gadgets to Help You Through the Winter.


Text

The day is as bleak outside as I feel inside. Oh, Beanie, why today? I’m going to miss you.


Text

jQTouch 101.2

Short and sweet. Add an About button to the homepage toolbar:

<div id="home">

     <div class="toolbar">

          <h1>101.2</h1>

          <a id="infoButton" class="button slideup" href="#about">About</a>

     </div>

</div> 

The change is the addition of line #4. As set by jqt/theme.css the class button styles the anchor to appear like a button but also positions it at the right-hand end of the toolbar.

About button added to homepage toolbar
About button added to the toolbar


Text

Internet Explorer not launching when debugging in Visual Studio

This one gets me every time. I start Visual Studio (any version, it’s happened in them all now), load up a web application and hit F5 to start a debugging session. And wait for Internet Explorer to pop up. And wait. And wait…

And then realise that Visual Studio is running in debug but you still don’t have IE. What?

I’ve never worked out what causes this: was it installing Visual Studio 2010 or upgrading ReSharper from 4.5 to 5.1 that did it this time?

The problem is that unless HTML files are set to use Internet Explorer as the default for browsing then IE isn’t launched when debugging. For some reason, in VS2010 there is no “Browse With…” option on ASPX files, so find or create an HTM/HTML file, right-click it, select “Browse With…”, select “Internet Explorer” and press the “Set As Default” button.

Visual Studio 2010 > Browse With... dialog


Photo
I’m travelling home on the train after seeing TRON: Legacy at the BFI IMAX in London. Initial thought: FRICKIN’ AWESOME Secondary thought: STILL FRICKIN’ AWESOME Final thought: QUORRA Zoom

I’m travelling home on the train after seeing TRON: Legacy at the BFI IMAX in London.

Initial thought: FRICKIN’ AWESOME

Secondary thought: STILL FRICKIN’ AWESOME

Final thought: QUORRA


Text

jQTouch 101.1

Download the jQTouch source code and extract the zip file to your development web server maintaining the folder structure. Within the top level of the extracted files create a new folder called projects and within it another new folder called 101.

Within the new 101 folder create a new HTML file called 101.1.html and add the following code which, I believe, constitutes the minimum markup required to build a jQTouch application:

<!doctype html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>101</title>
        <style type="text/css" media="screen">@import "../../jqtouch/jqtouch.min.css";</style>
        <style type="text/css" media="screen">@import "../../themes/jqt/theme.css";</style>
        <script src="../../jqtouch/jquery.1.3.2.min.js" type="text/javascript" charset="utf-8"></script>
        <script src="../../jqtouch/jqtouch.min.js" type="application/x-javascript" charset="utf-8"></script>
        <script type="text/javascript" charset="utf-8">
            var jQT = new $.jQTouch();
        </script>
    </head>
    <body>
        <div id="home">
            <div class="toolbar">
                <h1>101</h1>
            </div>
        </div>
    </body>
</html> 

Looking down the code:

  • The doctype is HTML5.
  • The encoding is UTF-8 so make sure you save and serve your file as UTF-8.
  • jqtouch.min.css adds core style, mostly CSS3 transformations to mimic iPhone page animations.
  • Second CSS import is for the default jqt theme.
  • The jQuery Javascript library is referenced followed by the jQTouch library.
  • An inline script block initialises jQTouch without any parameters.
  • The body contains a single div. jQTouch turns immediate descendants of the body into pages within an application.
  • Each top-level div must have an id (home in this example) to enable navigation between pages.
  • Within the home div is another div of class toolbar. The jqt theme will style this as a 45px high toolbar at the top of the page.
  • Finally, an h1 within the toolbar is styled by the jqt theme as a centralised page title.

Viewed in desktop Safari it looks like this (I have resized the window to 320 x 640).

iPhone Web App built using jQTouch

It doesn’t do much but it is an iPhone web app!


Photo
Damn you, Apple! It&#8217;s a masterpiece of marketing. So simple. No sexy young people. No alluring or exotic location. Just a finger and one word. iPad. Zoom

Damn you, Apple! It’s a masterpiece of marketing. So simple. No sexy young people. No alluring or exotic location. Just a finger and one word. iPad.


Link
Check out my neat facts on Facto

Facto is the website that was conceived and launched in 24 hours.


Photo
So close. Just missed getting my clock as it read 11:11:11&#160;11/11/1 Zoom

So close. Just missed getting my clock as it read 11:11:11 11/11/1


Text 2Notes

Generic Mobile Web Pages - Pt. 2

Having chosen the appropriate DOCTYPE (see Pt. 1) my basic document looks like:

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>News</title>
    </head>
    <body>
    </body>
</html>

Next task was to work on the <head> element. First up, getting some <meta> data in there. As I’m sending XHTML-MP 1.0 I should inform the client by setting the content type accordingly. Also, as it’s Latin-based XML I can use UTF-8 for the character encoding:

<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />

Now I can start adding some <meta> data to make the pages mobile friendly. To help the BlackBerry browser I can tell it that the content is “HandheldFriendly” and similarly for Mobile Internet Explorer let it know we’re “MobileOptimized”. The idea here is that by telling the browser the content is designed for a mobile device it should render it at a 1:1 scale instead of trying to simulate viewing a desktop page.

<meta name="HandheldFriendly" content="True" />
<meta name="MobileOptimized" content="width" />

In a similar but more precise manner I added <meta> data for the iPhone:

<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"/>

This tells Safari to render the page at the same width as the screen, that it should be scaled to 100% and that the user is unable to re-scale the content. This will prevent Safari from rendering at the default width of 900px and re-scaling to fit the screen thus making the text so small as to be unreadable.

Finally, to assist with caching and prevent the page from being reloaded every time it is viewed the “Expires” date is set to 7 days after the publication date of the newsletter:

<meta http-equiv="expires" content="Tue, 21 Sep 2010 08:00:00 GMT">

12
To Tumblr, Love PixelUnion