Merge with de0d488a0a1bbf8407b66d34c7ee1a214926e63d
authorrougeronj
Mon, 05 Oct 2015 11:09:00 +0200
changeset 577 105ddd569ff7
parent 576 1e1791dfc9e4 (diff)
parent 574 de0d488a0a1b (current diff)
child 578 75a63b2af823
Merge with de0d488a0a1bbf8407b66d34c7ee1a214926e63d
--- a/client/js/renderer/scene.js	Fri Oct 02 13:45:40 2015 +0200
+++ b/client/js/renderer/scene.js	Mon Oct 05 11:09:00 2015 +0200
@@ -243,6 +243,39 @@
         
         if (Screenfull.enabled){
             bindClick(".Rk-FullScreen-Button", "fullScreen");
+            
+            document.addEventListener(Screenfull.raw.fullscreenchange, function () {
+                //the listener occur too randomly and sometimes before the fullscreen is fully set up
+                //so we add 500 delay
+                setTimeout(function(){
+                    var widthAft = _this.$.width();
+                    var heightAft = _this.$.height();
+                    
+                    if (_this.renkan.options.show_top_bar) {
+                        heightAft -= _this.$.find(".Rk-TopBar").height();
+                    }
+                    if (_this.renkan.options.show_bins && (this.renkan.$.find(".Rk-Bins").position().left > 0)) {
+                        widthAft -= this.renkan.$.find(".Rk-Bins").width();
+                    }
+                    
+                    paper.view.viewSize = new paper.Size([widthAft, heightAft]);
+                    _this.resize(_this.currentWidth, widthAft, _this.currentHeight, heightAft);
+                    
+                    _this.currentWidth = widthAft;
+                    _this.currentHeight = heightAft;
+                    
+                    if (!Screenfull.isFullscreen) {
+                        paper.view.onResize = function(_event) {
+                            var newWidth = _event.size._width,
+                                newHeight = _event.size._height;
+                            var prevHeight = newHeight - _event.delta.height,
+                                prevWidth = newWidth - _event.delta.width;
+                            
+                            _this.resize(prevWidth, newWidth, prevHeight, newHeight);
+                        };
+                    }
+                }, 600);
+            });
         } else {
             this.$.find(".Rk-FullScreen-Button").addClass("disabled");
             this.$.find(".Rk-FullScreen-Button .Rk-TopBar-Tooltip-Contents").html(this.renkan.translate("Fullscreen not supported by your browser"));
@@ -271,29 +304,14 @@
         });
         bindClick(".Rk-Fold-Bins", "foldBins");
 
-        paper.view.onResize = function(_event) {
-            var _ratio,
-                newWidth = _event.size._width,
+        paper.view.on("resize", function(_event) {
+            var newWidth = _event.size._width,
                 newHeight = _event.size._height;
+            var prevHeight = newHeight - _event.delta.height,
+                prevWidth = newWidth - _event.delta.width;
             
-            if (_this.minimap) {
-                _this.minimap.topleft = paper.view.bounds.bottomRight.subtract(_this.minimap.size);
-                _this.minimap.rectangle.fitBounds(_this.minimap.topleft.subtract([2,2]), _this.minimap.size.add([4,4]));
-                _this.minimap.cliprectangle.fitBounds(_this.minimap.topleft, _this.minimap.size);
-            }
-
-            var ratioH = newHeight/(newHeight-_event.delta.height),
-                ratioW = newWidth/(newWidth-_event.delta.width);
-            if (newHeight < newWidth) {
-                    _ratio = ratioH;
-            } else {
-                _ratio = ratioW;
-            }
-            _this.view.resizeZoom(_event.delta.width, _event.delta.height, _ratio);
-
-            _this.redraw();
-
-        };
+            _this.resize(prevWidth, newWidth, prevHeight, newHeight);
+        });
 
         var _thRedraw = _.throttle(function() {
             _this.redraw();
@@ -816,6 +834,26 @@
             }
             paper.view.draw();
         },
+        resize: function(prevWidth, newWidth, prevHeight, newHeight){
+            var _ratio;
+            
+            if (this.minimap) {
+                this.minimap.topleft = paper.view.bounds.bottomRight.subtract(this.minimap.size);
+                this.minimap.rectangle.fitBounds(this.minimap.topleft.subtract([2,2]), this.minimap.size.add([4,4]));
+                this.minimap.cliprectangle.fitBounds(this.minimap.topleft, this.minimap.size);
+            }
+    
+            var ratioH = newHeight/prevHeight,
+                ratioW = newWidth/prevWidth;
+            if (newHeight < newWidth) {
+                    _ratio = ratioH;
+            } else {
+                _ratio = ratioW;
+            }
+            this.view.resizeZoom(newWidth - prevWidth, newHeight - prevHeight, _ratio);
+    
+            this.redraw();
+        },
         addTempEdge: function(_from, _point) {
             var _tmpEdge = this.addRepresentation("TempEdge",null);
             _tmpEdge.end_pos = _point;
@@ -1110,28 +1148,12 @@
             }
         },
         fullScreen: function() {
-            var _el = this.renkan.$[0];
-            
-            if (Screenfull.isFullscreen) {
-                Screenfull.exit(_el);
+            this.currentWidth = this.$.width();
+            this.currentHeight = this.$.height();
             
-                var widthAft = this.$.width();
-                var heightAft = this.$.height();
-
-                if (this.renkan.options.show_top_bar) {
-                    heightAft -= this.$.find(".Rk-TopBar").height();
-                }
-                if (this.renkan.options.show_bins && (this.renkan.$.find(".Rk-Bins").position().left > 0)) {
-                    widthAft -= this.renkan.$.find(".Rk-Bins").width();
-                }
-
-                paper.view.viewSize = new paper.Size([widthAft, heightAft]);
-
-            } else {
-                Screenfull.request(_el);
-                
-                this.redraw();
-            }
+            var _el = this.renkan.$[0];
+            paper.view.off("resize");
+            Screenfull.toggle(_el);
         },
         addNodeBtn: function() {
             if (this.click_mode === Utils._CLICKMODE_ADDNODE) {