First, I would like to welcome everyone to my completely overhauled blog site at ThePenzone.com! The old blog had some fatal flaws that made it necessary to start over:

  • it was based on Drupal (for anyone who knows what Drupal is, need I say more?)
  • it was ugly as sin (exhibit A - opens in new tab)
  • it got hacked at one point due to a combination of being based on Drupal, and my own laziness in applying updates (don't worry, the site is malware-free as of the time of this writing!)

After saving the posts and wiping everything, I forked an open-source PHP/Laravel-based blog that did most of what I needed, and modified it into what you see here. The source code for this blog is available on github, or you can follow the 'git' link in the header. I've been using Laravel at work lately, and after being constantly impressed by the quality of the framework, the prospect of dealing with Drupal again on my own time was too much to bear. The site is now fully buzzword-compliant, complete with Docker integration and Amazon ECS deployment. And while I don't like to throw around terms like "unhackable", "impregnable" and "unsinkable", this is like Alcatraz compared to the crudely fashioned cardboard box I had before.

In celebration of my fancy new blog, I'm doing something I've never done before; I'm releasing a useful thing! I present to you, InputToggle. InputToggle is an open-source jQuery-based javascript site component that toggles classes or an attribute on an element based on the state of a form input being equal to or not equal to a value, or among or not among a set of values. This is useful if you have, say, an advanced search form with a bunch of filters, and you want checkboxes to enable certain filters, and prevent interaction while unchecked. Or maybe you want the user to enter the text "boom boom" into a text field before you'll allow then to click the 'Destroy' button. I had made something similar for a previous employer, and had the crazy idea to rewrite it from scratch for funsies without looking at the prior source I had written, so that I could release the source. It was probably for the best, since it turned out much nicer than the last time... I think.

Using it is pretty straightforward; simply include the JS, set the necessary attributes on the elements whose classes or attribute you would like to toggle based on the state of a specified input, and call the InputToggle.init() method after the document's loaded, and you're set.

Here's a demo:

InputToggle Demo on JSFiddle.net

InputToggle Source Code on GitHub

InputToggle on NPM - you can also install the lib by running the command npm install input-toggle.