|
| 1 | +<!DOCTYPE html> |
| 2 | +<html> |
| 3 | +<head> |
| 4 | +<title>Plant Hardiness Zone Map API</title> |
| 5 | +<linkrel="stylesheet"href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"type="text/css"media="screen"/> |
| 6 | +<style> |
| 7 | +#json { |
| 8 | +clear: left; |
| 9 | +background-color:#eee; |
| 10 | +padding:1em; |
| 11 | +width:50%; |
| 12 | +min-width:200px; |
| 13 | +border:1px solid#999; |
| 14 | +margin-top:2em; |
| 15 | +display: none; |
| 16 | +font-family: monospace; |
| 17 | +} |
| 18 | +</style> |
| 19 | +</head> |
| 20 | + |
| 21 | +<body> |
| 22 | + |
| 23 | +<header> |
| 24 | +<h1>Plant Hardiness Zone Map API</h1> |
| 25 | +</header> |
| 26 | + |
| 27 | +<main> |
| 28 | + |
| 29 | +<p>Queries in format<code>https://phzmapi.org/ZIPCODE.json</code>, e.g. |
| 30 | +<code><ahref="https://phzmapi.org/20001.json">https://phzmapi.org/20001.json</a></code>. |
| 31 | +<ahref="https://github.com/waldoj/frostline/">Details on the GitHub repo</a>.</p> |
| 32 | +<form> |
| 33 | +<labelfor="zip">ZIP Code</label> |
| 34 | +<inputtype="text"size="5"id="zip"maxlength="5"pattern="[0-9]{5}"/> |
| 35 | +<buttontype="button"id="submit">Submit</button> |
| 36 | +<divid="json"></div> |
| 37 | +</form> |
| 38 | +</main> |
| 39 | + |
| 40 | +<scriptsrc="https://code.jquery.com/jquery-3.3.1.min.js"integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="crossorigin="anonymous"></script> |
| 41 | +<script> |
| 42 | +$(document).ready(function(event){ |
| 43 | +$("#submit").on('click',function(){ |
| 44 | +zip=$("#zip").val(); |
| 45 | +$.getJSON("https://phzmapi.org/"+zip+".json",function(data){ |
| 46 | +json=JSON.stringify(data); |
| 47 | +$("#json").html(json); |
| 48 | +$("#json").show(); |
| 49 | +}); |
| 50 | +}); |
| 51 | +}); |
| 52 | +</script> |
| 53 | +</body> |
| 54 | +</html> |