229 lines
4.6 KiB
HTML
229 lines
4.6 KiB
HTML
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||
|
|
<html xmlns="http://www.w3c.org/1999/xhtml" xml:lang="da">
|
||
|
|
<head>
|
||
|
|
<title>The RichTextDevice</title>
|
||
|
|
<style type='text/css'>
|
||
|
|
* {
|
||
|
|
margin:0;
|
||
|
|
padding:0;
|
||
|
|
text-decoration:none;
|
||
|
|
font-weight:normal;
|
||
|
|
color:#000;
|
||
|
|
font:12px arial;
|
||
|
|
}
|
||
|
|
|
||
|
|
body {
|
||
|
|
font:12px arial;
|
||
|
|
background-color:#000;
|
||
|
|
overflow:hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
#wrapper {
|
||
|
|
width:400px;
|
||
|
|
margin:0 auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
#wrapper * {
|
||
|
|
padding:4px;
|
||
|
|
color:#fff;
|
||
|
|
border-style:solid;
|
||
|
|
border-color:#fff;
|
||
|
|
}
|
||
|
|
|
||
|
|
#header {
|
||
|
|
height:25px;
|
||
|
|
padding-top:25px;
|
||
|
|
font-size:20px;
|
||
|
|
border-width:0 2px 2px 2px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#tools {
|
||
|
|
height:20px;
|
||
|
|
border-width:0 2px 2px 2px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#content {
|
||
|
|
height:350px;
|
||
|
|
border-width:0 2px 2px 2px;
|
||
|
|
overflow:hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
#footer {
|
||
|
|
text-align:center;
|
||
|
|
font-size:11px;
|
||
|
|
border-width:0 2px 2px 2px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.inl {
|
||
|
|
font-size:12px;
|
||
|
|
display:inline;
|
||
|
|
border-width:0;
|
||
|
|
}
|
||
|
|
|
||
|
|
#t {
|
||
|
|
position:absolute;
|
||
|
|
top:-100px;
|
||
|
|
left:-100px;
|
||
|
|
width:50px;
|
||
|
|
height:50px;
|
||
|
|
visibility:hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
#tools a {
|
||
|
|
padding:0;
|
||
|
|
border-width:1px;
|
||
|
|
float:left;
|
||
|
|
width:18px;
|
||
|
|
height:18px;
|
||
|
|
margin-right:5px;
|
||
|
|
background-repeat:no-repeat;
|
||
|
|
}
|
||
|
|
|
||
|
|
#b {
|
||
|
|
background-image:url('img/bold.png');
|
||
|
|
}
|
||
|
|
#i {
|
||
|
|
background-image:url('img/italic.png');
|
||
|
|
}
|
||
|
|
#u {
|
||
|
|
background-image:url('img/underline.png');
|
||
|
|
}
|
||
|
|
|
||
|
|
#tools a:link,#tools a:visited,a.almtd:link,#tools a.almtd:visited {
|
||
|
|
background-color:#000;
|
||
|
|
}
|
||
|
|
#tools a:hover {
|
||
|
|
background-color:#606060;
|
||
|
|
}
|
||
|
|
#tools a.almtd:hover {
|
||
|
|
background-color:#000;
|
||
|
|
}
|
||
|
|
|
||
|
|
#tools a.chot:link,#tools a.chot:visited,a.cho:link,#tools a.cho:visited {
|
||
|
|
background-color:#006600;
|
||
|
|
}
|
||
|
|
#tools a.chot:hover {
|
||
|
|
background-color:#006600;
|
||
|
|
}
|
||
|
|
#tools a.cho:hover {
|
||
|
|
background-color:#404040;
|
||
|
|
}
|
||
|
|
|
||
|
|
#content div {
|
||
|
|
padding:0;
|
||
|
|
border-width:0;
|
||
|
|
display:inline;
|
||
|
|
}
|
||
|
|
|
||
|
|
.b {
|
||
|
|
font-weight:bold;
|
||
|
|
}
|
||
|
|
.i {
|
||
|
|
font-style:italic;
|
||
|
|
}
|
||
|
|
.u {
|
||
|
|
text-decoration:underline;
|
||
|
|
}
|
||
|
|
|
||
|
|
.bi {
|
||
|
|
font-weight:bold;
|
||
|
|
font-style:italic;
|
||
|
|
}
|
||
|
|
|
||
|
|
.bu {
|
||
|
|
font-weight:bold;
|
||
|
|
text-decoration:underline;
|
||
|
|
}
|
||
|
|
|
||
|
|
.biu {
|
||
|
|
font-weight:bold;
|
||
|
|
font-style:italic;
|
||
|
|
text-decoration:underline;
|
||
|
|
}
|
||
|
|
|
||
|
|
.iu {
|
||
|
|
font-style:italic;
|
||
|
|
text-decoration:underline;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<script type='text/javascript'>
|
||
|
|
function wtd() {
|
||
|
|
t=document.getElementById("t")
|
||
|
|
t.focus()
|
||
|
|
c=document.getElementById("content")
|
||
|
|
ft=t.value
|
||
|
|
cin=c.innerHTML
|
||
|
|
if (c.className=="y") {
|
||
|
|
ft=ft+"</b>"
|
||
|
|
cin=cin.substr(0,cin.length-6)
|
||
|
|
}
|
||
|
|
|
||
|
|
c.innerHTML=cin+ft
|
||
|
|
t.value=""
|
||
|
|
a=setTimeout("wtd()",25)
|
||
|
|
}
|
||
|
|
|
||
|
|
function choit(pid) {
|
||
|
|
c=document.getElementById("content")
|
||
|
|
b=document.getElementById("b")
|
||
|
|
i=document.getElementById("i")
|
||
|
|
u=document.getElementById("u")
|
||
|
|
tid=document.getElementById(pid)
|
||
|
|
|
||
|
|
if (tid.className=="" || tid.className=="almtd") {
|
||
|
|
tid.className="chot"
|
||
|
|
tid.onmouseout=function () {
|
||
|
|
tid.className="cho"
|
||
|
|
tid.onmouseout=""
|
||
|
|
}
|
||
|
|
|
||
|
|
c.className="y"
|
||
|
|
}
|
||
|
|
else {
|
||
|
|
tid.className="almtd"
|
||
|
|
tid.onmouseout=function () {
|
||
|
|
tid.className=""
|
||
|
|
tid.onmouseout=""
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
if (b.className!="" && b.className!="almtd" && (i.className=="" || i.className=="almtd") && (u.className=="" || u.className=="almtd"))
|
||
|
|
fid="b"
|
||
|
|
else if (i.className!="" && i.className!="almtd" && (u.className=="" || u.className=="almtd") && (b.className=="" || b.className=="almtd"))
|
||
|
|
fid="i"
|
||
|
|
else if (u.className!="" && u.className!="almtd" && (b.className=="" || b.className=="almtd") && (i.className=="" || i.className=="almtd"))
|
||
|
|
fid="u"
|
||
|
|
else if (b.className!="" && b.className!="almtd" && i.className!="" && i.className!="almtd" && (u.className=="" || u.className=="almtd"))
|
||
|
|
fid="bi"
|
||
|
|
else if (b.className!="" && b.className!="almtd" && u.className!="" && u.className!="almtd" && (i.className=="" || i.className=="almtd"))
|
||
|
|
fid="bu"
|
||
|
|
else if (b.className!="" && b.className!="almtd" && i.className!="" && i.className!="almtd" && u.className!="" && u.className!="almtd")
|
||
|
|
fid="biu"
|
||
|
|
else if (i.className!="" && i.className!="almtd" && u.className!="" && u.className!="almtd" && (b.className=="" || b.className=="almtd"))
|
||
|
|
fid="iu"
|
||
|
|
else
|
||
|
|
fid=""
|
||
|
|
|
||
|
|
if (fid!="")
|
||
|
|
c.innerHTML=c.innerHTML+"<div class='"+fid+"'></div>"
|
||
|
|
else
|
||
|
|
c.className=""
|
||
|
|
}
|
||
|
|
|
||
|
|
window.onload=wtd
|
||
|
|
</script>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<textarea id='t'></textarea>
|
||
|
|
<div id='wrapper'>
|
||
|
|
<div id='header'>The RichTextDevice <div class='inl'>(press a key on your keyboard)</div</div>
|
||
|
|
<div id='tools'>
|
||
|
|
<a href='#' id='b' onclick='choit("b")'></a>
|
||
|
|
<a href='#' id='i' onclick='choit("i")'></a>
|
||
|
|
<a href='#' id='u' onclick='choit("u")'></a>
|
||
|
|
</div>
|
||
|
|
<div id='content'></div>
|
||
|
|
<div id='footer'>© nqpz 2008 - "And Now For Something Completely Different" (this)</div>
|
||
|
|
</div>
|
||
|
|
</body>
|
||
|
|
</html>
|