<!doctype html>
<html>
<head data-live-domain="api.jquery.com">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

<meta name="author" content="jQuery Foundation - jquery.org">
<meta name="description" content="jQuery: The Write Less, Do More, JavaScript Library">

<meta name="viewport" content="width=device-width">

<link rel="shortcut icon" href="http://api.jquery.com/jquery-wp-content/themes/api.jquery.com/i/favicon.ico">

<link rel="stylesheet" href="http://api.jquery.com/jquery-wp-content/themes/jquery/css/base.css?v=1">
<link rel="stylesheet" href="http://api.jquery.com/jquery-wp-content/themes/api.jquery.com/style.css">
<link rel="pingback" href="http://api.jquery.com/xmlrpc.php" />


<script src="http://api.jquery.com/jquery-wp-content/themes/jquery/js/modernizr.custom.2.6.2.min.js"></script>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>window.jQuery || document.write(unescape('%3Cscript src="http://api.jquery.com/jquery-wp-content/themes/jquery/js/jquery-1.9.1.min.js"%3E%3C/script%3E'))</script>

<script src="http://api.jquery.com/jquery-wp-content/themes/jquery/js/plugins.js"></script>
<script src="http://api.jquery.com/jquery-wp-content/themes/jquery/js/main.js"></script>

<script src="//use.typekit.net/wde1aof.js"></script>
<script>try{Typekit.load();}catch(e){}</script>

<script type='text/javascript' src='http://api.jquery.com/wp-includes/js/comment-reply.min.js?ver=3.8'></script>
<link href='//www.rjmprogramming.com.au/PHP/emboss_h1.css' rel='stylesheet' type='text/css'>
<title>Amphibian Common Name Image and Video Lookup - RJM Programming - December, 2016</title>
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=0.1, maximum-scale=8, user-scalable=yes" >
<style>
body {
background-color: aqua;
padding-top: 20px;
background: -webkit-linear-gradient(center top , lightblue, lightgreen) repeat scroll 0% 0% transparent;
background: -o-linear-gradient(center top , lightblue, lightgreen) repeat scroll 0% 0% transparent;
background: -moz-linear-gradient(center top , lightblue, lightgreen) repeat scroll 0% 0% transparent;
background: linear-gradient(180deg, lightblue, lightgreen); /* linear-gradient(center top , rgb(255, 255, 0), rgb(0, 255, 255)) repeat scroll 0% 0% transparent */
}
</style>
<script type='text/javascript'>

var relative_to="https://www.stlzoo.org/animals/abouttheanimals/amphibians/listallamphibians/";
var relativeto="https://www.stlzoo.org/";
var option_list=[];
var insert_words_list=[];
var iwo=null, iwgo=null;
var okn='';

function getcommonnamelist() {
var dp="http://www.rjmprogramming.com.au/HTMLCSS/";
//dp="http://localhost:8888/";

$.ajax({ url: dp + "legend_via_map.php",
data: {"url": "amphibianlist.php"},
type: 'get',
success: function(output) {
// alert(output);
// <li class=""><a href="/animals/abouttheanimals/amphibians/frogsandtoads/americanbullfrog/" target="_self" class="">American Bullfrog</a></li>
var ok=false, selc="", subl="", ourlilist=output.split('<li class=""><a href="');
//alert(ourlilist.length);
for (var ihuh=1; ihuh<ourlilist.length; ihuh++) {
subl=ourlilist[ihuh].split('</a></li>')[0].split('>')[eval(-1 + ourlilist[ihuh].split('</a></li>')[0].split('>').length)].trim().replace('(','').replace(')','');
if (subl == 'American Bullfrog') ok=true;
if (ok && subl.trim().replace('About','') != '') {
insert_words_list.push(subl);
if (ourlilist[ihuh].split('"')[0].indexOf('..') == 0) {
option_list.push('<option value="' + subl + ';' + relative_to + ourlilist[ihuh].split('"')[0] + '">' + subl + '</option>');
} else if (ourlilist[ihuh].split('"')[0].indexOf('/') == 0) {
option_list.push('<option value="' + subl + ';' + relativeto + ourlilist[ihuh].split('"')[0].substring(1) + '">' + subl + '</option>');
} else {
option_list.push('<option value="' + subl + ';' + ourlilist[ihuh].split('"')[0] + '">' + subl + '</option>');
}
}
}
insert_words_list.sort();
option_list.sort();
for (var jhuh=0; jhuh<option_list.length; jhuh++) {
option_list[jhuh]='<option value="' + option_list[jhuh].split(';')[1];
selc+=option_list[jhuh];
}
document.getElementById('mysel').innerHTML+=selc;
document.getElementById('myminisel').innerHTML='';
}
});
}

function dosearch(tv,tname) {
//alert(tname + ' at ' + tv);
if (iwo != null) {
iwo.close();
iwo=null;
}
iwo=window.open(tv,'_blank','top=250,left=0,width=600,height=550');
if (iwgo != null) {
iwgo.close();
iwgo=null;
}
iwgo=window.open('https://www.google.com.au/search?q=' + encodeURIComponent(tname) + '&source=lnms&tbm=isch','_blank','top=250,left=600,width=600,height=550');
document.getElementById('mydiv').innerHTML=document.getElementById('mydiv').innerHTML.split('<br>')[0] + '<br><iframe style="width:100%;height:600px;" src="http://www.rjmprogramming.com.au/HTMLCSS/karaoke_youtube_api.htm?vid=' + encodeURIComponent(' ' + tname) + '" title="' + okn + '"></iframe>';
}

function ofc(iois) {
okn=iois.value;
}

function precval(iois) {
okn=iois.value;
}

function cval(eiois) {
if ((eiois.which || eiois.keyCode) == 8) {
okn='';
document.getElementById('myminisel').innerHTML='';
} else {
okn+=String.fromCharCode(eiois.which || eiois.keyCode);
if (okn.length >= 3) {
//alert(okn);
var newih='';
document.getElementById('myminisel').innerHTML=newih;
for (var jhuh=0; jhuh<insert_words_list.length; jhuh++) {
if (insert_words_list[jhuh].toLowerCase().indexOf(okn.toLowerCase()) != -1) {
if (newih == '') {
newih='Optionally, please select an amphibian of interest below ...';
}
newih+=option_list[jhuh];
}
}
document.getElementById('myminisel').innerHTML=newih;
document.getElementById('mydiv').innerHTML=document.getElementById('mydiv').innerHTML.split('<br>')[0] + '<br><iframe style="width:100%;height:600px;" src="http://www.rjmprogramming.com.au/HTMLCSS/karaoke_youtube_api.htm?vid=' + encodeURIComponent(' ' + okn) + '" title="' + okn + '"></iframe>';
}
}
}

</script>
</head>
<body style='background-color: lightblue;' onload=" getcommonnamelist(); ">
<h1 id='myh1' style='text-align:center; width: 100%;'>Amphibian Common Name Image or Video Lookup - RJM Programming - October, 2016</h1>
<h3 id='myh3' style='text-align:center; width: 100%;'>Thanks to <a target=_blank title='List All Amphibians :: Saint Louis Zoo' href='https://www.stlzoo.org/animals/abouttheanimals/amphibians/listallamphibians/'>List All Amphibians :: Saint Louis Zoo</a> and <a target=_blank title='Google' href='http://google.com'>Google</a> Image Search</h3>
<div id='mydiv' style='text-align:center; width: 100%;'><select id='mysel' onchange='dosearch(this.value,this.options[this.selectedIndex].text);'><option value=>Please select an amphibian of interest below or type search words to right ...</option></select> <input id='myinp' type=text onkeydown='cval(event);' oninput='precval(this);' onclick='ofc(this);' value=''></input> <select id='myminisel' onchange='dosearch(this.value,this.options[this.selectedIndex].text);'></select></div>
</body>
</html>