Optimization with image loading

koenbok · May 5, 2013 · 8b12dcbb253738d8209e179dd45dad0f3bcf2962 · 8b12dcb
1 parent ed0c03b
commit 8b12dcbb253738d8209e179dd45dad0f3bcf2962
Unified Split

Showing with 50 additions and 34 deletions.

+17 −13 build/framer.js

+16 −8 src/views/imageview.coffee

+17 −13 template/framer.js
diff --git a/build/framer.js b/build/framer.js
@@ -1,7 +1,7 @@
-// Framer v2.0.0b1-36-g3ad0dc0 (c) 2013 Koen Bok
+// Framer v2.0.0b1-38-ged0c03b (c) 2013 Koen Bok
 // https://github.com/koenbok/Framer

-window.FramerVersion = "v2.0.0b1-36-g3ad0dc0";
+window.FramerVersion = "v2.0.0b1-38-ged0c03b";


 (function(){var require = function (file, cwd) {
@@ -4552,23 +4552,27 @@ require.define("/src/views/imageview.coffee",function(require,module,exports,__d
        return this._image;
      },
      set: function(value) {
-        var loader,
+        var loader, _ref, _ref1,
          _this = this;

        if (this._image === value) {
          return this.emit("load", loader);
        }
        this._image = value;
-        loader = new Image();
-        loader.name = this.image;
-        loader.src = this.image;
-        loader.onload = function() {
-          _this.style["background-image"] = "url('" + _this.image + "')";
-          return _this.emit("load", loader);
-        };
-        return loader.onerror = function() {
-          return _this.emit("error", loader);
-        };
+        if ((_ref = this.events) != null ? _ref.hasOwnProperty("load" || ((_ref1 = this.events) != null ? _ref1.hasOwnProperty("error") : void 0)) : void 0) {
+          loader = new Image();
+          loader.name = this.image;
+          loader.src = this.image;
+          loader.onload = function() {
+            _this.style["background-image"] = "url('" + _this.image + "')";
+            return _this.emit("load", loader);
+          };
+          return loader.onerror = function() {
+            return _this.emit("error", loader);
+          };
+        } else {
+          return this.style["background-image"] = "url('" + this.image + "')";
+        }
      }
    });

diff --git a/src/views/imageview.coffee b/src/views/imageview.coffee
@@ -25,13 +25,21 @@ class exports.ImageView extends View
 			
 			@_image = value
 			
-			loader = new Image()
-			loader.name = @image
-			loader.src = @image
+			# As an optimization, we will only use a loader
+			# if something is explicitly listening to the load event
 			
-			loader.onload = =>
-				@style["background-image"] = "url('#{@image}')"
-				@emit "load", loader
+			if @events?.hasOwnProperty "load" or @events?.hasOwnProperty "error"
 			
-			loader.onerror = =>
-				@emit "error", loader
+				loader = new Image()
+				loader.name = @image
+				loader.src = @image
+			
+				loader.onload = =>
+					@style["background-image"] = "url('#{@image}')"
+					@emit "load", loader
+			
+				loader.onerror = =>
+					@emit "error", loader
+			
+			else
+				@style["background-image"] = "url('#{@image}')"
diff --git a/template/framer.js b/template/framer.js
@@ -1,7 +1,7 @@
-// Framer v2.0.0b1-36-g3ad0dc0 (c) 2013 Koen Bok
+// Framer v2.0.0b1-38-ged0c03b (c) 2013 Koen Bok
 // https://github.com/koenbok/Framer

-window.FramerVersion = "v2.0.0b1-36-g3ad0dc0";
+window.FramerVersion = "v2.0.0b1-38-ged0c03b";


 (function(){var require = function (file, cwd) {
@@ -4552,23 +4552,27 @@ require.define("/src/views/imageview.coffee",function(require,module,exports,__d
        return this._image;
      },
      set: function(value) {
-        var loader,
+        var loader, _ref, _ref1,
          _this = this;

        if (this._image === value) {
          return this.emit("load", loader);
        }
        this._image = value;
-        loader = new Image();
-        loader.name = this.image;
-        loader.src = this.image;
-        loader.onload = function() {
-          _this.style["background-image"] = "url('" + _this.image + "')";
-          return _this.emit("load", loader);
-        };
-        return loader.onerror = function() {
-          return _this.emit("error", loader);
-        };
+        if ((_ref = this.events) != null ? _ref.hasOwnProperty("load" || ((_ref1 = this.events) != null ? _ref1.hasOwnProperty("error") : void 0)) : void 0) {
+          loader = new Image();
+          loader.name = this.image;
+          loader.src = this.image;
+          loader.onload = function() {
+            _this.style["background-image"] = "url('" + _this.image + "')";
+            return _this.emit("load", loader);
+          };
+          return loader.onerror = function() {
+            return _this.emit("error", loader);
+          };
+        } else {
+          return this.style["background-image"] = "url('" + this.image + "')";
+        }
      }
    });