Thread:Mathmagician/@comment-93604-20120509230753/@comment-3508190-20120512054834

On second thought: That bit of code is needlessly complicated. I simplified it a bit and externalised the CSS. Forget about $.fn.extend for the moment, it isn't truly needed:

As for the rest of the code:


 * There are indeed many ways I could have formatted the button-data. But I have a few golden rules about constants that I follow very strictly: If you must have lots of constants, gather them in one location! And: Never split related data over separate objects or arrays! That's the reasoning behind that buttonTexts object
 * The .data method attaches arbitrary data to jQuery objects. I used it to store the buttons' "on" values - booleans that are negated on click and always tells you about the button's state. It's simply more convenient to just store the state instead of determining it every time - whether it's also reliable enough remains to be seen
 * Object properties can be accessed with an array notation in JS. You can use that for variable properties:


 * And I thought it would be clever to split the button logic - the exchange of the button title and the setting of .data('on') - from the application logic - the collapsing of parts of the page. That's wyh I put the button logic into the click-handler and added a custom "toggle" handler. The .trigger method triggers the custom event and with the .on method you can bind a listener to it: