cancel
Showing results for 
Search instead for 
Did you mean: 
cancel
Showing results for 
Search instead for 
Did you mean: 

ending timeout function, with button click

SOLVED
DF_9703795
Granite

ending timeout function, with button click

Hi everyone,

 

i am still a rookie with JavaScript and I think this is not that difficult, but i can't find a solution.

 

I have an Animation, where I want to make some labels visible after some time (4.5 sec and 6.5sec) at Step 2, I use this code, which works fine:

$scope.widgets_playStarted = function(){
  if($scope.view.wdg['model-1']['currentStep'] == 2){
     $timeout(function(){
        $scope.view.wdg["label_1"].visible = true;
     }, 4500)

     $timeout(function(){
       $scope.view.wdg["label_2"].visible = true;
     }, 6500)

  }

 

I also have a Stop-Button. With this I want to stop the animation, but I can't stop the timeout function. So when I click "Stop" the animation stops but the label still gets visible after the 4.5 and 6.5 seconds.

 

So how do I also cancel the timeout function with the click on the Stop button?

 

Thank you very much!

1 ACCEPTED SOLUTION

Accepted Solutions

Re: ending timeout function, with button click

Hi,

 

you  can put an additional if statement in your timeout function like this:

$timeout(function(){
  if($scope.view.wdg['model-1']['playing'] == true){
        $scope.view.wdg["label_1"].visible = true;
     }
  }, 4500)

 

 

View solution in original post

4 REPLIES 4

Re: ending timeout function, with button click

Hi, @DF_9703795 

 

$timeout would only be executed ONCE each time it is called. And then Stop.

 

Base on your code, There is no need to cancel $timeout that already stopped.

Nevertheless, those Labels could be hidden by the function below, immediately.

$scope.hideLabels = function(){
  $scope.view.wdg["label_1"].visible = false;
  $scope.view.wdg["label_2"].visible = false;
}

 Add hideLabels() to JS Click Events of Stop Button, it should be work out fine.

Re: ending timeout function, with button click

@dsgnrClarK thanks for your reply.

 

The problem is that if I press "stop" with this function inside after the labels are visible so after the 6.5sec it works fine, but if i press stop before the labels are visible. The timeout function will still make them visible after the 6.5sec.

$scope.hideLabels = function(){
  $scope.view.wdg["label_1"].visible = false;
  $scope.view.wdg["label_2"].visible = false;
}

 Please take a look on the video I attached. When I press "X" the labels that are already visible, get hidden but after I press "X" the other labels shouldn't get visible anymore. So for that I need to stop the timeout-Function.

Re: ending timeout function, with button click

Hi,

 

you  can put an additional if statement in your timeout function like this:

$timeout(function(){
  if($scope.view.wdg['model-1']['playing'] == true){
        $scope.view.wdg["label_1"].visible = true;
     }
  }, 4500)

 

 

View solution in original post

Re: ending timeout function, with button click

Sorry I got it wrong.

Then clearTimeout() would be an answer for it.

Announcements
Join an
AR Working Group!

Topics available:
AR/VR for Data Optimization AR/VR for Security and Control AR/VR for Inspection