From 80a92fc0c07662ab41ad086e6503a7445b469927 Mon Sep 17 00:00:00 2001 From: m0qui Date: Mon, 26 Mar 2018 21:41:49 +0200 Subject: [PATCH 1/3] Added feature to increase/decrease font size in Amiga/plain mode --- index.html | 1 + list.sahli | 52 +++------------------------------------------------- sahli.coffee | 15 ++++++++++++--- sahli.js | 17 ++++++++++++++--- 4 files changed, 30 insertions(+), 55 deletions(-) diff --git a/index.html b/index.html index 233d273..63b9fa1 100644 --- a/index.html +++ b/index.html @@ -49,6 +49,7 @@
  • Z Zoom full width
  • Q Best fit for images
  • ER Zoom in steps larger/smaller
    • +
  • 89 Incease/decrease font size by 2 (Amiga/plain mode)
  • C "panel" view toggle
  • UpDownPageupPagedown Move about by line/page
  • HomeEnd Move to top/bottom (no zoom reset)
    • diff --git a/list.sahli b/list.sahli index 5e6ceb5..0a19dfc 100644 --- a/list.sahli +++ b/list.sahli @@ -67,97 +67,51 @@ { "file": "spaceflight.asc", - "name": "Spaceflight", - "amiga": true, - "filetype": "plain", - "width": "80", - "author": "Urs", - "font": "pot-noodle", - "color": [ - 255, - 128, - 0, - 255 - ], - "bg": [ - 0, - 0, - 0, - 255 - ], - "line1": "Orange on Dark Grey", - "line2": "Test for plain files", - "text": "" - }, - { - "file": "az0!-revi510n.txt", - "name": "Revision", - "amiga": true, - "filetype": "plain", - "width": "80", - "author": "Azzarro/Madwizards", - - "font": "Propaz", - - "color": [ - + "font": "mosoul", + "color": [ 0, - 240, - 0, - 255 - ], - "bg": [ - 255, - 0, - 0, - 255 - ], - "line1": "Azzaro Returns", - "line2": "Revision ansi/ascii compo 2013", - - "text": "Color test as well as Microknight test." - + "text": "Color test as well as mOsOul test." }, { "file": "dS!-JUFV.txt", diff --git a/sahli.coffee b/sahli.coffee index 0aa9357..043bc09 100644 --- a/sahli.coffee +++ b/sahli.coffee @@ -52,6 +52,7 @@ class @Sahli buf = $('') buf.css {'margin':'0 auto'} ptxt = $('
    ')
+    ptxt.addClass 'plaintext'
     color = @calccolor(picdata.color)
     bgcolor = @calccolor(picdata.bg)
     pdiv.addClass 'scrolly'
@@ -61,9 +62,9 @@ class @Sahli
       'background-color': bgcolor
       'margin': 'auto'
       'display': 'inline-block'
-    ptxt.width picdata.width * 8
-    @origwidth = ptxt.width
-    pdiv.width ptxt.width
+    #ptxt.width picdata.width * 8
+    #@origwidth = ptxt.width
+    #pdiv.width ptxt.width
     pdiv.prepend buf.clone()
     pdiv.append ptxt
     pdiv.append buf
@@ -81,6 +82,10 @@ class @Sahli
     req.open 'GET', fname, true
     req.send null
 
+  @increaseFont = (node, increaseBy=5) ->
+    current_size = parseInt($(node).css("font-size"));
+    $(node).css("font-size", current_size + increaseBy);
+
   @loadpicture = (picdata, inserthere) ->
     fname = @location + '/' + picdata.file
     pdiv = $('
    ')
@@ -407,6 +412,10 @@ class @Sahli
           @scroll_speed = 4
         when @keycode '5'
           @changespeed 5
+        when @keycode '8'
+          @increaseFont($('pre'), -2)
+        when @keycode '9'
+          @increaseFont($('pre'), 2)
         when 40 # down
           @moveline 1
         when 38 # up
diff --git a/sahli.js b/sahli.js
index 30a3e25..45def1d 100644
--- a/sahli.js
+++ b/sahli.js
@@ -59,6 +59,7 @@ l__________/__________|___|______l__________j_____j
         'margin': '0 auto'
       });
       ptxt = $('
    ');
+      ptxt.addClass('plaintext');
       color = this.calccolor(picdata.color);
       bgcolor = this.calccolor(picdata.bg);
       pdiv.addClass('scrolly');
@@ -69,9 +70,6 @@ l__________/__________|___|______l__________j_____j
         'margin': 'auto',
         'display': 'inline-block'
       });
-      ptxt.width(picdata.width * 8);
-      this.origwidth = ptxt.width;
-      pdiv.width(ptxt.width);
       pdiv.prepend(buf.clone());
       pdiv.append(ptxt);
       pdiv.append(buf);
@@ -91,6 +89,15 @@ l__________/__________|___|______l__________j_____j
       return req.send(null);
     };
 
+    Sahli.increaseFont = function(node, increaseBy) {
+      var current_size;
+      if (increaseBy == null) {
+        increaseBy = 5;
+      }
+      current_size = parseInt($(node).css("font-size"));
+      return $(node).css("font-size", current_size + increaseBy);
+    };
+
     Sahli.loadpicture = function(picdata, inserthere) {
       var fname, pdiv, pimg;
       fname = this.location + '/' + picdata.file;
@@ -476,6 +483,10 @@ l__________/__________|___|______l__________j_____j
               return _this.scroll_speed = 4;
             case _this.keycode('5'):
               return _this.changespeed(5);
+            case _this.keycode('8'):
+              return _this.increaseFont($('pre'), -2);
+            case _this.keycode('9'):
+              return _this.increaseFont($('pre'), 2);
             case 40:
               return _this.moveline(1);
             case 38:

From 8fd83c30405ffc09fe25b80a93d290ed78749e6b Mon Sep 17 00:00:00 2001
From: m0qui 
Date: Mon, 26 Mar 2018 22:09:44 +0200
Subject: [PATCH 2/3] Canvas mode for Amiga/plain mode

---
 sahli.coffee | 2 ++
 sahli.js     | 2 ++
 2 files changed, 4 insertions(+)

diff --git a/sahli.coffee b/sahli.coffee
index 043bc09..2bc1dba 100644
--- a/sahli.coffee
+++ b/sahli.coffee
@@ -416,6 +416,8 @@ 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
diff --git a/sahli.js b/sahli.js
index 45def1d..f391a42 100644
--- a/sahli.js
+++ b/sahli.js
@@ -487,6 +487,8 @@ 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:

From 4c50e001ef4196d36ef2dc0cb1b745ac79f83a5e Mon Sep 17 00:00:00 2001
From: m0qui 
Date: Tue, 27 Mar 2018 00:17:18 +0200
Subject: [PATCH 3/3] Clean up: z works on images, ascii & ansi; e/r works on
 ascii & ansi; t work on images, ascii & ansi

---
 index.html   |  2 --
 sahli.coffee | 39 +++++++++++++++++++++++++++++++--------
 sahli.css    |  4 ++--
 sahli.js     | 48 ++++++++++++++++++++++++++++++++++++++++--------
 4 files changed, 73 insertions(+), 20 deletions(-)

diff --git a/index.html b/index.html
index 63b9fa1..e070433 100644
--- a/index.html
+++ b/index.html
@@ -47,9 +47,7 @@
         
  • B Jump to Bottom
    • 
         
  • 12345 Alter scrollspeed (fast -> slow)
    • 
         
  • Z Zoom full width
    • 
-        
  • Q Best fit for images
    • 
         
  • ER Zoom in steps larger/smaller
    • 
-        
  • 89 Incease/decrease font size by 2 (Amiga/plain mode)
    • 
         
  • C "panel" view toggle
    • 
         
  • UpDownPageupPagedown Move about by line/page
    • 
         
  • HomeEnd Move to top/bottom (no zoom reset)
    • 
diff --git a/sahli.coffee b/sahli.coffee
index 2bc1dba..34af56e 100644
--- a/sahli.coffee
+++ b/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
-        when @keycode 'q'
-          @bestfit()
+          @zoomout()
         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
diff --git a/sahli.css b/sahli.css
index 65a6496..a47845b 100644
--- a/sahli.css
+++ b/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 {
diff --git a/sahli.js b/sahli.js
index f391a42..8168d21 100644
--- a/sahli.js
+++ b/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);
-            case _this.keycode('q'):
-              return _this.bestfit();
+              return _this.zoomout();
             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: