mo.notono.us

Lunch-time fun with QR codes

2012-05-10T13:01:00.001-05:00

Starting with a B/W Oscar the Grouch image, and running it through the QArt Coder, got me here http://research.swtch.com/qr/show/e27c9ec04e3013fe - Paint.net took me the rest of the way...

Read about how this works at http://research.swtch.com/qart

I <3 IE8

2012-04-04T12:06:00.001-05:00

No, not really.

On our recently completed Vogue Archive project, IE8 support was a requirement, due to a large number of potential users being stuck at the office on Windows XP with no freedom to install a better browser. (We had a similar requirement for Firefox 3.6 support, but nowhere near the same kind of trouble with that browser though it was definitely the second worst browser in our field).

Background

The Vogue archive is an HTML5^* + Silverlight application: we have two viewers, one built in HTML5 (for tablets and desktop browsers that support it), one built in Silverlight (for all desktop browsers). Both viewers are housed within the same HTML5 "chrome" - see yellow sections in the image below:

IE8, of course, was released years before HTML5 started its meandering way through the standardization process, so it should hardly be expected that IE8 should support HTML5.

Mmm, Cookies!

It should be expected, however, that IE8 could support HTTP cookies properly.

Not so much.

We got an error report from the field that when IE8 users logged out from the archive, and then logged back again, the logon process went through, and then promptly redirected them back to the unsecured welcome page at the start of the logon process. Hm. Sure enough it did. The excellent error report also stated that for some reason they were seeing two authentication cookies, one of which was empty. Could that have something to do with it? Huh?

[Quite some time later]

The problem was indeed related to the double-cookies, but it appears it was actually caused by how IE8 interprets cookie expiration dates:

The standard way to delete a cookie is to create a new cookie with the same name, in the same domain (and path), with an expiration date set to a date in the past. A pretty standard date to use is the 'epoch' start date (JavaScript's beginning of time) - midnight of 1/1/1970, GMT, represented as "Thu, 01-Jan-70 00:00:01 GMT;"

For whatever reason, IE8 sees this date, and attempts to convert it to local time - in our case (EDT) 4hrs earlier: 12-31-69 08:00:01 PM. Slight problem - since '69 was before the start of the epoch, this is then further interpreted as meaning 2069 (never mind the second bug that a winter time should be converted using EST - aka GMT-5hrs). So rather than creating a new cookie that immediately expired and thus was deleted, we ended up with a new very long-lived cookie.

To complicate things further, as a brute force way for us to make sure we delete both local and domain cookies (we don't know the preference of the client), in our delete-cookie script we actually create two expired cookies, one for each domain (i.e. vogue.com and archive.vogue.com). It appears the login/logout process got confused and sometimes read one cookie (empty, expiring in 2069) and sometimes the other (valid session cookie).

Solution

While the analysis was complex, the solution was simple - we now use an expiration date of 1/1/2000 rather than 1/1/1970 - now IE can convert times all it wants, and it still stays a date in the past, and the cookie is expired.

Tell Them Again

I <3 IE8.

idea: bookmarklet to persist personal form data in localStorage

2012-03-30T13:52:00.001-05:00

As a developer, I frequently have to clear my browsers cache, and also cookies, in order to test a site. This is a PITA as now I'm logged out from Google, PivotalTracker, etc, etc.

It also showcases how very few sites store login information in localStorage by default (note to devs, if you're to offer a "Remember Me" button, use localStorage, not a cookie).

So my idea is this: a set of two bookmarklets: the first would retrieve any form data entered in a form (prior to you submitting it) and store that data in localStorage, then the second would fill out a form using the data stored in localStorage for that site.

What about security you might ask? Well, clearly this should only be used on a personal computer - and maybe password fields should be excluded in any case. But this is stored locally, it is not transmitted anywhere, and the data is not accessible to any other site, so the data should stay between you and your computer. One exception would be any potentially malicious script hosted on the site, but that seems like a risk in itself - the same script could much more effectively simply grab the form data on entry.

So - good idea or bad?

Rolling Stone Federated Search

2012-02-14T10:30:00.001-05:00

RollingStone.com just deployed a new federated search feature, showing top results from the Rolling Stone Archive along with the regular site search.

My team member David Benson created the search service used in the federated search, a stand-alone Archive search page, and all the necessary glue to automatically direct users back to the intended content after authenticating.

The end result is a great way to tie the archive deeper into the Rolling Stone site, and to provide historical context to a user’s search:

When clicking on an archive link, if not authenticated, you are presented with an upsell/login page.

Once signed in you are then shown the article you clicked on:

Or if you clicked the View All items link, the full archive search, with facet filters and sorting options:

Enjoy!

Vogue Archive On CBS Sunday Morning

2012-01-27T14:53:00.000-05:00

Since we built it, and it's not every day our products appear on national TV here is the obligatory self-congratulating video embed. Enjoy.

from CBS News: Vogue puts its 120-year history online

I’m turning Japanese, I think I’m turning Japanese, I really think so...

2011-12-12T10:47:00.001-05:00

To all Japanese/Chinese/Koreans readers out there, my apologies: I have no idea what language this is that Chrome is using. But the song came to mind, and thus the title. The bigger question is: why on earth is this error coming up like this?

A non-trendy way to wrap text to the width of an image

2011-11-16T10:35:00.001-05:00

Say you have an image, whose width is unknown. You want to display a caption below the image, and the length of the caption text is also unknown. How do you display the caption so that the text wraps to the width of the image?

As far as I know, there is no way to do this with divs and Css. It *may* be possible to do it with figures and figcaptions, but now you’re in Html5 land, and to support older browsers you’ll need to do gymnastics.

You could use an img load event handler and resize the caption after the image comes in, but now you have to add javascript for something that should be handled by your html.

So you use tables. Yes tables, those horrible, horrible remnants of Web 1.0.

And you do it like this (though your styles would obviously be in a css stylesheet somewhere):

<table>
<caption style="caption-side: bottom; margin: 0 5px;">Oh caption, my caption! our fearful task is done!<br>
The layout has weathered every wrack, the prize we sought is won</caption>
<tr><td><img alt="some unknown sized image" src="http://upload.wikimedia.org/wikipedia/commons/thumb/1/14/Ocaptain.jpg/394px-Ocaptain.jpg">
&/lt;tr></table>

which renders thusly (Live writer may corrupt this - sorry view-sourcers):

Oh caption, my caption! our fearful task is done!
The layout has weathered every wrack, the prize we sought is won

Also see http://jsfiddle.net/austegard/fGwve/

Getting the schema of a dataset from a webservice

2011-09-13T21:12:00.000-05:00

I found the following in my Blogger Drafts folder from two-thousand-and-freaking-five. Since I had completely forgotten about this and never published it, I figured I'd do so now...

1/20/2005:
In a comment to : Evil = WebService DataSet; //Fix this, Gary McDonald mentions:

You are familiar with the auto-generated WSDL obtained by calling your ASMX with the ?wsdl request, so try ?schema=xxx where xxx is the name of the returned XSD.

For example, if I have an ASMX at http://www.tempuri.org/MyService.asmx and It has a Method named Foo that returns a typed dataset named Bar, I can get the schema from http://www.tempuri.org/MyService.asmx?schema=Bar

I wasn't aware of that. Cool.

Trying Google Scribe...

2011-09-13T21:02:00.000-05:00

This morning I was doing some cleaning of my Bookmarks bar in Chrome, when I came across a forgotten Bookmarklet - Google Scribe. It looks like the Scribe Lab program has since graduated and been rolled into Blogger's 'Draft' program, which is where I'm trying it as I type this.

On my phone, I use Swiftkey, which works in a similar manner; I start typing a word, and the program suggests not only the completion of the word, but as soon as I type space, it suggests the statistically most probable next word.

Kind of freaky, but highly effective on my phone at least. It's also interesting to see what it thinks I should be writing. Example: I will type a word and let Scribe choose next ones: Suggested words and word completions are highlighted:

The first day of the week and I have to take a break from the past to the future of my children.

Pure poetry.

Recipe for annoyance

2011-08-29T11:15:00.001-05:00

For whatever reason, this was the power setting on my new laptop.

This is NOT a recommended setting – unless you don’t ever want to use your laptop when running on batteries…

Stop Word and Live Writer from Replacing "Straight Quotes" with “Smart Quotes”

2011-08-15T09:53:00.001-05:00

Whenever I write any coding documentation, Word and Live Writer like to “help out” by auto correcting some stuff that I’d rather it left alone, since it tends to break code samples. Quotes are on top of that list – so here goes:

From the ICan’tBelieveIHaventDoneThisBefore department, here is how to stop Word from replacing "straight quotes" with “smart quotes”.

In Word, hit the Office Button, then Word Options, then the Proofing tab, then the AutoCorrect Options, then the AutoFormat As You Type tab, then uncheck "Straight quotes" with “smart quotes”.

(thanks to Herb Tyson who posted this here: http://help.lockergnome.com/office/prevent-Word-Outlook-Replaceing-Apostrophes--ftopict987047.html)

In Live Writer, it's a bit more straight-forward, simply select the (tiny) Live Writer button, then Options, then Editing, then uncheck Replace "straight quotes" with “smart quotes”

There – "that's better".

Password insanity

2011-08-13T20:45:00.001-05:00

Tonight I had to fill out some official paperwork and went online to get it done. (Before I start griping – the online form was fine, I could fill it out with minimal problems and got a nice PDF with all the entered info at the end.)

But to get to the form – oh boy.

I’d been to this site before, so I knew I had an account – I guessed my password – err. Ok, time to hit the forgot password link.

Oh – ok, “the password expires every 60 days”, so that’s why. I enter the answer to my “secret” question (the answer to which is a matter of public record, and would probably take a hacker 5 minutes to figure out) and am allowed to attempt to enter my new password. Err. “Your password can not contain more than three consecutive letters from your old password”.

Alright odd, but, attempt 2. Err. “Your password must be at least 8 characters”.

Ok, fine – should have guessed that. Attempt 3. Err. “Your password must contain a special character AND two entries from the three groups: number, upper case and lowercase.”

Uhm – ok?. Attempt 4. Err. “Your password must begin and end with a letter.”

WTF? Attempt 5: I enter an upper case letter, a set of adjacent keyboard symbols, and a lower case letter and lo and behold the password is accepted.

Don’t ask me what the password was – even if I WOULD tell you, I couldn’t – I have already forgotten. But that’s fine, next time I’ll just repeat the same exercise and get in by answering my “secret” question.

XKCD says it oh so well:

archive.rollingstone.com – another feather in our cap

2011-08-11T09:59:00.001-05:00

With the successful launch of the new iPad-enabled Rolling Stone Archive, I figured I’d take the time out to congratulate our client, Bondi Digital, and my team at Applied Information Sciences (AIS): Jim Jackson, Robin Kaye, Ian Gilman and Siva Mallena (with additional help from Leslee Sheu and Kevin Hanes).

Built on the same technology that we used to launch i.Playboy.com, the Rolling Stone archive combines our Silverlight viewer and the Html5, touch-optimized iPad viewer in a single site, sharing peripheral components such as menus and search features. Per client requirements for Rolling Stone all desktop users will get the Silverlight-based viewer, with its keyboard and mouse integration, and deep zoom of images, while iPad users are automatically switched to the Html5 viewer.

Building and optimizing a highly graphics intensive app like this for the excellent, but admittedly limited, iPad browser has been a thoroughly enjoyable challenge. Showcasing our work to the public through another premier publication like Rolling Stone makes it all the more satisfying.

Our team is already onto the next publishing project – stay tuned…

The Google+ killer feature is the menu bar

2011-07-12T19:34:00.006-05:00

I don’t know – and don’t want to know – how much time I spend on any one of Google’s sites per day. Now with Google+ the menu bar alerts me of notifications and lets me share from any one of these sites.

Sites thrive on content – the menu bar integration with Google+ makes it stupifyingly easy to share your content.

Because there are not enough cat pictures on the internet

2011-06-23T12:55:00.001-05:00

Lytro is introducing a camera that I would LOVE to have - the light field camera. Their tag line is "Shoot now, focus later". And you can - it works amazingly well: Click in the image below to shift the focus.

Fruit

2011-05-22T10:02:00.001-05:00

Someone's hacking my Blogger account

2011-04-09T14:38:00.000-05:00

To my annoyance, someone has successfully posted two porn-spam links as posts (not comments!) to my blog. I already changed my Google password, to no avail, so I am guessing they came in through the mobile/email interface, which I have now disabled. To all my 5 loyal readers, my apologies for the posts.

IE9 the new king of the Underscore performance tests

2011-03-24T15:04:00.001-05:00

See http://documentcloud.github.com/underscore/test/test.html and past tests: http://mo.notono.us/search?q=underscore

Welcome to TicketMaster. How may we fleece you today?

2011-03-23T21:42:00.001-05:00

Two mid-priced tickets to the Circus: $52.
Facility charge: $4.00
“Convenience” Charge to use our lousy website: $11.90
Order Processing Fee: $4.95
TicketFast^® delivery – cause it takes us TWO WEEKS to print and mail two tickets, so you may not get them in time: $4.95
Total: $77.40
Are you sure you don’t want to add another $7 per ticket to insure against not being able to make the event due to illness, airline delay or traffic accidents? (Cause 50% isn’t enough of a markup; we’d love to make it 75%.)

How, in an economy as market driven and litigious as the US has TicketMaster managed to become such an effective monopoly and not be priced – or sued – out of existence?

Practical example of jQuery 1.5’s deferred.when() and .then()

2011-03-01T18:21:00.001-05:00

"“Fun with jQuery Templating and AJAX” by Dan Wellman is a generally interesting article, but I found the code in the “Getting the Data” block especially interesting – see how each get function RETURNS the $.ajax function call, which can then be called inside a when() function, vastly simplifying the workflow (there’s an error in the listed code – getTweets() is supposed to return the ajax function, not simply execute it).

http://net.tutsplus.com/tutorials/javascript-ajax/fun-with-jquery-templating-and-ajax/

Even more interesting is this pattern, suggested by commenter Eric Hynds (whose blog has now been added to my Google Reader list):

http://net.tutsplus.com/tutorials/javascript-ajax/fun-with-jquery-templating-and-ajax/comment-page-1/#comment-357637

$.when( $.get('./tmpl/person.tmpl'), $.getJSON('path/to/data') )
   .then(function( template, data ){
      $.tmpl( template, data ).appendTo( "#people" );
   });

The deferred.done() and then() methods will take as arguments the results from each function called in the when() function – in order – i.e. the output of the get will map to template, and the output from the getJson will be mapped to data. This is pretty sweet!

Perhaps a simpler to observe example of the behavior is shown here: http://jsfiddle.net/austegard/ZaFVg/ - no prize for correct guesses as to the result of this…

/* Hello and World are both treated as resolved deferreds - they 
can be replaced with any function, like a $.get, etc */
$.when( "Hello", "World" ).then(
   function(x, y){ alert(x + " " + y); }
);

"Microsoft has completely lost the web development community."

2011-01-11T21:54:00.000-05:00

Last year Mark Pilgrim released a free e-book/site called “Dive Into Html5” (http://diveintohtml5.org/). The site/book has served as a valuable resource on a recent Html5 project we’re working on here at AIS, and I have frequently gone back for details on topics such as local storage and canvas. It is an excellent book for any bleeding edge web developer. It is so choice. If you have the means, I highly recommend picking one up.

This week, Mark posted his observations on how publishing a free e-book (which is also purchasable in print format) works well for him, and that it gives great insight into what parts of the book are being read, and by whom. He then makes the following observation:

6% of visitors used some version of Internet Explorer. That is not a typo. The site works fine in Internet Explorer — the site practices what it preaches, and the live examples use a variety of fallbacks for legacy browsers — so this is entirely due to the subject matter. Microsoft has completely lost the web development community. (emphasis mine)

I forwarded this internally within AIS, and a nice debate ensued. One common complaint was the hyperbole of the statement, and I agree; a more accurate line would likely be "Microsoft as a browser vendor has lost significant mindshare in the bleeding edge web development community."

Personally one of the things I love about Html5 (using the term the way the hypers would – to mean modern web development with client-driven UI interactions using JavaScript, CSS(3) and some HTML5 semantics) is that it has in some ways unified the web development community: The debate a few years ago was about JSP vs .NET vs PHP vs Python vs Rails vs someotherservertechnology. Folks from different camps seldom interacted and learned from each other. With Html5, the backend processes are completely irrelevant, as long as they don’t muck with the Html (ASP.NET webforms is still a major sinner here, unfortunately) and developers using all sorts of backend software and operating systems are now adding to the collective knowledge, mostly working towards the common goal of getting as much functionality as possible, pushed to end users through mostly standards compliant browsers.

For instance, our Html5 app is backed by ASP.NET MVC 2 and SQL server. We do all our development on Windows, in Visual Studio – we’re looking to deploy to Azure. Clearly we’re MS developers. But we could just as well have done the app in Php against MySql running on linux and apache, and we’re taking cues from folks using python, java, Rails, Node.js, php and God knows what on the backend.

At the same time I haven’t used IE by choice for about 5 years, maybe more…

I was asked what I thought MS could do to gain back some developer mindshare – so here goes:

My thoughts are that if Html5 and the set of bleeding edge technologists that go with it are any kind of priority for MS, they need to do some or all of the following:
Find a way to upgrade the legions of IE 6, 7 and 8 users to IE9. This will obviously not be easy, but they could do something similar to what Google did with Chrome frame (i.e. make IE9 a plugin for the older browsers), or they could do something like the makers of the “IE Tab” Chrome and Firefox extensions do, allow IE to be hosted inside Chrome, and only activate it for certain sites. Or let users install IE9 side by side with the older versions. All of these would have as goal to encourage end users to use the latest possible browser for the task they need it for, and to make them install IE9 instead of Chrome or Firefox.
Make IE9 the paragon of standards compliance. (They are actually getting close to this...)
Bring IE9 to WP7 and whatever tablet software they're coming out with.
Reduce the focus of Silverlight as a browser plugin, and make it more about web-deployed desktop apps.
Drastically improve the support for css and javascript in Visual Studio, including debugging and unit testing. And give this toolset away in the form of VS Express.
Evolve the Dev tools in IE9 to become better than Chrome's inspector and the Firebug plugin.
Separate the IE development from Windows to allow quicker iterations
Do more things like the jQuery deal. The world of CSS is a mess (we desperately need mixins and code forks like those provided by media queries), MS could take the lead here…

The point is, whether Mark’s browser percentages are statistically valid as an indication of web developer’s preferences, or to what degree Microsoft is lagging/losing developer mindshare; these are not the pertinent questions. The fact is that Microsoft is now not a leader in emerging web development areas – maybe they never were – but should they want to be, they need to take action. IE9 is shaping up to be a great browser, and they need to push it aggressively.

MS Word tip of the Day

2010-10-27T04:55:00.002-05:00

The No-Width Optional Break symbol. Heretofore known as NWOB™. Assign a shortcut key to it and use it, your word text flow (and readers) will thank you.

A NWOB™ is a symbol that tells Word that “don’t insert a visible space here, but if you need to break this text across two lines, this is a good place to do it.” This comes in handy if you have to write Shakespearesque prose like the following:
“service provided as part of a combined authentication/‌authorization/‌payment module”.

See how the lines wrap in an awkward, unsightly manner? (UPDATE: depending on your browser and the weather pattern, automatic breaks may actually already be inserted around the /s. Not so in Word - trust me.)

With the NWOB™, you too can flow your text gently to the margins of your document, leaving no unsightly large space behind in your document. ~~For just three easy payments of $19.99…~~ To insert a NWOB™ go to the Insert tab and click Symbol, then More Symbols. Then click the Special Characters tab, scroll down and locate the No-Width Optional Break. Select it, and before you do anything hasty, add a shortcut key, now that you know about it, you’ll want to use the NWOB™ again. (I use Ctrl+Shift+Alt+Space.)

So now your same Pulitzer worthy prose can flow more naturally:
“service provided as part of a combined authentication/authorization/‌payment module”.

PS! The  numeric reference is HTML4’s version of the NWOB™. I use it above in my Ctrl+Shift+Alt+Space shortcut. Note that annoyingly, Live Writer is not kind to this character, it removes it when you enter the Source panel.

Scandinavia in 6 words or less

2010-10-26T21:18:00.000-05:00

From the very interesting mashup of what you get when you cross Google Suggests with a Venn diagram, here is Scandinavia:

About right, if you ask me.

On Coffee

2010-10-19T21:48:00.001-05:00

Is it a coincidence that the Starbucks logo depicts a siren?

Random Info Chart - DC Schools Test Results

2010-10-19T20:03:00.000-05:00

Google public data explorer has a slew of interesting datasets, including test scores for DC schools. It goes to show that you can’t judge every DC school with a single statement, other than perhaps to state that the achievement gap between good and bad DC schools is far too wide: