heaps-tutorial/Getting-started.md

#Getting Started:

####Introduction: Heaps is an open source and multi-platform toolkit to create 2D and 3D games.

####Installation: • To use Heaps.io, you need to install Haxe 3.4+ • Later, Download the Heaps, install.

For windows 8: (incase you are facing with error)
• If you are using windows 8, download Windows installer/Windows Binaries
Check in the heaps folder whether its running fine or not.
• If you are getting this  error, 

(/images/system error.png) • Then please follow this link and download ,in your heap directory, manually we are installing it (https://www.sts-tutorial.com/download/api-ms-win-crt-heap-l1-1-0).

####Setup: Run in the command prompt #####haxelib install heaps

####Editor - Installation & Setup : • The recommended editor for creating Heaps applications is Visual Studio Code: [Download](Visual Studio Code). #####Install Haxe Extension Pack: Click on the #####Extension panel (fourth icon on the left side bar of VSCode), search haxe and install Haxe Extension Pack that will contain everything you need for Haxe support. (/images/extensions.png) If your VSCode is up to date (after v1.31), you're good to go. Otherwise, restart VSCode once installation is complete (you can click the Reload label that should be showing)

####Project creation & compilation: • Create a new directory helloHeaps • Create into it a file compile.hxml: this file will contain your Haxe compilation parameters and the libraries you are using. • Edit the compile.hxml (with VSCode or any other text editor) to set the following content:

-lib heaps
-js hello.js
-main Main
-debug

• This will tell the compiler that we are using the library Heaps, that we will compile to JavaScript hello.js output, and that our main class should be Main.hx file.
• The -debug file allows generation of source maps in order to be able to debug your JS application.

####Open with VSCode: At this point, you can open the helloHeaps folder with VSCode by launching VSCode and navigating the main menu File > Open Folder #####Example: Creating Hello World Create a new Main.hx in the directory and put the following content class Main extends hxd.App { override function init() { var tf = new h2d.Text(hxd.res.DefaultFont.get(), s2d); tf.text = “Hello World !"; } static function main() { new Main(); } }

• This example creates a Heaps Text component, adds it to the 2D scene s2d and set its text.

####Compile Output:

• In order to compile, you need to create a Build task with VSCode, this can be done by going into the VSCode menu and select Terminal > Configure Default Build Task 
      Or ( you can use the command to get  the Terminal: #####Ctrl+Shift+P ) 

Select haxe : active configuration

• You can now compile with #####Shift-Ctrl+B  (or by going Terminal > Run Build Task)

• If everything works well, you should now have both hello.js and hello.js.map files created in your helloHeaps folder:

(/images/content.png)

####Run in Browser: In order to run our example, we need to embed it into a web page. Create a file named index.html with the following content:

    <!DOCTYPE>

In order to Run with Chrome, you need #####Chrome Debugger VSCode extension. Open again the Extension manager and search for Chrome to install it:

(/images/chrome.png)

• Once installed, press F5 or do Debug > Start Debugging. This should give you the choice to Debug with Chrome. If not, restart VSCode so the extension is activated.
• If you click on Chrome label, it will open you a .vscode/launch.json similar to the tasks.json we had earlier for compiling.

{
"version": "0.2.0",
"configurations": [
    {
        "type": "chrome",
        "request": "launch",
        "name": "Launch Chrome against localhost",
        "url": "http://localhost:8080",
        "webRoot": "${workspaceFolder}"
    }
]
}

You can either setup a web server on localhost:8080 to display the content, or either simply replace the url using the following value:

“url”: “file://${workspaceFolder}/index.html”, Now Run again (through the menu or F5) and the browser should open and display Hello World (/images/hello.png)

####Reference:https://heaps.io/