NUKnightLab/juxtapose — pull request #35 by duner (2014-11-12 22:14:00+00:00)
Title: Add support (mostly) for Internet Explorer 8

### What does this PR do?
Makes JuxtaposeJS work in IE8. There are a few things I had to do to make this work:

* Changes the way images are inserted into the slider. Before we used `background-url` on the div.jx-image with a `background-size: cover;` property. `cover` isn't supported in IE8 so instead we append an `img` to `div.jx-image` and I wrote some CSS to make that work. This also let me delete `setImage()` function.
* Wrote a number of new utility methods including `getNaturalDimensions`, `getComputedWidthAndHeight`, `getPageX`, `setText`, `addClass` and `removeClass`. These abstract some conditional logic to check if certain functions exist and then use fallback functions if necessary. Some of these could maybe use a bit more massaging but they work and get the job done.
* Move the calls to `onLoaded` into the Graphic classes from the JXSlider class because in IE8 you need to define `image.onload()` before you set the image's src.
* Add polyfill for `addEventListener()`
* Change some CSS to use hex codes for colors when `rgba()` isn't supported.
* Refactored `updateSlider()` so that the logic for calculating the new position is in a new `getLeftPercent` function—this let me delete a bunch of code.
* Replace `[].map.call` with a for loop in the `scanPage` function

### Why am I doing this? How does this help us?
So that more people can use JuxtaposeJS on more browsers; that's a win for everybody!

### How should this be manually tested?
Start a Python SimpleHTTPServer in the main directory and navigate to `example.html`—you need to open it up in a VirtualBox (or, BrowserStack, I guess) to test it in Internet Explorer.

### Things that don't work in IE8 (next steps? is it worth fixing these?)
* Flickr images
* Animation/CSS transitions

### Smells?
* Well, it's IE8 so I had to introduce some deprecated functions, but I also abstracted and refactored some parts of the code which I think make it a bit less smelly.
* Maybe we should think about the way we deal with concurrently loading the two images. Now that we are just using `img` instead of `background-url` it might also make sense to just use that same element instead of creating a new `img`.