Skip to content

Instantly share code, notes, and snippets.

@badosa

badosa/index.html

Last active November 21, 2019 05:18
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save badosa/3cfb6bcec7c5a27b1fa7 to your computer and use it in GitHub Desktop.
Save badosa/3cfb6bcec7c5a27b1fa7 to your computer and use it in GitHub Desktop.
Download ZIP
Ireland's Harmonised Inflation Calculator
Raw
readme.md
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>Ireland&rsquo;s Harmonised Inflation Calculator</title>
<meta charset="utf-8" />
<link href="/d/20735ba5bbecbc079d78/style.css" type="text/css" rel="stylesheet" />
<!-- DO NOT DO THIS IN PRODUCTION -->
<!-- js.org and json-stat.org ARE NOT CDNs -->
<link href="https://visual.js.org/visual.css" rel="stylesheet" type="text/css" />
<script src="https://visual.js.org/lazyvisualsetup.js"></script>
<!-- /DO NOT DO THIS IN PRODUCTION -->
<script src="https://cdn.jsdelivr.net/npm/jsonstat@0.13.13"></script>
<link href="https://fonts.googleapis.com/css?family=Alef" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="container">
<h1>Ireland&rsquo;s Harmonised Inflation Calculator</h1>
<form>
<fieldset>
<legend>From</legend>
<select id="from"></select>
<input id="amount" type="number" name="amount" value="1000" /> <abbr title="Euros">&euro;</abbr>
</fieldset>
<input type="button" value="&rarr;" id="calc" />
<fieldset>
<legend>Till</legend>
<select id="till"></select>
<input readonly="readonly" id="result" /> <abbr title="Euros">&euro;</abbr>
</fieldset>
</form>
<div id="visual" class="visual">Retrieving data...</div>
</div>
<script type="text/javascript">
var
//Harmonised Consumer Price Index (EU HICP) by Commodity Group, Month and Statistic
url="https://statbank.cso.ie/StatbankServices/StatbankServices.svc/jsonservice/responseinstance/CPM15",
//EU HICP Base 2015=100
constants={ "Statistic": "CPM15C01", "Commodity Group" : "-" },
gel=function(e){ return document.getElementById(e); },
from=gel("from"),
till=gel("till"),
amount=gel("amount"),
result=gel("result"),
calc=gel("calc"),
chart=gel("chart")
;
calc.onclick=function(){ window.alert("Data not loaded yet!"); };
JSONstat(url, function(){
if(this.length){ //jsontat ok
var
fromData=(JSON.parse(JSON.stringify(constants))), //clone
tillData=(JSON.parse(JSON.stringify(constants))), //clone
ds=this.Dataset(0),
tid=ds.role.time[0],
time=ds.Dimension(tid),
timeTxt=function(t){
var
m=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],
arr=t.split("M")
;
return m[arr[1]-1] + " " + arr[0];
},
draw=function(tbl){
var
t=tbl.map(function(e){ return e.time.substring(0,4)+e.time.substring(5,7); }),
v=tbl.map(function(e){ return e.value; })
;
visual({
"lang": "en",
"fixed": [310, 270],
"autoheading": false,
"axis": { "x": false},
"grid": {"border": 0, "line": 1, "shadow": 4, "point": 0},
"type": "tsline",
"time": t,
"data": [{"label": "", "val": v}],
"unit": {"label": "&euro;"},
"dec": 2
});
},
calculate=function(amount, ds){
var
timeFrom=from.options[from.selectedIndex].value,
timeTill=till.options[till.selectedIndex].value
;
fromData[tid]=timeFrom;
tillData[tid]=timeTill;
var
indexFrom=ds.Data( fromData ).value,
indexTill=ds.Data( tillData ).value,
val=amount.value
;
var
updval=val*(indexTill/indexFrom),
tbl=ds.toTable(
{type:"arrobj", content: "id"},
function(d){
var
t=d[tid],
interval=(timeFrom<timeTill) ?
(t>=timeFrom && t<=timeTill) :
(t<=timeFrom && t>=timeTill)
;
if(interval && d["Statistic"]==="CPM15C01" && d["Commodity Group"]==="-"){
return {
"time": d[tid],
"value": updval*(d.value/indexTill)
};
}
}
)
;
result.value=updval.toFixed(2);
return tbl;
}
;
for(var i=0, len=time.length; i<len; i++){
var
id=time.id[i],
t=timeTxt(id)
;
from.options[i]=new Option(t, id);
till.options[i]=new Option(t, id);
}
from.options.selectedIndex=len-13;
till.options.selectedIndex=len-1;
draw(calculate(amount, ds));
calc.onclick=function() {
draw(calculate(amount, ds));
};
}else{
window.alert("There was a problem retrieving the data. Please, try later.");
}
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment