s3mp blog

Progress update

2009-07-12T19:19:00.000-07:00

When I started writing s3mp, I wrote it because I wanted to be able to access my music whenever I was in front of a computer and a browser. Once it reached the point where it basically did that with all the features I want (searching by tag is more important to me than playlists), development slowed.

But that's no excuse. Here's the current todo list:

Fix the bug where an mp3 starts downloading, but not playing. Why this happens is a bit of a mystery. The library that comes with Flex has is supposed to send notifications when a sound's downloading or it's ready for playing. S3mp gets the download progress notification, but never one indicating it's ready to play.
Add seek functionality. The Flex library doesn't support getting the total length on an mp3. In order to get it, I need to manually read the first few KB of the file and figure out its size and bitrate, and then calculate...unless it's variable bitrate. In that case, I need to search for either a LAME or XING header that holds the length of the song.
UI cleanup and features.

SSL Man in the Middle Attack: What's it look like?

2008-10-24T23:16:00.000-07:00

Security experts tell us tell us that sending credit card numbers across the internet is safe; it's more likely that an employee on the other end could take it or your wallet is stolen than the NSA breaking the encryption that protects your personal information.

So your information is safe from eavesdropping, but what about a man in the middle attack, an attack where someone pretends to be, say, Amazon.com?

Your browser lets you know. Instead of seeing a page you're accustomed to, you'll see a big warning about an SSL certificate being bad.

Developing s3mp, I use a tool called Paros that lets me look at encrypted web traffic by doing just that attack. Whenever I debug, I get a warning, making sure I know that someone between me and Amazon is looking at what I'm doing.

Here's what Firefox 3, Chrome, and Internet Explorer 7 display so that if you encounter the message you know what's going on.

Firefox stops you in your tacks with a popup (UI designers call this a "modal window"). On one hand, it gets your attention, but on the other, it stops you from even closing another webpage as your boss is about to look over. The icon isn't particularly informative and the text is loaded with technobabble.

Chrome lets you know the connection isn't secure with huge type and a red border (though for people with color blindness (protanopia or deuteranopia), the red border is more of a brown). To the designers' credit, it says "an attacker may be trying to intercept your communications" and "you should not proceed."

Internet Explorer shows a page that looks much like the normal error page, but with a red security shield. Like Chrome, it has a human-readable description of what happened, stating that this "might be an attempt to fool you or intercept any data you send to the server." It recommends not proceeding, and unlike Chrome, I always find myself hitting the button that doesn't load the page.

Overall, I like Chrome's warning the most, IE's second, and hate Firefox's. Firefox just doesn't explain what happened very well, the modal dialog is obnoxious, there isn't a "run away" button, and ignoring it is a pain. IE came in a close second, but I really like Chrome's red border.

Support for large buckets (1000+ files) added

2008-10-24T09:07:00.000-07:00

s3mp now supports buckets with a large number of files, although support is still in beta. It required a re-write of "List" code, so the tag cache has also been rolled back to beta. The color scheme changed, but this was just an experiment, so it's not permanent (but don't expect it to be changed before parts of the UI are redesigned).

After a little more testing and configuring error handling, the next thing on the todo list is getting seek to work.

Tag caching and progress slider

2008-09-28T00:59:00.000-07:00

First, what's the tag cache? s3mp is, at least for now, almost entirely client-side, so to get the meta data (artist, song title) of an mp3, it downloads a small initial chunk and a smaller final chunk from the file, looks for tags, and if it finds them, stores them. The process of looking takes a while, but if all the tags are already stored in a handful of files, the process is a lot faster.

I changed how tag caching is handled. Instead of letting the user choose a bucket to store tags in, s3mp now (once this beta is released) automatically stores a tag cache (with intentionally obvious names like .s3mp_tag_cache.0.xml.z) for the all mp3s in a given bucket in that same bucket. I had an ugly dilemma to sort through on this one. A tag cache for each bucket is easy for both me and the user, and loading a single bucket, or making it public to share, works as expected. The problem is in how it's handled when the user doesn't have permission to write in that bucket. All of the solutions put a strange burden on the user to pick, with foresight, where to put the tags.

For now, if you want to use the tag cache, make sure you have write access on the bucket.

The Progress Slider is making a lot of, um, progress. The UI basically works, it just needs keyboard support, and the progress portion already indicates progress downloading a song.

Google Chrome, s3mp, and security

2008-09-10T22:43:00.000-07:00

Seeing that Chrome was just released, I decided to make sure it works with s3mp, and I'm pleased to say that it does (see screenshot). That said, when playing with s3mp in Incognito mode, I found a disturbing security hole that allows "cookies" to not only be retained between Incognito sessions, but leak from a regular session to Incognito.

I said cookies, but I meant Flash SharedObjects. They're basically a way for Flash applets to store information locally (s3mp uses them to store "Local Settings"). Unlike cookies, Chrome doesn't flush these from Incognito mode or sandbox them.

Aside: Adobe has a knowledge base entry on how to manage and disable shared objects.

I made a proof-of-concept that logs what web pages the user visits using a Flash SharedObject to escape the Incognito sandbox.

Chrom'd

Using it's easy; go to the main page, then some random combination of Chrom'd pages (page 1, page 2, etc.), then back to the main page, and the main page will display the history. The "Clear" button removes the cookie from your computer.

To break out of Incognito mode, go to the Chrom'd main page in an Incognito session. Browse a few pages, then close the session (or all of Chrome). Browse to the Chrom'd main page, again, and the Incognito browsing (only Chrom'd pages) history will be shown. Even better: since SharedObjects are shared across browsers, fire up up IE or explore your way to Firefox and load the page.

Putting on my black hat, what could be done with this hole? Nothing that isn't already a problem on other browsers. One of the more clever applications would be to couple SharedObjects with cookies as a means of detecting whether a user is frequently browses a web page Incognito, then display security related ads to paranoid users.

Chrome might offer some security features, but history, cache, and cookies are only part of security. As plugins become required for the web experience, without plugin-aware security, Chrome will be one step behind web developers, and further behind black hats.

Now... Where did they hide the "disable flash" button?

Small website changes

2008-08-17T00:39:00.000-07:00

I made a few changes to the UI, today. They were mainly aimed at cleaning up the About page, but through the magic of CSS, the app page changed, too. I narrowed the whole layout and put the page content in a white box. Hopefully it makes the About page barable on a widescreen monitor.

More interestingly, I designed the song scroller. Flex doesn't have a scroller+progressbar built-in, so I worked on one that matches the feel of Flex's default toolkit.I think I'm so pleased with how it turned out that I'm going to have to redesign the volume control, too. It's amazing how many places I drew inspiration (stole) from for the UI. The larger play button was from Windows Media Player, and the scoll bar is a combination of the Flex toolkit style (border, suble gradient, button), Gawker's videoModule and Vimeo's loading style, and YouTube's bubble button.

I'm back

2008-08-10T22:16:00.000-07:00

Sorry for not posting or developing for a while, but I found myself busy with other things (mostly related to wireless networks). I gave the blog a logo, and I have a few ideas for website reshuffling, but for now, I'm going to focus all new development on a few features that I think are sorely needed:

Support for buckets with lots (1000+) files
Display information about the song in the "ticker"
Allow seeking though songs
Playlists
Directory support (only a problem in File Mode)

And one of these days, ad a few advertisements.

I don't have a schedule, but it would be nice if each of those only took a week, but I know I should multiply that number by two if I want to finish on time.

Sprint Music Store: "Error M506: Unable to Play Song."

2008-07-20T14:59:00.000-07:00

A little white ago, I got a Samsung SPH-M620 Upstage phone that has a build in mp3 player. It included a 32 or 64 mb micro SD card, so initially, I just had a few mp3s on it. I finally spent $20 for a 2gb card, but when I copied a lot of songs to it, on some, the phone would pause for a second, then say:

Error M506: Unable to Play Song.
file:///memorycard/...mp3
cannot be played.

But the file was fine; Winamp and Windows Media Player played it just fine. I did some googling, but just found the problem--no solution. After a LOT of poking around and reverse engineering, I found out why: id3v4 tags only sorta work.

How to fix it:

There are a few other things that cause this (you'd think error codes would be unique, but no such luck). Older versions of the "Sprint Music Store" mp3 player have problems with long filenames (32 characters seems to be the approximate limit) and files in the upper 1gb on a 2gb memory card. The fixes here are short filenames and not storing too many files.

Onto my problem:

Windows users: use mp3tag (it's free). Drag all your songs into it, then hit the save button (or File, Save Tag). Even though you didn't change anything, it will rewrite your tags as id3v2.3 tags by default.

*nix users: use eyeD3 (available as audio/py-eyed3 in FreeBSD) to convert tags to id3v2.3. Run this command in a directory to convert all your mp3s:

find . -iname "*.mp3" -exec eyeD3 --to-v2.3 {} \;

Basically, use id3v1, id3v2.2, or id3v2.3 tags. If v2.4 tags are important to you, strip off the TXXX frames.

Technical details behind Sprint's bugs (headaches begin here):

When text encodings (these are used to store non-Latin characters as song names) in an ID3v2 (most modern programs store the artist, title, track number, etc. in an "ID3 tag.") are mixed, the parser chokes for no good reason.

Files with only unicode (UTF-16 w/BOM) tags work fine
Files with only ASCII (ISO-8859-1) tags work fine
Files with A,U work fine
Files with U,A work fine
Files with A,U,A work fine
Files with A,U,A,U work fine
Files with U,A,U don't work with id3v2.4 (but work fine with id3v2.3)

For those who like too much information, here's a hex dump of a tag that will cause Error M506, but works fine if the fourth byte (04, indicating ID3 version 2.4) is changed to 03:

00000000 49 44 33 04 00 00 00 00 10 00 54 49 54 32 00 00 ID3.......TIT2..
00000010 00 1D 00 00 01 FF FE 4B 00 69 00 63 00 6B 00 20 .......K.i.c.k.
00000020 00 53 00 6F 00 6D 00 65 00 20 00 41 00 73 00 73 .S.o.m.e. .A.s.s
00000030 00 54 50 45 31 00 00 00 13 00 00 01 FF FE 53 00 .TPE1.........S.
00000040 74 00 72 00 6F 00 6B 00 65 00 20 00 39 00 54 52 t.r.o.k.e. .9.TR
00000050 43 4B 00 00 00 05 00 00 00 31 2F 31 32 54 49 54 CK.......1/12TIT
00000060 33 00 00 00 13 00 00 01 FF FE 53 00 74 00 72 00 3.........S.t.r.
00000070 6F 00 6B 00 65 00 20 00 39 00 00 00 00 00 00 00 o.k.e. .9.......

Yeah, it's a headache. Nothing in the id3v2 specs makes frames with differing encodings illegal.

But that wasn't everything. There were a bunch of TXXX (user-defined) frames added, and when I tried to add one back into the shortened tag, I got the error, again. When I switched the version to id3v2.3, it worked fine.

Why were reports so random?

What made this a little hard to debug was that people, myself included, found it happening randomly. Nothing indicted a single cause. The only solution that was posted was to use iTunes (which readers of my blog already know uses obsolete, but seemingly compatible tags). Playing around with Winamp, I noticed that tags get rewritten when changes are made, even if the change wasn't to other fields, and Winamp uses id3v2.3 (but can read 2.4). If the tag was edited in Winamp, it will work with Sprint's mp3 player.

Website launch

2008-01-28T11:53:00.000-08:00

It's up! It's far from perfect, but I thought it was time to get the beta out there; it's been working well, so there was no reason not to release.

That said, expect bugs and test code everywhere, and the website didn't escape from bugs, either. IE6 doesn't display it right, but Firefox, Opera, and IE7 do, so it's probably not my fault (just my problem).

Hopefully I get some actual features added, soon. The deadlines are "whenever," but the priorities are the status display, playlist, and hacked up position seek (hacked up for VBR, pretty close for ABR/CBR). Next week would be nice, but a month is more realistic. There are still a few pesky bugfixes I need to work on. And the plan is to add advertising, so that's somewhere on the list.

Visualization algorithm

2008-01-16T23:40:00.000-08:00

If you've ever been to MySpace and played a song, you probably saw this:
I wouldn't say it competes with s3mp, but it is a related product. One thing I wanted to improve was the graphic equalizer. Not only does it not look good, it's just an animation--it doesn't match up with the music.

Flash actually can do better. For embedded sound, it can give you equalizer data points--enough to make a real version of what you see above. For streaming sounds, however, all it offers are left and right levels.

I implemented a visualization that has a certain resemblance to the s3mp logo. None of it was particularly hard, and I added a falloff so it looks smoother. The problem came with music like, oh, Me First and the Gimme Gimmes, where level is pegged at the top. I tried several things in different combinations, including tacking mean and standard deviation. So far, the most acceptable results display good levels, but just don't match the music right, since it's based on rolling statistics.

For now, I'm using a cubic function to remap the levels--grading on a curve, if you will. I'm not quite satisfied with the results, so I plan on trying a quintic function. With both, the goal is to make the quiet sounds louder and the loud sounds quieter, while keeping levels in order.

Technical details aside, there's an important lesson here: for those coders out there who think you won't need math, you're wrong. I used calculus and statistics for this, and couldn't have done anything without them. Sometimes, the easy way is good enough, but other times, you really need to know what you're doing.

Update

2008-01-14T23:20:00.000-08:00

I've been busy moving, so sorry, not much progress, but I have two pieces of cool news:

s3mp finally has a logo (pictured on right, obviously). It isn't quite as serious a web 1.0 logos, but it lacks the immaturity that characterizes web 2.0.

And the more important news when it comes to a release: I have a last.fm developer key, so the feature can go public without a TOS violation.

Preferences and login modes done

2007-12-11T00:24:00.000-08:00

Well, as always, almost done. A few things don't update when they should, but it's generally working.

Looking at the early inline todo list,

/*
Todo:
* Work with public directories
* Get the rest of the list stuff
* Cookies
* UI
*/

Cookies are implemented, the UI was modified, public, private, and shared directories work.

It's coming together, but there are still a few things missing.

S3mp.org AS3 PBKDF2 library

2007-11-28T00:36:00.000-08:00

Now available at its Google Code project page.

Global settings and PBKDF2 basically done

2007-11-28T00:30:00.000-08:00

Global settings and the PBKDF2 are basically done. Global settings needs to jump to the right mode (tag or file).

As for PBKDF2, I just wrote the function; I haven't used it, yet.

Since this part of the project might benefit other Amazon S3 applications, I'm releasing the PBKDF2 source code under a BSD license to help other developers, S3 or otherwise, and to show how your account information is protected. Wikipedia gives a good overview of PBKDF2, for those who are interested.

Tag cache making progress

2007-11-23T18:54:00.000-08:00

The tag cache is very usable when reading existing caches, but there might be a bug in the cache writing function (or the calls leading up to it). The write code seems to be working, but it isn't plugged into the UI, yet.

Last.fm bug fixed

2007-11-14T21:17:00.000-08:00

The difficult-to-track-down Last.fm bug should be fixed. After hours of looking at debugging output, proxy logs, and packet dumps, it seems the Flash sandbox thought there was a security violation. What made it especially hard was that logging in always worked, so I assumed the bug wasn't with security. Basically http://any.domain.com is allowed, but http://1.2.3.4 isn't. Audioscrobbler provided me with a URL with an IP address.

Luckily, the URL doesn't seem to change. Reverse DNS gave a reasonable domain name, but it didn't actually resolve. I set a domain under a domain I control to resolve to that IP address. It makes sense that it's fixed, but that shouldn't be a fix.

iTunes

2007-11-14T21:16:00.001-08:00

I ran across the first ID3v2.2 tag I've seen, yesterday. This version was created in '98, and is considered obsolete. The more recent ID3v2.3 (also '98) is the most common version.

For some unknown reason, iTunes, according to Wikipedia (and other sources) "writes tags in Unicode ID3v2.2 by default." iTunes was released in 2001.

I can't think of a good reason for Apple to use it in the first place, and I can't think of a good reason for them to keep using it.

Incompetence.