Name your fiddle

Description

by dvjc

HTML

<table>
    <thead>
        <tr>
            <th>Event</th>
            <th>State</th>
        </tr>
    </thead>
    <tbody>
    <tr><td id="initLabel"></td><td id="initValue"></td></tr>
    <tr><td id="test1Label"></td><td id="test1Value"></td></tr>
    </tbody>
</table>
<div id="blue"></div>
<div id="blue2"></div>

CSS

th {
    width: 150px;
}

body {text-align:center;}

JavaScript

var bd = "";
        var board = {
          size: function( bd ){ 
            var bdl = bd.length;
            var bdrt = Math.floor( Math.pow(bdl,0.5) );
            var sz = (bdl == Math.pow(bdrt,2)) ? bdrt : 0;
            return sz;
          },
          getNthRow: function( r,bd ){
              var z = this.size(bd);
              return bd.substr( (r-1)*z, z );
          },
          getPreRw1: function( r,bd ){ var z = this.size(bd); return (r>1) ? bd.substr( 0, (r-1) * z ): ""; },
          getPstRw2: function( r,bd ){ var z = this.size(bd); return (r<z) ? bd.substr( r * z ) : ""; },
          getMidRwz: function( a,b,bd ){ 
            var z = this.size(bd);
            var s = this.ordered( { rw1:a, rw2:b } ); 
            var i = (Number(s.rw1) * z);
            var d = (s.rw2-s.rw1 > 1 ? s.rw2-s.rw1-1 : 0);
            var p = ( d==0 || s.rw2>Number(z) || s.rw1<1 ) ? "" : bd.substr( i, d*Number(z) );
            return p;
          },
          ordered: function( rowz ){
            if ( rowz.rw2 < rowz.rw1 ){
              var r12 = rowz.rw1;
              rowz.rw1 = rowz.rw2;
              rowz.rw2 = r12;
              r12 = undefined;
            }
            return rowz;
          },
          toggledRow: function( a,b,bd ){
            var result = bd;

            if( a == b){
              return result;
            }

            var rp = this.ordered( { rw1:a, rw2:b } );

            var row1 = this.getNthRow(rp.rw1,bd);
            var row2 = this.getNthRow(rp.rw2,bd);

            var preRow1 = this.getPreRw1(rp.rw1,bd);
            var midRowz = this.getMidRwz(rp.rw1,rp.rw2,bd);
            var pstRow2 = this.getPstRw2(rp.rw2,bd);
            result = preRow1 + row2 + midRowz + row1 + pstRow2;
            return result;
          },
          transpose: function( bd ){
            var updatd = "";
            var z = this.size(bd);

            for( var x=0; x<z; x++ ){
              for( var y=0; y<z; y++ ){
                updatd +=...