Copy link to clipboard
Copied
Hi everyone,
I have created a set of custom navigation buttons for a template which I am using on a responsive design (buttons are sized, positioned and shown or not shown as appropriate for different breakpoints).
Home, Replay Slide, Pause/Play (2 buttons with actions to hide & disable or show & enable each button), Back one slide, Forward one slide, Audio on / Mute, TOC Toggle, CC Toggle, Glossary Toggle and Resources Toggle.
All works well...When the project plays, the pause button is enabled and displays correctly. If I click the pause button the project pauses, the pause button is hidden and disabled and the play button is shown and is enabled. If I click the play button, the project plays, the play button is hidden and disabled and the pause button is shown and is enabled.
The issue....
What I would like is that when the project is playing and reaches the end of the last frame on each slide, the play button automatically shows and is enabled and the pause button automatically hides and is disabled.....in other words, the same functionality as you would have in an out of the box Captivate navigation bar.
I have tried adding a button on the slide (10x10, invisible to the eye and on correct place on timeline) in top corner, hoping this would trigger Captivate to know that the project was paused when at end of last frame...no joy
I have tried using the CP system variable of cpCmndPause in a Conditional Action so that when cpCmndPause = 1, show/enable pause button and hide/disable play button...no joy
Has anyone been successful with doing something like this ? All help gratefully received !!
Copy link to clipboard
Copied
Everything in Captivate is event-based. If you want something to happen, you have to use one of the many runtime events that are available for triggering actions. Just placing a button on the timeline at a given point doesn't result in the button action being triggered.
In your case, have you tried using the On Slide Exit event of the slide to trigger the Advanced Action?
Copy link to clipboard
Copied
Hi Rod - thanks for response.
Have tried this but still no joy (unless I am doing something wrong).
Button on timeline as shown below
Conditional Action set on Slide Exit as shown below
Conditional Action as shown below
Copy link to clipboard
Copied
Forgot to add that the Else Statement on the Conditional Action is :
Copy link to clipboard
Copied
I would use the On Enter action of each slide to reset the button to its normal situation, would also have used states but that is another approach.
I am a bit puzzled by the conditional action however. You ask 'Is the slide Paused', and in that case you'll Pause it again? That doesn't seem very logical or do I miss something? Same with ELSE part: if the slide is playing, you set it to Continue? Maybe you should try to change the condition to
IF cpCmndPause is equal to 0
BTW if you want to try shared actions for toggle buttons, have a look at my blog post :1 action = 5 Toggle Buttons - Captivate blog
Copy link to clipboard
Copied
Thanks Lieve for the link to your blog...will check that out. You're right...I dont need the Pause or Continue statements....must have been having a mad moment 🙂
Will try OnEnter and changing condition and let you know.
Copy link to clipboard
Copied
If you add eventlisteners for enterSlide and a variablevalue change you can get the last frame of every slide. The following JavaScript will do exactly what you want. On enter of every slide you can show or hide specific buttons and then within 5 frames of the end of the slide show or hide other buttons. YOu can put this in the head of the html page or in an external JS file.
var interfaceObj, eventEmitterObj, csTo;
window.addEventListener( 'moduleReadyEvent', function ( e )
{
interfaceObj = e.Data;
eventEmitterObj = interfaceObj.getEventEmitter();
initializeEventListeners();
});
function initializeEventListeners()
{
if ( interfaceObj )
{
if ( eventEmitterObj )
{
eventEmitterObj.addEventListener( 'CPAPI_SLIDEENTER', function ( e )
{
eventEmitterObj.addEventListener( 'CPAPI_SLIDEEXIT', exitSlide, false );
setPage( e );
});
function exitSlide( e )
{
window.cpAPIEventEmitter.removeEventListener( 'CPAPI_VARIABLEVALUECHANGED', function ()
{
runTimer(); }, 'cpInfoCurrentFrame'
);
eventEmitterObj.removeEventListener( 'CPAPI_SLIDEEXIT', exitSlide, false );
}
}
}
}
function setPage( e )
{
csTo = e.Data.to;
//cp.show( 'pause_btn' );
//cp.show( 'play_btn' );
window.cpAPIEventEmitter.addEventListener( 'CPAPI_VARIABLEVALUECHANGED', function ()
{
runTimer( e ); }, 'cpInfoCurrentFrame'
);
}
function runTimer()
{
if ( window.cpInfoCurrentFrame > csTo- 5 )
{
//show or hide your elements
}
}
Copy link to clipboard
Copied
@TLCMediaDesign - Can this Javascript be run from within Captivate with the Execute Javascript action?
We're looking for the same functionality - Disabling our next button until the end of the slide, and this is the closest solution I've seen so far.
Copy link to clipboard
Copied
The script I posted will NOT work. I'd need to do some tests to see how you could grab the last frame of the slide. The enterslide event would already have fired if you execute JS on slide enter.
I'll see what I can find and post back.
Copy link to clipboard
Copied
Any updates on this TLCMediaDesign​?
Copy link to clipboard
Copied
Seems to be an impossible situation. Does it have to be JS? You did add this to an exxisting thread If you explained in a new question what you want to achieve really? There may be a simple solution.