<!doctype html>
<html>
<head>
<title>Concepts Regarding Workplaces - RJM Programming - May, 2019</title>
<style>
td, th { vertical-align: top; }
</style>
<script type='text/javascript'>

var conceptarr=["safe workplace;rights","respect;rights+ethical+responsibilities","information;rights","training;rights","leave entitlements;rights","discrimination;unethical","lack of discrimination;rights+ethical","bullying;unethical","harassment;unethical","honesty;ethical","support;ethical","lack of support to colleagues;unethical","disrespect;unethical","maintain rules;responsibilities","punctuality;responsibilities","reliability;responsibilities","behave well;responsibilities","dress appropriately;responsibilities","follow code of conduct;responsibilities","speak up when needed;responsibilities","join union;rights","tolerance;ethical","fairness;ethical","document incidents;ethical","report incidents;ethical"];
var score=0, goes=0;
var choice=-1;
var sofar=";-1;";
var cnt=0, hrcnt=0;
var cangoin="";
var trtemp="";
var onetonameid="trtemplate";
var evenrows=location.search.split('mode=')[1] ? decodeURIComponent(location.search.split('mode=')[1].split('&')[0]) : '1';

function check(obtn) {
var iths=0, ths="rights,responsibilities,ethical,unethical";
goes++;
//alert(cangoin + ' ... ' + obtn.id.replace('b',''));
if (cangoin.indexOf('+' + obtn.id.replace('b','') + '+') != -1) {
score++;
for (iths=0; iths<ths.split(',').length; iths++) {
if (obtn.id.replace('b','') == ths.split(',')[iths]) {
document.getElementById(obtn.id.replace('b','')).innerHTML+='+ ' + document.getElementById('wci').value + '<br>';
} else if (eval('' + evenrows) == 1) {
document.getElementById(ths.split(',')[iths]).innerHTML+=' <br>';
}
}
cangoin=cangoin.replace('+' + obtn.id.replace('b','') + '+', '+');
//alert(cangoin);
} else {
score--;
}
document.getElementById('score').innerHTML='Score: ' + score + '/' + goes;
}

function pickone() {
var thist=0, thisb=0, ltop=-1, lbot=-1, jj, iths=0, ths="rights,responsibilities,ethical,unethical", hrrect, jp=0;
//if (cnt > 0) { alert('cangoin=' + cangoin); }
if (cnt > 0 && cangoin.replace(/\+/g,'') != '') {
while (cangoin.replace(/\+/g,'') != '') {
//alert('yes re ' + cangoin.substring(1).split('+')[0]);
for (iths=0; iths<ths.split(',').length; iths++) {
if (cangoin.substring(1).split('+')[0] == ths.split(',')[iths]) {
document.getElementById(cangoin.substring(1).split('+')[0]).innerHTML+='<font size=1 color=red>- ' + document.getElementById('wci').value + '</font><br>';
} else if (eval('' + evenrows) == 1) {
document.getElementById(ths.split(',')[iths]).innerHTML+='<font size=1 color=red> </font><br>';
}
}
cangoin=cangoin.replace('+' + cangoin.substring(1).split('+')[0] + '+', '+');
}
}
if (cnt > 0) {
if (eval('' + evenrows) == 4) {
document.getElementById('hrdiv').innerHTML+='<hr id=hr' + hrcnt + '><br>';
hrcnt++;
document.getElementById('hrdiv').innerHTML+='<hr id=hr' + hrcnt + '><br>';
hrcnt++;
document.getElementById('hrdiv').innerHTML+='<hr id=hr' + hrcnt + '><br>';
hrcnt++;
document.getElementById('hrdiv').innerHTML+='<hr id=hr' + hrcnt + '><br>';
hrcnt++;
} else if (eval('' + evenrows) >= 0) {
document.getElementById('rights').innerHTML+='<hr id=hr' + hrcnt + '><br>';
hrcnt++;
document.getElementById('responsibilities').innerHTML+='<hr id=hr' + hrcnt + '><br>';
hrcnt++;
document.getElementById('ethical').innerHTML+='<hr id=hr' + hrcnt + '><br>';
hrcnt++;
document.getElementById('unethical').innerHTML+='<hr id=hr' + hrcnt + '><br>';
hrcnt++;
}
if (eval('' + evenrows) >= 2) {
for (jj=eval(-4 + eval('' + hrcnt)); jj<=eval(-1 + eval('' + hrcnt)); jj++) {
if (eval('' + evenrows) >= 4) {
hrrect=document.getElementById(ths.split(',')[jp]).getBoundingClientRect();
document.getElementById('hr' + jj).style.position='absolute';
//document.getElementById('hr' + jj).style.zIndex='9';
document.getElementById('hr' + jj).style.left=('' + hrrect.left).replace('px','').split('.')[0] + 'px';
if (eval('' + evenrows) == 5) {
document.getElementById('hr' + jj).style.width=('' + hrrect.width).replace('px','').split('.')[0] + 'px';
document.getElementById('hr' + jj).style.opacity='0.2';
document.getElementById('hr' + jj).style.zIndex='-1';
document.getElementById('hr' + jj).style.marginTop='-25px';
}
} else {
hrrect=document.getElementById('hr' + jj).getBoundingClientRect();
}
thist=eval(('' + hrrect.top).replace('px',''));
thisb=eval(eval('' + thist) + eval(('' + hrrect.height).replace('px','')));
if (ltop < 0 || thist > ltop) { ltop=thist; }
if (lbot < 0 || thisb > lbot) { lbot=thist; }
jp++;
}
for (jj=eval(-4 + eval('' + hrcnt)); jj<=eval(-1 + eval('' + hrcnt)); jj++) {
if (eval('' + evenrows) >= 4) {
document.getElementById('hr' + jj).style.top=('' + thisb).replace('px','').split('.')[0] + 'px';
//alert(document.getElementById('hr' + jj).outerHTML);
} else {
hrrect=document.getElementById('hr' + jj).getBoundingClientRect();
thist=eval(('' + hrrect.top).replace('px',''));
if (eval('' + evenrows) == 2) {
document.getElementById('hr' + jj).style.marginTop='' + eval(eval('' + ltop) - eval('' + thist)) + 'px';
} else {
document.getElementById('hr' + jj).style.paddingTop='' + eval(eval('' + ltop) - eval('' + thist)) + 'px';
document.getElementById('hr' + jj).style.backgroundColor='lightgreen';
document.getElementById('hr' + jj).style.borderColor='lightgreen';
}
}
}
}
}
cangoin="";
if (cnt >= conceptarr.length) { alert('Ready for another game?'); location.href=document.URL; }
if (eval('' + evenrows) < 0 && cnt > 0) {
document.getElementById(onetonameid).innerHTML=document.getElementById(onetonameid).innerHTML.replace(/\ id\=/g, ' data-id=').replace(/pink\;/g, 'pink;visibility:hidden;');
document.getElementById('mytbody').innerHTML+=trtemp.replace('trtemplate', 'trtemplate' + cnt);
onetonameid='trtemplate' + cnt;
}
choice=-1;
while (sofar.indexOf(';' + choice + ';') != -1) {
choice=Math.floor(Math.random() * conceptarr.length);
}
sofar+='' + choice + ';';
cnt++;
document.getElementById('wci').value=conceptarr[choice].split(';')[0];
cangoin='+' + conceptarr[choice].split(';')[1] + '+';
}

</script>
</head>
<body onload=" document.getElementById('selmode').value=evenrows; trtemp=document.getElementById('trtemplate').outerHTML; setTimeout(pickone,5000);">
<h1>Concepts Regarding Workplaces</h1>
<h2>Via <select style='display: inline-block;' onchange=" location.href=document.URL.split('?')[0].split('#')[0] + '?mode=' + this.value; " id=selmode><option value=-1>New Table Row</option><option value=1>Blank Lines before Horizontal Rules across All Columns</option><option value=0>Ragged Horizontal Rules can Happen</option><option value=2>Margin Top to Horizontal Rules</option><option value=3>Light Green Padding Top to Horizontal Rules</option><option value=4>Absolutely Positioning Invisible Horizontal Rules</option><option value=5>Absolutely Positioning Visible Horizontal Rules</option></select></h2>
<h3>RJM Programming - May, 2019</h3>
<h4 id=score>Score: 0/0</h4>

<p>Workplace Concept: <input style="width:60%;" placeholder="Click places where what gets placed here, fits." id="wci" type="text"></input><br><br>

<table style="width:100%;" border=20>
<tr><th>Rights</th><th>Responsibilities</th><th>Ethical</th><th>Unethical</th></tr>
<tr><th colspan=4><input style="width:96%;background-color:yellow;" type=button onclick="pickone();" value="Next please"></input></th></tr>
<tr id=trtemplate><td id=rights><input style="margin-left:7%;width:86%;background-color:pink;" onclick="check(this);" type=button id=brights value="Can go below ..."></input><br><br></td><td id=responsibilities><input style="margin-left:7%;width:86%;background-color:pink;" onclick="check(this);" type=button id=bresponsibilities value="Can go below ..."></input><br><br></td><td id=ethical><input style="margin-left:7%;width:86%;background-color:pink;" onclick="check(this);" type=button id=bethical value="Can go below ..."></input><br><br></td><td id=unethical><input style="margin-left:7%;width:86%;background-color:pink;" onclick="check(this);" type=button id=bunethical value="Can go below ..."></input><br><br></td></tr>
<tbody id=mytbody>
</tbody>
</table>
<div id=hrdiv></div>
</body>
</html>