B2G/DeveloperPhone: Difference between revisions

no edit summary
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
Confirmed users
717

edits