JSBinding + SharpKit / Convert 2DPlatformer to JavaScript version

2DPlatformer is a Unity3D official demo. Asset store URL: https://www.assetstore.unity3d.com/en/#!/content/11228

What we are going to do now is convert 2DPlatformer to JavaScript version.

All C# scripts are all in 2DPlatformer/Scripts/ folder. We are going to use SharpKit to convert all C# scripts to JavaScript, and finally delete that folder.

NOTE: the JSBinding package already contains JavaScript version 2DPlatformer game.

 

1. Download 2DPlatformer package from asset store and import it into project.

 

2. Coroutines are not supported, so we have to rewrite all yields in C# scripts

TODO: ....

 

3. Click JSB | Generate JS and CS Bindings. (ignore this step if it was clicked before)

 

4. Correctly set up _JSEngine.prefab variables in Inspector.

 

5. Add [JsType()] attributes to all C# scripts in folder 2DPlatformer

 

// before

1 using UnityEngine;

2 using System.Collections;

3 

4 public class Gun : MonoBehaviour

5 {

6     public GameObject rocketGO;                // Prefab of the rocket.

7     public float speed = 20f;                // The speed the rocket will fire at.

 

// after (Line 4 and Line 6 are added)

 1 using UnityEngine;

 2 using System.Collections;

 3 

 4 using SharpKit.JavaScript;

 5 

 6 [JsType(JsMode.Clr,"../../StreamingAssets/JavaScript/SharpKitGenerated/2DPlatformer/Scripts/Gun.javascript")]

 7 public class Gun : MonoBehaviour

 8 {

 9     public GameObject rocketGO;                // Prefab of the rocket.

10     public float speed = 20f;                // The speed the rocket will fire at.

 

6. use sharpkit to compile C# scripts to JavaScript

open Visual Studio project from Unity menu

build sharpkit project

 

sharpkit will compile all C# classes marked with JsType attrubute to JavaScript and output result. Output file path is specified by 2nd parameter of JsType attribute.

all JavaScript files are all generated in StreamingAssets/JavaScript/SharpKitGenerated/2DPlatformer/ folder.

 

7. Click menu: JSB | Generate SharpKit JsType file CS.require list

 1 /* Generated by JSBinding.

 2 

 3 * see JSAnalyzer.cs / OutputAllTypesWithJsTypeAttribute() function

 4 

 5 * better not modify manually.

 6 

 7 */

 8 

 9 

10 

11 CS.require("SharpKitGenerated/2DPlatformer/Scripts/BackgroundParallax.javascript");

12 CS.require("SharpKitGenerated/2DPlatformer/Scripts/BackgroundPropSpawner.javascript");

13 CS.require("SharpKitGenerated/2DPlatformer/Scripts/Bomb.javascript");

14 CS.require("SharpKitGenerated/2DPlatformer/Scripts/BombPickup.javascript");

15 CS.require("SharpKitGenerated/2DPlatformer/Scripts/CameraFollow.javascript");

16 CS.require("SharpKitGenerated/2DPlatformer/Scripts/Destroyer.javascript");

17 CS.require("SharpKitGenerated/2DPlatformer/Scripts/Enemy_Data.javascript");

18 CS.require("SharpKitGenerated/2DPlatformer/Scripts/Enemy.javascript");

19 CS.require("SharpKitGenerated/2DPlatformer/Scripts/FollowPlayer.javascript");

20 CS.require("SharpKitGenerated/2DPlatformer/Scripts/Gun.javascript");

21 CS.require("SharpKitGenerated/2DPlatformer/Scripts/HealthPickup.javascript");

22 CS.require("SharpKitGenerated/2DPlatformer/Scripts/LayBombs.javascript");

23 CS.require("SharpKitGenerated/2DPlatformer/Scripts/Pauser.javascript");

24 CS.require("SharpKitGenerated/2DPlatformer/Scripts/PickupSpawner.javascript");

25 CS.require("SharpKitGenerated/2DPlatformer/Scripts/PlayerControl.javascript");

26 CS.require("SharpKitGenerated/2DPlatformer/Scripts/PlayerHealth.javascript");

27 CS.require("SharpKitGenerated/2DPlatformer/Scripts/Remover.javascript");

28 CS.require("SharpKitGenerated/2DPlatformer/Scripts/Rocket.javascript");

29 CS.require("SharpKitGenerated/2DPlatformer/Scripts/Score.javascript");

30 CS.require("SharpKitGenerated/2DPlatformer/Scripts/ScoreShadow.javascript");

31 CS.require("SharpKitGenerated/2DPlatformer/Scripts/SetParticleSortingLayer.javascript");

32 CS.require("SharpKitGenerated/2DPlatformer/Scripts/Spawner.javascript");

33 CS.require("SharpKitGenerated/DaikonForge Tween (Pro)/Examples/Scripts/DebugMessages.javascript");

34 CS.require("SharpKitGenerated/DaikonForge Tween (Pro)/Examples/Scripts/Message.javascript");

35 CS.require("SharpKitGenerated/DaikonForge Tween (Pro)/Examples/Scripts/MuchTweenSoWow.javascript");

36 CS.require("SharpKitGenerated/DaikonForge Tween (Pro)/Examples/Scripts/TestEasingFunctions.javascript");

37 CS.require("SharpKitGenerated/DaikonForge Tween (Pro)/Examples/Scripts/TestFPS.javascript");

38 CS.require("SharpKitGenerated/DaikonForge Tween (Pro)/Examples/Scripts/TestHighConcurrency.javascript");

39 CS.require("SharpKitGenerated/DaikonForge Tween (Pro)/Examples/Scripts/TestHighConcurrencyGroup.javascript");

40 CS.require("SharpKitGenerated/DaikonForge Tween (Pro)/Examples/Scripts/TestShakeObject.javascript");

41 CS.require("SharpKitGenerated/DaikonForge Tween (Pro)/Examples/Scripts/TestSlinky.javascript");

42 CS.require("SharpKitGenerated/DaikonForge Tween (Pro)/Examples/Scripts/TestSplineTween.javascript");

43 CS.require("SharpKitGenerated/JSBinding/Samples/DelegateTest.javascript");

44 CS.require("SharpKitGenerated/JSBinding/Samples/DictionaryTest.javascript");

45 CS.require("SharpKitGenerated/JSBinding/Samples/ListTest.javascript");

46 CS.require("SharpKitGenerated/JSBinding/Samples/PerformanceTest1.javascript");

47 CS.require("SharpKitGenerated/JSBinding/Samples/Serialization/Car.javascript");

48 CS.require("SharpKitGenerated/JSBinding/Samples/Serialization/SerializeSimple.javascript");

49 CS.require("SharpKitGenerated/JSBinding/Samples/Serialization/SerializeStruct.javascript");

50 CS.require("SharpKitGenerated/JSBinding/Samples/Serialization/AppleInfo.javascript");

51 CS.require("SharpKitGenerated/JSBinding/Samples/Serialization/Wheel.javascript");

52 CS.require("SharpKitGenerated/JSBinding/Samples/TestCoroutine.javascript");

53 CS.require("SharpKitGenerated/JSBinding/Samples/V3Test.javascript");

54 CS.require("SharpKitGenerated/JSBinding/Samples/Viewer.javascript");

55 CS.require("SharpKitGenerated/JSBinding/Samples/stScene.javascript");

56 CS.require("SharpKitGenerated/z_temp/test0610.javascript");

View Code

 

8. Remove all reference to C# scripts from profabs and GameObjects

Because out destination is to delete all C# scripts, no any prefabs nor GameObjests can refer to C# scripts.

We are going to replace all mono behaviours with JSComponent.

JSComponent is a MonoBehaviour which redirect every event (Awake, Start, etc.) to JavaScript.

 1 2DPlatformer/Prefabs/Characters/enemy1.prefab

 2 2DPlatformer/Prefabs/Characters/enemy2.prefab

 3 2DPlatformer/Prefabs/Characters/hero.prefab

 4 2DPlatformer/Prefabs/Environment/backgroundAnimation.prefab

 5 2DPlatformer/Prefabs/Environment/backgrounds.prefab

 6 2DPlatformer/Prefabs/Environment/Bus.prefab

 7 2DPlatformer/Prefabs/Environment/Cab.prefab

 8 2DPlatformer/Prefabs/Environment/env_clouds.prefab

 9 2DPlatformer/Prefabs/Environment/env_fog.prefab

10 2DPlatformer/Prefabs/Environment/env_riverMid.prefab

11 2DPlatformer/Prefabs/Environment/env_riverTop.prefab

12 2DPlatformer/Prefabs/Environment/Foregrounds.prefab

13 2DPlatformer/Prefabs/FX/part_splash.prefab

14 2DPlatformer/Prefabs/FX/part_warp.prefab

15 2DPlatformer/Prefabs/FX/splash.prefab

16 2DPlatformer/Prefabs/killTrigger.prefab

17 2DPlatformer/Prefabs/mainCamera.prefab

18 2DPlatformer/Prefabs/pickupManager.prefab

19 2DPlatformer/Prefabs/platformEnd.prefab

20 2DPlatformer/Prefabs/Props/bomb.prefab

21 2DPlatformer/Prefabs/Props/bombCrate.prefab

22 2DPlatformer/Prefabs/Props/explosionCircle.prefab

23 2DPlatformer/Prefabs/Props/explosionParticle.prefab

24 2DPlatformer/Prefabs/Props/healthCrate.prefab

25 2DPlatformer/Prefabs/Props/rocket.prefab

26 2DPlatformer/Prefabs/Props/rocketExplosion.prefab

27 2DPlatformer/Prefabs/Props/swan.prefab

28 2DPlatformer/Prefabs/spawner.prefab

29 2DPlatformer/Prefabs/UI/ui_100points.prefab

30 2DPlatformer/Prefabs/UI/ui_bombHUD.prefab

31 2DPlatformer/Prefabs/UI/ui_healthDisplay.prefab

32 2DPlatformer/Scenes/Level.unity

View Code

 

// before

// after

 

9. open scene 2DPlatformer/Scenes/Level.unity and drag a JSBinding/Prefabs/_JSEngine.prefab to the scene

 

It's done!!! Click play button to play the scene.

 

If everything goes right, you can delete 2DPlatformer/Scripts/ folder now !!

 

back to

JSBinding + SharpKit / Home