Category: Haxe

Categories
Animation Haxe Open source / Freeware

Tween engine Go

I have been playing a lot with Haxe and Openfl in the past, but never for work. That changed this week!

Fun stuff!

A while back I noticed some new tweening engines for Haxe. That got me curious: can I build my own tweening engine?

Yes I can!

I named it Go, like “lets Go”.

(And like they say in a track from The Prodigy – Everybody In The Place, lets go )

You can check it out on github: https://github.com/MatthijsKamstra/go
There you can find more detailed explanation about how it works, so I only will show some basic code here:

Animate a sprite in 1.5 second to x and y position and call function when animation is done

Go.to(sprite, 1.5).x(100).y(200).onComplete(onCompleteHandler, ['hello']);

It was fun to write it, but I haven’t tested in all situations.
I have tested lets.Go on targets flash/cpp/html5/neko.
But I wouldn’t use it in a production situation. It needs more testing.

Let me know what you think!

Categories
Haxe Misc Open source / Freeware

Write CSS with HSS and Haxe on OSX

I’m playing around with Haxe for a while now. My recent experiments are with Neko and PHP.

It’s a little flatfile CMS/website that lets you write Markdown (I’m using mdown from Jason O’Neil) for posts.
For styling (css) I’m using Twitter Bootstrap and for the animations the jQuery wrapper (jQueryExternForHaxe) from Andi Li.
This all is not important for the post, I was just showing off… 😛 …. or showing what you can controle in one project using Haxe (jQuery, php, neko, js and now CSS)!

Using Twitter bootstrap for styling is very quick and nice. But when you want to modify that you will need to write css.
Not a problem, but what if you want to do it the awesome way?

Meet HSS

From the creator of Haxe (Nicolas Cannasse) comes HSS!

HSS is tool that extends the CSS syntax with powerful features such as variables and nested blocks. HSS is a CSS compiler which supports valid CSS syntax, so for every error that occurs during the parsing of the HSS file, it will display and error indicating at which file and which line the error occurred.

Sounds great and it’s written by someone who knows what he is doing, so lets give that a try.
And there comes trouble…

Remember this: I work on Mac OS X 10.6.8.

hss example code

Five steps to get started with HSS on OSX

#1
Download the file: HSS OSX version
The normal way of downloading (just click on the link) for some reason didn’t work for me. I had to download it with right-mouseclick and “Save link as…” (Google Chrome).

#2
Extract the file: the file you downloaded is a “gzip” compression file.
The normale decompression program on OSX don’t work with that (Archive Utility), my default decompression program didn’t work either (The Unarchiver).
Stuffit expander works!

And this is important! The other programs seem to work because there is a file created but its not a “exec”. Stuffit expander creates a file name “hss” other programs create a file named “hss-1.3-osx”

There is probably a terminal version to extract (here) but I stopped trying when I had the file.

#3
Where to leave the HSS executable?
I had a little help with that: (Source) for Linux AND OSX you can place it in the “usr/bin/” directory.
That is a hidden folder normally so you need to change that (but I hope you already did that) (read this post about it)
BTW “Users” is not the same as “usr”
When you drop the HSS executable in the bin folder you will be asked for you password

#4
I’m not 100% sure, but when I think about it while I write this I don’t think that you have to do this.
But just in case I’m wrong….
You need to give the file permission to execute (this is still true if you don’t copy the file in the usr/bin folder).
Open the terminal and type “chmod +x ” (without the quotes and don’t forget the space after x) and drag the HSS file in the terminal.
Press enter and you are done.

Create CSS with HXML

Now we can start with the cool stuff. Lets create an hss file:
(the examples are from Nicolas Cannasse himself)

// Property Variables
var mycolor = #1111AA;
var myfont = "Trebuchet MS", Arial, sans-serif;
body {
    color : $mycolor;
    font : $myfont;
}
// Block Variables
var nomargin = { margin : 0px; padding : 0px; }
pre {
    $nomargin;
    color : #FF0000;
}
// nested blocks
.faq {
	color : #BC683C;
	.form {
		width : 100px;
		textarea {
			width : 100%;
			height : 80px;
		}
		.name {
			font-weight : bold;
		}
	}
	ul {
		margin-left : 20px;
		margin-bottom : 20px;
	}
}
It’s probably useful to mention that ANY CSS file is an HSS file as long it’s validates.
That means that you can take a .css file and rename it to .hss!

(save the file as “style.hss” without quotes in the hss folder; see the folder structure below)

Now update your .hxml file!
Remember I use MonoDevelop 3.0 for OSX

Here a example of the folder structure I used for this example

+ Export
	+ neko
	+ php
+ Source
	+ hss
		- style.hss
	- Foobar.hx
Foobar.hxml

Open your Foobar.hxml file and it should look something like this:

-cp Source
-main Foobar
-neko Export/neko/index.n

--next
-cp Source
-main Foobar
-php Export/php

--next
-cmd "cd Source/hss/"
-cmd "hss style.hss" 
-cmd "hss style.hss -output ../../Export/php/" 
-cmd "hss style.hss -output ../../Export/neko/"
The quotes are important when on OSX (possibly also for Linux)

Now every time you compile the source for Neko/PHP the css will be compiled in the correct folder!

Brrrrr

Okay, okay, I know I promote MonoDevelop for Haxe coding.
But… for hss/css I don’t think you should use it…
I haven’t tried it yet, but the Haxe plugin for Textmate looks good for it.

happy haxe-ing

Sources used:

Categories
Haxe

Haxe IDE for OSX: Monodevelop 3.0

Update #1: I thought I had finished this post already, but it was not finished yet… In the mean while MonoDevelop is update to 3,0,3,2

I’ve been using MonoDevelop and the MonoDevelop Haxe Language Binding addin for all my Haxe experiments. It’s better than FDT 5 (I haven’t update to FDT 5.5 yet, because I’m at work in the middle of a project: I never update my computer/software during a project!!!)

This all is possible because Joshua Granick decided that MonoDevelop could be used for Haxe development.

Don’t get me wrong: MonoDevelop is great compared to the competition, especially because it’s free! But there are still some bugs to be crushed:
A while back I send a bug to the MonoDevelop development team about templates.

The formatter in 2.8.x is dead – can you switch somehow to monodevelop 2.9.x or master ?

So I was glad to get a message from the MonoDevelop IDE that I could update to 3.0.
To bad that they changed the api, and that broke the MonoDevelop Haxe Language Binding addin.

I’ve tried to update the plugin myself:
Forked the git repository.
First I thought I just had to change 2.8 to 3.0: no luck there I got error on excisting packages:
using MonoDevelop.Projects.CodeGeneration
First I thought it was a OSX related problem: so Installed MonoDevelop 2.8 again.
And there I didn’t have this problem: so I compiled the plugin there and installed it in MonoDevelop 3.0.
Still no go: only errors. Perhaps they changed something in the API? Could find that anywhere on the website and documentation. It had to end for me there: other stuff needed my attention.

Luckely Joshua fixed everything (there was indeed an API change) and got the plugin working again.

Installing MonoDevelop 3.0

Some extra issues I encountered installing the new MonoDevelop 3.0 (3.0.1):

I’m not a 100% sure but the release notes from MonoDevelop 3.0 mentioned:

This release of MonoDevelop needs at least Mono 2.10.9 version 11 and GTK#2.12.8 to run.

That would mean that we need to install a beta version of Mono
http://www.go-mono.com/mono-downloads/download.html
Beta Version: 2.10.9 (Release Notes)

Because the new version broke the ‘automatic’ install you need to install the haxe addin manually:
visit http://addins.monodevelop.com/Project/Index/41
and download:
Monodevelop 3.0
get the first one in the list
package mac

How to install the addin?
Monodevelop >> addin-manager >> left bottom button “Install from file”
find the file you just downloaded and “Open” it

your good to go

Source can be found at github for people who want to contribute to the plugin (yes please!):
https://github.com/jgranick/md-haxebinding

On of the most pleasant improvement of MonoDevelop on OSX is:
* anoying copy/paste bug (copied part duplicates the last character)

example:
_sp.graphics.
change _sp into _sprite
becomes
_sprite..graphics.

happy haxe-ing

Categories
Haxe

Installing Haxe and NME on OSX

I recently had to (uninstall and) reinstall Haxe, so I decided that it would be useful to document the process!

Remember this is a post for OSX(10.6.8) install of Haxe(2.09) and NME(3.3.0)!

This entire post started because MonoDevelop didn’t show any auto-completion anymore. It cost me 4 nights to fix the ‘problem’. I deleted Haxe entirely and reinstalled it (and NME/extra libraries) again. I had written the process of install down before to blog about it later, so there is some stuff that happened the previous time I install Haxe and NME (and that means that this it’s not exactly a clean install)

About the deletion/uninstall of Haxe: at the bottom of the post

I can’t thank Joshua Granick (one of the programmers of NME) enough for his help! The man must be a superhero: helping everybody on twitter, writing tutorials/post on his blog, programming an haxe/nme add-in for MonoDevelop, NME (duh), being a dad, having his own game company….(!!)

Start installing Haxe

Download the Haxe OSX install zip from: http://haxe.org/download
And install it like you normally do.

After install you can check if everything went okay (and you need the terminal later on):
open the terminal
(CMD+SPACE and type terminal)

type in the terminal
haxe
to check the install

Download the NME OSX install zip from: http://www.haxenme.org/download/
And install.

type in the terminal
haxelib list
to check what libraries are installed

This is probably not useful for everybody, but these are some of the extra libraries I use…
type in the terminal

haxelib install swf
haxelib install jeash
haxelib install spritesheet
haxelib install format
haxelib install actuate
haxelib install box2d
haxelib install waxe

You probably only want to install these to get NME working
jeash for html5 and actuate to animate stuff

haxelib install jeash
haxelib install actuate

Next we will make a short cut to NME
Type in the terminal
haxelib run nme setup

Explanation from Joshua Granick

If you execute “haxelib run nme setup” from a command-line or terminal, it will add a script to your PATH (in the Haxe directory) that shortens the command string. Instead of having to call “haxelib run nme”, you can simply call “nme”.

This failed on my computer; the terminal spit this back at me

haxelib run nme setup
chmod: Unable to change file mode on /usr/lib/haxe/nme: Operation not permitted
rm: /usr/bin/nme: Permission denied
ln: /usr/bin/nme: File exists

This is probably because I’m on OSX and not on Linux as “root” user….
So fix this with:
sudo haxelib run nme setup, type your password and try again!
(source: http://www.haxenme.org/developers/get-started/)

After this you install the ‘stuff’ you need for development on mobile devices.
I only need android so I installed that (for now):

nme setup android
Download and install the Android SDK? [y/n/a] ? y
Output directory [/opt/Android SDK] : /opt/Android SDK
or just use enter to use the default path

after install the “Android SDK Manager” will be started

download Android 4.0.3 (API 15)

After the “Android SDK Manager” is ready with downloading and install you can close it (it will ask you to do so)

The terminal will start yelling stuff:
Download and install the Android NDK? [y/n/a] ? y
Path to Android NDK [/opt/Android NDK] : /opt/Android NDK
or just use enter to use the default path

Okay.. your good to go!

Install IDE

Install an IDE (read about the choices that I made)

Let’s assume that you will also use MonoDevelop (2.8.8.4):
Download the OSX files (yes 2!) from: http://monodevelop.com/Download
Click on osx and you will get two download options

  • MonoDevelop 2.8.8.4 installer
  • Mono 2.10.5 + GTK#

Click/Download MonoDevelop (pretty straight forward)
Click on Mono and you will go here http://www.go-mono.com/mono-downloads/download.html.
Do you need “An open source, cross-platform, implementation of C# and the CLR that is binary compatible with Microsoft.NET”???
Well… yes: see Mono as the car-engine and MonoDevelop as the rest of the car (you as the driver)… you need both to go on a road trip!

We want stable release: “Latest Stable Version: 2.10.8” and click again on OSX.
At the bottom of the page you will see some links appears
download the Intel Mac: “Runtime”

Install both files you just downloaded
And open MonoDevelop (in Applications)!

Add-in Manager Monodevelop
The only thing you need to do now is:
MonoDevelop > Add-in Manager > Gallery tab > Language bindings > Haxe language Binding
Install that add-in (0.2.1).

Your MonoDevelop is ready for Haxe/NME programming.
Moving from FDT to MonoDevelop? I wrote something about that to make it somewhat easier: Moving from FDT to Monodevelop for Haxe and NME

About your first NME > Flash project, visit Joshua Granick post: getting-started-with-haxeflash-in-monodevelop/ he has also one form cpp and html5..

Happy Haxe-ing

Uninstall Haxe on OSX

something you should never do 😀

After updating to Haxe 2.09 (and updated the Add-in) I noticed that the MonoDevelop auto-completion didn’t work anymore.
I mentioned this to Joshua Granick but we couldn’t figur out what it was.

This is probably what happend: I installed Haxe 2.09 very quickly after it was released and after that there was a hotfix which I couldn’t install over the previous installed Haxe…
Eventually Joshua gave me this advice on twitter.

Open the terminal (CMD+SPACE and type terminal) and typerm /usr/bin/haxe
I got “rm: /usr/bin/haxe: Permission denied”
This is probably because I’m on OSX and not on Linux as “root” user….
I fixed this with sudo rm /usr/bin/haxe: you will be asked to fill in you password (there is no feedback of typing) and hit enter, the Haxe folder will be deleted.
(you will lose Haxe and everything you installed in there: NME and libraries, the other install you need to do for NME will still be installed: Android/IOS for example)

After the reinstall everything worked again.
I can finally use my evenings for programming again 😀

Categories
Haxe

Moving from FDT to MonoDevelop for haXe and NME

Before I start with this post I should mention that Joshua Granick (on of the creators of NME) has a post about:How to Install Haxe, NME and MonoDevelop! That will save me some time and who can explain that better than Joshua.

I wrote something similar when I moved from PC (FlashDevelop) to OSX (FDT) (read my post: moving-from-flashdevelop-to-fdt/). Which also was a reminder when I needed to reinstall or explain it to a college.

Want to know why I’m using MonoDevelop?
Moving from FDT to MonoDevelop is not a big step (my opinion 😛 )

After reading my post, it looks like I’m leaving FDT… That is not what I’m doing: I’ll keep on using it for AS3.
But I hope to ‘take’ some features from FDT to MonoDevelop

Adding your own short-cuts / key-binding

First let add some features that I use a lot:
MonoDevelop > Preferences... (CMD+,) > Key Bindings
search for “comment”
Toggle Line Comment : Edit Binding > (CMD + 7)
search for “case”
Uppercase Selection : Edit Binding > (CTRL + SHIFT + X)
Lowercase Selection : Edit Binding > (CTRL + SHIFT + Y)
search for “template”
Insert template.. : Edit Binding > (CMD + SHIFT + 1) [doesn’t work yet]

Using default Short cuts – (besides the ‘normal’ short cuts)

Then there are some default shortcuts you use a lot:
run >> ALT + CMD + enter
debug >> CMD + enter (doesn’t work)
move the line or highlighted section down >> ALT + ARROWDOWN
move the line or highlighted section up >> ALT + ARROWUP
show completion window >> ALT + SPACE

Adding personal info

Don’t have to explain this … right?
MonoDevelop > Preferences... (CMD+,) > Author Information

Changing settings

Perhaps this is very personal, but I’m not writing this for you alone (it’s also a reminder to myself!)
MonoDevelop > Preferences... (CMD+,) > Text Editor > Behavior >

  • check: Insert matching brace
  • check: Smart semicolon placement
  • check: Enable on the fly code formatting (doesn’t do anything)
  • check: Format document on save (doesn’t do anything)

and
MonoDevelop > Preferences... (CMD+,) > Text Editor > Behavior > XML

  • check all

Moving on:
MonoDevelop > Preferences... (CMD+,) > Text Editor > Syntax Highlighting
I installed Monokai for Darius Kucinskas: you can get it from github. That because I use it on TextMate and gotten use to it….
Joshua Granick has created a FlashDevelop color scheme (if there are people who want to move from PC to Mac/Linux).

Templates/snippets

And then the most interesting… the one that doesn’t seems to be working
MonoDevelop > Preferences... (CMD+,) > Text Editor > Code Templates
Code templates are awesome and speed up your development a lot (create a getter/setter in just one click for example)
Just do the following:
Edit > Insert template...
And remember that the mime type is:
mime: text/x-haxe
It really doesn’t matter what you do… for example // test


but then only bugs…

🙁

Something to read: The official statement from MonoDevelop about Code Templates.

I would like to see

I miss some stuff that I was very use to, so lets make that a NICE-TO-HAVE-LIST

  • feedback when exporting/compiling to a target like SublimeText 2 or in the terminal.
  • code completion on variables and functions
  • templates that work
  • duplicate line (up/down)
  • code formatting
  • auto import
  • code checking while typing/checking without running
  • if auto code checking is not going to happen: a shortcut to check your code
  • automatic “add to folder” (for all folders)
  • TODO added to “Task list”
Categories
Haxe

haXe and NME IDE and Editors OSX

Update #1: The Haxe MonoDevelop add-in is now available in the official add-in repository So starting with haXe development got easier! (check the MonoDevelop add-in repository). Updated install

I’ve been playing around with haXe for some time now. And when you do that, you will automatically notice NME.

HaXe is really awesome and very easy to learn when you are a ActionScript (AS3) developer. (NME has a great cheat sheet which also works for haXe).

But this post is not about explaining haXe or NME (just read the links I provided) and it’s not a tutorial about programming in haXe.
This is about programming: an IDE to help you develop much quicker.

There are a lot of IDE which support haXe: just check it here.
It seems like a big list…. but not entirely true…
For windows it’s easy: just get FlashDevelop.
Before I moved to OSX, I did all my Flash development on it and it rocks!

But for OSX it’s not that easy. So it comes down to a few contenders…
Sadly Sam Brick beat me with writing about this subject.
He only ends up taking another route… because there was no other choice.

But because I already started writing this post, I will finish it.

First I tried the editor I use for my Actionscript programming:

FDT 5 (PC, Mac and Linux) (free and €249/€499)

FDT is a commercial product (FDT max) but there is a free version (FDT free). And both version support haXe.
Although I love FDT for AS3 programming, I don’t feel that way for haXe. I miss to many features I have in the AS FDT (templates, trace, snippets, format, autoimport). It also feels very sluggish (I know Eclipse doesn’t help with that, but it feels soooo slow compared with the as3 counterpart.). And it doesn’t support NME and so although I wrote FDT templates for NME, it doesn’t help you.
FDT made a clever move adding haXe to its editor, but it should be labeled beta.

So I moved to my second editor on OSX:

TextMate (Mac only) (€44.85)

TextMate is a commercial product, but it will not set you back that much. You can try it for 30 days. And it’s awesome. I use it to open files quickly.
But what I don’t like about TextMate is the autocompletion… it’s under escape… doesn’t feel natural.

So my search brought me to a new editor:

SublimeText 2 (PC, Mac and Linux) (USD $59)

SublimeText 2 is a commercial product just like TextMate. You can evaluate this product for free and there is currently no enforced time limit for the evaluation.
This one is very good, still in beta but very useable.
You need to install the haXe bundle: the instruction can be found here

The haXe Sublime Text 2 bundle enables:

  • haXe compiler code completion and hints
  • syntax highlighting and basic completion for hx, hxml, hss and nmml files
  • Sublime build system integration
  • hxml parsing, automatic creation, and multiple build management (ctrl+shift+b)
  • supports NME projects (nmml)

This editor would have been my choice if there was no MonoDevelop (just wait and you will see 😛 ).

Another great solution would be:

IntelliJ IDEA (PC, Mac and Linux) (from €94 -> €664)

IntelliJ IDEA is a commercial product that you can try out for 30 days. It’s the choice that Sam Brick ended up with. I can’t tell you much about it.
I did install it but haven’t tried it simple because I already have FDT (set me back €499) and IntelliJ would cost another €189 (Personal license) for experiments.
But it seems very powerful and I know some AS3 developers who use it, so in that scenario IntelliJ would be the obvious choice.

Here comes the most promising editor (for now):

MonoDevelop (PC, Mac and Linux) (free!)

MonoDevelop…. it even sounds like FlashDevelop and its free like FlashDevelop. This is so new that there is not a lot of blogging done about it (Saumya beat me to it 🙁 )
This is one awesome project which is so new it still has ribbons on it! One of the lead programmers of NME; Joshua Granick asked himself why FlashDevelop (his code editor of choice) couldn’t be ported to Linux and OSX.
He learned from previous attempts and made a start with it… and it works!

I’m not going to repeat what Joshua said; just go and visit his blog and read about it (and then return here again…. I’ll just wait for a minute of two) FlashDevelop for Mac/Linux: Part 1

If you want to know about the latest development of this addin, you can follow Joshua on twitter: @singmajesty.

Currently you have to copy the .dll from the git repository to a the correct folder but then it should work fine.
But that can change very quickly:

I’m waiting for MonoDevelop to allow my add-in in the official (beta) repositories. That will make it much easier to upgrade in the future

source


Note:
Oh still here? You want to know how to get started?
First you need to download MonoDevelop.HaxeBinding.dll from Github: press the button “Raw” and the file will be downloaded.
Then you need to copy it in the folder: ~/Library/Application Support/MonoDevelop-2.8/LocalInstall/Addins.
This folder will not be there so you need to create it for yourself (this path is when you use OSX and installed the latest MonoDevelop).

Don’t feel very comfortable doing that?
MonoDevelop can create the folder for you … but you still need to copy the .dll yourself.
goto: MonoDevelop > Add-in manager… > gallery > IDE extensions > Specflow Support > install…
and then uninstall it again (folders are made, but you don’t need the extension)


You don’t have to install it by hand… just goto:
MonoDevelop > Add-in Manager > Gallery tab > Language bindings > Haxe language Binding

This is not the latest version (as fare as I know) so if you are more adventurous the github download and install is still the way to go (that’s what I’m doing).