< Back

Getting Started

UI Display Function

Loading Function

Text to Animated Function

Load Scripts form Text

Actor Function

Interaction Function

Advanced Function

Loading Scripts

In this sample, you may use the loadScript function to toggle and load different scripts for an actor by pressing buttons with specific behaviors. Copy and paste the codes to your custom web page so that you can have an actor display different scripts and expressions.

Using the loadScript Function

Controls Behaviors

This sample contains 2 buttons, their behaviors are:

Click the first button, Script1, to load and apply the first script (Scripts.uctscript) to the actor, and auto-play after it is loaded. Meanwhile, a message is put in the Console panel of your web browser after the script is loaded.
Click the second button, Script2, to load and apply the second script (Script2.uctscript) to the actor, the script will not auto-play and you will need to click the play button to play the script. Meanwhile, a message is put in the Console panel of your web browser after the script is loaded.
Please view the source code here.

Sample Code:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ssl-webplayer.unity3d.com/download_webplayer-3.x/3.0/uo/UnityObject2.js"></script>
<script type="text/javascript" src="https://www.reallusion.com/crazytalk/Unity/samplecode/CTWebPlayer.min.js"></script>
<script type="text/javascript">
    var player = new CTWebPlayer();
    $(function () {

        player.playerUrl = "https://www.reallusion.com/crazytalk/Unity/samplecode/CTWebPlayer.unity3d";
        player.init($("#unityPlayer"), function () {
            player.loadActor("https://www.reallusion.com/crazytalk/Unity/samplecode/SampleCode5/Scripts.uctmodel", {
                idleMotionUrl: "https://www.reallusion.com/crazytalk/Unity/samplecode/SampleCode5/Affirmative.uctidle"
            });
        });
    });
     function Script1() {
        player.loadScript("https://www.reallusion.com/crazytalk/Unity/samplecode/SampleCode5/Scripts.uctscript", {
            playAfter: 0,
            loaded: function (status) {
                console.log("Script1 loaded!");
            }
        });
    }
    function Script2() {
        player.loadScript("https://www.reallusion.com/crazytalk/Unity/samplecode/SampleCode5/Script2.uctscript", {
            playAfter: -1,
            loaded: function (status) {
                console.log("Script2 loaded!");
            }
        });
    }
</script>

Copy and paste the codes in-between the <head> and </head> tags of your custom web page.
The purposes of the functions:
- $(function (): This function defines the address, the position of the CrazyTalk Web Player in the custom web and loads a default actor (Scripts.uctModel) with an assigned idle motion (CTDefWebPreview.uctidle) once your page is opened. This function is a must because you need to have an actor before loading and assigning scripts to it.
- function Script1(): This function loads a script (Scripts.uctscript) and plays the script instantly. It also prompts a message text, Script1 loaded!, in the console panel.
- function Script2(): This function loads a script (Script2.uctscript) without playing back but having the actor remains idling. It also prompts a message text, Script2 loaded!, in the console panel.
The adjustable codes in the functions:
$(function ()
- Replace the below address of the CrazyTalk Web Player with the one within your self-hosting server.
  https://www.reallusion.com/crazytalk/Unity/samplecode/CTWebPlayer.unity3d
- player.loadProject(){...}: For more information about the modification method to the function loading a default project, please refer to the Loading Actors section.

function Script1 and Script2

Replace the below addresses of the *.uctmodel files with the ones where you have uploaded your custom actors.
In Script1: https://www.reallusion.com/crazytalk/Unity/samplecode/SampleCode5/Scripts.uctscript
In Script2: https://www.reallusion.com/crazytalk/Unity/samplecode/SampleCode5/Script2.uctscript

Note:

If the custom script files are uploaded to the identical server where your custom web pages are, then simply change the entire addresses (http://...uctscript) to the file names of the custom scripts.
Otherwise, you must replace the entire addresses with the complete addresses (URL) of the custom script files.

playAfter: This value determines the seconds for the player to wait before starting play the true content of the project. A negative number means never to play back.
loaded: function (status) {}: If you want to execute more commands, functions or methods after the custom script is loaded, then add them into this function in-between the curly brackets. They will instantly be executed after the custom script is loaded.
In this case, the console panel will display Script1 loaded! or Script2 loaded!.

<div id="unityPlayer" style="width: 640px; height: 480px;">
</div>
<input type="button" value="Script1" onclick="Script1()" class="button" />
<input type="button" value="Script2" onclick="Script2()" class="button" />

Web Player

Copy and paste the codes from <div> to </div> into the position where you want to embed the web player in-between the <body> and </body> tags of your custom web page.
Modify the numbers after the width: and height: parameters in the first line to customize the size of the player.

Controls for Loading Scripts

Copy the <input.../> lines to the positions where you want to embed the buttons in-between the <body> and </body> tags of your custom web page.
Please note that:
- The function and the button that calls it must be individually put within the head and body blocks in pairs.
- You can only copy and paste the desired buttons and the functions to your custom web pages.
These two <input.../> lines form two buttons on the web. Each of them will call the function declared within the head block after being clicked.