First commit.
This commit is contained in:
Niels Serup
229
subsites/projects/x/richtext.htm
Normal file
229
subsites/projects/x/richtext.htm
Normal file
@@ -0,0 +1,229 @@
|
||||
<!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>
|
||||
Reference in New Issue
Block a user