Expose pixelRatio in size event

mcaine · Feb 26, 2015 · 165c890 · 165c890
1 parent 05237ef
commit 165c890
Show file tree

Hide file tree

Showing 7 changed files with 38 additions and 12 deletions.
diff --git a/build/threestrap-core.js b/build/threestrap-core.js
@@ -484,7 +484,7 @@ THREE.Bootstrap.registerPlugin('renderer', {
       stencil: true,
       preserveDrawingBuffer: true,
       antialias: true,
-      devicePixelRatio: true,
+      pixelRatio: true,
     },
   },
 
@@ -513,7 +513,7 @@ THREE.Bootstrap.registerPlugin('renderer', {
 
     // Apply pixel ratio
     if (renderer.setPixelRatio) {
-      var ratio = this.options.devicePixelRatio ? window.devicePixelRatio : 1;
+      var ratio = this.options.pixelRatio ? event.pixelRatio : 1;
       renderer.setPixelRatio(ratio);
     }
 
@@ -619,7 +619,7 @@ THREE.Bootstrap.registerPlugin('size', {
     var element = three.element;
     var renderer = three.renderer;
 
-    var w, h, ew, eh, rw, rh, aspect, cut, style,
+    var w, h, ew, eh, rw, rh, aspect, cut, style, ratio,
         ml = 0 , mt = 0;
 
     // Measure element
@@ -665,13 +665,20 @@ THREE.Bootstrap.registerPlugin('size', {
     style.marginLeft = ml + "px";
     style.marginTop = mt + "px";
 
+    // Measure device pixel ratio
+    ratio = 1
+    if (typeof window != 'undefined') {
+      ratio = window.devicePixelRatio || 1
+    }
+
     // Notify
     _.extend(three.Size, {
       renderWidth: rw,
       renderHeight: rh,
       viewWidth: w,
       viewHeight: h,
       aspect: aspect,
+      pixelRatio: ratio,
     });
 
     three.trigger({
@@ -681,6 +688,7 @@ THREE.Bootstrap.registerPlugin('size', {
       viewWidth: w,
       viewHeight: h,
       aspect: aspect,
+      pixelRatio: ratio,
     });
   },
 

diff --git a/build/threestrap-core.min.js b/build/threestrap-core.min.js
diff --git a/build/threestrap.js b/build/threestrap.js
@@ -7270,7 +7270,7 @@ THREE.Bootstrap.registerPlugin('renderer', {
       stencil: true,
       preserveDrawingBuffer: true,
       antialias: true,
-      devicePixelRatio: true,
+      pixelRatio: true,
     },
   },
 
@@ -7299,7 +7299,7 @@ THREE.Bootstrap.registerPlugin('renderer', {
 
     // Apply pixel ratio
     if (renderer.setPixelRatio) {
-      var ratio = this.options.devicePixelRatio ? window.devicePixelRatio : 1;
+      var ratio = this.options.pixelRatio ? event.pixelRatio : 1;
       renderer.setPixelRatio(ratio);
     }
 
@@ -7405,7 +7405,7 @@ THREE.Bootstrap.registerPlugin('size', {
     var element = three.element;
     var renderer = three.renderer;
 
-    var w, h, ew, eh, rw, rh, aspect, cut, style,
+    var w, h, ew, eh, rw, rh, aspect, cut, style, ratio,
         ml = 0 , mt = 0;
 
     // Measure element
@@ -7451,13 +7451,20 @@ THREE.Bootstrap.registerPlugin('size', {
     style.marginLeft = ml + "px";
     style.marginTop = mt + "px";
 
+    // Measure device pixel ratio
+    ratio = 1
+    if (typeof window != 'undefined') {
+      ratio = window.devicePixelRatio || 1
+    }
+
     // Notify
     _.extend(three.Size, {
       renderWidth: rw,
       renderHeight: rh,
       viewWidth: w,
       viewHeight: h,
       aspect: aspect,
+      pixelRatio: ratio,
     });
 
     three.trigger({
@@ -7467,6 +7474,7 @@ THREE.Bootstrap.registerPlugin('size', {
       viewWidth: w,
       viewHeight: h,
       aspect: aspect,
+      pixelRatio: ratio,
     });
   },
 

diff --git a/build/threestrap.min.js b/build/threestrap.min.js
diff --git a/src/core/renderer.js b/src/core/renderer.js
@@ -7,7 +7,7 @@ THREE.Bootstrap.registerPlugin('renderer', {
       stencil: true,
       preserveDrawingBuffer: true,
       antialias: true,
-      devicePixelRatio: true,
+      pixelRatio: true,
     },
   },
 
@@ -36,7 +36,7 @@ THREE.Bootstrap.registerPlugin('renderer', {
 
     // Apply pixel ratio
     if (renderer.setPixelRatio) {
-      var ratio = this.options.devicePixelRatio ? window.devicePixelRatio : 1;
+      var ratio = this.options.pixelRatio ? event.pixelRatio : 1;
       renderer.setPixelRatio(ratio);
     }
 

diff --git a/src/core/size.js b/src/core/size.js
@@ -48,7 +48,7 @@ THREE.Bootstrap.registerPlugin('size', {
     var element = three.element;
     var renderer = three.renderer;
 
-    var w, h, ew, eh, rw, rh, aspect, cut, style,
+    var w, h, ew, eh, rw, rh, aspect, cut, style, ratio,
         ml = 0 , mt = 0;
 
     // Measure element
@@ -94,13 +94,20 @@ THREE.Bootstrap.registerPlugin('size', {
     style.marginLeft = ml + "px";
     style.marginTop = mt + "px";
 
+    // Measure device pixel ratio
+    ratio = 1
+    if (typeof window != 'undefined') {
+      ratio = window.devicePixelRatio || 1
+    }
+
     // Notify
     _.extend(three.Size, {
       renderWidth: rw,
       renderHeight: rh,
       viewWidth: w,
       viewHeight: h,
       aspect: aspect,
+      pixelRatio: ratio,
     });
 
     three.trigger({
@@ -110,6 +117,7 @@ THREE.Bootstrap.registerPlugin('size', {
       viewWidth: w,
       viewHeight: h,
       aspect: aspect,
+      pixelRatio: ratio,
     });
   },
 

diff --git a/test/core/size.spec.js b/test/core/size.spec.js
@@ -40,6 +40,8 @@ describe("size", function () {
 
     var h;
     three.on('resize', h = function (event) {
+      expect(event.pixelRatio).toBeGreaterThan(0);
+
       expect(event.viewWidth).toBe(options.size.width);
       expect(event.viewHeight).toBe(options.size.height);