chg: dev: change the default url to wss on frontend #3

.babelrc

@@ -1,3 +0,0 @@
-{
-  "presets": ["es2015", "react"]
-}

.env.dist

@@ -0,0 +1,20 @@
+# This file is a "template" of which env vars need to be defined for your application
+# Copy this file to .env file for development, create environment variables when deploying to production
+# https://symfony.com/doc/current/best_practices/configuration.html#infrastructure-related-configuration
+
+###> symfony/framework-bundle ###
+APP_ENV=dev
+APP_SECRET=c1c278747d952ea66326352b72bb8ec6
+#TRUSTED_PROXIES=127.0.0.1,127.0.0.2
+#TRUSTED_HOSTS=localhost,example.com
+###< symfony/framework-bundle ###
+
+###> doctrine/doctrine-bundle ###
+# Format described at http://docs.doctrine-project.org/projects/doctrine-dbal/en/latest/reference/configuration.html#connecting-using-a-url
+# For an SQLite database, use: "sqlite:///%kernel.project_dir%/var/data.db"
+# Configure your db driver and server_version in config/packages/doctrine.yaml
+DATABASE_URL=mysql://db_user:db_password@127.0.0.1:3306/db_name
+###< doctrine/doctrine-bundle ###
+###> symfony/mailer ###
+# MAILER_DSN=smtp://localhost
+###< symfony/mailer ###

.gitignore

@@ -1,38 +1,20 @@
-/app/config/parameters.yml
+###> system7 - jotunheimr ###
-/build/
++bak/
-/phpunit.xml
+.idea/
-/var/*
+node_modules/
-!/var/cache
-/var/cache/*
-!var/cache/.gitkeep
-!/var/logs
-/var/logs/*
-!var/logs/.gitkeep
-!/var/sessions
-/var/sessions/*
-!var/sessions/.gitkeep
-!var/SymfonyRequirements.php
-/vendor/
-/web/bundles/
-
-# s7 mods
-/!/
-/.idea/
-/.idea/*
-/.idea/workspace.xml
-/.idea/dataSources.ids
-/.idea/dataSources.xml
-/.idea/dataSources.local.xml
-
-web/css/*
-web/js/*
-web/uploads/*
-
-phpunit.phar
-phpunit-report/*
-/node_modules/
-/src/Mine/SeekerBundle/Resources/public/js/node/
-/src/Mine/SeekerBundle/Resources/public/js/src/
-
 nohup.out
-src/Mine/SeekerBundle/Resources/public/js/index.js
+###< system7 - jotunheimr ###
+
+###> symfony/framework-bundle ###
+/.env
+/public/bundles/
+/var/
+/vendor/
+###< symfony/framework-bundle ###
+
+###> symfony/webpack-encore-bundle ###
+/node_modules/
+/public/build/
+npm-debug.log
+yarn-error.log
+###< symfony/webpack-encore-bundle ###

CHANGELOG.md

@@ -0,0 +1,105 @@
+Changelog
+=========
+
+
+0.4.0 (2019-10-26)
+------------------
+- Change session driver to REDIS. [Lang]
+- Add created, updated field to db && improve graph design. [Lang]
+- Cache setup && optimalize for google pagespeed && optimalize all
+  images. [Lang]
+- Improve graph design on homepage && add footer and techs && add
+  official pages. [Lang]
+- Bugfix mine websocket periodic mysql calling. [Lang]
+- Bugfix hwioauth remember me && centralize hwioauth and facebook
+  settings. [Lang]
+- Centralize jquery && bugfix mysql auto-termination problem w/ user
+  auth. [Lang]
+- Release beta4. [Lang]
+- Gitignore npm debug log. [Lang]
+- Add english lang everywhere && add snowfall && add centralized version
+  nbr && improve stylesheet && slack integration. [Lang]
+- Bugfix #30 && random bg in game. [Lang]
+- Add google analytics and facebook scripts && improve url share method
+  w/ fb && enforce https in prod. [Lang]
+- Reg and login buttons on index && remove list method && facebook
+  centralize. [Lang]
+- Redesign user frontend. [Lang]
+- Mods for performance; one js.min file on prod. [Lang]
+- Improve webpack config for prod compile #23. [Lang]
+- Ssl handling #22 && reconnection issues #20, #21. [Lang]
+- Facebook prod settings w/ app; hwi/HWIOAuthBundle. [Lang]
+- Refact && game reconnection and restore w/o refresh #3 && bugfix bomb
+  explosion on opponent mines #19. [Lang]
+- Typo in rpc. [Lang]
+- Handle prod mysql timeout && graphics improve. [Lang]
+- Gitignore webpacked index.js. [Lang]
+- Add production mods. [Lang]
+- Bugfix points saving and exploded bombs to db && you can resign #6.
+  [Lang]
+- Bugfix resign button existence #11. [Lang]
+- Bugfix opponent bomb btn buzz on hover #10. [Lang]
+- Bugfix points problem in the end #16. [Lang]
+- Add desc to every user #9. [Lang]
+- Clipboard - not working #8. [Lang]
+- Random player on start #5. [Lang]
+- Show left mines after end #2 && reduce network traffic && better
+  active field checking method. [Lang]
+- Some refactor #13. [Lang]
+- Bugfix grid field render #12. [Lang]
+- Game ends after x mines. [Lang]
+- Add new sounds && refactor && new bg images && form redesigns. [Lang]
+- Bugfix entities gridrow, grid && improve graph design on homepage.
+  [Lang]
+- Some refactor && prod settings. [Lang]
+- Improve graphics design in game. [Lang]
+- Bugfix grid row in entity. [Lang]
+- Bugfix changePlayer after bomb explosion. [Lang]
+- Improve game graph design. [Lang]
+- Login and register form more design. [Lang]
+- Add basic design to userbundle && refactor. [Lang]
+- Add font-awesome. [Lang]
+- Working user authentication w/ fb and plain login. [Lang]
+- Add facebook login module, hwi/HWIOAuthBundle. [Lang]
+- Login && register form overrided. [Lang]
+- Js and config refactor. [Lang]
+- Replace gridcol object to json array in db. [Lang]
+- Refactor. [Lang]
+- Save steps and point info to db. [Lang]
+- Save the step data to db. [Lang]
+- Renamed the acme to mineseeker && handle when the user connection has
+  been lost. [Lang]
+- Add player names to UI. [Lang]
+- Add overlay && game do not start until the opponent came. [Lang]
+- Add base64 encryption to grid when it has been sended to server.
+  [Lang]
+- On click opponents bomb, you cannot target && refactor. [Lang]
+- Warning when player has been found more than 20 mines. [Lang]
+- Bugfix center mine counter animation. [Lang]
+- The opponent is the next when bomb is exploded. [Lang]
+- Current username checked && refactor && remove players in channel when
+  they are more than 2. [Lang]
+- Send bomb info and use it on opponent. [Lang]
+- Add sounds w/ howler. [Lang]
+- Bugfix multiple empty fields w/ one click on opponent view. [Lang]
+- Refact && remove sound and logging && bugfix BIGBUG - handleGridField
+  and showAppropriateFields sort order... [Lang]
+- Create first working communication. [Lang]
+- Create entities and repositories. [Lang]
+- Changed websocket default port && debug RPC. [Lang]
+- Created working session and client  handler w/ websocket. [Lang]
+- Working websocket client and server w/o session handling and storage.
+  [Lang]
+- Composer update. [Lang]
+- Improve game && start sound creating. [Lang]
+- Refactor grid control and grid field. [Lang]
+- Created basic game w/ table and animations. [Lang]
+- Websocket basic setup FE & BE && working basic game w/ react &&
+  webpack & babel config. [Lang]
+- Gitignore node_modules && add symlink to node_modules (just for
+  install) && basic react. [Lang]
+- Add react hello world. [Lang]
+- Rename project in config. [Lang]
+- Initial commit && create project in symfony3. [Lang]
+
+

README.md

@@ -1,6 +1,13 @@
+mineseeker
+=========
+
+A Symfony project created on September 22, 2016, 13:56 pm.
+
+PROJECT VERSION 1.1.0-20191026
+
 This is a Symfony 3 project w/ React JS in standalone mode and w/ WebSocket.
 
-	0.) Must installed modules w/ npm are in package.json + to global:
+#### Must installed modules w/ npm are in package.json + to global:
 
     $ npm install webpack -g
 
@@ -9,17 +16,25 @@ This is a Symfony 3 project w/ React JS in standalone mode and w/ WebSocket.
     webpack.config.js - https://webpack.github.io/docs/webpack-for-browserify-users.html
     same as dir where the package.json!!
 
-	(!)	Tutorial: https://egghead.io/lessons/react-introduction-to-properties
+__(!)	Tutorial: https://egghead.io/lessons/react-introduction-to-properties__
 
-
+#### Backend WebSocket server start as daemon - GeniusesOfSymfony/WebSocketBundle
-
-	1.) Backend WebSocket server start as daemon - GeniusesOfSymfony/WebSocketBundle
 
     $ nohup bin/console gos:websocket:server &
 
-	2.) React JS WebPack watch generator w/ babel presets: es2015, react
+#### React JS WebPack watch generator w/ babel presets: es2015, react
+
+    $ webpack -p --config=webpack-prod.config.js
+
+        PROD
 
     $ webpack --progress --colors --watch -d
 
+        DEV
+
         -d -->	Debugger; If you write this line somewhere: debugger;
             The browser will stop the code here!!!
+
+#### Connect to Prod
+
+    ssh xxsvci@laszlolang.com -i ~/.ssh/id_rsa_laszlolang

app/.htaccess

@@ -1,7 +0,0 @@
-<IfModule mod_authz_core.c>
-    Require all denied
-</IfModule>
-<IfModule !mod_authz_core.c>
-    Order deny,allow
-    Deny from all
-</IfModule>

app/AppCache.php

@@ -1,7 +0,0 @@
-<?php
-
-use Symfony\Bundle\FrameworkBundle\HttpCache\HttpCache;
-
-class AppCache extends HttpCache
-{
-}

app/AppKernel.php

@@ -1,62 +0,0 @@
-<?php
-
-use Symfony\Component\HttpKernel\Kernel;
-use Symfony\Component\Config\Loader\LoaderInterface;
-
-class AppKernel extends Kernel
-{
-    public function registerBundles()
-    {
-        $bundles = [
-            new Symfony\Bundle\FrameworkBundle\FrameworkBundle(),
-            new Symfony\Bundle\SecurityBundle\SecurityBundle(),
-            new Symfony\Bundle\TwigBundle\TwigBundle(),
-            new Symfony\Bundle\MonologBundle\MonologBundle(),
-            new Symfony\Bundle\SwiftmailerBundle\SwiftmailerBundle(),
-            new Doctrine\Bundle\DoctrineBundle\DoctrineBundle(),
-            new Sensio\Bundle\FrameworkExtraBundle\SensioFrameworkExtraBundle(),
-
-            new Doctrine\Bundle\MigrationsBundle\DoctrineMigrationsBundle(),
-            new Symfony\Bundle\AsseticBundle\AsseticBundle(),
-            new FOS\UserBundle\FOSUserBundle(),
-            new HWI\Bundle\OAuthBundle\HWIOAuthBundle(),
-            new Gos\Bundle\WebSocketBundle\GosWebSocketBundle(),
-            new Gos\Bundle\PubSubRouterBundle\GosPubSubRouterBundle(),
-            new Doctrine\Bundle\DoctrineCacheBundle\DoctrineCacheBundle(),
-            new Snc\RedisBundle\SncRedisBundle(),
-
-            new Jotunheimr\AdminBundle\JotunheimrAdminBundle(),
-            new Jotunheimr\UserBundle\JotunheimrUserBundle(),
-            new Mine\SeekerBundle\MineSeekerBundle(),
-        ];
-
-        if (in_array($this->getEnvironment(), ['dev', 'test'], true)) {
-            $bundles[] = new Symfony\Bundle\DebugBundle\DebugBundle();
-            $bundles[] = new Symfony\Bundle\WebProfilerBundle\WebProfilerBundle();
-            $bundles[] = new Sensio\Bundle\DistributionBundle\SensioDistributionBundle();
-            $bundles[] = new Sensio\Bundle\GeneratorBundle\SensioGeneratorBundle();
-        }
-
-        return $bundles;
-    }
-
-    public function getRootDir()
-    {
-        return __DIR__;
-    }
-
-    public function getCacheDir()
-    {
-        return dirname(__DIR__).'/var/cache/'.$this->getEnvironment();
-    }
-
-    public function getLogDir()
-    {
-        return dirname(__DIR__).'/var/logs';
-    }
-
-    public function registerContainerConfiguration(LoaderInterface $loader)
-    {
-        $loader->load($this->getRootDir().'/config/config_'.$this->getEnvironment().'.yml');
-    }
-}

app/Resources/views/base.html.twig

@@ -1,23 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>{% block title %}Welcome!{% endblock %}</title>
-    {% block stylesheets %}{% endblock %}
-    <link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}"/>
-</head>
-<body>
-<header>
-    {% block header %}{% endblock %}
-</header>
-<main>
-    {% block body %}{% endblock %}
-</main>
-<footer>
-    {% block footer %}{% endblock %}
-</footer>
-
-{% block javascripts %}{% endblock %}
-</body>
-</html>

app/autoload.php

@@ -1,13 +0,0 @@
-<?php
-
-use Doctrine\Common\Annotations\AnnotationRegistry;
-use Composer\Autoload\ClassLoader;
-
-/**
- * @var ClassLoader $loader
- */
-$loader = require __DIR__.'/../vendor/autoload.php';
-
-AnnotationRegistry::registerLoader([$loader, 'loadClass']);
-
-return $loader;

app/config/config.yml

@@ -1,83 +0,0 @@
-imports:
-    - { resource: security.yml }
-    - { resource: services.yml }
-    - { resource: "@JotunheimrAdminBundle/Resources/config/config.yml" }
-    - { resource: "@JotunheimrUserBundle/Resources/config/config.yml" }
-    - { resource: "@MineSeekerBundle/Resources/config/config.yml" }
-    - { resource: "@MineSeekerBundle/Resources/config/services.yml" }
-
-# Put parameters here that don't need to change on each machine where the app is deployed
-# http://symfony.com/doc/current/best_practices/configuration.html#application-related-configuration
-parameters:
-    locale: en
-
-framework:
-    #esi:             ~
-    translator:      { fallbacks: ["%locale%"] }
-    secret:          "%secret%"
-    router:
-        resource: "%kernel.root_dir%/config/routing.yml"
-        strict_requirements: ~
-    form:            ~
-    csrf_protection: ~
-    validation:      { enable_annotations: true }
-    #serializer:      { enable_annotations: true }
-    templating:
-        engines: ['twig']
-    default_locale:  "%locale%"
-    trusted_hosts:   ~
-    trusted_proxies: ~
-    session:
-        # http://symfony.com/doc/current/reference/configuration/framework.html#handler-id
-#        handler_id:  session.handler.native_file
-        handler_id: session.handler.pdo
-        save_path:   "%kernel.root_dir%/../var/sessions/%kernel.environment%"
-    fragments:       ~
-    http_method_override: true
-    assets: ~
-
-# Twig Configuration
-twig:
-    debug:            "%kernel.debug%"
-    strict_variables: "%kernel.debug%"
-
-# Doctrine Configuration
-doctrine:
-    dbal:
-        driver:   pdo_mysql
-        host:     "%database_host%"
-        port:     "%database_port%"
-        dbname:   "%database_name%"
-        user:     "%database_user%"
-        password: "%database_password%"
-        charset:  UTF8
-        # if using pdo_sqlite as your database driver:
-        #   1. add the path in parameters.yml
-        #     e.g. database_path: "%kernel.root_dir%/data/data.db3"
-        #   2. Uncomment database_path in parameters.yml.dist
-        #   3. Uncomment next line:
-        #     path:     "%database_path%"
-
-    orm:
-        auto_generate_proxy_classes: "%kernel.debug%"
-        naming_strategy: doctrine.orm.naming_strategy.underscore
-        auto_mapping: true
-
-# Assetic Configuration
-assetic:
-    debug: "%kernel.debug%"
-    use_controller: "%kernel.debug%"
-    bundles: ~
-    filters:
-        cssrewrite: ~
-        uglifyjs2:
-            bin: "%kernel.root_dir%/../node_modules/uglify-js/bin/uglifyjs"
-            no_copyright: true
-        uglifycss:
-            bin: "%kernel.root_dir%/../node_modules/uglifycss/uglifycss"
-
-# FOS User Configuration
-fos_user:
-    db_driver: orm # other valid values are 'mongodb', 'couchdb' and 'propel'
-    firewall_name: main
-    user_class: Jotunheimr\UserBundle\Entity\User

app/config/config_dev.yml

@@ -1,47 +0,0 @@
-imports:
-    - { resource: parameters_dev.yml }
-    - { resource: config.yml }
-
-framework:
-    router:
-        resource: "%kernel.root_dir%/config/routing_dev.yml"
-        strict_requirements: true
-    profiler: { only_exceptions: false }
-
-web_profiler:
-    toolbar: true
-    intercept_redirects: false
-
-
-# Swiftmailer Configuration
-swiftmailer:
-    transport: "%mailer_transport%"
-    host:      "%mailer_host%"
-    username:  "%mailer_user%"
-    password:  "%mailer_password%"
-    spool:     { type: memory }
-
-monolog:
-    handlers:
-        main:
-            type: stream
-            path: "%kernel.logs_dir%/%kernel.environment%.log"
-            level: debug
-            channels: [!event]
-        console:
-            type:   console
-            channels: [!event, !doctrine]
-
-# Facebook OAuth
-hwi_oauth:
-    firewall_names: [secured_area]
-    resource_owners:
-        facebook:
-            type:                facebook
-            client_id:           320599508311862
-            client_secret:       18d4f48cdd274bccee2678e5eff3f557
-            scope:               "public_profile,email"
-            options:
-                display: popup
-                auth_type: rerequest
-                csrf: true

app/config/config_prod.yml

@@ -1,38 +0,0 @@
-imports:
-    - { resource: parameters_prod.yml }
-    - { resource: config.yml }
-
-# Swiftmailer Configuration
-swiftmailer:
-    transport: "%mailer_transport%"
-    host:      "%mailer_host%"
-    username:  "%mailer_user%"
-    password:  "%mailer_password%"
-    spool:     { type: memory }
-
-monolog:
-    handlers:
-        main:
-            type:         fingers_crossed
-            action_level: error
-            handler:      nested
-        nested:
-            type:  stream
-            path:  "%kernel.logs_dir%/%kernel.environment%.log"
-            level: debug
-        console:
-            type:  console
-
-# Facebook OAuth
-hwi_oauth:
-    firewall_names: [secured_area]
-    resource_owners:
-        facebook:
-            type:                facebook
-            client_id:           320597498312063
-            client_secret:       c751bec8a3c5313ff2e5a83769bf1109
-            scope:               "public_profile,email"
-            options:
-                display: popup
-                auth_type: rerequest
-                csrf: true

app/config/config_test.yml

@@ -1,16 +0,0 @@
-imports:
-    - { resource: config_dev.yml }
-
-framework:
-    test: ~
-    session:
-        storage_id: session.storage.mock_file
-    profiler:
-        collect: false
-
-web_profiler:
-    toolbar: false
-    intercept_redirects: false
-
-swiftmailer:
-    disable_delivery: true

app/config/parameters.yml.dist

@@ -1,19 +0,0 @@
-# This file is a "template" of what your parameters.yml file should look like
-# Set parameters here that may be different on each deployment target of the app, e.g. development, staging, production.
-# http://symfony.com/doc/current/best_practices/configuration.html#infrastructure-related-configuration
-parameters:
-    database_host:     127.0.0.1
-    database_port:     ~
-    database_name:     symfony
-    database_user:     root
-    database_password: ~
-    # You should uncomment this if you want use pdo_sqlite
-    # database_path: "%kernel.root_dir%/data.db3"
-
-    mailer_transport:  smtp
-    mailer_host:       127.0.0.1
-    mailer_user:       ~
-    mailer_password:   ~
-
-    # A secret key that's used to generate certain security-related tokens
-    secret:            ThisTokenIsNotSoSecretChangeIt

app/config/parameters_dev.yml

@@ -1,12 +0,0 @@
-# This file is auto-generated during the composer install
-parameters:
-    database_host: 127.0.0.1
-    database_port: null
-    database_name: mine
-    database_user: root
-    database_password: bazmeg
-    mailer_transport: smtp
-    mailer_host: 127.0.0.1
-    mailer_user: null
-    mailer_password: null
-    secret: bbcd5df99fc340558fb3995c198a9b4764db72ba

app/config/parameters_prod.yml

@@ -1,12 +0,0 @@
-# This file is auto-generated during the composer install
-parameters:
-    database_host: 127.0.0.1
-    database_port: null
-    database_name: xxsvci_mineseeker
-    database_user: xxsvci_mine
-    database_password: "XTw#8qC$faa*"
-    mailer_transport: smtp
-    mailer_host: 127.0.0.1
-    mailer_user: null
-    mailer_password: null
-    secret: e25d036bb9c7ece0f2049984a1fa2f0cab295aaa

app/config/routing.yml

@@ -1,14 +0,0 @@
-fos_user:
-    resource: "@FOSUserBundle/Resources/config/routing/all.xml"
-
-JotunheimrUserBundle:
-    resource: "@JotunheimrUserBundle/Resources/config/routing.yml"
-    prefix:   /
-
-JotunheimrAdminBundle:
-    resource: "@JotunheimrAdminBundle/Resources/config/routing.yml"
-    prefix:   /
-
-MineSeekerBundle:
-    resource: "@MineSeekerBundle/Resources/config/routing.yml"
-    prefix:   /

app/config/routing_dev.yml

@@ -1,14 +0,0 @@
-_wdt:
-    resource: "@WebProfilerBundle/Resources/config/routing/wdt.xml"
-    prefix:   /_wdt
-
-_profiler:
-    resource: "@WebProfilerBundle/Resources/config/routing/profiler.xml"
-    prefix:   /_profiler
-
-_errors:
-    resource: "@TwigBundle/Resources/config/routing/errors.xml"
-    prefix:   /_error
-
-_main:
-    resource: routing.yml

app/config/security.yml

@@ -1,40 +0,0 @@
-security:
-    encoders:
-        FOS\UserBundle\Model\UserInterface: bcrypt
-
-    role_hierarchy:
-        ROLE_ADMIN:       ROLE_USER
-        ROLE_SUPER_ADMIN: ROLE_ADMIN
-
-    providers:
-        fos_userbundle:
-            id: fos_user.user_provider.username_email
-
-    firewalls:
-        secured_area:
-            anonymous: ~
-            oauth:
-                resource_owners:
-                    facebook:           /login/check-facebook
-                    google:             /login/check-google
-                    my_github:          /login/check-github
-                login_path:        /login
-                failure_path:      /login
-                use_forward:       false
-
-                oauth_user_provider:
-                    service: my.custom.user_provider
-            form_login:
-                provider: fos_userbundle
-                csrf_token_generator: security.csrf.token_manager
-                default_target_path: /
-            logout:
-                path:   /logout
-                target: /
-
-    access_control:
-        - { path: ^/login, roles: IS_AUTHENTICATED_ANONYMOUSLY }
-        - { path: ^/register, role: IS_AUTHENTICATED_ANONYMOUSLY }
-        - { path: ^/resetting, role: IS_AUTHENTICATED_ANONYMOUSLY }
-        - { path: ^/play, role: IS_AUTHENTICATED_ANONYMOUSLY }
-        - { path: ^/admin, role: ROLE_SUPER_ADMIN }

app/config/services.yml

@@ -1,9 +0,0 @@
-# Learn more about services, parameters and containers at
-# http://symfony.com/doc/current/book/service_container.html
-parameters:
-#    parameter_name: value
-
-services:
-#    service_name:
-#        class: AppBundle\Directory\ClassName
-#        arguments: ["@another_service_name", "plain_value", "%parameter_name%"]

assets/css/style.homepage.scss

@@ -0,0 +1,181 @@
+* {
+    outline: none;
+    padding: 0;
+    margin: 0;
+}
+
+html, body {
+    background: #ffffff;
+    display: block;
+    width: 100%;
+    height: 100%;
+}
+
+header {
+    background: #d1e8ff;
+    position: relative;
+    width: 100%;
+    height: 950px;
+    color: #ffffff;
+
+    overflow: hidden;
+}
+
+header section {
+    display: flex;
+    align-items: flex-start;
+    justify-content: flex-start;
+    flex-direction: column;
+    max-width: 1300px;
+    width: 100%;
+    height: 100%;
+    padding: 20px;
+    margin: 0 auto;
+}
+
+header section div.logo img {
+    width: 350px;
+    margin: 50px 0;
+}
+
+header section div.logo a {
+    display: block;
+}
+
+header section > img {
+    position: absolute;
+    width: 1300px;
+    height: 1300px;
+    right: -20%;
+    top: -10%;
+
+    z-index: 1;
+}
+
+header section > div {
+    z-index: 2;
+}
+
+header section h1 {
+    font: bold 40px 'Rajdhani', sans-serif;
+    color: #434242;
+    margin-bottom: 100px;
+}
+
+header section h2 {
+    font: normal 32px 'Rajdhani', sans-serif;
+    color: #434242;
+    margin-top: 100px;
+}
+
+header section h3 {
+    display: block;
+    font: bold 16px 'Rajdhani', sans-serif;
+    color: #434242;
+    margin-top: 10px;
+}
+
+header section h3 img {
+    width: 16px;
+}
+
+header section div.buttons > a {
+    background: #69788e;
+    display: table;
+    font: bold 32px 'Rajdhani', sans-serif;
+    text-transform: uppercase;
+    text-decoration: none;
+    border: 5px solid #57667b;
+    color: #FFFFFF;
+    padding: 25px 150px;
+    margin-bottom: 20px;
+
+    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
+    border-radius: 20px;
+    transition: all 250ms ease-in-out;
+}
+
+header section div.buttons > a:hover {
+    background: #57667b;
+
+    -webkit-box-shadow: 0 7px 15px rgba(0, 0, 0, 0.2);
+    box-shadow: 0 7px 15px rgba(0, 0, 0, 0.2);
+    -webkit-transition: all 250ms ease-in-out;
+    -moz-transition: all 250ms ease-in-out;
+    -o-transition: all 250ms ease-in-out;
+    transition: all 250ms ease-in-out;
+}
+
+header section div.buttons > a.small {
+    background: #83aed9;
+    display: inline-block;
+    font: bold 22px 'Rajdhani', sans-serif;
+    border: 1px solid #6890ba;
+    color: #FFFFFF;
+    padding: 10px;
+
+    -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
+    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
+    -webkit-transition: all 250ms ease-in-out;
+    -moz-transition: all 250ms ease-in-out;
+    -o-transition: all 250ms ease-in-out;
+    transition: all 250ms ease-in-out;
+
+}
+
+header section div.buttons > a.small:hover {
+    background: #86b5e1;
+    border: 1px solid #658fb8;
+    color: #FFFFFF;
+
+    -webkit-box-shadow: 0 7px 15px rgba(0, 0, 0, 0.2);
+    box-shadow: 0 7px 15px rgba(0, 0, 0, 0.2);
+    -webkit-transition: all 250ms ease-in-out;
+    -moz-transition: all 250ms ease-in-out;
+    -o-transition: all 250ms ease-in-out;
+    transition: all 250ms ease-in-out;
+}
+
+@media screen and (max-width: 1100px) {
+    header section {
+        align-items: center;
+        justify-content: center;
+        text-align: center;
+    }
+
+    header section div.buttons > a {
+        margin: 0 auto 20px auto;
+    }
+
+    header section h1 {
+        margin-bottom: 20px;
+    }
+
+    header section div.logo img {
+        margin-bottom: 0;
+    }
+
+    header section > img {
+        display: none;
+    }
+}
+
+@media screen and (max-width: 500px) {
+    /*header {*/
+        /*min-height: 100%;*/
+        /*height: auto;*/
+    /*}*/
+
+    header section {
+        width: auto;
+    }
+
+    header section div.logo img {
+        width: 100%;
+    }
+
+    header section div.buttons > a {
+        display: block;
+        padding: 25px 5px;
+    }
+}

assets/css/style.layout.scss

@@ -0,0 +1,399 @@
+@import url('https://fonts.googleapis.com/css?family=Rajdhani:300,400,500,600,700&subset=latin-ext');
+@import "~bootstrap/dist/css/bootstrap.min.css";
+@import "style";
+@import "style.homepage";
+
+::-webkit-input-placeholder {
+  color: #888982;
+}
+
+::-moz-placeholder {
+  color: #888982;
+}
+
+:-ms-input-placeholder {
+  color: #888982;
+}
+
+:-moz-placeholder {
+  color: #888982;
+}
+
+* {
+  padding: 0;
+  margin: 0;
+  outline: 0;
+}
+
+*,
+*:after,
+*::before {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+.ac-custom {
+  width: 100%;
+}
+
+header section .form-check {
+  display: table;
+  position: relative;
+  margin: 20px 0;
+}
+
+header section h1 {
+  margin: 10px 0;
+}
+
+header section .input-submit button,
+header section .input-submit button:hover,
+header section .form-input,
+header section .form-input:focus,
+header section .form-input:hover {
+  -webkit-transition: all 250ms ease-in-out;
+  -moz-transition: all 250ms ease-in-out;
+  -o-transition: all 250ms ease-in-out;
+  transition: all 250ms ease-in-out;
+}
+
+header section .input-submit button {
+  background: #83aed9;
+  display: table;
+  font: bold 32px 'Rajdhani', sans-serif;
+  text-transform: uppercase;
+  text-decoration: none;
+  width: 500px;
+  border: 1px solid #658fb8;
+  color: #FFFFFF;
+  padding: 25px 150px;
+  margin-top: 20px;
+
+  -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
+  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
+  -webkit-border-radius: 3px;
+  border-radius: 3px;
+}
+
+header section .input-submit button:hover {
+  background: #86b5e1;
+
+  -webkit-box-shadow: 0 7px 15px rgba(0, 0, 0, 0.2);
+  box-shadow: 0 7px 15px rgba(0, 0, 0, 0.2);
+}
+
+header section .form-input {
+  display: block;
+  width: 500px;
+  font: bold 22px 'Rajdhani', sans-serif;
+  border: 1px solid #dddddd;
+  color: #000000;
+  padding: 15px;
+  margin-bottom: 10px;
+
+  -webkit-border-radius: 3px;
+  border-radius: 3px;
+  -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
+  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
+}
+
+header section .form-input:focus,
+header section .form-input:hover {
+  -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 .failure {
+  background: #f00;
+  position: relative;
+  border: 3px solid #fff;
+  font: bold 16px 'Rajdhani', sans-serif;
+  color: #FFFFFF;
+  padding: 10px;
+  margin: 30px 0 10px 0;
+
+  -webkit-border-radius: 5px;
+  border-radius: 5px;
+}
+
+header section .failure:after,
+header section .failure:before {
+  content: " ";
+  position: absolute;
+  bottom: 100%;
+  left: 50px;
+  height: 0;
+  width: 0;
+  border: solid transparent;
+  pointer-events: none;
+}
+
+header section .failure:after {
+  border-color: rgba(0, 0, 0, 0);
+  border-bottom-color: #f00;
+  border-width: 20px;
+  margin-left: -20px;
+}
+
+header section .failure:before {
+  border-color: rgba(255, 255, 255, 0);
+  border-bottom-color: #ffffff;
+  border-width: 26px;
+  margin-left: -26px;
+}
+
+header section .failure ul {
+  display: inline-block;
+  list-style: none;
+  padding: 0;
+  margin: 0 10px 0 0;
+}
+
+header section h3.or {
+  font: bold 16px 'Rajdhani', sans-serif;
+  text-transform: uppercase;
+  color: #a1a1a1;
+  margin: 20px 0;
+}
+
+header section #id_welcome {
+  display: flex;
+  flex-direction: row;
+  margin-bottom: 115px;
+}
+
+header section #id_welcome > div {
+  padding-right: 20px;
+}
+
+header section #id_welcome img {
+  width: 100px;
+  border: 5px solid #414040;
+
+  -webkit-border-radius: 50%;
+  border-radius: 50%;
+}
+
+header section .buttons,
+header section form {
+  z-index: 2;
+}
+
+header section div.buttons > a.fb-login,
+header section div.buttons > a.slack-login {
+  position: relative;
+  display: block;
+  width: 500px;
+  height: 93px;
+  padding: 25px 0 25px 150px;
+  margin-bottom: 10px;
+
+  overflow: hidden;
+  cursor: pointer;
+
+  -webkit-border-radius: 3px;
+  border-radius: 3px;
+  -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
+  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
+}
+
+header section div.buttons > a.fb-login:hover,
+header section div.buttons > 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 div.buttons > a.fb-login i,
+header section div.buttons > a.slack-login i {
+  position: absolute;
+  font-size: 130px;
+  top: 0;
+  left: 15px;
+}
+
+header section div.buttons > a.fb-login {
+  background: #5975b1;
+  border: 1px solid #50649f;
+}
+
+header section div.buttons > a.fb-login:hover {
+  background: #42598c;
+  color: #FFFFFF;
+}
+
+header section div.buttons > a.slack-login {
+  background: #FFFFFF;
+  border: 1px solid #5c3a58;
+  color: #5c3a58;
+}
+
+header section div.buttons > a.slack-login:hover {
+  background: #e6e6e6;
+  color: #5c3a58;
+}
+
+header section .failure-main {
+  background: #f00;
+  max-width: 500px;
+  border: 3px solid #fff;
+  font: bold 16px 'Rajdhani', sans-serif;
+  color: #FFFFFF;
+  padding: 10px;
+  margin: 0 0 20px 0;
+
+  -webkit-border-radius: 5px;
+  border-radius: 5px;
+}
+
+main div.txt {
+  width: 100%;
+  max-width: 1000px;
+  font-family: 'Rajdhani', sans-serif;
+  color: #414040;
+  margin: 50px auto 0 auto;
+}
+
+main div.txt h2 {
+  margin: 0 0 50px 0;
+}
+
+main div.txt p {
+  font: normal 16px 'Rajdhani', sans-serif;
+}
+
+main div.txt li {
+  font: normal 16px 'Rajdhani', sans-serif;
+  padding-left: 10px;
+  margin-left: 50px;
+}
+
+main .technologies {
+  text-align: center;
+}
+
+main .technologies img {
+  display: inline-block;
+  width: 90%;
+  max-width: 100px;
+  margin: 20px;
+}
+
+main .technologies h1 {
+  font-weight: bold;
+}
+
+footer {
+  background: #414040;
+  width: 100%;
+  min-height: 50px;
+  margin-top: 50px;
+}
+
+footer nav {
+  display: block;
+  text-align: center;
+}
+
+footer nav ul {
+  display: inline-block;
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+
+footer nav ul li {
+  display: inline-block;
+  font: bold 16px 'Rajdhani', sans-serif;
+  color: #FFFFFF;
+}
+
+footer nav ul li:nth-child(even) {
+  width: 50px;
+  text-align: center;
+}
+
+footer nav ul li a {
+  text-align: center;
+  line-height: 50px;
+  color: #FFFFFF;
+}
+
+footer nav ul li a:hover {
+  color: #FFFFFF;
+}
+
+@media screen and (max-width: 1100px) {
+  header section #id_welcome {
+    align-items: center;
+    justify-content: center;
+    margin-top: 50px;
+  }
+
+  header section .form-input,
+  header section .form-check {
+    margin-left: auto;
+    margin-right: auto;
+  }
+
+  header section .input-submit button {
+    margin: 0 auto;
+  }
+
+  header section > div {
+    width: 100%;
+  }
+
+  header section div.buttons > a.fb-login,
+  header section div.buttons > a.slack-login {
+    margin: 0 auto;
+  }
+
+  main div.txt {
+    padding: 0 20px;
+  }
+}
+
+@media screen and (max-width: 550px) {
+  header section #id_welcome {
+    display: block;
+  }
+
+  header section {
+    padding: 20px;
+  }
+
+  header section .form-input {
+    width: 100%;
+    margin-left: auto;
+    margin-right: auto;
+  }
+
+  header section .form-check {
+    margin: 20px auto;
+  }
+
+  header section .input-submit button {
+    width: 100%;
+  }
+
+  header section div.buttons > a.fb-login,
+  header section div.buttons > a.slack-login {
+    width: 100%;
+  }
+
+  header section div.buttons > a.fb-login span,
+  header section div.buttons > a.slack-login span {
+    display: none;
+  }
+
+  footer nav ul li {
+    display: block;
+  }
+
+  footer nav ul li:nth-child(even) {
+    display: none;
+  }
+}

assets/css/style.mineseeker.scss

@@ -1,5 +1,6 @@
+@import "style";
 @import url('https://fonts.googleapis.com/css?family=Changa+One|Open+Sans:700');
-@import 'https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css';
+@import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css');
 
 html {
     height: 100%;
@@ -20,7 +21,7 @@ main {
 }
 
 .mine-container {
-    background: url("/bundles/mineseeker/images/bg-mineseeker-outbg.jpg") no-repeat;
+    background: url("/images/bg-mineseeker-0-outbg.jpg") no-repeat;
     background-size: cover;
     display: flex;
     justify-content: center;
@@ -96,51 +97,37 @@ main {
 
 #mine-wrapper .game-wrapper .game-overlay .game-overlay-window h1 {
     font-weight: bold;
-    font-size: 32px;
+    font-size: 26px;
 }
 
 #mine-wrapper .game-wrapper .game-overlay .game-overlay-window h2 {
     font-size: 18px;
 }
 
+#mine-wrapper .game-wrapper .game-overlay .game-overlay-window h3 {
+    font-size: 16px;
+    color: #386e8c;
+}
+
 #mine-wrapper .game-wrapper .game-overlay .game-overlay-window .clippy {
     display: flex;
     align-items: center;
     width: 100%;
+    margin-bottom: 10px;
 }
 
 #mine-wrapper .game-wrapper .game-overlay .game-overlay-window .clippy input {
     border: 0;
     height: 40px;
-    width: 90%;
+    width: 100%;
     padding: 0 20px;
 
-    -webkit-border-top-left-radius: 3px;
+    -webkit-border-radius: 3px;
-    border-top-left-radius: 3px;
+    border-radius: 3px;
-    -webkit-border-bottom-left-radius: 3px;
-    border-bottom-left-radius: 3px;
     -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
     box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
 }
 
-#mine-wrapper .game-wrapper .game-overlay .game-overlay-window .clippy button {
-    border: 0;
-    width: 10%;
-    height: 40px;
-
-    cursor: pointer;
-
-    -webkit-border-top-right-radius: 3px;
-    border-top-right-radius: 3px;
-    -webkit-border-bottom-right-radius: 3px;
-    border-bottom-right-radius: 3px;
-}
-
-#mine-wrapper .game-wrapper .game-overlay .game-overlay-window .clippy button img {
-    width: 15px;
-    height: 15px;
-}
-
 #mine-wrapper .game-wrapper .game-overlay .game-overlay-window a {
     background: #d8e3ea;
     display: inline-table;
@@ -326,7 +313,6 @@ main {
     color: #fdf612;
 }
 
-
 #mine-wrapper .game-wrapper .users .user-container .user-control {
     background: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.5) 0%, rgba(125, 185, 232, 0) 100%);
     background: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.5) 0%, rgba(125, 185, 232, 0) 100%);
@@ -734,7 +720,7 @@ main {
     flex-wrap: wrap;
     align-items: center;
     justify-content: center;
-    width: 642px;
+    width: 643px;
     border: 1px solid #cac3e5;
 
     cursor: none;
@@ -813,7 +799,7 @@ main {
 }
 
 #mine-wrapper .grid .field-wrapper .field .field-corner {
-    background: url('/bundles/mineseeker/images/bg-corner-outbg.png') no-repeat top left;
+    background: url('/images/bg-corner-outbg.png') no-repeat top left;
     background-size: 100%;
     width: 100%;
     height: 100%;
@@ -973,3 +959,70 @@ main {
 #mine-wrapper .grid .field-wrapper .field img {
     width: 80%;
 }
+
+.back-from-game {
+    display: inline-block;
+    position: fixed;
+    top: 20px;
+    left: 20px;
+
+    -ms-transform: scale(1); /* IE 9 */
+    -webkit-transform: scale(1); /* Safari */
+    transform: scale(1);
+    -webkit-transition: all 250ms cubic-bezier(.17, .67, .83, .67);
+    transition: all 250ms cubic-bezier(.17, .67, .83, .67);
+}
+
+.back-from-game img {
+    width: 100px;
+}
+
+.back-from-game:hover {
+    -ms-transform: scale(1.2); /* IE 9 */
+    -webkit-transform: scale(1.2); /* Safari */
+    transform: scale(1.2);
+    -webkit-transition: all 250ms cubic-bezier(.17, .67, .83, .67);
+    transition: all 250ms cubic-bezier(.17, .67, .83, .67);
+}
+
+@media screen and (max-width: 900px) {
+    #mine-wrapper .game-wrapper .users {
+        visibility: hidden;
+        display: none;
+    }
+
+    #mine-wrapper {
+        display: block;
+        width: 100%;
+    }
+
+    #mine-wrapper .game-wrapper {
+        width: 100%;
+        flex-direction: column-reverse;
+    }
+
+    #mine-wrapper .grid-container {
+        width: 100%;
+        padding: 0;
+    }
+
+    #mine-wrapper .grid {
+        width: 100%;
+    }
+
+    #mine-wrapper .grid .field-wrapper {
+        width: 6.25%;
+    }
+
+    #mine-wrapper .grid .field-wrapper > img.field-target {
+        width: 105%;
+        top: -2.5%;
+        left: -2.5%;
+    }
+
+    #mine-wrapper .grid .field-wrapper .field {
+        width: 100%;
+        height: auto;
+    }
+}
+

assets/css/style.scss

@@ -0,0 +1,10 @@
+.mine-beta {
+  position: fixed;
+  top: 0;
+  right: 0;
+  width: 150px;
+
+  z-index: 4;
+
+  transform: rotate(90deg);
+}

assets/js/app.js

@@ -0,0 +1,14 @@
+/*
+ * Welcome to your app's main JavaScript file!
+ *
+ * We recommend including the built version of this JavaScript file
+ * (and its CSS file) in your base layout (base.html.twig).
+ */
+
+// any CSS you require will output into a single css file (app.css in this case)
+require('../css/app.css');
+
+// Need jQuery? Install it with "yarn add jquery", then uncomment to require it.
+// const $ = require('jquery');
+
+console.log('Hello Webpack Encore! Edit me in assets/js/app.js');

assets/js/mine-seeker.js

@@ -4,6 +4,7 @@ import MineSeeker from './mine-seeker/app';
 
 ReactDOM.render(
     <MineSeeker env={document.getElementById('mine-wrapper').dataset.env}
-                gameId={document.getElementById('mine-wrapper').dataset.gameId}/>,
+                gameId={document.getElementById('mine-wrapper').dataset.gameId}
+                ssl={document.getElementById('mine-wrapper').dataset.ssl}/>,
     document.getElementById('mine-wrapper')
 );

assets/js/mine-seeker/app.js

@@ -11,13 +11,15 @@ class MineSeeker extends React.Component {
 
         this.state = {
             env: props.env,
+            ssl: props.ssl,
             gameInherited: props.gameId !== '',
             gameAssoc: gameAssoc,
             channel: channel,
             session: null,
             createGrid: false,
             stepCache: [],
-            disconnect: false
+            connectionLost: false,
+            end: false
         }
     }
 
@@ -30,7 +32,24 @@ class MineSeeker extends React.Component {
         return text;
     }
 
-    /** STEP */
+    currectGridSize() {
+        let $field = $('#mine-wrapper .grid');
+        $field.height($field.width());
+
+        $field = $('#mine-wrapper .grid .field-wrapper');
+        $field.height($field.width());
+
+        $('#mine-wrapper .grid .field-wrapper .field')
+            .height($field.width())
+            .css('line-height', ($field.width() - 2) + 'px');
+    }
+
+    /**
+     * STEP
+     *
+     * @param coords
+     * @returns {{red: *, blue: *}}
+     */
     makePointsCalcAndStep(coords) {
         let users = this.refs.gridControl.refs.userControl,
             activePlayer = users.state.activePlayer ? 'blue' : 'red',
@@ -51,7 +70,38 @@ class MineSeeker extends React.Component {
         return {red: redPoints, blue: bluePoints};
     }
 
-    /** THE END */
+    /**
+     * START
+     *
+     * @param payload
+     */
+    makeGameStart(payload) {
+        /** every time the blue starts */
+        this.refs.gridControl.refs.userControl.setState({activePlayer: 1});
+
+        /** Set up player names w/ server data */
+        this.refs.gridControl.refs.userControl.refs.red.setState({
+            name: payload.users.red !== '' ? payload.users.red : payload.users.redAnon,
+        });
+
+        this.refs.gridControl.refs.userControl.refs.blue.setState({
+            name: payload.users.blue !== '' ? payload.users.blue : payload.users.blueAnon,
+            desc: this.refs.gridControl.state.webPlayer === 'blue'
+                ? this.refs.gridControl.state.desc.you
+                : this.refs.gridControl.state.desc.buddy,
+            active: true,
+        });
+
+        this.refs.gridControl.setState({overlay: false});
+    }
+
+    /**
+     * THE END
+     *
+     * @param bluePoints
+     * @param redPoints
+     * @param resign
+     */
     makeGameEndIfItEnds(bluePoints, redPoints, resign = false) {
         let redWins = redPoints > 25,
             blueWins = bluePoints > 25;
@@ -86,10 +136,13 @@ class MineSeeker extends React.Component {
                 : "You WIN!"
         });
 
+        this.setState({end: true});
+
         this.makeGameEndIfItEnds(0, 0, true);
     }
 
     clickResign() {
+        /** PUBLISH */
         this.state.session.publish(this.state.channel, {
             'resign': this.refs.gridControl.refs.userControl.state.activePlayer ? 'blue' : 'red'
         });
@@ -119,13 +172,34 @@ class MineSeeker extends React.Component {
         }
     }
 
+    /**
+     * @see https://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus
+     * @see https://developers.facebook.com/docs/sharing/reference/send-dialog
+     * @see https://developers.facebook.com/docs/plugins/share-button/
+     */
+    clickFBShare() {
+        let display = 'popup';
+
+        FB.getLoginStatus(function (response) {
+            display = response.status === 'connected'
+                ? 'dialog'
+                : 'popup';
+        });
+
+        FB.ui({
+            method: 'send',
+            display: display,
+            link: window.location.href + '/' + this.state.gameAssoc,
+        });
+    }
+
     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(gridServer)) : gridClient,
+            grid: this.state.gameInherited ? gridServer : gridClient,
             channel: this.state.channel,
             desc: {
                 buddy: <div>
@@ -143,53 +217,51 @@ class MineSeeker extends React.Component {
             overlaySubTitle: this.state.gameAssoc
                 ?
                 <div>
+                    <h3>Share this unique link w/ your opponent</h3>
                     <div className="clippy">
                         <input id="foo"
                                defaultValue={window.location.href + '/' + this.state.gameAssoc}/>
-                        <button className="btn">
-                            <img src="/bundles/mineseeker/images/clippy.svg" alt="Copy to clipboard"/>
-                        </button>
                     </div>
+                    {this.state.env !== 'dev' &&
+                    <a onClick={this.clickFBShare.bind(this)}>Share in Facebook message</a>
+                    }
+                    {this.state.env === 'dev' &&
                     <a href={"/play/" + this.state.gameAssoc} target="_blank">Play w/ me!</a>
+                    }
                 </div>
                 : '',
             renderGridFields: this.state.gameAssoc
         });
     }
 
-    wSubscribe(payload) {
+    wSubscribe(payload, rpcUsers = null) {
         this.state.env === 'dev' && console.info(
             (typeof payload.user !== 'undefined' ? payload.user : 'user') + " has been subscribed to the channel!"
         );
 
-        if (!this.state.disconnect) {
+        let firstUser = !rpcUsers;
-            /** setup the web player */
+
-            null === this.refs.gridControl.state.webPlayer && this.refs.gridControl.setState({
+        this.refs.gridControl.state.webPlayer === null && this.refs.gridControl.setState({
-                webPlayer: payload.user === payload.users.blue || payload.user === payload.users.blueAnon
+            webPlayer: payload.user === payload.users.blue ||
-                    ? 'blue'
+            (
-                    : 'red'
+                firstUser && payload.users.blueAnon !== '' ||
+                !firstUser && (rpcUsers.blueAnon === '' && rpcUsers.blue === '')
+            )
+                ? 'blue' : 'red'
         });
 
+        /** rwd */
+        (900 > $(document).width()) && this.currectGridSize();
+
         /** every user has been came */
-            if (payload.userCnt === 2) {
+        if (
-                /** every time the blue starts */
+            payload.userCnt === 2 &&
-                this.refs.gridControl.refs.userControl.setState({activePlayer: 1});
+            (
-
+                !this.state.connectionLost ||
-                /** Set up player names w/ server data */
+                this.state.connectionLost && false === this.refs.gridControl.refs.userControl.state.activePlayer && !this.state.end
-                this.refs.gridControl.refs.userControl.refs.red.setState({
+            )
-                    name: payload.users.red !== '' ? payload.users.red : payload.users.redAnon,
+        ) {
-                });
+            this.makeGameStart(payload);
-
-                this.refs.gridControl.refs.userControl.refs.blue.setState({
-                    name: payload.users.blue !== '' ? payload.users.blue : payload.users.blueAnon,
-                    desc: this.refs.gridControl.state.webPlayer === 'blue'
-                        ? this.refs.gridControl.state.desc.you
-                        : this.refs.gridControl.state.desc.buddy,
-                    active: true,
-                });
-
-                this.refs.gridControl.setState({overlay: false});
-            }
         }
     }
 
@@ -226,7 +298,7 @@ class MineSeeker extends React.Component {
     }
 
     /** Connect - Subscribe */
-    subscribe() {
+    subscribe(rpcUsers = null) {
         this.state.session.subscribe(
             this.state.channel,
             (uri, payload, log) => {
@@ -238,30 +310,28 @@ class MineSeeker extends React.Component {
                     this.wTopic(payload);
                 } else {
                     if (isNotUnsubscribe) {
-                        this.wSubscribe(payload);
+                        this.wSubscribe(payload, rpcUsers);
                     } else {
                         this.wUnsubscribe(payload);
                     }
                 }
 
                 /** RECONNECTION */
-                if (payload.userCnt === 2 && this.state.disconnect) {
+                if (payload.userCnt === 2 && this.state.connectionLost) {
                     this.state.env === 'dev' && console.info('Reconnection process');
 
+                    /** PUBLISH */
                     let cache = this.state.stepCache;
                     cache.forEach((item) => this.state.session.publish(this.state.channel, item));
-                    this.setState({disconnect: false, stepCache: []});
+                    this.setState({connectionLost: false, stepCache: []});
                 }
             });
     }
 
-    /** after rendering */
+    connectWithWebsocket() {
-    componentDidMount() {
         /** Create Websocket w/ Bahnhof.js */
         let websocket = WS.connect(
-            this.state.env === 'dev'
+            (this.state.ssl === 'true' ? "wss" : "ws") + "://" + window.location.hostname + "/ws/"
-                ? "ws://mine.dev:6450"
-                : "ws://www.mineseeker.ninja:6450"
         );
 
         /**
@@ -271,7 +341,7 @@ class MineSeeker extends React.Component {
         websocket.on("socket/connect", (session) => {
             this.state.env === 'dev' && console.info("Successfully connected to the Server!");
 
-            if (!this.state.disconnect) {
+            if (!this.state.connectionLost) {
                 let gridClient = this.state.gameInherited || new Grid().state.grid;
 
                 /**
@@ -281,14 +351,29 @@ class MineSeeker extends React.Component {
                 session
                     .call(
                         this.state.gameInherited ? "mineseeker-rpc/connectGame" : "mineseeker-rpc/startGame",
-                        this.state.gameInherited ? this.state.gameAssoc : [Base64.encode(JSON.stringify(gridClient)), this.state.gameAssoc]
+                        this.state.gameInherited ? this.state.gameAssoc : [window.btoa(JSON.stringify(gridClient)), this.state.gameAssoc]
                     )
                     .then(
-                        (gridServer) => {
+                        (data) => {
-                            this.state.env === 'dev' && console.info("Grid has been created! Return w/ gameAssoc.");
+                            this.state.env === 'dev' && console.info('RPC has been called');
 
-                            this.wInit(session, gridServer, gridClient);
+                            let serverData = data[0] !== true
-                            this.subscribe();
+                                ? JSON.parse(window.atob(data))
+                                : data;
+
+                            /** Check the grid if the user is inherited @see #30 */
+                            if ((this.state.gameInherited && typeof serverData.grid !== 'undefined') || !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])
                     );
@@ -304,10 +389,17 @@ class MineSeeker extends React.Component {
          */
         websocket.on("socket/disconnect", (error) => {
             this.state.env === 'dev' && console.error("Disconnected for " + error.reason + " with code " + error.code);
-            this.setState({disconnect: true});
+
+            error.code === 6 && this.setState({connectionLost: true});
+            error.code === 3 && setTimeout(this.componentDidMount().bind(this), 500);
         });
     }
 
+    /** After rendering */
+    componentDidMount() {
+        this.connectWithWebsocket();
+    }
+
     /**
      * Cache the steps unless reconnection
      *
@@ -344,7 +436,7 @@ class MineSeeker extends React.Component {
                 };
 
                 /** PUBLISH */
-                !this.state.disconnect
+                !this.state.connectionLost
                     ? this.state.session.publish(this.state.channel, dataPack)
                     : this.cachePublish(dataPack);
             }

assets/js/mine-seeker/grid/grid-control.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import GridField from './grid-field';
 import UserControl from '../user/user-control';
+import {Howl, Howler} from 'howler';
 
 class GridControl extends React.Component {
     constructor(props) {
@@ -398,25 +399,23 @@ class GridControl extends React.Component {
     }
 
     overlayClass() {
-        return 'game-overlay' + ( this.state.overlay ? '' : ' hide' );
+        return 'game-overlay' + (this.state.overlay ? '' : ' hide');
     }
 
     renderGridFields() {
-        if (this.state.grid) {
         for (let i = 0, j = this.state.grid.length; i < j; i++) {
             for (let k = 0, l = this.state.grid[i].length; k < l; k++) {
                 this.state.gridFields.push(
                     <GridField row={i}
                                col={k}
                                ref={this.refString(i, k)}
-                                   key={i + k * Math.random() * 0.5}
+                               key={window.btoa((Math.random() * 0.5).toString())}
                                handleHoverOn={this.onHoverGridField.bind(this, [i, k])}
                                onClick={this.props.onClick.bind(null, [i, k])}/>
                 );
             }
         }
     }
-    }
 
     render() {
         /** Render the grid fields just one time in one party #12 */
@@ -436,7 +435,11 @@ class GridControl extends React.Component {
                              webPlayer={this.state.webPlayer}
                              bombClear={this.bombClear.bind(this)}/>
                 <div className="grid-container">
-                    <div className="grid"> {this.state.gridFields} </div>
+                    <div className="grid">
+                        <>
+                            {this.state.gridFields}
+                        </>
+                    </div>
                 </div>
             </div>
         );

assets/js/mine-seeker/grid/grid-field.js

@@ -12,7 +12,7 @@ class GridField extends React.Component {
             lastClickedBlue: false,
             bombTargetArea: null,
             icons: {
-                root: '/bundles/mineseeker/images/',
+                root: '/images/',
                 water: {
                     1: 'bg-wave-1-outbg.png',
                     2: 'bg-wave-1-outbg.png',
@@ -66,8 +66,8 @@ class GridField extends React.Component {
 
     lastClickedSrc() {
         return this.state.lastClickedRed
-            ? "/bundles/mineseeker/images/bg-last-red-outbg.png"
+            ? "/images/bg-last-red-outbg.png"
-            : "/bundles/mineseeker/images/bg-last-blue-outbg.png";
+            : "/images/bg-last-blue-outbg.png";
     }
 
     currentLastClicked() {
@@ -113,8 +113,8 @@ class GridField extends React.Component {
             }
 
             var src = vert === null
-                ? '/bundles/mineseeker/images/bg-bomb-empty-outbg.png'
+                ? '/images/bg-bomb-empty-outbg.png'
-                : '/bundles/mineseeker/images/bg-bomb-' + hor + '-' + vert + '-outbg.png';
+                : '/images/bg-bomb-' + hor + '-' + vert + '-outbg.png';
 
             return <img className="field-bomb-target"
                         src={src}
@@ -128,7 +128,7 @@ class GridField extends React.Component {
                  onClick={this.props.onClick}
                  onMouseEnter={this.props.handleHoverOn}>
                 <img className="field-target"
-                     src="/bundles/mineseeker/images/bg-target-outbg.png"
+                     src="/images/bg-target-outbg.png"
                      alt="target"/>
                 {this.createBombTarget()}
                 {this.currentLastClicked()}

assets/js/mine-seeker/user/user.js

@@ -10,7 +10,7 @@ class User extends React.Component {
             active: props.active,
             color: props.color === 'blue' ? 1 : 0,
             mines: 0,
-            srcRoot: '/bundles/mineseeker/images/',
+            srcRoot: '/images/',
             haveBomb: true,
             enabledBomb: true
         };

bin/console

@@ -1,29 +1,39 @@
 #!/usr/bin/env php
 <?php
 
+use App\Kernel;
 use Symfony\Bundle\FrameworkBundle\Console\Application;
 use Symfony\Component\Console\Input\ArgvInput;
 use Symfony\Component\Debug\Debug;
-
+use Symfony\Component\Dotenv\Dotenv;
-// if you don't want to setup permissions the proper way, just uncomment the following PHP line
-// read http://symfony.com/doc/current/book/installation.html#configuration-and-setup for more information
-//umask(0000);
 
 set_time_limit(0);
 
-/**
+require __DIR__.'/../vendor/autoload.php';
- * @var Composer\Autoload\ClassLoader $loader
- */
-$loader = require __DIR__.'/../app/autoload.php';
 
-$input = new ArgvInput();
+if (!class_exists(Application::class)) {
-$env = $input->getParameterOption(['--env', '-e'], getenv('SYMFONY_ENV') ?: 'dev');
+    throw new \RuntimeException('You need to add "symfony/framework-bundle" as a Composer dependency.');
-$debug = getenv('SYMFONY_DEBUG') !== '0' && !$input->hasParameterOption(['--no-debug', '']) && $env !== 'prod';
-
-if ($debug) {
-    Debug::enable();
 }
 
-$kernel = new AppKernel($env, $debug);
+if (!isset($_SERVER['APP_ENV'])) {
+    if (!class_exists(Dotenv::class)) {
+        throw new \RuntimeException('APP_ENV environment variable is not defined. You need to define environment variables for configuration or add "symfony/dotenv" as a Composer dependency to load variables from a .env file.');
+    }
+    (new Dotenv())->load(__DIR__.'/../.env');
+}
+
+$input = new ArgvInput();
+$env = $input->getParameterOption(['--env', '-e'], $_SERVER['APP_ENV'] ?? 'dev', true);
+$debug = (bool) ($_SERVER['APP_DEBUG'] ?? ('prod' !== $env)) && !$input->hasParameterOption('--no-debug', true);
+
+if ($debug) {
+    umask(0000);
+
+    if (class_exists(Debug::class)) {
+        Debug::enable();
+    }
+}
+
+$kernel = new Kernel($env, $debug);
 $application = new Application($kernel);
 $application->run($input);

bin/symfony_requirements

@@ -1,146 +0,0 @@
-#!/usr/bin/env php
-<?php
-
-require_once dirname(__FILE__).'/../var/SymfonyRequirements.php';
-
-$lineSize = 70;
-$symfonyRequirements = new SymfonyRequirements();
-$iniPath = $symfonyRequirements->getPhpIniConfigPath();
-
-echo_title('Symfony Requirements Checker');
-
-echo '> PHP is using the following php.ini file:'.PHP_EOL;
-if ($iniPath) {
-    echo_style('green', '  '.$iniPath);
-} else {
-    echo_style('yellow', '  WARNING: No configuration file (php.ini) used by PHP!');
-}
-
-echo PHP_EOL.PHP_EOL;
-
-echo '> Checking Symfony requirements:'.PHP_EOL.'  ';
-
-$messages = array();
-foreach ($symfonyRequirements->getRequirements() as $req) {
-    if ($helpText = get_error_message($req, $lineSize)) {
-        echo_style('red', 'E');
-        $messages['error'][] = $helpText;
-    } else {
-        echo_style('green', '.');
-    }
-}
-
-$checkPassed = empty($messages['error']);
-
-foreach ($symfonyRequirements->getRecommendations() as $req) {
-    if ($helpText = get_error_message($req, $lineSize)) {
-        echo_style('yellow', 'W');
-        $messages['warning'][] = $helpText;
-    } else {
-        echo_style('green', '.');
-    }
-}
-
-if ($checkPassed) {
-    echo_block('success', 'OK', 'Your system is ready to run Symfony projects');
-} else {
-    echo_block('error', 'ERROR', 'Your system is not ready to run Symfony projects');
-
-    echo_title('Fix the following mandatory requirements', 'red');
-
-    foreach ($messages['error'] as $helpText) {
-        echo ' * '.$helpText.PHP_EOL;
-    }
-}
-
-if (!empty($messages['warning'])) {
-    echo_title('Optional recommendations to improve your setup', 'yellow');
-
-    foreach ($messages['warning'] as $helpText) {
-        echo ' * '.$helpText.PHP_EOL;
-    }
-}
-
-echo PHP_EOL;
-echo_style('title', 'Note');
-echo '  The command console could use a different php.ini file'.PHP_EOL;
-echo_style('title', '~~~~');
-echo '  than the one used with your web server. To be on the'.PHP_EOL;
-echo '      safe side, please check the requirements from your web'.PHP_EOL;
-echo '      server using the ';
-echo_style('yellow', 'web/config.php');
-echo ' script.'.PHP_EOL;
-echo PHP_EOL;
-
-exit($checkPassed ? 0 : 1);
-
-function get_error_message(Requirement $requirement, $lineSize)
-{
-    if ($requirement->isFulfilled()) {
-        return;
-    }
-
-    $errorMessage = wordwrap($requirement->getTestMessage(), $lineSize - 3, PHP_EOL.'   ').PHP_EOL;
-    $errorMessage .= '   > '.wordwrap($requirement->getHelpText(), $lineSize - 5, PHP_EOL.'   > ').PHP_EOL;
-
-    return $errorMessage;
-}
-
-function echo_title($title, $style = null)
-{
-    $style = $style ?: 'title';
-
-    echo PHP_EOL;
-    echo_style($style, $title.PHP_EOL);
-    echo_style($style, str_repeat('~', strlen($title)).PHP_EOL);
-    echo PHP_EOL;
-}
-
-function echo_style($style, $message)
-{
-    // ANSI color codes
-    $styles = array(
-        'reset' => "\033[0m",
-        'red' => "\033[31m",
-        'green' => "\033[32m",
-        'yellow' => "\033[33m",
-        'error' => "\033[37;41m",
-        'success' => "\033[37;42m",
-        'title' => "\033[34m",
-    );
-    $supports = has_color_support();
-
-    echo($supports ? $styles[$style] : '').$message.($supports ? $styles['reset'] : '');
-}
-
-function echo_block($style, $title, $message)
-{
-    $message = ' '.trim($message).' ';
-    $width = strlen($message);
-
-    echo PHP_EOL.PHP_EOL;
-
-    echo_style($style, str_repeat(' ', $width));
-    echo PHP_EOL;
-    echo_style($style, str_pad(' ['.$title.']', $width, ' ', STR_PAD_RIGHT));
-    echo PHP_EOL;
-    echo_style($style, $message);
-    echo PHP_EOL;
-    echo_style($style, str_repeat(' ', $width));
-    echo PHP_EOL;
-}
-
-function has_color_support()
-{
-    static $support;
-
-    if (null === $support) {
-        if (DIRECTORY_SEPARATOR == '\\') {
-            $support = false !== getenv('ANSICON') || 'ON' === getenv('ConEmuANSI');
-        } else {
-            $support = function_exists('posix_isatty') && @posix_isatty(STDOUT);
-        }
-    }
-
-    return $support;
-}

composer.json

@@ -1,70 +1,76 @@
 {
-    "name": "root/mine",
-    "license": "proprietary",
     "type": "project",
+    "license": "proprietary",
+    "require": {
+        "php": "^7.3",
+        "ext-iconv": "*",
+        "ext-json": "*",
+        "doctrine/doctrine-migrations-bundle": "^2.0",
+        "doctrine/orm": "^2.6",
+        "gos/web-socket-bundle": "^1.8",
+        "sensio/framework-extra-bundle": "^5.5",
+        "sonata-project/admin-bundle": "^3.0",
+        "sonata-project/doctrine-orm-admin-bundle": "^3.0",
+        "sonata-project/user-bundle": "^4.0",
+        "symfony/console": "^4.0",
+        "symfony/flex": "^1.0",
+        "symfony/framework-bundle": "^4.0",
+        "symfony/mailer": "^4.0",
+        "symfony/monolog-bundle": "^3.4",
+        "symfony/orm-pack": "^1.0",
+        "symfony/polyfill-apcu": "^1.0",
+        "symfony/twig-bundle": "^4.0",
+        "symfony/webpack-encore-bundle": "^1.7",
+        "symfony/yaml": "^4.0"
+    },
+    "require-dev": {
+        "roave/security-advisories": "dev-master",
+        "symfony/dotenv": "^4.0",
+        "symfony/profiler-pack": "^1.0",
+        "symfony/maker-bundle": "^1.5"
+    },
+    "config": {
+        "preferred-install": {
+            "*": "dist"
+        },
+        "sort-packages": true
+    },
     "autoload": {
         "psr-4": {
-            "": "src/"
+            "App\\": "src/"
-        },
+        }
-        "classmap": [
-            "app/AppKernel.php",
-            "app/AppCache.php"
-        ]
     },
     "autoload-dev": {
         "psr-4": {
-            "Tests\\": "tests/"
+            "App\\Tests\\": "tests/"
         }
     },
-    "require": {
+    "replace": {
-        "php": ">=5.5.9",
+        "symfony/polyfill-iconv": "*",
-        "symfony/symfony": "3.1.*",
+        "symfony/polyfill-php73": "*",
-        "doctrine/orm": "^2.5",
+        "symfony/polyfill-php72": "*",
-        "doctrine/doctrine-bundle": "^1.6",
+        "symfony/polyfill-php71": "*",
-        "doctrine/doctrine-cache-bundle": "^1.3",
+        "symfony/polyfill-php70": "*",
-        "symfony/swiftmailer-bundle": "^2.3",
+        "symfony/polyfill-php56": "*"
-        "symfony/monolog-bundle": "^2.8",
-        "symfony/polyfill-apcu": "^1.0",
-        "sensio/distribution-bundle": "^5.0",
-        "sensio/framework-extra-bundle": "^3.0.2",
-        "incenteev/composer-parameter-handler": "^2.0",
-        "gos/web-socket-bundle": "^1.8",
-        "friendsofsymfony/user-bundle": "~2.0@dev",
-        "doctrine/doctrine-migrations-bundle": "^1.0",
-        "symfony/assetic-bundle": "^2.8",
-        "predis/predis": "^1.0",
-        "snc/redis-bundle": "^2.0",
-        "hwi/oauth-bundle": "^0.5.1"
-    },
-    "require-dev": {
-        "sensio/generator-bundle": "^3.0",
-        "symfony/phpunit-bridge": "^3.0"
     },
     "scripts": {
-        "symfony-scripts": [
+        "auto-scripts": {
-            "Incenteev\\ParameterHandler\\ScriptHandler::buildParameters",
+            "cache:clear": "symfony-cmd",
-            "Sensio\\Bundle\\DistributionBundle\\Composer\\ScriptHandler::buildBootstrap",
+            "assets:install --symlink --relative %PUBLIC_DIR%": "symfony-cmd"
-            "Sensio\\Bundle\\DistributionBundle\\Composer\\ScriptHandler::clearCache",
+        },
-            "Sensio\\Bundle\\DistributionBundle\\Composer\\ScriptHandler::installAssets",
-            "Sensio\\Bundle\\DistributionBundle\\Composer\\ScriptHandler::installRequirementsFile",
-            "Sensio\\Bundle\\DistributionBundle\\Composer\\ScriptHandler::prepareDeploymentTarget"
-        ],
         "post-install-cmd": [
-            "@symfony-scripts"
+            "@auto-scripts"
         ],
         "post-update-cmd": [
-            "@symfony-scripts"
+            "@auto-scripts"
         ]
     },
+    "conflict": {
+        "symfony/symfony": "*"
+    },
     "extra": {
-        "symfony-app-dir": "app",
+        "symfony": {
-        "symfony-bin-dir": "bin",
+            "allow-contrib": false
-        "symfony-var-dir": "var",
-        "symfony-web-dir": "web",
-        "symfony-tests-dir": "tests",
-        "symfony-assets-install": "relative",
-        "incenteev-parameters": {
-            "file": "app/config/parameters.yml"
         }
     }
 }

config/bundles.php

@@ -0,0 +1,27 @@
+<?php
+
+return [
+    Symfony\Bundle\FrameworkBundle\FrameworkBundle::class => ['all' => true],
+    Symfony\Bundle\WebProfilerBundle\WebProfilerBundle::class => ['dev' => true, 'test' => true],
+    Symfony\Bundle\TwigBundle\TwigBundle::class => ['all' => true],
+    Symfony\Bundle\MakerBundle\MakerBundle::class => ['dev' => true],
+    Doctrine\Bundle\DoctrineCacheBundle\DoctrineCacheBundle::class => ['all' => true],
+    Doctrine\Bundle\DoctrineBundle\DoctrineBundle::class => ['all' => true],
+    Doctrine\Bundle\MigrationsBundle\DoctrineMigrationsBundle::class => ['all' => true],
+    Symfony\Bundle\SecurityBundle\SecurityBundle::class => ['all' => true],
+    Sonata\DatagridBundle\SonataDatagridBundle::class => ['all' => true],
+    Sonata\CoreBundle\SonataCoreBundle::class => ['all' => true],
+    Sonata\BlockBundle\SonataBlockBundle::class => ['all' => true],
+    Knp\Bundle\MenuBundle\KnpMenuBundle::class => ['all' => true],
+    Sonata\AdminBundle\SonataAdminBundle::class => ['all' => true],
+    Sonata\EasyExtendsBundle\SonataEasyExtendsBundle::class => ['all' => true],
+    FOS\UserBundle\FOSUserBundle::class => ['all' => true],
+    Sonata\UserBundle\SonataUserBundle::class => ['all' => true],
+    App\Application\Sonata\UserBundle\ApplicationSonataUserBundle::class => ['all' => true],
+    Sonata\DoctrineORMAdminBundle\SonataDoctrineORMAdminBundle::class => ['all' => true],
+    Gos\Bundle\PubSubRouterBundle\GosPubSubRouterBundle::class => ['all' => true],
+    Gos\Bundle\WebSocketBundle\GosWebSocketBundle::class => ['all' => true],
+    Symfony\WebpackEncoreBundle\WebpackEncoreBundle::class => ['all' => true],
+    Symfony\Bundle\MonologBundle\MonologBundle::class => ['all' => true],
+    Sensio\Bundle\FrameworkExtraBundle\SensioFrameworkExtraBundle::class => ['all' => true],
+];

config/packages/assets.yaml

@@ -0,0 +1,3 @@
+framework:
+    assets:
+        json_manifest_path: '%kernel.project_dir%/public/build/manifest.json'

config/packages/dev/monolog.yaml

@@ -0,0 +1,19 @@
+monolog:
+    handlers:
+        main:
+            type: stream
+            path: "%kernel.logs_dir%/%kernel.environment%.log"
+            level: error
+            channels: ["!event"]
+        # uncomment to get logging in your browser
+        # you may have to allow bigger header sizes in your Web server configuration
+        #firephp:
+        #    type: firephp
+        #    level: info
+        #chromephp:
+        #    type: chromephp
+        #    level: info
+        console:
+            type: console
+            process_psr_3_messages: false
+            channels: ["!event", "!doctrine", "!console"]

config/packages/dev/routing.yaml

@@ -0,0 +1,3 @@
+framework:
+    router:
+        strict_requirements: true

config/packages/dev/web_profiler.yaml

@@ -0,0 +1,6 @@
+web_profiler:
+    toolbar: true
+    intercept_redirects: false
+
+framework:
+    profiler: { only_exceptions: false }

config/packages/doctrine.yaml

@@ -0,0 +1,34 @@
+parameters:
+    # Adds a fallback DATABASE_URL if the env var is not set.
+    # This allows you to run cache:warmup even if your
+    # environment variables are not available yet.
+    # You should not need to change this value.
+    env(DATABASE_URL): ''
+
+doctrine:
+    dbal:
+        # configure these for your database server
+        driver: 'pdo_mysql'
+        server_version: '5.7'
+        charset: utf8mb4
+        default_table_options:
+            charset: utf8mb4
+            collate: utf8mb4_unicode_ci
+
+        url: '%env(resolve:DATABASE_URL)%'
+        types:
+            json: Sonata\Doctrine\Types\JsonType
+    orm:
+        auto_generate_proxy_classes: '%kernel.debug%'
+        naming_strategy: doctrine.orm.naming_strategy.underscore
+        auto_mapping: true
+        mappings:
+            App:
+                is_bundle: false
+                type: annotation
+                dir: '%kernel.project_dir%/src/Entity'
+                prefix: 'App\Entity'
+                alias: App
+            SonataUserBundle: ~
+            FOSUserBundle: ~
+            ApplicationSonataUserBundle: ~

config/packages/doctrine_migrations.yaml

@@ -0,0 +1,5 @@
+doctrine_migrations:
+    dir_name: '%kernel.project_dir%/src/Migrations'
+    # namespace is arbitrary but should be different from App\Migrations
+    # as migrations classes should NOT be autoloaded
+    namespace: DoctrineMigrations

config/packages/fos_user.yaml

@@ -0,0 +1,13 @@
+fos_user:
+    db_driver:      orm # can be orm or odm
+    firewall_name:  main
+    user_class:     App\Application\Sonata\UserBundle\Entity\User
+    group:
+        group_class:   App\Application\Sonata\UserBundle\Entity\Group
+        group_manager: sonata.user.orm.group_manager # If you're using doctrine orm (use sonata.user.mongodb.group_manager for mongodb)
+    service:
+        user_manager: sonata.user.orm.user_manager
+        mailer: 'fos_user.mailer.noop'
+    from_email:
+        address: '%env(MAILER_USER_ADDRESS)%'
+        sender_name: '%env(MAILER_USER_NAME)%'

config/packages/framework.yaml

@@ -0,0 +1,32 @@
+framework:
+    secret: '%env(APP_SECRET)%'
+    #default_locale: en
+    #csrf_protection: true
+    #http_method_override: true
+    templating:
+        engines: ['twig']
+
+    # Enables session support. Note that the session will ONLY be started if you read or write from it.
+    # Remove or comment this section to explicitly disable session support.
+    session:
+        handler_id: ~
+
+    #esi: true
+    #fragments: true
+    php_errors:
+        log: true
+
+    cache:
+        # Put the unique name of your app here: the prefix seed
+        # is used to compute stable namespaces for cache keys.
+        #prefix_seed: your_vendor_name/app_name
+
+        # The app cache caches to the filesystem by default.
+        # Other options include:
+
+        # Redis
+        #app: cache.adapter.redis
+        #default_redis_provider: redis://localhost
+
+        # APCu (not recommended with heavy random-write workloads as memory fragmentation can cause perf issues)
+        #app: cache.adapter.apcu

config/packages/gos_web_socket.yaml

@@ -0,0 +1,27 @@
+#doctrine_cache:
+#    providers:
+#        redis_cache:
+#            redis:
+#                host: localhost
+#                port: 6379
+#                database: 3
+#        websocket_cache_client:
+#            type: redis
+#            alias: gos_web_socket.client_storage.driver.redis
+
+gos_web_socket:
+    server:
+        host: 0.0.0.0
+        port: "%mineseeker.websocket%"
+        router:
+            resources:
+                - '%kernel.project_dir%/config/pubsub/routing.yaml'
+    client:
+        firewall: secured_area
+    #        session_handler: "@session.handler.pdo"
+    #        storage:
+    #            driver: "@gos_web_socket.client_storage.driver.predis"
+    #            ttl: 28800 #(optionally) time to live if you use redis driver
+    #            prefix: client #(optionally) prefix if you use redis driver, create key "client:1" instead key "1"
+    periodic:
+        - '@mineseeker.periodic'

config/packages/mailer.yaml

@@ -0,0 +1,3 @@
+framework:
+    mailer:
+        dsn: '%env(MAILER_DSN)%'

config/packages/prod/doctrine.yaml

@@ -0,0 +1,31 @@
+doctrine:
+    orm:
+        metadata_cache_driver:
+            type: service
+            id: doctrine.system_cache_provider
+        query_cache_driver:
+            type: service
+            id: doctrine.system_cache_provider
+        result_cache_driver:
+            type: service
+            id: doctrine.result_cache_provider
+
+services:
+    doctrine.result_cache_provider:
+        class: Symfony\Component\Cache\DoctrineProvider
+        public: false
+        arguments:
+            - '@doctrine.result_cache_pool'
+    doctrine.system_cache_provider:
+        class: Symfony\Component\Cache\DoctrineProvider
+        public: false
+        arguments:
+            - '@doctrine.system_cache_pool'
+
+framework:
+    cache:
+        pools:
+            doctrine.result_cache_pool:
+                adapter: cache.app
+            doctrine.system_cache_pool:
+                adapter: cache.system

config/packages/prod/monolog.yaml

@@ -0,0 +1,23 @@
+monolog:
+    handlers:
+        main:
+            type: fingers_crossed
+            action_level: error
+            handler: nested
+            excluded_http_codes: [404, 405]
+        nested:
+            type: stream
+            path: "%kernel.logs_dir%/%kernel.environment%.log"
+            level: debug
+        console:
+            type: console
+            process_psr_3_messages: false
+            channels: ["!event", "!doctrine"]
+        deprecation:
+            type: stream
+            path: "%kernel.logs_dir%/%kernel.environment%.deprecations.log"
+        deprecation_filter:
+            type: filter
+            handler: deprecation
+            max_level: info
+            channels: ["php"]

config/packages/prod/webpack_encore.yaml

@@ -0,0 +1,4 @@
+#webpack_encore:
+    # Cache the entrypoints.json (rebuild Symfony's cache when entrypoints.json changes)
+    # Available in version 1.2
+    #cache: true

config/packages/routing.yaml

@@ -0,0 +1,3 @@
+framework:
+    router:
+        strict_requirements: ~

config/packages/security.yaml

@@ -0,0 +1,24 @@
+security:
+    # https://symfony.com/doc/current/security.html#where-do-users-come-from-user-providers
+    providers:
+        in_memory: { memory: ~ }
+    firewalls:
+        dev:
+            pattern: ^/(_(profiler|wdt)|css|images|js)/
+            security: false
+        main:
+            anonymous: true
+
+            # activate different ways to authenticate
+
+            # http_basic: true
+            # https://symfony.com/doc/current/security.html#a-configuring-how-your-users-will-authenticate
+
+            # form_login: true
+            # https://symfony.com/doc/current/security/form_login_setup.html
+
+    # Easy way to control access for large sections of your site
+    # Note: Only the *first* access control that matches will be used
+    access_control:
+        # - { path: ^/admin, roles: ROLE_ADMIN }
+        # - { path: ^/profile, roles: ROLE_USER }

config/packages/sensio_framework_extra.yaml

@@ -0,0 +1,3 @@
+sensio_framework_extra:
+    router:
+        annotations: false

config/packages/sonata_admin.yaml

@@ -0,0 +1,10 @@
+sonata_admin:
+    title: 'Sonata Admin'
+    dashboard:
+        blocks:
+            - { type: sonata.admin.block.admin_list, position: left }
+
+sonata_block:
+    blocks:
+        sonata.admin.block.admin_list:
+            contexts: [admin]

config/packages/sonata_core.yaml

@@ -0,0 +1,4 @@
+sonata_core:
+    form:
+        mapping:
+            enabled: false

config/packages/sonata_user.yaml

@@ -0,0 +1,6 @@
+sonata_user:
+    security_acl: false
+    manager_type: orm # can be orm or mongodb
+    class:
+        user: App\Application\Sonata\UserBundle\Entity\User
+        group: App\Application\Sonata\UserBundle\Entity\Group

config/packages/test/framework.yaml

@@ -0,0 +1,4 @@
+framework:
+    test: true
+    session:
+        storage_id: session.storage.mock_file

config/packages/test/monolog.yaml

@@ -0,0 +1,7 @@
+monolog:
+    handlers:
+        main:
+            type: stream
+            path: "%kernel.logs_dir%/%kernel.environment%.log"
+            level: debug
+            channels: ["!event"]

config/packages/test/web_profiler.yaml

@@ -0,0 +1,6 @@
+web_profiler:
+    toolbar: false
+    intercept_redirects: false
+
+framework:
+    profiler: { collect: false }

config/packages/translation.yaml

@@ -0,0 +1,7 @@
+framework:
+    default_locale: '%locale%'
+    translator:
+        paths:
+            - '%kernel.project_dir%/translations'
+        fallbacks:
+            - '%locale%'

config/packages/twig.yaml

@@ -0,0 +1,9 @@
+twig:
+    paths: ['%kernel.project_dir%/templates']
+    debug: '%kernel.debug%'
+    strict_variables: '%kernel.debug%'
+    globals:
+        version: "%jotunheimr.version%"
+        facebook_api: "%facebook.api%"
+        facebook_scope: "%facebook.scope%"
+        facebook_api_version: "%facebook.version%"

config/packages/twig_extensions.yaml

@@ -0,0 +1,10 @@
+services:
+    _defaults:
+        public: false
+        autowire: true
+        autoconfigure: true
+
+    #Twig\Extensions\ArrayExtension: ~
+    #Twig\Extensions\DateExtension: ~
+    #Twig\Extensions\IntlExtension: ~
+    #Twig\Extensions\TextExtension: ~

config/packages/webpack_encore.yaml

@@ -0,0 +1,14 @@
+webpack_encore:
+    # The path where Encore is building the assets.
+    # This should match Encore.setOutputPath() in webpack.config.js.
+    output_path: '%kernel.project_dir%/public/build'
+    # If multiple builds are defined (as shown below), you can disable the default build:
+    # output_path: false
+
+    # if using Encore.enableIntegrityHashes() specify the crossorigin attribute value (default: false, or use 'anonymous' or 'use-credentials')
+    # crossorigin: 'anonymous'
+
+    # Cache the entrypoints.json (rebuild Symfony's cache when entrypoints.json changes).
+    # To enable caching for the production environment, creating a webpack_encore.yaml in the config/packages/prod directory with this value set to true
+    # Available in version 1.2
+    #cache: false

config/pubsub/routing.yaml

@@ -1,4 +1,4 @@
-# Topic Configuration
+## Topic Configuration
 mineseeker_topic:
     channel: mineseeker/channel/{game}
     handler:

config/routes.yaml

@@ -0,0 +1,3 @@
+#index:
+#    path: /
+#    controller: App\Controller\DefaultController::index

config/routes/annotations.yaml

@@ -0,0 +1,3 @@
+controllers:
+    resource: ../../src/Controller/
+    type: annotation

config/routes/dev/twig.yaml

@@ -0,0 +1,3 @@
+_errors:
+    resource: '@TwigBundle/Resources/config/routing/errors.xml'
+    prefix: /_error

config/routes/dev/web_profiler.yaml

@@ -0,0 +1,7 @@
+web_profiler_wdt:
+    resource: '@WebProfilerBundle/Resources/config/routing/wdt.xml'
+    prefix: /_wdt
+
+web_profiler_profiler:
+    resource: '@WebProfilerBundle/Resources/config/routing/profiler.xml'
+    prefix: /_profiler

config/routes/mineseeker.yaml

@@ -0,0 +1,27 @@
+MineSeekerBundle_homepage:
+    path:     /
+    controller: App\Controller\GameController:index
+
+MineSeekerBundle_gamePlay:
+    path:     /play
+    controller: App\Controller\GameController:play
+
+MineSeekerBundle_gamePlayWId:
+    path:     /play/{gameAssoc}
+    controller: App\Controller\GameController:play
+
+MineSeekerBundle_terms:
+    path:     /terms-of-service
+    controller: App\Controller\GameController:terms
+
+MineSeekerBundle_privacy:
+    path:     /privacy-policy
+    controller: App\Controller\GameController:privacy
+
+MineSeekerBundle_contact:
+    path:     /contact
+    controller: App\Controller\GameController:contact
+
+MineSeekerBundle_landing:
+    path:     /landing-page
+    controller: App\Controller\GameController:landing

config/routes/sonata_admin.yaml

@@ -0,0 +1,8 @@
+admin_area:
+    resource: "@SonataAdminBundle/Resources/config/routing/sonata_admin.xml"
+    prefix: /admin
+
+_sonata_admin:
+    resource: .
+    type: sonata_admin
+    prefix: /admin

config/routes/sonata_user.yaml

@@ -0,0 +1,7 @@
+sonata_user_admin_security:
+    resource: '@SonataUserBundle/Resources/config/routing/admin_security.xml'
+    prefix: /admin
+
+sonata_user_admin_resetting:
+    resource: '@SonataUserBundle/Resources/config/routing/admin_resetting.xml'
+    prefix: /admin/resetting

config/services.yaml

@@ -0,0 +1,61 @@
+# Put parameters here that don't need to change on each machine where the app is deployed
+# https://symfony.com/doc/current/best_practices/configuration.html#application-related-configuration
+parameters:
+    locale: 'en'
+    jotunheimr.version: 1.1.0-20191026
+    facebook.api: 320599508311862
+    facebook.api-secret: 18d4f48cdd274bccee2678e5eff3f557
+    facebook.version: 'v2.8'
+    facebook.scope: 'public_profile,email,user_friends'
+    mineseeker.websocket: 6450
+
+services:
+    # default configuration for services in *this* file
+    _defaults:
+        autowire: true      # Automatically injects dependencies in your services.
+        autoconfigure: true # Automatically registers your services as commands, event subscribers, etc.
+        public: false       # Allows optimizing the container by removing unused services; this also means
+                            # fetching services directly from the container via $container->get() won't work.
+                            # The best practice is to be explicit about your dependencies anyway.
+
+    # makes classes in src/ available to be used as services
+    # this creates a service per class whose id is the fully-qualified class name
+    App\:
+        resource: '../src/*'
+        exclude: '../src/{Entity,Migrations,Tests,Kernel.php}'
+
+    # controllers are imported separately to make sure services can be injected
+    # as action arguments even if you don't extend any base controller class
+    App\Controller\:
+        resource: '../src/Controller'
+        tags: ['controller.service_arguments']
+
+    # add more service definitions when explicit configuration is needed
+    # please note that last definitions always *replace* previous ones
+
+    mineseeker.periodic:
+        class: App\Periodic\MinePeriodic
+        tags:
+            - { name: gos_web_socket.periodic }
+        arguments:
+            - '@gos_web_socket.pdo.periodic_ping'
+
+    mineseeker.topic_sample_service:
+        class: App\Topic\MineseekerTopic
+        tags:
+            - { name: gos_web_socket.topic }
+
+    mineseeker.rpc_sample_service:
+        class: App\Rpc\MineseekerRpc
+        public: true
+        tags:
+            - { name: gos_web_socket.rpc }
+
+    gos_web_socket_server.client_event.listener:
+        class: App\EventListener\MineseekerClientEventListener
+        tags:
+            - { name: kernel.event_listener, event: 'gos_web_socket.client_connected', method: onClientConnect }
+            - { name: kernel.event_listener, event: 'gos_web_socket.client_disconnected', method: onClientDisconnect }
+            - { name: kernel.event_listener, event: 'gos_web_socket.client_error', method: onClientError }
+            - { name: kernel.event_listener, event: 'gos_web_socket.server_launched', method: onServerStart }
+            - { name: kernel.event_listener, event: 'gos_web_socket.client_rejected', method: onClientRejected }

node_modules

@@ -1 +0,0 @@
-src/Mine/SeekerBundle/Resources/public/js/node

package.json

@@ -2,30 +2,6 @@
     "name": "mine-seeker",
     "version": "1.0.0",
     "description": "Mine Seeker Game by system7",
-  "directories": {
-    "test": "tests"
-  },
-  "dependencies": {
-    "babel-core": "^6.14.0",
-    "babel-loader": "^6.2.5",
-    "babel-preset-es2015": "^6.14.0",
-    "babel-preset-react": "^6.11.1",
-    "howler": "^2.0.1",
-    "js-base64": "^2.1.9",
-    "react": "^15.3.2",
-    "react-dom": "^15.3.2",
-    "uglify-js": "^2.7.4",
-    "uglifycss": "0.0.25",
-    "webpack": "^1.13.3"
-  },
-  "devDependencies": {},
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
-  },
-  "repository": {
-    "type": "git",
-    "url": "ssh://Lang@amelia:/home/git/repositories/mine.git"
-  },
     "keywords": [
         "mine",
         "seeker",
@@ -34,5 +10,37 @@
         "websocket"
     ],
     "author": "Laszlo Lang <system7>",
-  "license": "ISC"
+    "license": "UNLICENSED",
+    "private": true,
+    "dependencies": {
+        "@fortawesome/fontawesome-free": "^5.2.0",
+        "autobahn": "^19.10.1",
+        "bootstrap": "3",
+        "buffer": "^5.4.3",
+        "howler": "^2.1.2",
+        "jquery": "^3.4.1",
+        "js-base64": "^2.1.9",
+        "prop-types": "^15.7.2",
+        "react": "^16.11.0",
+        "react-dom": "^16.11.0",
+        "uglify-js": "^2.7.4",
+        "uglifycss": "0.0.25"
+    },
+    "devDependencies": {
+        "@babel/preset-react": "^7.6.3",
+        "@symfony/webpack-encore": "^0.28.0",
+        "autoprefixer": "^7.2.2",
+        "babel-polyfill": "^6.26.0",
+        "babel-preset-env": "^1.7.0",
+        "core-js": "^3.0.0",
+        "node-sass": "^4.12.0",
+        "sass-loader": "^7.1.0",
+        "webpack-notifier": "^1.6.0"
+    },
+    "scripts": {
+        "dev-server": "encore dev-server",
+        "dev": "encore dev",
+        "watch": "encore dev --watch",
+        "build": "encore production"
+    }
 }

phpunit.xml.dist

@@ -1,31 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-
-<!-- https://phpunit.de/manual/current/en/appendixes.configuration.html -->
-<phpunit xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
-         xsi:noNamespaceSchemaLocation="http://schema.phpunit.de/4.8/phpunit.xsd"
-         backupGlobals="false"
-         colors="true"
-         bootstrap="app/autoload.php"
->
-    <php>
-        <ini name="error_reporting" value="-1" />
-        <server name="KERNEL_DIR" value="app/" />
-    </php>
-
-    <testsuites>
-        <testsuite name="Project Test Suite">
-            <directory>tests</directory>
-        </testsuite>
-    </testsuites>
-
-    <filter>
-        <whitelist>
-            <directory>src</directory>
-            <exclude>
-                <directory>src/*Bundle/Resources</directory>
-                <directory>src/*/*Bundle/Resources</directory>
-                <directory>src/*/Bundle/*Bundle/Resources</directory>
-            </exclude>
-        </whitelist>
-    </filter>
-</phpunit>