From c045d440d9d6403761cee27c704f2a30995277e7 Mon Sep 17 00:00:00 2001
From: Frode Petterson <frode.andre.petterson@gmail.com>
Date: Fri, 15 Apr 2016 09:30:27 +0200
Subject: [PATCH] Set min. height to background image on intro

Also, made sure that the image always covers the background.
HFJ-1815
---
 js/questionset.js | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/js/questionset.js b/js/questionset.js
index a631de2..a137df5 100644
--- a/js/questionset.js
+++ b/js/questionset.js
@@ -405,13 +405,15 @@ H5P.QuestionSet = function (options, contentId) {
     if (params.introPage.backgroundImage !== undefined) {
       var $intro = $myDom.find('.intro-page');
       if ($intro.length) {
+        var bgImg = params.introPage.backgroundImage;
+        var bgImgRatio = (bgImg.height / bgImg.width);
         $intro.css({
-          background: '#fff url("' + H5P.getPath(params.introPage.backgroundImage.path, contentId) + '") no-repeat 50% 50%',
-          backgroundSize: '100% auto'
+          background: '#fff url("' + H5P.getPath(bgImg.path, contentId) + '") no-repeat 50% 50%',
+          backgroundSize: 'auto 100%',
+          minHeight: bgImgRatio * +window.getComputedStyle($intro[0]).width.replace('px','')
         });
       }
     }
-
     var registerImageLoadedListener = function (question) {
       H5P.on(question, 'imageLoaded', function () {
         self.trigger('resize');