In some courses you don’t want the user to “scrub” back and forth by using the progress bar slider. Of course you can disable the progress bar alltogether but then you will loose the visual indication of how far the user has progress in the course.
By using a custom Flash file it is possible to manipulate this Adobe Captivate progress bar slider so that it will show the progress but the user can’t interact with it.
The progress bar slider uses an event listener to check if the user interacts with the slider. To remove the possiblity of the user to interact with the slider we can simply delete these event listeners.
This is all the code you need in order to “lock” the Adobe Captivate Progress bar slider.
A word of caution! Once you have deleted these event listeners there is no way to reactive them again. Therefore you can’t disable the interaction on some slides and reactivate it on others.
I included the Flash source file and a published SWF in case you don’t have access to Adobe Flash.
Well I can almost tick off one of my to-do’s for 2010 now since the new design of my site is live ;o)
I still have a few things I need to fix before I am 100% happy with it but that should be done within the next week or so. Mainly it’s some CSS issues/tweaks and some graphical work.
I also have some weird stuff going on with the Avatars on the page – It’s not working like I want it to so I need to figure out where that went wrong.
All in all I’m pretty happy with the result. I think it’s more “clean” and easy to look at.
In case you encounter any weird behaviour or obvious bugs with this new design I would appreciate it if you leave a comment here to this post.
Lately the web-host that I use for this domain (one.com) has been going downhill rapidly. Every week there are problems with their servers or other stuff that makes this page inaccessible for anything between 2 minutes and several hours.
Their support isn’t exactly helpful but promise that the problems will be solved next week. Of course when the problems then occur again the week after then they will be fixed by the next week and so on.
I have used one.com as a web-host for many sites in the last 5 years and I never had any problems with them before. Sadly now it looks like they have overcrowded their servers so the service and quality of hosting has been seriously impacted.
Today when my site was down again I decided that enough is enough. I will be switching to a new professional host in the very near future.
I thought I would continue with a couple of more tips & trics for manipulating the standard TOC in Adobe Captivate 4. I spent a day breaking open a Captivate file and peered into the mechanics of how everything works so I still have a couple of new things up my sleeve ;o)
Unfortunately these TOC manipulations are exclusive to AS2 projects. If you publish your Adobe Captivate project as AS3 then there seems to be no way of manipulating the TOC.
One thing that has always annoyed me is the TOC duration timer in the bottom of the TOC. The TOC settings allow you to deselect “Duration” so that each of your slides in the TOC won’t display the minutes / seconds it takes to complete that slide. One would think that if a developer disables the duration view for the individual slides then the total duration would also be disable but unfortunately not.
The Flash plugin is required to view this object.
There is however a very simple approach to disable this TOC total duration display. Again we will need a custom Flash file to do the trick.
The code is just two lines (three with the stop command) and it looks like this:
Basically what we are doing is setting the movieclips inside Adobe Captivate 4 that holds the duration as invisible.
Of course you can make them visible again by changing the property from “false” to “true”.
I included a zip file here with the Flash file and the published SWF in case someone without access to Flash would like to use this feature. Ignore the _root warning when you insert the animation into Adobe Captivate.
The Table of Contents (TOC) in Adoce Captivate is a popular feature, but unfortunately it doesn’t offer alot of customization options.
When using the TOC in overlay mode you will get a small button “>>” in the top left (or top right) corner. This button can be used to open and close the TOC. If you use one of the standard Adobe Captivate playbars you also have a “TOC” button there, which can be used to open/close the TOC.
But what if you don’t use a playbar in your projects? Well then you are actually stuck with the small “>>” button as the only mean of opening and closing the TOC. That little button isn’t very visible and if you like me use templates in your projects it will most likely be place on top of some of your existing elements.
The Captivate movie below demonstrates the various possibilities of the TOC including the custom button approach.
The Flash plugin is required to view this object.
Luckily if you have access to Adobe Flash you can create your own button to open and close the Adobe Captivate TOC. Here is how it’s done:
Step 1:
Create your button in your program of choice.
Step 2:
Open up a new Flash file with the same dimensions as your button
Then we create our function that will execute when the user clicks out button. Notice that in the function we once again hide the “>>” or “<<” button since their status will reset when the TOCManager.showTOC(); function is executed:
Insert the Flash file as an animation in your Captivate project. You need to insert this on every slide – you cannot use “Display for rest of project”.
Step 8:
Publish your Captivate project and enjoy your own custom TOC button ;o)
Full AS2 actionsscript for the custom Adobe Captivate TOC button:
The same can be achieved with Actionscript 3.0 so I thought I would post the code here. The AS3 code is very similar to the AS2 code so I will not explain it in detail. Take a look at the AS2 tutorial instead for a full explanation.
// Create the menu variable var myCustomMenu:ContextMenu = newContextMenu();
// hide the standard menu items
myCustomMenu.hideBuiltInItems();
// create your custom menu items. var menuItem1:ContextMenuItem = newContextMenuItem(".: Developed by www.cpguru.com :."); var menuItem2:ContextMenuItem = newContextMenuItem("-> Click here to visit our webpage");
// set up a listener for menuItem2
menuItem2.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, openWebsite);
// push the custom menu items to the menu
myCustomMenu.customItems.push(menuItem1, menuItem2); this.contextMenu = myCustomMenu;
// the function to open up your website function openWebsite(e:ContextMenuEvent):void{ varurl:String = "http://www.cpguru.com"; var request:URLRequest = new URLRequest(url);
navigateToURL(request, '_blank'); }
Adobe is conducting a survey of what current Captivate users think of Adobe Captivate and how they use it in their daily routines.
It takes 15 minutes to answer the survey and I highly recommend that you take the time. The more answers Adobe get from us users the better product we will get from Adobe ;o)
Wouldn’t it be nice to add your own custom right click menu to your Adobe Captivate projects? Actually that’s a pretty simple task using a little Flash file to “inject” a new menu and substitute the standard Captivate / Flash menu with that. You could add information about who developed the project, link to your website, contact details etc.
Here is a little tutorial on how to create such a custom right-click menu in Flash (AS2) and add it into Adobe Captivate.
Demonstration:
The movie below has the regular / standard Adobe Flash and Adobe Captivate right-click menu:
The Flash plugin is required to view this object.
The movie below has a custom right-click menu:
The Flash plugin is required to view this object.
The Flash code:
The full code is available below, but I will go through all the code line-by-line and explain them.
This line will create a variable to hold our custom menu.
1
var customMenu = newContextMenu();
These two lines is what we will show in the custom menu. You simply insert your own text between the ” ” brackets and that is what will be shown in the menu. Now the important thing here is that you also need an “action” to occur when the user clicks that menu item. This action is usually a function and it can simply be an empty function if you don’t want anything to happen when the user clicks. The function names above are “emptyFunction” and “openWebsite”.
1 2
customMenu.customItems.push(newContextMenuItem(".: Developed by www.cpguru.com :.", emptyFunction));
customMenu.customItems.push(newContextMenuItem(" -> Click here to visit our website!", openWebsite));
This will hide the standard right-click menu items.
1
customMenu.hideBuiltInItems();
This will put our custom menu items into the menu.
1
_root.menu = customMenu;
Here is our function called openWebsite. This will execute if the user clicks the associated menu item.
1 2 3
function openWebsite(){ getURL("http://www.cpguru.com", "_blank"); }
Here we have our emptyFunction, which will be executed when the user clicks the associated menu item. Since the function is empty no action will be taken.
1
function emptyFunction(){};
Below here is the full code.
Full code for the custom Adobe Captivate right-click menu:
// Custom right click menu that can be used with Adobe Captivate
// setup the new menu var customMenu = newContextMenu();
// create the menuitems
customMenu.customItems.push(newContextMenuItem(".: Developed by www.cpguru.com :.", emptyFunction));
customMenu.customItems.push(newContextMenuItem(" -> Click here to visit our website!", openWebsite));
// This will hide the regular menu items and substitute the default right click menu with our own menu
customMenu.hideBuiltInItems();
// Subsitute menu with our custom menu _root.menu = customMenu; // function to open the URL on click function openWebsite(){ getURL("http://www.cpguru.com", "_blank"); }
// empty function for the first line of our menu
function emptyFunction(){};
Steps to complete in Adobe Flash and Adobe Captivate:
So what you need to do is to create a new Flash file. Set the size to 100px x 100px as we don’t want to display anything - just execute some code.
Once you have your new Flash file open then click F9 to open up the actions panel and paste in your code. Now you just need to save your Flash file and publish it (CTRL+Enter).
Now you need to insert this Flash file into your Captivate project. Insert it on your first slide and just let it display for the standard 3 seconds. That’s actually all you need to do. Now when you view your published movie and right-click you will see your own custom menu.
A couple of things to keep in mind:
- Once you have injected your custom menu into your Adobe Captivate project you cannot get back the default Flash right-click menu without removing the Flash file and republishing your project.
- It shouldn’t be used in projects where you rely on catching right-clicks in Captivate simulations etc.
2010 – a brand new year is awaiting with all it’s interesting challenges and problems to be solved. For me 2010 will also be the year where I will have a new little person in my life. My wife is pregnant and due in just 4 weeks. A very exciting time for me and something I look forward to immensely.
On the professional side I have some ambitions in regards to skills that I wan’t to either improve or learn from scratch.
I would like to improve my ActionScript 3 skills.
I would like to learn a secondary programming language such as PHP or ASP.
I would like to get a Adobe Captivate ACE certification. I have been putting this on hold for a long time now since the existing certification only covers Adobe Captivate 3. I was hoping that Adobe would have launced an ACE in Adobe Captivate 4, but now I seriously doubt that Adobe will do that.
In regards to the www.cpguru.com blog I have the following ambitions for 2010:
Change the design of the blog from it’s current design.
Post more ;o)
Focus a bit more on tutorials in regards to Adobe Flash / Adobe Captivate integration.
Start clearing out my to-do list in regards to components and widgets. I have a looong list of things I would like to create but haven’t had time to do. Now it’s time to either scratch them from the list or get the ball running.
In addition to the above I have some personal goals and ambitions so 2010 will be an interesting year.
To kick of 2010 I am preparing a small tutorial on how to create a custom right-click menu in Adobe Flash that you can use in your Adobe Captivate projects. It should be ready some time tomorrow.
This widget will allow you to send an email in the background to a predefined address. It will send an email once the widget is “played” on the Captivate timeline.
It will send an email with the subject “Mail sent from Captivate e-mail Widget” and it will send you the users name. (of course the user needs to enter his name in Captivate).
It relies on the widely available CGI / Perl script FormMail (www.formmail.com). This is a free open source script that is pre-installed on many webhosts.
The widget has two paramenters that needs to be set.
THe recipient email address. The default settings in the FormMail script dictates that this must be an email on the same domain as from the the script is exectuted. In other words – if I use the widget in an Adobe Captivate project located on my domain www.cpguru.com it can only send emails to xxx@cpguru.com.This functionality can be changed in the FormMail settings if needed so you can define more allowed domains to send email to.
The location of the FormMail script on your webserver. The location is usually something like http://www.domain.com/cgi-bin/FormMail.pl but that depends on how and where your Webhost installed it (if it’s preinstalled) or where you installed it yourself.
How to use the Email Widget for Adobe Captivate:
First of all ensure that you have FormMail installed on your Webserver and that it is working.
The only requirements that the widget have is the two parameters mentioned above and a variable called v_Name that needs to be set in Captivate. The v_Name variable is used in the stock Adobe Captivate Certificate Widget to display the student name so I reused this variable name to give some synergy effects if you are using multiple widgets.
Process in Captivate:
Create a user defined variable called v_Name
Create a Text Entry Box and associate the v_Name variable with that.
Insert the widget in Captivate anywhere after the Text Entry Box.
Define the two parameters in the Widget Parameters Tab
That’s it.
Now you will receive an email everytime someone accesses your Captivate course. The email will contain the following information:
Below is the result of your feedback form. It was submitted by
() on Friday, December 18, 2009 at 10:37:38
—————————————————————————
userID: Michael
—————————————————————————
In case you do not recieve an email then chances are that the error is with the FormMail script (or the link to the location of the script). I cannot provide support on anything FormMail related so I recommend that you look at http://www.scriptarchive.com/formmail.html where everything in regards to the FormMail script is described in detail.
The download package also contains a sample Captivate project. The FormMail script is not supplied due to license restrictions, but you can download it yourself for free on http://www.formmail.com/
Please note – the widget is supplied as is. The widget worked flawlessly in all my tests, but this is no guarantee that it will work for you.
