Skip to content

sf-wdi-22-23/kyrel

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

24 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Kyrel

Kyrel is a simple browser-based game for learning about control flow and loops in javascript. It is reminiscent of a turing machine that manipulates a strip of tape, transforming it from an initial state to a final state.

Methods

The following special methods are available for traversing/transforming the row:

  • moveRight();
  • moveLeft();
  • useGreen();
  • useBlue();
  • draw();
  • erase();
  • onGreen();
  • onBlue();

Example Problem

Write a program which draws a green circle at the end of the row.

  function main() {
    moveRight();
    moveRight();
    moveRight();
    moveRight();
    useGreen();
    draw();
  }

This would result in the following transformation:

 ['.', '.', '.', '.', '.'] // start row (initial state)
 ['.', '.', '.', '.', 'g'] // end row (end state)

####Start:

####End:

Instructions

Clone this repo! (Or click "Download ZIP" on the right).

There are three problem sets, organized by difficulty: day_1, day_2, day_3.

Solutions may be found in the /solutions folder. NO PEEKING! Try your darndest before you give up. The name of the solution file will match the title of the problem. For example, the solution to turn_3rd_cell_blue can be found at challenges/solutions/turn_3rd_cell_blue.js.

Using kyrel.js

If you look in kyrel.js you'll see this:

var initial_state = [ '.', '.', '.', '.', '.' ];

function main(n) {

  //////////////////////////////////
  ////                          ////
  //// v YOUR CODE BELOW HERE v ////
  ////                          ////
  //////////////////////////////////



  //////////////////////////////////
  ////                          ////
  //// ^ YOUR CODE ABOVE HERE ^ ////
  ////                          ////
  //////////////////////////////////

} // END MAIN
  • First, you need to manually configure your "starting row" (see kyrel.js#L22) to match the initial state of the problem you're solving.

    • var initial_state = ['.', 'b', '.', 'g', '.'] // kyrel.js#L22
      • 'b' means blue
      • 'g' mean green
      • '.' means empty
  • Next, write your instructions inside the main function in kyrel.js.

    • TIP: If you declare your variables at the very TOP of the kyrel.js file, your values will be in the "global scope". This will make it easier for you to see them in your console / play with them.
  • To run the program, open index.html in your browser and press "Play". This will execute the code you put in main.js.

    • TIP: Make sure to refresh the page whenever you make changes to your javascript!
    • PRO-TIP: Always have your Chrome Developer Console open (here's how), and make sure to check for error messages!
  • When you've completed a problem, save your work! Copy-paste your entire main function, as well as any variables you've declared above it, into a separate file called solutions.txt. Please record all solutions in a single document. It should look like sample_solutions.txt (but with more solutions, of course).

Inspiration

Adapted from Kyrel.

More information about turing machines:

Possible slides: Kyrel.pdf or: google docs

About

Learn Control Flow with Kyrel

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 87.3%
  • HTML 7.4%
  • CSS 5.3%