# HG changeset patch # User Nicholas Jillings # Date 1450444809 0 # Node ID 7fd5b498d33c30104be85c4e1c943a114f766fe1 # Parent 8d1933818f723af2afa0fda70ad214b8c8233653 MUSHRA: Beginning work for scale options diff -r 8d1933818f72 -r 7fd5b498d33c mushra.css --- a/mushra.css Fri Dec 18 12:51:15 2015 +0000 +++ b/mushra.css Fri Dec 18 13:20:09 2015 +0000 @@ -35,6 +35,21 @@ background-color: #ddd } +div#slider-holder { + height: inherit; + position: absolute; + top: 125px; + left: 0px; + z-index: 2; +} + +div#scale-holder { + height: inherit; + position: absolute; + top: 125px; + left: 0px; + z-index: 3; +} div.track-slider { float: left; @@ -43,6 +58,7 @@ border-width: 1px; border-color: black; padding:2px; + margin-left: 50px; } div.track-slider-playing { diff -r 8d1933818f72 -r 7fd5b498d33c mushra.js --- a/mushra.js Fri Dec 18 12:51:15 2015 +0000 +++ b/mushra.js Fri Dec 18 13:20:09 2015 +0000 @@ -69,9 +69,16 @@ // Create a slider box var sliderBox = document.createElement('div'); sliderBox.style.width = "100%"; - sliderBox.style.height = window.innerHeight - 180 + 'px'; + sliderBox.style.height = window.innerHeight - 200+12 + 'px'; + sliderBox.style.marginBottom = '10px'; sliderBox.id = 'slider'; - sliderBox.align = "center"; + var scaleHolder = document.createElement('div'); + scaleHolder.id = "scale-holder"; + sliderBox.appendChild(scaleHolder); + var sliderObjectHolder = document.createElement('div'); + sliderObjectHolder.id = 'slider-holder'; + sliderObjectHolder.align = "center"; + sliderBox.appendChild(sliderObjectHolder); // Global parent for the comment boxes on the page var feedbackHolder = document.createElement('div'); @@ -109,7 +116,7 @@ document.getElementById("pageTitle").textContent = interfaceObj.title; } - var sliderBox = document.getElementById('slider'); + var sliderBox = document.getElementById('slider-holder'); feedbackHolder.innerHTML = null; sliderBox.innerHTML = null; @@ -160,7 +167,7 @@ var numObj = audioHolderObject.audioElements.length; var totalWidth = (numObj-1)*150+100; var diff = (window.innerWidth - totalWidth)/2; - audioEngineContext.audioObjects[0].interfaceDOM.holder.style.marginLeft = diff + 'px'; + sliderBox.style.marginLeft = diff + 'px'; } function sliderObject(audioObject) @@ -178,7 +185,10 @@ this.holder.appendChild(this.slider); this.holder.appendChild(this.play); this.holder.align = "center"; - this.holder.style.marginLeft = "50px"; + if (audioObject.id == 0) + { + this.holder.style.marginLeft = '0px'; + } this.holder.setAttribute('trackIndex',audioObject.id); this.title.textContent = audioObject.id; @@ -259,7 +269,8 @@ var totalWidth = (numObj-1)*150+100; var diff = (window.innerWidth - totalWidth)/2; document.getElementById('slider').style.height = window.innerHeight - 180 + 'px'; - audioEngineContext.audioObjects[0].interfaceDOM.holder.style.marginLeft = diff + 'px'; + if (diff <= 0){diff = 0;} + document.getElementById('slider-holder').style.marginLeft = diff + 'px'; for (var i in audioEngineContext.audioObjects) { audioEngineContext.audioObjects[i].interfaceDOM.resize(event);