cra16/cake-core

View on GitHub
blockly/apps/maze/template.soy

Summary

Maintainability
Test Coverage
{namespace mazepage}

/**
 * This is a Closure Template.
 *
 * To regenerate just en.js, run this command:
 * java -jar ../_soy/SoyToJsSrcCompiler.jar --outputPathFormat generated/en.js --srcs ../common.soy,template.soy
 *
 * To regenerate all files, see: trunk/apps/common.soy
 */

/**
 * Translated messages for use in JavaScript.
 */
{template .messages}
  {call apps.messages /}
  <div style="display: none">
    <span id="Maze_moveForward">{msg meaning="Maze.moveForward" desc="block text - Imperative or infinitive of a verb for a person moving (walking) in the direction he/she is facing."}move forward{/msg}</span>
    <span id="Maze_turnLeft">{msg meaning="Maze.turnLeft" desc="[[Translating:Blockly#Drop-Down_Menus dropdown]] - Imperative or infinitive of a verb for a person turning his head and body one quarter rotation counter-clockwise.  Prefer a translation that has text in common with the translation of 'turn right'.  See [[Translating:Blockly#Drop-Down_Menus]]."}turn left{/msg}</span>
    <span id="Maze_turnRight">{msg meaning="Maze.turnRight" desc="[[Translating:Blockly#Drop-Down_Menus dropdown]] - Imperative or infinitive of a verb for a person turning his head and body one quarter rotation clockwise.  Prefer a translation that has text in common with the translation of 'turn left'.  See [[Translating:Blockly#Drop-Down_Menus]]."}turn right{/msg}</span>
    <span id="Maze_doCode">{msg meaning="Maze.doCode" desc="block text - Imperative or infinitive of a verb preceding one or more commands to a person.  This is part of [https://code.google.com/p/blockly/wiki/Loops#repeat repeat] and [https://code.google.com/p/blockly/wiki/IfElse#If_blocks if] blocks."}do{/msg}</span>
    <span id="Maze_elseCode">{msg meaning="Maze.elseCode" desc="block text - Conjunction meaning 'otherwise', introducing commands to be performed if a previous condition was not true, as in 'if x>3, do this, else do that'.  See [https://code.google.com/p/blockly/wiki/IfElse#If-Else_blocks]."}else{/msg}</span>
    // This definition was copied up here ahead of when it is needed so that it is adjacent
    // to the previous definition.
    <span id="Maze_helpIfElse">{msg meaning="Maze.helpIfElse" desc="callout - This is shown when the 'if-else' block is introduced.  For 'if-else' concatenate the words for 'if' and 'else/otherwise'."}If-else blocks will do one thing or the other.{/msg}</span>
    <span id="Maze_pathAhead">{msg meaning="Maze.pathAhead" desc="[[Translating:Blockly#Drop-Down_Menus dropdown]] - Condensed form of 'if there is a path ahead', as in: 'if path ahead, go forward'.  Prefer translation that has text in common with 'if path to the left' and 'if path to the right'."}if path ahead{/msg}</span>
    <span id="Maze_pathLeft">{msg meaning="Maze.pathLeft" desc="[[Translating:Blockly#Drop-Down_Menus dropdown]] - Condensed form of 'if there is a path to the left', as in: 'if path to the left, turn left'."}if path to the left{/msg}</span>
    <span id="Maze_pathRight">{msg meaning="Maze.pathRight" desc="[[Translating:Blockly#Drop-Down_Menus dropdown]] - Condensed form of 'if there is a path to the right', as in: 'if path to the right, turn right'."}if path to the right{/msg}</span>
    <span id="Maze_repeatUntil">{{msg meaning="Maze.repeatUntil" desc="block text - Imperative or infinitive of a verb to repeat the following commands.  The phrase is followed by the symbol denoting the end of the maze.\n\nSee also:\n* {lb}{lb}msg-blockly|Maze.helpRepeatMany{rb}{rb}."}}repeat until{{/msg}}</span>
    <span id="Maze_moveForwardTooltip">{msg meaning="Maze.moveForwardTooltip" desc="tooltip - Moves the icon on the screen representing the player forward one square on the maze board."}Moves the player forward one space.{/msg}</span>
    <span id="Maze_turnTooltip">{msg meaning="Maze.turnTooltip" desc="tooltip - Turns the icon on the screen representing the player 90 degrees counter-clockwise (left) or clockwise (right)."}Turns the player left or right by 90 degrees.{/msg}</span>
    <span id="Maze_ifTooltip">{msg meaning="Maze.ifTooltip" desc="tooltip - 'path' refers to a path through a maze."}If there is a path in the specified direction, then do some actions.{/msg}</span>
    <span id="Maze_ifelseTooltip">{msg meaning="Maze.ifelseTooltip" desc="tooltip - 'path' refers to a path through a maze."}If there is a path in the specified direction, then do the first block of actions.  Otherwise, do the second block of actions.{/msg}</span>
    <span id="Maze_whileTooltip">{msg meaning="Maze.whileTooltip" desc="tooltip - Repeat the enclosed commands until the maze has been successfully completed (the end point reached)."}Repeat the enclosed actions until finish point is reached.{/msg}</span>
    <span id="Maze_capacity0">{msg meaning="Maze.capacity0" desc="warning - No more blocks may be added until some are removed.  Please include '%0' in the translated string.  It will be replaced with '0' and made bold."}You have %0 blocks left.{/msg}</span>
    <span id="Maze_capacity1">{{msg meaning="Maze.capacity1" desc="warning - Only one more block may be added.  Please include '%1' in the translated string. It will be replaced with '1' and made bold.\n\nSee also:\n* {lb}{lb}msg-blockly|Maze.capacity2{rb}{rb}"}}You have %1 block left.{{/msg}}</span>
    <span id="Maze_capacity2">{{msg meaning="Maze.capacity2" desc="warning - Only %2 more blocks may be used, where %2 is an integer greater than 1.\n\nSee also:\n* {lb}{lb}msg-blockly|Maze.capacity1{rb}{rb}"}}You have %2 blocks left.{{/msg}}</span>
    <span id="Maze_nextLevel">{msg meaning="Maze.nextLevel" desc="alert - This is displayed when the user solves the maze, inviting them to precede to the next level of difficulty.\n\nParameters:\n* %1 - the number of the next level, which is always an integer greater than 1."}Congratulations! Are you ready to proceed to level %1?{/msg}</span>
    <span id="Maze_finalLevel">{msg meaning="Maze.finalLevel" desc="alert - This is displayed when the user solves the most difficult level."}Congratulations! You have solved the final level.{/msg}</span>
  </div>
{/template}

/**
 * Web page structure.
 */
{template .start}
  {call .messages /}
  <table width="100%">
    <tr>
      <td>
        <h1>
          <span id="title">
            <a href="../index.html?lang={$ij.lang}">{msg meaning="Apps.blocklyMessage" desc="IBID"}Blockly{/msg}</a>
            {sp}:{sp}
            {msg meaning="Maze.maze" desc="title - Specifies that this is Blockly's '''Maze''' tutorial."}
              Maze
            {/msg}
          </span>
          {sp}&nbsp;{sp}
          {for $i in range(1, $ij.maxLevel + 1)}
            {sp}
            {if $i == $ij.level}
              <span class="tab" id="selected">{$i}</span>
            {else}
              {if $i < $ij.level}
                <a class="tab previous" href="?lang={$ij.lang}&level={$i}&skin={$ij.skin}">{$i}</a>
              {else}
                <a class="tab" href="?lang={$ij.lang}&level={$i}&skin={$ij.skin}">{$i}</a>
              {/if}
            {/if}
          {/for}
        </h1>
      </td>
      <td class="farSide">
        <select id="languageMenu"></select>
        {sp}&nbsp;{sp}
        <button id="pegmanButton">
          <img src="../../media/1x1.gif">
          <span>&#x25BE;</span>
        </button>
      </td>
    </tr>
  </table>

  <div id="visualization">
    <svg xmlns="http://www.w3.org/2000/svg" version="1.1" id="svgMaze" width="400px" height="400px">
      <g id="look">
        <path d="M 0,-15 a 15 15 0 0 1 15 15" />
        <path d="M 0,-35 a 35 35 0 0 1 35 35" />
        <path d="M 0,-55 a 55 55 0 0 1 55 55" />
      </g>
    </svg>
    <div id="capacityBubble">
      <div id="capacity"></div>
    </div>
  </div>

  <table width="400">
    <tr>
      <td style="width: 190px; text-align: center; vertical-align: top;">
        <button id="codeButton" class="notext" title="{msg meaning="Apps.codeTooltip" desc="tooltip (pop-up help) for button; pressing the button causes a program in the JavaScript computer language to be displayed, based on the program created by the user."}See generated JavaScript code.{/msg}">
          <img src="../../media/1x1.gif" class="code icon21">
        </button>
        <button id="linkButton" class="notext" title="{msg meaning="Apps.linkTooltip" desc="IBID"}Save and link to blocks.{/msg}">
          <img src="../../media/1x1.gif" class="link icon21">
        </button>
      </td>
      <td>
        <button id="runButton" class="primary" title="{msg meaning="Maze.runTooltip" desc="tooltip - Pressing this button runs the computer program the user has written to move the player through the maze."}Makes the player do what the blocks say.{/msg}">
          <img src="../../media/1x1.gif" class="run icon21"> {msg meaning="Apps.runProgram" desc="IBID"}Run Program{/msg}
        </button>
        <button id="resetButton" class="primary" style="display: none" title="{msg meaning="Maze.resetTooltip" desc="tooltip - Pressing this button restores the player to the start position and enables the user's program to be run again."}Put the player back at the start of the maze.{/msg}">
          <img src="../../media/1x1.gif" class="stop icon21"> {msg meaning="Apps.resetProgram" desc="IBID"}Reset{/msg}
        </button>
      </td>
    </tr>
  </table>

  <script type="text/javascript" src="../../blockly_compressed.js"></script>
  <script type="text/javascript" src="../../javascript_compressed.js"></script>
  <script type="text/javascript" src="../../{$ij.langSrc}"></script>
  <script type="text/javascript" src="blocks.js"></script>
  {call .toolbox /}
  <div id="blockly"></div>

  <div id="pegmanMenu"></div>

  {call apps.dialog /}
  {call apps.codeDialog /}
  {call apps.storageDialog /}
  <div id="dialogDone" class="dialogHiddenContent">
    <div id="dialogDoneText" style="font-size: large; margin: 1em;"></div>
    <img src="../../media/1x1.gif" id="pegSpin">
    <div id="dialogDoneButtons" class="farSide" style="padding: 1ex 3ex 0"></div>
  </div>
  <div id="dialogHelpStack" class="dialogHiddenContent">
    <table><tr><td>
      <img src="help.png">
    </td><td>&nbsp;</td><td>
      {{msg meaning="Maze.helpStack" desc="callout - The words for 'stack' and 'blocks' should be the same as for stacking children's blocks. Use the imperative verb form appropriate for speaking to a child, gender unspecified.  If no gender-neutral singular/familiar form exists but a gender-neutral plural/formal form exists, use that instead.  Be sure to use the same translation of 'move forward' as above.\n\n'move forward' refers to {lb}{lb}msg-blockly|Maze.moveForward{rb}{rb}."}}Stack a couple of 'move forward' blocks together to help me reach the goal.{{/msg}}
    </td><td valign="top">
      <img src="help_stack.png" class="mirrorImg" height=63 width=136>
    </td></tr></table>
  </div>
  <div id="dialogHelpOneTopBlock" class="dialogHiddenContent">
    <table><tr><td>
      <img src="help.png">
    </td><td>&nbsp;</td><td>
      {msg meaning="Maze.helpOneTopBlock" desc="callout - This is displayed if a user attempts to run a program composed of multiple stacks of blocks, letting them know they need to create a single stack."}On this level, you need to stack together all of the blocks in the white workspace.{/msg}
      <iframe id="iframeOneTopBlock" src=""></iframe>
    </td></tr></table>
  </div>
  <div id="dialogHelpRun" class="dialogHiddenContent">
    <table><tr><td>
      {msg meaning="Maze.helpRun" desc="callout - This is shown after the user has created a program on the first level."}Run your program to see what happens.{/msg}
    </td><td rowspan=2>
      <img src="help.png">
    </td></tr><tr><td>
      <div><img src="help_run.png" class="mirrorImg" height=27 width=141></div>
    </td></tr></table>
  </div>
  <div id="dialogHelpReset" class="dialogHiddenContent">
    <table><tr><td>
      {{msg meaning="Maze.helpReset" desc="callout - This is shown after the user has run a program that does not solve the maze.\n\n'Reset' refers to {lb}{lb}msg-blockly|Apps.resetProgram{rb}{rb}."}}Your program didn't solve the maze.  Press 'Reset' and try again.{{/msg}}
    </td><td rowspan=2>
      <img src="help.png">
    </td></tr><tr><td>
      <div><img src="help_run.png" class="mirrorImg" height=27 width=141></div>
    </td></tr></table>
  </div>
  <div id="dialogHelpRepeat" class="dialogHiddenContent">
    <table><tr><td>
      <img src="help_up.png">
    </td><td>
      {msg meaning="Maze.helpRepeat" desc="callout - This is shown when the 'repeat' block is introduced.  The word 'path' refers to a path through a maze, and 'block' refers to a child's building block."}Reach the end of this path using only two blocks.  Use 'repeat' to run a block more than once.{/msg}
    </td><td>
      <img src="help.png">
    </td></tr></table>
  </div>
  <div id="dialogHelpCapacity" class="dialogHiddenContent">
    <table><tr><td>
      <img src="help.png">
    </td><td>&nbsp;</td><td>
      {msg meaning="Maze.helpCapacity" desc="callout - This is shown after the user has used all the blocks permitted on this level."}You have used up all the blocks for this level.  To create a new block, you first need to delete an existing block.{/msg}
    </td></tr></table>
  </div>
  <div id="dialogHelpRepeatMany" class="dialogHiddenContent">
    <table><tr><td>
      <img src="help_up.png">
    </td><td>
      {{msg meaning="Maze.helpRepeatMany" desc="callout - This is a hint that the user should place a second block inside of a 'repeat' block.\n\n'repeat' should be consistent with {lb}{lb}msg-blockly|Maze.repeatUntil{rb}{rb}."}}You can fit more than one block inside a 'repeat' block.{{/msg}}
    </td><td>
      <img src="help.png">
    </td></tr></table>
  </div>
  <div id="dialogHelpSkins" class="dialogHiddenContent">
    <table><tr><td>
      <img src="help.png">
    </td><td>
      {{msg meaning="Maze.helpSkins" desc="callout - This is a hint that the user can change the appearance of the player that moves within the maze."}}Choose your favourite player from this menu.{{/msg}}
    </td><td>
      <img src="help_up.png">
    </td></tr></table>
  </div>
  <div id="dialogHelpIf" class="dialogHiddenContent">
    <table><tr><td>
      <img src="help_up.png">
    </td><td>
      {msg meaning="Maze.helpIf" desc="callout - This is shown when the 'if' block is introduced.  An example of an 'if' block is: 'if there is a path to the left, turn left'."}An 'if' block will do something only if the condition is true.  Try turning left if there is a path to the left.{/msg}
    </td><td>
      <img src="help.png">
    </td></tr></table>
  </div>
  <div id="dialogHelpMenu" class="dialogHiddenContent">
    <table><tr><td>
      <img src="help_up.png">
    </td><td id="helpMenuText">
      {msg meaning="Maze.helpMenu" desc="callout - %1 will be replaced with an image of the dropdown menu that the user needs to click."}Click on %1 in the 'if' block to change its condition.{/msg}
    </td><td>
      <img src="help.png">
    </td></tr></table>
  </div>
  <div id="dialogHelpIfElse" class="dialogHiddenContent">
    <table><tr><td>
      <img src="help_down.png">
    </td><td>
      {msg meaning="Maze.helpIfElse" desc="IBID"}If-else blocks will do one thing or the other.{/msg}
    </td><td>
      <img src="help.png">
    </td></tr></table>
  </div>
  <div id="dialogHelpWallFollow" class="dialogHiddenContent">
    <table><tr><td>
      <img src="help.png">
    </td><td>&nbsp;</td><td>
      {msg meaning="Maze.helpWallFollow" desc="callout - This advises the user to solve a maze by keeping his/her left hand in contact with the wall while proceding through it.  The final sentence is a warning that only advanced programmers should attempt this problem, as beginners tend to get frustrated."}Can you solve this complicated maze?  Try following the left-hand wall.  Advanced programmers only!{/msg}
      {call apps.ok /}
    </td></tr></table>
  </div>
{/template}

/**
 * Toolboxes for each level.
 */
{template .toolbox}
  <xml id="toolbox" style="display: none;">
    <block type="maze_moveForward"></block>
    <block type="maze_turn"><field name="DIR">turnLeft</field></block>
    <block type="maze_turn"><field name="DIR">turnRight</field></block>
    {if $ij.level > 2}
      <block type="maze_forever"></block>
      {if $ij.level == 6}
        <block type="maze_if"><field name="DIR">isPathLeft</field></block>
      {elseif $ij.level > 6}
        <block type="maze_if"></block>
        {if $ij.level > 8}
          <block type="maze_ifElse"></block>
        {/if}
      {/if}
    {/if}
  </xml>
{/template}

/**
 * Readonly Blockly in an iframe.
 */
{template .readonly}
  {call .messages /}

  <script type="text/javascript" src="../../blockly_compressed.js"></script>
  <script type="text/javascript">Blockly.JavaScript = {lb}{rb};</script>
  <script type="text/javascript" src="../../{$ij.langSrc}"></script>
  <script type="text/javascript" src="blocks.js"></script>
  <div id="blockly"></div>
{/template}