made falling scooters mobile ready, moved insta gfx to graphics folder

4 years ago · fd5566c443
20 changed files with 16 additions and 3 deletions
--- a/.DS_Store
+++ b/.DS_Store
--- a/graphics/falling-scooters/README.md
+++ b/graphics/falling-scooters/README.md
--- a/graphics/falling-scooters/assets/fruit-sprites.json
+++ b/graphics/falling-scooters/assets/fruit-sprites.json
--- a/graphics/falling-scooters/assets/tier.png
+++ b/graphics/falling-scooters/assets/tier.png
--- a/graphics/falling-scooters/index.html
+++ b/graphics/falling-scooters/index.html
@ -25,14 +25,23 @@

        #game
        {
+            width: 100;
+            height: 100;
            margin: 0 auto;
        }
+        
+        #inviteDiv {
+            color: aquamarine;
+            font-size: 30px;
+            position: absolute;
+            pointer-events: none;
+        }
    </style>
 </head>
 <body>
 <script src="phaser.min.js?v=3100" charset="utf-8"></script>
 <script src="index.js" charset="utf-8"></script>
-
+<div id="inviteDiv"><h1>YOU'RE INVITED!<h1></div>
 <div id="game"></div>

 </body>
--- a/graphics/falling-scooters/index.js
+++ b/graphics/falling-scooters/index.js
@ -1,5 +1,7 @@
 /*
 *  This example show how to load complex shapes created with PhysicsEditor (https://www.codeandweb.com/physicseditor)
+ *
+ *  Scaling via: https://www.joshmorony.com/how-to-scale-a-game-for-all-device-sizes-in-phaser/
 */


@ -9,8 +11,8 @@ var config = {
        mode: Phaser.Scale.FIT,
        parent: 'game',
        autoCenter: Phaser.Scale.CENTER_BOTH,
-        width: 1024,
-        height: 600
+        width: window.innerWidth * window.devicePixelRatio,
+        height: window.innerHeight * window.devicePixelRatio
    },	transparent: true,
 	backgroundColor: 0xffffff,
    scene: {
@ -56,6 +58,8 @@ function create() {
    var sprites = ['crate','banana','orange','cherries']; //array to choose random sprite from

    this.input.on('pointerdown', function (pointer) {
+        // var touchX = pointer.x;
+        // var touchY = pointer.y;
        this.matter.add.sprite(pointer.x, pointer.y, 'sheet', sprites[getRandomInt(4)], {shape: shapes.banana});
    }, this);
 }
--- a/graphics/falling-scooters/shapes.pes
+++ b/graphics/falling-scooters/shapes.pes
--- a/graphics/falling-scooters/spritesheet.tps
+++ b/graphics/falling-scooters/spritesheet.tps
--- a/graphics/insta/1.jpg
+++ b/graphics/insta/1.jpg
--- a/graphics/insta/2.jpg
+++ b/graphics/insta/2.jpg
--- a/graphics/insta/3.jpg
+++ b/graphics/insta/3.jpg
--- a/graphics/insta/4.jpg
+++ b/graphics/insta/4.jpg
--- a/graphics/insta/5.jpg
+++ b/graphics/insta/5.jpg
--- a/graphics/insta/6.jpg
+++ b/graphics/insta/6.jpg
--- a/graphics/insta/7.jpg
+++ b/graphics/insta/7.jpg
--- a/graphics/insta/8.jpg
+++ b/graphics/insta/8.jpg
--- a/graphics/insta/9.jpg
+++ b/graphics/insta/9.jpg
--- a/graphics/insta/instagrid.psd
+++ b/graphics/insta/instagrid.psd
--- a/graphics/logo.png
+++ b/graphics/logo.png
--- a/graphics/logo2.png
+++ b/graphics/logo2.png