feat: add python den game pages

game/models.py

@@ -86,12 +86,12 @@ def difficulty(self):
             7: "medium-hard",
             8: "medium-hard",
             9: "brainteasers",
-            10: "hard",
-            11: "advanced",
-            12: "loops",
-            13: "loops",
-            14: "loops",
-            15: "loops",
+            10: "split-python",
+            11: "split-python",
+            12: "python",
+            13: "python",
+            14: "python",
+            15: "python",
         }
 
         return difficulty_map.get(self.id, "easy")

game/static/game/css/backgrounds.css

@@ -35,3 +35,11 @@
 .bg--loops-coming-soon {
     background-color: #CBCBCB;
 }
+
+.bg--split-python {
+    background-color: #213CE7;
+}
+
+.bg--python {
+    background-color: #152584;
+}

game/static/game/css/game.css

@@ -393,3 +393,32 @@ div > .navigation_button_kurono {
     bottom: 0px;
     background-image : url('/static/game/image/actions/btn_zoom_in.svg');
 }
+
+/**************/
+/* Python den */
+/**************/
+
+.game-header {
+    width: 100%;
+}
+
+.game-background {
+    background-color: #1E30A6;
+}
+
+.header-exit-button {
+    position: absolute;
+    left: 0px;
+    height: 50px;
+    width: 120px;
+    opacity: 0;
+}
+
+::part(editor-root) {
+    height: 1000px;
+}
+
+:root {
+    --rpf-button-primary-background-color: #ffd23b !important;
+    --rpf-button-primary-text-color: black !important;
+}

game/static/game/js/game.js

@@ -877,6 +877,12 @@ ocargo.Game.prototype._setupPythonTab = function () {
     }.bind(this)
   )
 
+  $('#header_exit_button').click(
+    function (e) {
+      window.location.href = RETURN_URL
+    }.bind(this)
+  )
+
   $('#convert_from_blockly').click(
     function (e) {
       ocargo.pythonControl.appendCode(

game/templates/game/game.html

@@ -151,17 +151,29 @@
   <div id='fps' style='font-size: 2em; color: white'></div>
 </div>
 
-<div id="wrapper" class="unselectable">
+<div id="wrapper" class="unselectable game-background">
+  {% if level.pythonViewEnabled or level.pythonEnabled %}
+    <img src="{% static 'game/image/python_den_header.svg' %}" class="game-header">
+    <button class="header-exit-button" id="header_exit_button"></button>
+  {% endif %}
   <span id="game_page"></span>
 
   <div id="tabs" class='no-print bg--{{ level.difficulty }}'>
-    <div id="blockly_tab" class="tab selectable {% if level.blocklyEnabled %}{% else %}hidden{% endif %}">
+    <div id="python_tab" class="tab selectable {% if level.pythonViewEnabled or level.pythonEnabled %}{% else %}hidden{% endif %}">
+      <input type="radio" name="tabs" id="python_radio">
+      <label for="python_radio">
+        <span>{% trans "Python Den" %}</span>
+      </label>
+    </div>
+
+    <div id="blockly_tab" class="tab selectable {% if level.blocklyEnabled and not level.pythonViewEnabled %}{% else %}hidden{% endif %}">
       <input type="radio" name="tabs" id="blockly_radio" checked>
       <label for="blockly_radio">
         <img src="{% static 'game/image/icons/blockly.svg' %}">
         <span>{% trans "Blockly" %}</span>
       </label>
     </div>
+
     <div id="language_tab" class="tab">
       <select name="language_dropdown" class="tab selectable bg--{{level.difficulty}} {% if level.pythonEnabled %}hidden{% endif %}" id="language_dropdown" onchange="gameUpdateBlockLanguageAndCookie(this.value)">
         {% for language_code, language in available_language_dict.items %}
@@ -172,14 +184,6 @@
 
     <div class="tab_break"></div>
 
-    <div id="python_tab" class="tab selectable {% if level.pythonEnabled %}{% else %}hidden{% endif %}">
-      <input type="radio" name="tabs" id="python_radio">
-      <label for="python_radio">
-        <img src="{% static 'game/image/icons/python.svg' %}">
-        <span>{% trans "Python" %}</span>
-      </label>
-    </div>
-
     <div id="clear_tab" class="tab">
       <input type="radio" name="tabs" id="clear_program_radio">
       <label for="clear_program_radio">