feat: add language dropdown

Pipfile

@@ -9,11 +9,13 @@ ipython = "*"
 rapid-router = {path = ".", editable = true}
 
 [dev-packages]
+black = "*"
 codeforlife-portal = "*"
 django-import-export = "*"
 django-selenium-clean = "==1.0.0"
 django-test-migrations = "==1.2.0"
 importlib-metadata = "<5" # Using version 5 causes an issue when trying to run pytest. Not sure why, linked to: https://stackoverflow.com/questions/73929564/entrypoints-object-has-no-attribute-get-digital-ocean
+isort = "*"
 pytest = "==7.*"
 pytest-django = "==4.5.2"
 pytest-order = "*"

game/end_to_end_tests/base_game_test.py

@@ -87,14 +87,12 @@ def go_to_homepage(self):
     def go_to_level(self, level_name):
         path = reverse("play_default_level", kwargs={"levelName": str(level_name)})
         self._go_to_path(path)
-        self.selenium.execute_script("ocargo.animation.FAST_ANIMATION_DURATION = 1;")
 
         return GamePage(self.selenium)
 
     def go_to_custom_level(self, level):
         path = reverse("play_custom_level", kwargs={"levelId": str(level.id)})
         self._go_to_path(path)
-        self.selenium.execute_script("ocargo.animation.FAST_ANIMATION_DURATION = 1;")
 
         return GamePage(self.selenium)
 
@@ -106,7 +104,6 @@ def go_to_level_editor(self):
     def go_to_episode(self, episodeId):
         path = reverse("start_episode", kwargs={"episodeId": str(episodeId)})
         self._go_to_path(path)
-        self.selenium.execute_script("ocargo.animation.FAST_ANIMATION_DURATION = 1;")
 
         return GamePage(self.selenium)
 

game/end_to_end_tests/game_page.py

@@ -19,6 +19,8 @@ class GamePage(BasePage):
     def __init__(self, browser):
         super(GamePage, self).__init__(browser)
 
+        self.browser.execute_script("ocargo.animation.FAST_ANIMATION_DURATION = 1;")
+
         assert self.on_correct_page("game_page")
 
         self._dismiss_initial_dialog()

game/end_to_end_tests/test_language_dropdown.py

@@ -0,0 +1,14 @@
+from game.end_to_end_tests.base_game_test import BaseGameTest
+
+from selenium.webdriver.common.by import By
+
+class TestLanguageDropdown(BaseGameTest):
+    def test_level_language_dropdown(self):
+        page = self.go_to_level(1)
+        assert page.element_exists_by_id("language_dropdown")
+
+        self.selenium.find_element(By.ID, "language_dropdown").click()
+        self.selenium.find_element(By.ID, "language_dropdown_fr").click()
+
+        text_count = len(self.selenium.find_elements(By.XPATH, ("//*[contains(text(),'Move forwards')]")))
+        assert text_count == 0

game/static/game/css/backgrounds.css

@@ -1,37 +1,37 @@
 /* Background colours for episodes and game sidebar */
 
 .bg--easy {
-    background: #86ae18;
+    background-color: #86ae18;
 }
 
 .bg--medium {
-    background: #00a3e0;
+    background-color: #00a3e0;
 }
 
 .bg--medium-hard {
-    background: #008cc1;
+    background-color: #008cc1;
 }
 
 .bg--brainteasers {
-    background: #c90548;
+    background-color: #c90548;
 }
 
 .bg--hard {
-    background: #8967d3;
+    background-color: #8967d3;
 }
 
 .bg--advanced {
-    background: #754fc8;
+    background-color: #754fc8;
 }
 
 .bg--shared-levels {
-    background: #f6be00;
+    background-color: #f6be00;
 }
 
 .bg--loops {
-    background: #3F3F3F;
+    background-color: #3F3F3F;
 }
 
 .bg--loops-coming-soon {
-    background: #CBCBCB;
+    background-color: #CBCBCB;
 }

game/static/game/css/game_screen.css

@@ -430,6 +430,16 @@ div.no-print div.tab label {
   background: rgba(255, 255, 255, 0.25);
 }
 
+.tab select:hover {
+  background: rgba(255, 255, 255, 0.25);
+}
+
+.tab select {
+  color: black;
+  border: none;
+  font-weight: bold;
+}
+
 #console {
   z-index: 100;
   display: flex;

game/static/game/js/blockly/msg/js/en-gb.js

@@ -433,4 +433,53 @@ Blockly.Msg["VARIABLES_HUE"] = "330";
 Blockly.Msg["TEXTS_HUE"] = "160";
 Blockly.Msg["PROCEDURES_HUE"] = "290";
 Blockly.Msg["COLOUR_HUE"] = "20";
-Blockly.Msg["VARIABLES_DYNAMIC_HUE"] = "310";
+Blockly.Msg["VARIABLES_DYNAMIC_HUE"] = "310";
+
+Blockly.Msg["START_TITLE"] = "Start";
+Blockly.Msg["START_TOOLTIP"] = "The beginning of the program"
+Blockly.Msg["MOVE_FORWARDS_TITLE"] = "move forwards";
+Blockly.Msg["MOVE_FORWARDS_TOOLTIP"] = "Move the van forwards";
+Blockly.Msg["TURN_LEFT_TITLE"] = "turn left";
+Blockly.Msg["TURN_LEFT_TOOLTIP"] = "Turn the van left";
+Blockly.Msg["TURN_RIGHT_TITLE"] = "turn right";
+Blockly.Msg["TURN_RIGHT_TOOLTIP"] = "Turn the van right";
+Blockly.Msg["TURN_AROUND_TITLE"] = "turn around";
+Blockly.Msg["TURN_AROUND_TOOLTIP"] = "Turn the van around";
+
+Blockly.Msg["WAIT_TITLE"] = "wait";
+Blockly.Msg["WAIT_TOOLTIP"] = "Keep the van stationary";
+Blockly.Msg["DELIVER_TITLE"] = "deliver";
+Blockly.Msg["DELIVER_TOOLTIP"] = "Deliver the goods from the van";
+Blockly.Msg["SOUND_HORN_TITLE"] = "sound horn";
+Blockly.Msg["SOUND_HORN_TOOLTIP"] = "Sound the horn to scare away the cows";
+
+Blockly.Msg["ROAD_EXISTS_FORWARD_TITLE"] = "road exists forward";
+Blockly.Msg["ROAD_EXISTS_LEFT_TITLE"] = "road exists left";
+Blockly.Msg["ROAD_EXISTS_RIGHT_TITLE"] = "road exists right";
+Blockly.Msg["TRAFFIC_LIGHT_RED_TITLE"] = "traffic light red";
+Blockly.Msg["TRAFFIC_LIGHT_GREEN_TITLE"] = "traffic light green";
+Blockly.Msg["DEAD_END_TITLE"] = "is dead end";
+Blockly.Msg["AT_DESTINATION_TITLE"] = "at destination";
+Blockly.Msg["COW_CROSSING_TITLE"] = "cows";
+
+Blockly.Msg["CALL_PROC_TITLE"] = "Call";
+Blockly.Msg["CALL_PROC_TOOLTIP"] = "Calls a procedure";
+Blockly.Msg["DECLARE_PROC_TITLE"] = "Define";
+Blockly.Msg["DECLARE_PROC_TOOLTIP"] = "Declares a procedure";
+Blockly.Msg["CONTROLS_REPEAT_WHILE_TITLE"] = "repeat while";
+Blockly.Msg["CONTROLS_REPEAT_WHILE_SUBTITLE"] = "do";
+Blockly.Msg["CONTROLS_REPEAT_WHILE_TOOLTIP"] = "While a value is true, do some statements";
+Blockly.Msg["CONTROLS_REPEAT_UNTIL_TITLE"] = "repeat until";
+Blockly.Msg["CONTROLS_REPEAT_UNTIL_SUBTITLE"] = "do";
+Blockly.Msg["CONTROLS_REPEAT_UNTIL_TOOLTIP"] = "Until a value is true, do some statements";
+
+Blockly.Msg["VARIABLES_GET_TOOLTIP"] = "A variable";
+Blockly.Msg["VARIABLES_SET_TITLE"] = "set";
+Blockly.Msg["VARIABLES_SET_SUBTITLE"] = "to";
+Blockly.Msg["VARIABLES_SET_TOOLTIP"] = "Set a variable";
+Blockly.Msg["VARIABLES_NUMERIC_SET_TOOLTIP"] = "Set a variable to a number";
+Blockly.Msg["VARIABLES_INCREMENT_TITLE"] = "increment";
+Blockly.Msg["VARIABLES_INCREMENT_SUBTITLE"] = "by";
+Blockly.Msg["VARIABLES_INCREMENT_TOOLTIP"] = "Increment a variable";
+Blockly.Msg["NUMBER_TITLE"] = "Number";
+Blockly.Msg["NUMBER_TOOLTIP"] = "A number";