diff --git a/src/brainbrowser/volume-viewer.js b/src/brainbrowser/volume-viewer.js index decb2028..fbe254ac 100644 --- a/src/brainbrowser/volume-viewer.js +++ b/src/brainbrowser/volume-viewer.js @@ -278,6 +278,7 @@ * @name viewer * @property {array} volumes Volumes to be displayed. * @property {boolean} synced Are the cursors being synced across volumes? + * @property {array} containers The div containers for each volume. * @property {DOMElement} dom_element The DOM element where the viewer * will be inserted. * @property {active_panel} active_panel The slice panel that's currently @@ -316,6 +317,7 @@ var viewer = { dom_element: dom_element, volumes: [], + containers: [], synced: false }; diff --git a/src/brainbrowser/volume-viewer/modules/loading.js b/src/brainbrowser/volume-viewer/modules/loading.js index 10bb6eda..811106f5 100644 --- a/src/brainbrowser/volume-viewer/modules/loading.js +++ b/src/brainbrowser/volume-viewer/modules/loading.js @@ -291,6 +291,7 @@ BrainBrowser.VolumeViewer.modules.loading = function(viewer) { }); viewer.volumes = []; + viewer.containers = []; viewer.active_panel = null; viewer.dom_element.innerHTML = ""; }; @@ -719,7 +720,23 @@ BrainBrowser.VolumeViewer.modules.loading = function(viewer) { }); })(); - dom_element.appendChild(container); + viewer.containers[vol_id] = container; + + /* See if a subsequent volume has already been loaded. If so we want + * to be sure that this container is inserted before the subsequent + * container. This guarantees the ordering of elements. + */ + var containers = viewer.containers; + var next_id; + for (next_id = vol_id + 1; next_id < containers.length; next_id++) { + if (next_id in containers) { + dom_element.insertBefore(container, containers[next_id]); + break; + } + } + if (next_id === containers.length) { + dom_element.appendChild(container); + } viewer.triggerEvent("volumeuiloaded", { container: container, volume: volume,