5 ms·
Interesting! I noticed "It can also be used for annotating other kinds of text" and wanted to experiment with being able to number specific letters in a string
by dalke 5y ago
Interesting!
I noticed "It can also be used for annotating other kinds of text" and wanted to experiment with being able to number specific letters in a string.
More specifically, SMILES is a linear molecular structure notation. "O" is water, "COO" is ethyl alcohol, "c1ccccc1" is a benzene ring, and much more. (See https://en.wikipedia.org/wiki/Simplified_molecular-input_line-entry_system https://en.wikipedia.org/wiki/Simplified_molecular-input_lin... .)
I want to annotate atom positions in the SMILES string. I currently do this with ("pip install smiview") text over the string, as this example using phenol.
1 23456 7
c1ccccc1O
I wanted to try it with ruby so I used:
<ruby>
c<rt>1</rt>1c<rt>2</rt>c<rt>3</rt>c<rt>4</rt>c<rt>5</rt>c<rt>6</rt>1
</ruby>
The "2" is located over the center of "1c" instead of over the second "c" like I wanted.
How do I get it to center only over the "c"?
I tried changing the CSS too, using this catch-all:
ruby {
font-size: 2em;
ruby-align: center;
text-align: center;
}
* {ruby-align: center;}
No luck. I also tried wrapping things in a span, like:
c<rt>1</rt>1<span>c<rt>2</rt></span>c<rt>3</rt>
but got the 3 as a new ruby line, centered over the "1cc", itself with a ruby "2" between the second and third "c".
I tried other combinations of <span>, to no avail.
- OJFord 5y agoI know nothing about this, but use a fixed width font perhaps (if you weren't)? Sounds like it could be because the '1' is narrower.
- vore 5y agoMultiple ruby spans, perhaps? <ruby> c<rt>1</rt> </ruby>1<ruby> c<rt>2</rt> </ruby><ruby> c<rt>3</rt>c<rt>4</rt>c<rt>5</rt>c<rt>6</rt>1 </ruby>
- dalke 5y agoYes, that was the solution. Thanks!
- gvx 5y agoAs far as I can tell, the only content inside of a ruby tag should be annotated text or its annotation, the 1 that should not be annotated should not be inside the <ruby> tag. I get a good result with this: <ruby>c<rt>1</rt></ruby>1<ruby>c<rt>2</rt>c<rt>3</rt>c<rt>4</rt>c<rt>5</rt>c<rt>6</rt></ruby>1
- alin23 5y agoIndeed, this looks quite good: https://cln.sh/5MWsIR https://cln.sh/5MWsIR
- dalke 5y agoThanks to you for the working demo, and to gvx for figuring it out! UPDATE: Here's an example for theobromine - https://jsfiddle.net/j84z1kyb/ https://jsfiddle.net/j84z1kyb/ . It looks great! But it's not as useful as I hoped it would be. Copy&paste captures the numeric annotations. I probably should have expected that, but didn't. And highlighting is wonky. In Safari and Firefox, I seem to get a character and the ruby annotation for the character next to it, more often than I do the one overhead.
- alin23 5y agoWhoa that's incredible! Yes, selection does also highlight the annotations but the good part is that copying ignores them. I just selected the whole formula, pressed Cmd-C, Cmd-V and got this: Cn1cnc2c1c(=O)[nH]c(=O)n2C
- dalke 5y agoInteresting. My Cmd-C, Cmd-V in Safari gives: C1n21c3n4c52c61c7(=O8)[nH]9c10(=O11)n122C13 but in Firefox gives: Cn1cnc2c1c(=O)[nH]c(=O)n2C
- ahmedfromtunis 5y agoNot with chrome for Android though. Here's what the clipboard captured instead: C1n21c3n4c52c61c7(=O8)[nH]9c10(=O11)n122C13
- twic 5y agoCCO is ethanol. COO is methyl hydroperoxide. SMILES is a lovely standard, really simple and easy enough to write by hand, but powerful enough to describe real molecules in detail. Not long ago, i saw a chemical structure used as part of an illustration, and wondered what it was. I transcribed it as SMILES, put it into a chemical search engine, and found out what it was (nothing interesting!).
- dalke 5y agoD'oh! Yup. You think I would know that by now. I'll attribute it to trying this out being the weekend, in the down times between the kids' bedtime routine.