Skip to main content
1-Visitor
May 6, 2020
Solved

Link function to a specific step from Illustrate sequence

  • May 6, 2020
  • 1 reply
  • 3400 views

I want to link a case inside a switch function to a step created in Creo Illustrate.

 

What's the javascript to achieve this?

Best answer by RolandRaytchev

I think we have a similar issue as mention in the posts:

"Model Item colors are not showing up in View" and "Facing problem while switching one model to another model"

OK not the same appearance  of the issue but the same reasons that the issue occurs  and same solution

-problem is that the sequence will override the current status 

We can try to unset the sequence:

 

$scope.setWidgetProp('model-1','sequence', undefined);
$scope.$applyAsync();

or try this:

...
tml3dRenderer.setProperties('model-1-/', { decal:false, hidden:false});
$scope.setWidgetProp('model-1','sequence', undefined);
$scope.$applyAsync();
...

 

It needs to  be tested which code will lead to the best results.

Additionally you can try to see if the force hide will override the  sequence settings

something like this:

 

//model widget 'model-1'
$timeout(function () {
//set the forceHiden propery to true - only as additional option
$scope.setWidgetProp('model-1', 'forceHidden', true);
//or the same as calling this line below
//$scope.view.wdg['model-1']['forceHidden'] = true;
// set model to not visible
 
 $scope.$applyAsync(()=>{$scope.setWidgetProp('model-1', 'visbile', false); });

$scope.setWidgetProp('model-1', 'forceHidden', false);
},50);

 

1 reply

21-Topaz I
May 12, 2020

Hi @micah ,

I am not sure 100% what you meant to link a step. So I belive

1.)you need an event wihc is fired when a particular step is called/ started  to track this event.

2.) you need to idetify the correct step- by number or name... etc.

So the best way to use this is register the stepstarted and stepcompleted event to check when a step is started or finished. The event callback will pass some argument where you can check which step is currently called:

//==================================
$scope.$on('stepstarted', function(evt, arg1, arg2, arg3) { 
 var parsedArg3 = JSON.parse(arg3);

 
 console.log("stepName="+parsedArg3.stepName);// this is the stepName
 console.log("stepDescription="+parsedArg3.stepDescription);//step description
 console.log("nextStep="+parsedArg3.nextStep);// info about the next step

 console.warn("Event: " + evt.name + " arg3 fields, name: " + parsedArg3.stepName + " duration(ms): " + parsedArg3.duration + " total steps: " + parsedArg3.totalSteps + " step desc: " + parsedArg3.stepDescription );
//this will paly for step n the seq_step_n.mp3 from the Uploaded project folder
$scope.app.playAudio('app/resources/Uploaded/seq_step_'+parsedArg3.stepNumber+'.mp3');
if(stepNumber ==3) console.log("step 3 was started!)
}); 

Creo Illustrate you can define an acknowledgment for s step and this will call the event. If you have only one definition for particular step this will be called only for this step.

 

2020-05-12_14-49-36.jpg

micah1-VisitorAuthor
1-Visitor
May 13, 2020

I created a sequence with Creo Illustrate with several steps. But when I bind a button to play the sequence of the model widget, it plays the entire sequence. I want to be able to link the button to play a specific step animation within the sequence.

21-Topaz I
May 13, 2020

OK, understand, you want to call from code for specific sequence a  certain step. You can use some function like this below:

 

//////////////////////////////////
//definition of the function
$scope.app.playModelStep = function (sequence,modelName,step_number,play) {
 
 //sequnece -sequnece name e.g. TestFigure1 - as shown in UI
//modelName - model name e.g. model-1 widget
//step_number - set this number to current step
//play true/false execute play for the model
//================================================ 
 $timeout(function () {
 $scope.$applyAsync(()=>{$scope.setWidgetProp(modelName, 'sequence', '');});
 },50);
 $timeout(function () {
 $scope.$applyAsync(()=>{$scope.setWidgetProp(modelName, 'sequence', 'resources/Uploaded/'+sequence);}); 
 },50);
 $timeout(function () { 
 $scope.$applyAsync(()=>{$scope.setWidgetProp(modelName, 'currentStep', parseInt(step_number));});
 if(play) //check if play should be applyed 
 $timeout(function () {angular.element(document.getElementById(modelName)).scope().play(); }, 100)
 //angular.element(document.getElementById(modelName)).scope().play(); }, 100);
 }
 , 500);
};

 

 

and the call then from anywhere in your code (also from a case construct)  it could  looks like:

 

 

...
$scope.app.playModelStep("Figure 1","model-1",3,true);
...

 

 

here we will start in Model Widget "model-1" in the sequence Figure 1  - playing step 3 

The last argument true means it will play the step. if the last argumetn is false, then the function will  set the sequence /firgure and the step as current but it will not play the step.

It is possible to define the function more general. Additional we can set  als the source - the model - pvz file.

 

 

...
//////////////
//definition of the function
$scope.app.playModelStepPvz = function (pvz,sequence,modelName,step_number,play) {
 //pvz file
 //sequnece -sequnece name e.g. TestFigure1 - as shown in UI
//modelName - model name e.g. model-1 widget
//step_number - set this number to current step
//play true/false execute play for the model
 
 $scope.$applyAsync(()=>{$scope.setWidgetProp(modelName, 'src', '');}); 
 $timeout(function () {
 $scope.$applyAsync(()=>{$scope.setWidgetProp(modelName, 'src', 'app/resources/Uploaded/'+pvz +'.pvz');}); 
 },50); 
 $timeout(function () {
 $scope.$applyAsync(()=>{$scope.setWidgetProp(modelName, 'sequence', '');}); 
 },50);
 $timeout(function () {
 $scope.$applyAsync(()=>{$scope.setWidgetProp(modelName, 'sequence', 'app/resources/Uploaded/l-Creo 3D - '+sequence +'.pvi');}); 
 },50);
 $timeout(function () { 
 $scope.$applyAsync(()=>{$scope.setWidgetProp(modelName, 'currentStep', parseInt(step_number));});
 if(play) //check if play should be applyed
 $timeout(function () {angular.element(document.getElementById(modelName)).scope().play(); }, 100)
 //angular.element(document.getElementById(modelName)).scope().play(); }, 100);
 }
 , 500);
};
//////////////////////////////////
...
$scope.app.playModelStepPvz("engine_high","Figure 1","model-1",3,true)

 

 

where we will call "engine_high.pvi" , sequence Figure Figure 1 , model Widget model-1 and step 3  will be set . The call will also play this step (last argument = true) The location of all files is the Upload project folder.