Ansi

CSS for marked up ANSI. Good for displaying MUD logs etc.

pre.terminal {font-family: monospace; white-space:-moz-pre-wrap; white-space: pre-wrap;}
      pre.terminal {background:black; color:#aaa;}
      pre.terminal b {font-weight: inherit; color:#FFF;}
 
      pre.terminal span.ansifgred {color:#A00;}
      pre.terminal span.ansifggreen {color:#0A0;}
      pre.terminal span.ansifgblue {color:#00A;}
      pre.terminal span.ansifgcyan {color:#0AA;}
      pre.terminal span.ansifgmagenta {color:#A0A;}
      pre.terminal span.ansifgyellow {color:#A50;}
      pre.terminal span.ansifgwhite {color:#AAA;}
      pre.terminal span.ansifgblack {color:#000;}
 
      pre.terminal b span.ansifgred,
      pre.terminal span.ansifgred b
{color:#F55;}
      pre.terminal b span.ansifggreen,
      pre.terminal span.ansifggreen b
{color:#5F5;}
      pre.terminal b span.ansifgblue,
      pre.terminal span.ansifgblue b
{color:#55F;}
      pre.terminal b span.ansifgcyan,
      pre.terminal span.ansifgcyan b
{color:#5FF;}
      pre.terminal b span.ansifgmagenta,
      pre.terminal span.ansifgmagenta b
{color:#F5F;}
      pre.terminal b span.ansifgyellow,
      pre.terminal span.ansifgyellow b
{color:#FF5;}
      pre.terminal b span.ansifgwhite,
      pre.terminal span.ansifgwhite b
{color:#FFF;}
      pre.terminal b span.ansifgblack,
      pre.terminal span.ansifgblack b
{color:#555;}
 
      pre.terminal span.ansibgred {background-color:#a00;}
      pre.terminal span.ansibggreen {background-color:#0a0;}
      pre.terminal span.ansibgblue {background-color:#00a;}
      pre.terminal span.ansibgcyan {background-color:#0aa;}
      pre.terminal span.ansibgmagenta {background-color:#a0a;}
      pre.terminal span.ansibgyellow {background-color:#a50;}
      pre.terminal span.ansibgwhite {background-color:#aaa;}
      pre.terminal span.ansibgblack {background-color:#000;}
 
      pre.terminal span.ansihighbg span.ansibgred,
      pre.terminal span.ansibgred span.ansihighbg
{background-color:#F55;}
      pre.terminal span.ansihighbg span.ansibggreen,
      pre.terminal span.ansibggreen span.ansihighbg
{background-color:#5F5;}
      pre.terminal span.ansihighbg bgspan.ansibgblue,
      pre.terminal span.ansibgblue span.ansihighbg
{background-color:#55F;}
      pre.terminal span.ansihighbg span.ansibgcyan,
      pre.terminal span.ansibgcyan span.ansihighbg
{background-color:#5FF;}
      pre.terminal span.ansihighbg span.ansibgmagenta,
      pre.terminal span.ansibgmagenta span.ansihighbg
{background-color:#F5F;}
      pre.terminal span.ansihighbg span.ansibgyellow,
      pre.terminal span.ansibgyellow span.ansihighbg
{background-color:#FF5;}
      pre.terminal span.ansihighbg span.ansibgwhite,
      pre.terminal span.ansibgwhite span.ansihighbg
{background-color:#FFF;}
      pre.terminal span.ansihighbg span.ansibgblack,
      pre.terminal span.ansibgblack span.ansihighbg
{background-color:#555;}
 
/* For that finishing touch, a blinking cursor */
 
/*pre.terminal.cursor:after {content:"_"; text-decoration: blink;}*/
pre.terminal.cursor:after {content:"\2588"; text-decoration: blink;}
 
pre.terminal {padding: 0.25em; border: 2px inset;}

Ruby script to generate HTML from ANSI.

class ANSIProcessor
  def initialize()
    @state=:plain
    @current_code=0
    @fg=nil
    @bg=nil
    @bold=false
    @bold_bg=false
    @blink=false
    @underline=false
    @italic=false
  end
 
  Colours = ["black", "red", "green", "yellow", "blue", "magenta", "cyan", "white"]
  IBM_High_ASCII =['�','☺','☻','♥','♦','♣','♠','•','◘','○',"\n",'♂','♀',"\r",'♫','☼','►','◄','↕','‼','¶','§','▬','↨','↑','↓','→','←','∟','↔','▲','▼',' ','!','"','#','$','%','&','\'','(',')','*','+',',','-','.','/','0','1','2','3','4','5','6','7','8','9',':',';','<','=','>','?','@','A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z','[','\\',']','^','_','`','a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z','{','|','}','~','⌂','Ç','ü','é','â','ä','à','å','ç','ê','ë','è','ï','î','ì','Ä','Å','É','æ','Æ','ô','ö','ò','û','ù','ÿ','Ö','Ü','¢','£','¥','₧','ƒ','á','í','ó','ú','ñ','Ñ','ª','º','¿','⌐','¬','½','¼','¡','«','»','░','▒','▓','│','┤','╡','╢','╖','╕','╣','║','╗','╝','╜','╛','┐','└','┴','┬','├','─','┼','╞','╟','╚','╔','╩','╦','╠','═','╬','╧','╨','╤','╥','╙','╘','╒','╓','╫','╪','┘','┌','█','▄','▌','▐','▀','α','ß','Γ','π','Σ','σ','µ','τ','Φ','Θ','Ω','δ','∞','φ','ε','∩','≡','±','≥','≤','⌠','⌡','÷','≈','°','∙','·','√','ⁿ','²','■',' ']
 
  def process(string)
    subcodes=[]
    charnum=0
    string.each_byte do |char|
      case @state
      when :plain
        if char==27
          @state=:escape1
        elsif char==?\n
          print IBM_High_ASCII[char]
          @state=:plain
          charnum=0
        elsif char==?\r
          print IBM_High_ASCII[char]
          @state=:plain
          charnum=0
        else
          charnum+=1
          print IBM_High_ASCII[char]
          @state=:plain
        end
      when :escape1
        if char=="["[0]
          @state=:escape2
          @current_code=0
        else
          raise "Unknown escape sequence: #{char.chr}"
        end
      when :escape2
        case char
        when "0"[0].."9"[0]
          @current_code=@current_code*10+char.chr.to_i
          @state=:escape2
        when ";"[0]
          subcodes<<@current_code
          @current_code=0
          @state=:escape2
        when "m"[0]
          subcodes<<@current_code
          subcodes.each {|code| handle_code(code)}
          subcodes=[]
          @current_code=0
          @state=:plain
        when "C"[0]
          subcodes<<@current_code
          subcodes[0].times { print " "}
          subcodes=[]
          @current_code=0
          @state=:plain
       else
          raise "Unknown escape sequence: #{char.chr}"
        end
      else
        raise "Unknown state"
      end
      if charnum>=80
        #print "\n"
        #charnum=0
      end
    end
  end
 
  def handle_code(code)
    case code
    when 0
      print "</span>" unless @fg.nil?
      print "</span>" unless @bg.nil?
      print "</i>" if @italic
      print "</span>" if @blink
      print "</ul>" if @underline
      print "</b>" if @bold
 
      @fg=nil
      @bg=nil
      @bold=false
      @blink=false
      @underline=false
      @italic=false
 
    when 1
      unless @bold
        print "</span>" unless @fg.nil?
        print "</span>" unless @bg.nil?
        print "</i>" if @italic
        print "</span>" if @blink
        print "</ul>" if @underline
        print "<b>"
        print "<ul>" if @underline
        print "<span class=\"blink\">" if @blink
        print "<i>" if @italic
        print "<span class=\"bg#{@bg}\">" unless @bg.nil?
        print "<span class=\"fg#{@fg}\">" unless @fg.nil?
        @bold=true
      end
 
    when 2,22
      if @bold
        print "</span>" unless @fg.nil?
        print "</span>" unless @bg.nil?
        print "</i>" if @italic
        print "</span>" if @blink
        print "</ul>" if @underline
        print "</b>"
        print "<ul>" if @underline
        print "<span class=\"blink\">" if @blink
        print "<i>" if @italic
        print "<span class=\"ansibg#{@bg}\">" unless @bg.nil?
        print "<span class=\"ansifg#{@fg}\">" unless @fg.nil?
        @bold=false
      end
 
    when 4
      unless @underline
        print "</span>" unless @fg.nil?
        print "</span>" unless @bg.nil?
        print "</i>" if @italic
        print "</span>" if @blink
        print "<ul>"
        print "<span class=\"ansiblink\">" if @blink
        print "<i>" if @italic
        print "<span class=\"ansibg#{@bg}\">" unless @bg.nil?
        print "<span class=\"ansifg#{@fg}\">" unless @fg.nil?
        @underline=true
      end
 
    when 24
      if @underline
        print "</span>" unless @fg.nil?
        print "</span>" unless @bg.nil?
        print "</i>" if @italic
        print "</span>" if @blink
        print "</ul>"
        print "<span class=\"ansiblink\">" if @blink
        print "<i>" if @italic
        print "<span class=\"ansibg#{@bg}\">" unless @bg.nil?
        print "<span class=\"ansifg#{@fg}\">" unless @fg.nil?
        @underline=false
      end
 
    when 5
      unless @blink
        print "</span>" unless @fg.nil?
        print "</span>" unless @bg.nil?
        print "</i>" if @italic
        print "<span class=\"ansiblink\">"
        print "<i>" if @italic
        print "<span class=\"ansibg#{@bg}\">" unless @bg.nil?
        print "<span class=\"ansifg#{@fg}\">" unless @fg.nil?
        @blink=true
      end
 
    when 25
      if @blink
        print "</span>" unless @fg.nil?
        print "</span>" unless @bg.nil?
        print "</i>" if @italic
        print "</span>"
        print "<i>" if @italic
        print "<span class=\"ansibg#{@bg}\">" unless @bg.nil?
        print "<span class=\"ansifg#{@fg}\">" unless @fg.nil?
        @blink=false
      end
 
    when 3
      unless @italic
        print "</span>" unless @fg.nil?
        print "</span>" unless @bg.nil?
        print "<i>"
        print "<span class=\"ansibg#{@bg}\">" unless @bg.nil?
        print "<span class=\"ansifg#{@fg}\">" unless @fg.nil?
        @italic=true
      end
 
    when 23
      if @italic
        print "</span>" unless @fg.nil?
        print "</span>" unless @bg.nil?
        print "</i>"
        print "<span class=\"ansibg#{@bg}\">" unless @bg.nil?
        print "<span class=\"ansifg#{@fg}\">" unless @fg.nil?
        @italic=false
      end
 
    when 40..49
      unless Colours[code-40]==@bg
        print "</span>" unless @fg.nil?
        print "</span>" unless @bg.nil?
        @bg=Colours[code-40]
        print "<span class=\"ansibg#{@bg}\">"
        print "<span class=\"ansifg#{@fg}\">" unless @fg.nil?
      end
 
    when 30..39
      unless Colours[code-30]==@fg
        print "</span>" unless @fg.nil?
        @fg=Colours[code-30]
        print "<span class=\"ansifg#{@fg}\">"
      end
 
    end
 
  end
 
end
 
print <<END
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-CA">
  <head>
    <title></title>
    <style type="text/css">
      pre.terminal {font-family: "FreeMono", monospace; white-space:-moz-pre-wrap; white-space: pre-wrap;}
      pre.terminal {background:black; color:#aaa; font-weight: bolder;}
      pre.terminal b {font-weight: inherit; color:#FFF;}
 
      pre.terminal span.ansifgred {color:#A00;}
      pre.terminal span.ansifggreen {color:#0A0;}
      pre.terminal span.ansifgblue {color:#00A;}
      pre.terminal span.ansifgcyan {color:#0AA;}
      pre.terminal span.ansifgmagenta {color:#A0A;}
      pre.terminal span.ansifgyellow {color:#A50;}
      pre.terminal span.ansifgwhite {color:#AAA;}
      pre.terminal span.ansifgblack {color:#000;}
 
      pre.terminal b span.ansifgred,
      pre.terminal span.ansifgred b
{color:#F55;}
      pre.terminal b span.ansifggreen,
      pre.terminal span.ansifggreen b
{color:#5F5;}
      pre.terminal b span.ansifgblue,
      pre.terminal span.ansifgblue b
{color:#55F;}
      pre.terminal b span.ansifgcyan,
      pre.terminal span.ansifgcyan b
{color:#5FF;}
      pre.terminal b span.ansifgmagenta,
      pre.terminal span.ansifgmagenta b
{color:#F5F;}
      pre.terminal b span.ansifgyellow,
      pre.terminal span.ansifgyellow b
{color:#FF5;}
      pre.terminal b span.ansifgwhite,
      pre.terminal span.ansifgwhite b
{color:#FFF;}
      pre.terminal b span.ansifgblack,
      pre.terminal span.ansifgblack b
{color:#555;}
 
      pre.terminal span.ansibgred {background-color:#a00;}
      pre.terminal span.ansibggreen {background-color:#0a0;}
      pre.terminal span.ansibgblue {background-color:#00a;}
      pre.terminal span.ansibgcyan {background-color:#0aa;}
      pre.terminal span.ansibgmagenta {background-color:#a0a;}
      pre.terminal span.ansibgyellow {background-color:#a50;}
      pre.terminal span.ansibgwhite {background-color:#aaa;}
      pre.terminal span.ansibgblack {background-color:#000;}
 
      pre.terminal span.ansihighbg span.ansibgred,
      pre.terminal span.ansibgred span.ansihighbg
{background-color:#F55;}
      pre.terminal span.ansihighbg span.ansibggreen,
      pre.terminal span.ansibggreen span.ansihighbg
{background-color:#5F5;}
      pre.terminal span.ansihighbg bgspan.ansibgblue,
      pre.terminal span.ansibgblue span.ansihighbg
{background-color:#55F;}
      pre.terminal span.ansihighbg span.ansibgcyan,
      pre.terminal span.ansibgcyan span.ansihighbg
{background-color:#5FF;}
      pre.terminal span.ansihighbg span.ansibgmagenta,
      pre.terminal span.ansibgmagenta span.ansihighbg
{background-color:#F5F;}
      pre.terminal span.ansihighbg span.ansibgyellow,
      pre.terminal span.ansibgyellow span.ansihighbg
{background-color:#FF5;}
      pre.terminal span.ansihighbg span.ansibgwhite,
      pre.terminal span.ansibgwhite span.ansihighbg
{background-color:#FFF;}
      pre.terminal span.ansihighbg span.ansibgblack,
      pre.terminal span.ansibgblack span.ansihighbg
{background-color:#555;}
 
/* For that finishing touch, a blinking cursor */
 
/*pre.terminal.cursor:after {content:"_"; text-decoration: blink;}*/
pre.terminal.cursor:after {content:"\\2588"; text-decoration: blink;}
 
pre.terminal {padding: 0.25em; border: 2px inset;}
 
pre.terminal {letter-spacing: -1px; line-height: 97.5%}
 
    </style>
  </head>
  <body>
    <pre class="terminal cursor">
END
 
ap=ANSIProcessor.new
 
$stdin.each do |line| 
  ap.process line[11..-1]
end
 
print <<END
</pre>
  </body>
</html>
END
page_revision: 3, last_edited: 1217646826|%e %b %Y, %H:%M %Z (%O ago)
EditTagsDiscuss History Files Print Site tools+ Options
Except where stated otherwise, content is © 2007–2008 RetroWIKI contributors, all rights reserved. Content from the RetroMUD game or the retromud.org website is © 1994–2008 RetroMUD and/or RetroMUD staff, used here only for commentary, without permission.