diff --git a/atlas/templates/atlas/series_viewer.html b/atlas/templates/atlas/series_viewer.html
index f1273b42..54da5c82 100755
--- a/atlas/templates/atlas/series_viewer.html
+++ b/atlas/templates/atlas/series_viewer.html
@@ -59,10 +59,11 @@
     <details>
         <summary>Truncate series</summary>
         <p>
-            This will limit the series to the selected bounds (the rest of the images will be deleted). This is useful when you have a large volume of which only a small area is relevant to the case. NOTE: once deleted the images cannot be recovered on the site (they would have to be reuploaded if required).
+            This will limit the series to the selected bounds (the rest of the images will be deleted). This is useful when you have a large volume of which only a small area is relevant to the case. NOTE: once deleted the images cannot be recovered on the site (they would have to be reuploaded if required). Make sure your images are shown in the correct order above and use test the test truncate button first.
         </p>
         Start <input id="lower-truncation-bound-input" type="number" value="1"> <button id="set-lower-truncation-bound-button">Set</button><br/>
         End <input  id="upper-truncation-bound-input"type="number" value="{{image_url_array_and_count.1}}"> <button id="set-upper-truncation-bound-button">Set</button><br/>
+        <button id="truncate-test-button">Test truncate</button>
         <button id="truncate-button">Trucate series</button>
         <div id="trucate-output"></div>
 
@@ -122,9 +123,28 @@
             index = cornerstone.getEnabledElement(dicom_element).toolStateManager.toolState.stack.data[0].currentImageIdIndex
             $("#upper-truncation-bound-input").val(index+1);
         });
-        $("#truncate-button").click(() => {
-            console.log("click")
 
+        $("#truncate-test-button").click(() => {
+            lower_bound = parseInt($("#lower-truncation-bound-input").val()) - 1;
+            upper_bound = parseInt($("#upper-truncation-bound-input").val()) - 1;
+
+            if (lower_bound >= upper_bound) {
+                alert("The lower bound must be less than the upper bound.");
+                return;
+            }
+            dicom_element = $(".cornerstone-element").get(0);
+            stack = cornerstone.getEnabledElement(dicom_element).toolStateManager.toolState.stack.data[0]
+            stack.imageIds = stack.imageIds.slice(lower_bound, upper_bound)
+
+            stack.currentImageIdIndex = 0
+            //let id = stack.imageIds[0];
+            //cornerstone.loadImage(id).then((b) => {
+            //    cornerstone.displayImage(dicom_element, b);
+            //});
+            cornerstone.reset(dicom_element);
+
+        })
+        $("#truncate-button").click(() => {
             lower_bound = parseInt($("#lower-truncation-bound-input").val()) - 1;
             upper_bound = parseInt($("#upper-truncation-bound-input").val()) - 1;