Clean up: z works on images, ascii & ansi; e/r works on ascii & ansi; t work on images, ascii & ansi

index.html

@@ -47,9 +47,7 @@
         <li><span class="key">B</span> Jump to Bottom</li>
         <li><span class="key">1</span><span class="key">2</span><span class="key">3</span><span class="key">4</span><span class="key">5</span> Alter scrollspeed (fast -> slow)</li>
         <li><span class="key">Z</span> Zoom full width</li>
-        <li><span class="key">Q</span> Best fit for images</li>
         <li><span class="key">E</span><span class="key">R</span> Zoom in steps larger/smaller</li>
-        <li><span class="key">8</span><span class="key">9</span> Incease/decrease font size by 2 (Amiga/plain mode)</li>
         <li><span class="key">C</span> "panel" view toggle</li>
         <li><span class="key">Up</span><span class="key">Down</span><span class="key">Pageup</span><span class="key">Pagedown</span> Move about by line/page</li>
         <li><span class="key">Home</span><span class="key">End</span> Move to top/bottom (no zoom reset)</li>

sahli.coffee

@@ -103,6 +103,33 @@ class @Sahli
     @origheight = picdata.height
     @bestfit()
 
+  @fullwidthplain = =>
+    if ($('pre').css("font-size") == "16px")
+      $('pre').css("font-size", "2.5vw");
+    else
+      $('pre').css("font-size", "16px");
+
+  @togglefullwidthmode = =>
+    if ($('pre').hasClass('plaintext'))
+      @fullwidthplain()
+    else
+      if $('div.scrolly').hasClass('image')
+        @bestfit()
+      else
+        @zoom()
+
+  @zoomin = =>
+    if ($('pre').hasClass('plaintext'))
+      @increaseFont($('pre'), 2)
+    else
+      @zoom(100);
+
+  @zoomout = =>
+    if ($('pre').hasClass('plaintext'))
+      @increaseFont($('pre'), -2)
+    else
+      @zoom(-100);
+
   @bestfit = =>
     if $('div.scrolly').hasClass('image')
       if $('div.scrolly').hasClass('bestfitMode')
@@ -374,20 +401,18 @@ class @Sahli
           @setscroll()
         when @keycode 't'
           $('body').scrollTop 0
-          @zoom 0
+          @togglefullwidthmode()
         when @keycode 'b'
           $('body').scrollTop $('body').height()
         when @keycode 'a'
           $('body').stop()
           @scroll_direction = - @scroll_direction
         when @keycode 'z'
-          @zoom()
+          @togglefullwidthmode()
         when @keycode 'e'
-          @zoom 100
+          @zoomin()
         when @keycode 'r'
-          @zoom -100
+          @zoomout()
-        when @keycode 'q'
-          @bestfit()
         when @keycode 'w'
           @changescrolldirection -1
         when @keycode 'x'
@@ -416,8 +441,6 @@ class @Sahli
           @increaseFont($('pre'), -2)
         when @keycode '9'
           @increaseFont($('pre'), 2)
-        when @keycode '0'
-          $('pre').css("font-size", "2.5vw");
         when 40 # down
           @moveline 1
         when 38 # up

sahli.css

@@ -44,7 +44,7 @@ h6 {
 .help {
     position: fixed;
     top: 1em;
-    left: 33%;
+    left: 25%;
     text-align: left;
     background-color: lightgrey;
     border: outset darkgray;
@@ -53,7 +53,7 @@ h6 {
     border-radius: 8px;
     font-family: topaz1200,mOsOul, Consolas, monospace;
     opacity: .85;
-    width: 33%;
+    width: 50%;
 }
 
 .fullwidth {

sahli.js

@@ -117,6 +117,42 @@ l__________/__________|___|______l__________j_____j
       return this.bestfit();
     };
 
+    Sahli.fullwidthplain = function() {
+      if ($('pre').css("font-size") === "16px") {
+        return $('pre').css("font-size", "2.5vw");
+      } else {
+        return $('pre').css("font-size", "16px");
+      }
+    };
+
+    Sahli.togglefullwidthmode = function() {
+      if ($('pre').hasClass('plaintext')) {
+        return Sahli.fullwidthplain();
+      } else {
+        if ($('div.scrolly').hasClass('image')) {
+          return Sahli.bestfit();
+        } else {
+          return Sahli.zoom();
+        }
+      }
+    };
+
+    Sahli.zoomin = function() {
+      if ($('pre').hasClass('plaintext')) {
+        return Sahli.increaseFont($('pre'), 2);
+      } else {
+        return Sahli.zoom(100);
+      }
+    };
+
+    Sahli.zoomout = function() {
+      if ($('pre').hasClass('plaintext')) {
+        return Sahli.increaseFont($('pre'), -2);
+      } else {
+        return Sahli.zoom(-100);
+      }
+    };
+
     Sahli.bestfit = function() {
       if ($('div.scrolly').hasClass('image')) {
         if ($('div.scrolly').hasClass('bestfitMode')) {
@@ -445,20 +481,18 @@ l__________/__________|___|______l__________j_____j
               return _this.setscroll();
             case _this.keycode('t'):
               $('body').scrollTop(0);
-              return _this.zoom(0);
+              return _this.togglefullwidthmode();
             case _this.keycode('b'):
               return $('body').scrollTop($('body').height());
             case _this.keycode('a'):
               $('body').stop();
               return _this.scroll_direction = -_this.scroll_direction;
             case _this.keycode('z'):
-              return _this.zoom();
+              return _this.togglefullwidthmode();
             case _this.keycode('e'):
-              return _this.zoom(100);
+              return _this.zoomin();
             case _this.keycode('r'):
-              return _this.zoom(-100);
+              return _this.zoomout();
-            case _this.keycode('q'):
-              return _this.bestfit();
             case _this.keycode('w'):
               return _this.changescrolldirection(-1);
             case _this.keycode('x'):
@@ -487,8 +521,6 @@ l__________/__________|___|______l__________j_____j
               return _this.increaseFont($('pre'), -2);
             case _this.keycode('9'):
               return _this.increaseFont($('pre'), 2);
-            case _this.keycode('0'):
-              return $('pre').css("font-size", "2.5vw");
             case 40:
               return _this.moveline(1);
             case 38: