Post by Peter on Jul 20, 2005 9:02:48 GMT -8
What this code does is give the code tag line numbers, which can be toggled on or off by clicking on the "Code:" link, this is so that users are able to copy the code without copying the lines numbers. Also, if you click on a line of code, it will hide or show it, which could be very helpful for people learning to code, they could hide blocks of code to see the code more clearly. To aid in showing the line of code again, just hover your mouse over the row, and it will show you what is there.
Code goes into your global footers.
<script type="text/javascript">
<!--
// Created by PopThosePringles
function buildLines(codeArray, fnum){
var cFragment = document.createDocumentFragment();
for(t = 0; t < codeArray.length; t ++){
var nRow = document.createElement("tr");
var nCell = document.createElement("td");
var nCellB = document.createElement("td");
nCell.className = "code";
nCell.width = "1";
nCell.vAlign = "top";
nCell.id = "line:" + fnum + "|" + t;
nCell.title = "Line number: " + (t + 1);
nCell.appendChild(document.createTextNode(t + 1 + ": "));
nRow.appendChild(nCell);
nCellB.className = "code";
nCellB.height = "18";
nCellB.vAlign = "top";
nCellB.onclick = function(){
if(this.firstChild.style.display == "none"){
this.firstChild.style.display = "";
} else {
this.firstChild.style.display = "none";
}
}
nCellB.onmouseover = function(){
if(this.firstChild && this.firstChild.firstChild){
this.title = this.firstChild.firstChild.data.replace(/^\s+/, "");
}
}
nCellB.innerHTML = "<span>" + codeArray[t] + "</span>";
nRow.appendChild(nCellB);
cFragment.appendChild(nRow);
}
return cFragment;
}
function doLineCells(obj){
if(obj){
var curCBlock = obj.id.split("cl")[1];
var codeTab = document.getElementById("codetable" + curCBlock);
for(l = 0; l < codeTab.rows.length; l ++){
if(codeTab.rows.item(l).cells.item(0).id == "line:" + curCBlock + "|" + l){
if(codeTab.rows.item(l).cells.item(0).style.display == "none"){
codeTab.rows.item(l).cells.item(0).style.display = "";
obj.title = obj.title.replace(/show/, "hide");
} else {
codeTab.rows.item(l).cells.item(0).style.display = "none";
obj.title = obj.title.replace(/hide/, "show");
}
}
}
}
}
function getBlockContents(){
var iCount = 1;
var iFont = document.getElementsByTagName("font");
for(f = 0; f < iFont.length; f ++){
if(iFont.item(f).size == "2" && iFont.item(f).getElementsByTagName("blockquote").length > 0){
var iBlock = iFont.item(f).getElementsByTagName("blockquote");
for(b = 0; b < iBlock.length; b ++){
if(iBlock.item(b).getElementsByTagName("font").item(0).className == "code"){
var curCont = iBlock.item(b).getElementsByTagName("font").item(0);
var newCode = buildLines(curCont.innerHTML.split(/<br>/i), iCount);
var parTab = curCont.parentNode.parentNode.parentNode;
var cLink = document.createElement("a");
cLink.href = "#";
cLink.title = "Click to hide line numbers";
cLink.appendChild(iBlock.item(b).firstChild.cloneNode(true));
cLink.id = "cl" + iCount;
cLink.onclick = function(){
doLineCells(this);
return false;
}
parTab.id = "codetable" + iCount;
iBlock.item(b).replaceChild(cLink, iBlock.item(b).firstChild);
parTab.replaceChild(newCode, parTab.lastChild);
iCount ++;
}
}
}
}
}
var iLoc1 = /action=(display|recent|search2|(pm|calendar)view)/i;
var iLoc2 = /index\.cgi$/i;
if(location.href.match(iLoc1) || (location.href.match(iLoc2) && document.postForm)){
getBlockContents();
}
//-->
</script>
IE & FF
Code goes into your global footers.
<script type="text/javascript">
<!--
// Created by PopThosePringles
function buildLines(codeArray, fnum){
var cFragment = document.createDocumentFragment();
for(t = 0; t < codeArray.length; t ++){
var nRow = document.createElement("tr");
var nCell = document.createElement("td");
var nCellB = document.createElement("td");
nCell.className = "code";
nCell.width = "1";
nCell.vAlign = "top";
nCell.id = "line:" + fnum + "|" + t;
nCell.title = "Line number: " + (t + 1);
nCell.appendChild(document.createTextNode(t + 1 + ": "));
nRow.appendChild(nCell);
nCellB.className = "code";
nCellB.height = "18";
nCellB.vAlign = "top";
nCellB.onclick = function(){
if(this.firstChild.style.display == "none"){
this.firstChild.style.display = "";
} else {
this.firstChild.style.display = "none";
}
}
nCellB.onmouseover = function(){
if(this.firstChild && this.firstChild.firstChild){
this.title = this.firstChild.firstChild.data.replace(/^\s+/, "");
}
}
nCellB.innerHTML = "<span>" + codeArray[t] + "</span>";
nRow.appendChild(nCellB);
cFragment.appendChild(nRow);
}
return cFragment;
}
function doLineCells(obj){
if(obj){
var curCBlock = obj.id.split("cl")[1];
var codeTab = document.getElementById("codetable" + curCBlock);
for(l = 0; l < codeTab.rows.length; l ++){
if(codeTab.rows.item(l).cells.item(0).id == "line:" + curCBlock + "|" + l){
if(codeTab.rows.item(l).cells.item(0).style.display == "none"){
codeTab.rows.item(l).cells.item(0).style.display = "";
obj.title = obj.title.replace(/show/, "hide");
} else {
codeTab.rows.item(l).cells.item(0).style.display = "none";
obj.title = obj.title.replace(/hide/, "show");
}
}
}
}
}
function getBlockContents(){
var iCount = 1;
var iFont = document.getElementsByTagName("font");
for(f = 0; f < iFont.length; f ++){
if(iFont.item(f).size == "2" && iFont.item(f).getElementsByTagName("blockquote").length > 0){
var iBlock = iFont.item(f).getElementsByTagName("blockquote");
for(b = 0; b < iBlock.length; b ++){
if(iBlock.item(b).getElementsByTagName("font").item(0).className == "code"){
var curCont = iBlock.item(b).getElementsByTagName("font").item(0);
var newCode = buildLines(curCont.innerHTML.split(/<br>/i), iCount);
var parTab = curCont.parentNode.parentNode.parentNode;
var cLink = document.createElement("a");
cLink.href = "#";
cLink.title = "Click to hide line numbers";
cLink.appendChild(iBlock.item(b).firstChild.cloneNode(true));
cLink.id = "cl" + iCount;
cLink.onclick = function(){
doLineCells(this);
return false;
}
parTab.id = "codetable" + iCount;
iBlock.item(b).replaceChild(cLink, iBlock.item(b).firstChild);
parTab.replaceChild(newCode, parTab.lastChild);
iCount ++;
}
}
}
}
}
var iLoc1 = /action=(display|recent|search2|(pm|calendar)view)/i;
var iLoc2 = /index\.cgi$/i;
if(location.href.match(iLoc1) || (location.href.match(iLoc2) && document.postForm)){
getBlockContents();
}
//-->
</script>
IE & FF