Add weekly contests, bump to 1.1.5

src/css/ingame_hud/dialogs.scss

@@ -118,7 +118,7 @@
             pointer-events: all;
             @include S(width, 350px);
 
-            > strong {
+            strong {
                 font-weight: bold;
             }
 
@@ -139,6 +139,14 @@
                     background-color: rgb(250, 206, 206);
                 }
             }
+
+            ul.bucketList {
+                padding-left: 30px;
+
+                li {
+                    display: list-item;
+                }
+            }
         }
 
         > .buttons {

src/css/states/main_menu.scss

@@ -60,28 +60,17 @@
 
     .mainWrapper {
         @include S(padding, 0, 10px);
-        align-items: center;
+        align-items: start;
         justify-items: center;
 
-        &.noDemo {
-            display: flex;
-            flex-direction: column;
-            align-items: center;
-            justify-content: center;
-        }
-
-        &.demo {
-            @include S(grid-column-gap, 10px);
-            display: grid;
-            grid-template-columns: 1fr 1fr;
-        }
+        @include S(grid-column-gap, 10px);
+        display: grid;
+        grid-template-columns: 1fr 1fr;
 
         .standaloneBanner {
             background: rgb(255, 234, 245);
             @include S(border-radius, $globalBorderRadius);
-            height: 100%;
             box-sizing: border-box;
-            @include S(width, 300px);
             @include S(padding, 15px);
 
             display: flex;
@@ -165,6 +154,44 @@
         border: #{D(2px)} solid rgba(0, 10, 20, 0.1);
     }
 
+    .sideContainer {
+        display: flex;
+        flex-direction: column;
+        @include S(width, 300px);
+
+        .standaloneBanner {
+            flex-grow: 1;
+            @include S(margin-bottom, 10px);
+        }
+
+        .contest {
+            flex-grow: 1;
+            background: rgb(32, 187, 166);
+            @include S(padding, 15px);
+
+            h3 {
+                @include Heading;
+                color: #fff;
+                font-weight: bold;
+                text-transform: uppercase;
+                @include S(margin-bottom, 5px);
+            }
+            p {
+                color: #fff;
+                @include Text;
+                strong {
+                    font-weight: bold;
+                }
+                @include S(margin-bottom, 5px);
+            }
+
+            button {
+                background: #fff;
+                color: #333538;
+            }
+        }
+    }
+
     .mainContainer {
         display: flex;
         align-items: center;

src/js/changelog.js

@@ -1,4 +1,9 @@
 export const CHANGELOG = [
+    {
+        version: "1.1.5",
+        date: "03.06.2020",
+        entries: ["Added weekly contests!"],
+    },
     {
         version: "1.1.4",
         date: "01.06.2020",

src/js/core/config.js

@@ -83,7 +83,7 @@ export const globalConfig = {
 
     debug: {
         /* dev:start */
-        fastGameEnter: true,
+        // fastGameEnter: true,
         // noArtificialDelays: true,
         // disableSavegameWrite: true,
         // showEntityBounds: true,

src/js/states/main_menu.js

@@ -24,10 +24,6 @@ export class MainMenuState extends GameState {
             
             <p>${T.demoBanners.intro}</p>
 
-            <ul>
-                ${T.demoBanners.advantages.map(advantage => `<li>${advantage}</li>`).join("")}
-            </ul>
-
             <a href="#" class="steamLink" target="_blank">Get the shapez.io standalone!</a>
         `;
 
@@ -54,18 +50,22 @@ export class MainMenuState extends GameState {
 
             <div class="logo">
                 <img src="${cachebust("res/logo.png")}" alt="shapez.io Logo">
-                ${
-                    IS_DEMO && this.app.platformWrapper.getShowDemoBadges()
-                        ? `<div class="demoBadge"></div>`
-                        : ""
-                }
             </div>
 
 
             <div class="mainWrapper ${IS_DEMO ? "demo" : "noDemo"}">
-            
-                ${IS_DEMO ? `<div class="standaloneBanner">${bannerHtml}</div>` : ""}    
                 
+                <div class="sideContainer">
+                    ${IS_DEMO ? `<div class="standaloneBanner">${bannerHtml}</div>` : ""}    
+                    <div class="contest">
+                        <h3>${T.mainMenu.contests.contest_01_03062020.title}</h3>
+                        <p>${T.mainMenu.contests.contest_01_03062020.desc}</p>
+                        <button class="styledButton participateContest">${
+                            T.mainMenu.contests.showInfo
+                        }</button>
+                    </div>
+                </div>
+
                 <div class="mainContainer">
                     ${
                         isSupportedBrowser()
@@ -220,6 +220,8 @@ export class MainMenuState extends GameState {
         this.trackClicks(qs(".settingsButton"), this.onSettingsButtonClicked);
         this.trackClicks(qs(".changelog"), this.onChangelogClicked);
 
+        this.trackClicks(qs(".participateContest"), this.onContestClicked);
+
         if (G_IS_STANDALONE) {
             this.trackClicks(qs(".exitAppButton"), this.onExitAppButtonClicked);
         }
@@ -267,6 +269,15 @@ export class MainMenuState extends GameState {
         this.moveToState("ChangelogState");
     }
 
+    onContestClicked() {
+        this.app.analytics.trackUiClick("contest_click");
+
+        this.dialogs.showInfo(
+            T.mainMenu.contests.contest_01_03062020.title,
+            T.mainMenu.contests.contest_01_03062020.longDesc
+        );
+    }
+
     renderSavegames() {
         const oldContainer = this.htmlElement.querySelector(".mainContainer .savegames");
         if (oldContainer) {