Novice JavaScript question

mlapl1
mlapl1 Community Member Posts: 349
I am experimenting with an audio recorder suggested by Sergey. It works fine when I run it from a standard html page (i.e. the demo code provided).

The source .js files live as below:

<script type="text/javascript" src="app/js/audioplayback.js"></script>
<script src="js/lib/recorder.js"></script>
<script src="js/recordLive.js"></script>

And the html code to activate the relevant functions is:

<button class="btn btn-primary" onclick="startRecording(this);">Record</button>
<button class="btn btn-warning" onclick="stopRecording(this);" disabled>Stop</button>

I have two silly questions:

(a) How do I link the source files to Lectora? Do I use an external html object and then place search for the files and put them in Header Scripting? That would seem to be the way (my first attempt).

(b) How do I run startRecording() and stopRecording() ? Do I just put them in a JS action on a button? OR???

Thanks for your help.

Andrew

 

 

 

Comments

  • lsilver
    lsilver Community Member Posts: 80
    Hi Andrew,

    I am not a programming pro, but I will try my best to help. If you do add your script as External HTML - which would be the best way to add JavaScript to your course - you could add just multiple External HTML objects, or you could experiment with the Additional Files option in the Properties Ribbon.

    And when it comes time to call the functions, you can indeed just add a Run JavaScriptAction action to your button.

    I think you're on the right track.

    @ssneg - Any additional thoughts?

     
  • ssneg
    ssneg Community Member Posts: 1,466 ☆ Roadie ☆
    This blog explains how to add JS scripts to your title. And this Part 2 Blog explains how to optimize it with a few tricks.


    (a) How do I link the source files to Lectora? Do I use an external html object and then place search for the files and put them in Header Scripting? That would seem to be the way (my first attempt).
    First of all, create an empty folder, call it smth like "ext_js". Attach this folder to the Ext HTML Object you've just created (use Attached Files dialog). Or you could attach them to the title, or to the page, but I feel it's logical to attach them to the Ext HTML Object and do it every time so that I don't have to look everywhere around my title for script files.

    Now your title has folder "extern", which contains "ext_js". Put whatever files you need in this folder. When your title is published, the whole contents of "extern" will be placed in the root folder of published Lectora title, so you'll have a single neat "ext_js" folder that would contain any amount of scripts you might have.

    Create an Ext HTML Object, set it to Meta tags and include all your script tags in it. If you went with my "ext_js" suggestions, the paths could look like this:
    <script type=”text/javascript” src=”<strong>ext_js/</strong>app/js/audioplayback.js”></script>
    <script src=”<strong>ext_js/</strong>js/lib/recorder.js”></script>
    <script src=”<strong>ext_js/</strong>js/recordLive.js”></script>

    Again, the "ext_js" part is entirely optional, I just use it to copy all scripts in it and keep them in the same place not bothering about attaching individual files or folders. You could just as well just attached "js" folder and "app" folder separately.

    Publish your title and check whether all files have been exported properly and the paths lead where they should.

    (b) How do I run startRecording() and stopRecording() ? Do I just put them in a JS action on a button? OR???

    Yes, I think this is exactly what you should do. Create a button, add action "On Click > Run JS > startRecording(this);".
Sign In or Register to comment.

So You Wanna Be An eLearning ROCKSTAR?

We're all fans of eLearning here! Want to become an eLearning ROCKSTAR? Just click on one of the buttons below to start your rocking journey!