Allowing src with no extension

[tehmaestro]

Hey, I have a small question. Is there anyway I can modify the library so it allows me to set the SRC without an extension, like .mp3 ?
I would like to have something like http:/www.test.com/audio/1233445 . This link will be parsed by a PHP script, which will return a Content-Type: audio/mpeg.

Anyway I can do this? Thank you so much.

PS: I get this: Uncaught TypeError: Cannot read property 'apply' of undefined
Just after I do this: window.createjs.Sound.registerSound(audio.src, audio.id, audio.data);

[OJayRobinson]

Not currently, but we've heard this is something required for Amazon hosted files and would like to add it to SoundJS. Likely we would do it by setting a property that defined the filetype. There could be some issue with browsers not supporting a given type and switching to a fallback, and then the link not returning the file with the expected extension.

It will be some time before I have time to work on this, but if you would like to attempt to add in this behavior with a pull request I'd be happy to offer any support you would need. You'd likely want to start with the internal Sound._parsePath method and work from there.

Hope that helps.

[tehmaestro]

Thanks, I'll let you know if I end up doing something. For now, I'm working around this by still adding the .mp3 extension to the request and modifying the server to accept the requests.

[OJayRobinson]

cool

You likely already know this, but if you use alternateExtensions the file may be requested with a different type.

[tehmaestro]

Hey, so I did use a workaround, I'm gonna post it here. It's not really pretty, but it works.
I added a new property called fakeExtension, which is used, of course, to fake the extension. This should be used responsibly, cause the file may not be supported by the browser. So:

    s.alternateExtensions = [];
    ....
    s.fakeExtension = false;
    ....

    s._parsePath = function (value) {
        if (typeof(value) != "string") {value = value.toString();}

        /*  If fakeExtension is set by the user, then use it to pass the matching tests */
         var match = null;
         if (s.fakeExtension) {
            var fakeValue = value + "." + s.fakeExtension;
            match = fakeValue.match(s.FILE_PATTERN);
        } else {
            match = value.match(s.FILE_PATTERN);
        }

        if (match == null) {return false;}
        var name = match[4];
        var ext = match[5];

        var c = s.getCapabilities();
        var i = 0;
        while (!c[ext]) {
            ext = s.alternateExtensions[i++];
            if (i > s.alternateExtensions.length) { return null;}   // no extensions are supported
        }
        value = value.replace("."+match[5], "."+ext);
        var ret = {name:name, src:value, extension:ext};
        return ret;
      };

Then, you can call window.createjs.Sound.fakeExtension = "mp3"; , which would allow a URL like http://www.mycdn.net/RanD0mStrings ok for use with SoundJS, as long as there is an actual sound file there, with mimeType audio/mpeg.

[OJayRobinson]

Nice work, thanks for sharing this.

It's an interesting choice to go with a global solution, rather than an additional type property on register objects. Definitely this is quicker, but it seems on the surface like a type property could offer more flexibility. For example you could mix extensionless and extentioned files. But maybe no one does that?

I'm curious about your opinion on a file specific rather than global approach?

[lannymcnie]

Also, this doesn't solve the issue where different file-types need to be served depending on the browser.

[tehmaestro]

Well if you need to serve different file-types depending on the browser, you are probably better of using an extension. You could have a URL like www.example.com/ABC123.mp3, where ABC123 is a random hash.

My personal use case involved hiding the extension from the user, making the links more confusing and also using random strings for audio files, so they cannot be programatically identified and downloaded. I'm actually serving the files from a CDN. I'm doing this although there may be issues in certain browsers with playing the audio files, but I've tested the target browsers and they all played my audio files very well (which are mp3's by the way).

If I were to take the fakeExtension property to an individual level, I would probably pass it on sound registration, as an options to be passed by the user, something like this:

    s.registerSound = function (src, id, data, basePath, fakeExtension) {
    //or maybe included in data ... I don't know

This would pass to loadItem on s._registerSound, and in turn, it would go to s._parsePath.

And the name should probably be changed from fakeExtension to something better :). Again, I think this is a feature that, if implemented, should be used with caution, cause you are forcing a certain file type to all browsers. It wasn't a problem for me, as the browsers I was targeting, meaning IE9+ and all others, seemed to play mp3s with no problems.

[OJayRobinson]

Thanks for sharing your thoughts.

One got'cha to warn you about, Firefox plays mp3 audio using available codex on the system. So if there is no mp3 codex, playback will fail.

[lannymcnie]

We are working on some improvements to SoundJS to allow more dynamic file paths to be supported. Thanks for all your suggestions and info!

[lannymcnie]

Leaving open for tracking.

[OJayRobinson]

SoundJS has added support for alternate file paths and extensionless files.
This is accomplished by passing an object for src that has various paths with property labels matching the extension. These labels are how SoundJS determines if the browser will support the sound. Priority is determined by the property order (first property is tried first).

Example

var sounds = {path:"./audioPath/",
  manifest: [
  {id: "cool", src: {mp3:"mp3/awesome.mp3", ogg:"noExtensionOggFile"}}
]};

Note an id is required for playback and this is not supported with PreloadJS yet.

Hope that helps.