changeset 2850:6c41a874fd21

#119 Implementing sort function into MUSHRA

--- a/interfaces/mushra.js	Tue Apr 25 16:19:37 2017 +0100
+++ b/interfaces/mushra.js	Wed Apr 26 10:33:35 2017 +0100
@@ -50,7 +50,7 @@
     var playback = document.createElement("button");
     playback.innerHTML = 'Stop';
     playback.id = 'playback-button';
-    playback.style.float = 'left';
+    playback.style.display = 'inline-block';
     // 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 () {
@@ -66,7 +66,7 @@
     submit.innerHTML = 'Next';
     submit.onclick = buttonSubmitClick;
     submit.id = 'submit-button';
-    submit.style.float = 'left';
+    submit.style.display = 'inline-block';
     // Append the interface buttons into the interfaceButtons object.
     interfaceButtons.appendChild(playback);
     interfaceButtons.appendChild(submit);
@@ -224,6 +224,7 @@
                     if (pagecountHolder === null) {
                         pagecountHolder = document.createElement('div');
                         pagecountHolder.id = 'page-count';
+                        pagecountHolder.style.display = 'inline-block';
                     }
                     pagecountHolder.innerHTML = '<span>Page ' + (testState.stateIndex + 1) + ' of ' + testState.stateMap.length + '</span>';
                     var inject = document.getElementById('interface-buttons');
@@ -237,6 +238,38 @@
                 case "comments":
                     interfaceContext.commentBoxes.showCommentBoxes(feedbackHolder, true);
                     break;
+                case "fragmentSort":
+                    (function () {
+                        var button = document.createElement("button");
+                        button.textContent = "Sort";
+                        button.style.display = 'inline-block';
+                        var container = document.getElementById("interface-buttons");
+                        var neighbour = container.lastElementChild;
+                        while (neighbour.nodeName !== "BUTTON") {
+                            neighbour = neighbour.previousElementSibling;
+                        }
+                        if (neighbour.nextElementSibling) {
+                            container.insertBefore(button, neighbour.nextElementSibling);
+                        } else {
+                            container.appendChild(button);
+                        }
+                        button.onclick = function () {
+                            var sortIndex = interfaceContext.sortFragmentsByScore();
+                            var sliderBox = document.getElementById("slider-holder");
+                            var nodes = audioEngineContext.audioObjects.filter(function (ao) {
+                                return ao.specification.type !== "outside-reference";
+                            });
+                            var i;
+                            nodes.forEach(function (ao) {
+                                sliderBox.removeChild(ao.interfaceDOM.holder);
+                            });
+                            for (i = 0; i < nodes.length; i++) {
+                                var j = sortIndex[i];
+                                sliderBox.appendChild(nodes[j].interfaceDOM.holder);
+                            }
+                        };
+                    })();
+                    break;
             }
         }
     });

--- a/tests/examples/mushra_example.xml	Tue Apr 25 16:19:37 2017 +0100
+++ b/tests/examples/mushra_example.xml	Wed Apr 26 10:33:35 2017 +0100
@@ -48,6 +48,7 @@
             <interface>
                 <interfaceoption type="check" name="fragmentMoved" />
                 <interfaceoption type="check" name="scalerange" min="25" max="75" />
+                <interfaceoption type="show" name="fragmentSort" />
                 <interfaceoption type="show" name='playhead' />
                 <interfaceoption type="show" name="page-count" />
                 <interfaceoption type="show" name="volume" />