function changeMatrixCell(element) {
	var matrixZelle    = element.getAttribute('id');
	var matrixrow      = matrixZelle.substr(1,1);
	var matrixcol      = matrixZelle.substr(2,1);

	// left side
	if (matrixrow > 1 && matrixcol == 1) {
        for(i=2; i<9; i++) {
           if (document.getElementById('m' + i + '1').className != 'matrix_' + i + '1_sel')
               document.getElementById('m' + i + '1').className = 'matrix_' + i + '1_norm';
    	}
    	if (element.className != 'matrix_' + matrixrow + '1_sel')
    	   element.className = 'matrix_' + matrixrow + '1_omo';
	}

	// center matrix
	if (matrixrow > 1 && matrixcol > 1 && matrixcol < 7) {
    	for(i=2; i<9; i++) {
    	   for(j=2; j<7; j++) {
    	       if (i == matrixrow && j == matrixcol)
    	           document.getElementById('m' + i + j).className = 'matrix_omo';
    	       else if (i == matrixrow || j == matrixcol)
    	           document.getElementById('m' + i + j).className = 'matrix_cross';
    	       else
    	           document.getElementById('m' + i + j).className = 'matrix_norm';
    	   }
    	}
    }

    // top right
    if (matrixrow==1 && matrixcol>1 && matrixcol<7) {
		var found = 0;
		for(k=2; k<7; k++) {
			if (document.getElementById('m1' + k).className == 'matrix_1' + k + '_sel')	{
				found = 1;
			}
		}

		for(k=2; k<7; k++) {
			if (found == 0) {
				// colored if no selected node
		        if (document.getElementById('m1' + k).className != 'matrix_1' + k + '_sel')
		           document.getElementById('m1' + k).className = 'matrix_1' + k + '_start';
			} else {
				// b/w if a selected node
				if (document.getElementById('m1' + k).className != 'matrix_1' + k + '_sel')
		           document.getElementById('m1' + k).className = 'matrix_1' + k + '_norm';
			}
	    }
    	if (element.className != 'matrix_1' + matrixcol + '_sel')
    	   element.className = 'matrix_1' + matrixcol + '_omo';
    }

}

function resetMatrix() {
    if (document.getElementById('m11').className != 'matrix_11_sel' && document.getElementById('m11').className != 'matrix_17_sel')
        document.getElementById('m11').className = 'matrix_11_norm';

	var found = 0;
	for(k=2; k<7; k++) {
		if (document.getElementById('m1' + k).className == 'matrix_1' + k + '_sel')	{
			found = 1;
		}
	}

    for(k=2; k<7; k++) {
		if (found == 1) {
			// b/w if a selected node
			if (document.getElementById('m1' + k).className != 'matrix_1' + k + '_sel') {
	           document.getElementById('m1' + k).className = 'matrix_1' + k + '_norm';
			}
		} else {
			// colored if no selected node
	        if (document.getElementById('m1' + k).className != 'matrix_1' + k + '_sel') {
	           document.getElementById('m1' + k).className = 'matrix_1' + k + '_start';
			}
		}
    }
    for(i=2; i<9; i++) {
       if (document.getElementById('m' + i + '1').className != 'matrix_' + i + '1_sel')
          document.getElementById('m' + i + '1').className = 'matrix_' + i + '1_norm';
	   for(j=2; j<7; j++) {
	      document.getElementById('m' + i + j).className = 'matrix_norm';
	   }
	}
}

function completeResetMatrix(matrixZelle) {
	var matrixrow = 0;
	var matrixcol = 0;
    if (matrixZelle) {
		var matrixrow      = matrixZelle.substr(1,1);
		var matrixcol      = matrixZelle.substr(2,1);
	}

	document.getElementById('matrixtext17').style.display = 'none';
    for(i=1; i<9; i++) {
        for(j=1; j<7; j++) {
            document.getElementById('matrixtext' + i + j).style.display = 'none';
        }
    }
    document.getElementById('matrixselect').style.display = '';

    document.getElementById('m11').className = 'matrix_11_norm';
    var found = 0;
	for(k=2; k<7; k++) {
		if (document.getElementById('m1' + k).className == 'matrix_1' + k + '_sel') {
			found = 1;
		}
    }
	for(k=2; k<7; k++) {
		if (matrixrow == 1 && matrixcol > 1 && matrixcol < 7) {
			document.getElementById('m1' + k).className = 'matrix_1' + k + '_norm';
		} else {
			document.getElementById('m1' + k).className = 'matrix_1' + k + '_start';
		}
    }
    for(i=2; i<9; i++) {
       document.getElementById('m' + i + '1').className = 'matrix_' + i + '1_norm';
	   for(j=2; j<7; j++) {
	      document.getElementById('m' + i + j).className = 'matrix_norm';

	   }
	}

}

function showArticle(element) {
	var matrixZelle    = element.getAttribute('id');
    completeResetMatrix(matrixZelle);

    var matrixrow      = matrixZelle.substr(1,1);
	var matrixcol      = matrixZelle.substr(2,1);

	if (matrixrow>1 && matrixcol==1) {
	   document.getElementById('m' + matrixrow + '1').className = 'matrix_' + matrixrow + '1_sel';
	}
	if (matrixrow==1 && matrixcol>1) {
	   document.getElementById('m1' + matrixcol).className = 'matrix_1' + matrixcol + '_sel';
	}
	if (matrixrow>1 && matrixcol>1) {
	   document.getElementById('m1' + matrixcol).className = 'matrix_1' + matrixcol + '_sel';
	   document.getElementById('m' + matrixrow + '1').className = 'matrix_' + matrixrow + '1_sel';
	}
	if (matrixrow==1 && matrixcol==1) {
	   document.getElementById('m11').className = 'matrix_11_sel';
	}
	if (matrixrow==1 && matrixcol==7) {
	   document.getElementById('m11').className = 'matrix_17_sel';
	}

    document.getElementById('matrixselect').style.display = 'none';
    document.getElementById('matrixtext' + matrixrow + matrixcol).style.display = '';
}