bugfix #30 && random bg in game

src/Jotunheimr/UserBundle/Resources/public/css/layout.css

@@ -62,7 +62,7 @@ header section .input-submit button {
     width: 500px;
     border: 1px solid #658fb8;
     color: #FFFFFF;
-    padding: 25px 100px;
+    padding: 25px 150px;
     margin-top: 20px;
 
     -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
@@ -106,19 +106,19 @@ header section h3.or {
     margin: 20px 0;
 }
 
-header section .fb,
+header section .buttons,
 header section form {
     z-index: 2;
 }
 
-header section a.fb-login {
-    background: #5975b1;
+header section a.fb-login,
+header section a.slack-login {
     position: relative;
     display: block;
     width: 500px;
     height: 93px;
-    border: 1px solid #50649f;
-    margin: 0;
+    padding: 25px 0 25px 150px;
+    margin-bottom: 10px;
 
     overflow: hidden;
 
@@ -128,22 +128,43 @@ header section a.fb-login {
     box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
 }
 
-header section a.fb-login:hover {
-    background: #42598c;
-    color: #FFFFFF;
+header section a.fb-login:hover,
+header section a.slack-login:hover {
     text-decoration: none;
 
     -webkit-box-shadow: 0 7px 10px rgba(0, 0, 0, 0.1);
     box-shadow: 0 7px 10px rgba(0, 0, 0, 0.1);
 }
 
-header section a.fb-login i {
+header section a.fb-login i,
+header section a.slack-login i {
     position: absolute;
     font-size: 130px;
     top: 0;
     left: 15px;
 }
 
+header section a.fb-login {
+    background: #5975b1;
+    border: 1px solid #50649f;
+}
+
+header section a.fb-login:hover {
+    background: #42598c;
+    color: #FFFFFF;
+}
+
+header section a.slack-login {
+    background: #FFFFFF;
+    border: 1px solid #5c3a58;
+    color: #5c3a58;
+}
+
+header section a.slack-login:hover {
+    background: #e6e6e6;
+    color: #5c3a58;
+}
+
 @media screen and (max-width: 1100px) {
     header section .form-input,
     header section .form-check {

src/Jotunheimr/UserBundle/Resources/views/Registration/register.html.twig

@@ -40,8 +40,12 @@
             </form>
         </div>
         <h3 class="or">vagy regisztrálj <u>egy</u> kattintással</h3>
-        <div class="fb">
+        <div class="buttons">
             {% include('@JotunheimrUser/Social/facebook.html.twig') %}
+            {#<a class="slack-login"#}
+            {#href="https://slack.com/oauth/authorize?scope=identity.basic,identity.email,identity.team,identity.avatar&client_id=107639806167.106953365090&redirect_uri=http://mine.dev">#}
+            {#<i class="fa fa-slack"></i><span>w/ Slack</span>#}
+            {#</a>#}
         </div>
         <img src="{{ asset('bundles/mineseeker/images/mine-logo-logo.png') }}" alt="MineSeeker Logo" border="0"/>
     </section>

src/Jotunheimr/UserBundle/Resources/views/Security/login.html.twig

@@ -37,8 +37,12 @@
             </div>
         </form>
         <h3 class="or">vagy jelentkezz be <u>egy</u> kattintással</h3>
-        <div class="fb">
+        <div class="buttons">
             {% include('@JotunheimrUser/Social/facebook.html.twig') %}
+            {#<a class="slack-login"#}
+            {#href="https://slack.com/oauth/authorize?scope=identity.basic,identity.email,identity.team,identity.avatar&client_id=107639806167.106953365090&redirect_uri=http://mine.dev">#}
+            {#<i class="fa fa-slack"></i><span>w/ Slack</span>#}
+            {#</a>#}
         </div>
         <img src="{{ asset('bundles/mineseeker/images/mine-logo-logo.png') }}" alt="MineSeeker Logo" border="0"/>
     </section>

src/Mine/SeekerBundle/Resources/public/css/style.homepage.css

@@ -81,8 +81,8 @@ header section div > a {
     text-decoration: none;
     border: 1px solid #658fb8;
     color: #FFFFFF;
-    padding: 25px 100px;
-    margin-top: 20px;
+    padding: 25px 150px;
+    margin-bottom: 20px;
 
     -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
     box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);

src/Mine/SeekerBundle/Resources/public/js/mine-seeker/app.js

@@ -181,13 +181,13 @@ class MineSeeker extends React.Component {
         });
     }
 
-    wInit(session, data, gridClient) {
+    wInit(session, gridServer, gridClient) {
         this.setState({session: session});
 
         /** save session to GridControl */
-        /** render grid fields - #12 */
+        /** render grid fields - @see #12 */
         this.refs.gridControl.setState({
-            grid: this.state.gameInherited ? JSON.parse(Base64.decode(data))['grid'] : gridClient,
+            grid: this.state.gameInherited ? gridServer : gridClient,
             channel: this.state.channel,
             desc: {
                 buddy: <div>
@@ -317,10 +317,8 @@ class MineSeeker extends React.Component {
         /** Create Websocket w/ Bahnhof.js */
         let websocket = WS.connect(
             this.state.env === 'dev'
-                // ? "ws://mine.dev:6450"
-                // : "ws://www.mineseeker.ninja:6450"
                 ? "ws://mine.dev:6450"
-                : (this.state.ssl === 'true' ? "wss" : "ws") + "://system7.ddns.net:443/"
+                : (this.state.ssl === 'true' ? "wss" : "ws") + "://www.mineseeker.party:6450/"
         );
 
         /**
@@ -346,8 +344,23 @@ class MineSeeker extends React.Component {
                         (data) => {
                             this.state.env === 'dev' && console.info('RPC has been called');
 
-                            this.wInit(session, data, gridClient);
-                            this.subscribe(this.state.gameInherited && JSON.parse(Base64.decode(data))['users']);
+                            let serverData = data[0] !== true
+                                ? JSON.parse(Base64.decode(data))
+                                : data;
+
+                            /** Check the grid if the user is inherited @see #30 */
+                            if ((this.state.gameInherited && null !== serverData.grid) || !this.state.gameInherited) {
+                                this.wInit(session, serverData.grid, gridClient);
+                                this.subscribe(this.state.gameInherited && serverData.users);
+                            } else {
+                                this.refs.gridControl.setState({
+                                    overlay: true,
+                                    overlayTitle: "This channel does not exists!",
+                                    overlaySubTitle: <a href={"/play"} target="_self">Restart game!</a>
+                                });
+
+                                console.error("This channel does not exists!");
+                            }
                         },
                         (error, desc) => this.state.env === 'dev' && console.error(["RPC Error", error, desc])
                     );

src/Mine/SeekerBundle/Resources/views/Game/play.html.twig

@@ -23,6 +23,12 @@
     '@MineSeekerBundle/Resources/public/css/style.mineseeker.css' %}
     <link rel="stylesheet" media="screen" href="{{ asset_url }}" type="text/css"/>
     {% endstylesheets %}
+
+    <style type="text/css">
+        .mine-container {
+            background: url('/bundles/mineseeker/images/bg-mineseeker-{{ random(1) }}-outbg.jpg') no-repeat;
+        }
+    </style>
 {% endblock %}
 
 {% block javascripts %}

src/Mine/SeekerBundle/Rpc/MineseekerRpc.php

@@ -56,10 +56,13 @@ class MineseekerRpc implements RpcInterface
      */
     public function connectGame(ConnectionInterface $connection, WampRequest $request, array $params)
     {
+        $grid = $this->getGrid($params);
+        $users = null !== $grid ? $this->getUsers($params) : null;
+
         return base64_encode(json_encode(
             array(
-                'grid' => $this->getGrid($params),
-                'users' => $this->getUsers($params)
+                'grid' => $grid,
+                'users' => $users
             )
         ));
     }
@@ -77,16 +80,19 @@ class MineseekerRpc implements RpcInterface
 
         $grid = $this->em
             ->getRepository('MineSeekerBundle:PlayedGame')
-            ->findOneByGameAssoc($gameAssoc)
-            ->getGrid();
+            ->findOneByGameAssoc($gameAssoc);
 
-        foreach ($grid->getGridRow()->toArray() as $row) {
+        if (null !== $grid) {
+            foreach ($grid->getGrid()->getGridRow()->toArray() as $row) {
                 $getsee[] = $row->getGridCol();
             }
 
             return $getsee;
         }
 
+        return null;
+    }
+
     /**
      * @param $gameAssoc
      * @return array