feat: dynamic title (page title - site title - URL)

* src/js:
    * ansi_parser.js
        * import b2u for converting site title
        * add AnsiParser.STATE_OSC (4)
        * AnsiParser.feed()
            * add case handling for sequence "OSC 2 ; Pt ST/BEL"
              (Change Window Title to Pt) for site title
    * term_buf.js
        * TermBuf()
            * add attrs titleBase & titleSite & titleConn & title
              for building dynamic title
        * add and use TermBuf.setTitle() for updating window title
            * ansi_parser.js AnsiParser.feed()
            * pttchrome.js
                * App() 'focus' event
                * App.onConnect()
    * use TermBuf.title for getting the title instead
        * term_view.js TermView.titleTimer()
        * pttchrome.js App() 'focus' event

Author: IepIweidieng

src/js/ansi_parser.js

@@ -1,5 +1,7 @@
 // Parser for ANSI escape sequence
 
+import { b2u } from './string_util';
+
 export function AnsiParser(termbuf) {
   this.termbuf = termbuf;
   this.state = AnsiParser.STATE_TEXT;
@@ -10,6 +12,7 @@ AnsiParser.STATE_TEXT = 0;
 AnsiParser.STATE_ESC = 1;
 AnsiParser.STATE_CSI = 2;
 AnsiParser.STATE_C1 = 3;
+AnsiParser.STATE_OSC = 4;
 
 AnsiParser.prototype.feed = function(data) {
   var term = this.termbuf;
@@ -217,6 +220,49 @@ AnsiParser.prototype.feed = function(data) {
         this.esc += ch;
       }
       break;
+    case AnsiParser.STATE_OSC:
+      if (ch == '\\' && this.esc[this.esc.length - 1] == '\x1b') {
+        // ST = ESC \
+        this.esc.pop();
+        ch = '\x07';
+      }
+      if (ch == '\x07') {
+        var params=this.esc.split(';');
+        var firstChar = '';
+        if (params[0] && (params[0].charAt(0)<'0' || params[0].charAt(0)>'9')) {
+          if (firstChar) { // unknown OSC
+            //dump('unknown OSC: ' + this.esc + ch + '\n');
+            this.state = AnsiParser.STATE_TEXT;
+            this.esc = '';
+            break;
+          }
+        }
+        for (var j=0; j<params.length - 1; ++j) {
+          if ( params[j] )
+            params[j] = parseInt(params[j], 10);
+          else
+            params[j] = 0;
+        }
+        switch (params[0]) {
+        case 2:
+          if (params[1] == '?')
+            ; // elicits a response; not implemented
+          else {
+            let title = params[1];
+            if (this.termbuf.view.charset != 'UTF-8')
+              title = b2u(title);
+            this.termbuf.setTitle({site: title});
+          }
+          break;
+        default:
+          //dump('unknown OSC: ' + this.esc + ch + '\n');
+        }
+        this.state = AnsiParser.STATE_TEXT;
+        this.esc = '';
+      } else {
+        this.esc += ch;
+      }
+      break;
     case AnsiParser.STATE_C1:
       var C1_End = true;
       var C1_Char = [' ', '#', '%', '(', ')', '*', '+', '-', '.', '/'];
@@ -269,6 +315,8 @@ AnsiParser.prototype.feed = function(data) {
     case AnsiParser.STATE_ESC:
       if (ch == '[')
         this.state=AnsiParser.STATE_CSI;
+      else if (ch == ']')
+        this.state=AnsiParser.STATE_OSC;
       else {
         this.state=AnsiParser.STATE_C1;
         --i;

src/js/pttchrome.js

@@ -115,7 +115,7 @@ export const App = function() {
     if (self.view.titleTimer) {
       self.view.titleTimer.cancel();
       self.view.titleTimer = null;
-      document.title = self.connectedUrl.site;
+      self.view.buf.setTitle();
       self.view.notif.close();
     }
   }, false);
@@ -234,6 +234,7 @@ App.prototype.onConnect = function() {
   console.info("pttchrome onConnect");
   this.connectState = 1;
   this.updateTabIcon('connect');
+  this.view.buf.setTitle({conn: this.connectedUrl.site}),
   this.idleTime = 0;
   var self = this;
   this.timerEverySec = setTimer(true, function() {

src/js/term_buf.js

@@ -257,6 +257,10 @@ export function TermBuf(cols, rows) {
     //this.keyWordLine[rows]=false;
   }
   this.BBSWin = document.getElementById('BBSWindow');
+  this.titleBase = process.env.PTTCHROME_PAGE_TITLE;
+  this.titleSite = null;
+  this.titleConn = null;
+  document.title = this.title = this.titleBase;
 }
 
 TermBuf.prototype = {
@@ -1201,6 +1205,23 @@ TermBuf.prototype = {
   clearHighlight: function(){
     this.nowHighlight = -1;
     this.mouseCursor = 0;
+  },
+
+  setTitle: function(part) {
+    if (part.site !== undefined) {
+      this.titleSite = part.site;
+    }
+    if (part.conn !== undefined) {
+      this.titleConn = part.conn;
+    }
+    let title = this.titleBase;
+    if (this.titleSite) {
+      title += ' - ' + this.titleSite;
+    }
+    if (this.titleConn) {
+      title += ' - ' + this.titleConn;
+    }
+    document.title = this.title = title;
   }
 };
 

src/js/term_view.js

@@ -727,10 +727,10 @@ TermView.prototype = {
       this.titleTimer = null;
     }
     this.titleTimer = setTimer(true, function() {
-      if (document.title == app.connectedUrl.site) {
+      if (document.title == this.buf.title) {
         document.title = title + ' ' + app.waterball.message;
       } else {
-        document.title = app.connectedUrl.site;
+        document.title = this.buf.title;
       }
     }, 1500);
     var options = {