How can i run code only outside of edit mode?

Hey,

I have implemented a carousel and wanted to make it automatically slide. That succeeded thanks to the help of this thread:

I found this thread which helped (the 'but' will follow soon):

and used this piece of javascript in the header code injection

<script>
window.onload = function() {
  var nextArrow = document.querySelector(".summary-carousel-pager-next");
  
  function clickNext() {
    nextArrow.click();
  }
 
  setInterval(clickNext, 3000);
};
</script>

My next issue was that I wanted to control the time that it takes to rewind the carousel. I did this by changing the code to this:

window.onload = function() {
	let nextArrow = document.querySelector(".summary-carousel-pager-next");
	let prevArrow = document.querySelector(".summary-carousel-pager-prev");
	let clickCount;
  
  function clickNext() {
    nextArrow.click();
    clickCount++;
  };
  
  function goBack(){
    clickCount = 0;
    prevArrow.click();
    prevArrow.click();
  };
  
  function clickHandler(){
    console.log(clickCount);
  	if(clickCount <= 2){
     	clickNext();
    }else{
    	goBack();
    }
  };
 
  setInterval(clickHandler, 3000);
};

The problem is that this works, but it forces the page to go into edit mode somehow. By reading some more threads I came to the conclusion that I would have to have this code only execute outside of edit mode. I found this thread: 

The problem now is that I have no idea how to make this work with code injection. Where should I place these lines? Is the code I'm using a proper way of handling this in the first place? 

Suppose your site url is sophietnc.squarespace.com

you can access this url: sophietnc.squarespace.com/config/safe

This link will disable custom code on Edit Mode.