Allow users to override background-size and background-position.

I like to have full screen image backgrounds that cover the entire slide.  I also need to be able to switch between 16:9 and 4:3.  Using `background-size: cover` and `background-position: 50% 50%` is a great way to get this.  Instead of more logic, just let the user override this and respect that.

src/remark/views/slideView.js

@@ -84,11 +84,19 @@ SlideView.prototype.scaleBackgroundImage = function (dimensions) {
   var self = this
     , styles = window.getComputedStyle(this.contentElement)
     , backgroundImage = styles.backgroundImage
+    , backgroundSize = styles.backgroundSize
+    , backgroundPosition = styles.backgroundPosition
     , match
     , image
     , scale
     ;
 
+  // If the user explicitly sets the backgroundSize or backgroundPosition, let
+  // that win and early return here.
+  if ((backgroundSize || backgroundPosition) && !self.backgroundSizeSet) {
+    return;
+  }
+
   if ((match = /^url\(("?)([^\)]+?)\1\)/.exec(backgroundImage)) !== null) {
     image = new Image();
     image.onload = function () {
@@ -166,13 +174,21 @@ function createNotesElement (slideshow, notes) {
 function setBackgroundFromProperties (element, properties) {
   var backgroundImage = properties['background-image'];
   var backgroundColor = properties['background-color'];
+  var backgroundSize = properties['background-size'];
+  var backgroundPosition = properties['background-position'];
 
   if (backgroundImage) {
     element.style.backgroundImage = backgroundImage;
   }
   if (backgroundColor) {
     element.style.backgroundColor = backgroundColor;
   }
+  if (backgroundSize) {
+    element.style.backgroundSize = backgroundSize;
+  }
+  if (backgroundPosition) {
+    element.style.backgroundPosition = backgroundPosition;
+  }
 }
 
 function setHighlightStyleFromProperties (element, properties, slideshow) {

test/remark/views/slideView_test.js

@@ -44,6 +44,30 @@ describe('SlideView', function () {
 
       slideView.contentElement.style.backgroundColor.should.match(/^red$/);
     });
+
+    it('should be set from background-size slide property', function () {
+      var slide = new Slide(1, {
+            source: '',
+            properties: {'background-size': 'cover'}
+          });
+
+      slideshow.slides.push(slide);
+      var slideView = new SlideView(new EventEmitter(), slideshow, scaler, slide);
+
+      slideView.contentElement.style.backgroundSize.should.match(/^cover$/);
+    });
+
+    it('should be set from background-position slide property', function () {
+      var slide = new Slide(1, {
+            source: '',
+            properties: {'background-position': '2% 98%'}
+          });
+
+      slideshow.slides.push(slide);
+      var slideView = new SlideView(new EventEmitter(), slideshow, scaler, slide);
+
+      slideView.contentElement.style.backgroundPosition.should.match(/^2% 98%$/);
+    });
   });
 
   describe('classes', function () {