Zoom in transcription window.

app/apps/core/static/js/panels/transcription.js

@@ -288,6 +288,9 @@ class TranscriptionPanel extends Panel {
             $('#trans-modal #trans-input .ql-editor').html($('.js-version-content', $tr).html());
             
         });
+
+        this.$container = $('.img-container', this.$panel);
+        WheelZoom(this.$container, false, 1, 1);
         
         editor = new Quill('#trans-input', {
             theme: 'bubble',
@@ -328,7 +331,9 @@ class TranscriptionPanel extends Panel {
             this.addLine(this.part.lines[i]);
         }
         super.load(part);
-        this.$panel.css('min-height', this.bottom*this.ratio+20);
+
+        $('.zoom-container', this.$container).css('height', this.bottom*this.ratio+20);
+        this.$container.trigger('wheelzoom.refresh');
     }
     
     reset() {
@@ -339,6 +344,7 @@ class TranscriptionPanel extends Panel {
                 this.lines[i].setPosition();
             }
         }
-        this.$panel.css('min-height', this.bottom*this.ratio+20);
+        $('.zoom-container', this.$container).css('height', this.bottom*this.ratio+20);
+        this.$container.trigger('wheelzoom.refresh');
     }
 }

app/escriptorium/static/js/wheelzoom.js

@@ -8,7 +8,7 @@ function WheelZoom(container, disabled_, initial_scale, min_scale_opt, max_scale
 	var zoom_target = {x:0, y:0};
 	var zoom_point = {x:0, y:0};
     var previousEvent;
-    var disabled = disabled_;
+    var disabled = disabled_ || target.height() === 0;
 	target.css({transformOrigin: '0 0', transition: 'transform 0.3s', cursor: 'zoom-in'});
 	container.on("mousewheel DOMMouseScroll", scrolled);
     container.on('mousedown', draggable);
@@ -112,6 +112,7 @@ function WheelZoom(container, disabled_, initial_scale, min_scale_opt, max_scale
 
     function refresh() {
         size = {w: target.width(), h: target.height()};
+        disabled = disabled_ || target.height() === 0;
         api.min_scale = min_scale_opt || Math.min(
             $(window).width() / (size.w * initial_scale) * 0.9,
             $(window).height() / (size.h * initial_scale) * 0.9);