Write the correct word in a widget to change scene


(Alessandro) #1

Hi, please forgive me but I’m a newbie and I can not see the solution.

In a scene I have an html widget with a JS inside.
The user must write two words correctly and after doing so, he has to go to the next scene, but I can not understand how to do!
This is the widget code:

=======
<script>
function myFunctionFotografia() {

    if ($('#id1').val() == "farfalla") {
        var id1 = 5;
    }
    if ($('#id1').val() == "chiave") {
        var id1 = 6;
    }
    if ($('#id2').val() == "farfalla") {
        var id2 = 5;
    }
    if ($('#id2').val() == "chiave") {
        var id2 = 6;
    }
    var result = id1+ id2;
    if (result == 11) {        
        $("#risposta").text("ottimo lavoro clicca ancora sul tasto");
        
        $("button").text("vai avanti");
            
        $("button").click(function(){
            
    
            $("button").attr("onclick", null);
            
            //what is the correct script ?
            window.location.replace("hypeDocument.showSceneNamed(’Seconda', hypeDocument.kSceneTransitionPushRightToLeft,1)");
            
        });
    }
    else {
    
        $("#risposta").text("No! controlla meglio!");
    }
    
}
</script>
<center>
<h3><p id="risposta"></p></h3>
</center>

<table width="300" class"bordoForm">
  <tr>
    <td align="center"><input id="id1" type="text"class="trasformaTesto"></td>
  </tr>
  <tr>
    <td align="center"><input id="id2" type="text"class="trasformaTesto"></td>
  </tr>
  <tr>
    <td align="center"><button type="button" onclick="myFunctionFotografia()" class="myButtonControlla">Controlla</button></td>
  </tr>
</table><p></p>
<center>
<h3><p id="risposta"></p></h3>
</center>
=======

Is there any method more simple or … what should I write to better move between scenes?

I have many quizzes like this!

Thanks for all
Alessandro


(Mark Hunte) #2

Should simply be

hypeDocument.showSceneNamed("Seconda", hypeDocument.kSceneTransitionPushRightToLeft,1);

But I would also do what I think you are trying to do like this.

Code:

 var count1 =0,  count2 =0,  resulteCount =0;
    
    if ( $('#id1').val() == "farfalla"   && $('#id2').val() == "farfalla" ) {
      resulteCount = 10;
    } else  if (  $('#id1').val() == "chiave"  && $('#id2').val() == "chiave" ) {
       resulteCount= 12;
    } else {
    resulteCount = 11;
    }
    
   if (resulteCount == 11) {        
        $("#risposta").html("ottimo lavoro clicca ancora sul tasto");
        
            
             $("#vaiAvanti").show();
            
    }
    else {
    
        $("#risposta").html("No! controlla meglio!");
    }

And use Hypes built in API GUI with it.

jumpOnCount.hype.zip (54.1 KB)


(Alessandro) #3

Great.
It works perfectly and to much cleaner, but I can not figure out how to recognize the ID of the text fields!

But thank you, thank you very much.


(Mark Hunte) #4

The forms are made using an elements innerHTML.

Within the form’s code you will find the id.

<form onsubmit="return false">
 <input type="text" id="id1" name="name" size="20
 " style="background-color:white; 
              border: solid 0px #6E6E6E;
              height: 20px; 
              font-size:15px; 
              color:blue"><br>
 
</form>

(Alessandro) #5

Great, now I’ve seen that!

You solved my problem,
thanks again