17 entries tagged javascript

Quiz: How tall are you?

A new on-line quiz for all you people out there: How tall are you? I have added Javascript code to the page so that it works out the answer for you (if you have Javascript disabled in your browser you should still be able to read the page, you just won’t get any help counting your answers). I have also taken the liberty of decorating the page with SVG doodles. This may or may not give your browser conniptions...:-)

SVG notes. I have tested it on Mozilla on Linux sans SVG; the fall-back PNG images display correctly. MSIE 4.0 on Windows NT with Adobe SVG plug-in 3.0 displays the SVG correctly—you can zoom in and view SVG in another window etc. And at work I verified (in MSIE 5½) you can print the page, in which case the pictures are rendered with the printer’s resolution, not the screen’s. Cool! MSIE/Mac 5.0 on my decrepit Performa sort of goes loopy while the SVG files download, then each doodle turns blank when you scroll the page; frobbing the the zoom or quality causes the image to redisplay. Weird.

Fixed a JavaScript problem, one remains

Before going in to work today I have managed to fix one of the JavaScript problems (it causes MSIE to report ‘one error on page’), but only half-fixed the other (which causes artists’ names with links to vanish when you cycle through the panels). In the latter case, the name no longer vanishes, but, alas! the link does.

I think need a JavaScript debugger—in other words, to install Mozilla on my PowerBook (the only computer I own with enough welly for Mozilla). Ho hum.

Remember my details

I have added JavaScript to the upload form Picky Picky Game on caption.org to optionally remember your details for next time (using a cookie). This way you don’t have to enter your URL each time you upload a new panel.

Debugging JavaScript without a JavaScript debugger is a real pain in the arse, and illustrates how subtle aspects of language design affect the experience of working in that language. There is one crucial difference between Python and JavaScript. In Python, a variable is implicitly created the first time you assign to it; in JavaScript, it is created the first time you refer to it. This means that the following fragment is valid JavaScript:

var cookieHeader = this.$document.cookie;
var m = myRegexp.exec(cookiesHeader);
if (m) {
    ... use the match info to process the cookies ...

The equivalent Python looks like this:

cookieHeader = self._document.cookie
m = myRegexp.search(cookiesHeader)
if m:
    ... use the match info to process the cookies ...

In the JavaScript version, the regexp (used to extract one cookie from the Cookies header) will mysteriously never match and you will spend ages scrutinizing the regexp and flipping though the documentation on what is and is not valid regexp syntax in JavaScript. In Python you will get an error message telling you that the variable cookiesHeader is referred to before it is assigned to—and immediately realise its name is misspelled in the second line.

The tedious thing about testing the ‘remember me’ option is that it involves repeatedly doing the very thing it is supposed to be saving me from: entering my URL and details on the picture-upload form. Luckily I was testing on Safari, which has a form auto-completion feature that makes repeatedly filling in the form less annoying—but which also makes the ‘Remember me’ feature almost entirely redundant ;-)

JavaScript image loading problems

The image-cycling feature of the Picky Picky Game prototype depends on using JavaScript to load images. If you click on the Cycle button before the images have been prloaded, then nothing visible happens—it appears to have failed. There is no way for the user to see whether the images have loaded or not. I have attempted to add such an indication, only to be thwarted by what appear to be bugs in the web browsers I have tried it on. Read more

Alleged Tarot brush-up (3)

The SVG-powered simulated deal now works on Safari. In the end I achieved this by using the special attribute that signals to Adobe that it should use its own JavaScript engine, not its host’s (in this case, Safari’s). I have also belatedly switched the script to using document.URL to find its URL rather than the HTML-style location.search (which fails on Safari as well). Read more

Simplicity versus Flash

Last week I was struggling with Adobe Flash development, wishing that my recommendation that we drop Flash and spend the programming time on improving our fall-back HTML+JavaScript version instead had not fallen on such stony ground. Then on Sunday there was a flurry of articles speculating that not only is Apple’s iPhone missing an implementation of Flash, but Apple might not intend to add one---and might even want to start pushing web developers towards alternatives like HTML+JavaScript. Read more

Hello CouchDb version 1.0

This weekend—over and above working on our ongoing greenhouse-erection project—I have created a simple explorer for CouchDb servers that for want of a better name I have called Hello. Read more

Fun! with Ajax

A couple of weekends ago I decided to take up one of the Work Items for CouchDb: write a client for the server that runs as JavaScript in the user’s browser, Ajax-style. As someone whose day job is writing web sites using Microsoft ASP.NET and Microsoft SQL Server, writing an application in plain JavaScript+HTML comes as a refreshing change. Read more

Making Cards Sortable for Kanbo

The plan with Kanbo is to skip having priority fields for tasks and instead to just let the cards be rearranged in whatever order you like. This poses a couple of technical challenges: first, the only nice user interface for rearranging things is drag-and-drop, and second, relational databases are notoriously wedded to the idea that entities are an unordered set, so how should the order be represented? Read more

Simplify, simplify, simplify with React

I wanted to have a little React project of my own to play with, so I have React-ified the entry navigator links on my blog pages. This is partly to in order to get some practice in with this different way of approaching JavaScript interactivity. Read more

Slimming My Blog Page

After reading the text version of a talk by Maciej Cegłowski titled The Web Obesity Epidemic I felt pretty smug because I thought I had redesigned my blog on reasonably minimal lines. Then I checked and was chagrined to discover a recent entry page was 1.01 MB compared with Maciej Cegłowski’s entire talk weighing in at slightly less than 1 MB. I decided to try to work out where I went wrong. Read more

Programming in the Future with Webpack

I figured that the first step in fiddling with the JavaScript code I use on my navigation widget will be to convert it in to a more fashionable build system, such as Webpack. Can I reduce the bandwidth usage of my pages thereby? Read more

St Ouses Redux

I have started building a toy web application to give myself something to try out some of these newfangled JavaScript frameworks like React and Redux. Read more