- fix fullscreen when renkan is a div
authorrougeronj
Thu, 01 Oct 2015 14:53:03 +0200
changeset 557 18c36f038e9f
parent 556 2737bc21e6dd
child 558 1a47a5f00d83
- fix fullscreen when renkan is a div - update onresize to better adapt the Renkan when resizing the windows
client/js/renderer/scene.js
client/js/renderer/viewrepr.js
--- a/client/js/renderer/scene.js	Wed Sep 30 16:33:38 2015 +0200
+++ b/client/js/renderer/scene.js	Thu Oct 01 14:53:03 2015 +0200
@@ -290,7 +290,7 @@
             } else {
                 _ratio = ratioW;
             }
-            _this.view.resizeZoom(ratioW, ratioH, _ratio);
+            _this.view.resizeZoom(_event.delta.width, _event.delta.height, _ratio);
 
             _this.redraw();
 
@@ -1111,8 +1111,10 @@
             }
         },
         fullScreen: function() {
+            var _el = this.renkan.$[0];
+            
             if (Screenfull.isFullscreen) {
-                Screenfull.exit();
+                Screenfull.exit(_el);
             
                 var widthAft = this.$.width();
                 var heightAft = this.$.height();
@@ -1127,7 +1129,7 @@
                 paper.view.viewSize = new paper.Size([widthAft, heightAft]);
 
             } else {
-                Screenfull.request();
+                Screenfull.request(_el);
                 
                 this.redraw();
             }
@@ -1256,11 +1258,13 @@
         },
         foldBins: function() {
             var foldBinsButton = this.$.find(".Rk-Fold-Bins"),
-                bins = this.renkan.$.find(".Rk-Bins");
+                bins = this.renkan.$.find(".Rk-Bins"),
+                _delta = 0;
             var _this = this,
                 sizeBef = _this.canvas_$.width(),
                 sizeAft;
             if (bins.position().left < 0) {
+                _delta= new paper.Point([-bins.width()/2, 0]);
                 bins.animate({left: 0},250);
                 this.$.animate({left: 300},250,function() {
                     var w = _this.$.width();
@@ -1273,6 +1277,7 @@
                 }
                 foldBinsButton.html("&laquo;");
             } else {
+                _delta= new paper.Point([bins.width()/2, 0]);
                 bins.animate({left: -300},250);
                 this.$.animate({left: 0},250,function() {
                     var w = _this.$.width();
@@ -1281,6 +1286,7 @@
                 sizeAft = sizeBef+300;
                 foldBinsButton.html("&raquo;");
             }
+            this.view.paperShift(_delta);
         },
         save: function() { },
         open: function() { }
--- a/client/js/renderer/viewrepr.js	Wed Sep 30 16:33:38 2015 +0200
+++ b/client/js/renderer/viewrepr.js	Thu Oct 01 14:53:03 2015 +0200
@@ -161,11 +161,11 @@
                                        ]).multiply( 0.5 * ( 1 - Math.SQRT2 ) ).add(this.offset.multiply( Math.SQRT2 ));
             this.setScale( _newScale, _offset );
         },
-        resizeZoom: function(_scaleWidth, _scaleHeight, _ratio) {
-            var _newScale = this.scale * _ratio,
-                _offset = new paper.Point([
-                                       (this.offset.x * _scaleWidth),
-                                       (this.offset.y * _scaleHeight)
+        resizeZoom: function(deltaW, deltaH, _ratio) {
+            var _newScale = this.scale * _ratio;
+            var _offset = new paper.Point([
+                                       (this.renderer.canvas_$.width() * 0.5 * ( 1 - _ratio) ) + (this.offset.x * _ratio + deltaW * _ratio * 0.5 ),
+                                       (this.renderer.canvas_$.height() * 0.5 * ( 1 - _ratio) ) + (this.offset.y * _ratio + deltaH * _ratio * 0.5 )
                                        ]);
             this.setScale( _newScale, _offset );
         },