<?xml version="1.0" encoding="UTF-16"?>
<!-- This XML file has been created by Easy Java(script) Simulations (EjsS). Visit http://www.um.es/fem/Ejs. -->
<!-- Please, save the file to your hard disk on your Ejs' user directory and open it with Ejs. -->
<Osejs version="6.0" password="">
<Osejs.Information>
<Title><![CDATA[Catching Correct Chinese Phase Game]]></Title>
<Copyright><![CDATA[]]></Copyright>
<Keywords><![CDATA[]]></Keywords>
<Password><![CDATA[]]></Password>
<Level><![CDATA[]]></Level>
<Language><![CDATA[]]></Language>
<Abstract><![CDATA[]]></Abstract>
<ExecPassword><![CDATA[]]></ExecPassword>
<CaptureTools>false</CaptureTools>
<DataTools>false</DataTools>
<LanguageTools>false</LanguageTools>
<AppletColSupport>false</AppletColSupport>
<UseMacMenuBar>false</UseMacMenuBar>
<FixedNavigationBar>false</FixedNavigationBar>
<RunInBrowserFirst>false</RunInBrowserFirst>
<RunAlways>true</RunAlways>
<UseInterpreter>true</UseInterpreter>
<UseDeltaForODE>false</UseDeltaForODE>
<ModelTab></ModelTab>
<ModelTabTitle><![CDATA[]]></ModelTabTitle>
<ModelName><![CDATA[]]></ModelName>
<CSSFile></CSSFile>
<StaticImages>
</StaticImages>
<HTMLHead><![CDATA[<script async="true" src="https://www.googletagmanager.com/gtag/js?id=UA-3326007-19"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'UA-3326007-19');
</script>
<script data-ad-client="ca-pub-0121577198857509" async="true" src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>]]></HTMLHead>
<Logo>./CatchingGame/Screen Shot 2018-11-07 at 4.01.39 PM (2).png</Logo>
<Author><![CDATA[Author name; Loo Kang Wee; Leow Deng Li]]></Author>
<AuthorLogo>;;</AuthorLogo>
<AdditionalLibraries>
</AdditionalLibraries>
<ImportStatements>
</ImportStatements>
<ClassesRequired>
</ClassesRequired>
<ManifestLines><![CDATA[Permissions: sandbox
Codebase: *
Caller-Allowable-Codebase: *
]]></ManifestLines>
<DetectedFiles><![CDATA[./CatchingGame/Ding Sound Effect.m4a;./CatchingGame/Screen Shot 2018-11-07 at 4.01.39 PM (2).png;./CatchingGame/apple.png;./CatchingGame/basket3.png;]]></DetectedFiles>
<AuxiliaryFiles><![CDATA[./CatchingGame/;]]></AuxiliaryFiles>
</Osejs.Information>
<Osejs.Description>
</Osejs.Description>
<Osejs.Model>
<Osejs.Model.FramesPerSecond>20</Osejs.Model.FramesPerSecond>
<Osejs.Model.StepsPerDisplay>1</Osejs.Model.StepsPerDisplay>
<Osejs.Model.RealTimeVariable></Osejs.Model.RealTimeVariable>
<Osejs.Model.Autostart>true</Osejs.Model.Autostart>
<Osejs.Model.Variables>
<Osejs.Model.Variables.Page>
<Type>VARIABLE_EDITOR</Type>
<Name>answer</Name>
<Active>true</Active>
<Internal>false</Internal>
<Content>
<PageComment><![CDATA[]]></PageComment>
<Variable>
<Name><![CDATA[numberofrounds]]></Name>
<Value><![CDATA[8]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[numberofoption]]></Name>
<Value><![CDATA[4]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[answerstringarray]]></Name>
<Value><![CDATA[[["避免","问题","分析","担忧"],["坚强","数字","情况","无奈"],["躲避","焦急","发愁","问题"],["情况","灾难","发愁","悲剧"],["深感","行动","发愁","数字"],["信心","灾难","感到","人际"],["担忧","高兴","发愁","关系"],["问题","害怕","胜利","地球"]]]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[[numberofoption]numberofrounds+1]]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[catchanswerarray]]></Name>
<Value><![CDATA[[["悲剧"],["意志"],["灾祸"],["实际"],["辨认"],["无奈"],["焦急"],["分析"]]]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[[numberofoption][numberofrounds+1]]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[]]></Name>
<Value><![CDATA[]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
</Content>
</Osejs.Model.Variables.Page>
<Osejs.Model.Variables.Page>
<Type>VARIABLE_EDITOR</Type>
<Name>Var Table</Name>
<Active>true</Active>
<Internal>false</Internal>
<Content>
<PageComment><![CDATA[]]></PageComment>
<Variable>
<Name><![CDATA[t]]></Name>
<Value><![CDATA[0]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[dt]]></Name>
<Value><![CDATA[0.05]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[n]]></Name>
<Value><![CDATA[numberofoption]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[x]]></Name>
<Value><![CDATA[[0,1,2,3]]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[[n]]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[y]]></Name>
<Value><![CDATA[[5,5,5,5]]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[[n]]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[vy]]></Name>
<Value><![CDATA[[Math.max(Math.random(),0.5),Math.max(Math.random(),0.5),Math.max(Math.random(),0.5),Math.max(Math.random(),0.5)]]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[[n]]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[textanswer]]></Name>
<Value><![CDATA[["避免","问题","分析","担忧"]]]></Value>
<Type><![CDATA[String]]></Type>
<Dimension><![CDATA[[n]]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[text]]></Name>
<Value><![CDATA[["悲剧"]]]></Value>
<Type><![CDATA[String]]></Type>
<Dimension><![CDATA[]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[vocabaudio]]></Name>
<Value><![CDATA[0]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[]]></Name>
<Value><![CDATA[]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
</Content>
</Osejs.Model.Variables.Page>
<Osejs.Model.Variables.Page>
<Type>VARIABLE_EDITOR</Type>
<Name>Var Table 2</Name>
<Active>true</Active>
<Internal>false</Internal>
<Content>
<PageComment><![CDATA[]]></PageComment>
<Variable>
<Name><![CDATA[xc]]></Name>
<Value><![CDATA[0]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[yc]]></Name>
<Value><![CDATA[0.5]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[separation]]></Name>
<Value><![CDATA[10]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[]]></Name>
<Value><![CDATA[0]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[]]></Name>
<Value><![CDATA[]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
</Content>
</Osejs.Model.Variables.Page>
<Osejs.Model.Variables.Page>
<Type>VARIABLE_EDITOR</Type>
<Name>game</Name>
<Active>true</Active>
<Internal>false</Internal>
<Content>
<PageComment><![CDATA[]]></PageComment>
<Variable>
<Name><![CDATA[score]]></Name>
<Value><![CDATA[0]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
<Variable>
<Name><![CDATA[]]></Name>
<Value><![CDATA[]]></Value>
<Type><![CDATA[double]]></Type>
<Dimension><![CDATA[]]></Dimension>
<Domain><![CDATA[public]]></Domain>
<Comment><![CDATA[]]></Comment>
</Variable>
</Content>
</Osejs.Model.Variables.Page>
</Osejs.Model.Variables>
<Osejs.Model.Initialization>
<Osejs.Model.Initialization.Page>
<Type>CODE_EDITOR</Type>
<Name>teacher key</Name>
<Active>true</Active>
<Internal>false</Internal>
<Content>
<Comment><![CDATA[]]></Comment>
<Code><![CDATA[
// question counted as 4

answerstringarray=[["避免","问题","分析","担忧"],["坚强","数字","情况","无奈"],["躲避","焦急","发愁","问题"],["情况","灾难","发愁","悲剧"],["数字","行动","发愁","喝酒"],["感到","灾难","认真","人际"],["担忧","高兴","发愁","关系"],["问题","害怕","胜利","地球"],["","","",""]]; // last option round for blank
catchanswerarray=[["悲剧"],["意志"],["灾祸"],["实际"],["辨认"],["无奈"],["焦急"],["分析"],[""]]; // last option round for blank


]]></Code>
</Content>
</Osejs.Model.Initialization.Page>
<Osejs.Model.Initialization.Page>
<Type>CODE_EDITOR</Type>
<Name>shuttle</Name>
<Active>true</Active>
<Internal>false</Internal>
<Content>
<Comment><![CDATA[]]></Comment>
<Code><![CDATA[
shuffleArray(x);


]]></Code>
</Content>
</Osejs.Model.Initialization.Page>
<Osejs.Model.Initialization.Page>
<Type>CODE_EDITOR</Type>
<Name>introduction</Name>
<Active>true</Active>
<Internal>false</Internal>
<Content>
<Comment><![CDATA[]]></Comment>
<Code><![CDATA[
_tools.showOkDialog("<p style='font-size:40px; color:black'> <br/>这个游戏需要你搭配词语，移动篮子左右，接住正确的苹果！</p>");
document.getElementById(".myBoxPanelOk").style.width = "500px";
document.getElementById(".myBoxPanelOk").style.left = "40%";
]]></Code>
</Content>
</Osejs.Model.Initialization.Page>
</Osejs.Model.Initialization>
<Osejs.Model.Evolution>
<Osejs.Model.Evolution.Page>
<Type>ODE_EDITOR</Type>
<Name>Evol Page</Name>
<Active>true</Active>
<Internal>false</Internal>
<Content>
<PreliminaryCode>
<Comment><![CDATA[Code to be executed before rate equations are evaluated]]></Comment>
<Code><![CDATA[

]]></Code>
</PreliminaryCode>
<ErrorHandling>
</ErrorHandling>
<DelayInitialCondition>
<Comment><![CDATA[]]></Comment>
<Code><![CDATA[

]]></Code>
</DelayInitialCondition>
<Discontinuities>
</Discontinuities>
<Events>
<Event.Page>
<Type>EVENT_EDITOR</Type>
<Name>Event</Name>
<Active>true</Active>
<Internal>false</Internal>
<EventContent>
<EventType>STATE_EVENT</EventType>
<Method>BISECTION</Method>
<Iterations>100</Iterations>
<Tolerance><![CDATA[1.0e-5]]></Tolerance>
<StopAtEvent>true</StopAtEvent>
<ZeroCondition><![CDATA[
return y[0]-0;
//type set to state seem to solve a bug of disappearing

]]></ZeroCondition>
<Action><![CDATA[
y[0]=6;

]]></Action>
<Comment><![CDATA[]]></Comment>
</EventContent>
</Event.Page>
<Event.Page>
<Type>EVENT_EDITOR</Type>
<Name>Event 2</Name>
<Active>true</Active>
<Internal>false</Internal>
<EventContent>
<EventType>STATE_EVENT</EventType>
<Method>BISECTION</Method>
<Iterations>100</Iterations>
<Tolerance><![CDATA[1.0e-5]]></Tolerance>
<StopAtEvent>true</StopAtEvent>
<ZeroCondition><![CDATA[
return y[1]-0;
]]></ZeroCondition>
<Action><![CDATA[
y[1]=6;

]]></Action>
<Comment><![CDATA[]]></Comment>
</EventContent>
</Event.Page>
<Event.Page>
<Type>EVENT_EDITOR</Type>
<Name>Event 2 2</Name>
<Active>true</Active>
<Internal>false</Internal>
<EventContent>
<EventType>STATE_EVENT</EventType>
<Method>BISECTION</Method>
<Iterations>100</Iterations>
<Tolerance><![CDATA[1.0e-5]]></Tolerance>
<StopAtEvent>true</StopAtEvent>
<ZeroCondition><![CDATA[
return y[2]-0;
]]></ZeroCondition>
<Action><![CDATA[
y[2]=6;

]]></Action>
<Comment><![CDATA[]]></Comment>
</EventContent>
</Event.Page>
<Event.Page>
<Type>EVENT_EDITOR</Type>
<Name>Event 2 2 2</Name>
<Active>true</Active>
<Internal>false</Internal>
<EventContent>
<EventType>STATE_EVENT</EventType>
<Method>BISECTION</Method>
<Iterations>100</Iterations>
<Tolerance><![CDATA[1.0e-5]]></Tolerance>
<StopAtEvent>true</StopAtEvent>
<ZeroCondition><![CDATA[
return y[3]-0;
]]></ZeroCondition>
<Action><![CDATA[
y[3]=6;

]]></Action>
<Comment><![CDATA[]]></Comment>
</EventContent>
</Event.Page>
<Event.Page>
<Type>EVENT_EDITOR</Type>
<Name>Collisioncorrect0</Name>
<Active>true</Active>
<Internal>false</Internal>
<EventContent>
<EventType>CROSSING_EVENT</EventType>
<Method>BISECTION</Method>
<Iterations>100</Iterations>
<Tolerance><![CDATA[1.0e-5]]></Tolerance>
<StopAtEvent>true</StopAtEvent>
<ZeroCondition><![CDATA[


separation=Math.sqrt((x[0]-xc)*(x[0]-xc)+(y[0]-yc)*(y[0]-yc));
 //  if(separation-fishSize<err && vis[i] == true && vis[j] == true){
   if(separation<0.5 ){
   
   return 0;
}
//return err;

// event triggers if two particles collide
]]></ZeroCondition>
<Action><![CDATA[
_view.audio.play();
score=score+1;
//alert();
textanswer=answerstringarray[score]; //change 4 options
text=catchanswerarray[score]
y[0]=6;
y[1]=6;
y[2]=6;
y[3]=6;
shuffleArray(x);
if(score==8){
  _pause();
  _tools.showOkDialog("游戏结束，恭喜你得到满分！");
  }

]]></Action>
<Comment><![CDATA[]]></Comment>
</EventContent>
</Event.Page>
<Event.Page>
<Type>EVENT_EDITOR</Type>
<Name>Collision 2</Name>
<Active>true</Active>
<Internal>false</Internal>
<EventContent>
<EventType>CROSSING_EVENT</EventType>
<Method>BISECTION</Method>
<Iterations>100</Iterations>
<Tolerance><![CDATA[1.0e-5]]></Tolerance>
<StopAtEvent>true</StopAtEvent>
<ZeroCondition><![CDATA[


separation=Math.sqrt((x[1]-xc)*(x[1]-xc)+(y[1]-yc)*(y[1]-yc));
 //  if(separation-fishSize<err && vis[i] == true && vis[j] == true){
   if(separation<0.5 ){
   
   return 0;
}
//return err;

// event triggers if two particles collide
]]></ZeroCondition>
<Action><![CDATA[
score=score;
//alert();

]]></Action>
<Comment><![CDATA[]]></Comment>
</EventContent>
</Event.Page>
<Event.Page>
<Type>EVENT_EDITOR</Type>
<Name>Collision 2 2</Name>
<Active>true</Active>
<Internal>false</Internal>
<EventContent>
<EventType>CROSSING_EVENT</EventType>
<Method>BISECTION</Method>
<Iterations>100</Iterations>
<Tolerance><![CDATA[1.0e-5]]></Tolerance>
<StopAtEvent>true</StopAtEvent>
<ZeroCondition><![CDATA[


separation=Math.sqrt((x[2]-xc)*(x[2]-xc)+(y[2]-yc)*(y[2]-yc));
 //  if(separation-fishSize<err && vis[i] == true && vis[j] == true){
   if(separation<0.5 ){
   
   return 0;
}
//return err;

// event triggers if two particles collide
]]></ZeroCondition>
<Action><![CDATA[
score=score;
//alert();

]]></Action>
<Comment><![CDATA[]]></Comment>
</EventContent>
</Event.Page>
<Event.Page>
<Type>EVENT_EDITOR</Type>
<Name>Collision 2 2 2</Name>
<Active>true</Active>
<Internal>false</Internal>
<EventContent>
<EventType>CROSSING_EVENT</EventType>
<Method>BISECTION</Method>
<Iterations>100</Iterations>
<Tolerance><![CDATA[1.0e-5]]></Tolerance>
<StopAtEvent>true</StopAtEvent>
<ZeroCondition><![CDATA[


separation=Math.sqrt((x[3]-xc)*(x[3]-xc)+(y[3]-yc)*(y[3]-yc));
 //  if(separation-fishSize<err && vis[i] == true && vis[j] == true){
   if(separation<0.5 ){
   
   return 0;
}
//return err;

// event triggers if two particles collide
]]></ZeroCondition>
<Action><![CDATA[
score=score;
//alert();

]]></Action>
<Comment><![CDATA[]]></Comment>
</EventContent>
</Event.Page>
</Events>
<IndependentVariable>t</IndependentVariable>
<Increment>dt</Increment>
<Rate state="x[i]">0</Rate>
<Rate state="y[i]">-vy[i]</Rate>
<Rate state=""></Rate>
<Rate state=""></Rate>
<Method>RungeKutta</Method>
<Tolerance></Tolerance>
<InternalStep></InternalStep>
<MemoryLength></MemoryLength>
<MaximumStep></MaximumStep>
<MaximumNumberOfSteps>10000</MaximumNumberOfSteps>
<AbsoluteTolerance>0.00001</AbsoluteTolerance>
<RelativeTolerance></RelativeTolerance>
<EstimateFirstStep>false</EstimateFirstStep>
<AccelerationIndependentOfVelocity>false</AccelerationIndependentOfVelocity>
<ForceSynchronization>false</ForceSynchronization>
<UseBestInterpolation>false</UseBestInterpolation>
<EventMaximumStep></EventMaximumStep>
<DelayList><![CDATA[]]></DelayList>
<DelayMaximum><![CDATA[]]></DelayMaximum>
<DelayAddDiscont><![CDATA[]]></DelayAddDiscont>
<DirectIncidenceMatrix><![CDATA[]]></DirectIncidenceMatrix>
<Comment><![CDATA[]]></Comment>
</Content>
</Osejs.Model.Evolution.Page>
</Osejs.Model.Evolution>
<Osejs.Model.Constraints>
</Osejs.Model.Constraints>
<Osejs.Model.Library>
<Osejs.Model.Library.Page>
<Type>LIBRARY_EDITOR</Type>
<Name>shuttlearray</Name>
<Active>true</Active>
<Internal>false</Internal>
<Content>
<Comment><![CDATA[]]></Comment>
<Code><![CDATA[
//https://stackoverflow.com/questions/2450954/how-to-randomize-shuffle-a-javascript-array
/**
 * Randomize array element order in-place.
 * Using Durstenfeld shuffle algorithm.
 */
function shuffleArray(array) {
    for (var i = array.length - 1; i > 0; i--) {
        var j = Math.floor(Math.random() * (i + 1));
        var temp = array[i];
        array[i] = array[j];
        array[j] = temp;
    }
}
]]></Code>
</Content>
</Osejs.Model.Library.Page>
<Osejs.Model.Library.Page>
<Type>LIBRARY_EDITOR</Type>
<Name>sound</Name>
<Active>true</Active>
<Internal>false</Internal>
<Content>
<Comment><![CDATA[]]></Comment>
<Code><![CDATA[
function speech (option) {

  if(parent.cordova) { // check it is running in Android
//var option1 = _view.comboBox.getProperty("SelectedOptions");
       parent.TTS.speak(option, function () {
            // success
        }, function (reason) {
            // error
        });
    }
    else {
  var msg = new SpeechSynthesisUtterance(option);
  //https://stackoverflow.com/questions/43983845/speechsynthesis-api-for-chinese-firefox
  
  msg.lang = 'zh';
window.speechSynthesis.speak(msg);
}

}

]]></Code>
</Content>
</Osejs.Model.Library.Page>
<Osejs.Model.Library.Page>
<Type>LIBRARY_EDITOR</Type>
<Name>changeOrientation</Name>
<Active>true</Active>
<Internal>false</Internal>
<Content>
<Comment><![CDATA[]]></Comment>
<Code><![CDATA[
// code to be copied to EJSS source code under Custom and used in drawingPanel3D and plottingPanel2D
// address the problem is height difference is iOS app , epub, and Firefox
// user need to change only k and kepub
// copy %changeOrientation()% into the Height Field of drawingPanel3D and plottingPanel2D
function changeOrientation() {
 
var k =0.9 ; // k control height 1 is for full screen, 0.9 shorten etc
var kepub =0.9 ;
// check platform for Apps
try { // allow code to run in Student Learning Space 
  var iOSapp =  (typeof parent.device != 'undefined' && parent.device.platform == "iOS");
  var Androidapp = (typeof parent.device != 'undefined' && parent.device.platform == "Android");
} catch(e) {
  var iOSapp = false;
  var Androidapp = false;
}
// check platform for web browsers
var iOS =/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
var iPad =/iPad/.test(navigator.userAgent) && !window.MSStream;
var iPhone = /iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
var Android= /Android|android/i.test(navigator.userAgent);

//navigator
var Firefox = navigator.userAgent.indexOf("Firefox") != -1;
 
switch (window.orientation) { // using window.orientation as deciding factor
  case 0:
  case 180:
    this.screenOrientation = 'portrait';
    if (iOSapp){ // does not seems to work
      
      return window.screen.height*k;  //0.1 for app and 0.1 for nonfullscreenapp  
    
    }
    else if (_isEPub){ // does not seems to work
      //   return Math.max(window.screen.width,window.screen.height)*0.9;
      return window.innerHeight*kepub;  //0.1 for app and 0.1 for nonfullscreenapp  
      // return window.screen.height;
      //  return window.innerHeight;
      // return document.documentElement.clientHeight;
    }
   
    else {
     
      return 100*k+"vh";
    }
    break;
  case 90:
  case -90:
    this.screenOrientation = 'landscape';
 
    if (iOSapp){ // App
      return window.screen.width*k;  
      // return window.screen.height;
      //  return window.innerHeight;
      //  return document.documentElement.clientHeight;
    }
    else if (_isEPub){ // does not seems to work
      //   return Math.max(window.screen.width,window.screen.height)*0.9;
      return window.innerHeight*kepub;  //0.1 for app and 0.1 for nonfullscreenapp  
      // return window.screen.height;
      //  return window.innerHeight;
      // return document.documentElement.clientHeight;
    }
   
    else {
      return 100*k+"vh";
      }
    break;
  default:
    this.screenOrientation = 'unknown';
    //       return (iPad)?""+(window.screen.width+window.screen.height)*0.4:((iPhone)?""+window.screen.width:_view._format(window.innerHeight*0.9,"0"));
     if (Firefox){
      return window.innerHeight*k;// number as of 20180831 Firefox does not support vh yet so need a separate line to handle
      }
      
      else {
        return 100*k+"vh"; // string every other solid deployment, Android Android App web chrome etc
        //console.log('hello');
}

}
 
}
]]></Code>
</Content>
</Osejs.Model.Library.Page>
</Osejs.Model.Library>
<Osejs.Model.Elements>
</Osejs.Model.Elements>
</Osejs.Model>
<Osejs.View>
<Osejs.View.Creation>
</Osejs.View.Creation>
</Osejs.View>
<Osejs.HtmlView>
<Osejs.HtmlView.Page>
<Type>HTML_VIEW_EDITOR</Type>
<Name>HtmlView Page</Name>
<Active>true</Active>
<Internal>false</Internal>
<Content>
<SizeOption>0</SizeOption>
<X>0</X>
<Y>0</Y>
<Width>800</Width>
<Height>600</Height>
<KeepHidden>true</KeepHidden>
<RootProperties>
</RootProperties>
<Tree>
<HtmlView.Element>
<Expanded>true</Expanded>
<Type>Elements.Panel</Type>
<Name><![CDATA[singlePlotPanel]]></Name>
</HtmlView.Element>
<HtmlView.Element>
<Expanded>true</Expanded>
<Type>Elements.WrappedPanel</Type>
<Name><![CDATA[wrappedPanel]]></Name>
<Parent><![CDATA[singlePlotPanel]]></Parent>
<Property name="CSS"><![CDATA[{ "display":"block"}]]></Property>
</HtmlView.Element>
<HtmlView.Element>
<Expanded>true</Expanded>
<Type>Elements.Panel</Type>
<Name><![CDATA[controlPanel]]></Name>
<Parent><![CDATA[wrappedPanel]]></Parent>
<Property name="CSS"><![CDATA[{"display":"block"}]]></Property>
<Property name="BorderStyle"><![CDATA["solid"]]></Property>
<Property name="BorderColor"><![CDATA["Gray"]]></Property>
<Property name="BorderWidth"><![CDATA[1]]></Property>
<Property name="Width"><![CDATA["100%"]]></Property>
</HtmlView.Element>
<HtmlView.Element>
<Expanded>true</Expanded>
<Type>Elements.Panel</Type>
<Name><![CDATA[firstRowPanel]]></Name>
<Parent><![CDATA[controlPanel]]></Parent>
<Property name="Display"><![CDATA["100%"]]></Property>
</HtmlView.Element>
<HtmlView.Element>
<Expanded>true</Expanded>
<Type>Elements.Panel</Type>
<Name><![CDATA[executionPanel]]></Name>
<Parent><![CDATA[firstRowPanel]]></Parent>
<Property name="Width"><![CDATA["100%"]]></Property>
<Property name="Display"><![CDATA["inline-block"]]></Property>
</HtmlView.Element>
<HtmlView.Element>
<Type>Elements.Label</Type>
<Name><![CDATA[label]]></Name>
<Parent><![CDATA[executionPanel]]></Parent>
<Property name="Text"><![CDATA["搭配游戏"]]></Property>
<Property name="Font"><![CDATA["normal normal 2vw "]]></Property>
</HtmlView.Element>
<HtmlView.Element>
<Type>Elements.TwoStateButton</Type>
<Name><![CDATA[runPauseButton]]></Name>
<Parent><![CDATA[executionPanel]]></Parent>
<Property name="OffClick"><![CDATA[%_pause%]]></Property>
<Property name="TextOn"><![CDATA["▶"]]></Property>
<Property name="State"><![CDATA[_isPaused]]></Property>
<Property name="Tooltip"><![CDATA["Play/Pause"]]></Property>
<Property name="TextOff"><![CDATA["❚❚"]]></Property>
<Property name="OnClick"><![CDATA[%_play%]]></Property>
<Property name="Font"><![CDATA["normal bold 2vw"]]></Property>
</HtmlView.Element>
<HtmlView.Element>
<Type>Elements.Button</Type>
<Name><![CDATA[resetButton2]]></Name>
<Parent><![CDATA[executionPanel]]></Parent>
<Property name="Text"><![CDATA["↻"]]></Property>
<Property name="OnClick"><![CDATA[%_reset%]]></Property>
<Property name="Font"><![CDATA["normal bold 2vw"]]></Property>
</HtmlView.Element>
<HtmlView.Element>
<Type>Elements.Audio</Type>
<Name><![CDATA[audio]]></Name>
<Parent><![CDATA[executionPanel]]></Parent>
<Property name="AudioUrl"><![CDATA["./CatchingGame/Ding Sound Effect.m4a"]]></Property>
</HtmlView.Element>
<HtmlView.Element>
<Expanded>true</Expanded>
<Type>Elements.PlottingPanel</Type>
<Name><![CDATA[plottingPanel]]></Name>
<Parent><![CDATA[wrappedPanel]]></Parent>
<Property name="Gutters"><![CDATA[[0,0,0,0]]]></Property>
<Property name="XFixedTick"><![CDATA[0]]></Property>
<Property name="Enabled"><![CDATA[true]]></Property>
<Property name="MaximumY"><![CDATA[6]]></Property>
<Property name="MaximumX"><![CDATA[3.5]]></Property>
<Property name="YFixedTick"><![CDATA[0]]></Property>
<Property name="YAutoTicks"><![CDATA[false]]></Property>
<Property name="TRMessage"><![CDATA["分数="+score+"/"+numberofrounds]]></Property>
<Property name="MinimumX"><![CDATA[-0.5]]></Property>
<Property name="MinimumY"><![CDATA[0]]></Property>
<Property name="XTickStep"><![CDATA[1]]></Property>
<Property name="YTickStep"><![CDATA[10]]></Property>
<Property name="XAutoTicks"><![CDATA[false]]></Property>
<Property name="Height"><![CDATA[%changeOrientation()%]]></Property>
<Property name="Width"><![CDATA["100%"]]></Property>
</HtmlView.Element>
<HtmlView.Element>
<Type>Elements.ShapeSet2D</Type>
<Name><![CDATA[shapeSet]]></Name>
<Parent><![CDATA[plottingPanel]]></Parent>
<Property name="FillColor"><![CDATA["Yellow"]]></Property>
<Property name="ShapeType"><![CDATA["ROUND_RECTANGLE"]]></Property>
<Property name="ElementInteracted"><![CDATA[vocabaudio]]></Property>
<Property name="NumberOfElements"><![CDATA[numberofoption]]></Property>
<Property name="Sensitivity"><![CDATA[0]]></Property>
<Property name="SizeX"><![CDATA[0.5]]></Property>
<Property name="X"><![CDATA[x]]></Property>
<Property name="LineColor"><![CDATA["Blue"]]></Property>
<Property name="Y"><![CDATA[y]]></Property>
<Property name="OnPress"><![CDATA[speech(textanswer[vocabaudio]);]]></Property>
<Property name="Visibility"><![CDATA[false]]></Property>
<Property name="SizeY"><![CDATA[0.5]]></Property>
<Property name="EnabledPosition"><![CDATA["ENABLED_NO_MOVE"]]></Property>
</HtmlView.Element>
<HtmlView.Element>
<Type>Elements.ImageSet2D</Type>
<Name><![CDATA[imageSet]]></Name>
<Parent><![CDATA[plottingPanel]]></Parent>
<Property name="NumberOfElements"><![CDATA[numberofoption]]></Property>
<Property name="Sensitivity"><![CDATA[0]]></Property>
<Property name="SizeX"><![CDATA[0.4]]></Property>
<Property name="X"><![CDATA[x]]></Property>
<Property name="Y"><![CDATA[y]]></Property>
<Property name="ImageUrl"><![CDATA["./CatchingGame/apple.png"]]></Property>
<Property name="OnPress"><![CDATA[speech(textanswer[vocabaudio]);]]></Property>
<Property name="SizeY"><![CDATA[1.5]]></Property>
<Property name="EnabledPosition"><![CDATA["ENABLED_NO_MOVE"]]></Property>
<Property name="ElementInteracted"><![CDATA[vocabaudio]]></Property>
</HtmlView.Element>
<HtmlView.Element>
<Type>Elements.TextSet2D</Type>
<Name><![CDATA[textSet]]></Name>
<Parent><![CDATA[plottingPanel]]></Parent>
<Property name="NumberOfElements"><![CDATA[numberofoption]]></Property>
<Property name="FillColor"><![CDATA["Yellow"]]></Property>
<Property name="X"><![CDATA[x]]></Property>
<Property name="Y"><![CDATA[y]]></Property>
<Property name="Text"><![CDATA[textanswer]]></Property>
<Property name="Font"><![CDATA["normal normal 35px "]]></Property>
</HtmlView.Element>
<HtmlView.Element>
<Expanded>true</Expanded>
<Type>Elements.Group2D</Type>
<Name><![CDATA[group]]></Name>
<Parent><![CDATA[plottingPanel]]></Parent>
</HtmlView.Element>
<HtmlView.Element>
<Type>Elements.Shape2D</Type>
<Name><![CDATA[shape]]></Name>
<Parent><![CDATA[group]]></Parent>
<Property name="SizeX"><![CDATA[0.5]]></Property>
<Property name="X"><![CDATA[xc]]></Property>
<Property name="Y"><![CDATA[yc]]></Property>
<Property name="OnPress"><![CDATA[speech(text);]]></Property>
<Property name="Visibility"><![CDATA[false]]></Property>
<Property name="SizeY"><![CDATA[0.5]]></Property>
<Property name="EnabledPosition"><![CDATA["ENABLED_X"]]></Property>
</HtmlView.Element>
<HtmlView.Element>
<Type>Elements.Image2D</Type>
<Name><![CDATA[image]]></Name>
<Parent><![CDATA[group]]></Parent>
<Property name="Sensitivity"><![CDATA[0]]></Property>
<Property name="SizeX"><![CDATA[0.5]]></Property>
<Property name="X"><![CDATA[xc]]></Property>
<Property name="ImageUrl"><![CDATA["./CatchingGame/basket3.png"]]></Property>
<Property name="Y"><![CDATA[yc]]></Property>
<Property name="OnPress"><![CDATA[speech(text);]]></Property>
<Property name="SizeY"><![CDATA[3.5]]></Property>
<Property name="EnabledPosition"><![CDATA["ENABLED_X"]]></Property>
</HtmlView.Element>
<HtmlView.Element>
<Type>Elements.Text2D</Type>
<Name><![CDATA[text]]></Name>
<Parent><![CDATA[group]]></Parent>
<Property name="FillColor"><![CDATA["Black"]]></Property>
<Property name="X"><![CDATA[xc]]></Property>
<Property name="Y"><![CDATA[yc]]></Property>
<Property name="Text"><![CDATA[%text%]]></Property>
<Property name="Font"><![CDATA["normal normal 40px "]]></Property>
</HtmlView.Element>
<HtmlView.Element>
<Type>Elements.Text2D</Type>
<Name><![CDATA[arrow]]></Name>
<Parent><![CDATA[group]]></Parent>
<Property name="RelativePosition"><![CDATA["NORTH"]]></Property>
<Property name="X"><![CDATA[xc]]></Property>
<Property name="Y"><![CDATA[yc+1]]></Property>
<Property name="Text"><![CDATA["↔"]]></Property>
<Property name="Font"><![CDATA["normal normal 10vw "]]></Property>
</HtmlView.Element>
</Tree>
</Content>
</Osejs.HtmlView.Page>
</Osejs.HtmlView>
</Osejs>
