
Dokumentation

The VirtualMaschine of ActionCoderz is "JSHaterVirtualMaschine" JSHVM. 

It is based on p5js. so you can use all the possibilities of p5js. p5js is Javascript-Framework. p5JS > 
It is independable, you can use it for PC,IOs. It has integrated almost every possible technic. It has a big developer community. 

All of this you can use.

Hower the JSHaterVirtualMaschine works:

[
  [setup]
  [draw]
]

In this frame the JSHVM is integrated.

Interpreted Functions (slower):
[start/update]
Instant Functions (Cursor not seen)
[drawAfter] etc

# In the leveleditor:

- InstantFunctions

// editorcode

- Editable InterpretedFunctions
- Editable InstantFunctions (/*c*/©)

# InterpretedFunctions (IF)
start()
update()

# InstantCompiledFunctions (CompiledFunctions)
drawBefore();
drawAfter();
etc. 

# special tags

default in editorcode:

/**/

/**/ : line will be not editable 
/*c*/function xyz() : is instant editable (will be compiled)

/*[1-10]*/ : /*1*/ you can change this 


# nextpage

if you want to split (and you have to) the source-code you can use

// nextpage

# levels

you can create also several levels.

split levels with the tag

// nextlevel

> function gotTo etc ... 



# Frame around:

setTitle( strHTML );
setStory( strHTML  );
setGameHook( strHTML  );

title
story (abstract)
[]
hook

# EditorFunctions: ToggleControl

function editorToggleCommentBefore() { }
function editorToggleCommentDo() { return true; }
// control if the togglecommand can be applied - true yes false - no
function editorToggleCommentAfter() { }



      <div class='docuchapter'>
    <h3>How to?</h3>      
      <div>[ <a href='#about'>about</a> | <a href='#game'>game</a> | framework |  | vars | functions ] </div> 
    </div>
     
      <div class='docuchapter'>
      <a name='about'><h3>ActionCoderz - ActionCoding</h3></a>
<div class='docu'>
ACTIONCODERZ is a game! Mechanics: Solve problems by directly code in the running applications. So it is no WriteCode and than compile. <b>You are in the machine 1:1, in the running process. We call this ActionCoding.</b> 
<br>  
<br>                
ActionCoding is the directly coding in running software! 
      </div>
      <div>
LiveActionCoding differs from LiveCoding that the code is executed directly, there is no 'relase' or 'compile'-moment. This is the running code you work in!
        </div>
    </div>

          <div class='docuchapter'>
       <a name='puzzle'><h3>SourceCode: GameCode and Editorcode</h3></a>
     <div class='docu'>
    In this editor you are able to create your own ActionCoding puzzles/applications. You have to create the puzzles of course also as source code for the ActionCodingVirtualMaschine. The code will be "compiled" into the VM of the game. 
            <br>
[EditorCode] > Game = [DirectJavascript][VMJavascript]            
                <br>        
<br>The default language is for all is javascript for creating the puzzles and also in the game. 
<br>            
Because the whole thing was coded P5JS. You can use in the game the whole framework of P5JS: <a href='https://p5js.org/reference/' target='_blank'>reference</a> and  <a href='https://p5js.org/examples/' target='_blank'>dems</a>. 
      </div>

 <div class='docuchapter'>
       <a name='puzzle'><h3>EDITOR CODE</h3></a>
 <div class='docu'>  

With the EditorCode you create the whole App/Puzzle for the Game. 
   
<br>The code is splitted into direct functions and an editable parts (after // gamecode)
   
   <pre>
[DirectJavascriptCode]
// gamecode
[GameEditorCode] 
</pre>   
<br>      The minimal EditorCode looks like this. It has a start and a update function. 
<pre>
<code>
// direct javascript 
  function hello() { }

// gamecode
        
function 
start() 
{        
  var a=10;
}

function 
update()
{
 cclear();
 cprint("code in game");
 a++; 
 cprint(a);
}
</code>
  </pre>
This generates after "compiliation" a small game with the content of an script mit the content of start and update. You can here than comment/decomment.    
<br>
<br>
   <b>Start- and Update-Functions</b>

<pre>
start(): will be executed once 
update(): every cycle.
</pre>

<div>
   <i>Remark</i> you can hide start() by putting it into before the  ""// noneditor" area!
</div>

   <br><br>
   
      <h4>Predefined vars</h4>
      <h4>Predefined functions</h4>

      <h4>Editor vars</h4>
      <div></div>
      <div>
         ccVM.coder = 0; // line
         // get line object
      </div>
      
      <h4>VirtualMachine</h4>
      
        <h5>Flow</h5>
      <div>
      <pre>
      game.arrStartTasks.push("start()");
      game.arrStartTasks.push("startAfter()");

      game.arrUpdateTasks.push("updateBefore()");
      game.arrUpdateTasks.push("update()");
      game.arrUpdateTasks.push("updateAfter()");
      </pre>        
      </div>
      <h5>Execution</h5>
      <div>
      Execution line:
    </div>
      <pre>  
    ccVM.executor = -1; // line - start ... 
    ccVM.executorSpeed = 20; // speed    
    // coder
      </pre>

      
      <h4>Examples</h4>

      Complex example
      <code>
      <pre>
        
/* not in code ! */    

      // execute list                
      game.arrGameInit.push("init()");
        
      game.arrGameLoop.push("updateBefore()");
        game.arrGameLoop.push("update()");
      game.arrGameLoop.push("updateAfter()");
                
      // not in the game
      function title() {
          return "YEAH";
       } 

       function story() {
          return "YEAH";
       } 
        
      // overwrite existing add ons !
      /*
      startBefore
        start
      startAfter

      executorBefore
        executorDo
      executorAfter        

      coderBefore
        coderDo
      coderAfter        
        
      updateBefore
     *update
      updateAfter

      */
        
      /* in the vm = game */
      /* only commentable things in listing ! */
      // editorgame

       var z=1;
       function
       init() 
       {
            a=5;
       } 
      
       function 
       update() 
       {
          // oh god ...
          cclear();
          cprint("hello");
          a=0;
          /**/ cprint("scheiss arsch");
          if
          (a==5) 
          {
             print("hello");        
          }
        }        
      </pre>
      </code>
      
      <br><br>
    </div>






/*
if (level==0) {

  addLine( "// click here  ", true );
  addLine( "// use cursors & space  ", true );
  addLine( " ", true );
  addLine( "t = 2; ", true );
  addLine( "// t = t+1; ", true );
  addLine( "// t = t+2; ", true );
  addLine( "if (t==5) gameOver(); ", false );
  addLine( "// this is all shit coding ", true );
  addLine( "if (t==10) { print('10') } ", false );
  addLine( " ", true );
  addLine( "p=4; for (var z=0;z<1000;z++) { p = p+1;  } ", true );
  addLine( "w = 'test'; ", true );
  addLine( "" ); 
  addLine( " if (t>20) t=0; ", false );
  addLine( " if (t==11) gameWin(); ", false );

}


if (level==1) {

  addLine( "// click here  ", true );
  addLine( "// use cursors & space  ", true );
  addLine( "// tipp  ", true );
  addLine( " ", true );
  addLine( "// tipp? click here ", true );

  
  addLine( "cclear(); ", true );
  addLine( "cprint('ld') ", true );
  addLine( "cprint('w') ", true );
  addLine( "cprint('o') ", true );
  addLine( "cprint('he') ", true );
  addLine( "cprint('7') ", true );
  addLine( "cprint('r') ", true );
  addLine( "cprint('ll') ", true );
  addLine( "cprint(' ') ", true );
  addLine( "cprint('2') ", true );
  addLine( "cprint('o') ", true );

  addLine( "t=t+1 ", true );

  addLine( "//  executorSpeed = 0;", true );
  addLine( "// executorSpeed = 20;", true );

  addLine( "if (stdout=='hello world') gameWin();", true );
//  addLine( "if (stdout.indexOf('hello world')!=-1) gameWin();", true );
  
  
  addLine( "", true );
  addLine( "cprint(''+crandom(6)+'  ')", true );

}

if (level==2) {

  addLine( "// click here  ", true );
  addLine( "// use cursors & space  ", true );

  addLine( "", true );

  addLine( "t++", true );

  addLine( "// var z=prompt('The password is?'); if (z==t) winGame()", true );

}
*/

// addLine( " renderDisplay(); ", false );

// things