Fixed webcam zoom issues and added dbl click to open/close

LazeMSS · Dec 14, 2020 · de43db0 · de43db0
1 parent 3375d18
commit de43db0
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 4 deletions.
diff --git a/octoprint_uicustomizer/static/css/uicustomizer.css b/octoprint_uicustomizer/static/css/uicustomizer.css
@@ -546,7 +546,8 @@ body.UICTouchDevice #settings_dialog ::-webkit-scrollbar-thumb:window-inactive {
 body.UICResponsiveMode #gcode_canvas{
     position: relative;
     width: 100% !important;
-    float: right;
+    height: 100% !important;
+    float: left;
     right: -1px;
 }
 
@@ -643,6 +644,7 @@ body.UICResponsiveMode select{
 body.inlineFullscreen .UICWebCamClick{
     display: none;
 }
+
 .UICWebCamClick{
     position: absolute;
     right: 0px;

diff --git a/octoprint_uicustomizer/static/js/uicustomizer.js b/octoprint_uicustomizer/static/js/uicustomizer.js
@@ -414,6 +414,10 @@ $(function() {
                 if (!self.previewOn){
                     zoomclick.hide();
                 }
+                // Double click
+                obj.off('dblclick').on('dblclick',function(){
+                    zoomclick.trigger('click.UICWebCamClick');
+                });
                 zoomclick.off('click.UICWebCamClick').on('click.UICWebCamClick',function(){
                     $('.UIWebcamZoomSrc').hide();
                     // Remove previous if any
@@ -455,10 +459,9 @@ $(function() {
                         }
                         // Cam height than screen - then fit to screen height
                         if (nHeight > wHeight){
-                            nHeight = (wHeight - 200);
+                            nHeight = (wHeight - 50);
                             nWidth = nHeight*aspect;
                         }
-
                         // Clone to fix rotation etc.
                         var clone = $('#webcam_rotator').clone();
                         clone.find('>div:not(:first-child)').remove();
@@ -474,14 +477,18 @@ $(function() {
                             $('#UICWebCamFull div.nowebcam').remove();
                             $('#UICWebCamFull img').css({'width':''});
                             $('#UICWebCamFull img').css({'height':''});
+                            $('#UICWebCamFull').css({'max-width':$(window).width()-60});
+                            $('#UICWebCamFull').css({'max-height':$(window).height()-60});
                         });
                         $('#UICWebCamFull img').attr('src',streamURL);
                     }
 
                     // Fix on resize done
                     $('#UICWebCamFull').off('mouseup').on('mouseup',function(){
                         $('#UICWebCamFull').css('height','');
-                    })
+                    }).off('dblclick').on('dblclick',function(){
+                        $('#UICWebCamShrink').trigger('click');
+                    });
 
                     // Start draghandler
                     var dm = document.getElementById('UICWebCamFull');