@   <div id='chat-input-file'>
  @     <span>File:</span>
  @     <input type="file" name="file">
  @   </div>
  @ </div>
  @ </form>
  @ <hr>

  /* New chat messages get inserted immediately after this element */
  @ <span id='message-inject-point'></span>

  /* Always in-line the javascript for the chat page */
  @ <script nonce="%h(style_nonce())">/* chat.c:%d(__LINE__) */
  @ let _me = "%j(g.zLogin)";
  cgi_append_content(builtin_text("chat.js"),-1);
  @ </script>

  style_finish_page();
}

/* Definition of repository tables used by chat
*/
static const char zChatSchema1[] =
@ CREATE TABLE repository.chat(
@   msgid INTEGER PRIMARY KEY AUTOINCREMENT,
@   mtime JULIANDAY,
@   xfrom TEXT,
@   xmsg  TEXT,
@   file  BLOB,
@   fname TEXT,
@   fmime TEXT

/*
** WEBPAGE: chat-send
**
** This page receives (via XHR) a new chat-message and/or a new file
** to be entered into the chat history.
*/
void chat_send_webpage(void){
  int nByte;
  const char *zMsg;
  login_check_credentials();
  if( !g.perm.Chat ) return;
  chat_create_tables();
  nByte = atoi(PD("file:bytes",0));
  zMsg = PD("msg","");
  if( nByte==0 ){
    if( zMsg[0] ){
      db_multi_exec(
        "INSERT INTO chat(mtime,xfrom,xmsg)"
        "VALUES(julianday('now'),%Q,%Q)",
        g.zLogin, zMsg
      );
    }
  }else{
    Stmt q;
    Blob b;
    db_prepare(&q,
        "INSERT INTO chat(mtime, xfrom,xmsg,file,fname,fmime)"
        "VALUES(julianday('now'),%Q,%Q,:file,%Q,%Q)",
        g.zLogin, zMsg, PD("file:filename",""),
        PD("file:mimetype","application/octet-stream"));
    blob_init(&b, P("file"), nByte);
    db_bind_blob(&q, ":file", &b);
    db_step(&q);
    db_finalize(&q);
    blob_reset(&b);
  }
}

/*
** WEBPAGE: chat-poll
**
** The chat page generated by /chat using a XHR to this page in order
** to ask for new chat content.  The "name" argument should begin with
** an integer which is the largest "msgid" that the chat page currently
** holds.  If newer content is available, this routine returns that
** content straight away.  If no new content is available, this webpage
** blocks until the new content becomes available.  In this way, the
** system implements "hanging-GET" or "long-poll" style event notification.
**
** The reply from this webpage is JSON that describes the new content.
** Format of the json:
**
** |    {
** |      "msg":[
** |        {
** |           "msgid": integer // message id
** |           "mtime": text    // When sent:  YYYY-MM-DD HH:MM:SS UTC
** |           "xfrom": text    // Login name of sender
** |           "uclr":  text    // Color string associated with the user
** |           "xmsg":  text    // HTML text of the message
** |           "fsize": integer // file attachment size in bytes
** |           "fname": text    // Name of file attachment
** |           "fmime": text    // MIME-type of file attachment
** |        }
** |      ]
** |    }
**
** The "fname" and "fmime" fields are only present if "fsize" is greater
** than zero.  The "xmsg" field may be an empty string if "fsize" is zero.
**
** The "msgid" values will be in increasing order.
*/
void chat_poll_webpage(void){
  Blob json;                  /* The json to be constructed and returned */
  sqlite3_int64 dataVersion;  /* Data version.  Used for polling. */
  sqlite3_int64 newDataVers;
  int iDelay = 1000;          /* Delay until next poll (milliseconds) */
  const char *zSep = "{\"msgs\":[\n";   /* List separator */
  int msgid = atoi(PD("name","0"));
  Stmt q1;
  login_check_credentials();
  if( !g.perm.Chat ) return;
  chat_create_tables();
  cgi_set_content_type("text/json");
  dataVersion = db_int64(0, "PRAGMA data_version");
  db_prepare(&q1,
    "SELECT msgid, datetime(mtime), xfrom, xmsg, length(file), fname, fmime"
    "  FROM chat"
    " WHERE msgid>%d"
    " ORDER BY msgid",
    msgid
  );
  blob_init(&json, 0, 0);
  while(1){
    int cnt = 0;
    while( db_step(&q1)==SQLITE_ROW ){
      int id = db_column_int(&q1, 0);
      const char *zDate = db_column_text(&q1, 1);
      const char *zFrom = db_column_text(&q1, 2);
      const char *zRawMsg = db_column_text(&q1, 3);
      char *zMsg;
      int nByte;
      cnt++;
      blob_append(&json, zSep, -1);
      zSep = ",\n";
      blob_appendf(&json, "{\"msgid\":%d,\"mtime\":\"%j\",", id, zDate);
      blob_appendf(&json, "\"xfrom\":\"%j\",", zFrom);
      blob_appendf(&json, "\"uclr\":\"%j\",", hash_color(zFrom));

      /* TBD:  Convert the raw message into HTML, perhaps by running it
      ** through a text formatter, or putting markup on @name phrases,
      ** etc. */
      zMsg = mprintf("%h", zRawMsg);
      blob_appendf(&json, "\"xmsg\":\"%j\",", zMsg);
      fossil_free(zMsg);

      nByte = db_column_bytes(&q1, 4);
      if( nByte==0 ){
        blob_appendf(&json, "\"fsize\":0}");
      }else{
        const char *zFName = db_column_text(&q1, 5);
        const char *zFMime = db_column_text(&q1, 6);
        blob_appendf(&json, "\"fsize\":%d,\"fname\":\"%j\",\"fmime\":\"%j\"}",
               nByte, zFName, zFMime);
      }
    }
    if( cnt ){
      blob_append(&json, "\n]}", 3);
      cgi_set_content(&json);
      break;
    }
    sqlite3_sleep(iDelay);
    while( (newDataVers = db_int64(0,"PRAGMA data_version"))==dataVersion ){
      sqlite3_sleep(iDelay);
    }
    dataVersion = newDataVers;
  } /* Exit by "break" */
  db_finalize(&q1);
  return;      
}

/*
** WEBPAGE: chat-download
**
** Download the CHAT.FILE attachment associated with a single chat
** entry.  The "name" query parameter begins with an integer that

(function(){
  const form = document.querySelector('#chat-form');
  let mxMsg = 0;
  // let _me = "%string($me)";
let me = "drh";  // FIX ME
  form.addEventListener('submit',(e)=>{
    e.preventDefault();
    if( form.msg.value.length>0 || form.file.value.length>0 ){
      fetch("chat-send",{
        method: 'POST',
        body: new FormData(form)
      });
    }
    form.msg.value = "";
    form.file.value = "";
    form.msg.focus();
  });















































































  /* Injects element e as a new row in the chat, at the top of the list */
  const injectMessage = function f(e){
    if(!f.injectPoint){
      f.injectPoint = document.querySelector('#message-inject-point');
    }
    if(f.injectPoint.nextSibling){
      f.injectPoint.parentNode.insertBefore(e, f.injectPoint.nextSibling);

          span.appendChild(a);
        }
        let br = document.createElement("br");
        br.style.clear = "both";
        span.appendChild(br);
      }
      if(m.xmsg){
        span.innerHTML += m.xmsg;
      }
      span.classList.add('chat-message');
      if( m.xfrom!=_me ){
        span.classList.add('chat-mx');
      }else{
        span.classList.add('chat-ms');
      }
    }
  }
  async function poll(){
    if(poll.running) return;
    poll.running = true;
    fetch("chat-poll/" + mxMsg)
    .then(x=>x.json())
    .then(y=>newcontent(y))
    .finally(()=>poll.running=false)
  }
  // setInterval(poll, 1000);
})();

**   *  Display lists are indented from the surrounding text.
**      Each tag begins with "-" or occur on a line that is
**      followed by two spaces and a non-space.  <dd> elements can begin
**      on the same line as long as they are separated by at least
**      two spaces.
**
**   *  Indented text is show verbatim (<pre>...</pre>)
**
**   *  Lines that begin with "|" at the left margin are in <pre>...</pre>
*/
static void help_to_html(const char *zHelp, Blob *pHtml){
  int i;
  char c;
  int nIndent = 0;
  int wantP = 0;
  int wantBR = 0;
  int aIndent[10];
  const char *azEnd[10];
  int iLevel = 0;
  int isLI = 0;
  int isDT = 0;
  int inPRE = 0;
  static const char *zEndDL = "</dl></blockquote>";
  static const char *zEndPRE = "</pre></blockquote>";
  static const char *zEndUL = "</ul>";
  static const char *zEndDD = "</dd>";

  aIndent[0] = 0;
  azEnd[0] = "";
  while( zHelp[0] ){
    i = 0;
    while( (c = zHelp[i])!=0 && c!='\n' ){
      if( c=='%' && i>2 && zHelp[i-2]==':' && strncmp(zHelp+i,"%fossil",7)==0 ){
        appendLinked(pHtml, zHelp, i);
        zHelp += i+1;
        i = 0;
        wantBR = 1;
        continue;
      }
      i++;
    }
    if( i>2 && (zHelp[0]=='>' || zHelp[0]=='|') && zHelp[1]==' ' ){
      if( zHelp[0]=='>' ){
        isDT = 1;
        for(nIndent=1; nIndent<i && zHelp[nIndent]==' '; nIndent++){}
      }else{
        if( !inPRE ){
          blob_append(pHtml, "<pre>\n", -1);
          inPRE = 1;
        }
      }
    }else{
      if( inPRE ){
        blob_append(pHtml, "</pre>\n", -1);
        inPRE = 0;
      }
      isDT = 0;
      for(nIndent=0; nIndent<i && zHelp[nIndent]==' '; nIndent++){}
    }
    if( inPRE ){
      blob_append(pHtml, zHelp+1, i);
      zHelp += i + 1;
      continue;
    }
    if( nIndent==i ){
      if( c==0 ) break;
      if( iLevel && azEnd[iLevel]==zEndPRE ){
        /* Skip the newline at the end of a <pre> */
      }else{
        blob_append_char(pHtml, '\n');

    if( c=='%' && strncmp(zHelp+i,"%fossil",7)==0 ){
      if( i>0 ) blob_append(pText, zHelp, i);
      blob_append(pText, "fossil", 6);
      zHelp += i+7;
      i = -1;
      continue;
    }
    if( c=='\n' && (zHelp[i+1]=='>' || zHelp[i+1]=='|') && zHelp[i+2]==' ' ){
      blob_append(pText, zHelp, i+1);
      blob_append(pText, " ", 1);
      zHelp += i+2;
      i = -1;
      continue;
    }
    if( c=='[' && (x = help_is_link(zHelp+i, 100000))!=0 ){

#define TIMELINE_FORUMTXT 0x4000000 /* Render all forum messages */
#define TIMELINE_REFS     0x8000000 /* Output intended for References tab */
#define TIMELINE_DELTA   0x10000000 /* Background color shows delta manifests */
#endif

/*
** Hash a string and use the hash to determine a background color.
**
** This value returned is in static space and is overwritten with
** each subsequent call.
*/
char *hash_color(const char *z){
  int i;                       /* Loop counter */
  unsigned int h = 0;          /* Hash on the branch name */
  int r, g, b;                 /* Values for red, green, and blue */
  int h1, h2, h3, h4;          /* Elements of the hash value */
  int mx, mn;                  /* Components of HSV */