-
Notifications
You must be signed in to change notification settings - Fork 8
/
periodictableinfobox.js
47 lines (39 loc) · 1.69 KB
/
periodictableinfobox.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
class PeriodicTableInfoBox
{
constructor(periodictable, infoboxbackgroundid, infoboxid)
{
this._periodictable = periodictable;
this._infoboxid = infoboxid;
this._infoboxbackgroundid = infoboxbackgroundid;
document.onkeyup = (event) =>
{
if(event.key === "Escape" && document.getElementById(this._infoboxid).style.visibility === "visible")
{
this.Hide();
}
}
document.getElementById("btnCloseInfoBox").onclick = () => this.Hide();
}
Hide()
{
document.getElementById(this._infoboxid).style.visibility = "hidden";
document.getElementById(this._infoboxbackgroundid).style.visibility = "hidden";
}
Show(atomicnumber)
{
const element = this._periodictable.GetElement(atomicnumber);
document.getElementById("infoName").innerHTML = element.name;
document.getElementById("infoAtomicNumber").innerHTML = element.atomicnumber;
document.getElementById("infoChemicalSymbol").innerHTML = element.symbol;
document.getElementById("infoCategory").innerHTML = element.category;
document.getElementById("infoAtomicWeightConventional").innerHTML = element.atomicweight;
document.getElementById("infoAtomicWeightStandard").innerHTML = element.atomicweightfull;
document.getElementById("infoOccurrence").innerHTML = element.occurrence;
document.getElementById("infoStateOfMatter").innerHTML = element.stateofmatter;
document.getElementById("infoGroup").innerHTML = element.group;
document.getElementById("infoPeriod").innerHTML = element.period;
document.getElementById("infoBlock").innerHTML = element.block;
document.getElementById(this._infoboxbackgroundid).style.visibility = "visible";
document.getElementById(this._infoboxid).style.visibility = "visible";
}
}