From efcda467d2e00d49c48991d80ca5a516f5a22780 Mon Sep 17 00:00:00 2001
From: Samson <samsonitto@gmail.com>
Date: Mon, 20 Jan 2020 12:09:26 +0200
Subject: [PATCH] harkka2

---
 harkka2/phaser3-tutorial/assets/bomb.png     | Bin 0 -> 495 bytes
 harkka2/phaser3-tutorial/assets/dude.png     | Bin 0 -> 3226 bytes
 harkka2/phaser3-tutorial/assets/platform.png | Bin 0 -> 14973 bytes
 harkka2/phaser3-tutorial/assets/sky.png      | Bin 0 -> 4757 bytes
 harkka2/phaser3-tutorial/assets/star.png     | Bin 0 -> 443 bytes
 harkka2/phaser3-tutorial/part1.html          |  45 ++++
 harkka2/phaser3-tutorial/part10.html         | 207 +++++++++++++++++++
 harkka2/phaser3-tutorial/part2.html          |  50 +++++
 harkka2/phaser3-tutorial/part3.html          |  51 +++++
 harkka2/phaser3-tutorial/part4.html          |  70 +++++++
 harkka2/phaser3-tutorial/part5.html          |  94 +++++++++
 harkka2/phaser3-tutorial/part6.html          |  96 +++++++++
 harkka2/phaser3-tutorial/part7.html          | 122 +++++++++++
 harkka2/phaser3-tutorial/part8.html          | 143 +++++++++++++
 harkka2/phaser3-tutorial/part9.html          | 150 ++++++++++++++
 15 files changed, 1028 insertions(+)
 create mode 100644 harkka2/phaser3-tutorial/assets/bomb.png
 create mode 100644 harkka2/phaser3-tutorial/assets/dude.png
 create mode 100644 harkka2/phaser3-tutorial/assets/platform.png
 create mode 100644 harkka2/phaser3-tutorial/assets/sky.png
 create mode 100644 harkka2/phaser3-tutorial/assets/star.png
 create mode 100644 harkka2/phaser3-tutorial/part1.html
 create mode 100644 harkka2/phaser3-tutorial/part10.html
 create mode 100644 harkka2/phaser3-tutorial/part2.html
 create mode 100644 harkka2/phaser3-tutorial/part3.html
 create mode 100644 harkka2/phaser3-tutorial/part4.html
 create mode 100644 harkka2/phaser3-tutorial/part5.html
 create mode 100644 harkka2/phaser3-tutorial/part6.html
 create mode 100644 harkka2/phaser3-tutorial/part7.html
 create mode 100644 harkka2/phaser3-tutorial/part8.html
 create mode 100644 harkka2/phaser3-tutorial/part9.html

diff --git a/harkka2/phaser3-tutorial/assets/bomb.png b/harkka2/phaser3-tutorial/assets/bomb.png
new file mode 100644
index 0000000000000000000000000000000000000000..28a0fbbddc37fd0a6872bbd170cbebdc81e7f597
GIT binary patch
literal 495
zcmV<L0TBL)P)<h;3K|Lk000e1NJLTq000gE000gM1^@s6A4o0H0000PbVXQnQ*UN;
zcVTj606}DLVr3vnZDD6+Qe|Oed2z{QJOBUzkx4{BRCwBKQol<=VH7>D9zu&P4K|6B
zy7WV^1|cFcwUDgo`40q5)!rZ!88jJG&>Yy7O9dHWfrAKYlfEe&qJ}`MAqe92ozK39
zS_dxgd-vXR&i(Ftnq^t&M>3hT+O;=%9-bIMHk;M@do)E{^oM&C)=pCLdAgpm1t@k^
z&r6X3MPj2!!s{M{XCa99#+?kFnRB&TFg9jv16`>Rxk3?>iIDADs(<1rvnS76(J0O{
z4|cC4a)kT+9ejBMnD!6B>6=4hHUy^-Qee%C3e4ZT>s*8?kVKHAo}40oaVcvh1b}8)
zE^mNtY7q*#E+;~g#Mt4LCAkN3w3u(+;sP9IrN^}&ydV3Br<*c#UiSDfjm=0zDsnt7
zf+7kO<z`JmxNh9SFpSQ3)HKZ!&TwqUvHH<QHCOyYRPQtq98Fh6D#dnzs!%SBb(-Ac
zE;JusG1~lw#|u19xj+N^&*4XXi3d?TNXr7p>V_$ZQdrc~pF>+2ToQvR#`0N42G7i^
lJ{9OsC=n&_ABpiJzyJ*&>ep5+m(>6O002ovPDHLkV1k0g(4+tW

literal 0
HcmV?d00001

diff --git a/harkka2/phaser3-tutorial/assets/dude.png b/harkka2/phaser3-tutorial/assets/dude.png
new file mode 100644
index 0000000000000000000000000000000000000000..6b35f4b4b1b00e757700e0852b8527200e82c538
GIT binary patch
literal 3226
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
M07*qoM6N<$g3k?Rn*aa+

literal 0
HcmV?d00001

diff --git a/harkka2/phaser3-tutorial/assets/platform.png b/harkka2/phaser3-tutorial/assets/platform.png
new file mode 100644
index 0000000000000000000000000000000000000000..1e4a3f86d7311592c4fdd257daaf21db4176dd21
GIT binary patch
literal 14973
zcmeI3&2QsG7{;d{q@`$C0aB^BU}c3^Bocq*qqXH^X_J;#BBkmEZMzrh*pt?3VjJ6S
z(q32=fy52L1tIts5Qr1n0}>J!&RpPzIG{yHoRHu`nX#StjgxeWw8x3m<ju_UyfgEg
zcc#ANgYB(Xug*U=j}W@LxzX4`XzoK23s)W??_ckKbBBC9?rrP^2tDx({hLFdezu5^
z`i|Y&4R@QbX{OsN7?#_{g+b3FYJ~Kg1J5vza459#f$datf8PH#C)idsce~t_nqD0r
z+8bv+zIC?MGS7}o)ymzh&Fce=B<SJL5C*-j6KI2KF3PKsm^O<!A(Dhg)!YglP}ps5
z3w77WLb*`Ro041-mehh=mP^a>%Yq`wMNuk>axpI}nxtxSSx8>F+B}JL-|A>PjrC+W
z@~xUX3`0*7#eTnE=obsFe;~@Ls)~{#DoUOx^1-PS8iTwOT#u6s^E7Z^`nDI^t|QRA
zM%z6OtGOH<X!J_f)$>LJIYGjXP!tD-C&~p$oMCD<FShl1Q=LJ$gVU8w9WZE}dRW}S
zfqU$mn8>eBn?ew-oscCZh%S+6?F2jF)Kr!^%HtjT-3YX0inxn=#1aq+^3=6>hi>Qw
zhwco3qwbj)L%TDB1?`z>!vlMUjrPR0sHWnr)=432bsrm{>$hCDTZ_wedpLWcUKeiM
zwjImu2QTSjR-M*Nng}<H5Z7o;=VduBm0EH|lb5w(@ec6EqKv)iT6X6Y*p<9gq4v^}
zR+JJu5M}M;<XJ{&uo6Joc#39I+jN4^a7?_}sFB4MY}?Y7l}fu<QI_*d9jTlzn<Xo6
zsA@akmODkYQ)x?`iWx0!+&+=I;hM*^Xp+<xNiC`Jx>AzXmu00S%WKN2s;;d|t4pP_
zsw|b1)nQs-olJ{;`vhC-zT1n=vuF4LrpKh38=jNV1(0ldbkH<=a;eFD>a*uFVNK^l
zlIwA|HFKp6R%T#LGmkK&OU=|ULI1jMlPlcl0#<Yf{}1LVDZnI1HZshH9gwqf3dX1F
zrWffg{MLBuu%l~Va$`o@L#{8)FzFRt3k<Tkx)@z)!?tu%v4aj23#RPp<;r)$K6{M*
zA$F4Uojss&mPjz$AGn>cZ}@oSfE)(Kg%c+ncg)Ug9vaR8wrb*#*RUaL(M7spU3+}L
z;@0tP9G2eXw(FLubzHw^gf+Wo9AMFN4s<bXOvltmx4l+(yRJ{JFkCC@;<RSqqW3(l
zYC_3~N<r4eiMFhMm!A3Vaim{TB=Qnv`kq)}ch<Uhu@!b_t*P@3#|~>sGFqk?xadEl
z7{)E~0ETOoa=BR6#cXrdv271<cei1aYc!yTqeK@LnX)}ooqMUXNamOtK}TYYYXLkf
zMWqtAk|#0p5GanG0>`UpbR-{gkgn(<Cx+?xAdm(#=D3)Mpn&6oG?+2R#Y6-J92ca)
zj5#hQA}HXvAPr{BaWN4=0mlVtFk_C3i3kcfE=YqJb6iYBP{46P8qApEVj_Y9jtkOY
z#vB(D5fpG-kOnj6xR{8bfa8KRm@&u2L<9vK7o@?AIW8t5DB!pt4Q9-7F%dxl#|3FH
zV~&f72nskZNP`)3Tuekzz;Qtu%$Vb1B7y>r3({c592XN26mVRS1~cZkn24Z&<AOAp
zF~`M31O*%yq`{0iE+!%<;J6?SW_%&8`Sf>{*dafr?2}(j{@VWd7xIfs!Q9wsB6Riw
zLU-Rq=$~`)`2e9~38CNj5z;<E=vnupH@{ye+LO)3N^9`*A3w@ZA?XVGYUjlpuRQth
z=ll2GyWjZk+VemCg$jQ^joyE3fA_92x41ywXiOTScyS?$FVh(bzdRyCo}WL8w%$g+
U1q;`HAYaku+E(L>)%|<_0epuk@Bjb+

literal 0
HcmV?d00001

diff --git a/harkka2/phaser3-tutorial/assets/sky.png b/harkka2/phaser3-tutorial/assets/sky.png
new file mode 100644
index 0000000000000000000000000000000000000000..5972639f229c7362edac856b42b86b93811ef3f2
GIT binary patch
literal 4757
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

literal 0
HcmV?d00001

diff --git a/harkka2/phaser3-tutorial/assets/star.png b/harkka2/phaser3-tutorial/assets/star.png
new file mode 100644
index 0000000000000000000000000000000000000000..bfc2d298426648f2a31e48db711b84a9962af703
GIT binary patch
literal 443
zcmV;s0Yv_ZP)<h;3K|Lk000e1NJLTq000;O000&U1^@s6+I?Jz0000PbVXQnQ*UN;
zcVTj606}DLVr3vnZDD6+Qe|Oed2z{QJOBUzT}ebiRCwB~RWVKjF%a}x_XQNBR7nFR
zRqhoOL`s{EUtFrYU(nGaLBT7Mijp*;LQ2FV9M9$qKF1sEOGdI}%e%8XzTI0g#;8;@
zWy!|Xa!JWf2#~Vs$;3Fc`y@Y|n)&1X&+i#~r{+KCRHcJzqttrJi}#7px!LEc&{^3#
zWT?=6vd>XL_|lRQ2#&J%ar3Hn%~(CXUq!D`&cv1a`M}0eNaS7+$&YT|RDu2O<wFf-
zQ`HMX0^kG+`$S}6w)mK{J9P<w{Ce?)Mx&zb=8FaK$ytH-%Q!noNZtu>Zjcyxv=3k)
zmE9@8CnOgejhjm<KcQ5mhNN&Fpy{gTVXtq{%)gIjh0e(y@9gS3RYgaEls!oC#*5X8
z&vxJ(ej|}W2vro()^EG>j~Lalp~}z9R$FcFI)PYuDUVDXxAlk@#^T}n^hksaY@J`|
l6LoM-IrG~2g?D=a1^@>-d`lX|xf=ig002ovPDHLkV1hKF%;Eq5

literal 0
HcmV?d00001

diff --git a/harkka2/phaser3-tutorial/part1.html b/harkka2/phaser3-tutorial/part1.html
new file mode 100644
index 0000000..3a7aacc
--- /dev/null
+++ b/harkka2/phaser3-tutorial/part1.html
@@ -0,0 +1,45 @@
+<!doctype html> 
+<html lang="en"> 
+<head> 
+    <meta charset="UTF-8" />
+    <title>Making your first Phaser 3 Game - Part 1</title>
+    <script src="//cdn.jsdelivr.net/npm/phaser@3.11.0/dist/phaser.js"></script>
+    <style type="text/css">
+        body {
+            margin: 0;
+        }
+    </style>
+</head>
+<body>
+
+<script type="text/javascript">
+
+    var config = {
+        type: Phaser.AUTO,
+        width: 800,
+        height: 600,
+        scene: {
+            preload: preload,
+            create: create,
+            update: update
+        }
+    };
+
+    var game = new Phaser.Game(config);
+
+    function preload ()
+    {
+    }
+
+    function create ()
+    {
+    }
+
+    function update ()
+    {
+    }
+
+</script>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/harkka2/phaser3-tutorial/part10.html b/harkka2/phaser3-tutorial/part10.html
new file mode 100644
index 0000000..a77bfd0
--- /dev/null
+++ b/harkka2/phaser3-tutorial/part10.html
@@ -0,0 +1,207 @@
+<!doctype html> 
+<html lang="en"> 
+<head> 
+    <meta charset="UTF-8" />
+    <title>Making your first Phaser 3 Game - Part 10</title>
+    <script src="//cdn.jsdelivr.net/npm/phaser@3.11.0/dist/phaser.js"></script>
+    <style type="text/css">
+        body {
+            margin: 0;
+        }
+    </style>
+</head>
+<body>
+
+<script type="text/javascript">
+
+var config = {
+    type: Phaser.AUTO,
+    width: 800,
+    height: 600,
+    physics: {
+        default: 'arcade',
+        arcade: {
+            gravity: { y: 300 },
+            debug: false
+        }
+    },
+    scene: {
+        preload: preload,
+        create: create,
+        update: update
+    }
+};
+
+var player;
+var stars;
+var bombs;
+var platforms;
+var cursors;
+var score = 0;
+var gameOver = false;
+var scoreText;
+
+var game = new Phaser.Game(config);
+
+function preload ()
+{
+    this.load.image('sky', 'assets/sky.png');
+    this.load.image('ground', 'assets/platform.png');
+    this.load.image('star', 'assets/star.png');
+    this.load.image('bomb', 'assets/bomb.png');
+    this.load.spritesheet('dude', 'assets/dude.png', { frameWidth: 32, frameHeight: 48 });
+}
+
+function create ()
+{
+    //  A simple background for our game
+    this.add.image(400, 300, 'sky');
+
+    //  The platforms group contains the ground and the 2 ledges we can jump on
+    platforms = this.physics.add.staticGroup();
+
+    //  Here we create the ground.
+    //  Scale it to fit the width of the game (the original sprite is 400x32 in size)
+    platforms.create(400, 568, 'ground').setScale(2).refreshBody();
+
+    //  Now let's create some ledges
+    platforms.create(600, 400, 'ground');
+    platforms.create(50, 250, 'ground');
+    platforms.create(750, 220, 'ground');
+
+    // The player and its settings
+    player = this.physics.add.sprite(100, 450, 'dude');
+
+    //  Player physics properties. Give the little guy a slight bounce.
+    player.setBounce(0.2);
+    player.setCollideWorldBounds(true);
+
+    //  Our player animations, turning, walking left and walking right.
+    this.anims.create({
+        key: 'left',
+        frames: this.anims.generateFrameNumbers('dude', { start: 0, end: 3 }),
+        frameRate: 10,
+        repeat: -1
+    });
+
+    this.anims.create({
+        key: 'turn',
+        frames: [ { key: 'dude', frame: 4 } ],
+        frameRate: 20
+    });
+
+    this.anims.create({
+        key: 'right',
+        frames: this.anims.generateFrameNumbers('dude', { start: 5, end: 8 }),
+        frameRate: 10,
+        repeat: -1
+    });
+
+    //  Input Events
+    cursors = this.input.keyboard.createCursorKeys();
+
+    //  Some stars to collect, 12 in total, evenly spaced 70 pixels apart along the x axis
+    stars = this.physics.add.group({
+        key: 'star',
+        repeat: 11,
+        setXY: { x: 12, y: 0, stepX: 70 }
+    });
+
+    stars.children.iterate(function (child) {
+
+        //  Give each star a slightly different bounce
+        child.setBounceY(Phaser.Math.FloatBetween(0.4, 0.8));
+
+    });
+
+    bombs = this.physics.add.group();
+
+    //  The score
+    scoreText = this.add.text(16, 16, 'score: 0', { fontSize: '32px', fill: '#000' });
+
+    //  Collide the player and the stars with the platforms
+    this.physics.add.collider(player, platforms);
+    this.physics.add.collider(stars, platforms);
+    this.physics.add.collider(bombs, platforms);
+
+    //  Checks to see if the player overlaps with any of the stars, if he does call the collectStar function
+    this.physics.add.overlap(player, stars, collectStar, null, this);
+
+    this.physics.add.collider(player, bombs, hitBomb, null, this);
+}
+
+function update ()
+{
+    if (gameOver)
+    {
+        return;
+    }
+
+    if (cursors.left.isDown)
+    {
+        player.setVelocityX(-160);
+
+        player.anims.play('left', true);
+    }
+    else if (cursors.right.isDown)
+    {
+        player.setVelocityX(160);
+
+        player.anims.play('right', true);
+    }
+    else
+    {
+        player.setVelocityX(0);
+
+        player.anims.play('turn');
+    }
+
+    if (cursors.up.isDown && player.body.touching.down)
+    {
+        player.setVelocityY(-330);
+    }
+}
+
+function collectStar (player, star)
+{
+    star.disableBody(true, true);
+
+    //  Add and update the score
+    score += 10;
+    scoreText.setText('Score: ' + score);
+
+    if (stars.countActive(true) === 0)
+    {
+        //  A new batch of stars to collect
+        stars.children.iterate(function (child) {
+
+            child.enableBody(true, child.x, 0, true, true);
+
+        });
+
+        var x = (player.x < 400) ? Phaser.Math.Between(400, 800) : Phaser.Math.Between(0, 400);
+
+        var bomb = bombs.create(x, 16, 'bomb');
+        bomb.setBounce(1);
+        bomb.setCollideWorldBounds(true);
+        bomb.setVelocity(Phaser.Math.Between(-200, 200), 20);
+        bomb.allowGravity = false;
+
+    }
+}
+
+function hitBomb (player, bomb)
+{
+    this.physics.pause();
+
+    player.setTint(0xff0000);
+
+    player.anims.play('turn');
+
+    gameOver = true;
+}
+
+</script>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/harkka2/phaser3-tutorial/part2.html b/harkka2/phaser3-tutorial/part2.html
new file mode 100644
index 0000000..115d378
--- /dev/null
+++ b/harkka2/phaser3-tutorial/part2.html
@@ -0,0 +1,50 @@
+<!doctype html> 
+<html lang="en"> 
+<head> 
+    <meta charset="UTF-8" />
+    <title>Making your first Phaser 3 Game - Part 2</title>
+    <script src="//cdn.jsdelivr.net/npm/phaser@3.11.0/dist/phaser.js"></script>
+    <style type="text/css">
+        body {
+            margin: 0;
+        }
+    </style>
+</head>
+<body>
+
+<script type="text/javascript">
+
+    var config = {
+        type: Phaser.AUTO,
+        width: 800,
+        height: 600,
+        scene: {
+            preload: preload,
+            create: create,
+            update: update
+        }
+    };
+
+    var game = new Phaser.Game(config);
+
+    function preload ()
+    {
+        this.load.image('sky', 'assets/sky.png');
+        this.load.image('ground', 'assets/platform.png');
+        this.load.image('star', 'assets/star.png');
+        this.load.image('bomb', 'assets/bomb.png');
+        this.load.spritesheet('dude', 'assets/dude.png', { frameWidth: 32, frameHeight: 48 });
+    }
+
+    function create ()
+    {
+    }
+
+    function update ()
+    {
+    }
+
+</script>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/harkka2/phaser3-tutorial/part3.html b/harkka2/phaser3-tutorial/part3.html
new file mode 100644
index 0000000..0f88433
--- /dev/null
+++ b/harkka2/phaser3-tutorial/part3.html
@@ -0,0 +1,51 @@
+<!doctype html> 
+<html lang="en"> 
+<head> 
+    <meta charset="UTF-8" />
+    <title>Making your first Phaser 3 Game - Part 3</title>
+    <script src="//cdn.jsdelivr.net/npm/phaser@3.11.0/dist/phaser.js"></script>
+    <style type="text/css">
+        body {
+            margin: 0;
+        }
+    </style>
+</head>
+<body>
+
+<script type="text/javascript">
+
+    var config = {
+        type: Phaser.AUTO,
+        width: 800,
+        height: 600,
+        scene: {
+            preload: preload,
+            create: create,
+            update: update
+        }
+    };
+
+    var game = new Phaser.Game(config);
+
+    function preload ()
+    {
+        this.load.image('sky', 'assets/sky.png');
+        this.load.image('ground', 'assets/platform.png');
+        this.load.image('star', 'assets/star.png');
+        this.load.image('bomb', 'assets/bomb.png');
+        this.load.spritesheet('dude', 'assets/dude.png', { frameWidth: 32, frameHeight: 48 });
+    }
+
+    function create ()
+    {
+        this.add.image(400, 300, 'sky');
+    }
+
+    function update ()
+    {
+    }
+
+</script>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/harkka2/phaser3-tutorial/part4.html b/harkka2/phaser3-tutorial/part4.html
new file mode 100644
index 0000000..3cc10e8
--- /dev/null
+++ b/harkka2/phaser3-tutorial/part4.html
@@ -0,0 +1,70 @@
+<!doctype html> 
+<html lang="en"> 
+<head> 
+    <meta charset="UTF-8" />
+    <title>Making your first Phaser 3 Game - Part 4</title>
+    <script src="//cdn.jsdelivr.net/npm/phaser@3.11.0/dist/phaser.js"></script>
+    <style type="text/css">
+        body {
+            margin: 0;
+        }
+    </style>
+</head>
+<body>
+
+<script type="text/javascript">
+
+    var config = {
+        type: Phaser.AUTO,
+        width: 800,
+        height: 600,
+        physics: {
+            default: 'arcade',
+            arcade: {
+                gravity: { y: 300 },
+                debug: false
+            }
+        },
+        scene: {
+            preload: preload,
+            create: create,
+            update: update
+        }
+    };
+
+    var platforms;
+
+    var game = new Phaser.Game(config);
+
+    function preload ()
+    {
+        this.load.image('sky', 'assets/sky.png');
+        this.load.image('ground', 'assets/platform.png');
+        this.load.image('star', 'assets/star.png');
+        this.load.image('bomb', 'assets/bomb.png');
+        this.load.spritesheet('dude', 'assets/dude.png', { frameWidth: 32, frameHeight: 48 });
+    }
+
+    var platforms;
+
+    function create ()
+    {
+        this.add.image(400, 300, 'sky');
+
+        platforms = this.physics.add.staticGroup();
+
+        platforms.create(400, 568, 'ground').setScale(2).refreshBody();
+
+        platforms.create(600, 400, 'ground');
+        platforms.create(50, 250, 'ground');
+        platforms.create(750, 220, 'ground');
+    }
+
+    function update ()
+    {
+    }
+
+</script>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/harkka2/phaser3-tutorial/part5.html b/harkka2/phaser3-tutorial/part5.html
new file mode 100644
index 0000000..10b8fa7
--- /dev/null
+++ b/harkka2/phaser3-tutorial/part5.html
@@ -0,0 +1,94 @@
+<!doctype html> 
+<html lang="en"> 
+<head> 
+    <meta charset="UTF-8" />
+    <title>Making your first Phaser 3 Game - Part 5</title>
+    <script src="//cdn.jsdelivr.net/npm/phaser@3.11.0/dist/phaser.js"></script>
+    <style type="text/css">
+        body {
+            margin: 0;
+        }
+    </style>
+</head>
+<body>
+
+<script type="text/javascript">
+
+    var config = {
+        type: Phaser.AUTO,
+        width: 800,
+        height: 600,
+        physics: {
+            default: 'arcade',
+            arcade: {
+                gravity: { y: 300 },
+                debug: false
+            }
+        },
+        scene: {
+            preload: preload,
+            create: create,
+            update: update
+        }
+    };
+
+    var player;
+    var platforms;
+
+    var game = new Phaser.Game(config);
+
+    function preload ()
+    {
+        this.load.image('sky', 'assets/sky.png');
+        this.load.image('ground', 'assets/platform.png');
+        this.load.image('star', 'assets/star.png');
+        this.load.image('bomb', 'assets/bomb.png');
+        this.load.spritesheet('dude', 'assets/dude.png', { frameWidth: 32, frameHeight: 48 });
+    }
+
+    function create ()
+    {
+        this.add.image(400, 300, 'sky');
+
+        platforms = this.physics.add.staticGroup();
+
+        platforms.create(400, 568, 'ground').setScale(2).refreshBody();
+
+        platforms.create(600, 400, 'ground');
+        platforms.create(50, 250, 'ground');
+        platforms.create(750, 220, 'ground');
+
+        player = this.physics.add.sprite(100, 450, 'dude');
+
+        player.setBounce(0.2);
+        player.setCollideWorldBounds(true);
+
+        this.anims.create({
+            key: 'left',
+            frames: this.anims.generateFrameNumbers('dude', { start: 0, end: 3 }),
+            frameRate: 10,
+            repeat: -1
+        });
+
+        this.anims.create({
+            key: 'turn',
+            frames: [ { key: 'dude', frame: 4 } ],
+            frameRate: 20
+        });
+
+        this.anims.create({
+            key: 'right',
+            frames: this.anims.generateFrameNumbers('dude', { start: 5, end: 8 }),
+            frameRate: 10,
+            repeat: -1
+        });
+    }
+
+    function update ()
+    {
+    }
+
+</script>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/harkka2/phaser3-tutorial/part6.html b/harkka2/phaser3-tutorial/part6.html
new file mode 100644
index 0000000..fad2192
--- /dev/null
+++ b/harkka2/phaser3-tutorial/part6.html
@@ -0,0 +1,96 @@
+<!doctype html> 
+<html lang="en"> 
+<head> 
+    <meta charset="UTF-8" />
+    <title>Making your first Phaser 3 Game - Part 6</title>
+    <script src="//cdn.jsdelivr.net/npm/phaser@3.11.0/dist/phaser.js"></script>
+    <style type="text/css">
+        body {
+            margin: 0;
+        }
+    </style>
+</head>
+<body>
+
+<script type="text/javascript">
+
+    var config = {
+        type: Phaser.AUTO,
+        width: 800,
+        height: 600,
+        physics: {
+            default: 'arcade',
+            arcade: {
+                gravity: { y: 300 },
+                debug: false
+            }
+        },
+        scene: {
+            preload: preload,
+            create: create,
+            update: update
+        }
+    };
+
+    var player;
+    var platforms;
+
+    var game = new Phaser.Game(config);
+
+    function preload ()
+    {
+        this.load.image('sky', 'assets/sky.png');
+        this.load.image('ground', 'assets/platform.png');
+        this.load.image('star', 'assets/star.png');
+        this.load.image('bomb', 'assets/bomb.png');
+        this.load.spritesheet('dude', 'assets/dude.png', { frameWidth: 32, frameHeight: 48 });
+    }
+
+    function create ()
+    {
+        this.add.image(400, 300, 'sky');
+
+        platforms = this.physics.add.staticGroup();
+
+        platforms.create(400, 568, 'ground').setScale(2).refreshBody();
+
+        platforms.create(600, 400, 'ground');
+        platforms.create(50, 250, 'ground');
+        platforms.create(750, 220, 'ground');
+
+        player = this.physics.add.sprite(100, 450, 'dude');
+
+        player.setBounce(0.2);
+        player.setCollideWorldBounds(true);
+
+        this.anims.create({
+            key: 'left',
+            frames: this.anims.generateFrameNumbers('dude', { start: 0, end: 3 }),
+            frameRate: 10,
+            repeat: -1
+        });
+
+        this.anims.create({
+            key: 'turn',
+            frames: [ { key: 'dude', frame: 4 } ],
+            frameRate: 20
+        });
+
+        this.anims.create({
+            key: 'right',
+            frames: this.anims.generateFrameNumbers('dude', { start: 5, end: 8 }),
+            frameRate: 10,
+            repeat: -1
+        });
+
+        this.physics.add.collider(player, platforms);
+    }
+
+    function update ()
+    {
+    }
+
+</script>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/harkka2/phaser3-tutorial/part7.html b/harkka2/phaser3-tutorial/part7.html
new file mode 100644
index 0000000..4e1d6cd
--- /dev/null
+++ b/harkka2/phaser3-tutorial/part7.html
@@ -0,0 +1,122 @@
+<!doctype html> 
+<html lang="en"> 
+<head> 
+    <meta charset="UTF-8" />
+    <title>Making your first Phaser 3 Game - Part 7</title>
+    <script src="//cdn.jsdelivr.net/npm/phaser@3.11.0/dist/phaser.js"></script>
+    <style type="text/css">
+        body {
+            margin: 0;
+        }
+    </style>
+</head>
+<body>
+
+<script type="text/javascript">
+
+    var config = {
+        type: Phaser.AUTO,
+        width: 800,
+        height: 600,
+        physics: {
+            default: 'arcade',
+            arcade: {
+                gravity: { y: 300 },
+                debug: false
+            }
+        },
+        scene: {
+            preload: preload,
+            create: create,
+            update: update
+        }
+    };
+
+    var player;
+    var platforms;
+    var cursors;
+
+    var game = new Phaser.Game(config);
+
+    function preload ()
+    {
+        this.load.image('sky', 'assets/sky.png');
+        this.load.image('ground', 'assets/platform.png');
+        this.load.image('star', 'assets/star.png');
+        this.load.image('bomb', 'assets/bomb.png');
+        this.load.spritesheet('dude', 'assets/dude.png', { frameWidth: 32, frameHeight: 48 });
+    }
+
+    function create ()
+    {
+        this.add.image(400, 300, 'sky');
+
+        platforms = this.physics.add.staticGroup();
+
+        platforms.create(400, 568, 'ground').setScale(2).refreshBody();
+
+        platforms.create(600, 400, 'ground');
+        platforms.create(50, 250, 'ground');
+        platforms.create(750, 220, 'ground');
+
+        player = this.physics.add.sprite(100, 450, 'dude');
+
+        player.setBounce(0.2);
+        player.setCollideWorldBounds(true);
+
+        this.anims.create({
+            key: 'left',
+            frames: this.anims.generateFrameNumbers('dude', { start: 0, end: 3 }),
+            frameRate: 10,
+            repeat: -1
+        });
+
+        this.anims.create({
+            key: 'turn',
+            frames: [ { key: 'dude', frame: 4 } ],
+            frameRate: 20
+        });
+
+        this.anims.create({
+            key: 'right',
+            frames: this.anims.generateFrameNumbers('dude', { start: 5, end: 8 }),
+            frameRate: 10,
+            repeat: -1
+        });
+
+        cursors = this.input.keyboard.createCursorKeys();
+
+        this.physics.add.collider(player, platforms);
+    }
+
+    function update ()
+    {
+        if (cursors.left.isDown)
+        {
+            player.setVelocityX(-160);
+
+            player.anims.play('left', true);
+        }
+        else if (cursors.right.isDown)
+        {
+            player.setVelocityX(160);
+
+            player.anims.play('right', true);
+        }
+        else
+        {
+            player.setVelocityX(0);
+
+            player.anims.play('turn');
+        }
+
+        if (cursors.up.isDown && player.body.touching.down)
+        {
+            player.setVelocityY(-330);
+        }
+    }
+
+</script>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/harkka2/phaser3-tutorial/part8.html b/harkka2/phaser3-tutorial/part8.html
new file mode 100644
index 0000000..75bf1fe
--- /dev/null
+++ b/harkka2/phaser3-tutorial/part8.html
@@ -0,0 +1,143 @@
+<!doctype html> 
+<html lang="en"> 
+<head> 
+    <meta charset="UTF-8" />
+    <title>Making your first Phaser 3 Game - Part 8</title>
+    <script src="//cdn.jsdelivr.net/npm/phaser@3.11.0/dist/phaser.js"></script>
+    <style type="text/css">
+        body {
+            margin: 0;
+        }
+    </style>
+</head>
+<body>
+
+<script type="text/javascript">
+
+    var config = {
+        type: Phaser.AUTO,
+        width: 800,
+        height: 600,
+        physics: {
+            default: 'arcade',
+            arcade: {
+                gravity: { y: 300 },
+                debug: false
+            }
+        },
+        scene: {
+            preload: preload,
+            create: create,
+            update: update
+        }
+    };
+
+    var player;
+    var stars;
+    var platforms;
+    var cursors;
+
+    var game = new Phaser.Game(config);
+
+    function preload ()
+    {
+        this.load.image('sky', 'assets/sky.png');
+        this.load.image('ground', 'assets/platform.png');
+        this.load.image('star', 'assets/star.png');
+        this.load.image('bomb', 'assets/bomb.png');
+        this.load.spritesheet('dude', 'assets/dude.png', { frameWidth: 32, frameHeight: 48 });
+    }
+
+    function create ()
+    {
+        this.add.image(400, 300, 'sky');
+
+        platforms = this.physics.add.staticGroup();
+
+        platforms.create(400, 568, 'ground').setScale(2).refreshBody();
+
+        platforms.create(600, 400, 'ground');
+        platforms.create(50, 250, 'ground');
+        platforms.create(750, 220, 'ground');
+
+        player = this.physics.add.sprite(100, 450, 'dude');
+
+        player.setBounce(0.2);
+        player.setCollideWorldBounds(true);
+
+        this.anims.create({
+            key: 'left',
+            frames: this.anims.generateFrameNumbers('dude', { start: 0, end: 3 }),
+            frameRate: 10,
+            repeat: -1
+        });
+
+        this.anims.create({
+            key: 'turn',
+            frames: [ { key: 'dude', frame: 4 } ],
+            frameRate: 20
+        });
+
+        this.anims.create({
+            key: 'right',
+            frames: this.anims.generateFrameNumbers('dude', { start: 5, end: 8 }),
+            frameRate: 10,
+            repeat: -1
+        });
+
+        cursors = this.input.keyboard.createCursorKeys();
+
+        stars = this.physics.add.group({
+            key: 'star',
+            repeat: 11,
+            setXY: { x: 12, y: 0, stepX: 70 }
+        });
+
+        stars.children.iterate(function (child) {
+
+            child.setBounceY(Phaser.Math.FloatBetween(0.4, 0.8));
+
+        });
+
+        this.physics.add.collider(player, platforms);
+        this.physics.add.collider(stars, platforms);
+
+        this.physics.add.overlap(player, stars, collectStar, null, this);
+    }
+
+    function update ()
+    {
+        if (cursors.left.isDown)
+        {
+            player.setVelocityX(-160);
+
+            player.anims.play('left', true);
+        }
+        else if (cursors.right.isDown)
+        {
+            player.setVelocityX(160);
+
+            player.anims.play('right', true);
+        }
+        else
+        {
+            player.setVelocityX(0);
+
+            player.anims.play('turn');
+        }
+
+        if (cursors.up.isDown && player.body.touching.down)
+        {
+            player.setVelocityY(-330);
+        }
+    }
+
+    function collectStar (player, star)
+    {
+        star.disableBody(true, true);
+    }
+
+</script>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/harkka2/phaser3-tutorial/part9.html b/harkka2/phaser3-tutorial/part9.html
new file mode 100644
index 0000000..fb9b458
--- /dev/null
+++ b/harkka2/phaser3-tutorial/part9.html
@@ -0,0 +1,150 @@
+<!doctype html> 
+<html lang="en"> 
+<head> 
+    <meta charset="UTF-8" />
+    <title>Making your first Phaser 3 Game - Part 9</title>
+    <script src="//cdn.jsdelivr.net/npm/phaser@3.11.0/dist/phaser.js"></script>
+    <style type="text/css">
+        body {
+            margin: 0;
+        }
+    </style>
+</head>
+<body>
+
+<script type="text/javascript">
+
+    var config = {
+        type: Phaser.AUTO,
+        width: 800,
+        height: 600,
+        physics: {
+            default: 'arcade',
+            arcade: {
+                gravity: { y: 300 },
+                debug: false
+            }
+        },
+        scene: {
+            preload: preload,
+            create: create,
+            update: update
+        }
+    };
+
+    var player;
+    var stars;
+    var platforms;
+    var cursors;
+    var score = 0;
+    var scoreText;
+
+    var game = new Phaser.Game(config);
+
+    function preload ()
+    {
+        this.load.image('sky', 'assets/sky.png');
+        this.load.image('ground', 'assets/platform.png');
+        this.load.image('star', 'assets/star.png');
+        this.load.image('bomb', 'assets/bomb.png');
+        this.load.spritesheet('dude', 'assets/dude.png', { frameWidth: 32, frameHeight: 48 });
+    }
+
+    function create ()
+    {
+        this.add.image(400, 300, 'sky');
+
+        platforms = this.physics.add.staticGroup();
+
+        platforms.create(400, 568, 'ground').setScale(2).refreshBody();
+
+        platforms.create(600, 400, 'ground');
+        platforms.create(50, 250, 'ground');
+        platforms.create(750, 220, 'ground');
+
+        player = this.physics.add.sprite(100, 450, 'dude');
+
+        player.setBounce(0.2);
+        player.setCollideWorldBounds(true);
+
+        this.anims.create({
+            key: 'left',
+            frames: this.anims.generateFrameNumbers('dude', { start: 0, end: 3 }),
+            frameRate: 10,
+            repeat: -1
+        });
+
+        this.anims.create({
+            key: 'turn',
+            frames: [ { key: 'dude', frame: 4 } ],
+            frameRate: 20
+        });
+
+        this.anims.create({
+            key: 'right',
+            frames: this.anims.generateFrameNumbers('dude', { start: 5, end: 8 }),
+            frameRate: 10,
+            repeat: -1
+        });
+
+        cursors = this.input.keyboard.createCursorKeys();
+
+        stars = this.physics.add.group({
+            key: 'star',
+            repeat: 11,
+            setXY: { x: 12, y: 0, stepX: 70 }
+        });
+
+        stars.children.iterate(function (child) {
+
+            child.setBounceY(Phaser.Math.FloatBetween(0.4, 0.8));
+
+        });
+
+        scoreText = this.add.text(16, 16, 'score: 0', { fontSize: '32px', fill: '#000' });
+
+        this.physics.add.collider(player, platforms);
+        this.physics.add.collider(stars, platforms);
+
+        this.physics.add.overlap(player, stars, collectStar, null, this);
+    }
+
+    function update ()
+    {
+        if (cursors.left.isDown)
+        {
+            player.setVelocityX(-160);
+
+            player.anims.play('left', true);
+        }
+        else if (cursors.right.isDown)
+        {
+            player.setVelocityX(160);
+
+            player.anims.play('right', true);
+        }
+        else
+        {
+            player.setVelocityX(0);
+
+            player.anims.play('turn');
+        }
+
+        if (cursors.up.isDown && player.body.touching.down)
+        {
+            player.setVelocityY(-330);
+        }
+    }
+
+    function collectStar (player, star)
+    {
+        star.disableBody(true, true);
+
+        score += 10;
+        scoreText.setText('Score: ' + score);
+    }
+
+</script>
+
+</body>
+</html>
\ No newline at end of file
-- 
GitLab