# HG changeset patch
# User Nicholas Jillings <nicholas.jillings@mail.bcu.ac.uk>
# Date 1479133421 0
# Node ID 2577d983f291f65595c24e76f2ac75e55f0a9a27
# Parent  cc2364d8bc171bb494638b55f82058102f0338f3
Beautified entire project.

diff -r cc2364d8bc17 -r 2577d983f291 analysis/analysis.css
--- a/analysis/analysis.css	Mon Nov 14 12:14:48 2016 +0000
+++ b/analysis/analysis.css	Mon Nov 14 14:23:41 2016 +0000
@@ -5,12 +5,12 @@
 div.code {
     margin: 5px;
     padding-left: 15px;
-    background-color: rgb(200,200,200);
+    background-color: rgb(200, 200, 200);
     border: 2px dashed black;
 }
-table td tr{
+table td tr {
     padding: 5px;
 }
-div.filter-entry{
+div.filter-entry {
     padding: 5px;
-}
\ No newline at end of file
+}
diff -r cc2364d8bc17 -r 2577d983f291 analysis/analysis.js
--- a/analysis/analysis.js	Mon Nov 14 12:14:48 2016 +0000
+++ b/analysis/analysis.js	Mon Nov 14 14:23:41 2016 +0000
@@ -1,31 +1,26 @@
 /*
-* Analysis script for WAET
-*/
+ * Analysis script for WAET
+ */
 
 // Firefox does not have an XMLDocument.prototype.getElementsByName
 // and there is no searchAll style command, this custom function will
 // search all children recusrively for the name. Used for XSD where all
 // element nodes must have a name and therefore can pull the schema node
-XMLDocument.prototype.getAllElementsByName = function(name)
-{
+XMLDocument.prototype.getAllElementsByName = function (name) {
     name = String(name);
     var selected = this.documentElement.getAllElementsByName(name);
     return selected;
 }
 
-Element.prototype.getAllElementsByName = function(name)
-{
+Element.prototype.getAllElementsByName = function (name) {
     name = String(name);
     var selected = [];
     var node = this.firstElementChild;
-    while(node != null)
-    {
-        if (node.getAttribute('name') == name)
-        {
+    while (node != null) {
+        if (node.getAttribute('name') == name) {
             selected.push(node);
         }
-        if (node.childElementCount > 0)
-        {
+        if (node.childElementCount > 0) {
             selected = selected.concat(node.getAllElementsByName(name));
         }
         node = node.nextElementSibling;
@@ -33,26 +28,21 @@
     return selected;
 }
 
-XMLDocument.prototype.getAllElementsByTagName = function(name)
-{
+XMLDocument.prototype.getAllElementsByTagName = function (name) {
     name = String(name);
     var selected = this.documentElement.getAllElementsByTagName(name);
     return selected;
 }
 
-Element.prototype.getAllElementsByTagName = function(name)
-{
+Element.prototype.getAllElementsByTagName = function (name) {
     name = String(name);
     var selected = [];
     var node = this.firstElementChild;
-    while(node != null)
-    {
-        if (node.nodeName == name)
-        {
+    while (node != null) {
+        if (node.nodeName == name) {
             selected.push(node);
         }
-        if (node.childElementCount > 0)
-        {
+        if (node.childElementCount > 0) {
             selected = selected.concat(node.getAllElementsByTagName(name));
         }
         node = node.nextElementSibling;
@@ -62,15 +52,12 @@
 
 // Firefox does not have an XMLDocument.prototype.getElementsByName
 if (typeof XMLDocument.prototype.getElementsByName != "function") {
-    XMLDocument.prototype.getElementsByName = function(name)
-    {
+    XMLDocument.prototype.getElementsByName = function (name) {
         name = String(name);
         var node = this.documentElement.firstElementChild;
         var selected = [];
-        while(node != null)
-        {
-            if (node.getAttribute('name') == name)
-            {
+        while (node != null) {
+            if (node.getAttribute('name') == name) {
                 selected.push(node);
             }
             node = node.nextElementSibling;
@@ -80,41 +67,42 @@
 }
 
 var chartContext, testData;
-window.onload = function() {
+window.onload = function () {
     // Load the Visualization API and the corechart package.
-    google.charts.load('current', {'packages':['corechart']});
+    google.charts.load('current', {
+        'packages': ['corechart']
+    });
     chartContext = new Chart();
     testData = new Data();
 }
 
 function get(url) {
-  // Return a new promise.
-  return new Promise(function(resolve, reject) {
-    // Do the usual XHR stuff
-    var req = new XMLHttpRequest();
-    req.open('GET', url);
-    req.onload = function() {
-      // This is called even on 404 etc
-      // so check the status
-      if (req.status == 200) {
-        // Resolve the promise with the response text
-        resolve(req.response);
-      }
-      else {
-        // Otherwise reject with the status text
-        // which will hopefully be a meaningful error
-        reject(Error(req.statusText));
-      }
-    };
+    // Return a new promise.
+    return new Promise(function (resolve, reject) {
+        // Do the usual XHR stuff
+        var req = new XMLHttpRequest();
+        req.open('GET', url);
+        req.onload = function () {
+            // This is called even on 404 etc
+            // so check the status
+            if (req.status == 200) {
+                // Resolve the promise with the response text
+                resolve(req.response);
+            } else {
+                // Otherwise reject with the status text
+                // which will hopefully be a meaningful error
+                reject(Error(req.statusText));
+            }
+        };
 
-    // Handle network errors
-    req.onerror = function() {
-      reject(Error("Network Error"));
-    };
+        // Handle network errors
+        req.onerror = function () {
+            reject(Error("Network Error"));
+        };
 
-    // Make the request
-    req.send();
-  });
+        // Make the request
+        req.send();
+    });
 }
 
 function arrayMean(values) {
@@ -128,15 +116,17 @@
 
 function percentile(values, p) {
     //http://web.stanford.edu/class/archive/anthsci/anthsci192/anthsci192.1064/handouts/calculating%20percentiles.pdf
-    values.sort( function(a,b) {return a - b;} );
+    values.sort(function (a, b) {
+        return a - b;
+    });
     // get ordinal rank
-    var index = values.length*p/100;
+    var index = values.length * p / 100;
     var k = Math.floor(index);
     if (k == index) {
         return values[k];
     } else {
-        var f = index-k;
-        var x_int = (1-f)*values[k]+f*values[k+1];
+        var f = index - k;
+        var x_int = (1 - f) * values[k] + f * values[k + 1];
         return x_int;
     }
 }
@@ -166,19 +156,19 @@
 function boxplotRow(array) {
     // Take an array of element values and return array of computed intervals
     var result = {
-        median : percentile(array,50),
-        pct25 : percentile(array,25),
-        pct75 : percentile(array,75),
-        IQR : null,
+        median: percentile(array, 50),
+        pct25: percentile(array, 25),
+        pct75: percentile(array, 75),
+        IQR: null,
         min: null,
         max: null,
         outliers: new Array()
     }
-    result.IQR = result.pct75-result.pct25;
+    result.IQR = result.pct75 - result.pct25;
     var rest = [];
-    var pct75_IQR = result.pct75+1.5*result.IQR;
-    var pct25_IQR = result.pct25-1.5*result.IQR;
-    for (var i=0; i<array.length; i++) {
+    var pct75_IQR = result.pct75 + 1.5 * result.IQR;
+    var pct25_IQR = result.pct25 - 1.5 * result.IQR;
+    for (var i = 0; i < array.length; i++) {
         //outliers, ranger above pct75+1.5*IQR or below pct25-1.5*IQR
         var point = array[i];
         if (point > pct75_IQR || point < pct25_IQR) {
@@ -190,23 +180,27 @@
     result.max = arrayMax(rest);
     result.min = arrayMin(rest);
     return result;
-    
+
 }
 
-function arrayHistogram(values,steps,min,max) {
+function arrayHistogram(values, steps, min, max) {
     if (steps == undefined) {
         steps = 0.25;
         console.log("Warning: arrayHistogram called without steps size set, default to 0.25");
     }
-    if (min == undefined) {min = arrayMin(values);}
-    if (max == undefined) {max = arrayMax(values);}
+    if (min == undefined) {
+        min = arrayMin(values);
+    }
+    if (max == undefined) {
+        max = arrayMax(values);
+    }
     var histogram = [];
     var index = min;
-    while(index < max) {
+    while (index < max) {
         histogram.push({
             marker: index,
             lt: index,
-            rt: index+steps,
+            rt: index + steps,
             count: 0
         });
         index += steps;
@@ -225,13 +219,13 @@
 function Chart() {
     this.valueData;
     this.charts = [];
-    
-    this.chartObject = function(name) {
+
+    this.chartObject = function (name) {
         // Create the charting object
         this.name = name;
         this.root = document.createElement("div");
         this.root.className = "chart-holder";
-        this.root.setAttribute("name",name);
+        this.root.setAttribute("name", name);
         this.chartDOM = document.createElement("div");
         this.tableDOM = document.createElement("div");
         this.latexDOM = document.createElement("div");
@@ -242,30 +236,31 @@
         this.print = document.createElement("button");
         this.sortDataButton = document.createElement("button");
         this.sortDataButton.textContent = "Sort by Data";
-        this.sortDataButton.addEventListener("click",this);
-        this.sortDataButton.setAttribute("name","sort-data");
+        this.sortDataButton.addEventListener("click", this);
+        this.sortDataButton.setAttribute("name", "sort-data");
         this.sortNameButton = document.createElement("button");
         this.sortNameButton.textContent = "Sort by Name";
-        this.sortNameButton.addEventListener("click",this);
-        this.sortNameButton.setAttribute("name","sort-name");
-        this.draw = function() {
-            if (this.chart == undefined) {return;}
+        this.sortNameButton.addEventListener("click", this);
+        this.sortNameButton.setAttribute("name", "sort-name");
+        this.draw = function () {
+            if (this.chart == undefined) {
+                return;
+            }
             this.tableDOM.innerHTML = null;
             this.latexDOM.innerHTML = null;
             this.buildTable();
             this.writeLatex();
-            this.chart.draw(this.data,this.options);
+            this.chart.draw(this.data, this.options);
         }
-        this.sortData = function() {
+        this.sortData = function () {
             this.data.sort(1);
         }
-        this.sortName = function() {
+        this.sortName = function () {
             this.data.sort(0);
         }
-        this.handleEvent = function() {
+        this.handleEvent = function () {
             // Only used to handle the chart.event.addListener(this,'ready') callback
-            switch(event.currentTarget.getAttribute("name"))
-            {
+            switch (event.currentTarget.getAttribute("name")) {
                 case "download":
                     window.open(this.chart.getImageURI());
                     break;
@@ -279,7 +274,7 @@
                     break;
             }
         }
-        
+
         this.root.appendChild(this.chartDOM);
         this.root.appendChild(this.tableDOM);
         this.root.appendChild(this.latexDOM);
@@ -287,16 +282,15 @@
         this.root.appendChild(this.sortNameButton);
         this.root.appendChild(this.print);
         this.print.textContent = "Download";
-        this.print.setAttribute("name","download");
-        this.print.addEventListener("click",this);
+        this.print.setAttribute("name", "download");
+        this.print.addEventListener("click", this);
         this.root.appendChild(this.downloadDOM);
-        this.buildTable = function() {
+        this.buildTable = function () {
             var table = document.createElement("table");
             table.border = "1";
             var numRows = this.data.getNumberOfRows();
             var numColumns = this.data.getNumberOfColumns();
-            for (var columnIndex=0; columnIndex<numColumns; columnIndex++)
-            {
+            for (var columnIndex = 0; columnIndex < numColumns; columnIndex++) {
                 var tableTitle = this.data.getColumnLabel(columnIndex);
                 if (tableTitle != "") {
                     var table_row = document.createElement('tr');
@@ -304,13 +298,11 @@
                     var row_title = document.createElement('td');
                     table_row.appendChild(row_title);
                     row_title.textContent = tableTitle;
-                    for (var rowIndex=0; rowIndex<numRows; rowIndex++)
-                    {
+                    for (var rowIndex = 0; rowIndex < numRows; rowIndex++) {
                         var row_entry = document.createElement('td');
                         table_row.appendChild(row_entry);
-                        var entry = this.data.getValue(rowIndex,columnIndex);
-                        if (isFinite(Number(entry)))
-                        {
+                        var entry = this.data.getValue(rowIndex, columnIndex);
+                        if (isFinite(Number(entry))) {
                             entry = String(Number(entry).toFixed(4));
                         }
                         row_entry.textContent = entry;
@@ -319,7 +311,7 @@
             }
             this.tableDOM.appendChild(table);
         };
-        this.writeLatex = function() {
+        this.writeLatex = function () {
             var numRows = this.data.getNumberOfRows();
             var numColumns = this.data.getNumberOfColumns();
             var root = document.createElement("div");
@@ -329,25 +321,23 @@
             var start = document.createElement("p");
             start.textContent = "\\" + "begin{tabular}{|l|";
             holder.appendChild(start);
-            for (var i=0; i<numRows; i++) {
-                start.textContent = start.textContent+"c|";
+            for (var i = 0; i < numRows; i++) {
+                start.textContent = start.textContent + "c|";
             }
             start.textContent = start.textContent.concat("}");
             // Now write the rows:
-            for (var rIndex=0; rIndex<numColumns; rIndex++) {
+            for (var rIndex = 0; rIndex < numColumns; rIndex++) {
                 var tableTitle = this.data.getColumnLabel(rIndex);
-                if(tableTitle != "")
-                {
+                if (tableTitle != "") {
                     var row = document.createElement("p");
                     row.textContent = tableTitle.concat(" & ");
-                    for (var cIndex=0; cIndex<numRows; cIndex++) {
-                        var entry = this.data.getValue(cIndex,rIndex);
-                        if (isFinite(Number(entry)))
-                        {
+                    for (var cIndex = 0; cIndex < numRows; cIndex++) {
+                        var entry = this.data.getValue(cIndex, rIndex);
+                        if (isFinite(Number(entry))) {
                             entry = String(Number(entry).toFixed(4));
                         }
                         row.textContent = row.textContent.concat(entry);
-                        if (cIndex < numRows-1) {
+                        if (cIndex < numRows - 1) {
                             row.textContent = row.textContent.concat(" & ");
                         } else {
                             row.textContent = row.textContent.concat(" \\\\ \\hline");
@@ -364,86 +354,98 @@
             this.latexDOM.appendChild(root);
         }
     }
-    
-    this.clear = function() {
+
+    this.clear = function () {
         var inject = document.getElementById("test-pages");
         for (var chart of this.charts) {
             inject.removeChild(chart.root);
         }
         this.charts = [];
     }
-    
-    this.drawTestMean = function() {
+
+    this.drawTestMean = function () {
         // This draws one bargraph per axis with every test element on
         if (this.valueData == null) {
             console.log("Error - Data not loaded");
             return;
         }
         var chartList = [];
-        
+
         // Create the data table
         for (var page of this.valueData.pages) {
             for (var element of page.elements) {
                 for (var axis of element.axis) {
                     // Find the axis
-                    var axisChart = chartList.find(function(element,index,array){
-                        if (element.name == this) {return true;} else {return false;}
-                    },"mean-test-"+axis.name);
+                    var axisChart = chartList.find(function (element, index, array) {
+                        if (element.name == this) {
+                            return true;
+                        } else {
+                            return false;
+                        }
+                    }, "mean-test-" + axis.name);
                     if (axisChart == null) {
-                        axisChart = new this.chartObject("mean-test-"+axis.name);
+                        axisChart = new this.chartObject("mean-test-" + axis.name);
                         axisChart.options = {
-                            'title':'Mean of axis: '+axis.name,
-                            'width':window.innerWidth*0.9,
-                            'height':(window.innerWidth*0.9)/1.77
+                            'title': 'Mean of axis: ' + axis.name,
+                            'width': window.innerWidth * 0.9,
+                            'height': (window.innerWidth * 0.9) / 1.77
                         }
-                        axisChart.data.addColumn('string','id');
-                        axisChart.data.addColumn('number',axis.name);
+                        axisChart.data.addColumn('string', 'id');
+                        axisChart.data.addColumn('number', axis.name);
                         chartList.push(axisChart);
                         document.getElementById("test-pages").appendChild(axisChart.root);
                     }
                     var mean = arrayMean(axis.values);
-                    axisChart.data.addRow([element.id,mean]);
+                    axisChart.data.addRow([element.id, mean]);
                 }
             }
         }
-        
+
         // Build and push charts
         for (var chart of chartList) {
             chart.chart = new google.visualization.ColumnChart(chart.chartDOM);
-            chart.chart.draw(chart.data,chart.options);
+            chart.chart.draw(chart.data, chart.options);
             chart.buildTable();
             chart.writeLatex();
             this.charts.push(chart);
         }
     }
-    
-    this.drawTestBoxplot = function() {
+
+    this.drawTestBoxplot = function () {
         if (this.valueData == null) {
             console.log("Error - Data not loaded");
             return;
         }
         var chartList = [];
-        
+
         // Creates one chart per axis
-        
+
         // Create the data table
         for (var page of this.valueData.pages) {
             for (var element of page.elements) {
                 for (var axis of element.axis) {
                     // Find the axis
-                    var axisChart = chartList.find(function(element,index,array){
-                        if (element.name == this) {return true;} else {return false;}
-                    },"boxplot-test-"+axis.name);
+                    var axisChart = chartList.find(function (element, index, array) {
+                        if (element.name == this) {
+                            return true;
+                        } else {
+                            return false;
+                        }
+                    }, "boxplot-test-" + axis.name);
                     if (axisChart == null) {
                         // Axis chart doesn't exist
-                        axisChart = new this.chartObject("boxplot-test-"+axis.name);
+                        axisChart = new this.chartObject("boxplot-test-" + axis.name);
                         axisChart.options = {
-                            'title':'Boxplot of axis '+axis.name,
-                            'width':window.innerWidth*0.9,
-                            'height':(window.innerWidth*0.9)/1.77,
-                            legend: {position: 'none'},
+                            'title': 'Boxplot of axis ' + axis.name,
+                            'width': window.innerWidth * 0.9,
+                            'height': (window.innerWidth * 0.9) / 1.77,
+                            legend: {
+                                position: 'none'
+                            },
                             lineWidth: 0,
-                            series: [{'color': '#D3362D'}],
+                            series: [{
+                                'color': '#D3362D'
+                            }],
                             intervals: {
                                 barWidth: 1,
                                 boxWidth: 1,
@@ -463,32 +465,52 @@
                                 }
                             }
                         };
-                        axisChart.data.addColumn('string','id');
-                        axisChart.data.addColumn('number','median');
-                        axisChart.data.addColumn({id:'max',type:'number',role:'interval'});
-                        axisChart.data.addColumn({id:'min',type:'number',role:'interval'});
-                        axisChart.data.addColumn({id:'firstQuartile',type:'number',role:'interval'});
-                        axisChart.data.addColumn({id:'median',type:'number',role:'interval'});
-                        axisChart.data.addColumn({id:'thirdQuartile',type:'number',role:'interval'});
+                        axisChart.data.addColumn('string', 'id');
+                        axisChart.data.addColumn('number', 'median');
+                        axisChart.data.addColumn({
+                            id: 'max',
+                            type: 'number',
+                            role: 'interval'
+                        });
+                        axisChart.data.addColumn({
+                            id: 'min',
+                            type: 'number',
+                            role: 'interval'
+                        });
+                        axisChart.data.addColumn({
+                            id: 'firstQuartile',
+                            type: 'number',
+                            role: 'interval'
+                        });
+                        axisChart.data.addColumn({
+                            id: 'median',
+                            type: 'number',
+                            role: 'interval'
+                        });
+                        axisChart.data.addColumn({
+                            id: 'thirdQuartile',
+                            type: 'number',
+                            role: 'interval'
+                        });
                         chartList.push(axisChart);
                         document.getElementById("test-pages").appendChild(axisChart.root);
                     }
                     var result = boxplotRow(axis.values);
-                    axisChart.data.addRow([element.id,result.median,result.max,result.min,result.pct25,result.median,result.pct75]);
+                    axisChart.data.addRow([element.id, result.median, result.max, result.min, result.pct25, result.median, result.pct75]);
                 }
             }
         }
         // Build and push charts
         for (var chart of chartList) {
             chart.chart = new google.visualization.LineChart(chart.chartDOM);
-            chart.chart.draw(chart.data,chart.options);
+            chart.chart.draw(chart.data, chart.options);
             chart.buildTable();
             chart.writeLatex();
             this.charts.push(chart);
         }
     }
-    
-    this.drawPageMean = function() {
+
+    this.drawPageMean = function () {
         // First we must get the value data
         if (this.valueData == null) {
             console.log("Error - Data not loaded");
@@ -496,22 +518,22 @@
         }
         // We create one plot per page
         for (var page of this.valueData.pages) {
-            
+
             // Create the chart resulting point
-            var chart = new this.chartObject("mean-page-"+page.id);
+            var chart = new this.chartObject("mean-page-" + page.id);
             document.getElementById("test-pages").appendChild(chart.root);
-            
+
             // Create the data table
-            chart.data.addColumn('string','id');
+            chart.data.addColumn('string', 'id');
             // Get axis labels
             for (var axis of page.elements[0].axis) {
-                chart.data.addColumn('number',axis.name);
+                chart.data.addColumn('number', axis.name);
             }
             var rows = []; // Rows is an array of tuples [col1, col2, col3 ... colN];
             for (var element of page.elements) {
                 var entry = [element.id];
-                for (var i=0; i<page.elements[0].axis.length; i++) {
-                    var mean =0;
+                for (var i = 0; i < page.elements[0].axis.length; i++) {
+                    var mean = 0;
                     if (i < element.axis.length) {
                         var axis = element.axis[i];
                         mean = arrayMean(axis.values);
@@ -522,20 +544,20 @@
             }
             chart.data.addRows(rows);
             chart.options = {
-                'title':'Mean of page: '+page.id,
-                'width':800,
-                'height':700
-            }
-            // Draw the chart
+                    'title': 'Mean of page: ' + page.id,
+                    'width': 800,
+                    'height': 700
+                }
+                // Draw the chart
             chart.chart = new google.visualization.ColumnChart(chart.chartDOM);
-            chart.chart.draw(chart.data,chart.options);
+            chart.chart.draw(chart.data, chart.options);
             chart.buildTable();
             chart.writeLatex();
             this.charts.push(chart);
         }
     }
-    
-    this.drawElementHistogram = function() {
+
+    this.drawElementHistogram = function () {
         // First we must get the value data
         if (this.valueData == null) {
             console.log("Error - Data not loaded");
@@ -545,18 +567,17 @@
         for (var page of this.valueData.pages) {
             for (var element of page.elements) {
                 // Build the chart object
-                var chart = new this.chartObject("histogram-element-"+element.id);
+                var chart = new this.chartObject("histogram-element-" + element.id);
                 document.getElementById("test-pages").appendChild(chart.root);
-                chart.data.addColumn('string','index');
+                chart.data.addColumn('string', 'index');
                 var histograms = [];
                 for (var axis of element.axis) {
-                    chart.data.addColumn('number',axis.name);
-                    histograms.push(arrayHistogram(axis.values,0.125,0.0,1.0));
+                    chart.data.addColumn('number', axis.name);
+                    histograms.push(arrayHistogram(axis.values, 0.125, 0.0, 1.0));
                 }
                 for (var axis of element.axis) {
-                    for (var i=0; i<histograms[0].length; i++)
-                    {
-                        var entry = [""+histograms[0][i].lt.toPrecision(2)+"-"+histograms[0][i].rt.toPrecision(3)]
+                    for (var i = 0; i < histograms[0].length; i++) {
+                        var entry = ["" + histograms[0][i].lt.toPrecision(2) + "-" + histograms[0][i].rt.toPrecision(3)]
                         for (var histogram of histograms) {
                             entry.push(histogram[i].count);
                         }
@@ -564,14 +585,16 @@
                     }
                 }
                 chart.options = {
-                    'title':'Histogram of element: '+element.id,
-                    'width':800,
-                    'height':700,
-                    'bar':{'groupWidth': '100%'}
-                }
-                // Draw the chart
+                        'title': 'Histogram of element: ' + element.id,
+                        'width': 800,
+                        'height': 700,
+                        'bar': {
+                            'groupWidth': '100%'
+                        }
+                    }
+                    // Draw the chart
                 chart.chart = new google.visualization.ColumnChart(chart.chartDOM);
-                chart.chart.draw(chart.data,chart.options);
+                chart.chart.draw(chart.data, chart.options);
                 chart.buildTable();
                 chart.writeLatex();
                 this.charts.push(chart);
@@ -582,49 +605,51 @@
 
 function Data() {
     // This holds the link between the server side calculations and the client side visualisation of the data
-    
+
     // Dynamically generate the test filtering / page filterting tools
     var self = this;
     // Collect the test types and counts
     this.testSavedDiv = document.getElementById("test-saved");
     this.testSaves = null;
     this.selectURL = null;
-    
+
     this.specification = new Specification();
-    get("../xml/test-schema.xsd").then(function(response){
+    get("../xml/test-schema.xsd").then(function (response) {
         var parse = new DOMParser();
-        self.specification.schema = parse.parseFromString(response,'text/xml');
-    },function(error){
+        self.specification.schema = parse.parseFromString(response, 'text/xml');
+    }, function (error) {
         console.log("ERROR: Could not get Test Schema");
     });
-    this.update = function(url) {
+    this.update = function (url) {
         var self = this;
     }
-    
-    this.updateData = function(req_str) {
+
+    this.updateData = function (req_str) {
         // Now go get that data
-        get(req_str).then(function(response){
+        get(req_str).then(function (response) {
             // Returns the data
             chartContext.valueData = JSON.parse(response);
-        },function(error){console.error(error);});
+        }, function (error) {
+            console.error(error);
+        });
     }
 }
 
-var interfaceContext = new function() {
+var interfaceContext = new function () {
     // This creates the interface for the user to connect with the dynamic back-end to retrieve data
     this.rootDOM = document.createElement("div");
     this.getDataButton = {
         button: document.createElement("button"),
         parent: this,
-        handleEvent: function(event) {
+        handleEvent: function (event) {
             // Get the list of files:
-            var req_str = "../php/get_filtered_score.php"+this.parent.getFilterString();
+            var req_str = "../php/get_filtered_score.php" + this.parent.getFilterString();
             testData.updateData(req_str);
         }
     }
     this.getDataButton.button.textContent = "Get Filtered Data";
-    this.getDataButton.button.addEventListener("click",this.getDataButton);
-    
+    this.getDataButton.button.addEventListener("click", this.getDataButton);
+
     this.getRawScoreData = {
         root: document.createElement("div"),
         csvDOM: document.createElement("button"),
@@ -633,36 +658,42 @@
         presentDOM: document.createElement("div"),
         parent: this,
         XHR: new XMLHttpRequest(),
-        handleEvent: function(event) {
+        handleEvent: function (event) {
             this.presentDOM.innerHTML = null;
-            var url = "../php/get_filtered_score.php"+this.parent.getFilterString();
-            this.XHR.open("GET",url+"&format="+event.currentTarget.textContent,true);
-            switch(event.currentTarget.textContent) {
+            var url = "../php/get_filtered_score.php" + this.parent.getFilterString();
+            this.XHR.open("GET", url + "&format=" + event.currentTarget.textContent, true);
+            switch (event.currentTarget.textContent) {
                 case "CSV":
-                    this.XHR.onload = function() {
+                    this.XHR.onload = function () {
                         var file = [this.response];
-                        var bb = new Blob(file,{type: 'text/csv'});
-                        this.parent.presentDOM.appendChild( this.parent.generateLink(bb,"scores.csv") );
+                        var bb = new Blob(file, {
+                            type: 'text/csv'
+                        });
+                        this.parent.presentDOM.appendChild(this.parent.generateLink(bb, "scores.csv"));
                     }
                     break;
                 case "JSON":
-                    this.XHR.onload = function() {
+                    this.XHR.onload = function () {
                         var file = [this.response];
-                        var bb = new Blob(file,{type: 'application/json'});
-                        this.parent.presentDOM.appendChild( this.parent.generateLink(bb,"scores.json") );
+                        var bb = new Blob(file, {
+                            type: 'application/json'
+                        });
+                        this.parent.presentDOM.appendChild(this.parent.generateLink(bb, "scores.json"));
                     }
                     break;
                 case "XML":
-                    this.XHR.onload = function() {
+                    this.XHR.onload = function () {
                         var file = [this.response];
-                        var bb = new Blob(file,{type: 'text/xml'});
-                        this.parent.presentDOM.appendChild( this.parent.generateLink(bb,"scores.xml") );
+                        var bb = new Blob(file, {
+                            type: 'text/xml'
+                        });
+                        this.parent.presentDOM.appendChild(this.parent.generateLink(bb, "scores.xml"));
                     }
                     break;
             }
             this.XHR.send();
         },
-        generateLink: function(blob,filename) {
+        generateLink: function (blob, filename) {
             var dnlk = window.URL.createObjectURL(blob);
             var a = document.createElement("a");
             a.hidden = '';
@@ -672,28 +703,28 @@
             return a;
         }
     }
-    
+
     this.getRawScoreData.root.appendChild(this.getRawScoreData.csvDOM);
     this.getRawScoreData.root.appendChild(this.getRawScoreData.jsonDOM);
     this.getRawScoreData.root.appendChild(this.getRawScoreData.xmlDOM);
     this.getRawScoreData.root.appendChild(this.getRawScoreData.presentDOM);
     this.getRawScoreData.XHR.parent = this.getRawScoreData;
     this.getRawScoreData.csvDOM.textContent = 'CSV';
-    this.getRawScoreData.csvDOM.addEventListener('click',this.getRawScoreData);
+    this.getRawScoreData.csvDOM.addEventListener('click', this.getRawScoreData);
     this.getRawScoreData.jsonDOM.textContent = 'JSON';
-    this.getRawScoreData.jsonDOM.addEventListener('click',this.getRawScoreData);
+    this.getRawScoreData.jsonDOM.addEventListener('click', this.getRawScoreData);
     this.getRawScoreData.xmlDOM.textContent = 'XML';
-    this.getRawScoreData.xmlDOM.addEventListener('click',this.getRawScoreData);
-    
+    this.getRawScoreData.xmlDOM.addEventListener('click', this.getRawScoreData);
+
     this.testSaves = {
         json: null,
         selectedURL: null,
         inputs: [],
         parent: this
     };
-    this.init = function() {
+    this.init = function () {
         var self = this;
-        get('../php/get_tests.php?format=JSON').then(function(response){
+        get('../php/get_tests.php?format=JSON').then(function (response) {
             document.getElementById("test-saved").innerHTML = null;
             var table = document.createElement("table");
             table.innerHTML = "<tr><td>Test Filename</td><td>Count</td><td>Include</td></tr>";
@@ -710,50 +741,52 @@
                 var obj = {
                     root: document.createElement("input"),
                     parent: self.testSaves,
-                    handleEvent: function(event) {
+                    handleEvent: function (event) {
                         this.parent.selectedURL = event.currentTarget.getAttribute("source");
                         var self = this;
-                        get(this.parent.selectedURL).then(function(response){
+                        get(this.parent.selectedURL).then(function (response) {
                             var parse = new DOMParser();
-                            testData.specification.decode(parse.parseFromString(response,'text/xml'));
+                            testData.specification.decode(parse.parseFromString(response, 'text/xml'));
                             self.parent.parent.generateFilters(testData.specification);
                             self.parent.parent.getFileCount();
                             return true;
-                        },function(error){
-                            console.log("ERROR: Could not get"+url);
+                        }, function (error) {
+                            console.log("ERROR: Could not get" + url);
                             return false;
                         });
                     }
                 }
                 obj.root.type = "radio";
                 obj.root.name = "test-include";
-                obj.root.setAttribute("source",test.testName);
-                obj.root.addEventListener("change",obj);
+                obj.root.setAttribute("source", test.testName);
+                obj.root.addEventListener("change", obj);
                 tableRowInclude.appendChild(obj.root);
                 tableRow.appendChild(tableRowInclude);
                 table.appendChild(tableRow);
                 self.testSaves.inputs.push(obj);
             }
             document.getElementById("test-saved").appendChild(table);
-        },function(error){console.error(error);});
+        }, function (error) {
+            console.error(error);
+        });
     }
-    
+
     this.filterDOM = document.createElement("div");
     this.filterDOM.innerHTML = "<p>PreTest Filters</p><div id='filter-count'></div>";
     this.filterObjects = [];
-    this.generateFilters = function(specification) {
+    this.generateFilters = function (specification) {
         // Filters are based on the pre and post global surverys
-        var FilterObject = function(parent,specification) {
+        var FilterObject = function (parent, specification) {
             this.parent = parent;
             this.specification = specification;
             this.rootDOM = document.createElement("div");
-            this.rootDOM.innerHTML = "<span>ID: "+specification.id+", Type: "+specification.type+"</span>";
+            this.rootDOM.innerHTML = "<span>ID: " + specification.id + ", Type: " + specification.type + "</span>";
             this.rootDOM.className = "filter-entry";
-            this.handleEvent = function(event) {
-                switch(this.specification.type) {
+            this.handleEvent = function (event) {
+                switch (this.specification.type) {
                     case "number":
                         var name = event.currentTarget.name;
-                        eval("this."+name+" = event.currentTarget.value");
+                        eval("this." + name + " = event.currentTarget.value");
                         break;
                     case "checkbox":
                         break;
@@ -762,29 +795,29 @@
                 }
                 this.parent.getFileCount();
             }
-            this.getFilterPairs = function() {
+            this.getFilterPairs = function () {
                 var pairs = [];
-                switch(this.specification.type) {
+                switch (this.specification.type) {
                     case "number":
                         if (this.min != "") {
-                            pairs.push([specification.id+"-min",this.min]);
+                            pairs.push([specification.id + "-min", this.min]);
                         }
                         if (this.max != "") {
-                            pairs.push([specification.id+"-max",this.max]);
+                            pairs.push([specification.id + "-max", this.max]);
                         }
                         break;
                     case "radio":
                     case "checkbox":
-                        for (var i=0; i<this.options.length; i++) {
+                        for (var i = 0; i < this.options.length; i++) {
                             if (!this.options[i].checked) {
-                                pairs.push([specification.id+"-exclude-"+i,specification.options[i].name]);
+                                pairs.push([specification.id + "-exclude-" + i, specification.options[i].name]);
                             }
                         }
                         break;
                 }
                 return pairs;
             }
-            switch(specification.type) {
+            switch (specification.type) {
                 case "number":
                     // Number can be ranged by min/max levels
                     this.min = "";
@@ -792,18 +825,18 @@
                     this.minDOM = document.createElement("input");
                     this.minDOM.type = "number";
                     this.minDOM.name = "min";
-                    this.minDOM.addEventListener("change",this);
+                    this.minDOM.addEventListener("change", this);
                     this.minDOMText = document.createElement("span");
                     this.minDOMText.textContent = "Minimum: ";
                     var pairHolder = document.createElement("div");
                     pairHolder.appendChild(this.minDOMText);
                     pairHolder.appendChild(this.minDOM);
                     this.rootDOM.appendChild(pairHolder);
-                    
+
                     this.maxDOM = document.createElement("input");
                     this.maxDOM.type = "number";
                     this.maxDOM.name = "max";
-                    this.maxDOM.addEventListener("change",this);
+                    this.maxDOM.addEventListener("change", this);
                     this.maxDOMText = document.createElement("span");
                     this.maxDOMText.textContent = "Maximum: ";
                     var pairHolder = document.createElement("div");
@@ -814,16 +847,16 @@
                 case "radio":
                 case "checkbox":
                     this.options = [];
-                    for (var i=0; i<specification.options.length; i++) {
+                    for (var i = 0; i < specification.options.length; i++) {
                         var option = specification.options[i];
                         var pairHolder = document.createElement("div");
                         var text = document.createElement("span");
                         text.textContent = option.text;
                         var check = document.createElement("input");
                         check.type = "checkbox";
-                        check.setAttribute("option-index",i);
+                        check.setAttribute("option-index", i);
                         check.checked = true;
-                        check.addEventListener("click",this);
+                        check.addEventListener("click", this);
                         this.options.push(check);
                         pairHolder.appendChild(text);
                         pairHolder.appendChild(check);
@@ -835,18 +868,18 @@
             }
         }
         var options = [];
-        if(specification.preTest) {
+        if (specification.preTest) {
             options = options.concat(specification.preTest.options);
         }
         if (specification.postTest) {
             options = options.concat(specification.postTest.options);
         }
         for (var survey_entry of options) {
-            switch(survey_entry.type) {
+            switch (survey_entry.type) {
                 case "number":
                 case "radio":
                 case "checkbox":
-                    var node = new FilterObject(this,survey_entry);
+                    var node = new FilterObject(this, survey_entry);
                     this.filterObjects.push(node);
                     this.filterDOM.appendChild(node.rootDOM);
                     break;
@@ -858,41 +891,41 @@
         document.getElementById("test-saved").appendChild(this.getDataButton.button);
         document.getElementById("test-saved").appendChild(this.getRawScoreData.root);
     }
-    this.getFilterString = function() {
+    this.getFilterString = function () {
         var pairs = [];
         for (var obj of this.filterObjects) {
             pairs = pairs.concat(obj.getFilterPairs());
         }
-        var req_str = "?url="+this.testSaves.selectedURL;
+        var req_str = "?url=" + this.testSaves.selectedURL;
         var index = 0;
-        while(pairs[index] != undefined) {
+        while (pairs[index] != undefined) {
             req_str += '&';
-            req_str += pairs[index][0]+"="+pairs[index][1];
+            req_str += pairs[index][0] + "=" + pairs[index][1];
             index++;
         }
         return req_str;
     }
-    this.getFilteredUrlArray = function() {
-        var req_str = "../php/get_filtered_count.php"+this.getFilterString();
-        return get(req_str).then(function(response){
+    this.getFilteredUrlArray = function () {
+        var req_str = "../php/get_filtered_count.php" + this.getFilterString();
+        return get(req_str).then(function (response) {
             var urls = JSON.parse(response);
             return urls.urls;
-        },function(error){
+        }, function (error) {
             console.error(error);
         });
     }
-    this.getFileCount = function() {
+    this.getFileCount = function () {
         // First we must get the filter pairs
-        this.getFilteredUrlArray().then(function(response){
-            var str = "Filtered to "+response.length+" file";
+        this.getFilteredUrlArray().then(function (response) {
+            var str = "Filtered to " + response.length + " file";
             if (response.length != 1) {
                 str += "s.";
             } else {
                 str += ".";
             }
             document.getElementById("filter-count").textContent = str;
-        },function(error){});
+        }, function (error) {});
     }
-    
+
     this.init();
-}
\ No newline at end of file
+}
diff -r cc2364d8bc17 -r 2577d983f291 analysis/index.html
--- a/analysis/index.html	Mon Nov 14 12:14:48 2016 +0000
+++ b/analysis/index.html	Mon Nov 14 14:23:41 2016 +0000
@@ -1,29 +1,32 @@
 <html lang="en">
-    <head>
-        <meta charset="utf-8" />
-        <link rel='stylesheet' href="analysis.css" type="text/css"/>
-        <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
-        <script type="text/javascript" src="analysis.js"></script>
-        <script type="text/javascript" src="../js/specification.js"></script>
-    </head>
-    <body>
-        <h1>Web Audio Evaluation Toolbox: Analysis</h1>
-        <div id="test-saved"></div>
-        <button onclick="chartContext.clear();">Clear Charts</button>
-        <div id="test-charts">
-            <p>Charts per test</p>
-            <button onclick="chartContext.drawTestMean();">Means</button>
-            <button onclick="chartContext.drawTestBoxplot();">Boxplot</button>
-        </div>
-        <div id="page-charts">
-            <p>Charts per test page</p>
-            <button onclick="chartContext.drawPageMean();">Means</button>
-        </div>
-        <div id="element-charts">
-            <p>Charts per element</p>
-            <button onclick="chartContext.drawElementHistogram();">Histogram</button>
-        </div>
-        
-        <div id="test-pages"></div>
-    </body>
-</html>
\ No newline at end of file
+
+<head>
+    <meta charset="utf-8" />
+    <link rel='stylesheet' href="analysis.css" type="text/css" />
+    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
+    <script type="text/javascript" src="analysis.js"></script>
+    <script type="text/javascript" src="../js/specification.js"></script>
+</head>
+
+<body>
+    <h1>Web Audio Evaluation Toolbox: Analysis</h1>
+    <div id="test-saved"></div>
+    <button onclick="chartContext.clear();">Clear Charts</button>
+    <div id="test-charts">
+        <p>Charts per test</p>
+        <button onclick="chartContext.drawTestMean();">Means</button>
+        <button onclick="chartContext.drawTestBoxplot();">Boxplot</button>
+    </div>
+    <div id="page-charts">
+        <p>Charts per test page</p>
+        <button onclick="chartContext.drawPageMean();">Means</button>
+    </div>
+    <div id="element-charts">
+        <p>Charts per element</p>
+        <button onclick="chartContext.drawElementHistogram();">Histogram</button>
+    </div>
+
+    <div id="test-pages"></div>
+</body>
+
+</html>
diff -r cc2364d8bc17 -r 2577d983f291 index.html
--- a/index.html	Mon Nov 14 12:14:48 2016 +0000
+++ b/index.html	Mon Nov 14 14:23:41 2016 +0000
@@ -1,55 +1,57 @@
 <!DOCTYPE html>
 <html lang="en">
-    <head>
-		<meta http-equiv="content-type" content="text/html; charset=utf-8">
 
+<head>
+    <meta http-equiv="content-type" content="text/html; charset=utf-8">
 
-		<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
+
+    <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
 		Remove this if you use the .htaccess -->
-		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
 
-		<title>Web Audio Evaluation Tool</title>
-		<meta name="description" content="" />
-		<meta name="author" content="" />
-		
-		<!-- Load up the default core JS and CSS files-->
-		<link rel='stylesheet' type='text/css' href='css/core.css'>
-		<!-- Use jQuery hosted from Google CDN -->
-		<!--<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>-->
-		<script type="text/javascript" src="js/jquery-2.1.4.js"></script>
-        <script type="text/javascript" src="js/loader.js"></script>
-	</head>
+    <title>Web Audio Evaluation Tool</title>
+    <meta name="description" content="" />
+    <meta name="author" content="" />
 
-	<body>
-		<div id='topLevelBody'>
-			<h1>Web Audio Evaluation Tool</h1>
-			<h2>Start menu </h2>
-			<ul>
-				<li><a href="test.html?url=tests/examples/project.xml" target="_blank">APE interface test example</a></li>
-				<li><a href="test.html?url=tests/examples/mushra_example.xml" target="_blank">MUSHRA interface test example</a></li>
-				<li><a href="test.html?url=tests/examples/AB_example.xml" target="_blank">AB interface test example</a></li>
-				<li><a href="test.html?url=tests/examples/horizontal_example.xml" target="_blank">Horizontal interface test example</a></li>
-				<li><a href="test.html?url=tests/examples/radio_example.xml" target="_blank">Radio interface test example</a></li>
-				<li><a href="test_create.html" target="_blank">Test creator</a></li>
-				<li><a href="analyse.html" target="_blank">Analysis and diagnostics of results</a></li>
-			</ul>
-			<br>
-			<ul>
-				<li><a href="LICENSE.txt" target="_blank">License</a></li>
-				<li><a href="CITING.txt" target="_blank">Citing</a></li>
-				<li><a href="docs/Instructions/Instructions.pdf" target="_blank">Instructions</a></li>
-			</ul>
-		</div>
-        <div id="popupHolder" class="popupHolder" style="visibility: hidden">
-            <div id="popupContent">
-                <div id="popupTitleHolder">
-                    <span id="popupTitle"></span>
-                </div>
-                <div id="popupResponse"></div>
+    <!-- Load up the default core JS and CSS files-->
+    <link rel='stylesheet' type='text/css' href='css/core.css'>
+    <!-- Use jQuery hosted from Google CDN -->
+    <!--<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>-->
+    <script type="text/javascript" src="js/jquery-2.1.4.js"></script>
+    <script type="text/javascript" src="js/loader.js"></script>
+</head>
+
+<body>
+    <div id='topLevelBody'>
+        <h1>Web Audio Evaluation Tool</h1>
+        <h2>Start menu </h2>
+        <ul>
+            <li><a href="test.html?url=tests/examples/project.xml" target="_blank">APE interface test example</a></li>
+            <li><a href="test.html?url=tests/examples/mushra_example.xml" target="_blank">MUSHRA interface test example</a></li>
+            <li><a href="test.html?url=tests/examples/AB_example.xml" target="_blank">AB interface test example</a></li>
+            <li><a href="test.html?url=tests/examples/horizontal_example.xml" target="_blank">Horizontal interface test example</a></li>
+            <li><a href="test.html?url=tests/examples/radio_example.xml" target="_blank">Radio interface test example</a></li>
+            <li><a href="test_create.html" target="_blank">Test creator</a></li>
+            <li><a href="analyse.html" target="_blank">Analysis and diagnostics of results</a></li>
+        </ul>
+        <br>
+        <ul>
+            <li><a href="LICENSE.txt" target="_blank">License</a></li>
+            <li><a href="CITING.txt" target="_blank">Citing</a></li>
+            <li><a href="docs/Instructions/Instructions.pdf" target="_blank">Instructions</a></li>
+        </ul>
+    </div>
+    <div id="popupHolder" class="popupHolder" style="visibility: hidden">
+        <div id="popupContent">
+            <div id="popupTitleHolder">
+                <span id="popupTitle"></span>
             </div>
-            <button id="popup-proceed" class="popupButton">Next</button>
-            <button id="popup-previous" class="popupButton">Back</button>
+            <div id="popupResponse"></div>
         </div>
-        <div class="testHalt" style="visibility: hidden"></div>
-	</body>
+        <button id="popup-proceed" class="popupButton">Next</button>
+        <button id="popup-previous" class="popupButton">Back</button>
+    </div>
+    <div class="testHalt" style="visibility: hidden"></div>
+</body>
+
 </html>
diff -r cc2364d8bc17 -r 2577d983f291 interfaces/AB.css
--- a/interfaces/AB.css	Mon Nov 14 12:14:48 2016 +0000
+++ b/interfaces/AB.css	Mon Nov 14 14:23:41 2016 +0000
@@ -1,95 +1,79 @@
 body {
-	/* Set the background colour (note US English spelling) to grey*/
-	background-color: #fff
+    /* Set the background colour (note US English spelling) to grey*/
+    background-color: #fff
 }
-
 div.pageTitle {
-	width: auto;
-	height: 20px;
-	margin: 10px 0px;
+    width: auto;
+    height: 20px;
+    margin: 10px 0px;
 }
-
-div.pageTitle span{
-	font-size: 1.5em;
+div.pageTitle span {
+    font-size: 1.5em;
 }
-
 button {
-	/* Specify any button structure or style */
-	min-width: 20px;
-	background-color: #ddd
+    /* Specify any button structure or style */
+    min-width: 20px;
+    background-color: #ddd
 }
-
 button.big-button {
-	width: 250px;
-	height: 40px;
-	font-size: 1.2em;
+    width: 250px;
+    height: 40px;
+    font-size: 1.2em;
 }
-
 div.interface-buttons {
     height: 40px;
 }
-
 div#outside-reference-holder {
     display: flex;
     align-content: center;
     justify-content: center;
     margin-bottom: 5px;
 }
-
 button.outside-reference {
     height: 40px;
     position: inherit;
     margin: 0px 5px;
 }
-
 div.comparator-holder {
-	width: 260px;
-	height: 300px;
-	border:  black 1px solid;
+    width: 260px;
+    height: 300px;
+    border: black 1px solid;
     float: left;
-	padding-top: 5px;
+    padding-top: 5px;
     margin: 25px;
 }
-
 div.comparator-selector {
-	width: 248px;
-	height: 250px;
-	border: black 1px solid;
-	position: relative;
-	background-color: #FF0000;
+    width: 248px;
+    height: 250px;
+    border: black 1px solid;
+    position: relative;
+    background-color: #FF0000;
     border-radius: 20px;
 }
-
 div.disabled {
-	background-color: #AAA;
+    background-color: #AAA;
 }
-
 div.selected {
-	background-color: #008000;
+    background-color: #008000;
 }
-
 div.comparator-selector span {
-	font-size: 4em;
+    font-size: 4em;
 }
-
 button.comparator-button {
-	width: 250px;
-	height: 38px;
-	position: relative;
-	margin-top: 5px;
+    width: 250px;
+    height: 38px;
+    position: relative;
+    margin-top: 5px;
 }
-
 div.playhead {
     margin: 5px;
 }
-
 div#page-count {
     float: left;
     margin: 0px 5px;
 }
-
 div#master-volume-holder {
     position: absolute;
     top: 10px;
     left: 120px;
-}
\ No newline at end of file
+}
diff -r cc2364d8bc17 -r 2577d983f291 interfaces/ABX.css
--- a/interfaces/ABX.css	Mon Nov 14 12:14:48 2016 +0000
+++ b/interfaces/ABX.css	Mon Nov 14 14:23:41 2016 +0000
@@ -1,80 +1,66 @@
 body {
-	/* Set the background colour (note US English spelling) to grey*/
-	background-color: #fff
+    /* Set the background colour (note US English spelling) to grey*/
+    background-color: #fff
 }
-
 div.pageTitle {
-	width: auto;
-	height: 20px;
-	margin-top: 20px;
+    width: auto;
+    height: 20px;
+    margin-top: 20px;
 }
-
-div.pageTitle span{
-	font-size: 1.5em;
+div.pageTitle span {
+    font-size: 1.5em;
 }
-
 button {
-	/* Specify any button structure or style */
-	min-width: 20px;
-	background-color: #ddd
+    /* Specify any button structure or style */
+    min-width: 20px;
+    background-color: #ddd
 }
-
 button.big-button {
-	width: 250px;
-	height: 40px;
-	font-size: 1.2em;
+    width: 250px;
+    height: 40px;
+    font-size: 1.2em;
 }
-
 div.comparator-holder {
-	width: 260px;
-	height: 300px;
-	border:  black 1px solid;
+    width: 260px;
+    height: 300px;
+    border: black 1px solid;
     float: left;
-	padding-top: 5px;
+    padding-top: 5px;
     margin: 25px;
 }
-
 div.comparator-selector {
-	width: 248px;
-	height: 250px;
-	border: black 1px solid;
-	position: relative;
-	background-color: #FF0000;
+    width: 248px;
+    height: 250px;
+    border: black 1px solid;
+    position: relative;
+    background-color: #FF0000;
     border-radius: 20px;
 }
-
 div.disabled {
-	background-color: #AAA;
+    background-color: #AAA;
 }
-
 div.selected {
-	background-color: #008000;
+    background-color: #008000;
 }
-
-div.comparator-selector.inactive{
-	background-color: yellow !important;
+div.comparator-selector.inactive {
+    background-color: yellow !important;
 }
-
 div.comparator-selector span {
-	font-size: 4em;
+    font-size: 4em;
 }
-
 button.comparator-button {
-	width: 250px;
-	height: 38px;
-	position: relative;
-	margin-top: 5px;
+    width: 250px;
+    height: 38px;
+    position: relative;
+    margin-top: 5px;
 }
-
 div.playhead {
     margin: 5px;
 }
-
 div#page-count {
     float: left;
     margin: 0px 5px;
 }
-
 div#master-volume-holder {
     position: absolute;
     top: 10px;
diff -r cc2364d8bc17 -r 2577d983f291 interfaces/ABX.js
--- a/interfaces/ABX.js	Mon Nov 14 12:14:48 2016 +0000
+++ b/interfaces/ABX.js	Mon Nov 14 14:23:41 2016 +0000
@@ -7,12 +7,12 @@
 loadInterface();
 
 function loadInterface() {
-	// Use this to do any one-time page / element construction. For instance, placing any stationary text objects,
-	// holding div's, or setting up any nodes which are present for the entire test sequence
-    
+    // Use this to do any one-time page / element construction. For instance, placing any stationary text objects,
+    // holding div's, or setting up any nodes which are present for the entire test sequence
+
     interfaceContext.insertPoint.innerHTML = ""; // Clear the current schema
-    
-    Interface.prototype.checkScaleRange = function(min, max) {
+
+    Interface.prototype.checkScaleRange = function (min, max) {
         var page = testState.getCurrentTestPage();
         var audioObjects = audioEngineContext.audioObjects;
         var state = true;
@@ -21,151 +21,149 @@
         var maxRanking = -Infinity;
         for (var ao of audioObjects) {
             var rank = ao.interfaceDOM.getValue();
-            if (rank < minRanking) {minRanking = rank;}
-            if (rank > maxRanking) {maxRanking = rank;}
+            if (rank < minRanking) {
+                minRanking = rank;
+            }
+            if (rank > maxRanking) {
+                maxRanking = rank;
+            }
         }
-        if (maxRanking*100 < max) {
+        if (maxRanking * 100 < max) {
             str += "At least one fragment must be selected."
             state = false;
         }
         if (!state) {
             console.log(str);
             this.storeErrorNode(str);
-            interfaceContext.lightbox.post("Message",str);
+            interfaceContext.lightbox.post("Message", str);
         }
         return state;
     }
-    
+
     // Custom comparator Object
-	Interface.prototype.comparator = null;
-    
+    Interface.prototype.comparator = null;
+
     // The injection point into the HTML page
-	interfaceContext.insertPoint = document.getElementById("topLevelBody");
-	var testContent = document.createElement('div');
-	testContent.id = 'testContent';
-    
+    interfaceContext.insertPoint = document.getElementById("topLevelBody");
+    var testContent = document.createElement('div');
+    testContent.id = 'testContent';
+
     // Create the top div for the Title element
-	var titleAttr = specification.title;
-	var title = document.createElement('div');
-	title.className = "title";
-	title.align = "center";
-	var titleSpan = document.createElement('span');
+    var titleAttr = specification.title;
+    var title = document.createElement('div');
+    title.className = "title";
+    title.align = "center";
+    var titleSpan = document.createElement('span');
     titleSpan.id = "test-title";
-    
+
     // Set title to that defined in XML, else set to default
-	if (titleAttr != undefined) {
-		titleSpan.textContent = titleAttr;
-	} else {
-		titleSpan.textContent =  'Listening test';
-	}
-	// Insert the titleSpan element into the title div element.
-	title.appendChild(titleSpan);
-    
+    if (titleAttr != undefined) {
+        titleSpan.textContent = titleAttr;
+    } else {
+        titleSpan.textContent = 'Listening test';
+    }
+    // Insert the titleSpan element into the title div element.
+    title.appendChild(titleSpan);
+
     var pagetitle = document.createElement('div');
-	pagetitle.className = "pageTitle";
-	pagetitle.align = "center";
-	var titleSpan = document.createElement('span');
-	titleSpan.id = "pageTitle";
-	pagetitle.appendChild(titleSpan);
-	
-	// Create Interface buttons!
-	var interfaceButtons = document.createElement('div');
-	interfaceButtons.id = 'interface-buttons';
-	interfaceButtons.style.height = '25px';
-	
-	// Create playback start/stop points
-	var playback = document.createElement("button");
-	playback.innerHTML = 'Stop';
-	playback.id = 'playback-button';
-	playback.style.float = 'left';
-	// onclick function. Check if it is playing or not, call the correct function in the
-	// audioEngine, change the button text to reflect the next state.
-	playback.onclick = function() {
-		if (audioEngineContext.status == 1) {
-			audioEngineContext.stop();
-			this.innerHTML = 'Stop';
+    pagetitle.className = "pageTitle";
+    pagetitle.align = "center";
+    var titleSpan = document.createElement('span');
+    titleSpan.id = "pageTitle";
+    pagetitle.appendChild(titleSpan);
+
+    // Create Interface buttons!
+    var interfaceButtons = document.createElement('div');
+    interfaceButtons.id = 'interface-buttons';
+    interfaceButtons.style.height = '25px';
+
+    // Create playback start/stop points
+    var playback = document.createElement("button");
+    playback.innerHTML = 'Stop';
+    playback.id = 'playback-button';
+    playback.style.float = 'left';
+    // onclick function. Check if it is playing or not, call the correct function in the
+    // audioEngine, change the button text to reflect the next state.
+    playback.onclick = function () {
+        if (audioEngineContext.status == 1) {
+            audioEngineContext.stop();
+            this.innerHTML = 'Stop';
             var time = audioEngineContext.timer.getTestTime();
             console.log('Stopped at ' + time); // DEBUG/SAFETY
-		}
-	};
-	// Append the interface buttons into the interfaceButtons object.
-	interfaceButtons.appendChild(playback);
-	
-	// Global parent for the comment boxes on the page
-	var feedbackHolder = document.createElement('div');
-	feedbackHolder.id = 'feedbackHolder';
-	
-	// Construct the AB Boxes
-	var boxes = document.createElement('div');
-	boxes.align = "center";
-	boxes.id = "box-holders";
+        }
+    };
+    // Append the interface buttons into the interfaceButtons object.
+    interfaceButtons.appendChild(playback);
+
+    // Global parent for the comment boxes on the page
+    var feedbackHolder = document.createElement('div');
+    feedbackHolder.id = 'feedbackHolder';
+
+    // Construct the AB Boxes
+    var boxes = document.createElement('div');
+    boxes.align = "center";
+    boxes.id = "box-holders";
     boxes.style.float = "left";
-	
-	var submit = document.createElement('button');
-	submit.id = "submit";
-	submit.onclick = buttonSubmitClick;
-	submit.className = "big-button";
-	submit.textContent = "submit";
-	submit.style.position = "relative";
-	submit.style.left = (window.innerWidth-250)/2 + 'px';
-		
-	feedbackHolder.appendChild(boxes);
-    
+
+    var submit = document.createElement('button');
+    submit.id = "submit";
+    submit.onclick = buttonSubmitClick;
+    submit.className = "big-button";
+    submit.textContent = "submit";
+    submit.style.position = "relative";
+    submit.style.left = (window.innerWidth - 250) / 2 + 'px';
+
+    feedbackHolder.appendChild(boxes);
+
     // Create holder for comment boxes
     var comments = document.createElement("div");
     comments.id = "comment-box-holder";
-	
-	// Inject into HTML
-	testContent.appendChild(title); // Insert the title
-	testContent.appendChild(pagetitle);
-	testContent.appendChild(interfaceButtons);
-	testContent.appendChild(feedbackHolder);
-	testContent.appendChild(submit);
+
+    // Inject into HTML
+    testContent.appendChild(title); // Insert the title
+    testContent.appendChild(pagetitle);
+    testContent.appendChild(interfaceButtons);
+    testContent.appendChild(feedbackHolder);
+    testContent.appendChild(submit);
     testContent.appendChild(comments);
-	interfaceContext.insertPoint.appendChild(testContent);
+    interfaceContext.insertPoint.appendChild(testContent);
 
-	// Load the full interface
-	testState.initialise();
-	testState.advanceState();
+    // Load the full interface
+    testState.initialise();
+    testState.advanceState();
 };
 
-function loadTest(page)
-{
-	// Called each time a new test page is to be build. The page specification node is the only item passed in
+function loadTest(page) {
+    // Called each time a new test page is to be build. The page specification node is the only item passed in
     document.getElementById('box-holders').innerHTML = "";
-    
+
     var interfaceObj = page.interfaces;
-	if (interfaceObj.length > 1)
-	{
-		console.log("WARNING - This interface only supports one <interface> node per page. Using first interface node");
-	}
-	interfaceObj = interfaceObj[0];
-    
+    if (interfaceObj.length > 1) {
+        console.log("WARNING - This interface only supports one <interface> node per page. Using first interface node");
+    }
+    interfaceObj = interfaceObj[0];
+
     var commentHolder = document.getElementById("comment-box-holder");
     commentHolder.innerHTML = "";
-    
+
     // Set the page title
     if (typeof page.title == "string" && page.title.length > 0) {
         document.getElementById("test-title").textContent = page.title
     }
-	
-	if(interfaceObj.title != null)
-	{
-		document.getElementById("pageTitle").textContent = interfaceObj.title;
-	}
-    
+
+    if (interfaceObj.title != null) {
+        document.getElementById("pageTitle").textContent = interfaceObj.title;
+    }
+
     interfaceContext.comparator = new comparator(page);
-    
+
     var interfaceOptions = specification.interfaces.options.concat(interfaceObj.options);
-    for (var option of interfaceOptions)
-    {
-        if (option.type == "show")
-        {
-            switch(option.name) {
+    for (var option of interfaceOptions) {
+        if (option.type == "show") {
+            switch (option.name) {
                 case "playhead":
                     var playbackHolder = document.getElementById('playback-holder');
-                    if (playbackHolder == null)
-                    {
+                    if (playbackHolder == null) {
                         playbackHolder = document.createElement('div');
                         playbackHolder.style.width = "100%";
                         playbackHolder.style.float = "left";
@@ -176,46 +174,41 @@
                     break;
                 case "page-count":
                     var pagecountHolder = document.getElementById('page-count');
-                    if (pagecountHolder == null)
-                    {
+                    if (pagecountHolder == null) {
                         pagecountHolder = document.createElement('div');
                         pagecountHolder.id = 'page-count';
                     }
-                    pagecountHolder.innerHTML = '<span>Page '+(testState.stateIndex+1)+' of '+testState.stateMap.length+'</span>';
+                    pagecountHolder.innerHTML = '<span>Page ' + (testState.stateIndex + 1) + ' of ' + testState.stateMap.length + '</span>';
                     var inject = document.getElementById('interface-buttons');
                     inject.appendChild(pagecountHolder);
                     break;
                 case "volume":
-                    if (document.getElementById('master-volume-holder') == null)
-                    {
+                    if (document.getElementById('master-volume-holder') == null) {
                         feedbackHolder.appendChild(interfaceContext.volume.object);
                     }
                     break;
                 case "comments":
                     // Generate one comment box per presented page
-                    for (var element of audioEngineContext.audioObjects)
-                    {
+                    for (var element of audioEngineContext.audioObjects) {
                         interfaceContext.commentBoxes.createCommentBox(element);
                     }
-                    interfaceContext.commentBoxes.showCommentBoxes(commentHolder,true);
+                    interfaceContext.commentBoxes.showCommentBoxes(commentHolder, true);
                     break;
             }
         }
     }
-    
-    $(page.commentQuestions).each(function(index,element) {
-		var node = interfaceContext.createCommentQuestion(element);
-		commentHolder.appendChild(node.holder);
-	});
-    
+
+    $(page.commentQuestions).each(function (index, element) {
+        var node = interfaceContext.createCommentQuestion(element);
+        commentHolder.appendChild(node.holder);
+    });
+
     resizeWindow(null);
 }
 
-function comparator(page)
-{
+function comparator(page) {
     // Build prototype constructor
-    this.interfaceObject = function(element,label)
-    {
+    this.interfaceObject = function (element, label) {
         // An example node, you can make this however you want for each audioElement.
         // However, every audioObject (audioEngineContext.audioObject) MUST have an interface object with the following
         // You attach them by calling audioObject.bindInterface( )
@@ -225,173 +218,158 @@
         this.disabled = true;
         this.box = document.createElement('div');
         this.box.className = 'comparator-holder';
-		this.box.setAttribute('track-id',element.id);
-		this.box.id = 'comparator-'+label;
+        this.box.setAttribute('track-id', element.id);
+        this.box.id = 'comparator-' + label;
         this.selector = document.createElement('div');
-		this.selector.className = 'comparator-selector disabled';
-		var selectorText = document.createElement('span');
-		selectorText.textContent = label;
-		this.selector.appendChild(selectorText);
-		this.playback = document.createElement('button');
-		this.playback.className = 'comparator-button';
-		this.playback.disabled = true;
-		this.playback.textContent = "Listen";
-		this.box.appendChild(this.selector);
-		this.box.appendChild(this.playback);
-        this.selector.onclick = function(event)
-		{
+        this.selector.className = 'comparator-selector disabled';
+        var selectorText = document.createElement('span');
+        selectorText.textContent = label;
+        this.selector.appendChild(selectorText);
+        this.playback = document.createElement('button');
+        this.playback.className = 'comparator-button';
+        this.playback.disabled = true;
+        this.playback.textContent = "Listen";
+        this.box.appendChild(this.selector);
+        this.box.appendChild(this.playback);
+        this.selector.onclick = function (event) {
             var label = event.currentTarget.children[0].textContent;
-            if (label == "X" || label == "x") {return;}
-			var time = audioEngineContext.timer.getTestTime();
-			if ($(event.currentTarget).hasClass('disabled'))
-			{
-				console.log("Please wait until sample has loaded");
-				return;
-			}
-			if (audioEngineContext.status == 0)
-			{
-				interfaceContext.lightbox.post("Message", "Please listen to the samples before making a selection");
-				console.log("Please listen to the samples before making a selection");
-				return;
+            if (label == "X" || label == "x") {
+                return;
             }
-			var id = event.currentTarget.parentElement.getAttribute('track-id');
-			interfaceContext.comparator.selected = id;
+            var time = audioEngineContext.timer.getTestTime();
+            if ($(event.currentTarget).hasClass('disabled')) {
+                console.log("Please wait until sample has loaded");
+                return;
+            }
+            if (audioEngineContext.status == 0) {
+                interfaceContext.lightbox.post("Message", "Please listen to the samples before making a selection");
+                console.log("Please listen to the samples before making a selection");
+                return;
+            }
+            var id = event.currentTarget.parentElement.getAttribute('track-id');
+            interfaceContext.comparator.selected = id;
             if ($(event.currentTarget).hasClass("selected")) {
                 $(".comparator-selector").removeClass('selected');
-                for (var i=0; i<interfaceContext.comparator.pair.length; i++)
-                {
+                for (var i = 0; i < interfaceContext.comparator.pair.length; i++) {
                     var obj = interfaceContext.comparator.pair[i];
-                    obj.parent.metric.moved(time,0);
+                    obj.parent.metric.moved(time, 0);
                     obj.value = 0;
                 }
             } else {
                 $(".comparator-selector").removeClass('selected');
                 $(event.currentTarget).addClass('selected');
-                for (var i=0; i<interfaceContext.comparator.pair.length; i++)
-                {
+                for (var i = 0; i < interfaceContext.comparator.pair.length; i++) {
                     var obj = interfaceContext.comparator.pair[i];
                     if (i == id) {
                         obj.value = 1;
                     } else {
                         obj.value = 0;
                     }
-                    obj.parent.metric.moved(time,obj.value);
+                    obj.parent.metric.moved(time, obj.value);
                 }
-                console.log("Selected "+id+' ('+time+')');
+                console.log("Selected " + id + ' (' + time + ')');
             }
-		};
-        this.playback.setAttribute("playstate","ready");
-		this.playback.onclick = function(event)
-		{
-			var id = event.currentTarget.parentElement.getAttribute('track-id');
-            if (event.currentTarget.getAttribute("playstate") == "ready")
-            {
+        };
+        this.playback.setAttribute("playstate", "ready");
+        this.playback.onclick = function (event) {
+            var id = event.currentTarget.parentElement.getAttribute('track-id');
+            if (event.currentTarget.getAttribute("playstate") == "ready") {
                 audioEngineContext.play(id);
             } else if (event.currentTarget.getAttribute("playstate") == "playing") {
                 audioEngineContext.stop();
             }
-			
-		};
-        this.enable = function()
-        {
+
+        };
+        this.enable = function () {
             // This is used to tell the interface object that playback of this node is ready
-            if (this.parent.state == 1)
-			{
-				$(this.selector).removeClass('disabled');
-				this.playback.disabled = false;
-			}
+            if (this.parent.state == 1) {
+                $(this.selector).removeClass('disabled');
+                this.playback.disabled = false;
+            }
         };
-        this.updateLoading = function(progress)
-        {
+        this.updateLoading = function (progress) {
             // progress is a value from 0 to 100 indicating the current download state of media files
-            if (progress != 100)
-			{
-				progress = String(progress);
-				progress = progress.split('.')[0];
-				this.playback.textContent = progress+'%';
-			} else {
-				this.playback.textContent = "Play";
-			}
+            if (progress != 100) {
+                progress = String(progress);
+                progress = progress.split('.')[0];
+                this.playback.textContent = progress + '%';
+            } else {
+                this.playback.textContent = "Play";
+            }
         };
-        this.error = function() {
+        this.error = function () {
             // audioObject has an error!!
             this.playback.textContent = "Error";
             $(this.playback).addClass("error-colour");
         };
-        this.startPlayback = function()
-        {
+        this.startPlayback = function () {
             if (this.parent.specification.parent.playOne || specification.playOne) {
                 $('.comparator-button').text('Wait');
-                $('.comparator-button').attr("disabled","true");
+                $('.comparator-button').attr("disabled", "true");
                 $(this.playback).removeAttr("disabled");
             } else {
                 $('.comparator-button').text('Listen');
             }
             $(this.playback).text('Stop');
-            this.playback.setAttribute("playstate","playing");
+            this.playback.setAttribute("playstate", "playing");
         };
-        this.stopPlayback = function()
-        {
+        this.stopPlayback = function () {
             if (this.playback.getAttribute("playstate") == "playing") {
                 $('.comparator-button').text('Listen');
                 $('.comparator-button').removeAttr("disabled");
-                this.playback.setAttribute("playstate","ready");
+                this.playback.setAttribute("playstate", "ready");
             }
         };
-        this.getValue = function()
-        {
+        this.getValue = function () {
             // Return the current value of the object. If there is no value, return 0
             return this.value;
         };
-        this.getPresentedId = function()
-        {
+        this.getPresentedId = function () {
             // Return the presented ID of the object. For instance, the APE has sliders starting from 0. Whilst AB has alphabetical scale
             return this.selector.children[0].textContent;
         };
-        this.canMove = function()
-        {
+        this.canMove = function () {
             // Return either true or false if the interface object can be moved. AB / Reference cannot, whilst sliders can and therefore have a continuous scale.
             // These are checked primarily if the interface check option 'fragmentMoved' is enabled.
             return false;
         };
-        this.exportXMLDOM = function(audioObject) {
+        this.exportXMLDOM = function (audioObject) {
             // Called by the audioObject holding this element to export the interface <value> node.
             // If there is no value node (such as outside reference), return null
             // If there are multiple value nodes (such as multiple scale / 2D scales), return an array of nodes with each value node having an 'interfaceName' attribute
             // Use storage.document.createElement('value'); to generate the XML node.
             var node = storage.document.createElement('value');
-			node.textContent = this.value;
-			return node;
+            node.textContent = this.value;
+            return node;
 
         };
-        this.error = function() {
+        this.error = function () {
             // If there is an error with the audioObject, this will be called to indicate a failure
         }
     };
     // Ensure there are only two comparisons per page
     if (page.audioElements.length != 2) {
-        console.error('FATAL - There must be 2 <audioelement> nodes on each <page>: '+page.id);
+        console.error('FATAL - There must be 2 <audioelement> nodes on each <page>: ' + page.id);
         return;
     }
     // Build the three audio elements
     this.pair = [];
     this.X = null;
     this.boxHolders = document.getElementById('box-holders');
-    for (var index=0; index<page.audioElements.length; index++) {
+    for (var index = 0; index < page.audioElements.length; index++) {
         var element = page.audioElements[index];
-        if (element.type != 'normal')
-		{
-			console.log("WARNING - ABX can only have normal elements. Page "+page.id+", Element "+element.id);
+        if (element.type != 'normal') {
+            console.log("WARNING - ABX can only have normal elements. Page " + page.id + ", Element " + element.id);
             element.type = "normal";
-		}
+        }
         var audioObject = audioEngineContext.newTrack(element);
         var label;
-        switch(audioObject.specification.parent.label) {
+        switch (audioObject.specification.parent.label) {
             case "none":
                 label = "";
                 break;
             case "number":
-                label = ""+index;
+                label = "" + index;
                 break;
             case "letter":
                 label = String.fromCharCode(97 + index);
@@ -400,7 +378,7 @@
                 label = String.fromCharCode(65 + index);
                 break;
         }
-        var node = new this.interfaceObject(audioObject,label);
+        var node = new this.interfaceObject(audioObject, label);
         audioObject.bindInterface(node);
         this.pair.push(node);
         this.boxHolders.appendChild(node.box);
@@ -408,25 +386,29 @@
     var elementId = Math.floor(Math.random() * 2); //Randomly pick A or B to be X
     var element = new page.audioElementNode(specification);
     for (var atr in page.audioElements[elementId]) {
-        eval("element."+atr+" = page.audioElements[elementId]."+atr);
+        eval("element." + atr + " = page.audioElements[elementId]." + atr);
     }
     element.id += "-X";
-    if (typeof element.name == "string") {element.name+="-X";}
+    if (typeof element.name == "string") {
+        element.name += "-X";
+    }
     page.audioElements.push(element);
     // Create the save place-holder for the 'X' element
     var root = testState.currentStore.XMLDOM;
     var aeNode = storage.document.createElement('audioelement');
-    aeNode.setAttribute('ref',element.id);
-    if (typeof element.name == "string"){aeNode.setAttribute('name',element.name);}
-    aeNode.setAttribute('type','normal');
-    aeNode.setAttribute('url',element.url);
-    aeNode.setAttribute('gain',element.gain);
+    aeNode.setAttribute('ref', element.id);
+    if (typeof element.name == "string") {
+        aeNode.setAttribute('name', element.name);
+    }
+    aeNode.setAttribute('type', 'normal');
+    aeNode.setAttribute('url', element.url);
+    aeNode.setAttribute('gain', element.gain);
     aeNode.appendChild(storage.document.createElement('metric'));
     root.appendChild(aeNode);
     // Build the 'X' element
     var audioObject = audioEngineContext.newTrack(element);
     var label;
-    switch(audioObject.specification.parent.label) {
+    switch (audioObject.specification.parent.label) {
         case "letter":
             label = "x";
             break;
@@ -434,98 +416,102 @@
             label = "X";
             break;
     }
-    var node = new this.interfaceObject(audioObject,label);
+    var node = new this.interfaceObject(audioObject, label);
     node.box.children[0].classList.add('inactive');
     audioObject.bindInterface(node);
     this.X = node;
     this.boxHolders.appendChild(node.box);
 }
 
-function resizeWindow(event)
-{
-	document.getElementById('submit').style.left = (window.innerWidth-250)/2 + 'px';
-	var numObj = 3;
-	var boxW = numObj*312;
+function resizeWindow(event) {
+    document.getElementById('submit').style.left = (window.innerWidth - 250) / 2 + 'px';
+    var numObj = 3;
+    var boxW = numObj * 312;
     var diff = window.innerWidth - boxW;
-    while (diff < 0)
-    {
-        numObj = Math.ceil(numObj/2);
-        boxW = numObj*312;
+    while (diff < 0) {
+        numObj = Math.ceil(numObj / 2);
+        boxW = numObj * 312;
         diff = window.innerWidth - boxW;
     }
-    document.getElementById('box-holders').style.marginLeft = diff/2 + 'px';
-    document.getElementById('box-holders').style.marginRight = diff/2 + 'px';
+    document.getElementById('box-holders').style.marginLeft = diff / 2 + 'px';
+    document.getElementById('box-holders').style.marginRight = diff / 2 + 'px';
     document.getElementById('box-holders').style.width = boxW + 'px';
 }
 
-function buttonSubmitClick()
-{
-	var checks = [];
-	checks = checks.concat(testState.currentStateMap.interfaces[0].options);
-	checks = checks.concat(specification.interfaces.options);
-	var canContinue = true;
-	
-	for (var i=0; i<checks.length; i++) {
-		if (checks[i].type == 'check')
-		{
-			switch(checks[i].name) {
-			case 'fragmentPlayed':
-				// Check if all fragments have been played
-				var checkState = interfaceContext.checkAllPlayed();
-				if (checkState == false) {canContinue = false;}
-				break;
-			case  'fragmentFullPlayback':
-				// Check all fragments have been played to their full length
-				var checkState = interfaceContext.checkFragmentsFullyPlayed();
-				if (checkState == false) {canContinue = false;}
-				break;
-			case 'fragmentMoved':
-				// Check all fragment sliders have been moved.
-				var checkState = interfaceContext.checkAllMoved();
-				if (checkState == false) {canContinue = false;}
-				break;
-			case 'fragmentComments':
-				// Check all fragment sliders have been moved.
-				var checkState = interfaceContext.checkAllCommented();
-				if (checkState == false) {canContinue = false;}
-				break;
-            case 'scalerange':
-                // Check the scale has been used effectively
-                var checkState = interfaceContext.checkScaleRange(checks[i].min,checks[i].max);
-                if (checkState == false) {canContinue = false;}
-				break;
-			default:
-				console.log("WARNING - Check option "+checks[i].check+" is not supported on this interface");
-				break;
-			}
+function buttonSubmitClick() {
+    var checks = [];
+    checks = checks.concat(testState.currentStateMap.interfaces[0].options);
+    checks = checks.concat(specification.interfaces.options);
+    var canContinue = true;
 
-		}
-		if (!canContinue) {break;}
-	}
-	if (canContinue)
-	{
-	    if (audioEngineContext.status == 1) {
-	        var playback = document.getElementById('playback-button');
-	        playback.click();
-	    // This function is called when the submit button is clicked. Will check for any further tests to perform, or any post-test options
-	    } else
-	    {
-	        if (audioEngineContext.timer.testStarted == false)
-	        {
-	            interfaceContext.lightbox.post("Warning",'You have not started the test! Please listen to a sample to begin the test!');
-	            return;
-	        }
-	    }
-	    testState.advanceState();
-	}
+    for (var i = 0; i < checks.length; i++) {
+        if (checks[i].type == 'check') {
+            switch (checks[i].name) {
+                case 'fragmentPlayed':
+                    // Check if all fragments have been played
+                    var checkState = interfaceContext.checkAllPlayed();
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    break;
+                case 'fragmentFullPlayback':
+                    // Check all fragments have been played to their full length
+                    var checkState = interfaceContext.checkFragmentsFullyPlayed();
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    break;
+                case 'fragmentMoved':
+                    // Check all fragment sliders have been moved.
+                    var checkState = interfaceContext.checkAllMoved();
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    break;
+                case 'fragmentComments':
+                    // Check all fragment sliders have been moved.
+                    var checkState = interfaceContext.checkAllCommented();
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    break;
+                case 'scalerange':
+                    // Check the scale has been used effectively
+                    var checkState = interfaceContext.checkScaleRange(checks[i].min, checks[i].max);
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    break;
+                default:
+                    console.log("WARNING - Check option " + checks[i].check + " is not supported on this interface");
+                    break;
+            }
+
+        }
+        if (!canContinue) {
+            break;
+        }
+    }
+    if (canContinue) {
+        if (audioEngineContext.status == 1) {
+            var playback = document.getElementById('playback-button');
+            playback.click();
+            // This function is called when the submit button is clicked. Will check for any further tests to perform, or any post-test options
+        } else {
+            if (audioEngineContext.timer.testStarted == false) {
+                interfaceContext.lightbox.post("Warning", 'You have not started the test! Please listen to a sample to begin the test!');
+                return;
+            }
+        }
+        testState.advanceState();
+    }
 }
 
-function pageXMLSave(store, pageSpecification)
-{
-	// MANDATORY
-	// Saves a specific test page
-	// You can use this space to add any extra nodes to your XML <audioHolder> saves
-	// Get the current <page> information in store (remember to appendChild your data to it)
-	// pageSpecification is the current page node configuration
-	// To create new XML nodes, use storage.document.createElement();
-}
\ No newline at end of file
+function pageXMLSave(store, pageSpecification) {
+    // MANDATORY
+    // Saves a specific test page
+    // You can use this space to add any extra nodes to your XML <audioHolder> saves
+    // Get the current <page> information in store (remember to appendChild your data to it)
+    // pageSpecification is the current page node configuration
+    // To create new XML nodes, use storage.document.createElement();
+}
diff -r cc2364d8bc17 -r 2577d983f291 interfaces/ape.css
--- a/interfaces/ape.css	Mon Nov 14 12:14:48 2016 +0000
+++ b/interfaces/ape.css	Mon Nov 14 14:23:41 2016 +0000
@@ -2,103 +2,90 @@
  * Hold any style information for APE interface. Customise if you like to make the interface your own!
  * 
  */
+
 body {
-	/* Set the background colour (note US English spelling) to grey*/
-	background-color: #ddd
+    /* Set the background colour (note US English spelling) to grey*/
+    background-color: #ddd
 }
-
 div.title {
-	/* Specify any colouring for the title */
+    /* Specify any colouring for the title */
 }
-
 div.pageTitle {
-	width: auto;
-	height: 20px;
-	margin-top: 5px;
-	margin-bottom: 10px;
+    width: auto;
+    height: 20px;
+    margin-top: 5px;
+    margin-bottom: 10px;
 }
-
-div.pageTitle span{
-	font-size: 1.5em;
+div.pageTitle span {
+    font-size: 1.5em;
 }
-
 button {
-	/* Specify any button structure or style */
-	min-width: 20px;
-	background-color: #ddd
+    /* Specify any button structure or style */
+    min-width: 20px;
+    background-color: #ddd
 }
-
 div.slider {
-	/* Specify any structure for the slider holder interface */
-	background-color: #eee;
-	height: 150px;
-	margin: 5px 50px;
-	-moz-user-select: -moz-none;
-	-khtml-user-select: none;
-	-webkit-user-select: none;
+    /* Specify any structure for the slider holder interface */
+    background-color: #eee;
+    height: 150px;
+    margin: 5px 50px;
+    -moz-user-select: -moz-none;
+    -khtml-user-select: none;
+    -webkit-user-select: none;
 }
-
 div.sliderScale {
-	width: 100%;
-	min-height: 30px;
-	-moz-user-select: -moz-none;
-	-khtml-user-select: none;
-	-webkit-user-select: none;
+    width: 100%;
+    min-height: 30px;
+    -moz-user-select: -moz-none;
+    -khtml-user-select: none;
+    -webkit-user-select: none;
 }
-
 div.sliderScale span {
-	/* Any formatting of text below scale */
-	font-size: 1.2em;
-	min-width: 5px;
+    /* Any formatting of text below scale */
+    font-size: 1.2em;
+    min-width: 5px;
     max-width: 100px;
     text-align: center;
-	height: 20px;
-	position: absolute;
+    height: 20px;
+    position: absolute;
 }
-
 div.track-slider {
-	/* Specify any structure for the slider objects */
-	position: absolute;
-	height: inherit;
-	width: 12px;
-	float: left;
-	background-color: rgb(100,200,100);
-	-moz-user-select: -moz-none;
-	-khtml-user-select: none;
-	-webkit-user-select: none;
+    /* Specify any structure for the slider objects */
+    position: absolute;
+    height: inherit;
+    width: 12px;
+    float: left;
+    background-color: rgb(100, 200, 100);
+    -moz-user-select: -moz-none;
+    -khtml-user-select: none;
+    -webkit-user-select: none;
     border: 1px solid black;
 }
-
 div#outside-reference-holder {
     display: flex;
     align-content: center;
     justify-content: center;
     margin-bottom: 5px;
 }
-
 div.outside-reference {
-	width:120px;
+    width: 120px;
     text-align: center;
-	height:20px;
-	background-color: rgb(100,200,100);
+    height: 20px;
+    background-color: rgb(100, 200, 100);
     position: inherit;
     margin: 0px 5px;
 }
-
 div.track-slider-disabled {
-	background-color: rgb(100,100,100);
+    background-color: rgb(100, 100, 100);
 }
-
 div.track-slider-playing {
-	background-color: #FF0000;
+    background-color: #FF0000;
 }
-
 div.comment-box-playing {
-	background-color: #FFDDDD;
+    background-color: #FFDDDD;
 }
-
 div#master-volume-holder {
     position: absolute;
     top: 10px;
     left: 120px;
-}
\ No newline at end of file
+}
diff -r cc2364d8bc17 -r 2577d983f291 interfaces/blank.js
--- a/interfaces/blank.js	Mon Nov 14 12:14:48 2016 +0000
+++ b/interfaces/blank.js	Mon Nov 14 14:23:41 2016 +0000
@@ -7,72 +7,61 @@
 loadInterface();
 
 function loadInterface() {
-	// Use this to do any one-time page / element construction. For instance, placing any stationary text objects,
-	// holding div's, or setting up any nodes which are present for the entire test sequence
+    // Use this to do any one-time page / element construction. For instance, placing any stationary text objects,
+    // holding div's, or setting up any nodes which are present for the entire test sequence
 };
 
-function loadTest(page)
-{
-	// Called each time a new test page is to be build. The page specification node is the only item passed in
+function loadTest(page) {
+    // Called each time a new test page is to be build. The page specification node is the only item passed in
 }
 
-function interfaceObject()
-{
-	// An example node, you can make this however you want for each audioElement.
-	// However, every audioObject (audioEngineContext.audioObject) MUST have an interface object with the following
-	// You attach them by calling audioObject.bindInterface( )
-	this.enable = function()
-	{
-		// This is used to tell the interface object that playback of this node is ready
-	};
-	this.updateLoading = function(progress)
-	{
-		// progress is a value from 0 to 100 indicating the current download state of media files
-	};
-    this.startPlayback = function()
-    {
+function interfaceObject() {
+    // An example node, you can make this however you want for each audioElement.
+    // However, every audioObject (audioEngineContext.audioObject) MUST have an interface object with the following
+    // You attach them by calling audioObject.bindInterface( )
+    this.enable = function () {
+        // This is used to tell the interface object that playback of this node is ready
+    };
+    this.updateLoading = function (progress) {
+        // progress is a value from 0 to 100 indicating the current download state of media files
+    };
+    this.startPlayback = function () {
         // Called when playback has begun
     };
-    this.stopPlayback = function()
-    {
+    this.stopPlayback = function () {
         // Called when playback has stopped. This gets called even if playback never started!
     };
-	this.getValue = function()
-	{
-		// Return the current value of the object. If there is no value, return 0
-	};
-	this.getPresentedId = function()
-	{
-		// Return the presented ID of the object. For instance, the APE has sliders starting from 0. Whilst AB has alphabetical scale
-	};
-	this.canMove = function()
-	{
-		// Return either true or false if the interface object can be moved. AB / Reference cannot, whilst sliders can and therefore have a continuous scale.
-		// These are checked primarily if the interface check option 'fragmentMoved' is enabled.
-	};
-	this.exportXMLDOM = function(audioObject) {
-		// Called by the audioObject holding this element to export the interface <value> node.
-		// If there is no value node (such as outside reference), return null
-		// If there are multiple value nodes (such as multiple scale / 2D scales), return an array of nodes with each value node having an 'interfaceName' attribute
-		// Use storage.document.createElement('value'); to generate the XML node.
-		
-	};
-    this.error = function() {
+    this.getValue = function () {
+        // Return the current value of the object. If there is no value, return 0
+    };
+    this.getPresentedId = function () {
+        // Return the presented ID of the object. For instance, the APE has sliders starting from 0. Whilst AB has alphabetical scale
+    };
+    this.canMove = function () {
+        // Return either true or false if the interface object can be moved. AB / Reference cannot, whilst sliders can and therefore have a continuous scale.
+        // These are checked primarily if the interface check option 'fragmentMoved' is enabled.
+    };
+    this.exportXMLDOM = function (audioObject) {
+        // Called by the audioObject holding this element to export the interface <value> node.
+        // If there is no value node (such as outside reference), return null
+        // If there are multiple value nodes (such as multiple scale / 2D scales), return an array of nodes with each value node having an 'interfaceName' attribute
+        // Use storage.document.createElement('value'); to generate the XML node.
+
+    };
+    this.error = function () {
         // If there is an error with the audioObject, this will be called to indicate a failure
     }
 };
 
-function resizeWindow(event)
-{
-	// Called on every window resize event, use this to scale your page properly
+function resizeWindow(event) {
+    // Called on every window resize event, use this to scale your page properly
 }
 
-function pageXMLSave(store, pageSpecification)
-{
-	// MANDATORY
-	// Saves a specific test page
-	// You can use this space to add any extra nodes to your XML <audioHolder> saves
-	// Get the current <page> information in store (remember to appendChild your data to it)
-	// pageSpecification is the current page node configuration
-	// To create new XML nodes, use storage.document.createElement();
-}
\ No newline at end of file
+function pageXMLSave(store, pageSpecification) {
+    // MANDATORY
+    // Saves a specific test page
+    // You can use this space to add any extra nodes to your XML <audioHolder> saves
+    // Get the current <page> information in store (remember to appendChild your data to it)
+    // pageSpecification is the current page node configuration
+    // To create new XML nodes, use storage.document.createElement();
+}
diff -r cc2364d8bc17 -r 2577d983f291 interfaces/discrete.css
--- a/interfaces/discrete.css	Mon Nov 14 12:14:48 2016 +0000
+++ b/interfaces/discrete.css	Mon Nov 14 14:23:41 2016 +0000
@@ -2,113 +2,97 @@
  * Hold any style information for MUSHRA interface. Customise if you like to make the interface your own!
  * 
  */
+
 body {
-	/* Set the background colour (note US English spelling) to grey*/
-	background-color: #ddd
+    /* Set the background colour (note US English spelling) to grey*/
+    background-color: #ddd
 }
-
 div.pageTitle {
-	width: auto;
-	height: 20px;
-	margin: 10px 0px;
+    width: auto;
+    height: 20px;
+    margin: 10px 0px;
 }
-
-div.pageTitle span{
-	font-size: 1.5em;
+div.pageTitle span {
+    font-size: 1.5em;
 }
-
 button {
-	/* Specify any button structure or style */
-	min-width: 20px;
-	background-color: #ddd
+    /* Specify any button structure or style */
+    min-width: 20px;
+    background-color: #ddd
 }
-
 div#slider-holder {
-	height: inherit;
-	position: absolute;
-	left: 0px;
-	z-index: 3;
-	margin-top:25px;
+    height: inherit;
+    position: absolute;
+    left: 0px;
+    z-index: 3;
+    margin-top: 25px;
 }
-
 div#scale-holder {
-	position: absolute;
-	left: 0px;
-	z-index: 2;
+    position: absolute;
+    left: 0px;
+    z-index: 2;
 }
-
 div#scale-text-holder {
-	position:relative;
-	float: left;
+    position: relative;
+    float: left;
 }
 div.scale-text {
-	position: absolute;
-	font-size: 1.2em;
+    position: absolute;
+    font-size: 1.2em;
 }
-
 canvas#scale-canvas {
-	position: relative;
-	float: left;
+    position: relative;
+    float: left;
 }
-
 div.track-slider {
-	float: left;
-	height: 30px;
-	border: solid;
-	border-width: 1px;
-	border-color: black;
-	padding:2px;
-	margin-left: 94px;
-	margin-bottom: 30px;
+    float: left;
+    height: 30px;
+    border: solid;
+    border-width: 1px;
+    border-color: black;
+    padding: 2px;
+    margin-left: 94px;
+    margin-bottom: 30px;
 }
-
 div.track-slider-range {
-	float: left;
-	height: 100%;
-	margin: 0px 50px;
-	position: relative;
+    float: left;
+    height: 100%;
+    margin: 0px 50px;
+    position: relative;
 }
-
 div.track-slider-title {
-	float: left;
-	padding-top: 5px;
-	width: 100px;
+    float: left;
+    padding-top: 5px;
+    width: 100px;
 }
-
 button.track-slider-button {
-	float: left;
-	width: 100px;
-	height: 30px;
+    float: left;
+    width: 100px;
+    height: 30px;
 }
-
 input.track-radio {
-	position: absolute;
-	margin: 9px 0px;
+    position: absolute;
+    margin: 9px 0px;
 }
-
 div#outside-reference-holder {
     display: flex;
     align-content: center;
     justify-content: center;
     margin-bottom: 5px;
 }
-
 button.outside-reference {
     position: inherit;
     margin: 0px 5px;
 }
-
 div.track-slider-playing {
-	background-color: #FFDDDD;
+    background-color: #FFDDDD;
 }
-
 div#page-count {
     float: left;
     margin: 0px 5px;
 }
-
 div#master-volume-holder {
     position: absolute;
     top: 10px;
     left: 120px;
-}
\ No newline at end of file
+}
diff -r cc2364d8bc17 -r 2577d983f291 interfaces/discrete.js
--- a/interfaces/discrete.js	Mon Nov 14 12:14:48 2016 +0000
+++ b/interfaces/discrete.js	Mon Nov 14 14:23:41 2016 +0000
@@ -2,170 +2,166 @@
 loadInterface();
 
 function loadInterface() {
-	// Use this to do any one-time page / element construction. For instance, placing any stationary text objects,
-	// holding div's, or setting up any nodes which are present for the entire test sequence
-	
-	// The injection point into the HTML page
-	interfaceContext.insertPoint = document.getElementById("topLevelBody");
-	var testContent = document.createElement('div');
-	testContent.id = 'testContent';
-	
-	// Create the top div for the Title element
-	var titleAttr = specification.title;
-	var title = document.createElement('div');
-	title.className = "title";
-	title.align = "center";
-	var titleSpan = document.createElement('span');
+    // Use this to do any one-time page / element construction. For instance, placing any stationary text objects,
+    // holding div's, or setting up any nodes which are present for the entire test sequence
+
+    // The injection point into the HTML page
+    interfaceContext.insertPoint = document.getElementById("topLevelBody");
+    var testContent = document.createElement('div');
+    testContent.id = 'testContent';
+
+    // Create the top div for the Title element
+    var titleAttr = specification.title;
+    var title = document.createElement('div');
+    title.className = "title";
+    title.align = "center";
+    var titleSpan = document.createElement('span');
     titleSpan.id = "test-title";
-	
-	// Set title to that defined in XML, else set to default
-	if (titleAttr != undefined) {
-		titleSpan.textContent = titleAttr;
-	} else {
-		titleSpan.textContent =  'Listening test';
-	}
-	// Insert the titleSpan element into the title div element.
-	title.appendChild(titleSpan);
-	
-	var pagetitle = document.createElement('div');
-	pagetitle.className = "pageTitle";
-	pagetitle.align = "center";
-	var titleSpan = document.createElement('span');
-	titleSpan.id = "pageTitle";
-	pagetitle.appendChild(titleSpan);
-	
-	// Create Interface buttons!
-	var interfaceButtons = document.createElement('div');
-	interfaceButtons.id = 'interface-buttons';
-	interfaceButtons.style.height = '25px';
-	
-	// Create playback start/stop points
-	var playback = document.createElement("button");
-	playback.innerHTML = 'Stop';
-	playback.id = 'playback-button';
-	playback.style.float = 'left';
-	// onclick function. Check if it is playing or not, call the correct function in the
-	// audioEngine, change the button text to reflect the next state.
-	playback.onclick = function() {
-		if (audioEngineContext.status == 1) {
-			audioEngineContext.stop();
-			this.innerHTML = 'Stop';
+
+    // Set title to that defined in XML, else set to default
+    if (titleAttr != undefined) {
+        titleSpan.textContent = titleAttr;
+    } else {
+        titleSpan.textContent = 'Listening test';
+    }
+    // Insert the titleSpan element into the title div element.
+    title.appendChild(titleSpan);
+
+    var pagetitle = document.createElement('div');
+    pagetitle.className = "pageTitle";
+    pagetitle.align = "center";
+    var titleSpan = document.createElement('span');
+    titleSpan.id = "pageTitle";
+    pagetitle.appendChild(titleSpan);
+
+    // Create Interface buttons!
+    var interfaceButtons = document.createElement('div');
+    interfaceButtons.id = 'interface-buttons';
+    interfaceButtons.style.height = '25px';
+
+    // Create playback start/stop points
+    var playback = document.createElement("button");
+    playback.innerHTML = 'Stop';
+    playback.id = 'playback-button';
+    playback.style.float = 'left';
+    // onclick function. Check if it is playing or not, call the correct function in the
+    // audioEngine, change the button text to reflect the next state.
+    playback.onclick = function () {
+        if (audioEngineContext.status == 1) {
+            audioEngineContext.stop();
+            this.innerHTML = 'Stop';
             var time = audioEngineContext.timer.getTestTime();
             console.log('Stopped at ' + time); // DEBUG/SAFETY
-		}
-	};
-    
+        }
+    };
+
     // Create outside reference holder
     var outsideRef = document.createElement("div");
     outsideRef.id = "outside-reference-holder";
-    
-	// Create Submit (save) button
-	var submit = document.createElement("button");
-	submit.innerHTML = 'Next';
-	submit.onclick = buttonSubmitClick;
-	submit.id = 'submit-button';
-	submit.style.float = 'left';
-	// Append the interface buttons into the interfaceButtons object.
-	interfaceButtons.appendChild(playback);
-	interfaceButtons.appendChild(submit);
-	
-	// Create a slider box
-	var sliderBox = document.createElement('div');
-	sliderBox.style.width = "100%";
-	sliderBox.style.height = window.innerHeight - 200+12 + 'px';
-	sliderBox.style.marginBottom = '10px';
-	sliderBox.id = 'slider';
-	var scaleHolder = document.createElement('div');
-	scaleHolder.id = "scale-holder";
-	scaleHolder.style.marginLeft = "107px";
-	sliderBox.appendChild(scaleHolder);
-	var scaleText = document.createElement('div');
-	scaleText.id = "scale-text-holder";
-	scaleText.style.height = "25px";
-	scaleText.style.width = "100%";
-	scaleHolder.appendChild(scaleText);
-	var scaleCanvas = document.createElement('canvas');
-	scaleCanvas.id = "scale-canvas";
-	scaleCanvas.style.marginLeft = "150px";
-	scaleHolder.appendChild(scaleCanvas);
-	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');
-	feedbackHolder.id = 'feedbackHolder';
-	
-	testContent.style.zIndex = 1;
-	interfaceContext.insertPoint.innerHTML = ""; // Clear the current schema
-	
-	// Inject into HTML
-	testContent.appendChild(title); // Insert the title
-	testContent.appendChild(pagetitle);
-	testContent.appendChild(interfaceButtons);
+
+    // Create Submit (save) button
+    var submit = document.createElement("button");
+    submit.innerHTML = 'Next';
+    submit.onclick = buttonSubmitClick;
+    submit.id = 'submit-button';
+    submit.style.float = 'left';
+    // Append the interface buttons into the interfaceButtons object.
+    interfaceButtons.appendChild(playback);
+    interfaceButtons.appendChild(submit);
+
+    // Create a slider box
+    var sliderBox = document.createElement('div');
+    sliderBox.style.width = "100%";
+    sliderBox.style.height = window.innerHeight - 200 + 12 + 'px';
+    sliderBox.style.marginBottom = '10px';
+    sliderBox.id = 'slider';
+    var scaleHolder = document.createElement('div');
+    scaleHolder.id = "scale-holder";
+    scaleHolder.style.marginLeft = "107px";
+    sliderBox.appendChild(scaleHolder);
+    var scaleText = document.createElement('div');
+    scaleText.id = "scale-text-holder";
+    scaleText.style.height = "25px";
+    scaleText.style.width = "100%";
+    scaleHolder.appendChild(scaleText);
+    var scaleCanvas = document.createElement('canvas');
+    scaleCanvas.id = "scale-canvas";
+    scaleCanvas.style.marginLeft = "150px";
+    scaleHolder.appendChild(scaleCanvas);
+    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');
+    feedbackHolder.id = 'feedbackHolder';
+
+    testContent.style.zIndex = 1;
+    interfaceContext.insertPoint.innerHTML = ""; // Clear the current schema
+
+    // Inject into HTML
+    testContent.appendChild(title); // Insert the title
+    testContent.appendChild(pagetitle);
+    testContent.appendChild(interfaceButtons);
     testContent.appendChild(outsideRef);
-	testContent.appendChild(sliderBox);
-	testContent.appendChild(feedbackHolder);
-	interfaceContext.insertPoint.appendChild(testContent);
+    testContent.appendChild(sliderBox);
+    testContent.appendChild(feedbackHolder);
+    interfaceContext.insertPoint.appendChild(testContent);
 
-	// Load the full interface
-	testState.initialise();
-	testState.advanceState();
+    // Load the full interface
+    testState.initialise();
+    testState.advanceState();
 };
 
-function loadTest(page)
-{
-	// Called each time a new test page is to be build. The page specification node is the only item passed in
-	var id = page.id;
-	
-	var feedbackHolder = document.getElementById('feedbackHolder');
+function loadTest(page) {
+    // Called each time a new test page is to be build. The page specification node is the only item passed in
+    var id = page.id;
+
+    var feedbackHolder = document.getElementById('feedbackHolder');
     feedbackHolder.innerHTML = "";
-	var interfaceObj = page.interfaces;
-	if (interfaceObj.length > 1)
-	{
-		console.log("WARNING - This interface only supports one <interface> node per page. Using first interface node");
-	}
-	interfaceObj = interfaceObj[0];
-    
+    var interfaceObj = page.interfaces;
+    if (interfaceObj.length > 1) {
+        console.log("WARNING - This interface only supports one <interface> node per page. Using first interface node");
+    }
+    interfaceObj = interfaceObj[0];
+
     // Set the page title
     if (typeof page.title == "string" && page.title.length > 0) {
         document.getElementById("test-title").textContent = page.title
     }
-    
-	if(interfaceObj.title != null)
-	{
-		document.getElementById("pageTitle").textContent = interfaceObj.title;
-	}
-	
-	// Delete outside reference
+
+    if (interfaceObj.title != null) {
+        document.getElementById("pageTitle").textContent = interfaceObj.title;
+    }
+
+    // Delete outside reference
     document.getElementById("outside-reference-holder").innerHTML = "";
-	
-	var sliderBox = document.getElementById('slider-holder');
-	sliderBox.innerHTML = "";
-	
-	var commentBoxPrefix = "Comment on track";
-	if (interfaceObj.commentBoxPrefix != undefined) {
-		commentBoxPrefix = interfaceObj.commentBoxPrefix;
-	}
-	var loopPlayback = page.loop;
-	
-	// Find all the audioElements from the audioHolder
-	var index = 0;
-	var interfaceScales = testState.currentStateMap.interfaces[0].scales;
-	$(page.audioElements).each(function(index,element){
-		// Find URL of track
-		// In this jQuery loop, variable 'this' holds the current audioElement.
-		
-		var audioObject = audioEngineContext.newTrack(element);
-		if (element.type == 'outside-reference')
-		{
-			// Construct outside reference;
-			var orNode = new interfaceContext.outsideReferenceDOM(audioObject,index,document.getElementById("outside-reference-holder"));
-			audioObject.bindInterface(orNode);
-		} else {
-			// Create a slider per track
-            switch(audioObject.specification.parent.label) {
+
+    var sliderBox = document.getElementById('slider-holder');
+    sliderBox.innerHTML = "";
+
+    var commentBoxPrefix = "Comment on track";
+    if (interfaceObj.commentBoxPrefix != undefined) {
+        commentBoxPrefix = interfaceObj.commentBoxPrefix;
+    }
+    var loopPlayback = page.loop;
+
+    // Find all the audioElements from the audioHolder
+    var index = 0;
+    var interfaceScales = testState.currentStateMap.interfaces[0].scales;
+    $(page.audioElements).each(function (index, element) {
+        // Find URL of track
+        // In this jQuery loop, variable 'this' holds the current audioElement.
+
+        var audioObject = audioEngineContext.newTrack(element);
+        if (element.type == 'outside-reference') {
+            // Construct outside reference;
+            var orNode = new interfaceContext.outsideReferenceDOM(audioObject, index, document.getElementById("outside-reference-holder"));
+            audioObject.bindInterface(orNode);
+        } else {
+            // Create a slider per track
+            switch (audioObject.specification.parent.label) {
                 case "none":
                     label = "";
                     break;
@@ -176,28 +172,25 @@
                     label = String.fromCharCode(65 + index);
                     break;
                 default:
-                    label = ""+index;
+                    label = "" + index;
                     break;
             }
-			var sliderObj = new discreteObject(audioObject,label,interfaceScales);
-			sliderBox.appendChild(sliderObj.holder);
-			audioObject.bindInterface(sliderObj);
+            var sliderObj = new discreteObject(audioObject, label, interfaceScales);
+            sliderBox.appendChild(sliderObj.holder);
+            audioObject.bindInterface(sliderObj);
             interfaceContext.commentBoxes.createCommentBox(audioObject);
-			index += 1;
-		}
-        
-	});
-	
+            index += 1;
+        }
+
+    });
+
     var interfaceOptions = specification.interfaces.options.concat(interfaceObj.options);
-    for (var option of interfaceOptions)
-    {
-        if (option.type == "show")
-        {
-            switch(option.name) {
+    for (var option of interfaceOptions) {
+        if (option.type == "show") {
+            switch (option.name) {
                 case "playhead":
                     var playbackHolder = document.getElementById('playback-holder');
-                    if (playbackHolder == null)
-                    {
+                    if (playbackHolder == null) {
                         playbackHolder = document.createElement('div');
                         playbackHolder.style.width = "100%";
                         playbackHolder.align = 'center';
@@ -207,350 +200,341 @@
                     break;
                 case "page-count":
                     var pagecountHolder = document.getElementById('page-count');
-                    if (pagecountHolder == null)
-                    {
+                    if (pagecountHolder == null) {
                         pagecountHolder = document.createElement('div');
                         pagecountHolder.id = 'page-count';
                     }
-                    pagecountHolder.innerHTML = '<span>Page '+(testState.stateIndex+1)+' of '+testState.stateMap.length+'</span>';
+                    pagecountHolder.innerHTML = '<span>Page ' + (testState.stateIndex + 1) + ' of ' + testState.stateMap.length + '</span>';
                     var inject = document.getElementById('interface-buttons');
                     inject.appendChild(pagecountHolder);
                     break;
                 case "volume":
-                    if (document.getElementById('master-volume-holder') == null)
-                    {
+                    if (document.getElementById('master-volume-holder') == null) {
                         feedbackHolder.appendChild(interfaceContext.volume.object);
                     }
                     break;
                 case "comments":
-                    interfaceContext.commentBoxes.showCommentBoxes(feedbackHolder,true);
+                    interfaceContext.commentBoxes.showCommentBoxes(feedbackHolder, true);
                     break;
             }
         }
     }
-    
-    $(page.commentQuestions).each(function(index,element) {
-		var node = interfaceContext.createCommentQuestion(element);
-		feedbackHolder.appendChild(node.holder);
-	});
-    
-	// Auto-align
-	resizeWindow(null);
+
+    $(page.commentQuestions).each(function (index, element) {
+        var node = interfaceContext.createCommentQuestion(element);
+        feedbackHolder.appendChild(node.holder);
+    });
+
+    // Auto-align
+    resizeWindow(null);
 }
 
-function discreteObject(audioObject,label,interfaceScales)
-{
-	// An example node, you can make this however you want for each audioElement.
-	// However, every audioObject (audioEngineContext.audioObject) MUST have an interface object with the following
-	// You attach them by calling audioObject.bindInterface( )
-	if (interfaceScales == null || interfaceScales.length == 0)
-	{
-		console.log("WARNING: The discrete radio's are built depending on the number of scale points specified! Ensure you have some specified. Defaulting to 5 for now!");
-		numOptions = 5;
-	}
-	this.parent = audioObject;
-	
-	this.holder = document.createElement('div');
-	this.title = document.createElement('div');
-	this.discreteHolder = document.createElement('div');
-	this.discretes = [];
-	this.play = document.createElement('button');
-	
-	this.holder.className = 'track-slider';
-	this.holder.style.width = window.innerWidth-200 + 'px';
-	this.holder.appendChild(this.title);
-	this.holder.appendChild(this.discreteHolder);
-	this.holder.appendChild(this.play);
-	this.holder.setAttribute('trackIndex',audioObject.id);
-	this.title.textContent = label;
-	this.title.className = 'track-slider-title';
-	
-	this.discreteHolder.className = "track-slider-range";
-	this.discreteHolder.style.width = window.innerWidth-500 + 'px';
-	for (var i=0; i<interfaceScales.length; i++)
-	{
-		var node = document.createElement('input');
-		node.setAttribute('type','radio');
-		node.className = 'track-radio';
+function discreteObject(audioObject, label, interfaceScales) {
+    // An example node, you can make this however you want for each audioElement.
+    // However, every audioObject (audioEngineContext.audioObject) MUST have an interface object with the following
+    // You attach them by calling audioObject.bindInterface( )
+    if (interfaceScales == null || interfaceScales.length == 0) {
+        console.log("WARNING: The discrete radio's are built depending on the number of scale points specified! Ensure you have some specified. Defaulting to 5 for now!");
+        numOptions = 5;
+    }
+    this.parent = audioObject;
+
+    this.holder = document.createElement('div');
+    this.title = document.createElement('div');
+    this.discreteHolder = document.createElement('div');
+    this.discretes = [];
+    this.play = document.createElement('button');
+
+    this.holder.className = 'track-slider';
+    this.holder.style.width = window.innerWidth - 200 + 'px';
+    this.holder.appendChild(this.title);
+    this.holder.appendChild(this.discreteHolder);
+    this.holder.appendChild(this.play);
+    this.holder.setAttribute('trackIndex', audioObject.id);
+    this.title.textContent = label;
+    this.title.className = 'track-slider-title';
+
+    this.discreteHolder.className = "track-slider-range";
+    this.discreteHolder.style.width = window.innerWidth - 500 + 'px';
+    for (var i = 0; i < interfaceScales.length; i++) {
+        var node = document.createElement('input');
+        node.setAttribute('type', 'radio');
+        node.className = 'track-radio';
         node.disabled = true;
-		node.setAttribute('position',interfaceScales[i].position);
-		node.setAttribute('name',audioObject.specification.id);
-		node.setAttribute('id',audioObject.specification.id+'-'+String(i));
-		this.discretes.push(node);
-		this.discreteHolder.appendChild(node);
-		node.onclick = function(event)
-		{
-			if (audioEngineContext.status == 0)
-			{
-				event.currentTarget.checked = false;
-				return;
-			}
-			var time = audioEngineContext.timer.getTestTime();
-			var id = Number(event.currentTarget.parentNode.parentNode.getAttribute('trackIndex'));
-			var value = event.currentTarget.getAttribute('position') / 100.0;
-			audioEngineContext.audioObjects[id].metric.moved(time,value);
-			console.log('slider '+id+' moved to '+value+' ('+time+')');
-		};
-	}
-	
-	this.play.className = 'track-slider-button';
-	this.play.textContent = "Loading...";
-	this.play.value = audioObject.id;
-	this.play.disabled = true;
-    this.play.setAttribute("playstate","ready");
-	this.play.onclick = function(event)
-	{
-		var id = Number(event.currentTarget.value);
-		//audioEngineContext.metric.sliderPlayed(id);
+        node.setAttribute('position', interfaceScales[i].position);
+        node.setAttribute('name', audioObject.specification.id);
+        node.setAttribute('id', audioObject.specification.id + '-' + String(i));
+        this.discretes.push(node);
+        this.discreteHolder.appendChild(node);
+        node.onclick = function (event) {
+            if (audioEngineContext.status == 0) {
+                event.currentTarget.checked = false;
+                return;
+            }
+            var time = audioEngineContext.timer.getTestTime();
+            var id = Number(event.currentTarget.parentNode.parentNode.getAttribute('trackIndex'));
+            var value = event.currentTarget.getAttribute('position') / 100.0;
+            audioEngineContext.audioObjects[id].metric.moved(time, value);
+            console.log('slider ' + id + ' moved to ' + value + ' (' + time + ')');
+        };
+    }
+
+    this.play.className = 'track-slider-button';
+    this.play.textContent = "Loading...";
+    this.play.value = audioObject.id;
+    this.play.disabled = true;
+    this.play.setAttribute("playstate", "ready");
+    this.play.onclick = function (event) {
+        var id = Number(event.currentTarget.value);
+        //audioEngineContext.metric.sliderPlayed(id);
         if (event.currentTarget.getAttribute("playstate") == "ready")
             audioEngineContext.play(id);
         else if (event.currentTarget.getAttribute("playstate") == "playing")
             audioEngineContext.stop();
-	};
-	this.resize = function(event)
-	{
-		this.holder.style.width = window.innerWidth-200 + 'px';
-		this.discreteHolder.style.width = window.innerWidth-500 + 'px';
-		//text.style.left = (posPix+150-($(text).width()/2)) +'px';
-		for (var i=0; i<this.discretes.length; i++)
-		{
-			var width = $(this.discreteHolder).width() - 20;
-			var node = this.discretes[i];
-			var nodeW = $(node).width();
-			var position = node.getAttribute('position');
-			var posPix = Math.round(width * (position / 100.0));
-			node.style.left = (posPix+10 - (nodeW/2)) + 'px';
-		}
-	};
-	this.enable = function()
-	{
-		// This is used to tell the interface object that playback of this node is ready
-		this.play.disabled = false;
-		this.play.textContent = "Play";
-		$(this.slider).removeClass('track-slider-disabled');
-        for (var radio of this.discretes)
-        {
+    };
+    this.resize = function (event) {
+        this.holder.style.width = window.innerWidth - 200 + 'px';
+        this.discreteHolder.style.width = window.innerWidth - 500 + 'px';
+        //text.style.left = (posPix+150-($(text).width()/2)) +'px';
+        for (var i = 0; i < this.discretes.length; i++) {
+            var width = $(this.discreteHolder).width() - 20;
+            var node = this.discretes[i];
+            var nodeW = $(node).width();
+            var position = node.getAttribute('position');
+            var posPix = Math.round(width * (position / 100.0));
+            node.style.left = (posPix + 10 - (nodeW / 2)) + 'px';
+        }
+    };
+    this.enable = function () {
+        // This is used to tell the interface object that playback of this node is ready
+        this.play.disabled = false;
+        this.play.textContent = "Play";
+        $(this.slider).removeClass('track-slider-disabled');
+        for (var radio of this.discretes) {
             radio.disabled = false;
         }
-	};
-	this.updateLoading = function(progress)
-	{
-		// progress is a value from 0 to 100 indicating the current download state of media files
-        if (progress != 100)
-        {
+    };
+    this.updateLoading = function (progress) {
+        // progress is a value from 0 to 100 indicating the current download state of media files
+        if (progress != 100) {
             progress = String(progress);
             progress = progress.split('.')[0];
-            this.play.textContent = progress+'%';
+            this.play.textContent = progress + '%';
         } else {
             this.play.textContent = "Play";
         }
-	};
-    
-    this.startPlayback = function()
-    {
+    };
+
+    this.startPlayback = function () {
         // Called by audioObject when playback begins
-        this.play.setAttribute("playstate","playing");
+        this.play.setAttribute("playstate", "playing");
         $(".track-slider").removeClass('track-slider-playing');
-		$(this.holder).addClass('track-slider-playing');
-		var outsideReference = document.getElementById('outside-reference');
+        $(this.holder).addClass('track-slider-playing');
+        var outsideReference = document.getElementById('outside-reference');
         this.play.textContent = "Listening";
-		if (outsideReference != null) {
-			$(outsideReference).removeClass('track-slider-playing');
-		}
+        if (outsideReference != null) {
+            $(outsideReference).removeClass('track-slider-playing');
+        }
         if (this.parent.specification.parent.playOne || specification.playOne) {
             $('.track-slider-button').text = "Wait";
-            $('.track-slider-button').attr("disabled","true");
+            $('.track-slider-button').attr("disabled", "true");
         }
     }
-    this.stopPlayback = function()
-    {
+    this.stopPlayback = function () {
         // Called by audioObject when playback stops
         if (this.play.getAttribute("playstate") == "playing") {
-            this.play.setAttribute("playstate","ready");
+            this.play.setAttribute("playstate", "ready");
             $(this.holder).removeClass('track-slider-playing');
             $('.track-slider-button').text = "Play";
             this.play.textContent = "Play";
             $('.track-slider-button').removeAttr("disabled");
         }
     }
-    
-	this.getValue = function()
-	{
-		// Return the current value of the object. If there is no value, return -1
-		var value = -1;
-		for (var i=0; i<this.discretes.length; i++)
-		{
-			if (this.discretes[i].checked == true)
-			{
-				value = this.discretes[i].getAttribute('position') / 100.0;
-				break;
-			}
-		}
-		return value;
-	};
-	this.getPresentedId = function()
-	{
-		// Return the presented ID of the object. For instance, the APE has sliders starting from 0. Whilst AB has alphabetical scale
-		return this.title.textContent;
-	};
-	this.canMove = function()
-	{
-		// Return either true or false if the interface object can be moved. AB / Reference cannot, whilst sliders can and therefore have a continuous scale.
-		// These are checked primarily if the interface check option 'fragmentMoved' is enabled.
-		return true;
-	};
-	this.exportXMLDOM = function(audioObject) {
-		// Called by the audioObject holding this element to export the interface <value> node.
-		// If there is no value node (such as outside reference), return null
-		// If there are multiple value nodes (such as multiple scale / 2D scales), return an array of nodes with each value node having an 'interfaceName' attribute
-		// Use storage.document.createElement('value'); to generate the XML node.
-		var node = storage.document.createElement('value');
-		node.textContent = this.getValue();
-		return node;
-	};
-    this.error = function() {
-            // audioObject has an error!!
+
+    this.getValue = function () {
+        // Return the current value of the object. If there is no value, return -1
+        var value = -1;
+        for (var i = 0; i < this.discretes.length; i++) {
+            if (this.discretes[i].checked == true) {
+                value = this.discretes[i].getAttribute('position') / 100.0;
+                break;
+            }
+        }
+        return value;
+    };
+    this.getPresentedId = function () {
+        // Return the presented ID of the object. For instance, the APE has sliders starting from 0. Whilst AB has alphabetical scale
+        return this.title.textContent;
+    };
+    this.canMove = function () {
+        // Return either true or false if the interface object can be moved. AB / Reference cannot, whilst sliders can and therefore have a continuous scale.
+        // These are checked primarily if the interface check option 'fragmentMoved' is enabled.
+        return true;
+    };
+    this.exportXMLDOM = function (audioObject) {
+        // Called by the audioObject holding this element to export the interface <value> node.
+        // If there is no value node (such as outside reference), return null
+        // If there are multiple value nodes (such as multiple scale / 2D scales), return an array of nodes with each value node having an 'interfaceName' attribute
+        // Use storage.document.createElement('value'); to generate the XML node.
+        var node = storage.document.createElement('value');
+        node.textContent = this.getValue();
+        return node;
+    };
+    this.error = function () {
+        // audioObject has an error!!
         this.playback.textContent = "Error";
         $(this.playback).addClass("error-colour");
     }
 };
 
-function resizeWindow(event)
-{
-	// Called on every window resize event, use this to scale your page properly
-	var numObj = document.getElementsByClassName('track-slider').length;
-	var totalHeight = (numObj * 66)-30;
-	document.getElementById('scale-holder').style.width = window.innerWidth-220 + 'px';
-	// Cheers edge for making me delete a canvas every resize.
-	var canvas = document.getElementById('scale-canvas');
+function resizeWindow(event) {
+    // Called on every window resize event, use this to scale your page properly
+    var numObj = document.getElementsByClassName('track-slider').length;
+    var totalHeight = (numObj * 66) - 30;
+    document.getElementById('scale-holder').style.width = window.innerWidth - 220 + 'px';
+    // Cheers edge for making me delete a canvas every resize.
+    var canvas = document.getElementById('scale-canvas');
     var new_canvas = document.createElement("canvas");
     new_canvas.id = 'scale-canvas';
     new_canvas.style.marginLeft = "150px";
     canvas.parentElement.appendChild(new_canvas);
     canvas.parentElement.removeChild(canvas);
-	new_canvas.width = window.innerWidth-520;
-	new_canvas.height = totalHeight;
-	for (var i in audioEngineContext.audioObjects)
-	{
-		if (audioEngineContext.audioObjects[i].specification.type != 'outside-reference'){
-			audioEngineContext.audioObjects[i].interfaceDOM.resize(event);
-		}
-	}
+    new_canvas.width = window.innerWidth - 520;
+    new_canvas.height = totalHeight;
+    for (var i in audioEngineContext.audioObjects) {
+        if (audioEngineContext.audioObjects[i].specification.type != 'outside-reference') {
+            audioEngineContext.audioObjects[i].interfaceDOM.resize(event);
+        }
+    }
     document.getElementById('slider-holder').style.height = totalHeight + 'px';
     document.getElementById('slider').style.height = totalHeight + 70 + 'px';
-	drawScale();
+    drawScale();
 }
 
-function drawScale()
-{
-	var interfaceObj = testState.currentStateMap.interfaces[0];
-	var scales = testState.currentStateMap.interfaces[0].scales;
-	scales = scales.sort(function(a,b) {
-		return a.position - b.position;
-	});
-	var canvas = document.getElementById('scale-canvas');
-	var ctx = canvas.getContext("2d");
-	var height = canvas.height;
-	var width = canvas.width;
-	var textHolder = document.getElementById('scale-text-holder');
-	textHolder.innerHTML = "";
-	ctx.fillStyle = "#000000";
-	ctx.setLineDash([1,4]);
-	for (var scale of scales)
-	{
-		var posPercent = scale.position / 100.0;
-		var posPix = Math.round(width * posPercent);
-		if(posPix<=0){posPix=1;}
-		if(posPix>=width){posPix=width-1;}
-		ctx.moveTo(posPix,0);
-		ctx.lineTo(posPix,height);
-		ctx.stroke();
-		
-		var text = document.createElement('div');
-		text.align = "center";
-		var textC = document.createElement('span');
-		textC.textContent = scale.text;
-		text.appendChild(textC);
-		text.className = "scale-text";
-		textHolder.appendChild(text);
-		text.style.width = $(text.children[0]).width()+'px';
-		text.style.left = (posPix+150-($(text).width()/2)) +'px';
-	}
+function drawScale() {
+    var interfaceObj = testState.currentStateMap.interfaces[0];
+    var scales = testState.currentStateMap.interfaces[0].scales;
+    scales = scales.sort(function (a, b) {
+        return a.position - b.position;
+    });
+    var canvas = document.getElementById('scale-canvas');
+    var ctx = canvas.getContext("2d");
+    var height = canvas.height;
+    var width = canvas.width;
+    var textHolder = document.getElementById('scale-text-holder');
+    textHolder.innerHTML = "";
+    ctx.fillStyle = "#000000";
+    ctx.setLineDash([1, 4]);
+    for (var scale of scales) {
+        var posPercent = scale.position / 100.0;
+        var posPix = Math.round(width * posPercent);
+        if (posPix <= 0) {
+            posPix = 1;
+        }
+        if (posPix >= width) {
+            posPix = width - 1;
+        }
+        ctx.moveTo(posPix, 0);
+        ctx.lineTo(posPix, height);
+        ctx.stroke();
+
+        var text = document.createElement('div');
+        text.align = "center";
+        var textC = document.createElement('span');
+        textC.textContent = scale.text;
+        text.appendChild(textC);
+        text.className = "scale-text";
+        textHolder.appendChild(text);
+        text.style.width = $(text.children[0]).width() + 'px';
+        text.style.left = (posPix + 150 - ($(text).width() / 2)) + 'px';
+    }
 }
 
 function buttonSubmitClick() // TODO: Only when all songs have been played!
 {
-	var checks = [];
-	checks = checks.concat(testState.currentStateMap.interfaces[0].options);
-	checks = checks.concat(specification.interfaces.options);
-	var canContinue = true;
-	
-	// Check that the anchor and reference objects are correctly placed
-	if (interfaceContext.checkHiddenAnchor() == false) {return;}
-	if (interfaceContext.checkHiddenReference() == false) {return;}
-	
-	for (var i=0; i<checks.length; i++) {
-		if (checks[i].type == 'check')
-		{
-			switch(checks[i].name) {
-			case 'fragmentPlayed':
-				// Check if all fragments have been played
-				var checkState = interfaceContext.checkAllPlayed();
-				if (checkState == false) {canContinue = false;}
-				break;
-			case  'fragmentFullPlayback':
-				// Check all fragments have been played to their full length
-				var checkState = interfaceContext.checkAllPlayed();
-				if (checkState == false) {canContinue = false;}
-				console.log('NOTE: fragmentFullPlayback not currently implemented, performing check fragmentPlayed instead');
-				break;
-			case 'fragmentMoved':
-				// Check all fragment sliders have been moved.
-				var checkState = interfaceContext.checkAllMoved();
-				if (checkState == false) {canContinue = false;}
-				break;
-			case 'fragmentComments':
-				// Check all fragment sliders have been moved.
-				var checkState = interfaceContext.checkAllCommented();
-				if (checkState == false) {canContinue = false;}
-				break;
-			case 'scalerange':
-                // Check the scale has been used effectively
-                var checkState = interfaceContext.checkScaleRange(checks[i].min,checks[i].max);
-                if (checkState == false) {canContinue = false;}
-				break;
-			default:
-				console.log("WARNING - Check option "+checks[i].check+" is not supported on this interface");
-				break;
-			}
+    var checks = [];
+    checks = checks.concat(testState.currentStateMap.interfaces[0].options);
+    checks = checks.concat(specification.interfaces.options);
+    var canContinue = true;
 
-		}
-		if (!canContinue) {break;}
-	}
-	
+    // Check that the anchor and reference objects are correctly placed
+    if (interfaceContext.checkHiddenAnchor() == false) {
+        return;
+    }
+    if (interfaceContext.checkHiddenReference() == false) {
+        return;
+    }
+
+    for (var i = 0; i < checks.length; i++) {
+        if (checks[i].type == 'check') {
+            switch (checks[i].name) {
+                case 'fragmentPlayed':
+                    // Check if all fragments have been played
+                    var checkState = interfaceContext.checkAllPlayed();
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    break;
+                case 'fragmentFullPlayback':
+                    // Check all fragments have been played to their full length
+                    var checkState = interfaceContext.checkAllPlayed();
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    console.log('NOTE: fragmentFullPlayback not currently implemented, performing check fragmentPlayed instead');
+                    break;
+                case 'fragmentMoved':
+                    // Check all fragment sliders have been moved.
+                    var checkState = interfaceContext.checkAllMoved();
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    break;
+                case 'fragmentComments':
+                    // Check all fragment sliders have been moved.
+                    var checkState = interfaceContext.checkAllCommented();
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    break;
+                case 'scalerange':
+                    // Check the scale has been used effectively
+                    var checkState = interfaceContext.checkScaleRange(checks[i].min, checks[i].max);
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    break;
+                default:
+                    console.log("WARNING - Check option " + checks[i].check + " is not supported on this interface");
+                    break;
+            }
+
+        }
+        if (!canContinue) {
+            break;
+        }
+    }
+
     if (canContinue) {
-	    if (audioEngineContext.status == 1) {
-	        var playback = document.getElementById('playback-button');
-	        playback.click();
-	    // This function is called when the submit button is clicked. Will check for any further tests to perform, or any post-test options
-	    } else
-	    {
-	        if (audioEngineContext.timer.testStarted == false)
-	        {
-	            interfaceContext.lightbox.post("Warning",'You have not started the test! Please press start to begin the test!');
-	            return;
-	        }
-	    }
-	    testState.advanceState();
-    } 
+        if (audioEngineContext.status == 1) {
+            var playback = document.getElementById('playback-button');
+            playback.click();
+            // This function is called when the submit button is clicked. Will check for any further tests to perform, or any post-test options
+        } else {
+            if (audioEngineContext.timer.testStarted == false) {
+                interfaceContext.lightbox.post("Warning", 'You have not started the test! Please press start to begin the test!');
+                return;
+            }
+        }
+        testState.advanceState();
+    }
 }
 
-function pageXMLSave(store, pageSpecification)
-{
-	// MANDATORY
-	// Saves a specific test page
-	// You can use this space to add any extra nodes to your XML <audioHolder> saves
-	// Get the current <page> information in store (remember to appendChild your data to it)
-	// pageSpecification is the current page node configuration
-	// To create new XML nodes, use storage.document.createElement();
-}
\ No newline at end of file
+function pageXMLSave(store, pageSpecification) {
+    // MANDATORY
+    // Saves a specific test page
+    // You can use this space to add any extra nodes to your XML <audioHolder> saves
+    // Get the current <page> information in store (remember to appendChild your data to it)
+    // pageSpecification is the current page node configuration
+    // To create new XML nodes, use storage.document.createElement();
+}
diff -r cc2364d8bc17 -r 2577d983f291 interfaces/horizontal-sliders.css
--- a/interfaces/horizontal-sliders.css	Mon Nov 14 12:14:48 2016 +0000
+++ b/interfaces/horizontal-sliders.css	Mon Nov 14 14:23:41 2016 +0000
@@ -2,137 +2,116 @@
  * Hold any style information for MUSHRA interface. Customise if you like to make the interface your own!
  * 
  */
+
 body {
-	/* Set the background colour (note US English spelling) to grey*/
-	background-color: #ddd
+    /* Set the background colour (note US English spelling) to grey*/
+    background-color: #ddd
 }
-
 div.pageTitle {
-	width: auto;
-	height: 20px;
-	margin: 10px 0px;
+    width: auto;
+    height: 20px;
+    margin: 10px 0px;
 }
-
-div.pageTitle span{
-	font-size: 1.5em;
+div.pageTitle span {
+    font-size: 1.5em;
 }
-
 button {
-	/* Specify any button structure or style */
-	min-width: 20px;
-	background-color: #ddd
+    /* Specify any button structure or style */
+    min-width: 20px;
+    background-color: #ddd
 }
-
 div#slider-holder {
-	height: inherit;
-	position: absolute;
-	left: 0px;
-	z-index: 3;
-	margin-top:25px;
+    height: inherit;
+    position: absolute;
+    left: 0px;
+    z-index: 3;
+    margin-top: 25px;
 }
-
 div#scale-holder {
-	height: inherit;
-	position: absolute;
-	left: 0px;
-	z-index: 2;
+    height: inherit;
+    position: absolute;
+    left: 0px;
+    z-index: 2;
 }
-
 div#scale-text-holder {
-	position:relative;
-	float: left;
+    position: relative;
+    float: left;
 }
 div.scale-text {
-	position: absolute;
-	font-size: 1.2em;
+    position: absolute;
+    font-size: 1.2em;
 }
-
 canvas#scale-canvas {
-	position: relative;
-	float: left;
+    position: relative;
+    float: left;
 }
-
 div.track-slider {
-	float: left;
-	height: 94px;
-	border: solid;
-	border-width: 1px;
-	border-color: black;
-	padding:2px;
-	margin-left: 94px;
-	margin-bottom: 25px;
+    float: left;
+    height: 94px;
+    border: solid;
+    border-width: 1px;
+    border-color: black;
+    padding: 2px;
+    margin-left: 94px;
+    margin-bottom: 25px;
 }
-
 div.track-slider-title {
-	float: left;
-	padding-top: 40px;
-	width: 100px;
+    float: left;
+    padding-top: 40px;
+    width: 100px;
 }
-
 button.track-slider-button {
-	float: left;
-	width: 100px;
-	height: 94px;
+    float: left;
+    width: 100px;
+    height: 94px;
 }
-
 div#outside-reference-holder {
     display: flex;
     align-content: center;
     justify-content: center;
     margin-bottom: 5px;
 }
-
 button.outside-reference {
     position: inherit;
     margin: 0px 5px;
 }
-
 div.track-slider-playing {
-	background-color: #FFDDDD;
+    background-color: #FFDDDD;
 }
-
 input.track-slider-range {
-	float: left;
-	margin: 2px 10px;
+    float: left;
+    margin: 2px 10px;
 }
-
-input[type=range]
-{
+input[type=range] {
     height: 94px;
     padding: 0px;
     color: rgb(255, 144, 144);
 }
-
 input[type=range]::-webkit-slider-runnable-track {
-	cursor: pointer;
-	background: #fff;
-	border-radius: 4px;
-	border: 1px solid #000;
+    cursor: pointer;
+    background: #fff;
+    border-radius: 4px;
+    border: 1px solid #000;
 }
-
 input[type=range]::-moz-range-track {
-	height: 8px;
-	cursor: pointer;
-	background: #fff;
-	border-radius: 4px;
-	border: 1px solid #000;
+    height: 8px;
+    cursor: pointer;
+    background: #fff;
+    border-radius: 4px;
+    border: 1px solid #000;
 }
-
 input.track-slider-not-moved[type=range]::-webkit-slider-runnable-track {
-	background: #aaa;
+    background: #aaa;
 }
-
 input.track-slider-not-moved[type=range]::-moz-range-track {
-	background: #aaa;
+    background: #aaa;
 }
-
 div#page-count {
     float: left;
     margin: 0px 5px;
 }
-
 div#master-volume-holder {
     position: absolute;
     top: 10px;
     left: 120px;
-}
\ No newline at end of file
+}
diff -r cc2364d8bc17 -r 2577d983f291 interfaces/horizontal-sliders.js
--- a/interfaces/horizontal-sliders.js	Mon Nov 14 12:14:48 2016 +0000
+++ b/interfaces/horizontal-sliders.js	Mon Nov 14 14:23:41 2016 +0000
@@ -2,174 +2,170 @@
 loadInterface();
 
 function loadInterface() {
-	// Use this to do any one-time page / element construction. For instance, placing any stationary text objects,
-	// holding div's, or setting up any nodes which are present for the entire test sequence
-	
-	// The injection point into the HTML page
-	interfaceContext.insertPoint = document.getElementById("topLevelBody");
-	var testContent = document.createElement('div');
-	testContent.id = 'testContent';
-	
-	// Create the top div for the Title element
-	var titleAttr = specification.title;
-	var title = document.createElement('div');
-	title.className = "title";
-	title.align = "center";
-	var titleSpan = document.createElement('span');
-    titleSpan.id="test-title";
-	
-	// Set title to that defined in XML, else set to default
-	if (titleAttr != undefined) {
-		titleSpan.textContent = titleAttr;
-	} else {
-		titleSpan.textContent =  'Listening test';
-	}
-	// Insert the titleSpan element into the title div element.
-	title.appendChild(titleSpan);
-	
-	var pagetitle = document.createElement('div');
-	pagetitle.className = "pageTitle";
-	pagetitle.align = "center";
-	var titleSpan = document.createElement('span');
-	titleSpan.id = "pageTitle";
-	pagetitle.appendChild(titleSpan);
-	
-	// Create Interface buttons!
-	var interfaceButtons = document.createElement('div');
-	interfaceButtons.id = 'interface-buttons';
-	interfaceButtons.style.height = '25px';
-	
-	// Create playback start/stop points
-	var playback = document.createElement("button");
-	playback.innerHTML = 'Stop';
-	playback.id = 'playback-button';
-	playback.style.float = 'left';
-	// onclick function. Check if it is playing or not, call the correct function in the
-	// audioEngine, change the button text to reflect the next state.
-	playback.onclick = function() {
-		if (audioEngineContext.status == 1) {
-			audioEngineContext.stop();
-			this.innerHTML = 'Stop';
+    // Use this to do any one-time page / element construction. For instance, placing any stationary text objects,
+    // holding div's, or setting up any nodes which are present for the entire test sequence
+
+    // The injection point into the HTML page
+    interfaceContext.insertPoint = document.getElementById("topLevelBody");
+    var testContent = document.createElement('div');
+    testContent.id = 'testContent';
+
+    // Create the top div for the Title element
+    var titleAttr = specification.title;
+    var title = document.createElement('div');
+    title.className = "title";
+    title.align = "center";
+    var titleSpan = document.createElement('span');
+    titleSpan.id = "test-title";
+
+    // Set title to that defined in XML, else set to default
+    if (titleAttr != undefined) {
+        titleSpan.textContent = titleAttr;
+    } else {
+        titleSpan.textContent = 'Listening test';
+    }
+    // Insert the titleSpan element into the title div element.
+    title.appendChild(titleSpan);
+
+    var pagetitle = document.createElement('div');
+    pagetitle.className = "pageTitle";
+    pagetitle.align = "center";
+    var titleSpan = document.createElement('span');
+    titleSpan.id = "pageTitle";
+    pagetitle.appendChild(titleSpan);
+
+    // Create Interface buttons!
+    var interfaceButtons = document.createElement('div');
+    interfaceButtons.id = 'interface-buttons';
+    interfaceButtons.style.height = '25px';
+
+    // Create playback start/stop points
+    var playback = document.createElement("button");
+    playback.innerHTML = 'Stop';
+    playback.id = 'playback-button';
+    playback.style.float = 'left';
+    // onclick function. Check if it is playing or not, call the correct function in the
+    // audioEngine, change the button text to reflect the next state.
+    playback.onclick = function () {
+        if (audioEngineContext.status == 1) {
+            audioEngineContext.stop();
+            this.innerHTML = 'Stop';
             var time = audioEngineContext.timer.getTestTime();
             console.log('Stopped at ' + time); // DEBUG/SAFETY
-		}
-	};
-	// Create Submit (save) button
-	var submit = document.createElement("button");
-	submit.innerHTML = 'Next';
-	submit.onclick = buttonSubmitClick;
-	submit.id = 'submit-button';
-	submit.style.float = 'left';
-	// Append the interface buttons into the interfaceButtons object.
-	interfaceButtons.appendChild(playback);
-	interfaceButtons.appendChild(submit);
-    
+        }
+    };
+    // Create Submit (save) button
+    var submit = document.createElement("button");
+    submit.innerHTML = 'Next';
+    submit.onclick = buttonSubmitClick;
+    submit.id = 'submit-button';
+    submit.style.float = 'left';
+    // Append the interface buttons into the interfaceButtons object.
+    interfaceButtons.appendChild(playback);
+    interfaceButtons.appendChild(submit);
+
     // Create outside reference holder
     var outsideRef = document.createElement("div");
     outsideRef.id = "outside-reference-holder";
-	
-	// Create a slider box
-	var sliderBox = document.createElement('div');
-	sliderBox.style.width = "100%";
-	sliderBox.style.height = window.innerHeight - 200+12 + 'px';
-	sliderBox.style.marginBottom = '10px';
-	sliderBox.id = 'slider';
-	var scaleHolder = document.createElement('div');
-	scaleHolder.id = "scale-holder";
-	scaleHolder.style.marginLeft = "107px";
-	sliderBox.appendChild(scaleHolder);
-	var scaleText = document.createElement('div');
-	scaleText.id = "scale-text-holder";
-	scaleText.style.height = "25px";
-	scaleText.style.width = "100%";
-	scaleHolder.appendChild(scaleText);
-	var scaleCanvas = document.createElement('canvas');
-	scaleCanvas.id = "scale-canvas";
-	scaleCanvas.style.marginLeft = "100px";
-	scaleHolder.appendChild(scaleCanvas);
-	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');
-	feedbackHolder.id = 'feedbackHolder';
-	
-	testContent.style.zIndex = 1;
-	interfaceContext.insertPoint.innerHTML = ""; // Clear the current schema
-	
-	// Inject into HTML
-	testContent.appendChild(title); // Insert the title
-	testContent.appendChild(pagetitle);
-	testContent.appendChild(interfaceButtons);
+
+    // Create a slider box
+    var sliderBox = document.createElement('div');
+    sliderBox.style.width = "100%";
+    sliderBox.style.height = window.innerHeight - 200 + 12 + 'px';
+    sliderBox.style.marginBottom = '10px';
+    sliderBox.id = 'slider';
+    var scaleHolder = document.createElement('div');
+    scaleHolder.id = "scale-holder";
+    scaleHolder.style.marginLeft = "107px";
+    sliderBox.appendChild(scaleHolder);
+    var scaleText = document.createElement('div');
+    scaleText.id = "scale-text-holder";
+    scaleText.style.height = "25px";
+    scaleText.style.width = "100%";
+    scaleHolder.appendChild(scaleText);
+    var scaleCanvas = document.createElement('canvas');
+    scaleCanvas.id = "scale-canvas";
+    scaleCanvas.style.marginLeft = "100px";
+    scaleHolder.appendChild(scaleCanvas);
+    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');
+    feedbackHolder.id = 'feedbackHolder';
+
+    testContent.style.zIndex = 1;
+    interfaceContext.insertPoint.innerHTML = ""; // Clear the current schema
+
+    // Inject into HTML
+    testContent.appendChild(title); // Insert the title
+    testContent.appendChild(pagetitle);
+    testContent.appendChild(interfaceButtons);
     testContent.appendChild(outsideRef);
-	testContent.appendChild(sliderBox);
-	testContent.appendChild(feedbackHolder);
-	interfaceContext.insertPoint.appendChild(testContent);
+    testContent.appendChild(sliderBox);
+    testContent.appendChild(feedbackHolder);
+    interfaceContext.insertPoint.appendChild(testContent);
 
-	// Load the full interface
-	testState.initialise();
-	testState.advanceState();
+    // Load the full interface
+    testState.initialise();
+    testState.advanceState();
 };
 
-function loadTest(page)
-{
-	// Called each time a new test page is to be build. The page specification node is the only item passed in
-	var id = page.id;
-	
-	var feedbackHolder = document.getElementById('feedbackHolder');
+function loadTest(page) {
+    // Called each time a new test page is to be build. The page specification node is the only item passed in
+    var id = page.id;
+
+    var feedbackHolder = document.getElementById('feedbackHolder');
     feedbackHolder.innerHTML = "";
-    
-	var interfaceObj = page.interfaces;
-	if (interfaceObj.length > 1)
-	{
-		console.log("WARNING - This interface only supports one <interface> node per page. Using first interface node");
-	}
-	interfaceObj = interfaceObj[0];
-    
+
+    var interfaceObj = page.interfaces;
+    if (interfaceObj.length > 1) {
+        console.log("WARNING - This interface only supports one <interface> node per page. Using first interface node");
+    }
+    interfaceObj = interfaceObj[0];
+
     // Set the page title
     if (typeof page.title == "string" && page.title.length > 0) {
         document.getElementById("test-title").textContent = page.title
     }
-    
-	if(interfaceObj.title != null)
-	{
-		document.getElementById("pageTitle").textContent = interfaceObj.title;
-	}
-    
-	// Delete outside reference
-	document.getElementById("outside-reference-holder").innerHTML = "";
-	
-	var sliderBox = document.getElementById('slider-holder');
-	sliderBox.innerHTML = "";
-	
-	var commentBoxPrefix = "Comment on track";
-	if (interfaceObj.commentBoxPrefix != undefined) {
-		commentBoxPrefix = interfaceObj.commentBoxPrefix;
-	}
-	var loopPlayback = page.loop;
-	
-	$(page.commentQuestions).each(function(index,element) {
-		var node = interfaceContext.createCommentQuestion(element);
-		feedbackHolder.appendChild(node.holder);
-	});
-	
-	// Find all the audioElements from the audioHolder
-	var index = 0;
-	$(page.audioElements).each(function(index,element){
-		// Find URL of track
-		// In this jQuery loop, variable 'this' holds the current audioElement.
-		
-		var audioObject = audioEngineContext.newTrack(element);
-		if (element.type == 'outside-reference')
-		{
-			// Construct outside reference;
-			var orNode = new interfaceContext.outsideReferenceDOM(audioObject,index,document.getElementById("outside-reference-holder"));
-			audioObject.bindInterface(orNode);
-		} else {
-			// Create a slider per track
-            switch(audioObject.specification.parent.label) {
+
+    if (interfaceObj.title != null) {
+        document.getElementById("pageTitle").textContent = interfaceObj.title;
+    }
+
+    // Delete outside reference
+    document.getElementById("outside-reference-holder").innerHTML = "";
+
+    var sliderBox = document.getElementById('slider-holder');
+    sliderBox.innerHTML = "";
+
+    var commentBoxPrefix = "Comment on track";
+    if (interfaceObj.commentBoxPrefix != undefined) {
+        commentBoxPrefix = interfaceObj.commentBoxPrefix;
+    }
+    var loopPlayback = page.loop;
+
+    $(page.commentQuestions).each(function (index, element) {
+        var node = interfaceContext.createCommentQuestion(element);
+        feedbackHolder.appendChild(node.holder);
+    });
+
+    // Find all the audioElements from the audioHolder
+    var index = 0;
+    $(page.audioElements).each(function (index, element) {
+        // Find URL of track
+        // In this jQuery loop, variable 'this' holds the current audioElement.
+
+        var audioObject = audioEngineContext.newTrack(element);
+        if (element.type == 'outside-reference') {
+            // Construct outside reference;
+            var orNode = new interfaceContext.outsideReferenceDOM(audioObject, index, document.getElementById("outside-reference-holder"));
+            audioObject.bindInterface(orNode);
+        } else {
+            // Create a slider per track
+            switch (audioObject.specification.parent.label) {
                 case "none":
                     label = "";
                     break;
@@ -180,36 +176,32 @@
                     label = String.fromCharCode(65 + index);
                     break;
                 default:
-                    label = ""+index;
+                    label = "" + index;
                     break;
             }
-			var sliderObj = new sliderObject(audioObject,label);
-			
-			if (typeof page.initialPosition === "number")
-			{
-				// Set the values
-				sliderObj.slider.value = page.initalPosition;
-			} else {
-				// Distribute it randomnly
-				sliderObj.slider.value = Math.random();
-			}
-			sliderBox.appendChild(sliderObj.holder);
-			audioObject.bindInterface(sliderObj);
+            var sliderObj = new sliderObject(audioObject, label);
+
+            if (typeof page.initialPosition === "number") {
+                // Set the values
+                sliderObj.slider.value = page.initalPosition;
+            } else {
+                // Distribute it randomnly
+                sliderObj.slider.value = Math.random();
+            }
+            sliderBox.appendChild(sliderObj.holder);
+            audioObject.bindInterface(sliderObj);
             interfaceContext.commentBoxes.createCommentBox(audioObject);
-			index += 1;
-		}
-        
-	});
+            index += 1;
+        }
+
+    });
     var interfaceOptions = specification.interfaces.options.concat(interfaceObj.options);
-    for (var option of interfaceOptions)
-    {
-        if (option.type == "show")
-        {
-            switch(option.name) {
+    for (var option of interfaceOptions) {
+        if (option.type == "show") {
+            switch (option.name) {
                 case "playhead":
                     var playbackHolder = document.getElementById('playback-holder');
-                    if (playbackHolder == null)
-                    {
+                    if (playbackHolder == null) {
                         playbackHolder = document.createElement('div');
                         playbackHolder.style.width = "100%";
                         playbackHolder.align = 'center';
@@ -219,282 +211,282 @@
                     break;
                 case "page-count":
                     var pagecountHolder = document.getElementById('page-count');
-                    if (pagecountHolder == null)
-                    {
+                    if (pagecountHolder == null) {
                         pagecountHolder = document.createElement('div');
                         pagecountHolder.id = 'page-count';
                     }
-                    pagecountHolder.innerHTML = '<span>Page '+(testState.stateIndex+1)+' of '+testState.stateMap.length+'</span>';
+                    pagecountHolder.innerHTML = '<span>Page ' + (testState.stateIndex + 1) + ' of ' + testState.stateMap.length + '</span>';
                     var inject = document.getElementById('interface-buttons');
                     inject.appendChild(pagecountHolder);
                     break;
                 case "volume":
-                    if (document.getElementById('master-volume-holder') == null)
-                    {
+                    if (document.getElementById('master-volume-holder') == null) {
                         feedbackHolder.appendChild(interfaceContext.volume.object);
                     }
                     break;
                 case "comments":
-                    interfaceContext.commentBoxes.showCommentBoxes(feedbackHolder,true);
+                    interfaceContext.commentBoxes.showCommentBoxes(feedbackHolder, true);
                     break;
             }
         }
     }
-	// Auto-align
-	resizeWindow(null);
+    // Auto-align
+    resizeWindow(null);
 }
 
-function sliderObject(audioObject,label)
-{
-	// An example node, you can make this however you want for each audioElement.
-	// However, every audioObject (audioEngineContext.audioObject) MUST have an interface object with the following
-	// You attach them by calling audioObject.bindInterface( )
-	this.parent = audioObject;
-	
-	this.holder = document.createElement('div');
-	this.title = document.createElement('div');
-	this.slider = document.createElement('input');
-	this.play = document.createElement('button');
-	
-	this.holder.className = 'track-slider';
-	this.holder.style.width = window.innerWidth-200 + 'px';
-	this.holder.appendChild(this.title);
-	this.holder.appendChild(this.slider);
-	this.holder.appendChild(this.play);
-	this.holder.setAttribute('trackIndex',audioObject.id);
-	this.title.textContent = label;
-	this.title.className = 'track-slider-title';
-	
-	this.slider.type = "range";
-	this.slider.className = "track-slider-range track-slider-not-moved";
-	this.slider.min = "0";
-	this.slider.max = "1";
-	this.slider.step = "0.01";
-	this.slider.style.width = window.innerWidth-420 + 'px';
-	this.slider.onchange = function()
-	{
-		var time = audioEngineContext.timer.getTestTime();
-		var id = Number(this.parentNode.getAttribute('trackIndex'));
-		audioEngineContext.audioObjects[id].metric.moved(time,this.value);
-		console.log('slider '+id+' moved to '+this.value+' ('+time+')');
-		$(this).removeClass('track-slider-not-moved');
-	};
-	
-	this.play.className = 'track-slider-button';
-	this.play.textContent = "Loading...";
-	this.play.value = audioObject.id;
-	this.play.disabled = true;
-    this.play.setAttribute("playstate","ready");
-	this.play.onclick = function(event)
-	{
-		var id = Number(event.currentTarget.value);
-		//audioEngineContext.metric.sliderPlayed(id);
-        if (event.currentTarget.getAttribute("playstate") == "ready")
-        {audioEngineContext.play(id);}
-        else if (event.currentTarget.getAttribute("playstate") == "playing")
-        {audioEngineContext.stop();}
-	};
-	this.resize = function(event)
-	{
-		this.holder.style.width = window.innerWidth-200 + 'px';
-		this.slider.style.width = window.innerWidth-420 + 'px';
-	};
-	this.enable = function()
-	{
-		// This is used to tell the interface object that playback of this node is ready
-		this.play.disabled = false;
-		this.play.textContent = "Play";
-		$(this.slider).removeClass('track-slider-disabled');
-	};
-	this.updateLoading = function(progress)
-	{
-		// progress is a value from 0 to 100 indicating the current download state of media files
-	};
-    this.startPlayback = function()
-    {
+function sliderObject(audioObject, label) {
+    // An example node, you can make this however you want for each audioElement.
+    // However, every audioObject (audioEngineContext.audioObject) MUST have an interface object with the following
+    // You attach them by calling audioObject.bindInterface( )
+    this.parent = audioObject;
+
+    this.holder = document.createElement('div');
+    this.title = document.createElement('div');
+    this.slider = document.createElement('input');
+    this.play = document.createElement('button');
+
+    this.holder.className = 'track-slider';
+    this.holder.style.width = window.innerWidth - 200 + 'px';
+    this.holder.appendChild(this.title);
+    this.holder.appendChild(this.slider);
+    this.holder.appendChild(this.play);
+    this.holder.setAttribute('trackIndex', audioObject.id);
+    this.title.textContent = label;
+    this.title.className = 'track-slider-title';
+
+    this.slider.type = "range";
+    this.slider.className = "track-slider-range track-slider-not-moved";
+    this.slider.min = "0";
+    this.slider.max = "1";
+    this.slider.step = "0.01";
+    this.slider.style.width = window.innerWidth - 420 + 'px';
+    this.slider.onchange = function () {
+        var time = audioEngineContext.timer.getTestTime();
+        var id = Number(this.parentNode.getAttribute('trackIndex'));
+        audioEngineContext.audioObjects[id].metric.moved(time, this.value);
+        console.log('slider ' + id + ' moved to ' + this.value + ' (' + time + ')');
+        $(this).removeClass('track-slider-not-moved');
+    };
+
+    this.play.className = 'track-slider-button';
+    this.play.textContent = "Loading...";
+    this.play.value = audioObject.id;
+    this.play.disabled = true;
+    this.play.setAttribute("playstate", "ready");
+    this.play.onclick = function (event) {
+        var id = Number(event.currentTarget.value);
+        //audioEngineContext.metric.sliderPlayed(id);
+        if (event.currentTarget.getAttribute("playstate") == "ready") {
+            audioEngineContext.play(id);
+        } else if (event.currentTarget.getAttribute("playstate") == "playing") {
+            audioEngineContext.stop();
+        }
+    };
+    this.resize = function (event) {
+        this.holder.style.width = window.innerWidth - 200 + 'px';
+        this.slider.style.width = window.innerWidth - 420 + 'px';
+    };
+    this.enable = function () {
+        // This is used to tell the interface object that playback of this node is ready
+        this.play.disabled = false;
+        this.play.textContent = "Play";
+        $(this.slider).removeClass('track-slider-disabled');
+    };
+    this.updateLoading = function (progress) {
+        // progress is a value from 0 to 100 indicating the current download state of media files
+    };
+    this.startPlayback = function () {
         // Called when playback has begun
-        this.play.setAttribute("playstate","playing");
+        this.play.setAttribute("playstate", "playing");
         $(".track-slider").removeClass('track-slider-playing');
-		$(this.holder).addClass('track-slider-playing');
-		var outsideReference = document.getElementById('outside-reference');
-		if (outsideReference != null) {
-			$(outsideReference).removeClass('track-slider-playing');
-		}
+        $(this.holder).addClass('track-slider-playing');
+        var outsideReference = document.getElementById('outside-reference');
+        if (outsideReference != null) {
+            $(outsideReference).removeClass('track-slider-playing');
+        }
     };
-    this.stopPlayback = function()
-    {
+    this.stopPlayback = function () {
         // Called when playback has stopped. This gets called even if playback never started!
-        this.play.setAttribute("playstate","ready");
+        this.play.setAttribute("playstate", "ready");
         $(this.holder).removeClass('track-slider-playing');
     };
-	this.getValue = function()
-	{
-		// Return the current value of the object. If there is no value, return 0
-		return this.slider.value;
-	};
-	this.getPresentedId = function()
-	{
-		// Return the presented ID of the object. For instance, the APE has sliders starting from 0. Whilst AB has alphabetical scale
-		return this.title.textContent;
-	};
-	this.canMove = function()
-	{
-		// Return either true or false if the interface object can be moved. AB / Reference cannot, whilst sliders can and therefore have a continuous scale.
-		// These are checked primarily if the interface check option 'fragmentMoved' is enabled.
-		return true;
-	};
-	this.exportXMLDOM = function(audioObject) {
-		// Called by the audioObject holding this element to export the interface <value> node.
-		// If there is no value node (such as outside reference), return null
-		// If there are multiple value nodes (such as multiple scale / 2D scales), return an array of nodes with each value node having an 'interfaceName' attribute
-		// Use storage.document.createElement('value'); to generate the XML node.
-		var node = storage.document.createElement('value');
+    this.getValue = function () {
+        // Return the current value of the object. If there is no value, return 0
+        return this.slider.value;
+    };
+    this.getPresentedId = function () {
+        // Return the presented ID of the object. For instance, the APE has sliders starting from 0. Whilst AB has alphabetical scale
+        return this.title.textContent;
+    };
+    this.canMove = function () {
+        // Return either true or false if the interface object can be moved. AB / Reference cannot, whilst sliders can and therefore have a continuous scale.
+        // These are checked primarily if the interface check option 'fragmentMoved' is enabled.
+        return true;
+    };
+    this.exportXMLDOM = function (audioObject) {
+        // Called by the audioObject holding this element to export the interface <value> node.
+        // If there is no value node (such as outside reference), return null
+        // If there are multiple value nodes (such as multiple scale / 2D scales), return an array of nodes with each value node having an 'interfaceName' attribute
+        // Use storage.document.createElement('value'); to generate the XML node.
+        var node = storage.document.createElement('value');
         node.textContent = this.slider.value;
         return node;
-	};
-    this.error = function() {
-            // audioObject has an error!!
+    };
+    this.error = function () {
+        // audioObject has an error!!
         this.playback.textContent = "Error";
         $(this.playback).addClass("error-colour");
     }
 };
 
-function resizeWindow(event)
-{
-	// Called on every window resize event, use this to scale your page properly
-	
-	var numObj = document.getElementsByClassName('track-slider').length;
-	var totalHeight = (numObj * 125)-25;
-	document.getElementById('scale-holder').style.width = window.innerWidth-220 + 'px';
-	// Cheers edge for making me delete a canvas every resize.
-	var canvas = document.getElementById('scale-canvas');
+function resizeWindow(event) {
+    // Called on every window resize event, use this to scale your page properly
+
+    var numObj = document.getElementsByClassName('track-slider').length;
+    var totalHeight = (numObj * 125) - 25;
+    document.getElementById('scale-holder').style.width = window.innerWidth - 220 + 'px';
+    // Cheers edge for making me delete a canvas every resize.
+    var canvas = document.getElementById('scale-canvas');
     var new_canvas = document.createElement("canvas");
     new_canvas.id = 'scale-canvas';
     new_canvas.style.marginLeft = "100px";
     canvas.parentElement.appendChild(new_canvas);
     canvas.parentElement.removeChild(canvas);
-	new_canvas.width = window.innerWidth-420;
-	new_canvas.height = totalHeight;
-	for (var i in audioEngineContext.audioObjects)
-	{
-		if (audioEngineContext.audioObjects[i].specification.type != 'outside-reference'){
-			audioEngineContext.audioObjects[i].interfaceDOM.resize(event);
-		}
-	}
-    document.getElementById("slider").style.height = totalHeight+50+'px';
-	drawScale();
+    new_canvas.width = window.innerWidth - 420;
+    new_canvas.height = totalHeight;
+    for (var i in audioEngineContext.audioObjects) {
+        if (audioEngineContext.audioObjects[i].specification.type != 'outside-reference') {
+            audioEngineContext.audioObjects[i].interfaceDOM.resize(event);
+        }
+    }
+    document.getElementById("slider").style.height = totalHeight + 50 + 'px';
+    drawScale();
 }
 
-function drawScale()
-{
-	var interfaceObj = testState.currentStateMap.interfaces[0];
-	var scales = testState.currentStateMap.interfaces[0].scales;
-	scales = scales.sort(function(a,b) {
-		return a.position - b.position;
-	});
-	var canvas = document.getElementById('scale-canvas');
-	var ctx = canvas.getContext("2d");
-	var height = canvas.height;
-	var width = canvas.width;
-	var textHolder = document.getElementById('scale-text-holder');
-	textHolder.innerHTML = "";
-	ctx.fillStyle = "#000000";
-	ctx.setLineDash([1,4]);
-	for (var scale of scales)
-	{
-		var posPercent = scale.position / 100.0;
-		var posPix = Math.round(width * posPercent);
-		if(posPix<=0){posPix=1;}
-		if(posPix>=width){posPix=width-1;}
-		ctx.moveTo(posPix,0);
-		ctx.lineTo(posPix,height);
-		ctx.stroke();
-		
-		var text = document.createElement('div');
-		text.align = "center";
-		var textC = document.createElement('span');
-		textC.textContent = scale.text;
-		text.appendChild(textC);
-		text.className = "scale-text";
-		textHolder.appendChild(text);
-		text.style.width = Math.ceil($(text).width())+'px';
-		text.style.left = (posPix+100-($(text).width()/2)) +'px';
-	}
+function drawScale() {
+    var interfaceObj = testState.currentStateMap.interfaces[0];
+    var scales = testState.currentStateMap.interfaces[0].scales;
+    scales = scales.sort(function (a, b) {
+        return a.position - b.position;
+    });
+    var canvas = document.getElementById('scale-canvas');
+    var ctx = canvas.getContext("2d");
+    var height = canvas.height;
+    var width = canvas.width;
+    var textHolder = document.getElementById('scale-text-holder');
+    textHolder.innerHTML = "";
+    ctx.fillStyle = "#000000";
+    ctx.setLineDash([1, 4]);
+    for (var scale of scales) {
+        var posPercent = scale.position / 100.0;
+        var posPix = Math.round(width * posPercent);
+        if (posPix <= 0) {
+            posPix = 1;
+        }
+        if (posPix >= width) {
+            posPix = width - 1;
+        }
+        ctx.moveTo(posPix, 0);
+        ctx.lineTo(posPix, height);
+        ctx.stroke();
+
+        var text = document.createElement('div');
+        text.align = "center";
+        var textC = document.createElement('span');
+        textC.textContent = scale.text;
+        text.appendChild(textC);
+        text.className = "scale-text";
+        textHolder.appendChild(text);
+        text.style.width = Math.ceil($(text).width()) + 'px';
+        text.style.left = (posPix + 100 - ($(text).width() / 2)) + 'px';
+    }
 }
 
 function buttonSubmitClick() // TODO: Only when all songs have been played!
 {
-	var checks = [];
-	checks = checks.concat(testState.currentStateMap.interfaces[0].options);
-	checks = checks.concat(specification.interfaces.options);
-	var canContinue = true;
-	
-	// Check that the anchor and reference objects are correctly placed
-	if (interfaceContext.checkHiddenAnchor() == false) {return;}
-	if (interfaceContext.checkHiddenReference() == false) {return;}
-	
-	for (var i=0; i<checks.length; i++) {
-		if (checks[i].type == 'check')
-		{
-			switch(checks[i].name) {
-			case 'fragmentPlayed':
-				// Check if all fragments have been played
-				var checkState = interfaceContext.checkAllPlayed();
-				if (checkState == false) {canContinue = false;}
-				break;
-			case  'fragmentFullPlayback':
-				// Check all fragments have been played to their full length
-				var checkState = interfaceContext.checkAllPlayed();
-				if (checkState == false) {canContinue = false;}
-				console.log('NOTE: fragmentFullPlayback not currently implemented, performing check fragmentPlayed instead');
-				break;
-			case 'fragmentMoved':
-				// Check all fragment sliders have been moved.
-				var checkState = interfaceContext.checkAllMoved();
-				if (checkState == false) {canContinue = false;}
-				break;
-			case 'fragmentComments':
-				// Check all fragment sliders have been moved.
-				var checkState = interfaceContext.checkAllCommented();
-				if (checkState == false) {canContinue = false;}
-				break;
-			case 'scalerange':
-                // Check the scale has been used effectively
-                var checkState = interfaceContext.checkScaleRange(checks[i].min,checks[i].max);
-                if (checkState == false) {canContinue = false;}
-				break;
-			default:
-				console.log("WARNING - Check option "+checks[i].check+" is not supported on this interface");
-				break;
-			}
+    var checks = [];
+    checks = checks.concat(testState.currentStateMap.interfaces[0].options);
+    checks = checks.concat(specification.interfaces.options);
+    var canContinue = true;
 
-		}
-		if (!canContinue) {break;}
-	}
-	
+    // Check that the anchor and reference objects are correctly placed
+    if (interfaceContext.checkHiddenAnchor() == false) {
+        return;
+    }
+    if (interfaceContext.checkHiddenReference() == false) {
+        return;
+    }
+
+    for (var i = 0; i < checks.length; i++) {
+        if (checks[i].type == 'check') {
+            switch (checks[i].name) {
+                case 'fragmentPlayed':
+                    // Check if all fragments have been played
+                    var checkState = interfaceContext.checkAllPlayed();
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    break;
+                case 'fragmentFullPlayback':
+                    // Check all fragments have been played to their full length
+                    var checkState = interfaceContext.checkAllPlayed();
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    console.log('NOTE: fragmentFullPlayback not currently implemented, performing check fragmentPlayed instead');
+                    break;
+                case 'fragmentMoved':
+                    // Check all fragment sliders have been moved.
+                    var checkState = interfaceContext.checkAllMoved();
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    break;
+                case 'fragmentComments':
+                    // Check all fragment sliders have been moved.
+                    var checkState = interfaceContext.checkAllCommented();
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    break;
+                case 'scalerange':
+                    // Check the scale has been used effectively
+                    var checkState = interfaceContext.checkScaleRange(checks[i].min, checks[i].max);
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    break;
+                default:
+                    console.log("WARNING - Check option " + checks[i].check + " is not supported on this interface");
+                    break;
+            }
+
+        }
+        if (!canContinue) {
+            break;
+        }
+    }
+
     if (canContinue) {
-	    if (audioEngineContext.status == 1) {
-	        var playback = document.getElementById('playback-button');
-	        playback.click();
-	    // This function is called when the submit button is clicked. Will check for any further tests to perform, or any post-test options
-	    } else
-	    {
-	        if (audioEngineContext.timer.testStarted == false)
-	        {
-	            interfaceContext.lightbox.post("Warning",'You have not started the test! Please press start to begin the test!');
-	            return;
-	        }
-	    }
-	    testState.advanceState();
-    } 
+        if (audioEngineContext.status == 1) {
+            var playback = document.getElementById('playback-button');
+            playback.click();
+            // This function is called when the submit button is clicked. Will check for any further tests to perform, or any post-test options
+        } else {
+            if (audioEngineContext.timer.testStarted == false) {
+                interfaceContext.lightbox.post("Warning", 'You have not started the test! Please press start to begin the test!');
+                return;
+            }
+        }
+        testState.advanceState();
+    }
 }
 
-function pageXMLSave(store, pageSpecification)
-{
-	// MANDATORY
-	// Saves a specific test page
-	// You can use this space to add any extra nodes to your XML <audioHolder> saves
-	// Get the current <page> information in store (remember to appendChild your data to it)
-	// pageSpecification is the current page node configuration
-	// To create new XML nodes, use storage.document.createElement();
-}
\ No newline at end of file
+function pageXMLSave(store, pageSpecification) {
+    // MANDATORY
+    // Saves a specific test page
+    // You can use this space to add any extra nodes to your XML <audioHolder> saves
+    // Get the current <page> information in store (remember to appendChild your data to it)
+    // pageSpecification is the current page node configuration
+    // To create new XML nodes, use storage.document.createElement();
+}
diff -r cc2364d8bc17 -r 2577d983f291 interfaces/mushra.css
--- a/interfaces/mushra.css	Mon Nov 14 12:14:48 2016 +0000
+++ b/interfaces/mushra.css	Mon Nov 14 14:23:41 2016 +0000
@@ -2,156 +2,133 @@
  * Hold any style information for MUSHRA interface. Customise if you like to make the interface your own!
  * 
  */
+
 body {
-	/* Set the background colour (note US English spelling) to grey*/
-	background-color: #ddd
+    /* Set the background colour (note US English spelling) to grey*/
+    background-color: #ddd
 }
-
 div.pageTitle {
-	width: auto;
-	height: 20px;
-	margin: 10px 0px;
+    width: auto;
+    height: 20px;
+    margin: 10px 0px;
 }
-
-div.pageTitle span{
-	font-size: 1.5em;
+div.pageTitle span {
+    font-size: 1.5em;
 }
-
 button {
-	/* Specify any button structure or style */
-	min-width: 20px;
-	background-color: #ddd
+    /* Specify any button structure or style */
+    min-width: 20px;
+    background-color: #ddd
 }
-
 div#slider-holder {
-	height: inherit;
-	position: absolute;
-	left: 0px;
-	z-index: 3;
+    height: inherit;
+    position: absolute;
+    left: 0px;
+    z-index: 3;
 }
-
 div#scale-holder {
-	height: inherit;
-	position: absolute;
-	left: 0px;
-	z-index: 2;
+    height: inherit;
+    position: absolute;
+    left: 0px;
+    z-index: 2;
 }
-
 div#scale-text-holder {
-	position:relative;
-	width: 100px;
-	float: left;
+    position: relative;
+    width: 100px;
+    float: left;
 }
 div.scale-text {
-	position: absolute;
+    position: absolute;
 }
-
 canvas#scale-canvas {
-	position: relative;
-	float: left;
+    position: relative;
+    float: left;
 }
-
 div.track-slider {
-	float: left;
-	width: 94px;
-	border: solid;
-	border-width: 1px;
-	border-color: black;
-	padding:2px;
-	margin-left: 50px;
+    float: left;
+    width: 94px;
+    border: solid;
+    border-width: 1px;
+    border-color: black;
+    padding: 2px;
+    margin-left: 50px;
 }
-
 div#outside-reference-holder {
     display: flex;
     align-content: center;
     justify-content: center;
     margin-bottom: 5px;
 }
-
 button.outside-reference {
     position: inherit;
     margin: 0px 5px;
 }
-
 div.track-slider-playing {
-	background-color: #FFDDDD;
+    background-color: #FFDDDD;
 }
-
 input.track-slider-range {
-	margin: 2px 0px;
+    margin: 2px 0px;
 }
-
-input[type=range][orient=vertical]
-{
-    writing-mode: bt-lr; /* IE */
-    -webkit-appearance: slider-vertical; /* WebKit */
+input[type=range][orient=vertical] {
+    writing-mode: bt-lr;
+    /* IE */
+    -webkit-appearance: slider-vertical;
+    /* WebKit */
     width: 8px;
     padding: 0 5px;
     color: rgb(255, 144, 144);
 }
-
 input[type=range]::-webkit-slider-runnable-track {
-	width: 8px;
-	cursor: pointer;
-	background: #fff;
-	border-radius: 4px;
-	border: 1px solid #000;
+    width: 8px;
+    cursor: pointer;
+    background: #fff;
+    border-radius: 4px;
+    border: 1px solid #000;
 }
-
 input[type=range]::-moz-range-track {
-	width: 8px;
-	cursor: pointer;
-	background: #fff;
-	border-radius: 4px;
-	border: 1px solid #000;
+    width: 8px;
+    cursor: pointer;
+    background: #fff;
+    border-radius: 4px;
+    border: 1px solid #000;
 }
-
 input[type=range]::-ms-track {
-	cursor: pointer;
-	background: #fff;
-	border-radius: 4px;
-	border: 1px solid #000;
+    cursor: pointer;
+    background: #fff;
+    border-radius: 4px;
+    border: 1px solid #000;
 }
-
 input.track-slider-not-moved[type=range]::-webkit-slider-runnable-track {
-	background: #aaa;
+    background: #aaa;
 }
-
 input.track-slider-not-moved[type=range]::-moz-range-track {
-	background: #aaa;
+    background: #aaa;
 }
-
-
 input[type=range]::-moz-range-thumb {
-	margin-left: -7px;
-	cursor: pointer;
-	margin-top: -1px;
-	box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
+    margin-left: -7px;
+    cursor: pointer;
+    margin-top: -1px;
+    box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
 }
-
 input[type=range]::-webkit-slider-thumb {
-	cursor: pointer;
-	margin-top: -1px;
-	margin-left: -4px;
+    cursor: pointer;
+    margin-top: -1px;
+    margin-left: -4px;
 }
-
 input[type=range]::-ms-thumb {
-	cursor: pointer;
-	margin-top: -1px;
-	margin-left: -4px;
+    cursor: pointer;
+    margin-top: -1px;
+    margin-left: -4px;
 }
-
 input[type=range]::-ms-tooltip {
-	visibility:hidden;
+    visibility: hidden;
 }
-
 div#page-count {
     float: left;
     margin: 0px 5px;
 }
-
 div#master-volume-holder {
     position: absolute;
     top: 10px;
     left: 120px;
-}
\ No newline at end of file
+}
diff -r cc2364d8bc17 -r 2577d983f291 interfaces/mushra.js
--- a/interfaces/mushra.js	Mon Nov 14 12:14:48 2016 +0000
+++ b/interfaces/mushra.js	Mon Nov 14 14:23:41 2016 +0000
@@ -7,170 +7,166 @@
 loadInterface();
 
 function loadInterface() {
-	// Get the dimensions of the screen available to the page
-	var width = window.innerWidth;
-	var height = window.innerHeight;
-	
-	// The injection point into the HTML page
-	interfaceContext.insertPoint = document.getElementById("topLevelBody");
-	var testContent = document.createElement('div');
-	testContent.id = 'testContent';
-	
-	// Create the top div for the Title element
-	var titleAttr = specification.title;
-	var title = document.createElement('div');
-	title.className = "title";
-	title.align = "center";
-	var titleSpan = document.createElement('span');
+    // Get the dimensions of the screen available to the page
+    var width = window.innerWidth;
+    var height = window.innerHeight;
+
+    // The injection point into the HTML page
+    interfaceContext.insertPoint = document.getElementById("topLevelBody");
+    var testContent = document.createElement('div');
+    testContent.id = 'testContent';
+
+    // Create the top div for the Title element
+    var titleAttr = specification.title;
+    var title = document.createElement('div');
+    title.className = "title";
+    title.align = "center";
+    var titleSpan = document.createElement('span');
     titleSpan.id = "test-title";
-	
-	// Set title to that defined in XML, else set to default
-	if (titleAttr != undefined) {
-		titleSpan.textContent = titleAttr;
-	} else {
-		titleSpan.textContent =  'Listening test';
-	}
-	// Insert the titleSpan element into the title div element.
-	title.appendChild(titleSpan);
-	
-	var pagetitle = document.createElement('div');
-	pagetitle.className = "pageTitle";
-	pagetitle.align = "center";
-	var titleSpan = document.createElement('span');
-	titleSpan.id = "pageTitle";
-	pagetitle.appendChild(titleSpan);
-	
-	// Create Interface buttons!
-	var interfaceButtons = document.createElement('div');
-	interfaceButtons.id = 'interface-buttons';
-	interfaceButtons.style.height = '25px';
-	
-	// Create playback start/stop points
-	var playback = document.createElement("button");
-	playback.innerHTML = 'Stop';
-	playback.id = 'playback-button';
-	playback.style.float = 'left';
-	// onclick function. Check if it is playing or not, call the correct function in the
-	// audioEngine, change the button text to reflect the next state.
-	playback.onclick = function() {
-		if (audioEngineContext.status == 1) {
-			audioEngineContext.stop();
-			this.innerHTML = 'Stop';
+
+    // Set title to that defined in XML, else set to default
+    if (titleAttr != undefined) {
+        titleSpan.textContent = titleAttr;
+    } else {
+        titleSpan.textContent = 'Listening test';
+    }
+    // Insert the titleSpan element into the title div element.
+    title.appendChild(titleSpan);
+
+    var pagetitle = document.createElement('div');
+    pagetitle.className = "pageTitle";
+    pagetitle.align = "center";
+    var titleSpan = document.createElement('span');
+    titleSpan.id = "pageTitle";
+    pagetitle.appendChild(titleSpan);
+
+    // Create Interface buttons!
+    var interfaceButtons = document.createElement('div');
+    interfaceButtons.id = 'interface-buttons';
+    interfaceButtons.style.height = '25px';
+
+    // Create playback start/stop points
+    var playback = document.createElement("button");
+    playback.innerHTML = 'Stop';
+    playback.id = 'playback-button';
+    playback.style.float = 'left';
+    // onclick function. Check if it is playing or not, call the correct function in the
+    // audioEngine, change the button text to reflect the next state.
+    playback.onclick = function () {
+        if (audioEngineContext.status == 1) {
+            audioEngineContext.stop();
+            this.innerHTML = 'Stop';
             var time = audioEngineContext.timer.getTestTime();
             console.log('Stopped at ' + time); // DEBUG/SAFETY
-		}
-	};
-	// Create Submit (save) button
-	var submit = document.createElement("button");
-	submit.innerHTML = 'Next';
-	submit.onclick = buttonSubmitClick;
-	submit.id = 'submit-button';
-	submit.style.float = 'left';
-	// Append the interface buttons into the interfaceButtons object.
-	interfaceButtons.appendChild(playback);
-	interfaceButtons.appendChild(submit);
-    
+        }
+    };
+    // Create Submit (save) button
+    var submit = document.createElement("button");
+    submit.innerHTML = 'Next';
+    submit.onclick = buttonSubmitClick;
+    submit.id = 'submit-button';
+    submit.style.float = 'left';
+    // Append the interface buttons into the interfaceButtons object.
+    interfaceButtons.appendChild(playback);
+    interfaceButtons.appendChild(submit);
+
     // Create outside reference holder
     var outsideRef = document.createElement("div");
     outsideRef.id = "outside-reference-holder";
-    
-	
-	// Create a slider box
-	var sliderBox = document.createElement('div');
-	sliderBox.style.width = "100%";
-	sliderBox.style.height = window.innerHeight - 200+12 + 'px';
-	sliderBox.style.marginBottom = '10px';
-	sliderBox.id = 'slider';
-	var scaleHolder = document.createElement('div');
-	scaleHolder.id = "scale-holder";
-	sliderBox.appendChild(scaleHolder);
-	var scaleText = document.createElement('div');
-	scaleText.id = "scale-text-holder";
-	scaleHolder.appendChild(scaleText);
-	var scaleCanvas = document.createElement('canvas');
-	scaleCanvas.id = "scale-canvas";
-	scaleHolder.appendChild(scaleCanvas);
-	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');
-	feedbackHolder.id = 'feedbackHolder';
-	
-	testContent.style.zIndex = 1;
-	interfaceContext.insertPoint.innerHTML = ""; // Clear the current schema
-	
-	// Inject into HTML
-	testContent.appendChild(title); // Insert the title
-	testContent.appendChild(pagetitle);
-	testContent.appendChild(interfaceButtons);
+
+
+    // Create a slider box
+    var sliderBox = document.createElement('div');
+    sliderBox.style.width = "100%";
+    sliderBox.style.height = window.innerHeight - 200 + 12 + 'px';
+    sliderBox.style.marginBottom = '10px';
+    sliderBox.id = 'slider';
+    var scaleHolder = document.createElement('div');
+    scaleHolder.id = "scale-holder";
+    sliderBox.appendChild(scaleHolder);
+    var scaleText = document.createElement('div');
+    scaleText.id = "scale-text-holder";
+    scaleHolder.appendChild(scaleText);
+    var scaleCanvas = document.createElement('canvas');
+    scaleCanvas.id = "scale-canvas";
+    scaleHolder.appendChild(scaleCanvas);
+    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');
+    feedbackHolder.id = 'feedbackHolder';
+
+    testContent.style.zIndex = 1;
+    interfaceContext.insertPoint.innerHTML = ""; // Clear the current schema
+
+    // Inject into HTML
+    testContent.appendChild(title); // Insert the title
+    testContent.appendChild(pagetitle);
+    testContent.appendChild(interfaceButtons);
     testContent.appendChild(outsideRef);
-	testContent.appendChild(sliderBox);
-	testContent.appendChild(feedbackHolder);
-	interfaceContext.insertPoint.appendChild(testContent);
+    testContent.appendChild(sliderBox);
+    testContent.appendChild(feedbackHolder);
+    interfaceContext.insertPoint.appendChild(testContent);
 
-	// Load the full interface
-	testState.initialise();
-	testState.advanceState();
+    // Load the full interface
+    testState.initialise();
+    testState.advanceState();
 }
 
-function loadTest(audioHolderObject)
-{
-	var id = audioHolderObject.id;
-	
-	var feedbackHolder = document.getElementById('feedbackHolder');
+function loadTest(audioHolderObject) {
+    var id = audioHolderObject.id;
+
+    var feedbackHolder = document.getElementById('feedbackHolder');
     feedbackHolder.innerHTML = "";
-	var interfaceObj = audioHolderObject.interfaces;
-	if (interfaceObj.length > 1)
-	{
-		console.log("WARNING - This interface only supports one <interface> node per page. Using first interface node");
-	}
-	interfaceObj = interfaceObj[0];
-    
+    var interfaceObj = audioHolderObject.interfaces;
+    if (interfaceObj.length > 1) {
+        console.log("WARNING - This interface only supports one <interface> node per page. Using first interface node");
+    }
+    interfaceObj = interfaceObj[0];
+
     // Set the page title
     if (typeof audioHolderObject.title == "string" && audioHolderObject.title.length > 0) {
         document.getElementById("test-title").textContent = audioHolderObject.title
     }
-    
-	if(interfaceObj.title != null)
-	{
-		document.getElementById("pageTitle").textContent = interfaceObj.title;
-	}
-	
-	// Delete outside reference
-	var outsideReferenceHolder = document.getElementById("outside-reference-holder");
+
+    if (interfaceObj.title != null) {
+        document.getElementById("pageTitle").textContent = interfaceObj.title;
+    }
+
+    // Delete outside reference
+    var outsideReferenceHolder = document.getElementById("outside-reference-holder");
     outsideReferenceHolder.innerHTML = "";
-	
-	var sliderBox = document.getElementById('slider-holder');
-	sliderBox.innerHTML = "";
-	
-	var commentBoxPrefix = "Comment on track";
-	if (interfaceObj.commentBoxPrefix != undefined) {
-		commentBoxPrefix = interfaceObj.commentBoxPrefix;
-	}
-	var loopPlayback = audioHolderObject.loop;
-	
-	currentTestHolder = document.createElement('audioHolder');
-	currentTestHolder.id = audioHolderObject.id;
-	currentTestHolder.repeatCount = audioHolderObject.repeatCount;
-	
-	// Find all the audioElements from the audioHolder
-	var index = 0;
-	$(audioHolderObject.audioElements).each(function(index,element){
-		// Find URL of track
-		// In this jQuery loop, variable 'this' holds the current audioElement.
-		
-		var audioObject = audioEngineContext.newTrack(element);
-		if (element.type == 'outside-reference')
-		{
-			// Construct outside reference;
-			var orNode = new interfaceContext.outsideReferenceDOM(audioObject,index,outsideReferenceHolder);
-			audioObject.bindInterface(orNode);
-		} else {
-			// Create a slider per track
-            switch(audioObject.specification.parent.label) {
+
+    var sliderBox = document.getElementById('slider-holder');
+    sliderBox.innerHTML = "";
+
+    var commentBoxPrefix = "Comment on track";
+    if (interfaceObj.commentBoxPrefix != undefined) {
+        commentBoxPrefix = interfaceObj.commentBoxPrefix;
+    }
+    var loopPlayback = audioHolderObject.loop;
+
+    currentTestHolder = document.createElement('audioHolder');
+    currentTestHolder.id = audioHolderObject.id;
+    currentTestHolder.repeatCount = audioHolderObject.repeatCount;
+
+    // Find all the audioElements from the audioHolder
+    var index = 0;
+    $(audioHolderObject.audioElements).each(function (index, element) {
+        // Find URL of track
+        // In this jQuery loop, variable 'this' holds the current audioElement.
+
+        var audioObject = audioEngineContext.newTrack(element);
+        if (element.type == 'outside-reference') {
+            // Construct outside reference;
+            var orNode = new interfaceContext.outsideReferenceDOM(audioObject, index, outsideReferenceHolder);
+            audioObject.bindInterface(orNode);
+        } else {
+            // Create a slider per track
+            switch (audioObject.specification.parent.label) {
                 case "none":
                     label = "";
                     break;
@@ -181,38 +177,34 @@
                     label = String.fromCharCode(65 + index);
                     break;
                 default:
-                    label = ""+index;
+                    label = "" + index;
                     break;
             }
-			var sliderObj = new sliderObject(audioObject,label);
-			
-			if (typeof audioHolderObject.initialPosition === "number")
-			{
-				// Set the values
-				sliderObj.slider.value = audioHolderObject.initalPosition;
-			} else {
-				// Distribute it randomnly
-				sliderObj.slider.value = Math.random();
-			}
-			sliderBox.appendChild(sliderObj.holder);
-			audioObject.bindInterface(sliderObj);
+            var sliderObj = new sliderObject(audioObject, label);
+
+            if (typeof audioHolderObject.initialPosition === "number") {
+                // Set the values
+                sliderObj.slider.value = audioHolderObject.initalPosition;
+            } else {
+                // Distribute it randomnly
+                sliderObj.slider.value = Math.random();
+            }
+            sliderBox.appendChild(sliderObj.holder);
+            audioObject.bindInterface(sliderObj);
             interfaceContext.commentBoxes.createCommentBox(audioObject);
-			index += 1;
-		}
-        
-	});
-    
-    
+            index += 1;
+        }
+
+    });
+
+
     var interfaceOptions = specification.interfaces.options.concat(interfaceObj.options);
-    for (var option of interfaceOptions)
-    {
-        if (option.type == "show")
-        {
-            switch(option.name) {
+    for (var option of interfaceOptions) {
+        if (option.type == "show") {
+            switch (option.name) {
                 case "playhead":
                     var playbackHolder = document.getElementById('playback-holder');
-                    if (playbackHolder == null)
-                    {
+                    if (playbackHolder == null) {
                         playbackHolder = document.createElement('div');
                         playbackHolder.style.width = "100%";
                         playbackHolder.align = 'center';
@@ -222,308 +214,305 @@
                     break;
                 case "page-count":
                     var pagecountHolder = document.getElementById('page-count');
-                    if (pagecountHolder == null)
-                    {
+                    if (pagecountHolder == null) {
                         pagecountHolder = document.createElement('div');
                         pagecountHolder.id = 'page-count';
                     }
-                    pagecountHolder.innerHTML = '<span>Page '+(testState.stateIndex+1)+' of '+testState.stateMap.length+'</span>';
+                    pagecountHolder.innerHTML = '<span>Page ' + (testState.stateIndex + 1) + ' of ' + testState.stateMap.length + '</span>';
                     var inject = document.getElementById('interface-buttons');
                     inject.appendChild(pagecountHolder);
                     break;
                 case "volume":
-                    if (document.getElementById('master-volume-holder') == null)
-                    {
+                    if (document.getElementById('master-volume-holder') == null) {
                         feedbackHolder.appendChild(interfaceContext.volume.object);
                     }
                     break;
                 case "comments":
-                    interfaceContext.commentBoxes.showCommentBoxes(feedbackHolder,true);
+                    interfaceContext.commentBoxes.showCommentBoxes(feedbackHolder, true);
                     break;
             }
         }
     }
-	
-	$(audioHolderObject.commentQuestions).each(function(index,element) {
-		var node = interfaceContext.createCommentQuestion(element);
-		feedbackHolder.appendChild(node.holder);
-	});
-	
-	// Auto-align
-	resizeWindow(null);
+
+    $(audioHolderObject.commentQuestions).each(function (index, element) {
+        var node = interfaceContext.createCommentQuestion(element);
+        feedbackHolder.appendChild(node.holder);
+    });
+
+    // Auto-align
+    resizeWindow(null);
 }
 
-function sliderObject(audioObject,label)
-{
-	// Constructs the slider object. We use the HTML5 slider object
-	this.parent = audioObject;
-	this.holder = document.createElement('div');
-	this.title = document.createElement('span');
-	this.slider = document.createElement('input');
-	this.play = document.createElement('button');
-	
-	this.holder.className = 'track-slider';
-	this.holder.style.height = window.innerHeight-200 + 'px';
-	this.holder.appendChild(this.title);
-	this.holder.appendChild(this.slider);
-	this.holder.appendChild(this.play);
-	this.holder.align = "center";
-	if (label == 0)
-	{
-		this.holder.style.marginLeft = '0px';
-	}
-	this.holder.setAttribute('trackIndex',audioObject.id);
-	
-	this.title.textContent = label;
-	this.title.style.width = "100%";
-	this.title.style.float = "left";
-	
-	this.slider.type = "range";
-	this.slider.className = "track-slider-range track-slider-not-moved";
-	this.slider.min = "0";
-	this.slider.max = "1";
-	this.slider.step = "0.01";
-	this.slider.setAttribute('orient','vertical');
-	this.slider.style.height = window.innerHeight-250 + 'px';
-	this.slider.onchange = function()
-	{
-		var time = audioEngineContext.timer.getTestTime();
-		var id = Number(this.parentNode.getAttribute('trackIndex'));
-		audioEngineContext.audioObjects[id].metric.moved(time,this.value);
-		console.log('slider '+id+' moved to '+this.value+' ('+time+')');
-		$(this).removeClass('track-slider-not-moved');
-	};
-	
-	this.play.textContent = "Loading...";
-	this.play.value = audioObject.id;
-	this.play.style.float = "left";
-	this.play.style.width = "100%";
-	this.play.disabled = true;
-    this.play.setAttribute("playstate","ready");
-	this.play.onclick = function(event)
-	{
-		var id = Number(event.currentTarget.value);
-		//audioEngineContext.metric.sliderPlayed(id);
-		if (event.currentTarget.getAttribute("playstate") == "ready")
-        {audioEngineContext.play(id);}
-        else if (event.currentTarget.getAttribute("playstate") == "playing")
-        {audioEngineContext.stop();}
-	};
-	
-	this.enable = function() {
-		this.play.disabled = false;
-		this.play.textContent = "Play";
-		$(this.slider).removeClass('track-slider-disabled');
-	};
-	
-	this.exportXMLDOM = function(audioObject) {
-		// Called by the audioObject holding this element. Must be present
-		var node = storage.document.createElement('value');
-		node.textContent = this.slider.value;
-		return node;
-	};
-    this.startPlayback = function()
-    {
+function sliderObject(audioObject, label) {
+    // Constructs the slider object. We use the HTML5 slider object
+    this.parent = audioObject;
+    this.holder = document.createElement('div');
+    this.title = document.createElement('span');
+    this.slider = document.createElement('input');
+    this.play = document.createElement('button');
+
+    this.holder.className = 'track-slider';
+    this.holder.style.height = window.innerHeight - 200 + 'px';
+    this.holder.appendChild(this.title);
+    this.holder.appendChild(this.slider);
+    this.holder.appendChild(this.play);
+    this.holder.align = "center";
+    if (label == 0) {
+        this.holder.style.marginLeft = '0px';
+    }
+    this.holder.setAttribute('trackIndex', audioObject.id);
+
+    this.title.textContent = label;
+    this.title.style.width = "100%";
+    this.title.style.float = "left";
+
+    this.slider.type = "range";
+    this.slider.className = "track-slider-range track-slider-not-moved";
+    this.slider.min = "0";
+    this.slider.max = "1";
+    this.slider.step = "0.01";
+    this.slider.setAttribute('orient', 'vertical');
+    this.slider.style.height = window.innerHeight - 250 + 'px';
+    this.slider.onchange = function () {
+        var time = audioEngineContext.timer.getTestTime();
+        var id = Number(this.parentNode.getAttribute('trackIndex'));
+        audioEngineContext.audioObjects[id].metric.moved(time, this.value);
+        console.log('slider ' + id + ' moved to ' + this.value + ' (' + time + ')');
+        $(this).removeClass('track-slider-not-moved');
+    };
+
+    this.play.textContent = "Loading...";
+    this.play.value = audioObject.id;
+    this.play.style.float = "left";
+    this.play.style.width = "100%";
+    this.play.disabled = true;
+    this.play.setAttribute("playstate", "ready");
+    this.play.onclick = function (event) {
+        var id = Number(event.currentTarget.value);
+        //audioEngineContext.metric.sliderPlayed(id);
+        if (event.currentTarget.getAttribute("playstate") == "ready") {
+            audioEngineContext.play(id);
+        } else if (event.currentTarget.getAttribute("playstate") == "playing") {
+            audioEngineContext.stop();
+        }
+    };
+
+    this.enable = function () {
+        this.play.disabled = false;
+        this.play.textContent = "Play";
+        $(this.slider).removeClass('track-slider-disabled');
+    };
+
+    this.exportXMLDOM = function (audioObject) {
+        // Called by the audioObject holding this element. Must be present
+        var node = storage.document.createElement('value');
+        node.textContent = this.slider.value;
+        return node;
+    };
+    this.startPlayback = function () {
         // Called when playback has begun
-        this.play.setAttribute("playstate","playing");
+        this.play.setAttribute("playstate", "playing");
         $(".track-slider").removeClass('track-slider-playing');
-		$(this.holder).addClass('track-slider-playing');
-		var outsideReference = document.getElementById('outside-reference');
-		if (outsideReference != null) {
-			$(outsideReference).removeClass('track-slider-playing');
-		}
+        $(this.holder).addClass('track-slider-playing');
+        var outsideReference = document.getElementById('outside-reference');
+        if (outsideReference != null) {
+            $(outsideReference).removeClass('track-slider-playing');
+        }
         this.play.textContent = "Stop";
     };
-    this.stopPlayback = function()
-    {
+    this.stopPlayback = function () {
         // Called when playback has stopped. This gets called even if playback never started!
-        this.play.setAttribute("playstate","ready");
+        this.play.setAttribute("playstate", "ready");
         $(this.holder).removeClass('track-slider-playing');
         this.play.textContent = "Play";
     };
-	this.getValue = function() {
-		return this.slider.value;
-	};
-	
-	this.resize = function(event)
-	{
-		this.holder.style.height = window.innerHeight-200 + 'px';
-		this.slider.style.height = window.innerHeight-250 + 'px';
-	};
-	this.updateLoading = function(progress)
-	{
-		progress = String(progress);
-		progress = progress.substr(0,5);
-		this.play.textContent = "Loading: "+progress+"%";
-	};
-	
-	if (this.parent.state == 1)
-	{
-		this.enable();
-	}
-	this.getPresentedId = function()
-	{
-		return this.title.textContent;
-	};
-	this.canMove = function()
-	{
-		return true;
-	};
-    this.error = function() {
-            // audioObject has an error!!
+    this.getValue = function () {
+        return this.slider.value;
+    };
+
+    this.resize = function (event) {
+        this.holder.style.height = window.innerHeight - 200 + 'px';
+        this.slider.style.height = window.innerHeight - 250 + 'px';
+    };
+    this.updateLoading = function (progress) {
+        progress = String(progress);
+        progress = progress.substr(0, 5);
+        this.play.textContent = "Loading: " + progress + "%";
+    };
+
+    if (this.parent.state == 1) {
+        this.enable();
+    }
+    this.getPresentedId = function () {
+        return this.title.textContent;
+    };
+    this.canMove = function () {
+        return true;
+    };
+    this.error = function () {
+        // audioObject has an error!!
         this.playback.textContent = "Error";
         $(this.playback).addClass("error-colour");
     }
 }
 
-function resizeWindow(event)
-{
-	// Function called when the window has been resized.
-	// MANDATORY FUNCTION
-	
-	var outsideRef = document.getElementById('outside-reference');
-	if(outsideRef != null)
-	{
-		outsideRef.style.left = (window.innerWidth-120)/2 + 'px';
-	}
-	
-	// Auto-align
-	var numObj = document.getElementsByClassName('track-slider').length;
-	var totalWidth = (numObj-1)*150+100;
-	var diff = (window.innerWidth - totalWidth)/2;
-	document.getElementById('slider').style.height = window.innerHeight - 180 + 'px';
-	if (diff <= 0){diff = 0;}
-	document.getElementById('slider-holder').style.marginLeft = diff + 'px';
-	for (var i in audioEngineContext.audioObjects)
-	{
-		if (audioEngineContext.audioObjects[i].specification.type != 'outside-reference'){
-			audioEngineContext.audioObjects[i].interfaceDOM.resize(event);
-		}
-	}
-	document.getElementById('scale-holder').style.marginLeft = (diff-100) + 'px';
-	document.getElementById('scale-text-holder').style.height = window.innerHeight-194 + 'px';
+function resizeWindow(event) {
+    // Function called when the window has been resized.
+    // MANDATORY FUNCTION
+
+    var outsideRef = document.getElementById('outside-reference');
+    if (outsideRef != null) {
+        outsideRef.style.left = (window.innerWidth - 120) / 2 + 'px';
+    }
+
+    // Auto-align
+    var numObj = document.getElementsByClassName('track-slider').length;
+    var totalWidth = (numObj - 1) * 150 + 100;
+    var diff = (window.innerWidth - totalWidth) / 2;
+    document.getElementById('slider').style.height = window.innerHeight - 180 + 'px';
+    if (diff <= 0) {
+        diff = 0;
+    }
+    document.getElementById('slider-holder').style.marginLeft = diff + 'px';
+    for (var i in audioEngineContext.audioObjects) {
+        if (audioEngineContext.audioObjects[i].specification.type != 'outside-reference') {
+            audioEngineContext.audioObjects[i].interfaceDOM.resize(event);
+        }
+    }
+    document.getElementById('scale-holder').style.marginLeft = (diff - 100) + 'px';
+    document.getElementById('scale-text-holder').style.height = window.innerHeight - 194 + 'px';
     // Cheers edge for making me delete a canvas every resize.
-	var canvas = document.getElementById('scale-canvas');
+    var canvas = document.getElementById('scale-canvas');
     var new_canvas = document.createElement("canvas");
     new_canvas.id = 'scale-canvas';
     canvas.parentElement.appendChild(new_canvas);
     canvas.parentElement.removeChild(canvas);
-	new_canvas.width = totalWidth;
-	new_canvas.height = window.innerHeight-194;
-	drawScale();
+    new_canvas.width = totalWidth;
+    new_canvas.height = window.innerHeight - 194;
+    drawScale();
 }
 
-function drawScale()
-{
-	var interfaceObj = testState.currentStateMap.interfaces[0];
-	var scales = testState.currentStateMap.interfaces[0].scales;
-	scales = scales.sort(function(a,b) {
-		return a.position - b.position;
-	});
-	var canvas = document.getElementById('scale-canvas');
-	var ctx = canvas.getContext("2d");
-	var height = canvas.height;
-	var width = canvas.width;
-    ctx.clearRect(0,0,canvas.width,canvas.height);
-	var draw_heights = [24, height-34];
-	var textHolder = document.getElementById('scale-text-holder');
-	textHolder.innerHTML = "";
-	var lastHeight = 0;
-	for (var scale of scales)
-	{
-		var posPercent = scale.position / 100.0;
-		var posPix = (1-posPercent)*(draw_heights[1]-draw_heights[0])+draw_heights[0];
-		ctx.fillStyle = "#000000";
-		ctx.setLineDash([1,2]);
-		ctx.moveTo(0,posPix);
-		ctx.lineTo(width,posPix);
-		ctx.stroke();
-		var text = document.createElement('div');
-		text.align = "right";
-		var textC = document.createElement('span');
-		textC.textContent = scale.text;
-		text.appendChild(textC);
-		text.className = "scale-text";
-		textHolder.appendChild(text);
-		text.style.top = (posPix-9) + 'px';
-		text.style.left = 100 - ($(text).width()+3) + 'px';
-		lastHeight = posPix;
-	}
+function drawScale() {
+    var interfaceObj = testState.currentStateMap.interfaces[0];
+    var scales = testState.currentStateMap.interfaces[0].scales;
+    scales = scales.sort(function (a, b) {
+        return a.position - b.position;
+    });
+    var canvas = document.getElementById('scale-canvas');
+    var ctx = canvas.getContext("2d");
+    var height = canvas.height;
+    var width = canvas.width;
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+    var draw_heights = [24, height - 34];
+    var textHolder = document.getElementById('scale-text-holder');
+    textHolder.innerHTML = "";
+    var lastHeight = 0;
+    for (var scale of scales) {
+        var posPercent = scale.position / 100.0;
+        var posPix = (1 - posPercent) * (draw_heights[1] - draw_heights[0]) + draw_heights[0];
+        ctx.fillStyle = "#000000";
+        ctx.setLineDash([1, 2]);
+        ctx.moveTo(0, posPix);
+        ctx.lineTo(width, posPix);
+        ctx.stroke();
+        var text = document.createElement('div');
+        text.align = "right";
+        var textC = document.createElement('span');
+        textC.textContent = scale.text;
+        text.appendChild(textC);
+        text.className = "scale-text";
+        textHolder.appendChild(text);
+        text.style.top = (posPix - 9) + 'px';
+        text.style.left = 100 - ($(text).width() + 3) + 'px';
+        lastHeight = posPix;
+    }
 }
 
 function buttonSubmitClick() // TODO: Only when all songs have been played!
 {
-	var checks = [];
-	checks = checks.concat(testState.currentStateMap.interfaces[0].options);
-	checks = checks.concat(specification.interfaces.options);
-	var canContinue = true;
-	
-	// Check that the anchor and reference objects are correctly placed
-	if (interfaceContext.checkHiddenAnchor() == false) {return;}
-	if (interfaceContext.checkHiddenReference() == false) {return;}
-	
-	for (var i=0; i<checks.length; i++) {
-		if (checks[i].type == 'check')
-		{
-			switch(checks[i].name) {
-			case 'fragmentPlayed':
-				// Check if all fragments have been played
-				var checkState = interfaceContext.checkAllPlayed();
-				if (checkState == false) {canContinue = false;}
-				break;
-			case  'fragmentFullPlayback':
-				// Check all fragments have been played to their full length
-				var checkState = interfaceContext.checkAllPlayed();
-				if (checkState == false) {canContinue = false;}
-				console.log('NOTE: fragmentFullPlayback not currently implemented, performing check fragmentPlayed instead');
-				break;
-			case 'fragmentMoved':
-				// Check all fragment sliders have been moved.
-				var checkState = interfaceContext.checkAllMoved();
-				if (checkState == false) {canContinue = false;}
-				break;
-			case 'fragmentComments':
-				// Check all fragment sliders have been moved.
-				var checkState = interfaceContext.checkAllCommented();
-				if (checkState == false) {canContinue = false;}
-				break;
-			case 'scalerange':
-                // Check the scale has been used effectively
-                var checkState = interfaceContext.checkScaleRange(checks[i].min,checks[i].max);
-                if (checkState == false) {canContinue = false;}
-				break;
-			default:
-				console.log("WARNING - Check option "+checks[i].check+" is not supported on this interface");
-				break;
-			}
+    var checks = [];
+    checks = checks.concat(testState.currentStateMap.interfaces[0].options);
+    checks = checks.concat(specification.interfaces.options);
+    var canContinue = true;
 
-		}
-		if (!canContinue) {break;}
-	}
-	
+    // Check that the anchor and reference objects are correctly placed
+    if (interfaceContext.checkHiddenAnchor() == false) {
+        return;
+    }
+    if (interfaceContext.checkHiddenReference() == false) {
+        return;
+    }
+
+    for (var i = 0; i < checks.length; i++) {
+        if (checks[i].type == 'check') {
+            switch (checks[i].name) {
+                case 'fragmentPlayed':
+                    // Check if all fragments have been played
+                    var checkState = interfaceContext.checkAllPlayed();
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    break;
+                case 'fragmentFullPlayback':
+                    // Check all fragments have been played to their full length
+                    var checkState = interfaceContext.checkAllPlayed();
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    console.log('NOTE: fragmentFullPlayback not currently implemented, performing check fragmentPlayed instead');
+                    break;
+                case 'fragmentMoved':
+                    // Check all fragment sliders have been moved.
+                    var checkState = interfaceContext.checkAllMoved();
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    break;
+                case 'fragmentComments':
+                    // Check all fragment sliders have been moved.
+                    var checkState = interfaceContext.checkAllCommented();
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    break;
+                case 'scalerange':
+                    // Check the scale has been used effectively
+                    var checkState = interfaceContext.checkScaleRange(checks[i].min, checks[i].max);
+                    if (checkState == false) {
+                        canContinue = false;
+                    }
+                    break;
+                default:
+                    console.log("WARNING - Check option " + checks[i].check + " is not supported on this interface");
+                    break;
+            }
+
+        }
+        if (!canContinue) {
+            break;
+        }
+    }
+
     if (canContinue) {
-	    if (audioEngineContext.status == 1) {
-	        var playback = document.getElementById('playback-button');
-	        playback.click();
-	    // This function is called when the submit button is clicked. Will check for any further tests to perform, or any post-test options
-	    } else
-	    {
-	        if (audioEngineContext.timer.testStarted == false)
-	        {
-	            interfaceContext.lightbox.post("Message",'You have not started the test! Please press start to begin the test!');
-	            return;
-	        }
-	    }
-	    testState.advanceState();
-    } 
+        if (audioEngineContext.status == 1) {
+            var playback = document.getElementById('playback-button');
+            playback.click();
+            // This function is called when the submit button is clicked. Will check for any further tests to perform, or any post-test options
+        } else {
+            if (audioEngineContext.timer.testStarted == false) {
+                interfaceContext.lightbox.post("Message", 'You have not started the test! Please press start to begin the test!');
+                return;
+            }
+        }
+        testState.advanceState();
+    }
 }
 
-function pageXMLSave(store, pageSpecification)
-{
-	// MANDATORY
-	// Saves a specific test page
-	// You can use this space to add any extra nodes to your XML <audioHolder> saves
-	// Get the current <page> information in store (remember to appendChild your data to it)
-	// pageSpecification is the current page node configuration
-	// To create new XML nodes, use storage.document.createElement();
+function pageXMLSave(store, pageSpecification) {
+    // MANDATORY
+    // Saves a specific test page
+    // You can use this space to add any extra nodes to your XML <audioHolder> saves
+    // Get the current <page> information in store (remember to appendChild your data to it)
+    // pageSpecification is the current page node configuration
+    // To create new XML nodes, use storage.document.createElement();
 }
diff -r cc2364d8bc17 -r 2577d983f291 interfaces/timeline.css
--- a/interfaces/timeline.css	Mon Nov 14 12:14:48 2016 +0000
+++ b/interfaces/timeline.css	Mon Nov 14 14:23:41 2016 +0000
@@ -2,7 +2,6 @@
     display: flex;
     justify-content: center;
 }
-
 div.timeline-element-content {
     max-width: 800px;
     min-width: 200px;
@@ -10,15 +9,13 @@
     margin: 10px 0px;
     padding: 20px;
 }
-
 div.timeline-element-canvas-holder {
     display: flex;
     width: inherit;
     height: 160px;
     margin-left: 50px;
 }
-
-canvas.canvas-layer1{
+canvas.canvas-layer1 {
     position: absolute;
 }
 canvas.canvas-layer2 {
@@ -33,21 +30,17 @@
     position: absolute;
     z-index: -3;
 }
-
 canvas.timeline-element-canvas {
     border: 1px solid black;
 }
-
 canvas.canvas-disabled {
     background-color: gray;
 }
-
 div.timeline-element-comment-holder {
     display: flex;
     flex-wrap: wrap;
     justify-content: space-between;
 }
-
 div.comment-entry {
     border: 1px solid #444444;
     max-width: 600px;
@@ -59,13 +52,11 @@
     display: flex;
     flex-direction: column;
 }
-
 div.comment-entry-header {
     display: flex;
     justify-content: space-between;
 }
-
 textarea.comment-entry-text {
     resize: none;
     margin: auto;
-}
\ No newline at end of file
+}
diff -r cc2364d8bc17 -r 2577d983f291 js/WAVE.js
--- a/js/WAVE.js	Mon Nov 14 12:14:48 2016 +0000
+++ b/js/WAVE.js	Mon Nov 14 14:23:41 2016 +0000
@@ -1,131 +1,120 @@
 // Decode and perform WAVE file byte level manipulation
 
-find_subarray = function(arr,subarr) {
+find_subarray = function (arr, subarr) {
     var arr_length = arr.length;
     var subarr_length = subarr.length;
     var last_check_index = arr_length - subarr_length;
-    
+
     positionLoop:
-    for (var i=0; i <= last_check_index; i++)
-    {
-        for (var j=0; j< subarr_length; j++)
-        {
-            if (arr[i + j] !== subarr[j]) {
-                continue positionLoop;
+        for (var i = 0; i <= last_check_index; i++) {
+            for (var j = 0; j < subarr_length; j++) {
+                if (arr[i + j] !== subarr[j]) {
+                    continue positionLoop;
+                }
             }
+            return i;
         }
-        return i;
-    }
     return -1;
 };
 
 function convertToInteger(arr) {
     var value = 0;
-    for (var i=0; i<arr.length; i++)
-    {
-        value += arr[i]<<(i*8);
+    for (var i = 0; i < arr.length; i++) {
+        value += arr[i] << (i * 8);
     }
     return value;
 }
+
 function convertToString(arr) {
     var str = "";
-    for (var i=0; i<arr.length; i++)
-    {
+    for (var i = 0; i < arr.length; i++) {
         str = str.concat(String.fromCharCode(arr[i]));
     }
     return str;
 }
 
-function WAVE()
-{
+function WAVE() {
     // The WAVE file object
     this.status == 'WAVE_DECLARED'
-    
+
     this.decoded_data = null;
-    
+
     this.RIFF = String(); //ChunkID
-	this.size; //ChunkSize
-	this.FT_Header; //Format
-	this.fmt_marker; //Subchunk1ID
-	this.formatDataLength; //Subchunk1Size
-	this.type; //AudioFormat
-	this.num_channels; //NumChannels
-	this.sample_rate; //SampleRate
-	this.byte_rate; //ByteRate
-	this.block_align; //BlockAlign
-	this.bits_per_sample; //BitsPerSample
-	this.data_header; //Subchunk2ID
-	this.data_size; //Subchunk2Size
+    this.size; //ChunkSize
+    this.FT_Header; //Format
+    this.fmt_marker; //Subchunk1ID
+    this.formatDataLength; //Subchunk1Size
+    this.type; //AudioFormat
+    this.num_channels; //NumChannels
+    this.sample_rate; //SampleRate
+    this.byte_rate; //ByteRate
+    this.block_align; //BlockAlign
+    this.bits_per_sample; //BitsPerSample
+    this.data_header; //Subchunk2ID
+    this.data_size; //Subchunk2Size
     this.num_samples;
-    
-    this.open = function(IOArrayBuffer)
-    {
+
+    this.open = function (IOArrayBuffer) {
         var IOView8 = new Uint8Array(IOArrayBuffer);
-        this.RIFF = convertToString(IOView8.subarray(0,4));
-        if (this.RIFF != 'RIFF')
-        {
+        this.RIFF = convertToString(IOView8.subarray(0, 4));
+        if (this.RIFF != 'RIFF') {
             console.log('WAVE ERR - Not a RIFF file');
             return 1;
         }
-        this.size = convertToInteger(IOView8.subarray(4,8));
-        this.FT_Header = convertToString(IOView8.subarray(8,12));
-        this.fmt_marker = convertToString(IOView8.subarray(12,16));
-        this.formatDataLength = convertToInteger(IOView8.subarray(16,20));
-        this.type = convertToInteger(IOView8.subarray(20,22));
-        this.num_channels = convertToInteger(IOView8.subarray(22,24));
-        this.sample_rate = convertToInteger(IOView8.subarray(24,28));
-        this.byte_rate = convertToInteger(IOView8.subarray(28,32));
-        this.block_align = convertToInteger(IOView8.subarray(32,34));
-        this.bits_per_sample = convertToInteger(IOView8.subarray(34,36));
-        
+        this.size = convertToInteger(IOView8.subarray(4, 8));
+        this.FT_Header = convertToString(IOView8.subarray(8, 12));
+        this.fmt_marker = convertToString(IOView8.subarray(12, 16));
+        this.formatDataLength = convertToInteger(IOView8.subarray(16, 20));
+        this.type = convertToInteger(IOView8.subarray(20, 22));
+        this.num_channels = convertToInteger(IOView8.subarray(22, 24));
+        this.sample_rate = convertToInteger(IOView8.subarray(24, 28));
+        this.byte_rate = convertToInteger(IOView8.subarray(28, 32));
+        this.block_align = convertToInteger(IOView8.subarray(32, 34));
+        this.bits_per_sample = convertToInteger(IOView8.subarray(34, 36));
+
         // Find the data header first
-        var data_start = find_subarray(IOView8,[100, 97, 116, 97]);
-        
-        this.data_header = convertToString(IOView8.subarray(data_start,data_start+4));
-        this.data_size = convertToInteger(IOView8.subarray(data_start+4,data_start+8));
-        
+        var data_start = find_subarray(IOView8, [100, 97, 116, 97]);
+
+        this.data_header = convertToString(IOView8.subarray(data_start, data_start + 4));
+        this.data_size = convertToInteger(IOView8.subarray(data_start + 4, data_start + 8));
+
         this.num_samples = this.data_size / this.block_align;
-        
+
         this.decoded_data = [];
         if (this.type != 1 && this.type != 3) {
             console.log("Neither PCM nor IEEE float, cannot decode");
             return 1;
         }
-        for (var c=0; c<this.num_channels; c++)
-        {
+        for (var c = 0; c < this.num_channels; c++) {
             this.decoded_data.push(new Float32Array(this.num_samples));
         }
-        var sampleDataOffset = data_start+8;
-        
+        var sampleDataOffset = data_start + 8;
+
         // Now need to decode the data from sampleDataOffset
         // Data is always interleved
         var data_view;
-        if (this.type == 3)
-        {
+        if (this.type == 3) {
             // Already in float
             if (this.bits_per_sample == 32) {
-                data_view = new Float32Array(IOArrayBuffer.slice(sampleDataOffset,sampleDataOffset+this.data_size));
+                data_view = new Float32Array(IOArrayBuffer.slice(sampleDataOffset, sampleDataOffset + this.data_size));
             } else if (this.bits_per_sample == 64) {
-                data_view = new Float64Array(IOArrayBuffer.slice(sampleDataOffset,sampleDataOffset+this.data_size));
+                data_view = new Float64Array(IOArrayBuffer.slice(sampleDataOffset, sampleDataOffset + this.data_size));
             }
-        } else if (this.type == 1)
-        {
-            data_view = new Float32Array(this.num_samples*this.num_channels);
-            integerConvert(new Uint8Array(IOArrayBuffer.slice(sampleDataOffset,sampleDataOffset+this.data_size)),data_view,this.bits_per_sample/8);
+        } else if (this.type == 1) {
+            data_view = new Float32Array(this.num_samples * this.num_channels);
+            integerConvert(new Uint8Array(IOArrayBuffer.slice(sampleDataOffset, sampleDataOffset + this.data_size)), data_view, this.bits_per_sample / 8);
         }
-        deInterlace(data_view,this.decoded_data);
+        deInterlace(data_view, this.decoded_data);
         return 0;
     };
 }
 
-function deInterlace(src_array, dst_array)
-{
+function deInterlace(src_array, dst_array) {
     var number = src_array.length;
     var channels = dst_array.length;
     var channel_index = 0;
     var dst_index = 0;
-    for (var n=0; n<number; n++)
-    {
+    for (var n = 0; n < number; n++) {
         dst_array[channel_index][dst_index] = src_array[n];
         channel_index++;
         if (channel_index >= channels) {
@@ -135,21 +124,18 @@
     }
 }
 
-function integerConvert(srcView,dstView,srcBytes)
-{
+function integerConvert(srcView, dstView, srcBytes) {
     //Convert integers of a Uint8Array of certain byte length into a Float32Array
     var number = dstView.length;
-    var outBits = srcBytes*8;
+    var outBits = srcBytes * 8;
     var endShift = 32 - outBits;
-    if (srcView.length != dstView.length*srcBytes)
-    {
+    if (srcView.length != dstView.length * srcBytes) {
         return -1;
     }
-    for (var n=0; n<number; n++)
-    {
-        var srcIndex = n*srcBytes;
-        var intData = convertToInteger(srcView.subarray(srcIndex,srcIndex+srcBytes));
+    for (var n = 0; n < number; n++) {
+        var srcIndex = n * srcBytes;
+        var intData = convertToInteger(srcView.subarray(srcIndex, srcIndex + srcBytes));
         intData = (intData << (endShift));
         dstView[n] = intData / 2147483648;
     }
-}
\ No newline at end of file
+}
diff -r cc2364d8bc17 -r 2577d983f291 js/loader.js
--- a/js/loader.js	Mon Nov 14 12:14:48 2016 +0000
+++ b/js/loader.js	Mon Nov 14 14:23:41 2016 +0000
@@ -1,6 +1,6 @@
 // Script to load the relevant JS files if the system supports it
 
-window.onload = function() {
+window.onload = function () {
     // First check if the Web Audio API is supported
     if (window.AudioContext == undefined && window.webkitAudioContext == undefined) {
         // Display unsuported error message
@@ -16,7 +16,7 @@
     } else {
         var head = document.getElementsByTagName("head")[0];
         var src_list = ['js/specification.js', 'js/core.js', 'js/loudness.js', 'js/xmllint.js', 'js/WAVE.js'];
-        for (var i=0; i<src_list.length; i++) {
+        for (var i = 0; i < src_list.length; i++) {
             var src = src_list[i];
             var script = document.createElement("script");
             script.type = "text/javascript";
@@ -26,4 +26,4 @@
             head.appendChild(script);
         }
     }
-}
\ No newline at end of file
+}
diff -r cc2364d8bc17 -r 2577d983f291 js/loudness.js
--- a/js/loudness.js	Mon Nov 14 12:14:48 2016 +0000
+++ b/js/loudness.js	Mon Nov 14 14:23:41 2016 +0000
@@ -8,98 +8,88 @@
 
 var interval_cal_loudness_event = null;
 
-if (typeof OfflineAudioContext == "undefined"){
-	var OfflineAudioContext = webkitOfflineAudioContext;
+if (typeof OfflineAudioContext == "undefined") {
+    var OfflineAudioContext = webkitOfflineAudioContext;
 }
 
-function calculateLoudness(buffer, timescale, target, offlineContext)
-{
-	// This function returns the EBU R 128 specification loudness model and sets the linear gain required to match -23 LUFS
-	// buffer -> Web Audio API Buffer object
-	// timescale -> M or Momentary (returns Array), S or Short (returns Array),
-	//   I or Integrated (default, returns number)
-	// target -> default is -23 LUFS but can be any LUFS measurement.
-	if(navigator.platform == 'iPad' || navigator.platform == 'iPhone') {
+function calculateLoudness(buffer, timescale, target, offlineContext) {
+    // This function returns the EBU R 128 specification loudness model and sets the linear gain required to match -23 LUFS
+    // buffer -> Web Audio API Buffer object
+    // timescale -> M or Momentary (returns Array), S or Short (returns Array),
+    //   I or Integrated (default, returns number)
+    // target -> default is -23 LUFS but can be any LUFS measurement.
+    if (navigator.platform == 'iPad' || navigator.platform == 'iPhone') {
         buffer.ready();
     }
-	if (buffer == undefined)
-	{
-		return 0;
-	}
-	if (timescale == undefined)
-	{
-		timescale = "I";
-	}
-	if (target == undefined)
-	{
-		target = -23;
-	}
-	if (offlineContext == undefined)
-	{
-		offlineContext = new OfflineAudioContext(audioContext.destination.channelCount, buffer.buffer.duration*audioContext.sampleRate, audioContext.sampleRate);
-	}
-	// Create the required filters
-	var KFilter = offlineContext.createBiquadFilter();
-	KFilter.type = "highshelf";
-	KFilter.gain.value = 4;
-	KFilter.frequency.value = 1500;
-	
-	var HPFilter = offlineContext.createBiquadFilter();
-	HPFilter.type = "highpass";
-	HPFilter.Q.value = 0.5;
-	HPFilter.frequency.value = 38;
-	// copy Data into the process buffer
-	var processSource = offlineContext.createBufferSource();
-	processSource.buffer = buffer.buffer;
-	
-	processSource.connect(KFilter);
-	KFilter.connect(HPFilter);
-	HPFilter.connect(offlineContext.destination);
-	offlineContext.oncomplete = function(renderedBuffer) {
-		// Have the renderedBuffer information, now continue processing
-		if (typeof renderedBuffer.renderedBuffer == 'object') {
-			renderedBuffer = renderedBuffer.renderedBuffer;
-		}
-		switch(timescale)
-		{
-		case "I":
-            // Calculate the Mean Squared of a signal
-            var MS = calculateMeanSquared(renderedBuffer,0.4,0.75);
-            // Calculate the Loudness of each block
-            var MSL = calculateLoudnessFromBlocks(MS);
-            // Get blocks from Absolute Gate
-            var LK = loudnessGate(MSL,MS,-70);
-            // Calculate Loudness
-            var LK_gate = loudnessOfBlocks(LK);
-            // Get blocks from Relative Gate
-            var RK = loudnessGate(MSL,MS,LK_gate-10);
-            var RK_gate = loudnessOfBlocks(RK);
-            buffer.buffer.lufs = RK_gate;
-		}
+    if (buffer == undefined) {
+        return 0;
+    }
+    if (timescale == undefined) {
+        timescale = "I";
+    }
+    if (target == undefined) {
+        target = -23;
+    }
+    if (offlineContext == undefined) {
+        offlineContext = new OfflineAudioContext(audioContext.destination.channelCount, buffer.buffer.duration * audioContext.sampleRate, audioContext.sampleRate);
+    }
+    // Create the required filters
+    var KFilter = offlineContext.createBiquadFilter();
+    KFilter.type = "highshelf";
+    KFilter.gain.value = 4;
+    KFilter.frequency.value = 1500;
+
+    var HPFilter = offlineContext.createBiquadFilter();
+    HPFilter.type = "highpass";
+    HPFilter.Q.value = 0.5;
+    HPFilter.frequency.value = 38;
+    // copy Data into the process buffer
+    var processSource = offlineContext.createBufferSource();
+    processSource.buffer = buffer.buffer;
+
+    processSource.connect(KFilter);
+    KFilter.connect(HPFilter);
+    HPFilter.connect(offlineContext.destination);
+    offlineContext.oncomplete = function (renderedBuffer) {
+        // Have the renderedBuffer information, now continue processing
+        if (typeof renderedBuffer.renderedBuffer == 'object') {
+            renderedBuffer = renderedBuffer.renderedBuffer;
+        }
+        switch (timescale) {
+            case "I":
+                // Calculate the Mean Squared of a signal
+                var MS = calculateMeanSquared(renderedBuffer, 0.4, 0.75);
+                // Calculate the Loudness of each block
+                var MSL = calculateLoudnessFromBlocks(MS);
+                // Get blocks from Absolute Gate
+                var LK = loudnessGate(MSL, MS, -70);
+                // Calculate Loudness
+                var LK_gate = loudnessOfBlocks(LK);
+                // Get blocks from Relative Gate
+                var RK = loudnessGate(MSL, MS, LK_gate - 10);
+                var RK_gate = loudnessOfBlocks(RK);
+                buffer.buffer.lufs = RK_gate;
+        }
         buffer.ready();
-	};
+    };
     processSource.start(0);
-	offlineContext.startRendering();
+    offlineContext.startRendering();
 }
 
-function calculateMeanSquared(buffer,frame_dur,frame_overlap)
-{
-    frame_size = Math.floor(buffer.sampleRate*frame_dur);
-    step_size = Math.floor(frame_size*(1.0-frame_overlap));
-    num_frames = Math.floor((buffer.length-frame_size)/step_size);
-    
+function calculateMeanSquared(buffer, frame_dur, frame_overlap) {
+    frame_size = Math.floor(buffer.sampleRate * frame_dur);
+    step_size = Math.floor(frame_size * (1.0 - frame_overlap));
+    num_frames = Math.floor((buffer.length - frame_size) / step_size);
+
     MS = Array(buffer.numberOfChannels);
-    for (var c=0; c<buffer.numberOfChannels; c++)
-    {
+    for (var c = 0; c < buffer.numberOfChannels; c++) {
         MS[c] = new Float32Array(num_frames);
         var data = buffer.getChannelData(c);
-        for (var no=0; no<num_frames; no++)
-        {
+        for (var no = 0; no < num_frames; no++) {
             MS[c][no] = 0.0;
-            for (var ptr=0; ptr<frame_size; ptr++)
-            {
-                var sample = data[no*step_size+ptr];
-                MS[c][no] += sample*sample;
+            for (var ptr = 0; ptr < frame_size; ptr++) {
+                var sample = data[no * step_size + ptr];
+                MS[c][no] += sample * sample;
             }
             MS[c][no] /= frame_size;
         }
@@ -107,41 +97,35 @@
     return MS;
 }
 
-function calculateLoudnessFromBlocks(blocks)
-{
+function calculateLoudnessFromBlocks(blocks) {
     var num_frames = blocks[0].length;
     var num_channels = blocks.length;
     var MSL = Array(num_frames);
-    for (var n=0; n<num_frames; n++)
-    {
+    for (var n = 0; n < num_frames; n++) {
         var sum = 0;
-        for (var c=0; c<num_channels; c++)
-        {
+        for (var c = 0; c < num_channels; c++) {
             var G = 1.0;
-            if(G >= 3){G = 1.41;}
-            sum += blocks[c][n]*G;
+            if (G >= 3) {
+                G = 1.41;
+            }
+            sum += blocks[c][n] * G;
         }
-        MSL[n] = -0.691 + 10*Math.log10(sum);
+        MSL[n] = -0.691 + 10 * Math.log10(sum);
     }
     return MSL;
 }
 
-function loudnessGate(blocks,source,threshold)
-{
+function loudnessGate(blocks, source, threshold) {
     var num_frames = source[0].length;
     var num_channels = source.length;
     var LK = Array(num_channels);
-    for (var c=0; c<num_channels; c++)
-    {
+    for (var c = 0; c < num_channels; c++) {
         LK[c] = [];
     }
-    
-    for (var n=0; n<num_frames; n++)
-    {
-        if (blocks[n] > threshold)
-        {
-            for (var c=0; c<num_channels; c++)
-            {
+
+    for (var n = 0; n < num_frames; n++) {
+        if (blocks[n] > threshold) {
+            for (var c = 0; c < num_channels; c++) {
                 LK[c].push(source[c][n]);
             }
         }
@@ -149,23 +133,22 @@
     return LK;
 }
 
-function loudnessOfBlocks(blocks)
-{
+function loudnessOfBlocks(blocks) {
     var num_frames = blocks[0].length;
     var num_channels = blocks.length;
     var loudness = 0.0;
-    for (var n=0; n<num_frames; n++)
-    {
+    for (var n = 0; n < num_frames; n++) {
         var sum = 0;
-        for (var c=0; c<num_channels; c++)
-        {
+        for (var c = 0; c < num_channels; c++) {
             var G = 1.0;
-            if(G >= 3){G = 1.41;}
-            sum += blocks[c][n]*G;
+            if (G >= 3) {
+                G = 1.41;
+            }
+            sum += blocks[c][n] * G;
         }
         sum /= num_frames;
         loudness += sum;
     }
     loudness = -0.691 + 10 * Math.log10(loudness);
     return loudness;
-}
\ No newline at end of file
+}
diff -r cc2364d8bc17 -r 2577d983f291 php/comment_parser.php
--- a/php/comment_parser.php	Mon Nov 14 12:14:48 2016 +0000
+++ b/php/comment_parser.php	Mon Nov 14 14:23:41 2016 +0000
@@ -148,4 +148,4 @@
 } else {
     echo "FATAL - No saved XML files discovered";
 }
-?>
\ No newline at end of file
+?>
diff -r cc2364d8bc17 -r 2577d983f291 php/get_filtered_count.php
--- a/php/get_filtered_count.php	Mon Nov 14 12:14:48 2016 +0000
+++ b/php/get_filtered_count.php	Mon Nov 14 14:23:41 2016 +0000
@@ -107,4 +107,4 @@
     echo '{"urls": ["'.implode('","',$files).'"]}';
 }
 
-?>
\ No newline at end of file
+?>
diff -r cc2364d8bc17 -r 2577d983f291 php/get_filtered_score.php
--- a/php/get_filtered_score.php	Mon Nov 14 12:14:48 2016 +0000
+++ b/php/get_filtered_score.php	Mon Nov 14 14:23:41 2016 +0000
@@ -196,4 +196,4 @@
         }
         echo $doc_string;
 }
-?>
\ No newline at end of file
+?>
diff -r cc2364d8bc17 -r 2577d983f291 php/get_tests.php
--- a/php/get_tests.php	Mon Nov 14 12:14:48 2016 +0000
+++ b/php/get_tests.php	Mon Nov 14 14:23:41 2016 +0000
@@ -68,4 +68,4 @@
         echo '{"error": "format can only be JSON"}';
 }
 
-?>
\ No newline at end of file
+?>
diff -r cc2364d8bc17 -r 2577d983f291 php/pool.php
--- a/php/pool.php	Mon Nov 14 12:14:48 2016 +0000
+++ b/php/pool.php	Mon Nov 14 14:23:41 2016 +0000
@@ -109,4 +109,4 @@
 
 echo $new_doc->saveXML();
 
-?>
\ No newline at end of file
+?>
diff -r cc2364d8bc17 -r 2577d983f291 php/rel2abs.php
--- a/php/rel2abs.php	Mon Nov 14 12:14:48 2016 +0000
+++ b/php/rel2abs.php	Mon Nov 14 14:23:41 2016 +0000
@@ -29,4 +29,4 @@
     /* absolute URL is ready! */
     return $scheme.'://'.$abs;
 }
-?>
\ No newline at end of file
+?>
diff -r cc2364d8bc17 -r 2577d983f291 php/save.php
--- a/php/save.php	Mon Nov 14 12:14:48 2016 +0000
+++ b/php/save.php	Mon Nov 14 14:23:41 2016 +0000
@@ -35,4 +35,4 @@
 	// Return XML confirmation data
 	$xml = '<response state="OK"><message>OK</message><file bytes="'.$wbytes.'">"'.$filename.'"</file></response>';
 	echo $xml;
-?>
\ No newline at end of file
+?>
diff -r cc2364d8bc17 -r 2577d983f291 php/score_parser.php
--- a/php/score_parser.php	Mon Nov 14 12:14:48 2016 +0000
+++ b/php/score_parser.php	Mon Nov 14 14:23:41 2016 +0000
@@ -195,4 +195,4 @@
     echo "FATAL - No saved XML files discovered";
 }
 
-?>
\ No newline at end of file
+?>
diff -r cc2364d8bc17 -r 2577d983f291 test.html
--- a/test.html	Mon Nov 14 12:14:48 2016 +0000
+++ b/test.html	Mon Nov 14 14:23:41 2016 +0000
@@ -1,41 +1,43 @@
 <!DOCTYPE html>
 <html lang="en">
-	<head>
-		<meta http-equiv="content-type" content="text/html; charset=utf-8">
 
+<head>
+    <meta http-equiv="content-type" content="text/html; charset=utf-8">
 
-		<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
+
+    <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
 		Remove this if you use the .htaccess -->
-		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
 
-		<title>Web Audio Evaluation Tool</title>
-		<meta name="description" content="" />
-		<meta name="author" content="" />
-		
-		<!-- Load up the default core JS and CSS files-->
-		<link rel='stylesheet' type='text/css' href='css/core.css'>
-		<!-- Use jQuery hosted from Google CDN -->
-		<!--<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>-->
-		<script type="text/javascript" src="js/jquery-2.1.4.js"></script>
-        <script type="text/javascript" src="js/loader.js"></script>
-	</head>
+    <title>Web Audio Evaluation Tool</title>
+    <meta name="description" content="" />
+    <meta name="author" content="" />
 
-	<body>
-		<!-- Load up the default page interface allowing for project setting loads, even if hard-coded-->
-		<!-- Actual test interface design should be contained in the .js for ease of dynamic content-->
-		<div id='topLevelBody'>
-            <span>Web Audio Evaluation Toolbox</span>
-		</div>
-        <div id="popupHolder" class="popupHolder" style="visibility: hidden">
-            <div id="popupContent">
-                <div id="popupTitleHolder">
-                    <span id="popupTitle"></span>
-                </div>
-                <div id="popupResponse"></div>
+    <!-- Load up the default core JS and CSS files-->
+    <link rel='stylesheet' type='text/css' href='css/core.css'>
+    <!-- Use jQuery hosted from Google CDN -->
+    <!--<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>-->
+    <script type="text/javascript" src="js/jquery-2.1.4.js"></script>
+    <script type="text/javascript" src="js/loader.js"></script>
+</head>
+
+<body>
+    <!-- Load up the default page interface allowing for project setting loads, even if hard-coded-->
+    <!-- Actual test interface design should be contained in the .js for ease of dynamic content-->
+    <div id='topLevelBody'>
+        <span>Web Audio Evaluation Toolbox</span>
+    </div>
+    <div id="popupHolder" class="popupHolder" style="visibility: hidden">
+        <div id="popupContent">
+            <div id="popupTitleHolder">
+                <span id="popupTitle"></span>
             </div>
-            <button id="popup-proceed" class="popupButton">Next</button>
-            <button id="popup-previous" class="popupButton">Back</button>
+            <div id="popupResponse"></div>
         </div>
-        <div class="testHalt" style="visibility: hidden"></div>
-	</body>
+        <button id="popup-proceed" class="popupButton">Next</button>
+        <button id="popup-previous" class="popupButton">Back</button>
+    </div>
+    <div class="testHalt" style="visibility: hidden"></div>
+</body>
+
 </html>
diff -r cc2364d8bc17 -r 2577d983f291 test_create.html
--- a/test_create.html	Mon Nov 14 12:14:48 2016 +0000
+++ b/test_create.html	Mon Nov 14 14:23:41 2016 +0000
@@ -1,20 +1,31 @@
 <html>
+
 <head>
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <!-- This defines the test creator tool for the Web Audio Evaluation Toolbox -->
-    <link rel='stylesheet' type="text/css" href="test_create/style.css"/>
-    <link rel='stylesheet' type="text/css" href="test_create/custom.css"/>
+    <link rel='stylesheet' type="text/css" href="test_create/style.css" />
+    <link rel='stylesheet' type="text/css" href="test_create/custom.css" />
     <script type="text/javascript">
-        window.onbeforeunload = function (e) {var message = 'If you leave the page now, any unsaved changes will be lost', e = e || window.event; if (e) { e.returnValue = message;}return message;};
+        window.onbeforeunload = function(e) {
+            var message = 'If you leave the page now, any unsaved changes will be lost',
+                e = e || window.event;
+            if (e) {
+                e.returnValue = message;
+            }
+            return message;
+        };
         // Copy of Specifiation node from Core.js
+
     </script>
     <script src="js/jquery-2.1.4.js"></script>
     <script type="text/javascript" src='js/specification.js'></script>
     <script type="text/javascript" src="test_create/test_core.js"></script>
 </head>
+
 <body>
     <div id="popupHolder"></div>
     <div id="blanket"></div>
     <div id="content"></div>
 </body>
+
 </html>
diff -r cc2364d8bc17 -r 2577d983f291 test_create/custom.css
--- a/test_create/custom.css	Mon Nov 14 12:14:48 2016 +0000
+++ b/test_create/custom.css	Mon Nov 14 14:23:41 2016 +0000
@@ -1,23 +1,20 @@
-
-div#content > div.node{
-    background-color: rgb(200,228,151);
+div#content > div.node {
+    background-color: rgb(200, 228, 151);
 }
-
-div#content > div#setup{
+div#content > div#setup {
     background-color: coral;
 }
-
-input:disabled+span{
+input:disabled+span {
     text-decoration: line-through;
 }
-
-div.attribute{
+div.attribute {
     float: none;
 }
-div.attribute input{
+div.attribute input {
     max-width: 100%;
     width: 300px;
 }
-div.attribute input[type=radio], div.attribute input[type=checkbox]{
+div.attribute input[type=radio],
+div.attribute input[type=checkbox] {
     width: 10px;
-}
\ No newline at end of file
+}
diff -r cc2364d8bc17 -r 2577d983f291 test_create/interface-specs.xml
--- a/test_create/interface-specs.xml	Mon Nov 14 12:14:48 2016 +0000
+++ b/test_create/interface-specs.xml	Mon Nov 14 14:23:41 2016 +0000
@@ -1,532 +1,532 @@
 <?xml version="1.0" encoding="UTF-8" ?>
-<root>
-    <global>
-        <metrics>
-            <list name="testTimer">Test Timer</list>
-            <list name="elementTimer">Element Playback Timer</list>
-            <list name="elementInitialPosition">Element Initial Position</list>
-            <list name="elementTracker">Element Movement Tracker</list>
-            <list name="elementFlagListenedTo">Element Listened to Flag</list>
-            <list name="elementFlagMoved">Element Moved Flag</list>
-            <list name="elementListenTracker">Element Listen Tracker</list>
-        </metrics>
-        <checks>
-            <list name="fragmentMoved">Check all moved</list>
-            <list name="fragmentPlayed">Check all played</list>
-            <list name="fragmentFullPlayback">Check all fully played (non-loop only)</list>
-            <list name="fragmentComments">Check comments entered</list>
-            <list name="scalerange">Enforce scale usage range</list>
-        </checks>
-        <show>
-            <list name="volume">Show master volume control</list>
-            <list name="page-count">Show test page count</list>
-            <list name="playhead">Show playhead</list>
-            <list name="comments">Show element comment boxes</list>
-        </show>
-    </global>
-    <interfaces>
-        <interface name="APE">
+    <root>
+        <global>
             <metrics>
-                <entry name="testTimer" support="optional" default="on"/>
-                <entry name="elementTimer" support="optional" default="on"/>
-                <entry name="elementInitialPosition" support="optional" default="on"/>
-                <entry name="elementTracker" support="optional" default="on"/>
-                <entry name="elementFlagListenedTo" support="optional" default="on"/>
-                <entry name="elementFlagMoved" support="optional" default="on"/>
-                <entry name="elementListenTracker" support="optional" default="on"/>
+                <list name="testTimer">Test Timer</list>
+                <list name="elementTimer">Element Playback Timer</list>
+                <list name="elementInitialPosition">Element Initial Position</list>
+                <list name="elementTracker">Element Movement Tracker</list>
+                <list name="elementFlagListenedTo">Element Listened to Flag</list>
+                <list name="elementFlagMoved">Element Moved Flag</list>
+                <list name="elementListenTracker">Element Listen Tracker</list>
             </metrics>
             <checks>
-                <entry name="fragmentMoved" support="optional" default="off"/>
-                <entry name="fragmentPlayed" support="optional" default="off"/>
-                <entry name="fragmentFullPlayback" support="optional" default="off"/>
-                <entry name="fragmentComments" support="optional" default="off"/>
-                <entry name="scalerange" support="optional" default="off"/>
+                <list name="fragmentMoved">Check all moved</list>
+                <list name="fragmentPlayed">Check all played</list>
+                <list name="fragmentFullPlayback">Check all fully played (non-loop only)</list>
+                <list name="fragmentComments">Check comments entered</list>
+                <list name="scalerange">Enforce scale usage range</list>
             </checks>
             <show>
-                <entry name="volume" support="optional" default="off"/>
-                <entry name="page-count" support="optional" default="off"/>
-                <entry name="playhead" support="optional" default="off"/>
-                <entry name="comments" support="optional" default="on"/>
+                <list name="volume">Show master volume control</list>
+                <list name="page-count">Show test page count</list>
+                <list name="playhead">Show playhead</list>
+                <list name="comments">Show element comment boxes</list>
             </show>
-            <elements>
-                <number min="1" max="undefined"/>
-                <anchor min="0" max="undefined"/>
-                <reference min="0" max="undefined"/>
-                <outsidereference min="0" max="1"/>
-            </elements>
-        </interface>
-        <interface name="MUSHRA">
-            <metrics>
-                <entry name="testTimer" support="optional" default="on"/>
-                <entry name="elementTimer" support="optional" default="on"/>
-                <entry name="elementInitialPosition" support="optional" default="on"/>
-                <entry name="elementTracker" support="optional" default="on"/>
-                <entry name="elementFlagListenedTo" support="optional" default="on"/>
-                <entry name="elementFlagMoved" support="optional" default="on"/>
-                <entry name="elementListenTracker" support="optional" default="on"/>
-            </metrics>
-            <checks>
-                <entry name="fragmentMoved" support="optional" default="off"/>
-                <entry name="fragmentPlayed" support="optional" default="off"/>
-                <entry name="fragmentFullPlayback" support="optional" default="off"/>
-                <entry name="fragmentComments" support="optional" default="off"/>
-                <entry name="scalerange" support="optional" default="off"/>
-            </checks>
-            <show>
-                <entry name="volume" support="optional" default="off"/>
-                <entry name="page-count" support="optional" default="off"/>
-                <entry name="playhead" support="optional" default="off"/>
-                <entry name="comments" support="optional" default="off"/>
-            </show>
-            <elements>
-                <number min="1" max="undefined"/>
-                <anchor min="0" max="undefined"/>
-                <reference min="0" max="undefined"/>
-                <outsidereference min="0" max="1"/>
-            </elements>
-        </interface>
-        <interface name="horizontal">
-            <metrics>
-                <entry name="testTimer" support="optional" default="on"/>
-                <entry name="elementTimer" support="optional" default="on"/>
-                <entry name="elementInitialPosition" support="optional" default="on"/>
-                <entry name="elementTracker" support="optional" default="on"/>
-                <entry name="elementFlagListenedTo" support="optional" default="on"/>
-                <entry name="elementFlagMoved" support="optional" default="on"/>
-                <entry name="elementListenTracker" support="optional" default="on"/>
-            </metrics>
-            <checks>
-                <entry name="fragmentMoved" support="optional" default="off"/>
-                <entry name="fragmentPlayed" support="optional" default="off"/>
-                <entry name="fragmentFullPlayback" support="optional" default="off"/>
-                <entry name="fragmentComments" support="optional" default="off"/>
-                <entry name="scalerange" support="optional" default="off"/>
-            </checks>
-            <show>
-                <entry name="volume" support="optional" default="off"/>
-                <entry name="page-count" support="optional" default="off"/>
-                <entry name="playhead" support="optional" default="off"/>
-                <entry name="comments" support="optional" default="off"/>
-            </show>
-            <elements>
-                <number min="1" max="undefined"/>
-                <anchor min="0" max="undefined"/>
-                <reference min="0" max="undefined"/>
-                <outsidereference min="0" max="1"/>
-            </elements>
-        </interface>
-        <interface name="discrete">
-            <metrics>
-                <entry name="testTimer" support="optional" default="on"/>
-                <entry name="elementTimer" support="optional" default="on"/>
-                <entry name="elementInitialPosition" support="none"/>
-                <entry name="elementTracker" support="optional" default="on"/>
-                <entry name="elementFlagListenedTo" support="optional" default="on"/>
-                <entry name="elementFlagMoved" support="optional" default="on"/>
-                <entry name="elementListenTracker" support="optional" default="on"/>
-            </metrics>
-            <checks>
-                <entry name="fragmentMoved" support="mandatory"/>
-                <entry name="fragmentPlayed" support="optional" default="off"/>
-                <entry name="fragmentFullPlayback" support="optional" default="off"/>
-                <entry name="fragmentComments" support="optional" default="off"/>
-                <entry name="scalerange" support="none"/>
-            </checks>
-            <show>
-                <entry name="volume" support="optional" default="off"/>
-                <entry name="page-count" support="optional" default="off"/>
-                <entry name="playhead" support="optional" default="off"/>
-                <entry name="comments" support="optional" default="off"/>
-            </show>
-            <elements>
-                <number min="1" max="undefined"/>
-                <anchor min="0" max="undefined"/>
-                <reference min="0" max="undefined"/>
-                <outsidereference min="0" max="1"/>
-            </elements>
-        </interface>
-        <interface name="AB">
-            <metrics>
-                <entry name="testTimer" support="optional" default="on"/>
-                <entry name="elementTimer" support="optional" default="on"/>
-                <entry name="elementInitialPosition" support="none"/>
-                <entry name="elementTracker" support="optional" default="on"/>
-                <entry name="elementFlagListenedTo" support="optional" default="on"/>
-                <entry name="elementFlagMoved" support="none"/>
-                <entry name="elementListenTracker" support="optional" default="on"/>
-            </metrics>
-            <checks>
-                <entry name="fragmentMoved" support="none"/>
-                <entry name="fragmentPlayed" support="optional" default="off"/>
-                <entry name="fragmentFullPlayback" support="optional" default="off"/>
-                <entry name="fragmentComments" support="optional" default="off"/>
-                <entry name="scalerange" support="none"/>
-            </checks>
-            <show>
-                <entry name="volume" support="optional" default="off"/>
-                <entry name="page-count" support="optional" default="off"/>
-                <entry name="playhead" support="optional" default="off"/>
-                <entry name="comments" support="optional" default="off"/>
-            </show>
-            <elements>
-                <number min="2" max="undefined"/>
-                <anchor min="0" max="undefined"/>
-                <reference min="0" max="undefined"/>
-                <outsidereference min="0" max="1"/>
-            </elements>
-        </interface>
-        <interface name="ABX">
-            <metrics>
-                <entry name="testTimer" support="optional" default="on"/>
-                <entry name="elementTimer" support="optional" default="on"/>
-                <entry name="elementInitialPosition" support="none"/>
-                <entry name="elementTracker" support="optional" default="on"/>
-                <entry name="elementFlagListenedTo" support="optional" default="on"/>
-                <entry name="elementFlagMoved" support="none"/>
-                <entry name="elementListenTracker" support="optional" default="on"/>
-            </metrics>
-            <checks>
-                <entry name="fragmentMoved" support="none"/>
-                <entry name="fragmentPlayed" support="optional" default="off"/>
-                <entry name="fragmentFullPlayback" support="optional" default="off"/>
-                <entry name="fragmentComments" support="optional" default="off"/>
-                <entry name="scalerange" support="none"/>
-            </checks>
-            <show>
-                <entry name="volume" support="optional" default="off"/>
-                <entry name="page-count" support="optional" default="off"/>
-                <entry name="playhead" support="optional" default="off"/>
-                <entry name="comments" support="optional" default="off"/>
-            </show>
-            <elements>
-                <number min="2" max="2"/>
-                <anchor min="0" max="0"/>
-                <reference min="0" max="0"/>
-                <outsidereference min="0" max="0"/>
-            </elements>
-        </interface>
-        <interface name="timeline">
-            <metrics>
-                <entry name="testTimer" support="optional" default="on"/>
-                <entry name="elementTimer" support="optional" default="on"/>
-                <entry name="elementInitialPosition" support="none"/>
-                <entry name="elementTracker" support="none" default="off"/>
-                <entry name="elementFlagListenedTo" support="optional" default="on"/>
-                <entry name="elementFlagMoved" support="none"/>
-                <entry name="elementListenTracker" support="optional" default="on"/>
-            </metrics>
-            <checks>
-                <entry name="fragmentMoved" support="none"/>
-                <entry name="fragmentPlayed" support="optional" default="off"/>
-                <entry name="fragmentFullPlayback" support="optional" default="off"/>
-                <entry name="fragmentComments" support="optional" default="off"/>
-                <entry name="scalerange" support="none"/>
-            </checks>
-            <show>
-                <entry name="volume" support="optional" default="off"/>
-                <entry name="page-count" support="optional" default="off"/>
-                <entry name="playhead" support="none"/>
-                <entry name="comments" support="optional" default="off"/>
-            </show>
-            <elements>
-                <number min="1" max="undefined"/>
-                <anchor min="0" max="0"/>
-                <reference min="0" max="0"/>
-                <outsidereference min="0" max="undefined"/>
-            </elements>
-        </interface>
-    </interfaces>
-    <scaledefinitions>
-        <scale name="(Blank)">
-        </scale>
-        <scale name="Likert">
-            <scalelabel position="0">Strongly Disagree</scalelabel>
-            <scalelabel position="25">Disagree</scalelabel>
-            <scalelabel position="50">Neutral</scalelabel>
-            <scalelabel position="75">Agree</scalelabel>
-            <scalelabel position="100">Strongly Agree</scalelabel>
-        </scale>
-        <scale name="ABC">
-            <scalelabel position="100">Imperceptible</scalelabel>
-            <scalelabel position="75">Perceptible but not annoying</scalelabel>
-            <scalelabel position="50">Slightly annoying</scalelabel>
-            <scalelabel position="25">Annoying</scalelabel>
-            <scalelabel position="0">Very annoying</scalelabel>
-        </scale>
-        <scale name="Bipolar">
-            <scalelabel position="0">-50</scalelabel>
-            <scalelabel position="50">0</scalelabel>
-            <scalelabel position="100">50</scalelabel>
-        </scale>
-        <scale name="ACR">
-            <scalelabel position="0">Bad</scalelabel>
-            <scalelabel position="25">Poor</scalelabel>
-            <scalelabel position="50">Fair</scalelabel>
-            <scalelabel position="75">Good</scalelabel>
-            <scalelabel position="100">Excellent</scalelabel>
-        </scale>
-        <scale name="DCR">
-            <scalelabel position="0">(1) Very Annoying</scalelabel>
-            <scalelabel position="25">(2) Annoying</scalelabel>
-            <scalelabel position="50">(3) Slightly Annoying</scalelabel>
-            <scalelabel position="75">(4) Audible but not Annoying</scalelabel>
-            <scalelabel position="100">(5) Inaudible</scalelabel>
-        </scale>
-        <scale name="CCR">
-            <scalelabel position="12">Much Worse</scalelabel>
-            <scalelabel position="25">Worse</scalelabel>
-            <scalelabel position="38">Slightly Worse</scalelabel>
-            <scalelabel position="50">About the same</scalelabel>
-            <scalelabel position="62">Slightly Better</scalelabel>
-            <scalelabel position="75">Better</scalelabel>
-            <scalelabel position="88">Much Better</scalelabel>
-        </scale>
-        <scale name="HCRS">
-            <scalelabel position="10">Dislike Extremely</scalelabel>
-            <scalelabel position="20">Dislike Very Much</scalelabel>
-            <scalelabel position="30">Dislike Moderate</scalelabel>
-            <scalelabel position="40">Dislike Slightly</scalelabel>
-            <scalelabel position="50">Neither Like nor Dislike</scalelabel>
-            <scalelabel position="60">Like Slightly</scalelabel>
-            <scalelabel position="70">Like Moderate</scalelabel>
-            <scalelabel position="80">Like Very Much</scalelabel>
-            <scalelabel position="90">Like Extremely</scalelabel>
-        </scale>
-    </scaledefinitions>
-    <tests>
-        <test name="APE" interface="APE">
-            <descriptions>
-                <description lang="en">Audio Perceptual Evaluation. A multi-stimulus test where each audio fragment is shown on one continuous slider. Fragments are randomnly positioned along the slider. The user clicks a fragment to play and drags to move.</description>
-            </descriptions>
-        </test>
-        <test name="vertical-sliders" interface="MUSHRA">
-            <descriptions>
-                <description lang="en">Each element is given its own vertical slider with user defined scale markers.</description>
-            </descriptions>
-        </test>
-        <test name="horizontal-sliders" interface="horizontal">
-            <descriptions>
-                <description lang="en">Each element is given its own horizontal slider with user defined scale markers.</description>
-            </descriptions>
-        </test>
-        <test name="discrete" interface="discrete">
-            <descriptions>
-                <description lang="en">Each element is given a horizontal scale broken into a number of discrete choices. The number of choices is defined by the scale markers.</description>
-            </descriptions>
-        </test>
-        <test name="Comparison" interface="AB">
-            <descriptions>
-                <description lang="en">An N-way comparison test. Each element is given its own selector box. The user can select one element per page for submission.</description>
-            </descriptions>
-        </test>
-        <test name="MUSHRA" interface="MUSHRA">
-            <descriptions>
-                <description lang="en">Multi-stimulus with hidden reference and anchor. Each fragment is shown on its own vertical slider. One fragment must be labelled as a reference and another labelled as an anchor. One external reference must also be shown.</description>
-            </descriptions>
-            <checks>
-                <entry name="fragmentMoved" support="none"/>
-                <entry name="fragmentPlayed" support="none"/>
-                <entry name="fragmentFullPlayback" support="none"/>
-                <entry name="fragmentComments" support="none"/>
-                <entry name="scalerange" support="none"/>
-            </checks>
-            <show>
-                <entry name="volume" support="none"/>
-                <entry name="page-count" support="none"/>
-                <entry name="playhead" support="none"/>
-                <entry name="comments" support="none"/>
-            </show>
-            <elements>
-                <anchor min="1" max="undefined"/>
-                <reference min="1" max="undefined"/>
-                <outsidereference min="1" max="1"/>
-            </elements>
-            <scale name="ACR"/>
-        </test>
-        <test name="Rank" interface="discrete">
-            <descriptions>
-                <description lang="en">Each stimulus is placed on a discrete scale equalling the number of fragments. The fragments are then ranked based on the question posed. Only one element can occupy a rank position</description>
-            </descriptions>
-            <checks>
-                <entry name="fragmentPlayed" support="none"/>
-                <entry name="fragmentFullPlayback" support="none"/>
-                <entry name="fragmentComments" support="none"/>
-            </checks>
-            <show>
-                <entry name="volume" support="none"/>
-                <entry name="page-count" support="none"/>
-                <entry name="playhead" support="none"/>
-                <entry name="comments" support="none"/>
-            </show>
-            <scale name="undefined"/>
-        </test>
-        <test name="Likert" interface="discrete">
-            <descriptions>
-                <description lang="en">Each stimulus is placed on a discrete scale. The scale is fixed to the Likert scale options of 'Strongly Disagree', 'Disagree', 'Neutral', 'Agree' and 'Strongly Agree'</description>
-            </descriptions>
-            <checks>
-                <entry name="fragmentPlayed" support="none"/>
-                <entry name="fragmentFullPlayback" support="none"/>
-                <entry name="fragmentComments" support="none"/>
-            </checks>
-            <show>
-                <entry name="volume" support="none"/>
-                <entry name="page-count" support="none"/>
-                <entry name="playhead" support="none"/>
-                <entry name="comments" support="none"/>
-            </show>
-            <scale name="Likert"/>
-        </test>
-        <test name="ABC/HR" interface="MUSHRA">
-            <descriptions>
-                <description lang="en">Each stimulus is placed on a vertical slider. The scale is fixed with the labels 'Imperceptible' to 'Very Annoying'</description>
-            </descriptions>
-            <checks>
-                <entry name="fragmentMoved" support="none"/>
-                <entry name="fragmentPlayed" support="none"/>
-                <entry name="fragmentFullPlayback" support="none"/>
-                <entry name="fragmentComments" support="none"/>
-            </checks>
-            <show>
-                <entry name="volume" support="none"/>
-                <entry name="page-count" support="none"/>
-                <entry name="playhead" support="none"/>
-                <entry name="comments" support="none"/>
-            </show>
-            <scale name="ABC"/>
-        </test>
-        <test name="Bipolar" interface="horizontal">
-            <descriptions>
-                <description lang="en">Each stimulus is placed on a horizontal slider and initialised to the value '0'. The scale operates from -50 to +5-. In the results this is normalised, like all other interfaces, from 0 (-50) to 1 (+50).</description>
-            </descriptions>
-            <checks>
-                <entry name="fragmentMoved" support="mandatory"/>
-                <entry name="fragmentPlayed" support="none"/>
-                <entry name="fragmentFullPlayback" support="none"/>
-                <entry name="fragmentComments" support="none"/>
-            </checks>
-            <show>
-                <entry name="volume" support="none"/>
-                <entry name="page-count" support="none"/>
-                <entry name="playhead" support="none"/>
-                <entry name="comments" support="none"/>
-            </show>
-            <elements>
-                <outsidereference min="1" max="1"/>
-            </elements>
-            <scale name="Bipolar"/>
-        </test>
-        <test name="ACR" interface="discrete">
-            <descriptions>
-                <description lang="en">Absolute Category Rating. Each element is on a discrete scale of 'Bad', 'Poor', 'Fair', 'Good' and 'Excellent'. Each element must be given a rating.</description>
-            </descriptions>
-            <checks>
-                <entry name="fragmentMoved" support="mandatory"/>
-                <entry name="fragmentPlayed" support="none"/>
-                <entry name="fragmentFullPlayback" support="none"/>
-                <entry name="fragmentComments" support="none"/>
-            </checks>
-            <show>
-                <entry name="volume" support="none"/>
-                <entry name="page-count" support="none"/>
-                <entry name="playhead" support="none"/>
-                <entry name="comments" support="none"/>
-            </show>
-            <scale name="ACR"/>
-        </test>
-        <test name="DCR" interface="discrete">
-            <checks>
-                <entry name="fragmentPlayed" support="none"/>
-                <entry name="fragmentFullPlayback" support="none"/>
-                <entry name="fragmentComments" support="none"/>
-            </checks>
-            <show>
-                <entry name="volume" support="none"/>
-                <entry name="page-count" support="none"/>
-                <entry name="playhead" support="none"/>
-                <entry name="comments" support="none"/>
-            </show>
-            <scale name="DCR"/>
-        </test>
-        <test name="CCR" interface="discrete">
-            <checks>
-                <entry name="fragmentPlayed" support="none"/>
-                <entry name="fragmentFullPlayback" support="none"/>
-                <entry name="fragmentComments" support="none"/>
-            </checks>
-            <show>
-                <entry name="volume" support="none"/>
-                <entry name="page-count" support="none"/>
-                <entry name="playhead" support="none"/>
-                <entry name="comments" support="none"/>
-            </show>
-            <scale name="CCR"/>
-        </test>
-        <test name="HCRS" interface="MUSHRA">
-            <checks>
-                <entry name="fragmentMoved" support="mandatory"/>
-                <entry name="fragmentPlayed" support="none"/>
-                <entry name="fragmentFullPlayback" support="none"/>
-                <entry name="fragmentComments" support="none"/>
-            </checks>
-            <show>
-                <entry name="volume" support="none"/>
-                <entry name="page-count" support="none"/>
-                <entry name="playhead" support="none"/>
-                <entry name="comments" support="none"/>
-            </show>
-            <elements>
-                <outsidereference min="1" max="1"/>
-            </elements>
-            <scale name="HCRS"/>
-        </test>
-        <test name="ITUR5PCIS" interface="MUSHRA">
-            <checks>
-                <entry name="fragmentMoved" support="none"/>
-                <entry name="fragmentPlayed" support="none"/>
-                <entry name="fragmentFullPlayback" support="none"/>
-                <entry name="fragmentComments" support="none"/>
-            </checks>
-            <show>
-                <entry name="volume" support="none"/>
-                <entry name="page-count" support="none"/>
-                <entry name="playhead" support="none"/>
-                <entry name="comments" support="none"/>
-            </show>
-            <elements>
-                <outsidereference min="1" max="1"/>
-            </elements>
-            <scale name="ABC"/>
-        </test>
-        <test name="AB" interface="AB">
-            <descriptions>
-                <description lang="en">Each page has only two audio fragments. The user must select one of the two fragments to proceed. There can be one hidden reference.</description>
-            </descriptions>
-            <checks>
-                <entry name="fragmentPlayed" support="none"/>
-                <entry name="fragmentFullPlayback" support="none"/>
-                <entry name="fragmentComments" support="none"/>
-            </checks>
-            <show>
-                <entry name="volume" support="none"/>
-                <entry name="page-count" support="none"/>
-                <entry name="playhead" support="none"/>
-                <entry name="comments" support="none"/>
-            </show>
-            <elements>
-                <number min="2" max="2"/>
-                <outsidereference min="0" max="1"/>
-            </elements>
-        </test>
-        <test name="ABX" interface="ABX">
-            <descriptions>
-                <description lang="en">Each page has two audio fragments presented as A and B. The test duplicates one of the fragments and presents it as X. The user must choose which, out of A or B, is closest to X.</description>
-            </descriptions>
-        </test>
-        <test name="timeline" interface="timeline">
-            <descriptions>
-                <description lang="en">Each fragment is displayed with a clickable waveform of itself. The user must click on the waveform at the location that a specific event occured. Users can then enter in information about this event. This test is unit-/value-less.</description>
-            </descriptions>
-        </test>
-    </tests>
-</root>
\ No newline at end of file
+        </global>
+        <interfaces>
+            <interface name="APE">
+                <metrics>
+                    <entry name="testTimer" support="optional" default="on" />
+                    <entry name="elementTimer" support="optional" default="on" />
+                    <entry name="elementInitialPosition" support="optional" default="on" />
+                    <entry name="elementTracker" support="optional" default="on" />
+                    <entry name="elementFlagListenedTo" support="optional" default="on" />
+                    <entry name="elementFlagMoved" support="optional" default="on" />
+                    <entry name="elementListenTracker" support="optional" default="on" />
+                </metrics>
+                <checks>
+                    <entry name="fragmentMoved" support="optional" default="off" />
+                    <entry name="fragmentPlayed" support="optional" default="off" />
+                    <entry name="fragmentFullPlayback" support="optional" default="off" />
+                    <entry name="fragmentComments" support="optional" default="off" />
+                    <entry name="scalerange" support="optional" default="off" />
+                </checks>
+                <show>
+                    <entry name="volume" support="optional" default="off" />
+                    <entry name="page-count" support="optional" default="off" />
+                    <entry name="playhead" support="optional" default="off" />
+                    <entry name="comments" support="optional" default="on" />
+                </show>
+                <elements>
+                    <number min="1" max="undefined" />
+                    <anchor min="0" max="undefined" />
+                    <reference min="0" max="undefined" />
+                    <outsidereference min="0" max="1" />
+                </elements>
+            </interface>
+            <interface name="MUSHRA">
+                <metrics>
+                    <entry name="testTimer" support="optional" default="on" />
+                    <entry name="elementTimer" support="optional" default="on" />
+                    <entry name="elementInitialPosition" support="optional" default="on" />
+                    <entry name="elementTracker" support="optional" default="on" />
+                    <entry name="elementFlagListenedTo" support="optional" default="on" />
+                    <entry name="elementFlagMoved" support="optional" default="on" />
+                    <entry name="elementListenTracker" support="optional" default="on" />
+                </metrics>
+                <checks>
+                    <entry name="fragmentMoved" support="optional" default="off" />
+                    <entry name="fragmentPlayed" support="optional" default="off" />
+                    <entry name="fragmentFullPlayback" support="optional" default="off" />
+                    <entry name="fragmentComments" support="optional" default="off" />
+                    <entry name="scalerange" support="optional" default="off" />
+                </checks>
+                <show>
+                    <entry name="volume" support="optional" default="off" />
+                    <entry name="page-count" support="optional" default="off" />
+                    <entry name="playhead" support="optional" default="off" />
+                    <entry name="comments" support="optional" default="off" />
+                </show>
+                <elements>
+                    <number min="1" max="undefined" />
+                    <anchor min="0" max="undefined" />
+                    <reference min="0" max="undefined" />
+                    <outsidereference min="0" max="1" />
+                </elements>
+            </interface>
+            <interface name="horizontal">
+                <metrics>
+                    <entry name="testTimer" support="optional" default="on" />
+                    <entry name="elementTimer" support="optional" default="on" />
+                    <entry name="elementInitialPosition" support="optional" default="on" />
+                    <entry name="elementTracker" support="optional" default="on" />
+                    <entry name="elementFlagListenedTo" support="optional" default="on" />
+                    <entry name="elementFlagMoved" support="optional" default="on" />
+                    <entry name="elementListenTracker" support="optional" default="on" />
+                </metrics>
+                <checks>
+                    <entry name="fragmentMoved" support="optional" default="off" />
+                    <entry name="fragmentPlayed" support="optional" default="off" />
+                    <entry name="fragmentFullPlayback" support="optional" default="off" />
+                    <entry name="fragmentComments" support="optional" default="off" />
+                    <entry name="scalerange" support="optional" default="off" />
+                </checks>
+                <show>
+                    <entry name="volume" support="optional" default="off" />
+                    <entry name="page-count" support="optional" default="off" />
+                    <entry name="playhead" support="optional" default="off" />
+                    <entry name="comments" support="optional" default="off" />
+                </show>
+                <elements>
+                    <number min="1" max="undefined" />
+                    <anchor min="0" max="undefined" />
+                    <reference min="0" max="undefined" />
+                    <outsidereference min="0" max="1" />
+                </elements>
+            </interface>
+            <interface name="discrete">
+                <metrics>
+                    <entry name="testTimer" support="optional" default="on" />
+                    <entry name="elementTimer" support="optional" default="on" />
+                    <entry name="elementInitialPosition" support="none" />
+                    <entry name="elementTracker" support="optional" default="on" />
+                    <entry name="elementFlagListenedTo" support="optional" default="on" />
+                    <entry name="elementFlagMoved" support="optional" default="on" />
+                    <entry name="elementListenTracker" support="optional" default="on" />
+                </metrics>
+                <checks>
+                    <entry name="fragmentMoved" support="mandatory" />
+                    <entry name="fragmentPlayed" support="optional" default="off" />
+                    <entry name="fragmentFullPlayback" support="optional" default="off" />
+                    <entry name="fragmentComments" support="optional" default="off" />
+                    <entry name="scalerange" support="none" />
+                </checks>
+                <show>
+                    <entry name="volume" support="optional" default="off" />
+                    <entry name="page-count" support="optional" default="off" />
+                    <entry name="playhead" support="optional" default="off" />
+                    <entry name="comments" support="optional" default="off" />
+                </show>
+                <elements>
+                    <number min="1" max="undefined" />
+                    <anchor min="0" max="undefined" />
+                    <reference min="0" max="undefined" />
+                    <outsidereference min="0" max="1" />
+                </elements>
+            </interface>
+            <interface name="AB">
+                <metrics>
+                    <entry name="testTimer" support="optional" default="on" />
+                    <entry name="elementTimer" support="optional" default="on" />
+                    <entry name="elementInitialPosition" support="none" />
+                    <entry name="elementTracker" support="optional" default="on" />
+                    <entry name="elementFlagListenedTo" support="optional" default="on" />
+                    <entry name="elementFlagMoved" support="none" />
+                    <entry name="elementListenTracker" support="optional" default="on" />
+                </metrics>
+                <checks>
+                    <entry name="fragmentMoved" support="none" />
+                    <entry name="fragmentPlayed" support="optional" default="off" />
+                    <entry name="fragmentFullPlayback" support="optional" default="off" />
+                    <entry name="fragmentComments" support="optional" default="off" />
+                    <entry name="scalerange" support="none" />
+                </checks>
+                <show>
+                    <entry name="volume" support="optional" default="off" />
+                    <entry name="page-count" support="optional" default="off" />
+                    <entry name="playhead" support="optional" default="off" />
+                    <entry name="comments" support="optional" default="off" />
+                </show>
+                <elements>
+                    <number min="2" max="undefined" />
+                    <anchor min="0" max="undefined" />
+                    <reference min="0" max="undefined" />
+                    <outsidereference min="0" max="1" />
+                </elements>
+            </interface>
+            <interface name="ABX">
+                <metrics>
+                    <entry name="testTimer" support="optional" default="on" />
+                    <entry name="elementTimer" support="optional" default="on" />
+                    <entry name="elementInitialPosition" support="none" />
+                    <entry name="elementTracker" support="optional" default="on" />
+                    <entry name="elementFlagListenedTo" support="optional" default="on" />
+                    <entry name="elementFlagMoved" support="none" />
+                    <entry name="elementListenTracker" support="optional" default="on" />
+                </metrics>
+                <checks>
+                    <entry name="fragmentMoved" support="none" />
+                    <entry name="fragmentPlayed" support="optional" default="off" />
+                    <entry name="fragmentFullPlayback" support="optional" default="off" />
+                    <entry name="fragmentComments" support="optional" default="off" />
+                    <entry name="scalerange" support="none" />
+                </checks>
+                <show>
+                    <entry name="volume" support="optional" default="off" />
+                    <entry name="page-count" support="optional" default="off" />
+                    <entry name="playhead" support="optional" default="off" />
+                    <entry name="comments" support="optional" default="off" />
+                </show>
+                <elements>
+                    <number min="2" max="2" />
+                    <anchor min="0" max="0" />
+                    <reference min="0" max="0" />
+                    <outsidereference min="0" max="0" />
+                </elements>
+            </interface>
+            <interface name="timeline">
+                <metrics>
+                    <entry name="testTimer" support="optional" default="on" />
+                    <entry name="elementTimer" support="optional" default="on" />
+                    <entry name="elementInitialPosition" support="none" />
+                    <entry name="elementTracker" support="none" default="off" />
+                    <entry name="elementFlagListenedTo" support="optional" default="on" />
+                    <entry name="elementFlagMoved" support="none" />
+                    <entry name="elementListenTracker" support="optional" default="on" />
+                </metrics>
+                <checks>
+                    <entry name="fragmentMoved" support="none" />
+                    <entry name="fragmentPlayed" support="optional" default="off" />
+                    <entry name="fragmentFullPlayback" support="optional" default="off" />
+                    <entry name="fragmentComments" support="optional" default="off" />
+                    <entry name="scalerange" support="none" />
+                </checks>
+                <show>
+                    <entry name="volume" support="optional" default="off" />
+                    <entry name="page-count" support="optional" default="off" />
+                    <entry name="playhead" support="none" />
+                    <entry name="comments" support="optional" default="off" />
+                </show>
+                <elements>
+                    <number min="1" max="undefined" />
+                    <anchor min="0" max="0" />
+                    <reference min="0" max="0" />
+                    <outsidereference min="0" max="undefined" />
+                </elements>
+            </interface>
+        </interfaces>
+        <scaledefinitions>
+            <scale name="(Blank)">
+            </scale>
+            <scale name="Likert">
+                <scalelabel position="0">Strongly Disagree</scalelabel>
+                <scalelabel position="25">Disagree</scalelabel>
+                <scalelabel position="50">Neutral</scalelabel>
+                <scalelabel position="75">Agree</scalelabel>
+                <scalelabel position="100">Strongly Agree</scalelabel>
+            </scale>
+            <scale name="ABC">
+                <scalelabel position="100">Imperceptible</scalelabel>
+                <scalelabel position="75">Perceptible but not annoying</scalelabel>
+                <scalelabel position="50">Slightly annoying</scalelabel>
+                <scalelabel position="25">Annoying</scalelabel>
+                <scalelabel position="0">Very annoying</scalelabel>
+            </scale>
+            <scale name="Bipolar">
+                <scalelabel position="0">-50</scalelabel>
+                <scalelabel position="50">0</scalelabel>
+                <scalelabel position="100">50</scalelabel>
+            </scale>
+            <scale name="ACR">
+                <scalelabel position="0">Bad</scalelabel>
+                <scalelabel position="25">Poor</scalelabel>
+                <scalelabel position="50">Fair</scalelabel>
+                <scalelabel position="75">Good</scalelabel>
+                <scalelabel position="100">Excellent</scalelabel>
+            </scale>
+            <scale name="DCR">
+                <scalelabel position="0">(1) Very Annoying</scalelabel>
+                <scalelabel position="25">(2) Annoying</scalelabel>
+                <scalelabel position="50">(3) Slightly Annoying</scalelabel>
+                <scalelabel position="75">(4) Audible but not Annoying</scalelabel>
+                <scalelabel position="100">(5) Inaudible</scalelabel>
+            </scale>
+            <scale name="CCR">
+                <scalelabel position="12">Much Worse</scalelabel>
+                <scalelabel position="25">Worse</scalelabel>
+                <scalelabel position="38">Slightly Worse</scalelabel>
+                <scalelabel position="50">About the same</scalelabel>
+                <scalelabel position="62">Slightly Better</scalelabel>
+                <scalelabel position="75">Better</scalelabel>
+                <scalelabel position="88">Much Better</scalelabel>
+            </scale>
+            <scale name="HCRS">
+                <scalelabel position="10">Dislike Extremely</scalelabel>
+                <scalelabel position="20">Dislike Very Much</scalelabel>
+                <scalelabel position="30">Dislike Moderate</scalelabel>
+                <scalelabel position="40">Dislike Slightly</scalelabel>
+                <scalelabel position="50">Neither Like nor Dislike</scalelabel>
+                <scalelabel position="60">Like Slightly</scalelabel>
+                <scalelabel position="70">Like Moderate</scalelabel>
+                <scalelabel position="80">Like Very Much</scalelabel>
+                <scalelabel position="90">Like Extremely</scalelabel>
+            </scale>
+        </scaledefinitions>
+        <tests>
+            <test name="APE" interface="APE">
+                <descriptions>
+                    <description lang="en">Audio Perceptual Evaluation. A multi-stimulus test where each audio fragment is shown on one continuous slider. Fragments are randomnly positioned along the slider. The user clicks a fragment to play and drags to move.</description>
+                </descriptions>
+            </test>
+            <test name="vertical-sliders" interface="MUSHRA">
+                <descriptions>
+                    <description lang="en">Each element is given its own vertical slider with user defined scale markers.</description>
+                </descriptions>
+            </test>
+            <test name="horizontal-sliders" interface="horizontal">
+                <descriptions>
+                    <description lang="en">Each element is given its own horizontal slider with user defined scale markers.</description>
+                </descriptions>
+            </test>
+            <test name="discrete" interface="discrete">
+                <descriptions>
+                    <description lang="en">Each element is given a horizontal scale broken into a number of discrete choices. The number of choices is defined by the scale markers.</description>
+                </descriptions>
+            </test>
+            <test name="Comparison" interface="AB">
+                <descriptions>
+                    <description lang="en">An N-way comparison test. Each element is given its own selector box. The user can select one element per page for submission.</description>
+                </descriptions>
+            </test>
+            <test name="MUSHRA" interface="MUSHRA">
+                <descriptions>
+                    <description lang="en">Multi-stimulus with hidden reference and anchor. Each fragment is shown on its own vertical slider. One fragment must be labelled as a reference and another labelled as an anchor. One external reference must also be shown.</description>
+                </descriptions>
+                <checks>
+                    <entry name="fragmentMoved" support="none" />
+                    <entry name="fragmentPlayed" support="none" />
+                    <entry name="fragmentFullPlayback" support="none" />
+                    <entry name="fragmentComments" support="none" />
+                    <entry name="scalerange" support="none" />
+                </checks>
+                <show>
+                    <entry name="volume" support="none" />
+                    <entry name="page-count" support="none" />
+                    <entry name="playhead" support="none" />
+                    <entry name="comments" support="none" />
+                </show>
+                <elements>
+                    <anchor min="1" max="undefined" />
+                    <reference min="1" max="undefined" />
+                    <outsidereference min="1" max="1" />
+                </elements>
+                <scale name="ACR" />
+            </test>
+            <test name="Rank" interface="discrete">
+                <descriptions>
+                    <description lang="en">Each stimulus is placed on a discrete scale equalling the number of fragments. The fragments are then ranked based on the question posed. Only one element can occupy a rank position</description>
+                </descriptions>
+                <checks>
+                    <entry name="fragmentPlayed" support="none" />
+                    <entry name="fragmentFullPlayback" support="none" />
+                    <entry name="fragmentComments" support="none" />
+                </checks>
+                <show>
+                    <entry name="volume" support="none" />
+                    <entry name="page-count" support="none" />
+                    <entry name="playhead" support="none" />
+                    <entry name="comments" support="none" />
+                </show>
+                <scale name="undefined" />
+            </test>
+            <test name="Likert" interface="discrete">
+                <descriptions>
+                    <description lang="en">Each stimulus is placed on a discrete scale. The scale is fixed to the Likert scale options of 'Strongly Disagree', 'Disagree', 'Neutral', 'Agree' and 'Strongly Agree'</description>
+                </descriptions>
+                <checks>
+                    <entry name="fragmentPlayed" support="none" />
+                    <entry name="fragmentFullPlayback" support="none" />
+                    <entry name="fragmentComments" support="none" />
+                </checks>
+                <show>
+                    <entry name="volume" support="none" />
+                    <entry name="page-count" support="none" />
+                    <entry name="playhead" support="none" />
+                    <entry name="comments" support="none" />
+                </show>
+                <scale name="Likert" />
+            </test>
+            <test name="ABC/HR" interface="MUSHRA">
+                <descriptions>
+                    <description lang="en">Each stimulus is placed on a vertical slider. The scale is fixed with the labels 'Imperceptible' to 'Very Annoying'</description>
+                </descriptions>
+                <checks>
+                    <entry name="fragmentMoved" support="none" />
+                    <entry name="fragmentPlayed" support="none" />
+                    <entry name="fragmentFullPlayback" support="none" />
+                    <entry name="fragmentComments" support="none" />
+                </checks>
+                <show>
+                    <entry name="volume" support="none" />
+                    <entry name="page-count" support="none" />
+                    <entry name="playhead" support="none" />
+                    <entry name="comments" support="none" />
+                </show>
+                <scale name="ABC" />
+            </test>
+            <test name="Bipolar" interface="horizontal">
+                <descriptions>
+                    <description lang="en">Each stimulus is placed on a horizontal slider and initialised to the value '0'. The scale operates from -50 to +5-. In the results this is normalised, like all other interfaces, from 0 (-50) to 1 (+50).</description>
+                </descriptions>
+                <checks>
+                    <entry name="fragmentMoved" support="mandatory" />
+                    <entry name="fragmentPlayed" support="none" />
+                    <entry name="fragmentFullPlayback" support="none" />
+                    <entry name="fragmentComments" support="none" />
+                </checks>
+                <show>
+                    <entry name="volume" support="none" />
+                    <entry name="page-count" support="none" />
+                    <entry name="playhead" support="none" />
+                    <entry name="comments" support="none" />
+                </show>
+                <elements>
+                    <outsidereference min="1" max="1" />
+                </elements>
+                <scale name="Bipolar" />
+            </test>
+            <test name="ACR" interface="discrete">
+                <descriptions>
+                    <description lang="en">Absolute Category Rating. Each element is on a discrete scale of 'Bad', 'Poor', 'Fair', 'Good' and 'Excellent'. Each element must be given a rating.</description>
+                </descriptions>
+                <checks>
+                    <entry name="fragmentMoved" support="mandatory" />
+                    <entry name="fragmentPlayed" support="none" />
+                    <entry name="fragmentFullPlayback" support="none" />
+                    <entry name="fragmentComments" support="none" />
+                </checks>
+                <show>
+                    <entry name="volume" support="none" />
+                    <entry name="page-count" support="none" />
+                    <entry name="playhead" support="none" />
+                    <entry name="comments" support="none" />
+                </show>
+                <scale name="ACR" />
+            </test>
+            <test name="DCR" interface="discrete">
+                <checks>
+                    <entry name="fragmentPlayed" support="none" />
+                    <entry name="fragmentFullPlayback" support="none" />
+                    <entry name="fragmentComments" support="none" />
+                </checks>
+                <show>
+                    <entry name="volume" support="none" />
+                    <entry name="page-count" support="none" />
+                    <entry name="playhead" support="none" />
+                    <entry name="comments" support="none" />
+                </show>
+                <scale name="DCR" />
+            </test>
+            <test name="CCR" interface="discrete">
+                <checks>
+                    <entry name="fragmentPlayed" support="none" />
+                    <entry name="fragmentFullPlayback" support="none" />
+                    <entry name="fragmentComments" support="none" />
+                </checks>
+                <show>
+                    <entry name="volume" support="none" />
+                    <entry name="page-count" support="none" />
+                    <entry name="playhead" support="none" />
+                    <entry name="comments" support="none" />
+                </show>
+                <scale name="CCR" />
+            </test>
+            <test name="HCRS" interface="MUSHRA">
+                <checks>
+                    <entry name="fragmentMoved" support="mandatory" />
+                    <entry name="fragmentPlayed" support="none" />
+                    <entry name="fragmentFullPlayback" support="none" />
+                    <entry name="fragmentComments" support="none" />
+                </checks>
+                <show>
+                    <entry name="volume" support="none" />
+                    <entry name="page-count" support="none" />
+                    <entry name="playhead" support="none" />
+                    <entry name="comments" support="none" />
+                </show>
+                <elements>
+                    <outsidereference min="1" max="1" />
+                </elements>
+                <scale name="HCRS" />
+            </test>
+            <test name="ITUR5PCIS" interface="MUSHRA">
+                <checks>
+                    <entry name="fragmentMoved" support="none" />
+                    <entry name="fragmentPlayed" support="none" />
+                    <entry name="fragmentFullPlayback" support="none" />
+                    <entry name="fragmentComments" support="none" />
+                </checks>
+                <show>
+                    <entry name="volume" support="none" />
+                    <entry name="page-count" support="none" />
+                    <entry name="playhead" support="none" />
+                    <entry name="comments" support="none" />
+                </show>
+                <elements>
+                    <outsidereference min="1" max="1" />
+                </elements>
+                <scale name="ABC" />
+            </test>
+            <test name="AB" interface="AB">
+                <descriptions>
+                    <description lang="en">Each page has only two audio fragments. The user must select one of the two fragments to proceed. There can be one hidden reference.</description>
+                </descriptions>
+                <checks>
+                    <entry name="fragmentPlayed" support="none" />
+                    <entry name="fragmentFullPlayback" support="none" />
+                    <entry name="fragmentComments" support="none" />
+                </checks>
+                <show>
+                    <entry name="volume" support="none" />
+                    <entry name="page-count" support="none" />
+                    <entry name="playhead" support="none" />
+                    <entry name="comments" support="none" />
+                </show>
+                <elements>
+                    <number min="2" max="2" />
+                    <outsidereference min="0" max="1" />
+                </elements>
+            </test>
+            <test name="ABX" interface="ABX">
+                <descriptions>
+                    <description lang="en">Each page has two audio fragments presented as A and B. The test duplicates one of the fragments and presents it as X. The user must choose which, out of A or B, is closest to X.</description>
+                </descriptions>
+            </test>
+            <test name="timeline" interface="timeline">
+                <descriptions>
+                    <description lang="en">Each fragment is displayed with a clickable waveform of itself. The user must click on the waveform at the location that a specific event occured. Users can then enter in information about this event. This test is unit-/value-less.</description>
+                </descriptions>
+            </test>
+        </tests>
+    </root>
diff -r cc2364d8bc17 -r 2577d983f291 test_create/style.css
--- a/test_create/style.css	Mon Nov 14 12:14:48 2016 +0000
+++ b/test_create/style.css	Mon Nov 14 14:23:41 2016 +0000
@@ -1,30 +1,27 @@
 div#blanket {
     z-index: 2;
-    background-color: rgba(0,0,0,0.5);
+    background-color: rgba(0, 0, 0, 0.5);
     width: 100%;
     height: 100%;
     position: fixed;
     left: 0px;
     top: 0px;
 }
-
 div#popupHolder {
     z-index: 3;
-    background-color: rgba(255,255,255,1);
+    background-color: rgba(255, 255, 255, 1);
     width: 730px;
     height: 480px;
     position: fixed;
     border-radius: 10px;
-	box-shadow: 0px 0px 50px #000;
+    box-shadow: 0px 0px 50px #000;
     padding: 10px;
 }
-
 div#popup-title-holder {
     width: 100%;
     height: 50px;
     font-size: 2em;
 }
-
 button.popup-button {
     width: 60px;
     height: 27px;
@@ -32,15 +29,12 @@
     position: absolute;
     bottom: 10px;
 }
-
 button#popup-proceed {
     right: 10px;
 }
-
 button#popup-back {
     left: 10px;
 }
-
 div.drag-area {
     border: 3px black dashed;
 }
@@ -53,40 +47,30 @@
 div.drag-error {
     background-color: coral
 }
-
 div#project-drop {
     width: 99%;
     height: 50px;
     margin: 10px 0px;
 }
-
 div.popup-checkbox {
     padding: 5px;
 }
-
 div.popup-checkbox input {
     margin: 0px 5px;
 }
-
 div.popup-option-entry {
     padding: 5px 0px;
     border-bottom: 1px solid;
 }
-
-div.disabled{
-    color: rgb(100,100,100);
+div.disabled {
+    color: rgb(100, 100, 100);
 }
-
-
-div#page-holder > div.node{
-    background-color: rgb(200,228,151);
+div#page-holder > div.node {
+    background-color: rgb(200, 228, 151);
 }
-
-div#content > div#setup{
+div#content > div#setup {
     background-color: coral;
 }
-
-
 div.node {
     float: left;
     padding: 10px;
@@ -94,7 +78,7 @@
     border-radius: 10px;
     margin: 10px;
     min-width: 92%;
-    background-color: rgba(255,255,255,0.5);
+    background-color: rgba(255, 255, 255, 0.5);
 }
 div.node-title {
     float: left;
@@ -127,13 +111,13 @@
 div.attribute input[type=number] {
     width: 80px;
 }
-div.attribute input[type=radio], div.attribute input[type=checkbox]{
+div.attribute input[type=radio],
+div.attribute input[type=checkbox] {
     width: 10px;
 }
-input:disabled+label{
+input:disabled+label {
     text-decoration: line-through;
 }
-
 div.survey-entry-attribute {
     margin: 10px 0px;
     border: 1px gray solid;
@@ -142,7 +126,6 @@
     line-height: 40px;
     padding: 0px 10px;
 }
-
-div.survey-entry-attribute span{
+div.survey-entry-attribute span {
     margin-right: 10px;
-}
\ No newline at end of file
+}
diff -r cc2364d8bc17 -r 2577d983f291 tests/examples/AB_example.xml
--- a/tests/examples/AB_example.xml	Mon Nov 14 12:14:48 2016 +0000
+++ b/tests/examples/AB_example.xml	Mon Nov 14 14:23:41 2016 +0000
@@ -1,97 +1,97 @@
 <?xml version="1.0" encoding="utf-8"?>
-<waet xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="test-schema.xsd">
-	<setup interface="AB" projectReturn="save.php" randomiseOrder='true' poolSize="2" loudness="-23" playOne="true">
-		<survey location="before">
-			<surveyentry type="question" id="sessionId" mandatory="true">
-				<statement>Please enter your name.</statement>
-			</surveyentry>
-			<surveyentry type="checkbox" id="checkboxtest" mandatory="true">
-				<statement>Please select with which activities you have any experience (example checkbox question)</statement>
-				<option name="musician">Playing a musical instrument</option>
-				<option name="soundengineer">Recording or mixing audio</option>
-				<option name="developer">Developing audio software</option>
-				<option name="hwdesigner">Designing or building audio hardware</option>
-				<option name="researcher">Research in the field of audio</option>
-			</surveyentry>
-			<surveyentry type="statement" id="test-intro">
-				<statement>This is an example of an 'AB'-style test, with two pages, using the test stimuli in 'example_eval/'. The 'playOne' configuration option means a fragment has to be finished playing before another fragment can be auditioned. </statement>
-			</surveyentry>
-		</survey>
-		<survey location="after">
-			<surveyentry type="question" id="location" mandatory="true" boxsize="large">
-				<statement>Please enter your location. (example mandatory text question)</statement>
-			</surveyentry>
-			<surveyentry type="number" id="age" min="0">
-				<statement>Please enter your age (example non-mandatory number question)</statement>
-			</surveyentry>
-			<surveyentry type="radio" id="rating">
-				<statement>Please rate this interface (example radio button question)</statement>
-				<option name="bad">Bad</option>
-				<option name="poor">Poor</option>
-				<option name="good">Good</option>
-				<option name="great">Great</option>
-			</surveyentry>
-			<surveyentry type="statement" id="test-thank-you">
-				<statement>Thank you for taking this listening test. Please click 'submit' and your results will appear in the 'saves/' folder.</statement>
-			</surveyentry>
-		</survey>
-		<metric>
-			<metricenable>testTimer</metricenable>
-			<metricenable>elementTimer</metricenable>
-			<metricenable>elementInitialPosition</metricenable>
-			<metricenable>elementTracker</metricenable>
-			<metricenable>elementFlagListenedTo</metricenable>
-			<metricenable>elementFlagMoved</metricenable>
-			<metricenable>elementListenTracker</metricenable>
-		</metric>
-		<interface>
-			<interfaceoption type="check" name="fragmentMoved"/>
-			<interfaceoption type="check" name="scalerange" min="25" max="75"/>
-			<interfaceoption type="show" name='playhead'/>
-			<interfaceoption type="show" name="page-count"/>
-            <interfaceoption type="show" name='volume'/>
-            <interfaceoption type="show" name='comments'/>
-		</interface>
-	</setup>
-	<page id='test-0' hostURL="media/example/" randomiseOrder='true' repeatCount='0' loop='false' loudness="-12">
-		<commentboxprefix>Comment on fragment</commentboxprefix>
-		<interface>
-			<title>Depth</title>
-		</interface>
-		<audioelement url="0.wav" id="track-0"/>
-		<audioelement url="1.wav" id="track-1"/>
-		<survey location="before">
-			<surveyentry type="statement" id="test-0-intro">
-				<statement>A two way comparison using randomised element order, automatic loudness and synchronised looping.</statement>
-			</surveyentry>
-		</survey>
-		<survey location="after">
-			<surveyentry type="question" id="genre-0" mandatory="true">
-				<statement>Please enter the genre.</statement>
-			</surveyentry>
-		</survey>
-	</page>
-	<page id='test-1' hostURL="media/example/" randomiseOrder='true' repeatCount='0' loop='false' loudness="-12">
-		<commentboxprefix>Comment on fragment</commentboxprefix>
-		<interface>
-			<title>Depth</title>
-		</interface>
-		<audioelement url="0.wav" id="track-2"/>
-		<audioelement url="1.wav" id="track-3"/>
-		<audioelement url="2.wav" id="track-4"/>
-		<audioelement url="3.wav" id="track-5"/>
-		<audioelement url="4.wav" id="track-6"/>
-		<audioelement url="5.wav" id="track-7"/>
-		<audioelement url="6.wav" id="track-8"/>
-		<survey location="before">
-			<surveyentry type="statement" id="test-1-intro">
-				<statement>A 7 way comparison using randomised element order and synchronised looping.</statement>
-			</surveyentry>
-		</survey>
-		<survey location="after">
-			<surveyentry type="question" id="genre-1" mandatory="true">
-				<statement>Please enter the genre.</statement>
-			</surveyentry>
-		</survey>
-	</page>
-</waet>
\ No newline at end of file
+    <waet xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="test-schema.xsd">
+        <setup interface="AB" projectReturn="save.php" randomiseOrder='true' poolSize="2" loudness="-23" playOne="true">
+            <survey location="before">
+                <surveyentry type="question" id="sessionId" mandatory="true">
+                    <statement>Please enter your name.</statement>
+                </surveyentry>
+                <surveyentry type="checkbox" id="checkboxtest" mandatory="true">
+                    <statement>Please select with which activities you have any experience (example checkbox question)</statement>
+                    <option name="musician">Playing a musical instrument</option>
+                    <option name="soundengineer">Recording or mixing audio</option>
+                    <option name="developer">Developing audio software</option>
+                    <option name="hwdesigner">Designing or building audio hardware</option>
+                    <option name="researcher">Research in the field of audio</option>
+                </surveyentry>
+                <surveyentry type="statement" id="test-intro">
+                    <statement>This is an example of an 'AB'-style test, with two pages, using the test stimuli in 'example_eval/'. The 'playOne' configuration option means a fragment has to be finished playing before another fragment can be auditioned. </statement>
+                </surveyentry>
+            </survey>
+            <survey location="after">
+                <surveyentry type="question" id="location" mandatory="true" boxsize="large">
+                    <statement>Please enter your location. (example mandatory text question)</statement>
+                </surveyentry>
+                <surveyentry type="number" id="age" min="0">
+                    <statement>Please enter your age (example non-mandatory number question)</statement>
+                </surveyentry>
+                <surveyentry type="radio" id="rating">
+                    <statement>Please rate this interface (example radio button question)</statement>
+                    <option name="bad">Bad</option>
+                    <option name="poor">Poor</option>
+                    <option name="good">Good</option>
+                    <option name="great">Great</option>
+                </surveyentry>
+                <surveyentry type="statement" id="test-thank-you">
+                    <statement>Thank you for taking this listening test. Please click 'submit' and your results will appear in the 'saves/' folder.</statement>
+                </surveyentry>
+            </survey>
+            <metric>
+                <metricenable>testTimer</metricenable>
+                <metricenable>elementTimer</metricenable>
+                <metricenable>elementInitialPosition</metricenable>
+                <metricenable>elementTracker</metricenable>
+                <metricenable>elementFlagListenedTo</metricenable>
+                <metricenable>elementFlagMoved</metricenable>
+                <metricenable>elementListenTracker</metricenable>
+            </metric>
+            <interface>
+                <interfaceoption type="check" name="fragmentMoved" />
+                <interfaceoption type="check" name="scalerange" min="25" max="75" />
+                <interfaceoption type="show" name='playhead' />
+                <interfaceoption type="show" name="page-count" />
+                <interfaceoption type="show" name='volume' />
+                <interfaceoption type="show" name='comments' />
+            </interface>
+        </setup>
+        <page id='test-0' hostURL="media/example/" randomiseOrder='true' repeatCount='0' loop='false' loudness="-12">
+            <commentboxprefix>Comment on fragment</commentboxprefix>
+            <interface>
+                <title>Depth</title>
+            </interface>
+            <audioelement url="0.wav" id="track-0" />
+            <audioelement url="1.wav" id="track-1" />
+            <survey location="before">
+                <surveyentry type="statement" id="test-0-intro">
+                    <statement>A two way comparison using randomised element order, automatic loudness and synchronised looping.</statement>
+                </surveyentry>
+            </survey>
+            <survey location="after">
+                <surveyentry type="question" id="genre-0" mandatory="true">
+                    <statement>Please enter the genre.</statement>
+                </surveyentry>
+            </survey>
+        </page>
+        <page id='test-1' hostURL="media/example/" randomiseOrder='true' repeatCount='0' loop='false' loudness="-12">
+            <commentboxprefix>Comment on fragment</commentboxprefix>
+            <interface>
+                <title>Depth</title>
+            </interface>
+            <audioelement url="0.wav" id="track-2" />
+            <audioelement url="1.wav" id="track-3" />
+            <audioelement url="2.wav" id="track-4" />
+            <audioelement url="3.wav" id="track-5" />
+            <audioelement url="4.wav" id="track-6" />
+            <audioelement url="5.wav" id="track-7" />
+            <audioelement url="6.wav" id="track-8" />
+            <survey location="before">
+                <surveyentry type="statement" id="test-1-intro">
+                    <statement>A 7 way comparison using randomised element order and synchronised looping.</statement>
+                </surveyentry>
+            </survey>
+            <survey location="after">
+                <surveyentry type="question" id="genre-1" mandatory="true">
+                    <statement>Please enter the genre.</statement>
+                </surveyentry>
+            </survey>
+        </page>
+    </waet>
diff -r cc2364d8bc17 -r 2577d983f291 tests/examples/APE_example.xml
--- a/tests/examples/APE_example.xml	Mon Nov 14 12:14:48 2016 +0000
+++ b/tests/examples/APE_example.xml	Mon Nov 14 14:23:41 2016 +0000
@@ -1,145 +1,145 @@
 <?xml version="1.0" encoding="utf-8"?>
-<waet xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="test-schema.xsd">
-	<setup interface="APE" projectReturn="save.php" randomiseOrder='true' poolSize="2" loudness="-23" calibration="true">
-		<survey location="before">
-			<surveyentry type="question" id="sessionId" mandatory="true">
-				<statement>Please enter your name.</statement>
-                <conditional check="equals" value="John" jumpToOnPass="test-intro" jumpToOnFail="checkboxtest"/>
-			</surveyentry>
-			<surveyentry type="checkbox" id="checkboxtest" mandatory="true" min="2" max="4">
-				<statement>Please select with which activities you have any experience (example checkbox question)</statement>
-				<option name="musician">Playing a musical instrument</option>
-				<option name="soundengineer">Recording or mixing audio</option>
-				<option name="developer">Developing audio software</option>
-				<option name="hwdesigner">Designing or building audio hardware</option>
-				<option name="researcher">Research in the field of audio</option>
-			</surveyentry>
-            <surveyentry type="question" id="instrument" mandatory="false">
-                <statement>What instrument did you play</statement>
-            </surveyentry>
-			<surveyentry type="statement" id="test-intro">
-				<statement>This is an example of an 'APE'-style test, with two pages, using the test stimuli in 'example_eval/'.</statement>
-			</surveyentry>
-		</survey>
-		<survey location="after">
-			<surveyentry type="question" id="location" mandatory="true" boxsize="large">
-				<statement>Please enter your location. (example mandatory text question)</statement>
-			</surveyentry>
-			<surveyentry type="number" id="age" min="0">
-				<statement>Please enter your age (example non-mandatory number question)</statement>
-			</surveyentry>
-			<surveyentry type="radio" id="rating">
-				<statement>Please rate this interface (example radio button question)</statement>
-				<option name="bad">Bad</option>
-				<option name="poor">Poor</option>
-				<option name="good">Good</option>
-				<option name="great">Great</option>
-			</surveyentry>
-			<surveyentry type="statement" id="thankyou">
-				<statement>Thank you for taking this listening test. Please click 'submit' and your results will appear in the 'saves/' folder.</statement>
-			</surveyentry>
-		</survey>
-		<metric>
-			<metricenable>testTimer</metricenable>
-			<metricenable>elementTimer</metricenable>
-			<metricenable>elementInitialPosition</metricenable>
-			<metricenable>elementTracker</metricenable>
-			<metricenable>elementFlagListenedTo</metricenable>
-			<metricenable>elementFlagMoved</metricenable>
-			<metricenable>elementListenTracker</metricenable>
-		</metric>
-		<interface>
-			<interfaceoption type="check" name="fragmentMoved"/>
-            <interfaceoption type="check" name="fragmentPlayed"/>
-			<interfaceoption type="check" name="scalerange" min="25" max="75"/>
-			<interfaceoption type="show" name='playhead'/>
-			<interfaceoption type="show" name="page-count"/>
-            <interfaceoption type="show" name="comments"/>
-		</interface>
-	</setup>
-	<page id='test-0' hostURL="media/example/" randomiseOrder='true' repeatCount='0' loop='true' loudness="-12">
-		<commentboxprefix>Comment on fragment</commentboxprefix>
-		<interface name="preference">
-            <title>Preference</title>
-			<scales>
-				<scalelabel position="0">Min</scalelabel>
-				<scalelabel position="100">Max</scalelabel>
-				<scalelabel position="50">Middle</scalelabel>
-				<scalelabel position="20">20</scalelabel>
-			</scales>
-		</interface>
-		<interface name="depth">
-			<title>Depth</title>
-			<scales>
-				<scalelabel position="0">Low</scalelabel>
-				<scalelabel position="100">High</scalelabel>
-				<scalelabel position="50">Middle</scalelabel>
-				<scalelabel position="50">Middle</scalelabel>
-			</scales>
-		</interface>
-		<audioelement url="0.wav" id="track-0" type="anchor"/>
-		<audioelement url="1.wav" id="track-1"/>
-		<audioelement url="2.wav" id="track-2"/>
-		<audioelement url="3.wav" id="track-3"/>
-		<audioelement url="4.wav" id="track-4"/>
-		<survey location="before">
-			<surveyentry type="statement" id="test-0-intro">
-				<statement>Example of an 'APE' style interface with hidden anchor 'zero' (which needs to be below 20%), looping of the samples, randomisation of marker labels, mandatory moving of every sample, and a forced scale usage of at least 25%-75%.</statement>
-			</surveyentry>
-		</survey>
-		<survey location="after">
-			<surveyentry type="question" id="genre-0" mandatory="true">
-				<statement>Please enter the genre.</statement>
-			</surveyentry>
-		</survey>
-	</page>
-	<page id='test-1' hostURL="media/example/" randomiseOrder='true' repeatCount='0' loop='false' label="letter">
-        <commentboxprefix>Comment on fragment</commentboxprefix>
-		<interface name="preference">
-			<title>Example Test Question</title>
-			<scales>
-				<scalelabel position="0">Min</scalelabel>
-				<scalelabel position="100">Max</scalelabel>
-				<scalelabel position="50">Middle</scalelabel>
-				<scalelabel position="20">20</scalelabel>
-			</scales>
-		</interface>
-		<audioelement url="0.wav" gain="-6" id="track-5" type="anchor" marker="20"/>
-		<audioelement url="1.wav" gain="0.0" id="track-6" type="reference" marker="80"/>
-		<audioelement url="2.wav" gain="0.0" id="track-7"/>
-		<audioelement url="3.wav" gain="0.0" id="track-8"/>
-		<audioelement url="4.wav" gain="0.0" id="track-9"/>
-		<audioelement url="5.wav" gain="0.0" id="track-10"/>
-		<audioelement url="6.wav" gain="0.0" id="track-11" type="outside-reference"/>
-        <commentquestions>
-            <commentquestion id='mixingExperience'>
-                <statement>What is your general experience with numbers?</statement>
-            </commentquestion>
-            <commentradio id="preference">
-                <statement>Please enter your overall preference</statement>
-                <option name="worst">Very Bad</option>
-                <option name="bad"></option>
-                <option name="OK">OK</option>
-                <option name="Good"></option>
-                <option name="Great">Great</option>
-            </commentradio>
-            <commentcheckbox id="character" type="checkbox">
-                <statement>Please describe the overall character</statement>
-                <option name="funky">Funky</option>
-                <option name="mellow">Mellow</option>
-                <option name="laidback">Laid back</option>
-                <option name="heavy">Heavy</option>
-            </commentcheckbox>
-        </commentquestions>
-		<survey location="before">
-			<surveyentry type="statement" id="test-1-intro">
-				<statement>Example of an 'APE' style interface with hidden anchor 'zero' (which needs to be below 20%), looping of the samples, randomisation of marker labels, mandatory moving of every sample, and a forced scale usage of at least 25%-75%.</statement>
-			</surveyentry>
-		</survey>
-		<survey location="after">
-			<surveyentry type="question" id="genre-1" mandatory="true">
-				<statement>Please enter the genre.</statement>
-			</surveyentry>
-		</survey>
-	</page>
-</waet>
\ No newline at end of file
+    <waet xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="test-schema.xsd">
+        <setup interface="APE" projectReturn="save.php" randomiseOrder='true' poolSize="2" loudness="-23" calibration="true">
+            <survey location="before">
+                <surveyentry type="question" id="sessionId" mandatory="true">
+                    <statement>Please enter your name.</statement>
+                    <conditional check="equals" value="John" jumpToOnPass="test-intro" jumpToOnFail="checkboxtest" />
+                </surveyentry>
+                <surveyentry type="checkbox" id="checkboxtest" mandatory="true" min="2" max="4">
+                    <statement>Please select with which activities you have any experience (example checkbox question)</statement>
+                    <option name="musician">Playing a musical instrument</option>
+                    <option name="soundengineer">Recording or mixing audio</option>
+                    <option name="developer">Developing audio software</option>
+                    <option name="hwdesigner">Designing or building audio hardware</option>
+                    <option name="researcher">Research in the field of audio</option>
+                </surveyentry>
+                <surveyentry type="question" id="instrument" mandatory="false">
+                    <statement>What instrument did you play</statement>
+                </surveyentry>
+                <surveyentry type="statement" id="test-intro">
+                    <statement>This is an example of an 'APE'-style test, with two pages, using the test stimuli in 'example_eval/'.</statement>
+                </surveyentry>
+            </survey>
+            <survey location="after">
+                <surveyentry type="question" id="location" mandatory="true" boxsize="large">
+                    <statement>Please enter your location. (example mandatory text question)</statement>
+                </surveyentry>
+                <surveyentry type="number" id="age" min="0">
+                    <statement>Please enter your age (example non-mandatory number question)</statement>
+                </surveyentry>
+                <surveyentry type="radio" id="rating">
+                    <statement>Please rate this interface (example radio button question)</statement>
+                    <option name="bad">Bad</option>
+                    <option name="poor">Poor</option>
+                    <option name="good">Good</option>
+                    <option name="great">Great</option>
+                </surveyentry>
+                <surveyentry type="statement" id="thankyou">
+                    <statement>Thank you for taking this listening test. Please click 'submit' and your results will appear in the 'saves/' folder.</statement>
+                </surveyentry>
+            </survey>
+            <metric>
+                <metricenable>testTimer</metricenable>
+                <metricenable>elementTimer</metricenable>
+                <metricenable>elementInitialPosition</metricenable>
+                <metricenable>elementTracker</metricenable>
+                <metricenable>elementFlagListenedTo</metricenable>
+                <metricenable>elementFlagMoved</metricenable>
+                <metricenable>elementListenTracker</metricenable>
+            </metric>
+            <interface>
+                <interfaceoption type="check" name="fragmentMoved" />
+                <interfaceoption type="check" name="fragmentPlayed" />
+                <interfaceoption type="check" name="scalerange" min="25" max="75" />
+                <interfaceoption type="show" name='playhead' />
+                <interfaceoption type="show" name="page-count" />
+                <interfaceoption type="show" name="comments" />
+            </interface>
+        </setup>
+        <page id='test-0' hostURL="media/example/" randomiseOrder='true' repeatCount='0' loop='true' loudness="-12">
+            <commentboxprefix>Comment on fragment</commentboxprefix>
+            <interface name="preference">
+                <title>Preference</title>
+                <scales>
+                    <scalelabel position="0">Min</scalelabel>
+                    <scalelabel position="100">Max</scalelabel>
+                    <scalelabel position="50">Middle</scalelabel>
+                    <scalelabel position="20">20</scalelabel>
+                </scales>
+            </interface>
+            <interface name="depth">
+                <title>Depth</title>
+                <scales>
+                    <scalelabel position="0">Low</scalelabel>
+                    <scalelabel position="100">High</scalelabel>
+                    <scalelabel position="50">Middle</scalelabel>
+                    <scalelabel position="50">Middle</scalelabel>
+                </scales>
+            </interface>
+            <audioelement url="0.wav" id="track-0" type="anchor" />
+            <audioelement url="1.wav" id="track-1" />
+            <audioelement url="2.wav" id="track-2" />
+            <audioelement url="3.wav" id="track-3" />
+            <audioelement url="4.wav" id="track-4" />
+            <survey location="before">
+                <surveyentry type="statement" id="test-0-intro">
+                    <statement>Example of an 'APE' style interface with hidden anchor 'zero' (which needs to be below 20%), looping of the samples, randomisation of marker labels, mandatory moving of every sample, and a forced scale usage of at least 25%-75%.</statement>
+                </surveyentry>
+            </survey>
+            <survey location="after">
+                <surveyentry type="question" id="genre-0" mandatory="true">
+                    <statement>Please enter the genre.</statement>
+                </surveyentry>
+            </survey>
+        </page>
+        <page id='test-1' hostURL="media/example/" randomiseOrder='true' repeatCount='0' loop='false' label="letter">
+            <commentboxprefix>Comment on fragment</commentboxprefix>
+            <interface name="preference">
+                <title>Example Test Question</title>
+                <scales>
+                    <scalelabel position="0">Min</scalelabel>
+                    <scalelabel position="100">Max</scalelabel>
+                    <scalelabel position="50">Middle</scalelabel>
+                    <scalelabel position="20">20</scalelabel>
+                </scales>
+            </interface>
+            <audioelement url="0.wav" gain="-6" id="track-5" type="anchor" marker="20" />
+            <audioelement url="1.wav" gain="0.0" id="track-6" type="reference" marker="80" />
+            <audioelement url="2.wav" gain="0.0" id="track-7" />
+            <audioelement url="3.wav" gain="0.0" id="track-8" />
+            <audioelement url="4.wav" gain="0.0" id="track-9" />
+            <audioelement url="5.wav" gain="0.0" id="track-10" />
+            <audioelement url="6.wav" gain="0.0" id="track-11" type="outside-reference" />
+            <commentquestions>
+                <commentquestion id='mixingExperience'>
+                    <statement>What is your general experience with numbers?</statement>
+                </commentquestion>
+                <commentradio id="preference">
+                    <statement>Please enter your overall preference</statement>
+                    <option name="worst">Very Bad</option>
+                    <option name="bad"></option>
+                    <option name="OK">OK</option>
+                    <option name="Good"></option>
+                    <option name="Great">Great</option>
+                </commentradio>
+                <commentcheckbox id="character" type="checkbox">
+                    <statement>Please describe the overall character</statement>
+                    <option name="funky">Funky</option>
+                    <option name="mellow">Mellow</option>
+                    <option name="laidback">Laid back</option>
+                    <option name="heavy">Heavy</option>
+                </commentcheckbox>
+            </commentquestions>
+            <survey location="before">
+                <surveyentry type="statement" id="test-1-intro">
+                    <statement>Example of an 'APE' style interface with hidden anchor 'zero' (which needs to be below 20%), looping of the samples, randomisation of marker labels, mandatory moving of every sample, and a forced scale usage of at least 25%-75%.</statement>
+                </surveyentry>
+            </survey>
+            <survey location="after">
+                <surveyentry type="question" id="genre-1" mandatory="true">
+                    <statement>Please enter the genre.</statement>
+                </surveyentry>
+            </survey>
+        </page>
+    </waet>
diff -r cc2364d8bc17 -r 2577d983f291 tests/examples/horizontal_example.xml
--- a/tests/examples/horizontal_example.xml	Mon Nov 14 12:14:48 2016 +0000
+++ b/tests/examples/horizontal_example.xml	Mon Nov 14 14:23:41 2016 +0000
@@ -1,33 +1,33 @@
 <?xml version="1.0" encoding="UTF-8" ?>
-<waet xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="test-schema.xsd">
-	<setup interface="ABC" projectReturn="save.php">
-		<metric>
-			<metricenable>testTimer</metricenable>
-			<metricenable>elementTimer</metricenable>
-			<metricenable>elementInitialPosition</metricenable>
-			<metricenable>elementTracker</metricenable>
-			<metricenable>elementFlagListenedTo</metricenable>
-			<metricenable>elementFlagMoved</metricenable>
-			<metricenable>elementListenTracker</metricenable>
-		</metric>
-		<interface>
-			<interfaceoption type="check" name="fragmentMoved"/>
-			<interfaceoption type="check" name="scalerange" min="25" max="75"/>
-			<interfaceoption type="show" name='playhead'/>
-			<interfaceoption type="show" name="page-count"/>
-            <interfaceoption type="show" name="volume"/>
-            <interfaceoption type="show" name="comments"/>
-		</interface>
-	</setup>
-	<page id='test-0' hostURL="media/example/" randomiseOrder='true' repeatCount='0' loop='true' loudness="-12">
-		<interface>
-			<scales>
-				<scalelabel position="0">-50</scalelabel>
-				<scalelabel position="50">0</scalelabel>
-				<scalelabel position="100">50</scalelabel>
-			</scales>
-		</interface>
-		<audioelement url="0.wav" id="track-1"/>
-		<audioelement url="1.wav" id="track-2"/>
-	</page>
-</waet>
+    <waet xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="test-schema.xsd">
+        <setup interface="ABC" projectReturn="save.php">
+            <metric>
+                <metricenable>testTimer</metricenable>
+                <metricenable>elementTimer</metricenable>
+                <metricenable>elementInitialPosition</metricenable>
+                <metricenable>elementTracker</metricenable>
+                <metricenable>elementFlagListenedTo</metricenable>
+                <metricenable>elementFlagMoved</metricenable>
+                <metricenable>elementListenTracker</metricenable>
+            </metric>
+            <interface>
+                <interfaceoption type="check" name="fragmentMoved" />
+                <interfaceoption type="check" name="scalerange" min="25" max="75" />
+                <interfaceoption type="show" name='playhead' />
+                <interfaceoption type="show" name="page-count" />
+                <interfaceoption type="show" name="volume" />
+                <interfaceoption type="show" name="comments" />
+            </interface>
+        </setup>
+        <page id='test-0' hostURL="media/example/" randomiseOrder='true' repeatCount='0' loop='true' loudness="-12">
+            <interface>
+                <scales>
+                    <scalelabel position="0">-50</scalelabel>
+                    <scalelabel position="50">0</scalelabel>
+                    <scalelabel position="100">50</scalelabel>
+                </scales>
+            </interface>
+            <audioelement url="0.wav" id="track-1" />
+            <audioelement url="1.wav" id="track-2" />
+        </page>
+    </waet>
diff -r cc2364d8bc17 -r 2577d983f291 tests/examples/radio_example.xml
--- a/tests/examples/radio_example.xml	Mon Nov 14 12:14:48 2016 +0000
+++ b/tests/examples/radio_example.xml	Mon Nov 14 14:23:41 2016 +0000
@@ -1,37 +1,37 @@
 <?xml version="1.0" encoding="UTF-8" ?>
-<waet xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="test-schema.xsd">
-	<setup interface="likert" projectReturn="save.php" crossFade="3.0">
-		<metric>
-			<metricenable>testTimer</metricenable>
-			<metricenable>elementTimer</metricenable>
-			<metricenable>elementInitialPosition</metricenable>
-			<metricenable>elementTracker</metricenable>
-			<metricenable>elementFlagListenedTo</metricenable>
-			<metricenable>elementFlagMoved</metricenable>
-			<metricenable>elementListenTracker</metricenable>
-		</metric>
-		<interface>
-			<interfaceoption type="check" name="fragmentMoved"/>
-			<interfaceoption type="check" name="scalerange" min="25" max="75"/>
-            <interfaceoption type="show" name="volume"/>
-			<interfaceoption type="show" name='playhead'/>
-			<interfaceoption type="show" name="page-count"/>
-            <interfaceoption type="show" name="comments"/>
-		</interface>
-	</setup>
-	<page id='test-0' hostURL="media/example/" randomiseOrder='true' repeatCount='4' loop='true' loudness="-23">
-		<interface>
-			<scales>
-				<scalelabel position="0">(1) Very Annoying</scalelabel>
-				<scalelabel position="25">(2) Annoying</scalelabel>
-				<scalelabel position="50">(3) Slightly Annoying</scalelabel>
-				<scalelabel position="75">(4) Audible but not Annoying</scalelabel>
-				<scalelabel position="100">(5) Inaudible</scalelabel>
-			</scales>
-		</interface>
-		<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="3.wav" id="track-5"/>
-	</page>
-</waet>
+    <waet xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="test-schema.xsd">
+        <setup interface="likert" projectReturn="save.php" crossFade="3.0">
+            <metric>
+                <metricenable>testTimer</metricenable>
+                <metricenable>elementTimer</metricenable>
+                <metricenable>elementInitialPosition</metricenable>
+                <metricenable>elementTracker</metricenable>
+                <metricenable>elementFlagListenedTo</metricenable>
+                <metricenable>elementFlagMoved</metricenable>
+                <metricenable>elementListenTracker</metricenable>
+            </metric>
+            <interface>
+                <interfaceoption type="check" name="fragmentMoved" />
+                <interfaceoption type="check" name="scalerange" min="25" max="75" />
+                <interfaceoption type="show" name="volume" />
+                <interfaceoption type="show" name='playhead' />
+                <interfaceoption type="show" name="page-count" />
+                <interfaceoption type="show" name="comments" />
+            </interface>
+        </setup>
+        <page id='test-0' hostURL="media/example/" randomiseOrder='true' repeatCount='4' loop='true' loudness="-23">
+            <interface>
+                <scales>
+                    <scalelabel position="0">(1) Very Annoying</scalelabel>
+                    <scalelabel position="25">(2) Annoying</scalelabel>
+                    <scalelabel position="50">(3) Slightly Annoying</scalelabel>
+                    <scalelabel position="75">(4) Audible but not Annoying</scalelabel>
+                    <scalelabel position="100">(5) Inaudible</scalelabel>
+                </scales>
+            </interface>
+            <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="3.wav" id="track-5" />
+        </page>
+    </waet>
diff -r cc2364d8bc17 -r 2577d983f291 tests/examples/timeline.xml
--- a/tests/examples/timeline.xml	Mon Nov 14 12:14:48 2016 +0000
+++ b/tests/examples/timeline.xml	Mon Nov 14 14:23:41 2016 +0000
@@ -1,80 +1,80 @@
 <?xml version="1.0" encoding="UTF-8" ?>
-<waet xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="test-schema.xsd">
-	<setup interface="timeline" projectReturn="save.php">
-		<metric>
-			<metricenable>testTimer</metricenable>
-			<metricenable>elementTimer</metricenable>
-			<metricenable>elementInitialPosition</metricenable>
-			<metricenable>elementTracker</metricenable>
-			<metricenable>elementFlagListenedTo</metricenable>
-			<metricenable>elementFlagMoved</metricenable>
-			<metricenable>elementListenTracker</metricenable>
-		</metric>
-		<interface>
-			<interfaceoption type="check" name="fragmentPlayed"/>
-			<interfaceoption type="check" name="scalerange" min="25" max="75"/>
-            <interfaceoption type="show" name="volume"/>
-			<interfaceoption type="show" name='playhead'/>
-			<interfaceoption type="show" name="page-count"/>
-            <interfaceoption type="show" name="comments"/>
-		</interface>
-	</setup>
-	<page id='test-0' hostURL="media/example/" randomiseOrder='true' repeatCount='4' loop='true' loudness="-23">
-        <title>My Test</title>
-		<interface>
-			<scales>
-				<scalelabel position="0">(1) Very Annoying</scalelabel>
-				<scalelabel position="25">(2) Annoying</scalelabel>
-				<scalelabel position="50">(3) Slightly Annoying</scalelabel>
-				<scalelabel position="75">(4) Audible but not Annoying</scalelabel>
-				<scalelabel position="100">(5) Inaudible</scalelabel>
-			</scales>
-		</interface>
-		<audioelement url="0.wav" id="track-1"/>
-		<audioelement url="1.wav" id="track-2"/>
-        <commentquestion id="preference" type="radio">
-			<statement>Please enter your overall preference</statement>
-			<option name="worst">Very Bad</option>
-			<option name="bad"></option>
-			<option name="OK">OK</option>
-			<option name="Good"></option>
-			<option name="Great">Great</option>
-		</commentquestion>
-		<commentquestion id="character" type="checkbox">
-			<statement>Please describe the overall character</statement>
-			<option name="funky">Funky</option>
-			<option name="mellow">Mellow</option>
-			<option name="laidback">Laid back</option>
-			<option name="heavy">Heavy</option>
-		</commentquestion>
-	</page>
-    <page id='test-1' hostURL="media/example/" randomiseOrder='true' repeatCount='4' loop='true' loudness="-23">
-        <title>My Test</title>
-		<interface>
-			<scales>
-				<scalelabel position="0">(1) Very Annoying</scalelabel>
-				<scalelabel position="25">(2) Annoying</scalelabel>
-				<scalelabel position="50">(3) Slightly Annoying</scalelabel>
-				<scalelabel position="75">(4) Audible but not Annoying</scalelabel>
-				<scalelabel position="100">(5) Inaudible</scalelabel>
-			</scales>
-		</interface>
-		<audioelement url="0.wav" id="track-3"/>
-		<audioelement url="1.wav" id="track-4"/>
-        <commentquestion id="preference1" type="radio">
-			<statement>Please enter your overall preference</statement>
-			<option name="worst">Very Bad</option>
-			<option name="bad"></option>
-			<option name="OK">OK</option>
-			<option name="Good"></option>
-			<option name="Great">Great</option>
-		</commentquestion>
-		<commentquestion id="character1" type="checkbox">
-			<statement>Please describe the overall character</statement>
-			<option name="funky">Funky</option>
-			<option name="mellow">Mellow</option>
-			<option name="laidback">Laid back</option>
-			<option name="heavy">Heavy</option>
-		</commentquestion>
-	</page>
-</waet>
+    <waet xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="test-schema.xsd">
+        <setup interface="timeline" projectReturn="save.php">
+            <metric>
+                <metricenable>testTimer</metricenable>
+                <metricenable>elementTimer</metricenable>
+                <metricenable>elementInitialPosition</metricenable>
+                <metricenable>elementTracker</metricenable>
+                <metricenable>elementFlagListenedTo</metricenable>
+                <metricenable>elementFlagMoved</metricenable>
+                <metricenable>elementListenTracker</metricenable>
+            </metric>
+            <interface>
+                <interfaceoption type="check" name="fragmentPlayed" />
+                <interfaceoption type="check" name="scalerange" min="25" max="75" />
+                <interfaceoption type="show" name="volume" />
+                <interfaceoption type="show" name='playhead' />
+                <interfaceoption type="show" name="page-count" />
+                <interfaceoption type="show" name="comments" />
+            </interface>
+        </setup>
+        <page id='test-0' hostURL="media/example/" randomiseOrder='true' repeatCount='4' loop='true' loudness="-23">
+            <title>My Test</title>
+            <interface>
+                <scales>
+                    <scalelabel position="0">(1) Very Annoying</scalelabel>
+                    <scalelabel position="25">(2) Annoying</scalelabel>
+                    <scalelabel position="50">(3) Slightly Annoying</scalelabel>
+                    <scalelabel position="75">(4) Audible but not Annoying</scalelabel>
+                    <scalelabel position="100">(5) Inaudible</scalelabel>
+                </scales>
+            </interface>
+            <audioelement url="0.wav" id="track-1" />
+            <audioelement url="1.wav" id="track-2" />
+            <commentquestion id="preference" type="radio">
+                <statement>Please enter your overall preference</statement>
+                <option name="worst">Very Bad</option>
+                <option name="bad"></option>
+                <option name="OK">OK</option>
+                <option name="Good"></option>
+                <option name="Great">Great</option>
+            </commentquestion>
+            <commentquestion id="character" type="checkbox">
+                <statement>Please describe the overall character</statement>
+                <option name="funky">Funky</option>
+                <option name="mellow">Mellow</option>
+                <option name="laidback">Laid back</option>
+                <option name="heavy">Heavy</option>
+            </commentquestion>
+        </page>
+        <page id='test-1' hostURL="media/example/" randomiseOrder='true' repeatCount='4' loop='true' loudness="-23">
+            <title>My Test</title>
+            <interface>
+                <scales>
+                    <scalelabel position="0">(1) Very Annoying</scalelabel>
+                    <scalelabel position="25">(2) Annoying</scalelabel>
+                    <scalelabel position="50">(3) Slightly Annoying</scalelabel>
+                    <scalelabel position="75">(4) Audible but not Annoying</scalelabel>
+                    <scalelabel position="100">(5) Inaudible</scalelabel>
+                </scales>
+            </interface>
+            <audioelement url="0.wav" id="track-3" />
+            <audioelement url="1.wav" id="track-4" />
+            <commentquestion id="preference1" type="radio">
+                <statement>Please enter your overall preference</statement>
+                <option name="worst">Very Bad</option>
+                <option name="bad"></option>
+                <option name="OK">OK</option>
+                <option name="Good"></option>
+                <option name="Great">Great</option>
+            </commentquestion>
+            <commentquestion id="character1" type="checkbox">
+                <statement>Please describe the overall character</statement>
+                <option name="funky">Funky</option>
+                <option name="mellow">Mellow</option>
+                <option name="laidback">Laid back</option>
+                <option name="heavy">Heavy</option>
+            </commentquestion>
+        </page>
+    </waet>
diff -r cc2364d8bc17 -r 2577d983f291 xml/scaledefinitions.xml
--- a/xml/scaledefinitions.xml	Mon Nov 14 12:14:48 2016 +0000
+++ b/xml/scaledefinitions.xml	Mon Nov 14 14:23:41 2016 +0000
@@ -1,56 +1,56 @@
 <?xml version="1.0" encoding="UTF-8" ?>
-<scaledefinitions>
-	<scale name="Likert">
-		<scalelabel position="0">Strongly Disagree</scalelabel>
-		<scalelabel position="25">Disagree</scalelabel>
-		<scalelabel position="50">Neutral</scalelabel>
-		<scalelabel position="75">Agree</scalelabel>
-		<scalelabel position="100">Strongly Agree</scalelabel>
-	</scale>
-	<scale name="ABC">
-		<scalelabel position="100">Imperceptible</scalelabel>
-		<scalelabel position="75">Perceptible but not annoying</scalelabel>
-		<scalelabel position="50">Slightly annoying</scalelabel>
-		<scalelabel position="25">Annoying</scalelabel>
-		<scalelabel position="0">Very annoying</scalelabel>
-	</scale>
-	<scale name="Bipolar">
-		<scalelabel position="0">-50</scalelabel>
-		<scalelabel position="50">0</scalelabel>
-		<scalelabel position="100">50</scalelabel>
-	</scale>
-	<scale name="ACR">
-		<scalelabel position="0">Bad</scalelabel>
-		<scalelabel position="25">Poor</scalelabel>
-		<scalelabel position="50">Fair</scalelabel>
-		<scalelabel position="75">Good</scalelabel>
-		<scalelabel position="100">Excellent</scalelabel>
-	</scale>
-	<scale name="DCR">
-		<scalelabel position="0">(1) Very Annoying</scalelabel>
-		<scalelabel position="25">(2) Annoying</scalelabel>
-		<scalelabel position="50">(3) Slightly Annoying</scalelabel>
-		<scalelabel position="75">(4) Audible but not Annoying</scalelabel>
-		<scalelabel position="100">(5) Inaudible</scalelabel>
-	</scale>
-	<scale name="CCR">
-		<scalelabel position="12">Much Worse</scalelabel>
-		<scalelabel position="25">Worse</scalelabel>
-		<scalelabel position="38">Slightly Worse</scalelabel>
-		<scalelabel position="50">About the same</scalelabel>
-		<scalelabel position="62">Slightly Better</scalelabel>
-		<scalelabel position="75">Better</scalelabel>
-		<scalelabel position="88">Much Better</scalelabel>
-	</scale>
-	<scale name="Hedonic Category Rating Scale">
-		<scalelabel position="10">Dislike Extremely</scalelabel>
-		<scalelabel position="20">Dislike Very Much</scalelabel>
-		<scalelabel position="30">Dislike Moderate</scalelabel>
-		<scalelabel position="40">Dislike Slightly</scalelabel>
-		<scalelabel position="50">Neither Like nor Dislike</scalelabel>
-		<scalelabel position="60">Like Slightly</scalelabel>
-		<scalelabel position="70">Like Moderate</scalelabel>
-		<scalelabel position="80">Like Very Much</scalelabel>
-		<scalelabel position="90">Like Extremely</scalelabel>
-	</scale>
-</scaledefinitions>
+    <scaledefinitions>
+        <scale name="Likert">
+            <scalelabel position="0">Strongly Disagree</scalelabel>
+            <scalelabel position="25">Disagree</scalelabel>
+            <scalelabel position="50">Neutral</scalelabel>
+            <scalelabel position="75">Agree</scalelabel>
+            <scalelabel position="100">Strongly Agree</scalelabel>
+        </scale>
+        <scale name="ABC">
+            <scalelabel position="100">Imperceptible</scalelabel>
+            <scalelabel position="75">Perceptible but not annoying</scalelabel>
+            <scalelabel position="50">Slightly annoying</scalelabel>
+            <scalelabel position="25">Annoying</scalelabel>
+            <scalelabel position="0">Very annoying</scalelabel>
+        </scale>
+        <scale name="Bipolar">
+            <scalelabel position="0">-50</scalelabel>
+            <scalelabel position="50">0</scalelabel>
+            <scalelabel position="100">50</scalelabel>
+        </scale>
+        <scale name="ACR">
+            <scalelabel position="0">Bad</scalelabel>
+            <scalelabel position="25">Poor</scalelabel>
+            <scalelabel position="50">Fair</scalelabel>
+            <scalelabel position="75">Good</scalelabel>
+            <scalelabel position="100">Excellent</scalelabel>
+        </scale>
+        <scale name="DCR">
+            <scalelabel position="0">(1) Very Annoying</scalelabel>
+            <scalelabel position="25">(2) Annoying</scalelabel>
+            <scalelabel position="50">(3) Slightly Annoying</scalelabel>
+            <scalelabel position="75">(4) Audible but not Annoying</scalelabel>
+            <scalelabel position="100">(5) Inaudible</scalelabel>
+        </scale>
+        <scale name="CCR">
+            <scalelabel position="12">Much Worse</scalelabel>
+            <scalelabel position="25">Worse</scalelabel>
+            <scalelabel position="38">Slightly Worse</scalelabel>
+            <scalelabel position="50">About the same</scalelabel>
+            <scalelabel position="62">Slightly Better</scalelabel>
+            <scalelabel position="75">Better</scalelabel>
+            <scalelabel position="88">Much Better</scalelabel>
+        </scale>
+        <scale name="Hedonic Category Rating Scale">
+            <scalelabel position="10">Dislike Extremely</scalelabel>
+            <scalelabel position="20">Dislike Very Much</scalelabel>
+            <scalelabel position="30">Dislike Moderate</scalelabel>
+            <scalelabel position="40">Dislike Slightly</scalelabel>
+            <scalelabel position="50">Neither Like nor Dislike</scalelabel>
+            <scalelabel position="60">Like Slightly</scalelabel>
+            <scalelabel position="70">Like Moderate</scalelabel>
+            <scalelabel position="80">Like Very Much</scalelabel>
+            <scalelabel position="90">Like Extremely</scalelabel>
+        </scale>
+    </scaledefinitions>