HIW JS API Base Example

by HealthIndicators

HTML

<script src="https://rawgit.com/HealthIndicators/js-api/current-release/Content/Scripts/API/Output/hiw-api.min.js"></script>
<div>
    <label for="apiKey">API Key:</label>
    <input id="apiKey" type="text" />
</div>
<div>
    <label for="baseURL">Base URL:</label>
    <input id="baseURL" type="text" />
    <button id="runButton">Run Example</button>
</div>

<p><strong>Note:</strong> This is a base example which can be used to work with the HIW API, but it doesn't actually do anything as it is.</p>

<div id="loading">Loading, please wait...</div>

CSS

html, body {
    width: 100%;
    height: 100%;
}

label {
    display: inline-block;
    width: 200px;
    text-align: right;
}

#map {
    width: 100%;
    height: 500px;
}

#loading {
    display: none;
    position: absolute;
    top: 40%;
    left: 25%;
    width: 50%;
    margin: 40px;
    padding: 10px;
    border: 1px solid #666;
    background: linear-gradient(270deg, #1fbb16, #ffffff, #1fbb16);
    background-size: 600% 600%;
    text-align: center;
    animation: loading 3s ease infinite;
}

@keyframes loading { 
    0% {
        background-position: 100% 50%;
    }
    
    100% {
        background-position: 0% 50%;
    }
}

JavaScript

var apiKey_Key = "apiKey";
var baseURL_Key = "baseURL";
var indicatorDescriptionID_Key = "indicatorDescriptionID";
var api = null;
var map = null;

function run() {
    var apiKey = $("#apiKey").val();
    var baseURL = $("#baseURL").val();
    
    $("#runButton").attr("disabled", "disabled");
    $("#loading").show("fast");
    
    //Create an API instance against which to make your API calls, passing in your API key.
    api = new hiw.API(apiKey, baseURL);

    runExample();
}

function runExample() {
    // ...do work here.
    
    runComplete();
}

function runComplete() {
    $("#runButton").removeAttr("disabled");
    $("#loading").hide("fast");
}

function getParameters() {
    var apiKey = null;
    var baseURL = null;
    
    if (typeof (Storage) !== "undefined") {
        apiKey = localStorage.getItem(apiKey_Key);
        baseURL = localStorage.getItem(baseURL_Key);
    }
    
    $("#apiKey").val(apiKey);
    $("#baseURL").val(baseURL || hiw.API.DefaultBaseURL);
}

function setParameter(key, value) {
    if (typeof (Storage) !== "undefined")
        localStorage.setItem(key, value);
}

$(function () {
    getParameters();
    
    $("#apiKey").change(function () { setParameter(apiKey_Key, $(this).val()); });
    $("#baseURL").change(function () { setParameter(baseURL_Key, $(this).val()); });
    
    $("#runButton").click(run);
});