katspaugh/wavesurfer.js — pull request #233 by rgagnon24 (2014-08-26 22:33:11+00:00)
Title: Add 'scroll' event, use Dynamic width of container

New event to assist in linking different WaveSurfer objects on a page. 'scroll' happens when the scrollbar moves. This could be used to then set another WaveSurfer's scrollLeft position to match the one raising the event (to keep their positions in sync).

Drawer.containerWidth and Drawer.scrollWidth are not dynamic. If the user re-sizes the page, these values do not adjust. By removing them, and referencing the elements directly, the container can more accurately adjust to user changes in dimensions.

* Drawer.containerWidth is replaced by Drawer.container.clientWidth
* Drawer.scrollWidth is replaced by Drawer.wrapper.scrollWidth

(timeline plugin adjusted to use proper value as it was referencing .scrollWidth)

Drawer.recenterOnPosition() was adjusted to account for odd visuals found in Firefox where the scrollbar would sometimes not move if the .scrollLeft value was set to something out-of-bounds. IE: Setting .scrollLeft to -500 and then reading the value of .scrollLeft would reveal 0 as it should, but the UI would not change visually. By boundary-checking the value, the UI properly moves the scrollbar.

if-check for the cursor visibility was altered slightly for readability only. It is now easier to read the condition as representing "Not immediate AND offset BETWEEN -half and half)

Tested on Windows in Firefox and Chrome with both scrollParent set to true, and scrollParent set to false.