Mini Tutorial

<script type="text/javascript" >
<!--

var sTags = "";

function escapeHtml(s) {
    //alert('HTML: ' + s);
    if (s != undefined) {
        s = s.replace(/&/g, "&amp;");
        s = s.replace(/</g, "&lt;");
        s = s.replace(/>/g, "&gt;");
        s = s.replace(/"/g, "&quot;");
        s = s.replace(/'/g, "&#39;");
        return s;
    }
}

function escapeJs(s) {
    //alert('JS: ' + s);
    if (s != undefined) {
        s = s.replace(/\'/g, "\\'");
        s = s.replace(/\"/g, '&quot;');

        return s;
    }
}

var strSourceText = 'Bob\nCarol\nTed\nAlice\nFred\'s\nWilma\nBarney\n\"Betty\"\nBill \& Ben\nCuthbert\nDibble\nGrub\nRen\nStimpy';
var strVarTableCols = 5;
var strVarTableAttrs = 'border=\"0\" cellspacing=\"0\" cellpadding=\"2\" width=\"100%\"';
var strVarCellFormat = '<a href=\"#\" onClick=\"alert(\'{{TEXT_JS}}\'); return false;\">{{TEXT_ORIG}}</a>';
var blnAddSeparators = true;
var blnBeautifyTags = true;

function makeTable(strSourceText, strVarTableCols, strVarTableAttrs, strVarCellFormat, blnAddSeparators, blnBeautifyTags) {
    // blnAddSeparators:- add separator columns
    // blnBeautifyTags:- tidy source code

    //alert('source = ' + strSourceText);
    //alert('Attribs:: ' + strVarTableAttrs);
    //alert('Cell contents:: ' + strVarCellFormat);

    // create an array that will hold the source text
    var nLinesCount = 0;
    var nCols = 0, //blnAddSeparators = 0, blnBeautifyTags = 0;
    // split the source text into separate lines
    aLines = strSourceText.split('\n');
    // count the number of lines (array size)
    nLinesCount = aLines.length;
    //alert('Input lines = ' + aLines.length);
    // check/coerce following vars to numbers
    nCols = parseInt(strVarTableCols); // number of columns
   
    // if #Columns AND #SourceLines are > 0
    if( (nCols > 0) && (nLinesCount > 0) ) {
        // declare working vars
        var sOutput = "", strCell = "", sIndentTD = "", sTags = "";
        var nRows = 0, c = 0, r = 0, i = 0;
        // if #SourceLInes is > or = to #Columns
        if(nLinesCount >= nCols) {
            // #Rows = #SourceLInes/#Columns
            nRows = Math.ceil(nLinesCount / nCols);
            // while (#Rows x #Columns) is < #SourceLInes
            while(nRows*nCols < nLinesCount) {
                // increment #Rows by 1
                ++nRows;
            }
        } else {
            // otherwise #Rows is 1
            nRows = 1;
        }
        // begin: construct the tags
        sIndentTD = (blnBeautifyTags?" ":"");
        // iterate rows from zero to (#Rows -1) step size = 1
        for(r=0; r<nRows; r++) {
            // start the row tags, source return if tidying
            sTags += "<tr>"+(blnBeautifyTags?"\n":"");
            // iterate columns from zero to (#Columns -1) step size = 1
            for(c=0; c<nCols; c++) {
                // counter 'i' = #Rows x #Columns plus current row #
                i = (nRows*c)+r;
                // if tidying source
                if(blnBeautifyTags) {
                    // if not the row and showing serial numbers or
                    // column sepatators
                    if( (blnAddSeparators) && (c>0) ) {
                        // append: source newline
                        sTags += "\n";
                    }
                }
                // if current line# is < total line #
                if(i < nLinesCount) {
                    // start with the cell contents, looking for {{TEXT}} wrappers
                    strCell = strVarCellFormat;
                    //alert('Cell contents = ' + strVarCellFormat);
                    // escape cell source for HTML if {{TEXT}} found
                    strCell = strCell.replace(/\{\{TEXT\}\}/g, escapeHtml(aLines[i]));
                    // just repeat cell source verbatim where {{TEXT}} found
                    strCell = strCell.replace(/\{\{TEXT_ORIG\}\}/g, aLines[i]);
                    // escape cell source for JS if {{TEXT_JS}} found
                    strCell = strCell.replace(/\{\{TEXT_JS\}\}/g, escapeJs(aLines[i]));
                    //alert('i = ' + i + ', Row = ' + r + ', Column = ' + c + ', Contents = ' + strCell);
                    //
                    sTags += sIndentTD+"<td>"+ strCell +"</td>"+(blnBeautifyTags?"\n":"");
                    //
                    if(blnAddSeparators) {
                        //
                        if(c<nCols-1) {
                            //
                            sTags += sIndentTD+"<td>&nbsp;</td>"+(blnBeautifyTags?"\n":"");
                        }
                    }
                } else {
                    //
                    sTags += sIndentTD+"<td>&nbsp;</td>"+(blnBeautifyTags?"\n":"");
                }
            }
            //
            sTags += "</tr>\n";
        }
        // output string HTML comment with number of items
        sOutput = "<!-- " + nLinesCount.toString() + " item table -->\n";
        // add: open table tag
        sOutput += "<table";
        // any table attributes to add?
        if(strVarTableAttrs.length) {
            // add: attributes
            sOutput += " "+strVarTableAttrs;
        }
        // add: close tag and whitespace new line
        sOutput += ">\n";
        // add: table data
        sOutput += sTags;
        // add: close tag and
        sOutput += "</table>\n";
        // end construct the tags
        // now return the output
        //alert (sOutput);
        return sOutput;
    }
}

// -->
</script>

<script type="text/javascript">
<!--

strResult = makeTable(strSourceText, strVarTableCols,
    strVarTableAttrs, strVarCellFormat, blnAddSeparators,
    blnBeautifyTags);

document.write(strResult);

//alert('done!');
// -->
</script>