I know these Periodic Tables are a dime a dozen on the Internet today – most of which will put this one to shame – but once upon a time I taught high school chemistry so this table holds a special place in my heart. Many years ago, I crafted a periodic table using Flash MX2004 where all you had to do was hover over the elements to get the information. Well, I guess it was time to redo that anyway. No hovering with this one. I wanted it to be a bit more tablet friendly so you need to click or tap on each one.

That said…  we have two things going on here.

1. The Periodic Table
2. Room Escape Puzzle

The Table

This was not what I would consider a difficult project but it was very time consuming. There are 118 elements which means 118 boxes for them. Each element has two information panels that animate when you select an element. These panels have information about the element. So that means 118 different left panels and 118 different right panels.

The left and right panels are actually just two panels with 118 states each.
Researching all the data on the elements took time as well. I only did a proton, neutron, and electron count – so nothing really fancy here.

Since all the element boxes are buttons that essentially perform the same actions – I created several functions and had them execute onEnter to the slide.

Then I call on them with the buttons. This allowed me to make one button with all the code on it and then replicate 117 copies.

Since each element has a different atomic number and information to go with it, I created a variable called atomic and used it in my functions to swap out the states for the information panels. That function basically looks like this:

function changeInfo() {
cp.changeState(“leftPanel”,”info”.concat(atomic));
cp.changeState(“rightPanel”,”info”.concat(atomic));
}

I named all the states for the elements using the word info along with the atomic number such that info1 was for Hydrogen, info2 for Helium, etc. This allowed me to use concatenation to easily bring up the correct information panels.

The Puzzle

You all like a good puzzle, right? Remember the sliding tile game? This one has a prize too. Can you get it?
I guess you could say that I have added a new “element” to this table.

In the actual Room Escape – the puzzle part will be presented a bit differently but you can perhaps get the gist of the puzzle.