QuickSettings Version 3.0 released

Nov 11 2016 Published by under JavaScript, QuickSettings

I just pushed QuickSettings Version 3: https://github.com/bit101/quicksettings/releases/tag/3.0

I’m really happy with the changes in this version. I use QuickSettings myself all the time, so most of the changes stem very much from personal experience – seeing my own pain points and addressing them. The key motivation for changes in this release was making the library easier to use.

One of the annoyances I noticed was in getting values from a panel – you had to know what kind of control you were querying and use the correct get method, i.e. getRangeValue(title) or getColor(title) or getText(title). And the same for setting values. Since the panel knows what kind of control it is setting or getting via the title, there was no reason to force the user to specify it. So all that is gone. All controls can be set or get with setValue(title, value) and getValue(title).

Since all controls now used the same interface for getting and setting values, this allowed me to vastly simplify the getValuesAsJSON method, returning an object or JSON string of all the values in a panel. It also allowed me to easily create a corresponding setValuesFromJSON method. Since both of these methods utilize the same JSON format, you can grab the values at one point and reset the panel using that same object. The Reset Demo (source) shows one example of how to use that. You could also use this technique to create multiple presets for panels.

Having a single format to get and set all panel values opened up a solution for another situation that annoyed me. In working on some experimental piece, I’d create a panel, and adjust various values in it, and then need to change the code. When I re-ran the application, the panel was of course back to its original state. And I’d have to go adjust the values again. The solution is saveInLocalStorage(name). When you call this method on a panel, it immediately looks for an item in localStorage with the given name. If it finds one, it uses setValuesFromJSON to reset the panel to the values found there. It then listens for any changes that occur to any values in the panel and immediately saves them to local storage under the same name. This means that the next time you start the app, the panel will initialize with the same values it ended with in the last session. Check the Local Storage Demo (source) to see this in actions.

I’ve also been paying a lot of attention to the size of the library, trying to keep it as small as possible. This includes removing any code that is not vital to the project. So there were some removals in 3.0:

I noticed a while ago that setInfo and setHTML were almost exact duplicate methods. So I just made setInfo into an alias for setHTML. In version 3.0, setInfo is gone altogether.

A big removal was the parse method. This would take a JSON object and generate an entire panel from it. The idea being that you could build a panel declaratively with JSON rather than writing JavaScript code. I personally wound up never using this method and never heard from anyone who did. It was complex and took up a big chunk of the source code. So it is gone. If people really miss it, I’ll consider recreating it as a separate module.

Finally, I removed the whole snap-to-grid functionality. I found, personally, that I wasn’t moving panels around that often anyway, and when I did, I didn’t really care if they snapped to any kind of grid. It was a neat feature, but not essential.

Between the simplification resulting from the new get/set methods and the removal of the items mentioned, I was able to cut about 4k off the library size, making the minimized library about 20.5k.

Of course, these changes may break some existing apps. Hopefully not too badly. And I think the added simplicity and functionality is worth it.

One thing not as visible is that I’ve also started unit testing the library. This was long overdue. When I started changing the set/get methods, I saw that I was going to need to do a ton of manual testing on each and every control to make sure that I wasn’t breaking anything. Forget that. It’s all automated now. All the set and get methods are thoroughly and automatically tested now. In addition to making sure that the new functionality worked correctly, this testing also unearthed several pre-existing issues that I probably never would have noticed. Those are now fixed too. All the tests are checked into the repo, so if anyone wants to add additional tests in there, I’ll happily pull them in. I mainly concentrated on the value functions, but there’s a lot more in the library that needs to be added to testing.

No responses yet. Comments will be closed after post is one year old.

Leave a Reply