Blackest Night

Previously: I bought an HDMI OLED screen and determined that its black pixels emitted light.

This made me start wondering: Do all OLED screens emit light from “black” pixels?

So I did the simplest thing possible to test this: I made a little app that displays a black screen. It’s on Google Play and everything. It’s called “Blacker Than Black” if you just want to search for it on your phone.

So I loaded it up on my Blackberry Priv AMOLED (that’s short for “armored led”, I think), and went into the unmentionable room, and took a picture:

OK, that’s kinda… black… let me twiddle the camera settings… er… f2.8… ISO6400… two second exposure…

That’s still very black! Although now the camera can see my fingers in the very, very dim room. Very dim.

OK, let’s test another phone. That’s a Samsung Galaxy S6…  (Which is also AMMO LED.) Very black indeed.

OK, I’m convinced. That SmallHD AC7 OLED screen sucks, but other black OLED screens are blacker than very black.

For kicks, I loaded the app onto my Sony Xperia z4 tablet, which has an IPS screen. And dialed the exposure settings waaaay down.

Yeah. It’s not very black.

Galaxy S6 in front to compare.

So there you have it: The OLED blackness myth… IS CONFIRMED!

Shocking. But that just means that I have to find a different 7″ OLED screen from somebody that makes a better screen, and things will be perfect!

Unfortunately, after googling for an hour or two, that doesn’t seem to exist. There are other OLED screens, and a couple of them even have HDMI, but they’re all really, really ugly, and isn’t really something that I want in my bedroom.

Oh, well. I’ll have to wait a few more years for perfection…

More Fun With Google Geocharts

I’ve been using Google Geocharts to create nice world maps for my World of Films and Cocktail blogging project. It’s a pretty good service, but it doesn’t really have all the bells and whistles I need to customize the interactive version the way I want.

But today I’m hung over, and I got down to the nitty gritty undocumented interfaces. Behold!

But click over here to experience the much awesome.

Here’s the longer story for other people who are interested in doing something similar. Note that this is likely to stop working at any point since I’m using non-public features that just happen to work now with the version of Google Geocharts right now, on January 1st 2017.

So: I wanted to have stuff happen on a “hover” action, so that people don’t need to click to make things happen. Much more fun. But there is no “hover” callback in Google Geocharts. Instead I piggy-back on the tooltips and use them to root out the data I need to determine what country the user is hovering over.

First of all, make the tooltip be HTML instead of the default SVG text elements:

var options = { 
  ... 
  tooltip: { trigger: "focus", isHtml: true } 
};

Then hide the oh-so-ugly tooltip:

.google-visualization-tooltip { 
  visibility: hidden; 
}

Then do something like the following to have something happen when you hover over a country. Each country is a separate SVG path element, so:

$("path").each(function() { 
  $(this).hover(function() { 
   $(".google-visualization-tooltip")
     .find("span")
     .first()
     .each(function() { 
             var html = this.innerHTML; 
             if (html.length == 2) { 
               $.map(films, function(film) { 
                if (film[0] == html) 
                 displayFilm(film); 
               }); 
             } 
           });

Obviously this won’t work directly for you, but what I’m doing here is rooting out the data from the displayed tooltip (here it’s the two-character country code), and then using that to figure out what country I’m over. And from there you can just do whatever you want.

What I wanted was to display a random image from the film from the country under the cursor, so I used a weird cross-origin Google script service, which just reads the HTML from the blog post, finds all the images, and displays one of them at random.

Useful, huh? HUH??!?!

Oh, well.

Here’s the source code.

“Muting” Pictures With Pure CSS

I’ve been somewhat wary about posting some of the images from some of the more extreme Fantagraphics comics I’ve written about (I’m thinking of you, Grit Bath).  Not everybody appreciates being flashed images of bitten-off ears or penises while scrolling down a blog.

On the other hand, I want to represent these comics honestly, so I thought it might be nice to “hide” images from more sensitive readers without making a big deal about it.  That is, I wanted them still to be accessible without the reader having to go to a new page, and I wanted to make this possible without adding a lot of redundant HTML to the articles.

Presto!

shot0028 png

The solution is pure CSS: I only have to add the “redact” class to the <a> link that surrounds the image.  It took me several hours of googling around to put all the pieces together, but the end result looks quite “d’oh, that’s simple”.  All the other solutions I found involved adding <div>s around and <p>s inside, which is yucky.

I’ve put the solution on Github for people interested in adapting it to their own needs.

Google GeoChart

I wanted to have some maps in my World of Films and Cocktails series.  Like this:

I tried various mapping services, but nothing was flexible enought to do what I wanted.  I wanted more recently “visited” countries to be brighter, I wanted it to be scriptable, I wanted it to be easy to take unassisted “screenshots”, and I wanted an interactive version where you could click on the countries to get some information.

Then I found Google GeoChart. It’s really kinda geared towards displaying numerical data per country, but it’s flexible enough that you can disable almost all of the distracting, ugly elements.  And, as a bonus, it generates SVG images, so whatever you can’t disable with the features provided, you can just alter by inspecting the DOM after the image has been generated.

Kudos to Google.  It’s very neat.  I managed to make the maps look exactly like I had envisioned.

You can see the interactive version here, and the source code is on github. It’s totally trivial.  It just sets a bunch of defaults, and then (after inspecting the DOM a bit), it removes some textures.  And adds events that pop up lightboxes that point back to the films.

To create the snapshots of the charts, I use PhantomJS. It allows rendering web pages headless, and generates a PNG as the result.  It’s really neat and easy to work with.  With all this in the tool chain, I can generate the WFC entries automatically without human intervention.

Well.  Somebody has to make the cocktails.  And drink them.  And edit out the boring screenshots.

shot0023 png2

Yes!  I do that!  The nerve of some people…

Filtering Out Pingbacks From A WordPress.com-Hosted “Recent Comments” Box

If you self-host your WordPress blog, you can do whatever you want.  If your blog is hosted at WordPress.com, you’re very limited in what you can customize.

For instance, for years I have wanted to get rid of pingbacks from myself in the “Recent Comments” box on the pages.  When I link to older messages, the box ends up looking like this:

commentsI look like a monomaniacal self-commenter.  Like, eek.  So yesterday I spent most of the day googling around trying to find out how to stop this insanity.  And it turns out that this is something that users have requested from Automattic since (at least) 2009, but they just haven’t implemented it.

Even though it’s totally trivial.  On a self-hosted WordPress blog, it’s a one line change.

So my choice here is to either start self-hosting (and I don’t want to — I host enough stuff already), or to figure out a way to work around this weirdness.

WordPress.com offers a few handfuls of widgets.  One of them seemed promising — the “Text Widget”.  But although you can put HTML in there, there’s no way to update it automatically, or use an <iframe> to embed HTML dynamically.

Then I saw that there’s an RSS widget!  What if I were to download the comments feed from WordPress, filter out all pingbacks, and then create a new RSS feed based on that?

Presto!

rssNo more pingbacks!  However, the RSS feed only has the last ten comments, and virtually all of them were pingbacks (except for the two test comments I added while developing), so I’m still the only one there in that box.  But that should hopefully fix itself after a while.  🙂

(The script caches comments, so it should build up to a more meaningful feed after a while…)

The code is on Github, so feel free to use it if you’re also annoyed by the “Recent Comments” box. Two non-optimal things about using this way to list the comments: 1) No images are allowed in the RSS Widget on WordPress.com, so it looks kinda boring, and 2) WordPress.com caches the RSS for a while (an hour?), so it’s not updated immediately.

But it’s good enough for me, and I won’t have to start self-hosting (and stop paying Automattic money).

(My very first Python script!  Python seems rather inconsistent.  Hysterical raisins, I guess.)

NCSI SUV: CSID

Look, I’m a Windows developer:

DSC01961Actually, I just pushed the Concerts in Oslo Cordova app to the Windows Phone store to debug the submission process.  At work I’ve tried to push an app several times to the store, but Microsoft just says “it doesn’t work”.  When I ask “er, what doesn’t work?” their response is “it doesn’t work”.

And pushing the CSID app helped!  From the server logs, I can see that Microsoft never let the app contact the server.  So either they don’t actually test the apps before putting them on the store, or they only test them in non-networking mode.

Which would explain why the app at work gets the response “it doesn’t work”.  It’ll have to provide more in-depth error messages when there’s no network, and perhaps that’ll make Microsoft let the app through.

*crosses fingers*

SUV: CSID

Some weeks back, I decided to appify the Concerts in Oslo web page thingie.  Because UX.DSC01954

It’s a Cordova (i.e. Phonegap) app, so I thought it would be, like, no work at all.  And it wasn’t!  Until I started thinking about the added opportunities the Cordova framework gave me, like exporting events to the calendar on the phone, and “social media sharing”, etc.

So, as is my wont, I’ve spent far too much time tweaking this thing, but now it’s feature-complete!  I mean it!  It is!  No more twiddling!

But the reason for this post is to kvetch about Apple.

I mean, we all love that, don’t we?  NOTHING OF INTEREST BENEATH THIS LINE!

First of all, the submission process is klunky and fiddly.  They require you to upload the app via applications that only exist on Apple machines.  Google Play does it all via a web interface.

They require you to pay $99 per year for the privilege of having the app in the store.  Googple Play charges you $25 once, and that’s it.

The approval process is s-l-o-w.  I submitted the app on September 7th.

On the 16th, it was reviewed, and they found that the age settings were wrong, since you can click on things and end up on Youtube, so it should be 12+ only.  I checked “infrequent nudity” and resubmitted.

On the 22nd, they reviewed it again and published it.  By now, the version submitted was way outdated (see the second paragraphs), so I submitted an update, which was approved on the 28th.

On Google Play, the first approval took about four hours, and each subsequent update takes less than half an hour.

So…  three weeks vs. four hours.

Foogling a bit, this seems to be the Apple norm.  An app takes between some days and three months for approval, no matter whether the app is trivial or complex.

(This is where the Apple enthusiast says “just goes to show how much better Apple is at vetting apps”.  But they’re not really.  I can tell from the server logs when they do the testing.  The time it takes for the testing to actually start and I get the “your app is approved” mail is usually ten minutes or so.  They just wait a week or nine before they start testing.)

And I’m not even a Google fan, but Apple stuff is just so annoying.

The final thing I did today was getting images on high-resolution Apple devices to not look as somebody had smeared vaseline over the glass, then spat on it, and then drizzled soot liberally over it.  Or as they call it “scaled it with anti-aliasing”.

Here’s how an Android device  (Samsung 6 something) handles images that needs to be upscaled:

Here’s the same thing with 2x images:

Yes, everything looks a lot better with the 2x images, but the upscaled ones aren’t gruesome.  They just look like the lo-rez images they are.

Compare this to what a hi-rez Iphone does when upscaling:

image_21623927808_o

The horror!  The horror!  And with 2x images:

image_21801257692_o

*phew*

Apple obviously doesn’t do this just to be total dicks, although I supposed that’s part of the explanation.  They probably do this to force people to actually supply 2x images instead of limping along with lo-rez images.  If you’re an Apple enthusiast, you may think this is a good idea.  If you’re not, you probably aren’t delusional.