Confirmed users
717
edits
No edit summary |
No edit summary |
||
(19 intermediate revisions by 4 users not shown) | |||
Line 1: | Line 1: | ||
==Gaia Developer Environment== | __TOC__ | ||
{{warning|This page is horribly out of date. Please see https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Building_and_installing_Firefox_OS instead.}} | |||
==JSConf Hack Night== | |||
Categories: | |||
*Most awesome lock screen (we have WebGL!)
| |||
*Prettiest home screen
| |||
*Best B2G app
| |||
*Craziest system hack (node on the phone? speech recognition? NFC?)
| |||
Submit a pull request to Gaia or B2G by tomorrow (Tuesday, 4/3) midnight PST. Describe what you did and post it somewhere, and email a link to gal@mozilla.com. We will notify the winners end of this week, and we will showcase the best submissions on hacks.mozilla.org and Brendan's blog. | |||
==Writing apps for B2G== | |||
See the [https://developer.mozilla.org/en/Mozilla/Boot_to_Gecko/Writing_a_web_app documentation on the Mozilla Developer Network]. | |||
==Gaia/B2G Development Environment== | |||
<b>WINDOWS USERS:</b> We do not currently support Windows as development platform. You can install a Linux VM using VMWare Player (see http://www.howtogeek.com/howto/11287/how-to-run-ubuntu-in-windows-7-with-vmware-player/). | |||
The user interface on the phone is called "Gaia". It is hosted on gaiamobile.org, and offline cached on the device using appcache. At the moment the easiest way to modify Gaia is to check out the Gaia repository, modify the HTML5/JS source, and upload the new content to the phone. We will discuss this approach first: | The user interface on the phone is called "Gaia". It is hosted on gaiamobile.org, and offline cached on the device using appcache. At the moment the easiest way to modify Gaia is to check out the Gaia repository, modify the HTML5/JS source, and upload the new content to the phone. We will discuss this approach first: | ||
Line 35: | Line 54: | ||
Make sure to install the <b>Platform Tools</b> (not installed by default). | Make sure to install the <b>Platform Tools</b> (not installed by default). | ||
Alternatively, manually download adb from the links below into a directory that's in your PATH. This is faster but more complicated. If you're on a linux host | |||
curl http://update.boot2gecko.org/m2.5/adb-linux-x86 -o adb | |||
chmod +x adb | |||
and if you're on OS X | |||
curl http://update.boot2gecko.org/m2.5/adb-darwin-x86 -o adb | |||
chmod +x adb | |||
4. Make sure adb is in your path. | 4. Make sure adb is in your path. | ||
Line 55: | Line 82: | ||
<b>Control-D</b> exits the shell again. | <b>Control-D</b> exits the shell again. | ||
==Gecko== | 6. Now lets flash a new version of Gaia onto the phone: | ||
Note: The first time install-gaia is invoked the Makefile will download xulrunner, which is used to build the appcache. Make sure you are connected to the network. | |||
$ make install-gaia | |||
git rev-parse HEAD > apps/settings/gaia-commit.txt | |||
bbc | |||
browser | |||
calculator | |||
calendar | |||
camera | |||
clock | |||
cnn | |||
crystalskull | |||
cubevid | |||
cuttherope | |||
dialer | |||
facebook | |||
gallery | |||
gmail | |||
homescreen | |||
maps | |||
market | |||
music | |||
nytimes | |||
penguinpop | |||
settings | |||
sms | |||
towerjelly | |||
video | |||
wikipedia | |||
zimbra | |||
test -d xulrunner-sdk || (wget http://ftp.mozilla.org/pub/mozilla.org/xulrunner/releases/11.0/sdk/xulrunner-11.0.en-US.mac-x86_64.sdk.tar.bz2 && tar xjf xulrunner*.tar.bz2 && rm xulrunner*.tar.bz2) | |||
--2012-04-02 01:55:32-- http://ftp.mozilla.org/pub/mozilla.org/xulrunner/releases/11.0/sdk/xulrunner-11.0.en-US.mac-x86_64.sdk.tar.bz2 | |||
Resolving ftp.mozilla.org (ftp.mozilla.org)... 63.245.209.137 | |||
Connecting to ftp.mozilla.org (ftp.mozilla.org)|63.245.209.137|:80... connected. | |||
HTTP request sent, awaiting response... 200 OK | |||
Length: 56155841 (54M) [application/x-bzip2] | |||
Saving to: `xulrunner-11.0.en-US.mac-x86_64.sdk.tar.bz2' | |||
... | |||
push: profile/webapps/video/manifest.json -> /data/local/webapps/video/manifest.json | |||
push: profile/webapps/wikipedia/manifest.json -> /data/local/webapps/wikipedia/manifest.json | |||
push: profile/webapps/zimbra/manifest.json -> /data/local/webapps/zimbra/manifest.json | |||
push: profile/webapps/webapps.json -> /data/local/webapps/webapps.json | |||
27 files pushed. 0 files skipped. | |||
304 KB/s (25655 bytes in 0.082s) | |||
Rebooting b2g now | |||
adb shell kill 87 | |||
The phone should reboot and within about a second the new version of Gaia should be on the screen. | |||
==Advanced Gaia Hacking== | |||
You can find a lot of tips and instructions for advanced Gaia hacking at https://wiki.mozilla.org/Gaia/Hacking. Amongst others we have desktop builds of b2g, and you can use them to develop your app. In the alternative, you can also use Firefox, but watch out for differences between desktop and mobile (e.g. touch events). | |||
For the particularly adventurous, you can also redirect the domain for an installed app in the <i>/etc/hosts</i> file on the phone to a server you own. Copy the files of an app onto the server and start modifying the code. To reload the UI on the phone, simply kill the b2g process. The following command line takes care of that: | |||
adb shell kill `adb shell toolbox ps | grep "b2g" | awk '{ print $2; }'` | |||
You can add new applications to your local gaia directory and then push those onto device. To do that, | |||
1. In your gaia checkou $gaia, create a new directory $gaia/apps/$foo. Here, I'll use $foo to refer to your new application. | |||
2. Copy all your applications files into $gaia/apps/$foo/. | |||
3. Create a new file $gaia/apps/$foo/manifest.json. Here are some "starter" file contents, edit to your desire | |||
{ | |||
"name": "Foo", | |||
"default_locale": "en-US", | |||
"icons": { | |||
"120": "your/icon/here.png" | |||
}, | |||
"description": "Foo", | |||
"launch_path": "/", | |||
"locales": { | |||
"en-US": { | |||
"name": "Foo", | |||
"description": "Foo" | |||
}, | |||
"fr": { | |||
"name": "Foo", | |||
"description": "Foo" | |||
} | |||
}, | |||
"developer": { | |||
"url": "http://foo.example.com", | |||
"name": "You" | |||
} | |||
} | |||
4. Append your app's information to $gaia/apps/webapps.json. (This is a temporary step.) This will get you started | |||
"foo": { | |||
"origin": "http://foo.example.com/", | |||
"installOrigin": "http://foo.example.com/", | |||
"receipt": null, | |||
"installTime": 1323339869000 | |||
} | |||
5. Upload a new gaia with your changes | |||
$ make install-gaia | |||
==Restoring Gecko== | |||
Gecko is the "rendering engine", or "application runtime", on the device. It's the same engine that powers Firefox. The Gecko build on your phone is configured to automatically update itself. It should mostly stay out of your way. | |||
However, if something does go wrong, you can repair your Gecko installation by running the following commands in your shell | |||
curl update.boot2gecko.org/m2.5/b2g-gecko-m2.5-recovery.zip > b2g-gecko-m2.5-recovery.zip | |||
unzip b2g-gecko-m2.5-recovery.zip | |||
cd b2g-gecko-m2.5-recovery | |||
make install-gecko |