Turn your sentence into a hyphenated string: hyphenator.hellotumo.com.
- Might not be great for browsers other than most advanced ones (I did all testing in latest Google Chrome);
- On mobile Safari, the character counter doesn’t work;
- There is a bug if you mess around too much with selecting/deselecting/pasting text into the box area containing the hyphenated headline.
I suspect many of these problems are fixable by using jQuery, but I like playing with pure JS as I get to know the language.
I’ve dropped some notes into the main.js file on what I learned making this better, but here they are for easier access:
# using .focus() to compare to document.activeElement (but I ended up not using it):
# regular expression help — especially the use of those handy brackets — from a friend, Reid:
- his example: http://jsfiddle.net/vsjmm2us/
# really cool stuff about attaching events, and trying to call functions with arguments with an event attachment:
# contentEditable is fun (but didn’t use it):
- but apparently also terrible: https://medium.com/medium-eng/why-contenteditable-is-terrible-122d8a40e480
Acknowledgments: Thanks, Reid S.