index.html 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145
  1. <!DOCTYPE html>
  2. <!-- LInE - Free Education, Private Data - http://www.usp.br/line -->
  3. <html lang="pt-br">
  4. <head>
  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6. <meta name="viewport" content="width=device-width, initial-scale=1">
  7. <meta name="description" content="Educational game for teaching fractions" />
  8. <meta name="keywords" content="ifractions, fraction, game, private data" />
  9. <link rel="shortcut icon" href="./assets/img/scene/flag.png">
  10. <link rel="stylesheet" href="./style/bootstrap/bootstrap.min.css">
  11. <link rel="stylesheet" href="./style/IFractions.css">
  12. <title>iFractions/iFra&ccedil;&otilde;es</title>
  13. </head>
  14. <body>
  15. <div class="container">
  16. <div class="panel panel-primary">
  17. <div class="panel-heading">iFractions game :: by LInE</div>
  18. <div class="panel-body">
  19. <canvas class="ifr-canvas"></canvas>
  20. <div class="ifr-input__container">
  21. <input class="ifr-input" type="text" value="" size="13" maxlength="36">
  22. </div>
  23. <div class="ifr-modal">
  24. <div class="ifr-modal__content">
  25. <span class="ifr-modal__closeButton">&times;</span>
  26. <div class='ifr-modal__infobox'></div>
  27. </div>
  28. </div>
  29. </div>
  30. </div>
  31. <!-- Load all js files -->
  32. <script src="./js/menus/preMenu_boot.js"></script>
  33. <script src="./js/menus/preMenu_lang.js"></script>
  34. <script src="./js/menus/preMenu_name.js"></script>
  35. <script src="./js/menus/menu_main.js"></script>
  36. <script src="./js/menus/menu_custom.js"></script>
  37. <script src="./js/screens/map.js"></script>
  38. <script src="./js/screens/end.js"></script>
  39. <script src="./js/games/circleOne.js"></script>
  40. <script src="./js/games/squareOne.js"></script>
  41. <script src="./js/games/squareTwo.js"></script>
  42. <!-- <script src="./js/games/scaleOne.js"></script> -->
  43. <script src="./js/moodle/studentReport.js"></script> <!-- FOR MOODLE -->
  44. <script src="./js/moodle/integrationFunctions.js"></script> <!-- FOR MOODLE -->
  45. <script src="./js/gameMechanics.js"></script>
  46. <script src="./js/globals/globals_control.js"></script>
  47. <script src="./js/globals/globals_tokens.js"></script>
  48. <script src="./js/globals/globals_functions.js"></script>
  49. <script src="./js/globals/globals_debug.js"></script>
  50. <script>
  51. const defaultWidth = 1920; // Default width for the Canvas
  52. const defaultHeight = 1080; // Default height for the Canvas
  53. const context = document.querySelector('.ifr-canvas').getContext("2d");
  54. context.canvas.width = defaultWidth;
  55. context.canvas.height = defaultHeight;
  56. // CREATING GAME STATES
  57. game.state.add('boot', bootState);
  58. game.state.add('lang', langState);
  59. game.state.add('loadLang', loadLangState);
  60. game.state.add('name', nameState);
  61. game.state.add('menu', menuState);
  62. game.state.add('customMenu', customMenuState);
  63. game.state.add('map', mapState);
  64. game.state.add('end', endState);
  65. game.state.add('squareOne', squareOne);
  66. game.state.add('circleOne', circleOne);
  67. game.state.add('squareTwo', squareTwo);
  68. // game.state.add('scaleOne', scaleOne);
  69. game.state.add('studentReport', studentReport); // FOR MOODLE
  70. // CALLING FIRST GAME STATE
  71. game.state.start('boot');
  72. </script>
  73. <div class="panel panel-info">
  74. <div class="panel-heading">🇺🇸&nbsp;&nbsp;More information about the iFractions Project</div>
  75. <div class="panel-body">
  76. <ul>
  77. <li>Free software to promote learning with private data!</li>
  78. <li>Developed by
  79. <a href="https://www.usp.br/line" class="ref2" title="LInE's web page" target="_blank">Laboratory of
  80. Informatics in Education</a>.
  81. </li>
  82. <li>For more information about mini-games to introduce fractions see the <a href="about/"
  83. title="see documentation">iFractions documentation</a>.
  84. </li>
  85. <li>If you are a developer interested in colaborating with the project, see the <a
  86. href="about/paginas/documentacao.html#sou-dev" title="see documentation to developers">Development
  87. section</a> of the documentation.
  88. </li>
  89. </ul>
  90. <!-- img src="img/mini_games_1.png" width="200" title="several mini-games" / -->
  91. <!-- <a href="ifractions_www.tgz" title="download to use in your computer, school...">download</a> -->
  92. </div>
  93. </div>
  94. <div class="panel panel-info">
  95. <div class="panel-heading">🇧🇷&nbsp;&nbsp;Mais informações sobre o Projeto iFrações</div>
  96. <div class="panel-body">
  97. <ul>
  98. <li><em>Software</em> livre para promover aprendizado mantendo dados privativo!</li>
  99. <li>Desenvolvido pelo
  100. <a href="https://www.usp.br/line" class="ref2" title="Página web do LInE" target="_blank">Laboratorio de
  101. Informática na Educação</a>.
  102. </li>
  103. <li>Para mais informações sobre mini-jogos para
  104. introduzir
  105. frações veja a <a href="about/" title="see documentation">documentação do iFrações</a>.</li>
  106. <li>Se você é um programador interessado em colaborar com o projeto, veja a <a
  107. href="about/paginas/documentacao.html#sou-dev" title="veja documentação para desenvolvedores">sessão de
  108. desenvolvimento</a> da documentação.
  109. </li>
  110. </ul>
  111. <!-- img src="img/mini_games_1.png" width="200" title="several mini-games" / -->
  112. </div>
  113. </div>
  114. </div>
  115. </body>
  116. </html>