.input-with-label > span {
    margin: 0 0.25em 0 0.25em;
    vertical-align: middle;
}
.hidden {
  display: none;
}
.font-size-100 {
  font-size: 100%;
}
.font-size-125 {
  font-size: 125%;
}
.font-size-150 {
  font-size: 150%;
}
.font-size-175 {
  font-size: 175%;
}
.font-size-200 {
  font-size: 200%;
}

}


enum fileedit_render_preview_flags {
FE_PREVIEW_LINE_NUMBERS = 1
};
enum fileedit_render_modes {
/* GUESS must be 0. All others have unspecified values. */
FE_RENDER_GUESS = 0,
FE_RENDER_PLAIN_TEXT,
FE_RENDER_HTML,
FE_RENDER_WIKI
};

static int fileedit_render_mode_for_mimetype(const char * zMimetype){

    }
  }
  db_finalize(&stmt);
  return zFileUuid;
}

/*
** Helper for /fileedit_xyz routes. Clears the CGI content buffer,
** sets an error status code, and queues up a JSON response in the
** form of an object:
**
** {error: formatted message}
**
** After calling this, the caller should immediately return.
 */

*/
void fileedit_ajax_content(){
  const char * zFilename = PD("file",P("name"));
  const char * zRev = P("r");
  int vid, frid;
  Blob content = empty_blob;
  const char * zMime;

  if(!fileedit_ajax_boostrap()
     || !fileedit_ajax_setup_filerev(zRev, 0, &vid,
                                     zFilename, &frid)){
    return;
  }
  zMime = mimetype_from_name(zFilename);
  content_get(frid, &content);
  cgi_set_content_type(zMime ? zMime : "application/octet-stream");
  cgi_set_content(&content);
}

/*
** WEBPAGE: fileedit_preview
**
** Required query parameters:
**
** file=FILENAME
** content=text
**
** Optional query parameters:
**
** render_mode=integer (FE_RENDER_xxx) (default=FE_RENDER_GUESS)
**
** ln=0 or 1 to disable/enable line number mode in
** FE_RENDER_PLAIN_TEXT mode.
**
** iframe_height=integer (default=40) Height, in EMs of HTML preview
** iframe.
**
** User must have Write access to use this page.
**
** Responds with the HTML content of the preview. On error it produces
** a JSON response as documented for fileedit_ajax_error().
*/
void fileedit_ajax_preview(){
  const char * zFilename = PD("file",P("name"));
  const char * zContent = P("content");
  int renderMode = atoi(PD("render_mode","0"));
  int ln = atoi(PD("ln","0"));
  int iframeHeight = atoi(PD("iframe_height","40"));
  Blob content = empty_blob;

  if(!fileedit_ajax_boostrap()
     || !fileedit_ajax_check_filename(zFilename)){
    return;
  }
  cgi_set_content_type("text/html");
  blob_init(&content, zContent, -1);
  fileedit_render_preview(&content, zFilename,
                          ln ? FE_PREVIEW_LINE_NUMBERS : 0,
                          renderMode, iframeHeight);
}

/*
** WEBPAGE: fileedit_diff
**
** Required query parameters:
**
** file=FILENAME

** content=text
** r=checkin version
**
** Optional parameters:
**
** sbs=integer (1=side-by-side or 0=unified, default=0)
**
** User must have Write access to use this page.
**
** Responds with the HTML content of the diff. On error it produces a
** JSON response as documented for fileedit_ajax_error().
*/
void fileedit_ajax_diff(){
  /*
  ** Reminder: we only need the filename to perform valdiation
  ** against fileedit_is_editable(), else this route could be
  ** abused to get diffs against content disallowed by the
  ** whitelist.
  */
  const char * zFilename = PD("file",P("name"));
  const char * zRev = P("r");
  const char * zContent = P("content");
  char * zRevUuid = 0;
  int isSbs = atoi(PD("sbs","0"));
  int vid, frid;
  Blob content = empty_blob;

  if(!fileedit_ajax_boostrap()
     || !fileedit_ajax_setup_filerev(zRev, &zRevUuid, &vid,
                                     zFilename, &frid)){
    return;
  }
  if(!zContent){
    zContent = "";
  }
  cgi_set_content_type("text/html");
  blob_init(&content, zContent, -1);
  fileedit_render_diff(&content, frid, zRevUuid, isSbs);
  fossil_free(zRevUuid);
  blob_reset(&content);
}

/*
** Sets up and validates most, but not all, of p's checkin-related
** state from the CGI environment. Returns 0 on success or a suggested
** HTTP result code on error, in which case a message will have been
** written to pErr.
**
** It always fails if it cannot completely resolve the 'file' and 'r'
** parameters, including verifying that the refer to a real
** file/version combination and editable by the current user. All
** others are optional (at this level, anyway, but upstream code might
** require them).
**
** Intended to be used only by /filepage and /filepage_commit.
*/
static int fileedit_setup_cimi_from_p(CheckinMiniInfo * p, Blob * pErr){
  char * zFileUuid = 0;          /* UUID of file content */
  const char * zFlag;            /* generic flag */
  int rc = 0, vid = 0, frid = 0; /* result code, checkin/file rids */ 

#define fail(EXPR) blob_appendf EXPR; goto end_fail
  zFlag = PD("file",P("name"));
  if(zFlag==0 || !*zFlag){
    rc = 400;
    fail((pErr,"Missing required 'file' parameter."));
  }

    blob_append(&p->comment, zFlag, -1);
  }
  zFlag = P("comment_mimetype");
  if(zFlag){
    p->zCommentMimetype = mprintf("%s",zFlag);
    zFlag = 0;
  }

#define p_int(K) atoi(PD(K,"0"))
  if(p_int("dry_run")!=0){
    p->flags |= CIMINI_DRY_RUN;
  }
  if(p_int("allow_fork")!=0){
    p->flags |= CIMINI_ALLOW_FORK;
  }

    p->flags |= CIMINI_ALLOW_MERGE_MARKER;
  }
  if(p_int("prefer_delta")!=0){
    p->flags |= CIMINI_PREFER_DELTA;
  }

  /* EOL conversion policy... */

  switch(p_int("eol")){

    case 1: p->flags |= CIMINI_CONVERT_EOL_UNIX; break;
    case 2: p->flags |= CIMINI_CONVERT_EOL_WINDOWS; break;
    default: p->flags |= CIMINI_CONVERT_EOL_INHERIT; break;

  }
#undef p_int
  /*
  ** TODO?: date-override date selection field. Maybe use
  ** an input[type=datetime-local].
  */
  p->zUser = mprintf("%s",g.zLogin);
  return 0;
end_fail:
#undef fail
  fossil_free(zFileUuid);
  return rc ? rc : 500;
}

** dry_run=int (1 or 0)
** 
**
** User must have Write access to use this page.
**
** Responds with JSON:
**
** {
**  uuid: newUUID,
**  manifest: text of manifest,
**  dryRun: bool
** }
**
** On error it produces a JSON response as documented for
** fileedit_ajax_error().
*/
void fileedit_ajax_commit(){

  Blob err = empty_blob;      /* Error messages */
  Blob manifest = empty_blob; /* raw new manifest */
  CheckinMiniInfo cimi;       /* checkin state */
  int rc;                     /* generic result code */
  int newVid = 0;             /* new version's RID */
  char * zNewUuid = 0;        /* newVid's UUID */

  if(!fileedit_ajax_boostrap()){
    goto end_cleanup;
  }
  db_begin_transaction();
  CheckinMiniInfo_init(&cimi);
  rc = fileedit_setup_cimi_from_p(&cimi,&err);

  cgi_set_content_type("application/json");
  CX("{");
  CX("\"uuid\":\"%j\",", zNewUuid);
  CX("\"dryRun\": %s,",
     (CIMINI_DRY_RUN & cimi.flags) ? "true" : "false");
  CX("\"manifest\": \"%j\"", blob_str(&manifest));
  CX("}");
  db_end_transaction(0/*noting that dry-run mode will have already
                      ** set this to rollback mode. */);
end_cleanup:
  fossil_free(zNewUuid);
  blob_reset(&err);
  blob_reset(&manifest);
  CheckinMiniInfo_cleanup(&cimi);
}

  const char * zRev;                    /* checkin version */
  const char * zFileMime = 0;           /* File mime type guess */
  CheckinMiniInfo cimi;                 /* Checkin state */
  int previewHtmlHeight = 0;            /* iframe height (EMs) */
  int previewRenderMode = FE_RENDER_GUESS; /* preview mode */
  char * zFileUuid = 0;                 /* File content UUID */
  Blob err = empty_blob;                /* Error report */

  Blob endScript = empty_blob;          /* Script code to run at the
                                           end. This content will be
                                           combined into a single JS
                                           function call, thus each
                                           entry must end with a
                                           semicolon. */
  Stmt stmt = empty_Stmt;


  login_check_credentials();
  if( !g.perm.Write ){
    login_needed(g.anon.Write);
    return;
  }
  db_begin_transaction();
  CheckinMiniInfo_init(&cimi);

  style_header("File Editor");
  /* As of this point, don't use return or fossil_fatal(). Write any
  ** error in (&err) and goto end_footer instead so that we can be
  ** sure to do any cleanup and end the transaction cleanly.
  */
  if(fileedit_setup_cimi_from_p(&cimi, &err)!=0){
    goto end_footer;
  }
  zFilename = cimi.zFilename;
  zRev = cimi.zParentUuid;

  assert(zRev);
  assert(zFilename);
  zFileMime = mimetype_from_name(cimi.zFilename);

  /********************************************************************
  ** All errors which "could" have happened up to this point are of a
  ** degree which keep us from rendering the rest of the page, and
  ** thus have already caused us to skipped to the end of the page to
  ** render the errors. Any up-coming errors, barring malloc failure
  ** or similar, are not "that" fatal. We can/should continue
  ** rendering the page, then output the error message at the end.







  ********************************************************************/

  CX("<h1>Editing:</h1>");
  CX("<p class='fileedit-hint'>");
  CX("File: "
     "[<a id='finfo-link' href='#'>info</a>] "
     /* %R/finfo?name=%T&m=%!S */
     "<code id='finfo-file-name'>(loading)</code><br>");
  CX("Checkin Version: "

                        (cimi.flags & CIMINI_CONVERT_EOL_UNIX)
                        ? 1 : (cimi.flags & CIMINI_CONVERT_EOL_WINDOWS
                               ? 2 : 0),
                        "Inherit", 0,
                        "Unix", 1,
                        "Windows", 2,
                        NULL);
  style_select_list_int("select-font-size",
                        "editor_font_size", "Editor Font Size",
                        NULL/*tooltip*/,
                        100,
                        "100%", 100, "125%", 125,
                        "150%", 150, "175%", 175,
                        "200%", 200, NULL);

  CX("</div></fieldset>") /* end of checkboxes */;

  /******* Comment *******/
  CX("<a id='comment'></a>");
  CX("<fieldset><legend>Commit message</legend><div>");
  CX("<textarea name='comment' rows='3' cols='80' "
     "id='fileedit-comment'>");
  /* ^^^ adding the 'required' attribute means we cannot even submit
  ** for PREVIEW mode if it's empty :/. */
  if(blob_size(&cimi.comment)){
    CX("%h", blob_str(&cimi.comment));
  }
  CX("</textarea>\n");
  CX("<div class='fileedit-hint'>Comments use the Fossil wiki markup "

                        previewRenderMode,
                        "Guess", FE_RENDER_GUESS,
                        "Wiki/Markdown", FE_RENDER_WIKI,
                        "HTML (iframe)", FE_RENDER_HTML,
                        "Plain Text", FE_RENDER_PLAIN_TEXT,
                        NULL);
  /*
  ** Set up a JS-side mapping of the FE_RENDER_xyz values.  This is
  ** used for dynamically toggling certain UI components on and off.
  */
  blob_appendf(&endScript, "fossil.page.previewModes={"
               "guess: %d, %d: 'guess', wiki: %d, %d: 'wiki',"
               "html: %d, %d: 'html', text: %d, %d: 'text'"
               "};\n",
               FE_RENDER_GUESS, FE_RENDER_GUESS,
               FE_RENDER_WIKI, FE_RENDER_WIKI,

  fossil_free(zFileUuid);
  if(stmt.pStmt){
    db_finalize(&stmt);
  }
  if(blob_size(&err)){
    CX("<div class='fileedit-error-report'>%s</div>",
       blob_str(&err));


  }

  blob_reset(&err);
  CheckinMiniInfo_cleanup(&cimi);
  style_emit_script_fetch();
  fileedit_emit_page_script();
  if(blob_size(&endScript)>0){
    style_emit_script_tag(0);
    CX("(function(){\n");
    CX("try{\n%b\n}catch(e){console.error('Exception:',e)}\n",
       &endScript);
    CX("})();");
    style_emit_script_tag(1);
  }
  db_end_transaction(0);

  style_footer();
}

  else{
    args.unshift('Fossil status:');
    console.debug.apply(console,args);
  }
  return this;
};
/*
** Set default message.targetElement to #fossil-status-bar, if found.
*/
window.fossil.message.targetElement =
  document.querySelector('#fossil-status-bar');
/*
** By default fossil.error() sends its first argument to
** console.error(). If fossil.message.targetElement (yes,
** fossil.message) is set, it adds the 'error' CSS class to

  }
  else{
    args.unshift('Fossil error:');
    console.error.apply(console,args);
  }
  return this;
};

/**
   repoUrl( repoRelativePath [,urlParams] )

   Creates a URL by prepending this.rootPath to the given path
   (which must be relative from the top of the site, without a
   leading slash). If urlParams is a string, it must be
   paramters encoded in the form "key=val&key2=val2...", WITHOUT
   a leading '?'. If it's an object, all of its properties get
   appended to the URL in that form.
*/
window.fossil.repoUrl = function(path,urlParams){
  if(!urlParams) return this.rootPath+path;
  const url=[this.rootPath,path];
  url.push('?');
  if('string'===typeof urlParams) url.push(urlParams);
  else if('object'===typeof urlParams){
    let k, i = 0;
    for( k in urlParams ){
      if(i++) url.push('&');
      url.push(k,'=',encodeURIComponent(urlParams[k]));
    }
  }
  return url.join('');
};

"use strict";
/**
  Documented in style.c:style_emit_script_fetch(). Requires that
  window.fossil has already been set up (which happens via the routine
  which emits this code C-side).
*/
window.fossil.fetch = function f(uri,opt){
  if(!f.onerror){
    f.onerror = function(e/*event or exception*/){
      console.error("Ajax error:",e);
      if(e instanceof Error){
        fossil.error('Exception:',e);
      }
      else if(e.originalTarget && e.originalTarget.responseType==='text'){
        const txt = e.originalTarget.responseText;
        try{
          /* The convention from the /filepage_xyz routes is to
          ** return error responses in JSON form if possible:
          ** {error: "..."}
          */
          const j = JSON.parse(txt);
          console.error("Error JSON:",j);
          if(j.error){ fossil.error(j.error) };
        }catch(e){/* Try harder */
          fossil.error(txt)
        }
      }
    };
    f.onload = (r)=>console.debug('ajax response:',r);
  }
  if('/'===uri[0]) uri = uri.substr(1);
  if(!opt) opt = {};

  else if('function'===typeof opt) opt={onload:opt};


  if(!opt.onload) opt.onload = f.onload;
  if(!opt.onerror) opt.onerror = f.onerror;
  let payload = opt.payload, jsonResponse = false;
  if(payload){
    opt.method = 'POST';
    if(!(payload instanceof FormData)
       && !(payload instanceof Document)
       && !(payload instanceof Blob)
       && !(payload instanceof File)
       && !(payload instanceof ArrayBuffer)){
      if('object'===typeof payload || payload instanceof Array){
        payload = JSON.stringify(payload);
        opt.contentType = 'application/json';
      }
    }
  }
  const url=[window.fossil.repoUrl(uri,opt.urlParams)],
        x=new XMLHttpRequest();












  if('POST'===opt.method && 'string'===typeof opt.contentType){
    x.setRequestHeader('Content-Type',opt.contentType);
  }
  x.open(opt.method||'GET', url.join(''), true);
  if('json'===opt.responseType){
    /* 'json' is an extension to the supported XHR.responseType
       list. We use it as a flag to tell us to JSON.parse()
       the response. */
    jsonResponse = true;
    x.responseType = 'text';
  }else{
    x.responseType = opt.responseType||'text';
  }
  if(opt.onload){
    x.onload = function(e){

(function(){
  "use strict";
  /**
     Code for the /filepage app. Requires that the fossil JS
     bootstrapping is complete and fossil.fetch() has been installed.
  */
  const E = (s)=>document.querySelector(s);
  window.addEventListener("load", function() {
    const P = fossil.page;
    P.e = {
      taEditor: E('#fileedit-content'),
      taComment: E('#fileedit-comment'),
      ajaxContentTarget: E('#ajax-target'),
      form: E('#fileedit-form'),
      btnPreview: E("#fileedit-btn-preview"),
      btnDiffSbs: E("#fileedit-btn-diffsbs"),
      btnDiffU: E("#fileedit-btn-diffu"),
      btnCommit: E("#fileedit-btn-commit"),
      selectPreviewModeWrap: E('#select-preview-mode'),

    /**
       Cosmetic: jump through some hoops to enable/disable
       certain preview options depending on the current
       preview mode...
    */
    const selectPreviewMode =
          P.e.selectPreviewModeWrap.querySelector('select');

    selectPreviewMode.addEventListener(
      "change",function(e){
        const mode = e.target.value,
              name = P.previewModes[mode],
              hide = [], unhide = [];
        if('guess'===name){
          unhide.push(P.e.cbLineNumbersWrap,

        hide.forEach((e)=>e.classList.add('hidden'));
        unhide.forEach((e)=>e.classList.remove('hidden'));
      }, false
    );
    selectPreviewMode.dispatchEvent(
      // Force UI update
      new Event('change',{target:selectPreviewMode})
    );
    const selectFontSize = E('select[name=editor_font_size]');
    selectFontSize.addEventListener(
      "change",function(e){
        P.e.taEditor.className = e.target.className.replace(
            /\bfont-size-\d+/g, '' );
        P.e.taEditor.classList.add('font-size-'+e.target.value);
      }, false
    );
    selectFontSize.dispatchEvent(
      // Force UI update
      new Event('change',{target:selectFontSize})
    );
  }, false);


  
  /**
     updateVersion() updates filename and version in relevant UI

     Returns this object, noting that the operation is async.
  */
  fossil.page.preview = function(){
    if(!this.finfo){
      fossil.error("No content is loaded.");
      return this;
    }
    const content = this.e.taEditor.value,
          target = this.e.ajaxContentTarget;
    const updateView = function(c){
      target.innerHTML = [
        "<div class='fileedit-preview'>",
        "<div>Preview</div>",
        c||'',
        "</div><!--.fileedit-diff-->"

  */
  fossil.page.diff = function(sbs){
    if(!this.finfo){
      fossil.error("No content is loaded.");
      return this;
    }
    const self = this;
    const content = this.e.taEditor.value,
          target = this.e.ajaxContentTarget;
    const updateView = function(c){
      target.innerHTML = [
        "<div class='fileedit-diff'>",
        "<div>Diff <code>[",
        self.finfo.r,
        "]</code> &rarr; Local Edits</div>",

  */
  fossil.page.commit = function f(){
    if(!this.finfo){
      fossil.error("No content is loaded.");
      return this;
    }
    const self = this;
    const content = this.e.taEditor.value,
          target = this.e.ajaxContentTarget,
          cbDryRun = E('[name=dry_run]'),
          isDryRun = cbDryRun.checked,
          filename = this.finfo.file;
    if(!f.updateView){
      f.updateView = function(c){
        target.innerHTML = [
          "<h3>Manifest",
          (c.dryRun?" (dry run)":""),
          ": ", c.uuid.substring(0,16),"</h3>",
          "<code class='fileedit-manifest'>",
          c.manifest,
          "</code></pre>"
        ].join('');
        const msg = [
          'Committed',
          c.dryRun ? '(dry run)' : '',
          '[', c.uuid,'].'

        ];
        if(!c.dryRun){
          msg.push('Re-activating dry-run mode.');
          self.e.taComment.value = '';
          cbDryRun.checked = true;
          fossil.page.updateVersion(filename, c.uuid);
        }
        fossil.message.apply(fossil, msg);
      };
    }
    if(!content){
      f.updateView('');
      return this;
    }
    const fd = new FormData();

    CX("</span>\n");
  }
  va_end(vargs);
}


/*
** If passed 0, it emits a script opener tag with this request's
** nonce. If passed non-0 it emits a script closing tag. The very
** first time it is called, it emits some bootstrapping JS code
** immediately after the script opener. Specifically, it defines
** window.fossil if it's not already defined, and may set some
** properties on it.
*/
void style_emit_script_tag(int phase){

** including tags, which defines window.fossil.fetch(), which works
** similarly (not identically) to the not-quite-ubiquitous global
** fetch(). It calls style_emit_script_tag(), which may inject
** other JS bootstrapping bits.
**
** JS usages:
**
** fossil.fetch( URI [, onLoadCallback] );
**
** fossil.fetch( URI [, optionsObject = {}] );
**
** Noting that URI must be relative to the top of the repository and
** should not start with a slash (if it does, it is stripped). It gets
** the equivalent of "%R/" prepended to it.
**
** The optionsObject may be an onload callback or an object with any
** of these properties:
**
** - onload: callback(responseData) (default = output response to
**   the console).
**
** - onerror: callback(XHR onload event | exception)
**   (default = event or exception to the console).
**
** - method: 'POST' | 'GET' (default = 'GET')
**
** - payload: anything acceptable by XHR2.send(ARG) (DOMString,
**   Document, FormData, Blob, File, ArrayBuffer), or a plain object
**   or array, either of which gets JSON.stringify()'d. If set then
**   the method is automatically set to 'POST'. If an object/array is

**
** - urlParams: string|object. If a string, it is assumed to be a
**   URI-encoded list of params in the form "key1=val1&key2=val2...",
**   with NO leading '?'.  If it is an object, all of its properties
**   get converted to that form. Either way, the parameters get
**   appended to the URL.
**
** When an options object does not provide onload() or onerror()
** handlers of its own, this function falls back to
** fossil.fetch.onload() and fossil.fetch.onerror() as defaults. The
** default implementations route the data through the dev console and
** (for onerror()) through fossil.error(). Individual pages may
** overwrite those members to provide default implementations suitable
** for the page's use.
**
** Returns this object, noting that the XHR request is asynchronous,
** and still in transit (or has yet to be sent) when that happens.
*/
void style_emit_script_fetch(){
  static int once = 0;
  if(0==once){
    once = 1;
    style_emit_script_tag(0);
    CX("%s", builtin_text("fossil.fetch.js"));
    style_emit_script_tag(1);
  }
}