Use better @2x path method from based on pull #39

src/retina.js

@@ -4,21 +4,15 @@ var root = (typeof exports == 'undefined' ? window : exports);
 
 function RetinaImagePath(path) {
   this.path = path;
-  // Split the file extension off the image path,
-  // and put it back together with @2x before the extension.
-  // "/path/to/image.png" => "/path/to/image@2x.png"
-  var path_segments           = this.path.split('.');
-  var path_without_extension  = path_segments.slice(0, (path_segments.length - 1)).join(".");
-  var extension               = path_segments[path_segments.length - 1];
-  this.at_2x_path             = path_without_extension + "@2x." + extension;
+  this.at_2x_path = path.replace(/\.\w+$/, function(match) { return "@2x" + match; });
 }
-    
+
 root.RetinaImagePath = RetinaImagePath;
-  
-// Class variable [Array] 
+
+// Class variable [Array]
 // cache of files we've checked on the server
 RetinaImagePath.confirmed_paths = [];
-  
+
 // Function to test if image is external
 RetinaImagePath.prototype.is_external = function() {
   return !!(this.path.match(/^https?\:/i) && !this.path.match('//' + document.domain) )
@@ -75,7 +69,7 @@ root.RetinaImage = RetinaImage;
 RetinaImage.prototype.swap = function(path) {
   if (typeof path == 'undefined') path = this.path.at_2x_path;
 
-  // We wrap this in a named self-executer so we can reference 
+  // We wrap this in a named self-executer so we can reference
   // it in a setTimeout if the image has not loaded yet.
   var that = this;
   function load() {
@@ -88,7 +82,7 @@ RetinaImage.prototype.swap = function(path) {
       // and still have the script detect image loads reliably and efficiently.
       setTimeout(load, 5);
     } else {
-      // Once the the image has loaded we know we 
+      // Once the the image has loaded we know we
       // can grab the proper dimensions of the original image
       // and go ahead and swap in the new image path and apply the dimensions
       that.el.setAttribute('width', that.el.offsetWidth);

test/retina_image_path.test.js

@@ -9,7 +9,14 @@ global.RetinaImagePath  = require('../').RetinaImagePath;
 
 describe('RetinaImagePath', function() {
   var path = null;
-
+
+  describe('@at_2x_path', function(){
+    it('adds "@2x" before the extension', function(){
+      path = new RetinaImagePath("/path/to/image.png");
+      path.at_2x_path.should.equal("/path/to/image@2x.png");
+    });
+  });
+
   describe('#is_external()', function() {
     it('should return true when image path references a remote domain with www', function() {
       document.domain = "www.apple.com";
@@ -40,7 +47,7 @@ describe('RetinaImagePath', function() {
       path = new RetinaImagePath("http://google.com/images/some_image.png")
       path.is_external().should.equal(true);
     });
-    
+
     it('should return true when image path has www and domain does not', function() {
       document.domain = "apple.com";
       path = new RetinaImagePath("http://www.apple.com/images/some_image.png");
@@ -64,20 +71,20 @@ describe('RetinaImagePath', function() {
       path = new RetinaImagePath("/images/some_image.png");
       path.is_external().should.equal(false);
     });
-    
+
     it('should return false when image path is relative to localhost', function() {
       document.domain = "localhost";
       path = new RetinaImagePath("/images/some_image.png");
       path.is_external().should.equal(false);
     });
-    
+
     it('should return false when image path has same domain as current site with www', function() {
       document.domain = "www.apple.com";
       path = new RetinaImagePath("http://www.apple.com/images/some_image.png");
       path.is_external().should.equal(false);
     });
   });
-    
+
   describe('#check_2x_variant()', function() {
     it('should callback with false when #is_external() is true', function(done) {
       document.domain = "www.apple.com";
@@ -96,7 +103,7 @@ describe('RetinaImagePath', function() {
         done();
       });
     });
-      
+
     it('should callback with true when remote at2x image exists', function(done) {
       XMLHttpRequest.status = 200; // simulate a proper request
       path = new RetinaImagePath("/images/some_image.png");