<!doctype html>
<html>
<head>
<title>Dynamic Pollster - RJM Programming - January, 2016</title>
<link href='//www.rjmprogramming.com.au/PHP/emboss_h1.css' rel='stylesheet' type='text/css'>
<script type='text/javascript'>
var myso=null;
var mysubj=null;
var myn=null;
var myd=null;
var myselect=null;
function usethis(tv) {
if (tv != '') {
var nplus=tv.split('~');
myn.value=nplus[0];
mysubj.value=nplus[1];
myselect.value='';
mysubj.focus();
}
}
function update(tv, mode) {
if (myso == null) myso = document.getElementById('mysubmit');
if (mysubj == null) mysubj = document.getElementById('thiss');
if (myn == null) myn = document.getElementById('thisn');
if (myd == null) myd = document.getElementById('data');
if (myselect == null) myselect = document.getElementById('myselect');
if (mode == 1) {
document.getElementById('subject').innerHTML = tv;
} else if (mode == 2) {
document.getElementById('nf').innerHTML = tv;
} else if (mode == 4 && mysubj.value != '') {
//document.getElementById('myiframe').src = 'histogram_chart.php';
if (myd.value == '') document.getElementById('myiframe').style.display = 'block';
var mysv = myn.value + '~' + mysubj.value.replace(/,/g, '`');
if (myselect.innerHTML == '') {
myselect.innerHTML = "<option value=''>Optionally choose from helper values below ...</option>";
myselect.style.display = 'inline';
}
if (myselect.innerHTML.indexOf(mysv) == -1) myselect.innerHTML += "<option value='" + mysv + "'>" + mysubj.value.replace(/,/g, '`') + " (" + myn.value + ")</option>";
myd.value += ',[~' + mysubj.value.replace(/,/g, '`') + '~,' + myn.value + ']';
myn.value = '0';
mysubj.value = '';
myso.click();
myn.focus();
} else if (mode == 3) {
mysubj.focus();
} else if (mode != 4) {
myn.focus();
}
}
function clearone() {
document.getElementById('thiss').value = document.getElementById('thiss').value.replace('(tabbing out shows histogram below)','');
}
</script>
</head>
<body style='background-color: lightgray;' onload=" setTimeout(clearone, 1500); document.getElementById('thisn').focus(); ">
<h1 align='center'>Dynamic Pollster</h1>
<h4 align='center'>RJM Programming - January, 2016</h4>
<form target='myiframe' action='histogram_chart.php' method='POST' style='position: absolute; top: 40px; left: 0px; z-index: 5;'>
Poll/Histogram Title: <input style='width: 200px; background-color: silver;' type='text' name='title' value='Lengths of dinosaurs, in meters'></input><br>
<hr>
<input type='hidden' name='onclick' value='y'></input>
<input type='hidden' name='r' value='last'></input>
<input type='hidden' name='c' value='1'></input>
<br>
<table cellpadding=8 cellspacing=8>
<tr>
<td>
Numerical field: <input style='background-color: yellow;' type='text' name='desc' value='Length' onblur=' update(this.value, 2); '></input><br>
</td>
<td style='background-color: white; border: 2px solid red;'>
This <span id='nf'>Length</span>: <input style='background-color: pink;' type='number' id='thisn' value='0' onblur=' update(this.value, 3); '></input><br>
</td></tr>
<tr>
<td>
Subject: <input style='width: 250px; background-color: yellow;' type='text' name='task' value='Dinosaur' onblur=' update(this.value, 1); '></input> <select style='display:none;' id='myselect' onchange='usethis(this.value);'></select><br>
</td>
<td style='background-color: white; border: 2px solid red;'>
This <span id='subject'>Dinosaur</span>: <input style='width: 250px; background-color: pink;' type='text' id='thiss' value='(tabbing out shows histogram below)' onblur=' update(this.value, 4); '></input><br>
</td></tr></table>
<!--input type='hidden' name='data' value=',[%27Acrocanthosaurus%20%28top-spined%20lizard%29%27,%2012.2],[%27Albertosaurus%20%28Alberta%20lizard%29%27,%209.1],[%27Allosaurus%20%28other%20lizard%29%27,%2012.2],[%27Apatosaurus%20%28deceptive%20lizard%29%27,%2022.9],[%27Archaeopteryx%20%28ancient%20wing%29%27,%200.9],[%27Argentinosaurus%20%28Argentina%20lizard%29%27,%2036.6],[%27Baryonyx%20%28heavy%20claws%29%27,%209.1],[%27Brachiosaurus%20%28arm%20lizard%29%27,%2030.5],[%27Ceratosaurus%20%28horned%20lizard%29%27,%206.1],[%27Coelophysis%20%28hollow%20form%29%27,%202.7],[%27Compsognathus%20%28elegant%20jaw%29%27,%200.9],[%27Deinonychus%20%28terrible%20claw%29%27,%202.7],[%27Diplodocus%20%28double%20beam%29%27,%2027.1],[%27Dromicelomimus%20%28emu%20mimic%29%27,%203.4],[%27Gallimimus%20%28fowl%20mimic%29%27,%205.5],[%27Mamenchisaurus%20%28Mamenchi%20lizard%29%27,%2021.0],[%27Megalosaurus%20%28big%20lizard%29%27,%207.9],[%27Microvenator%20%28small%20hunter%29%27,%201.2],[%27Ornithomimus%20%28bird%20mimic%29%27,%204.6],[%27Oviraptor%20%28egg%20robber%29%27,%201.5],[%27Plateosaurus%20%28flat%20lizard%29%27,%207.9],[%27Sauronithoides%20%28narrow-clawed%20lizard%29%27,%202.0],[%27Seismosaurus%20%28tremor%20lizard%29%27,%2045.7],[%27Spinosaurus%20%28spiny%20lizard%29%27,12.2],[%27Supersaurus%20%28super%20lizard%29%27,30.5],[%27Tyrannosaurus%20%28tyrant%20lizard%29%27,15.2],[%27Ultrasaurus%20%28ultra%20lizard%29%27,30.5],[%27Velociraptor%20%28swift%20robber%29%27,1.8]'></input-->
<input type='hidden' id='data' name='data' value=''></input>
<input style='display:none;' id='mysubmit' type='submit' value='Histogram'></input>
</form>
<br><br>
<br><br>
<div style=' background-color: lightgreen; '>
<table cellpadding=8 cellspacing=8><tr><td><iframe onload=' update("", 0); ' id='myiframe' name='myiframe' src='javascript:none;' style='display:none;' width=900 height=600></iframe></td><td id='blurb' style='background-color: lightblue;'></td></tr></table>
</div>
</body>
</html>