как остановить вызываемую функцию

Question

У меня есть 2 div, один - объект, а другой - переключатель, в моей функции мне нужно что-то вроде .toggle(), но это невозможно в моем типе кода, для которого я его использую.То, что я хочу, я хочу, чтобы div можно было перетаскивать через функцию, но после того, как я снова переключаю кнопку, функция должна быть остановлена.

Структура, которую я получил, должна быть такой, что ее нельзя изменить..

$(document).ready(function() {
  
  window.moveactive = 0;
  
  $(".move").on("click", function() {
    moveactive = 1 - moveactive;

    if (moveactive == 1) {
      $(this).css("background-color", "green");
      activedraging();
      console.log("drag on");
    }if (moveactive == 0) {
      $(this).css("background-color", "red");
      console.log("drag off");
    }

  });
});

window.activedraging = function() {
    $(".object").draggable();
}

.move{
  width: 20px;
  height: 20px;
  background-color: red;
}

.object{
  background-color: RGB(211,211,211);
  width: 100px;
  height: 100px;
  margin-left: 10px;
  margin-top: 10px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<div class="move"></div>
<div class="object"></div>

Есть ли какой-нибудь способ, которым я мог бы переключить функцию с помощью этого сценария или альтернативного типа тайм-аутов?