Riviera Blog

It appears that my previous entry on calendars received some attention, so I thought I’d make a nice looking version for the New Year.

The design is somewhat arbitrary but it’s still possible to alter the parameters at the top of the JS file to change it. In fact there are now many more possible variations than with the last post.

To the download page!

If you’re still reading this, here’s a few technical notes:

• I managed to somehow fit a year (and a few extra days) in the calendar by stretching horizontally on some values of x. Hence the irregular aspect of the overall shape. I’d have rather have found a proper rectangular curve, though.
• Forget compactness! This layout may be defeating the purpose of the previous post, but it’s more practical in the end (e.g. for writing things on the calendar).
• Now it works in Opera, Batik and Firefox. It seems that Safari definitely doesn’t support SVG masking.
• I found a few other curve definitions (from fractint), but none worked better. They are in the source, though, so easy to play with.

Happy New Year!

There is some content on Joost that is actually quite good, and even when it’s available elsewhere, it’s often better quality on Joost. Perhaps now that the player can be embedded, such as below, it’ll be easier to share, especially if it alleviates the need for registering/loging on.

Disclaimer: I’m a former employee. Don’t take this post into account if you’re considering investing in Joost!

Summary

RSS feeds are sometimes too linear: you can’t quickly find the important news so you have to check every item. But Digg and other sites add an importance score to its feeds, allowing a more interesting way to read news. Diggtop is a small webapp that takes advantage of this by showing Digg’s most popular stories, taking importance into account. It then lets the user read or discard stories while maintaining a newspaper-like view of the news.

Context

An important difference between a newspaper and a news feed is that
the news in a newspaper are organised and presented by
importance, while a news feed is just a list of sequential and
similarly formatted stories. Online feeds are similar to news feeds, and so
lack the editorial work needed to bring the concept of
importance to news. Therefore the reader cannot quickly find what’s
essential to read and has to skim through the whole list, which can
take a lot of time. There are news sites that organise their pages
like a newspaper, either manually like one the site of any
newspaper, or automatically like Google News, using heuristics to
determine the importance of a news from how often it is talked about
on the web. If you get your news from feeds (RSS, Atom, Twitter,
etc.), you lose that.

Feeds are usually chronologically ordered. However they don’t have to: the
Atom specification states that it “assigns no significance to the
order of atom:entry elements within the feed”. RSS2 doesn’t mention
any ordering of the item elements . So it’s perfectly valid to construct a feed with items ordered by importance. Few feeds are, though, because
feed reading software expects them to be chronological. With one notable exception:
Firefox’s Live Bookmarks, which simply show the feed’s list, but with
no concept of hiding already seen stories, so not very useful.

Digg publish feeds of its stories, ordered by some measure of their
importance, i.e. the number of times someone has “dugg” a story. (One may
find that particular metric not very useful, but digg’s a very popular
website, which means many people do find it acceptable.) Digg also has a
nice REST API that can, among many functionalities, return the list of
all stories ranked by number of diggs.

Diggtop

We can use that API to build a newsreader that will show stories similar to a newspaper (big headlines for important stories), but will also offer dynamic functionalities found in feed readers to let you hide what you’ve already read, and also update automatically when new important stories are published.

Introducing Diggtop, a webapp that does just that.

How it works

- The user sees a page like the one above and can either click on a story’s title to see the actual story’s page, or on the story’s text to just discard it.

- When a story is read, or discarded, it is removed and is replaced by the next most important one (and a new unread story then appears at the bottom right of the page).

- Digg is checked regularly, and any new important story is automatically inserted in the page.

Behind the scenes

- A very simple PHP backend maintains a list of the stories the user has seen or discarded. It just allows storing and retrieving lists of {story identifier, timestamp} pairs.

- The front-end javascript code talks to both the backend API and Digg’s API to maintain a a list of stories to show on the screen. It all happens asynchronously in order not to block any interaction, and to maintain the application state across sessions.

(Clearly we’re describing a very simple Model-View-Controller architecture, and I may write a longer entry about it because it’s allowed me to learn a few Ajaxy concepts in the process.)

Diggtop seems to work well, and I actually use it myself. It could certainly be used for other similar services, as long as they provide some sort of score (reddit, slashdot, probably many more), and perhaps even mix stories from those services on the same page.

Using it

Unfortunately you won’t be able to use diggtop on this site. That’s because you need the PHP backend to be much more complicated that it is, in particular handle more than one user. But you can still use it on your site: just copy those 2 php files and put them on your server somewhere. Make sure that the http server is able to write files in the directory where you put the files, so that the php can create a file called urls.txt. Then put the html and js files in the same directory, and you’re ready to go. You’ll also need to grab a copy of jquery.js. And if you like it, you can contribute by writing that multi-user PHP backend (with authentication and all), or perhaps make the HTML pretty.

The files

addseenstories.phps,  addseenstories.phps,  diggtop.html,  diggtop.js
[tags]rss, atom, digg[/tags]

Update: SVG export now available

A new version of textorizer is available: textorizer1_2. Because it’s now a downloadable application (for linux, windows, and osx) it offers unprecedented functionality: a complete user interface for tweaking almost all possible parameters, the ability to use images on your disk, and of course it works offline.

This was made possible (and easy) thanks to Processing, as well as controlP5.

Feedback is welcome at max @ lapin – bleu . net

[tags]textorizer, graphics, processing[/tags]

Last night I came across the famous Vertigo poster by Saul Bass, which I really like. And it got into my head to figure out how the spiral was done. A couple of hours later I had something that wasn’t too far from it:

I’m posting the code here (I’ve used Processing). Maybe someone will find a great use for it! I’m not allowed to post the font, though. You’ll have to get it yourself at typographica.org.

If you’re just curious about how the spiral is drawn, it’s simply an ellipse that is rotated and shrunk at each step. The rotation and shrinking steps decrease asymptotically towards the central ellipse. I’d be quite interested to know how Bass did it.

[tags]graphics, processing, hitchcock, design, geometry, saul bass, vertigo[/tags]

This is purely for the benefit of people who may be googling for this piece of information, as I have been for the last 2 hours with great frustration. You’d think uploading a GPX file to the unit is simple and is just a matter of mounting the unit’s SD card and copy your file where the others GPX files are. Wrong. Grrr.

Here’s how I did it: download LoadMyTracks, plug your unit, but do *not* mount the card, then press “Send…” and select your GPX file.

[tags]gpx, gps, garmin, max, osx[/tags]

It must have happened to you too: you’re in your living room, surrounded by all your electronical gadgets, and suddenly you hear an alert tone. “Bong!”, “or dee-dee-dah, didadidah dee daah”. And you’ve forgotten which gadget it can be, or what application. Is it the default SMS alert on your Motorola i265? Or is it your Sony PSP telling you that firmware update 3.52 has completed? Or is it Adium’s sound for a private message on Jabber when you use the Synthetic Misc sound set? Or your TV, or your set-top box, or your watch, or your kettle, or your house-arrest ankle bracelet, or your tamagochi, or what?! You’re confused, you don’t know how to react, and you FAIL.

Wouldn’t it be nice to have one of those “name that tune” web services to help identify a standard sound? I haven’t played with one recently (I’m certainly not going to give some random Java/Flash applet access to my microphone) but I remember liking one that would let you input a tone as text, with a simple notation which only made you indicate if the next note is higher (h) or lower (l) or the same (*). For instance you entering “***lh**l” on the web form would return Beethoven’s fifth (and perhaps a couple of other hits). And it worked really well. Anyway, whatever the input method, a standard alert tone recognition service would be a great idea, and you heard about it here first.

I’ve been playing with Processing for a few weeks now, resulting in new version of the celtic hack. (Click the picture and watch in awe.)

Processing is nice because it’s Java under the hood, so it’s cross platform, object-oriented, it’s got a garbage collector and it’s not too hard to port C code. And on top of Java, Processing offers a very nice graphics API (I haven’t used much of it yet, but the basics are good and the documentation and examples show off nice extras). Especially nice is the fact that in order to write a hack, you can start very simply as you don’t have to be bothered with Java classes and imports:

void setup() {
  size(200, 200);  // window size
  background(0);   // background colour: black
  stroke(255);     // draw in white
}

void draw() {
  line(0, 10, width, height);
}

That’s all and it’s a very nice idea, especially for non-expert programmers (for whom Processing is especially designed), or for people like me who look at Java every 5 years and have to relearn how to start every time. The last nice feature is the IDE, which is simple but makes it very easy to develop apps. All this contributes to a very pleasant environment for writing small graphics hacks, running them and exporting them to standalone apps or applets.

However, where things become slightly more confusing is when you want to go beyond small hacks. In this case, celtic has somewhat complex data structures and functions, and it took a long while to understand what was going on when changing gears from a simple setup/draw job to writing complex classes for nodes, edges, graphs and splines and implementing a complex display loop. Here are a few traps I fell in:

- Processing redefines float and int. That simply kills any use of java.lang.Math: functions and even constants. Processing redefines the simplest ones but if you need a more complex one (like log) you’ll have to rewrite it.

- You can’t write one class per file, in good Java fashion. In fact you can, but none of the files (except the main) will be able to access the API, including float and int. So it’s useless.

- It’s a bit tricky how setup() and draw() work, sometimes. For instance, if you happen not to start setup() with size() then it’s called twice.

- You can’t call a function init(). You get an obscure error message if you do, and that’s the kind of thing that takes hours to debug and makes you yell WTF?! when you find out.

- Talk about obscure error messages, if you put all your classes in the main file but forget setup() and draw(), or leave them for later, then you’re told that you can’t do forward references in class definitions. Another few hours of finding out what’s going on followed by another WTF moment

Maybe I shouldn’t have started with a complexish hack, and it would have taken me less time to figure out the above reading more documentation, in particular a clear explanation of how the Processing code is transformed into Java. Most of the problems above would have been cleared up.

Anyway, now that I’ve found the main pitfalls, I’m really enjoying Processing. Java feels a little clunky, compared to more modern programming languages like Python or Ruby (who’s able to write System.out.println(“p=”+x+”, “+y+”.\n”) without messing up at least once?), but removing all those mallocs and free from old C code is still very enjoyable! So I’ll probably be writing or rewriting hacks with it (at least those where SVG fails), until canvas makes Processing redundant and all is to be rewritten again.

And I’ll definitely be playing with Mobile Processing.

[tags]Processing[/tags]

I’m quite impressed to notice that my NSLU2 low-power-always-on box running unslung has been up for 1 year and 2 days today. I don’t usually care for uptime nor do I hesitate when faced with a possible reboot, which makes this anniversary quite an achievement: Bravo linux, unslung, Linksys and the Dutch electricity grid!

Update: I found this entry empty the other day, and when I tried to edit it it was full of spam markup Hoping dreamhost have fixed security hole

[tags]linux, unslung, nslu2, uptime[/tags]

Found today at the local supermarket: camembert in a tin. French camembert, from Président, a leading brand. In a tin.

And it’s called “Bonjour de France”. If the subtext isn’t obvious to you, it’s because you’re not French. It’s: “Hello from France, weirdos. Here’s a camembert tin your country made us manufacture for you. Freaks.”

[tags]cheese, camembert, tin[/tags]