Hello World
This tutorial will show you how to program your first Fire★ App. We will create a button which, when pressed changes it's text to "Hello World"
Starting the App Editor
Fire★ has a built in App Editor which allows you to write an App by yourself or together with any number of other people.
The App Editor compiles the code as you write it and provides immediate feedback on errors.
If you are writing an App that sends messages, it is best to either program it with a friend, or run a test instance of Fire★. The App we are writing in this tutorial won't require another instance. How to run a test instance will be explained in another tutorial.
To start the App Editor:
- Create a new conversation via the
Conversation
menu. - Select
App Editor
in theApp
menu. - Select
"<new app\>"
in the App selection dialog and pressOK
.
How the App Editor Works
The App Editor is composed of two main parts. There is a code
tab and a data
tab.
The code
tab is where you write you App code and the data
tab is where you can import
files, images, or other data into your App.
The code
tab is composed of four parts
- A
canvas
where you can place widgets. - A
print area
where messages and print statements are displayed. - The
code editor
where you write your code. - The
save
andexport
buttons.
Writing the Code
All Fire★ apps are written in Lua and all API functions are under the app
object.
To create a button you use the "button"
function which accepts the text you want the button to display.
Type the following in the code editor.
hello = app:button("Hello")
Apps are compiled and executed automatically when you stop typing. You won't see a button
yet because you have to place the button on the canvas
.
app:place(hello, 0, 0)
You can imagine the canvas
as an invisible grid where you can place widgets. The first
parameter is the widget you want to place, the second is the row, and third is the column. The row
and column start from zero. Now you should see your hello button on the canvas
.
If you click on it, nothing should happen. You have to register a function that will be called when the button is clicked.
hello:when_clicked("world()")
The "when_clicked"
function will execute the code inside the quotes. In this case it will
call a function "world"
with no parameters.
If you click the button now you should see an error in the print area
.
error: Lua Error:
-------------------------------------------------------
[string "--app..."]:2: attempt to call global 'world' (a nil value)
Traceback: [ 0 (C) ] @ world(global)
[ 1 (main) ] [string "--app..."]:2
To fix this we have to create a function called "world"
function world()
end
If you click now, you should not get any error. Of course nothing will happen, so we have
to make this function do something. What we will do is change the text of our button to
say "Hello World"
function world()
hello:set_text("Hello World")
end
Clicking on the button now should change the button text to "Hello World"
. If you click it
a second time, nothing new should happen. Congratulations, you wrote your first Fire★ App!
To save the app to your collection press the save
button at the bottom and give it a
name. You can now use this App in a conversation with others. Other people won't need to
install this App because it gets deployed automatically when it is used.
Code Listing
The full App code is listed below.
hello = app:button("Hello")
app:place(hello, 0, 0)
hello:when_clicked("world()")
function world()
hello:set_text("Hello World")
end