EightShapes/Blocks — pull request #100 by kevinmpowell (2014-09-19 20:13:36+00:00)
Title: Feature/blocks viewer updates

@humancompanion, I've been working on some updates to BlocksViewer that @francisrupert requested.
Issues are:
[closes #95]
[closes #96]
[closes #97]
[closes #98]

### Approach
Those issues have to do with the auto-sizing of the iFrame wrapper to match the content of the component inside. In working on these issues I did a line-by-line deep dive into the existing Viewer code to gain a better understanding of how it works. I had previously done some work on Viewer, adding the "auto-zoom" functionality, but this work was mostly hacked jQuery added at the end of the file trying to work after BlocksViewer had already parsed everything. In the process of addressing these four issues, I've also better integrated that previous work into the file.

**Summary of updates**
* Fix sizing bugs in #95, #96, and #97
* Fix resizing bug from #98
** Done by overlaying a hidden div on top of the iFrame while resizing, and removing the iFrame after the resize event has ended
* Refactor previous "auto-zoom" code to fit into the existing Viewer process
* Add JS-injected default styles, so it's more apparent when blocks has been activated
** Add console NOTICE to inform of the injected styles and how to add a parameter to ````config.json```` to prevent the injection of default styles
* Replace several ````setTimeout```` sections of code with a ````setInterval``` + ````clearInterval```` approach to ensure the correct timing and execution of the Viewer rendering process
** I'm not sure what exact impacts this has had, but prior to these changes, Safari and Chrome would only render the last framed component on a page, after these changes Safari and Chrome correctly render all framed components.

If you want to set up a time to do a formal walkthrough of the code let me know. Otherwise, feel free to use line-by-line commenting. I did run this through JSHint and I've tried to keep the existing style of the document when implementing these changes.