changeset 2297:b0b4d264d9a8

Fix for #28. z-index properly managed and elements fixed
author Nicholas Jillings <nicholas.jillings@mail.bcu.ac.uk>
date Wed, 27 Apr 2016 09:59:01 +0100
parents 9cf65a9360d2
children c588522dda07 a73495c6d604
files css/core.css index.html interfaces/AB.css interfaces/ABX.css interfaces/discrete.css interfaces/horizontal-sliders.css interfaces/mushra.css js/core.js test.html tests/examples/radio_example.xml
diffstat 10 files changed, 21 insertions(+), 76 deletions(-) [+]
line wrap: on
line diff
--- a/css/core.css	Wed Apr 27 09:47:45 2016 +0100
+++ b/css/core.css	Wed Apr 27 09:59:01 2016 +0100
@@ -41,8 +41,8 @@
 	background-color: #fff;
 	border-radius: 10px;
 	box-shadow: 0px 0px 50px #000;
-	z-index: 2;
-    position: absolute;
+	z-index: 10;
+    position: fixed;
 }
 
 div#popupContent {
@@ -107,10 +107,10 @@
 	/* Specify any colouring during the test halt for pre/post questions */
 	background-color: rgba(0,0,0,0.5);
 	/* Don't mess with this bit */
-	z-index: 2;
+	z-index: 9;
 	width: 100%;
 	height: 100%;
-	position: absolute;
+	position: fixed;
 	left: 0px;
 	top: 0px;
 }
--- a/index.html	Wed Apr 27 09:47:45 2016 +0100
+++ b/index.html	Wed Apr 27 09:59:01 2016 +0100
@@ -66,7 +66,7 @@
 				<li><a href="docs/Instructions/Instructions.pdf" target="_blank">Instructions</a></li>
 			</ul>
 		</div>
-        <div id="popupHolder" class="popupHolder" style="visibility: hidden; z-index: -1">
+        <div id="popupHolder" class="popupHolder" style="visibility: hidden">
             <div id="popupContent">
                 <div id="popupTitleHolder">
                     <span id="popupTitle"></span>
@@ -76,6 +76,6 @@
             <button id="popup-proceed" class="popupButton">Next</button>
             <button id="popup-previous" class="popupButton">Back</button>
         </div>
-        <div class="testHalt" style="visibility: hidden; z-index: -2"></div>
+        <div class="testHalt" style="visibility: hidden"></div>
 	</body>
 </html>
--- a/interfaces/AB.css	Wed Apr 27 09:47:45 2016 +0100
+++ b/interfaces/AB.css	Wed Apr 27 09:59:01 2016 +0100
@@ -13,18 +13,6 @@
 	font-size: 1.5em;
 }
 
-div.testHalt {
-	/* Specify any colouring during the test halt for pre/post questions */
-	background-color: rgba(0,0,0,0.5);
-	/* Don't mess with this bit */
-	z-index: 2;
-	width: 100%;
-	height: 100%;
-	position: absolute;
-	left: 0px;
-	top: 0px;
-}
-
 button {
 	/* Specify any button structure or style */
 	min-width: 20px;
--- a/interfaces/ABX.css	Wed Apr 27 09:47:45 2016 +0100
+++ b/interfaces/ABX.css	Wed Apr 27 09:59:01 2016 +0100
@@ -13,18 +13,6 @@
 	font-size: 1.5em;
 }
 
-div.testHalt {
-	/* Specify any colouring during the test halt for pre/post questions */
-	background-color: rgba(0,0,0,0.5);
-	/* Don't mess with this bit */
-	z-index: 2;
-	width: 100%;
-	height: 100%;
-	position: absolute;
-	left: 0px;
-	top: 0px;
-}
-
 button {
 	/* Specify any button structure or style */
 	min-width: 20px;
--- a/interfaces/discrete.css	Wed Apr 27 09:47:45 2016 +0100
+++ b/interfaces/discrete.css	Wed Apr 27 09:59:01 2016 +0100
@@ -17,18 +17,6 @@
 	font-size: 1.5em;
 }
 
-div.testHalt {
-	/* Specify any colouring during the test halt for pre/post questions */
-	background-color: rgba(0,0,0,0.5);
-	/* Don't mess with this bit */
-	z-index: 2;
-	width: 100%;
-	height: 100%;
-	position: absolute;
-	left: 0px;
-	top: 0px;
-}
-
 button {
 	/* Specify any button structure or style */
 	min-width: 20px;
--- a/interfaces/horizontal-sliders.css	Wed Apr 27 09:47:45 2016 +0100
+++ b/interfaces/horizontal-sliders.css	Wed Apr 27 09:59:01 2016 +0100
@@ -17,18 +17,6 @@
 	font-size: 1.5em;
 }
 
-div.testHalt {
-	/* Specify any colouring during the test halt for pre/post questions */
-	background-color: rgba(0,0,0,0.5);
-	/* Don't mess with this bit */
-	z-index: 2;
-	width: 100%;
-	height: 100%;
-	position: absolute;
-	left: 0px;
-	top: 0px;
-}
-
 button {
 	/* Specify any button structure or style */
 	min-width: 20px;
--- a/interfaces/mushra.css	Wed Apr 27 09:47:45 2016 +0100
+++ b/interfaces/mushra.css	Wed Apr 27 09:59:01 2016 +0100
@@ -17,18 +17,6 @@
 	font-size: 1.5em;
 }
 
-div.testHalt {
-	/* Specify any colouring during the test halt for pre/post questions */
-	background-color: rgba(0,0,0,0.5);
-	/* Don't mess with this bit */
-	z-index: 2;
-	width: 100%;
-	height: 100%;
-	position: absolute;
-	left: 0px;
-	top: 0px;
-}
-
 button {
 	/* Specify any button structure or style */
 	min-width: 20px;
--- a/js/core.js	Wed Apr 27 09:47:45 2016 +0100
+++ b/js/core.js	Wed Apr 27 09:59:01 2016 +0100
@@ -587,8 +587,6 @@
 		this.buttonPrevious.onclick = function(){popup.previousClick();};
 		
         this.hidePopup();
-        
-		this.popup.style.zIndex = -1;
 		this.popup.style.visibility = 'hidden';
 	};
 	
@@ -596,20 +594,16 @@
 		if (this.popup == null) {
 			this.createPopup();
 		}
-		this.popup.style.zIndex = 3;
 		this.popup.style.visibility = 'visible';
 		var blank = document.getElementsByClassName('testHalt')[0];
-		blank.style.zIndex = 2;
 		blank.style.visibility = 'visible';
         this.popupResponse.style.left="0%";
 	};
 	
 	this.hidePopup = function(){
         if (this.popup) {
-            this.popup.style.zIndex = -1;
             this.popup.style.visibility = 'hidden';
             var blank = document.getElementsByClassName('testHalt')[0];
-            blank.style.zIndex = -2;
             blank.style.visibility = 'hidden';
             this.buttonPrevious.style.visibility = 'inherit';
         }
--- a/test.html	Wed Apr 27 09:47:45 2016 +0100
+++ b/test.html	Wed Apr 27 09:59:01 2016 +0100
@@ -52,7 +52,7 @@
 		<div id='topLevelBody'>
             <span>Web Audio Evaluation Toolbox</span>
 		</div>
-        <div id="popupHolder" class="popupHolder" style="visibility: hidden; z-index: -1">
+        <div id="popupHolder" class="popupHolder" style="visibility: hidden">
             <div id="popupContent">
                 <div id="popupTitleHolder">
                     <span id="popupTitle"></span>
@@ -62,6 +62,6 @@
             <button id="popup-proceed" class="popupButton">Next</button>
             <button id="popup-previous" class="popupButton">Back</button>
         </div>
-        <div class="testHalt" style="visibility: hidden; z-index: -2"></div>
+        <div class="testHalt" style="visibility: hidden"></div>
 	</body>
 </html>
--- a/tests/examples/radio_example.xml	Wed Apr 27 09:47:45 2016 +0100
+++ b/tests/examples/radio_example.xml	Wed Apr 27 09:59:01 2016 +0100
@@ -18,7 +18,7 @@
 			<interfaceoption type="show" name="page-count"/>
 		</interface>
 	</setup>
-	<page id='test-0' hostURL="media/example/" randomiseOrder='true' repeatCount='4' loop='true' showElementComments='true' loudness="-23" poolSize="3">
+	<page id='test-0' hostURL="media/example/" randomiseOrder='true' repeatCount='4' loop='true' showElementComments='true' loudness="-23">
 		<interface>
 			<scales>
 				<scalelabel position="0">(1) Very Annoying</scalelabel>
@@ -31,6 +31,17 @@
 		<audioelement url="0.wav" id="track-1" alwaysInclude="true"/>
 		<audioelement url="1.wav" id="track-2"/>
         <audioelement url="3.wav" id="track-4"/>
-        <audioelement url="2.wav" id="track-3" type="outside-reference"/>
+        <audioelement url="3.wav" id="track-5"/>
+        <audioelement url="3.wav" id="track-6"/>
+        <audioelement url="3.wav" id="track-7"/>
+        <audioelement url="3.wav" id="track-8"/>
+        <audioelement url="3.wav" id="track-9"/>
+        <audioelement url="3.wav" id="track-10"/>
+        <audioelement url="3.wav" id="track-11"/>
+        <audioelement url="3.wav" id="track-12"/>
+        <audioelement url="3.wav" id="track-13"/>
+        <audioelement url="3.wav" id="track-14"/>
+        <audioelement url="3.wav" id="track-15"/>
+        <audioelement url="2.wav" id="track-16" type="outside-reference"/>
 	</page>
 </waet>