Chemical Element Data and Periodic Table Input Widget

Show and Tell
1

I’ve created a library that provides the basic information on the chemical elements (taken from the Wikipedia page) and provides a Periodic Table input widget that supports single and multi-select and basic formula input (with undo!)

You can use it for building chemistry worksheets, calculators, etc. (My daughter is starting college Chem).

7 Likes
2

Awesome! Is there already any nice collection of Observable “helper libraries” like this?

3

I’ve been trying to keep a table of links at the top of the Inputs Bazaar, but it’s probably worth creating an official “Inputs” collection at this point.

There is the Libraries collection, which is a bit more general, too.

1 Like
4

Excellent!

As a long term project, I’m hoping to enhance Balmer Series Spectral Lines of the Hydrogen Atom with spectral lines for all the elements.

This will go a long way towards that goal.

5

Bob:

Your notebook is throwing errors with the FireFox 77.0.1 browser.

Specifically: import { def } from ‘@bobkerns/def’

SyntaxError: invalid regular expression flag s

Update: The issue is isolated to the following in this cell: https://observablehq.com/@bobkerns/def#STD_DEF_FORMATS

According to this the following regular expression is invalid; though chrome does not flag it as such…FireFox does:

/^\s*(async\s)?\s*(generator\s)?\sfunction\s+([\p{Letter}_][\p{Letter}\p{Number}_])\s*((?:([^)])))\s*(?:[=]>\s*([\p{Letter}_][\p{Letter}\p{Number}_]))?\s:?\s*(.*)$/su

But according to this, the ‘/su’ flag is valid.

Finally, this stackoveflow post on FireFox support for regular expressions is informative and applies to the regular expression in question.

Bottom line: looks like a browser dependency issue.

Update: Fixed in FireFox 78.0 with update to the RegEx Engine.

1 Like
6

Caesium the day!:

Thanks Bob!

Tip: If anyone is looking for a way to initialize which element is shown when the notebook is loaded, you can see the logic in the onLoad cell.

2 Likes
7

Glad to see it being used; I’d actually forgotten I had written it! But looks like I didn’t quite finish the buttons on the lower left. I wonder what they’re supposed to do… :sunglasses:.

(Reset and Undo work; the rest also Undo). I think they’re supposed to be to annotate charge for ions and of course groupings, and only useful for Formula mode. I’ll try to clean that up later, but my interruptions have interruptions these days.

Glad you got the RegExp issue sorted. I’m surprised ECMAscript 2018 Regexp features were still lacking; I wonder what other stuff I take for granted now I need to watch for.

Anyway, you may or may not want to pin your import of my tool to version 1995, depending on how much risk you want of me breaking it down the road. I’ll try not to do that of course!

1 Like