--- a/b2g/config/dolphin/sources.xml
+++ b/b2g/config/dolphin/sources.xml
@@ -10,17 +10,17 @@
   <!--original fetch url was git://codeaurora.org/-->
   <remote fetch="https://git.mozilla.org/external/caf" name="caf"/>
   <!--original fetch url was https://git.mozilla.org/releases-->
   <remote fetch="https://git.mozilla.org/releases" name="mozillaorg"/>
   <!-- B2G specific things. -->
   <project name="platform_build" path="build" remote="b2g" revision="fe92ddd450e03b38edb2d465de7897971d68ac68">
     <copyfile dest="Makefile" src="core/root.mk"/>
   </project>
-  <project name="gaia" path="gaia" remote="mozillaorg" revision="f108c706fae43cd61628babdd9463e7695b2496e"/>
+  <project name="gaia" path="gaia" remote="mozillaorg" revision="7f21bdda274f0329393ef0e5a9374c06255c6f57"/>
   <project name="fake-libdvm" path="dalvik" remote="b2g" revision="d50ae982b19f42f0b66d08b9eb306be81687869f"/>
   <project name="gonk-misc" path="gonk-misc" remote="b2g" revision="6969df171e5295f855f12d12db0382048e6892e7"/>
   <project name="librecovery" path="librecovery" remote="b2g" revision="891e5069c0ad330d8191bf8c7b879c814258c89f"/>
   <project name="moztt" path="external/moztt" remote="b2g" revision="562d357b72279a9e35d4af5aeecc8e1ffa2f44f1"/>
   <project name="rilproxy" path="rilproxy" remote="b2g" revision="827214fcf38d6569aeb5c6d6f31cb296d1f09272"/>
   <project name="valgrind" path="external/valgrind" remote="b2g" revision="daa61633c32b9606f58799a3186395fd2bbb8d8c"/>
   <project name="vex" path="external/VEX" remote="b2g" revision="47f031c320888fe9f3e656602588565b52d43010"/>
   <project name="apitrace" path="external/apitrace" remote="apitrace" revision="facdb3593e63dcbb740709303a5b2527113c50a0"/>
@@ -33,17 +33,17 @@
   <project groups="linux,x86" name="platform/prebuilts/python/linux-x86/2.7.5" path="prebuilts/python/linux-x86/2.7.5" revision="83760d213fb3bec7b4117d266fcfbf6fe2ba14ab"/>
   <project name="device/common" path="device/common" revision="6a2995683de147791e516aae2ccb31fdfbe2ad30"/>
   <project name="device/sample" path="device/sample" revision="1a3d8efa0ad32ec8f145367a3cf0f54b97385c3c"/>
   <project name="platform/abi/cpp" path="abi/cpp" revision="18f1b5e28734183ff8073fe86dc46bc4ebba8a59"/>
   <project name="platform/bionic" path="bionic" revision="86b1f589c313422a7da1812512b9ec8d1cf9ba3c"/>
   <project name="platform/bootable/recovery" path="bootable/recovery" revision="4eece0d80928a2b5266b78421ebf0c8686d4ad2c"/>
   <project name="platform/external/aac" path="external/aac" revision="fa3eba16446cc8f2f5e2dfc20d86a49dbd37299e"/>
   <project name="platform/external/bison" path="external/bison" revision="c2418b886165add7f5a31fc5609f0ce2d004a90e"/>
-  <project name="platform/external/bluetooth/bluedroid" path="external/bluetooth/bluedroid" revision="c50830cae1b748024eec7e73ad98a4e427f663c7"/>
+  <project name="platform/external/bluetooth/bluedroid" path="external/bluetooth/bluedroid" revision="c8e99ca7e11c00f8124196fe1726a15e6e976587"/>
   <project name="platform/external/bsdiff" path="external/bsdiff" revision="23e322ab19fb7d74c2c37e40ce364d9f709bdcee"/>
   <project name="platform/external/bzip2" path="external/bzip2" revision="1cb636bd8e9e5cdfd5d5b2909a122f6e80db62de"/>
   <project name="platform/external/checkpolicy" path="external/checkpolicy" revision="0d73ef7049feee794f14cf1af88d05dae8139914"/>
   <project name="platform/external/dhcpcd" path="external/dhcpcd" revision="84b7252b0a9d0edc9a1db1e0c518771d26b23058"/>
   <project name="platform/external/dnsmasq" path="external/dnsmasq" revision="41d356427a632f5336384bfa45c8420ffc274f66"/>
   <project name="platform/external/dropbear" path="external/dropbear" revision="a34ddbe3819bc465968f3676c734b405e655f8b7"/>
   <project name="platform/external/e2fsprogs" path="external/e2fsprogs" revision="47478a2944a2a17c7fdebe9d92573db92013125c"/>
   <project name="platform/external/elfutils" path="external/elfutils" revision="b23b2dfb354b3ccf5d1c5d39815f02e7048cf516"/>

--- a/b2g/config/emulator-ics/sources.xml
+++ b/b2g/config/emulator-ics/sources.xml
@@ -10,21 +10,21 @@
   <!--original fetch url was git://github.com/mozilla/-->
   <remote fetch="https://git.mozilla.org/b2g" name="mozilla"/>
   <!--original fetch url was https://git.mozilla.org/releases-->
   <remote fetch="https://git.mozilla.org/releases" name="mozillaorg"/>
   <!--original fetch url was git://github.com/apitrace/-->
   <remote fetch="https://git.mozilla.org/external/apitrace" name="apitrace"/>
   <default remote="caf" revision="refs/tags/android-4.0.4_r2.1" sync-j="4"/>
   <!-- Gonk specific things and forks -->
-  <project name="platform_build" path="build" remote="b2g" revision="700b031a54079f791344aa091798f6b43a9e2900">
+  <project name="platform_build" path="build" remote="b2g" revision="4d1e85908d792d9468c4da7040acd191fbb51b40">
     <copyfile dest="Makefile" src="core/root.mk"/>
   </project>
   <project name="fake-dalvik" path="dalvik" remote="b2g" revision="ca1f327d5acc198bb4be62fa51db2c039032c9ce"/>
-  <project name="gaia.git" path="gaia" remote="mozillaorg" revision="f108c706fae43cd61628babdd9463e7695b2496e"/>
+  <project name="gaia.git" path="gaia" remote="mozillaorg" revision="7f21bdda274f0329393ef0e5a9374c06255c6f57"/>
   <project name="gonk-misc" path="gonk-misc" remote="b2g" revision="6969df171e5295f855f12d12db0382048e6892e7"/>
   <project name="rilproxy" path="rilproxy" remote="b2g" revision="827214fcf38d6569aeb5c6d6f31cb296d1f09272"/>
   <project name="platform_hardware_ril" path="hardware/ril" remote="b2g" revision="cd88d860656c31c7da7bb310d6a160d0011b0961"/>
   <project name="platform_external_qemu" path="external/qemu" remote="b2g" revision="c058843242068d0df7c107e09da31b53d2e08fa6"/>
   <project name="moztt" path="external/moztt" remote="b2g" revision="562d357b72279a9e35d4af5aeecc8e1ffa2f44f1"/>
   <project name="apitrace" path="external/apitrace" remote="apitrace" revision="facdb3593e63dcbb740709303a5b2527113c50a0"/>
   <!-- Stock Android things -->
   <project name="platform/abi/cpp" path="abi/cpp" revision="dd924f92906085b831bf1cbbc7484d3c043d613c"/>

--- a/b2g/config/emulator-jb/sources.xml
+++ b/b2g/config/emulator-jb/sources.xml
@@ -12,17 +12,17 @@
   <!--original fetch url was https://git.mozilla.org/releases-->
   <remote fetch="https://git.mozilla.org/releases" name="mozillaorg"/>
   <!-- B2G specific things. -->
   <project name="platform_build" path="build" remote="b2g" revision="8986df0f82e15ac2798df0b6c2ee3435400677ac">
     <copyfile dest="Makefile" src="core/root.mk"/>
   </project>
   <project name="rilproxy" path="rilproxy" remote="b2g" revision="827214fcf38d6569aeb5c6d6f31cb296d1f09272"/>
   <project name="fake-libdvm" path="dalvik" remote="b2g" revision="d50ae982b19f42f0b66d08b9eb306be81687869f"/>
-  <project name="gaia" path="gaia" remote="mozillaorg" revision="f108c706fae43cd61628babdd9463e7695b2496e"/>
+  <project name="gaia" path="gaia" remote="mozillaorg" revision="7f21bdda274f0329393ef0e5a9374c06255c6f57"/>
   <project name="gonk-misc" path="gonk-misc" remote="b2g" revision="6969df171e5295f855f12d12db0382048e6892e7"/>
   <project name="moztt" path="external/moztt" remote="b2g" revision="562d357b72279a9e35d4af5aeecc8e1ffa2f44f1"/>
   <project name="apitrace" path="external/apitrace" remote="apitrace" revision="facdb3593e63dcbb740709303a5b2527113c50a0"/>
   <project name="valgrind" path="external/valgrind" remote="b2g" revision="daa61633c32b9606f58799a3186395fd2bbb8d8c"/>
   <project name="vex" path="external/VEX" remote="b2g" revision="47f031c320888fe9f3e656602588565b52d43010"/>
   <!-- Stock Android things -->
   <project groups="linux" name="platform/prebuilts/clang/linux-x86/3.1" path="prebuilts/clang/linux-x86/3.1" revision="5c45f43419d5582949284eee9cef0c43d866e03b"/>
   <project groups="linux" name="platform/prebuilts/clang/linux-x86/3.2" path="prebuilts/clang/linux-x86/3.2" revision="3748b4168e7bd8d46457d4b6786003bc6a5223ce"/>
@@ -125,16 +125,16 @@
   <project name="platform/system/security" path="system/security" revision="f48ff68fedbcdc12b570b7699745abb6e7574907"/>
   <project name="platform/system/vold" path="system/vold" revision="8de05d4a52b5a91e7336e6baa4592f945a6ddbea"/>
   <default remote="caf" revision="refs/tags/android-4.3_r2.1" sync-j="4"/>
   <!-- Emulator specific things -->
   <project name="android-development" path="development" remote="b2g" revision="dab55669da8f48b6e57df95d5af9f16b4a87b0b1"/>
   <project name="device/generic/armv7-a-neon" path="device/generic/armv7-a-neon" revision="3a9a17613cc685aa232432566ad6cc607eab4ec1"/>
   <project name="device_generic_goldfish" path="device/generic/goldfish" remote="b2g" revision="197cd9492b9fadaa915c5daf36ff557f8f4a8d1c"/>
   <project name="platform/external/libnfc-nci" path="external/libnfc-nci" revision="7d33aaf740bbf6c7c6e9c34a92b371eda311b66b"/>
-  <project name="libnfcemu" path="external/libnfcemu" remote="b2g" revision="c7ccf6eff27f99e39a9eca94cde48aaece5e47db"/>
+  <project name="libnfcemu" path="external/libnfcemu" remote="b2g" revision="125ccf9bd5986c7728ea44508b3e1d1185ac028b"/>
   <project name="platform_external_qemu" path="external/qemu" remote="b2g" revision="d259117b4976decbe2f76eeed85218bf0109190f"/>
   <project name="platform/external/wpa_supplicant_8" path="external/wpa_supplicant_8" revision="0e56e450367cd802241b27164a2979188242b95f"/>
   <project name="platform_hardware_ril" path="hardware/ril" remote="b2g" revision="9f28c4faea3b2f01db227b2467b08aeba96d9bec"/>
   <project name="platform_system_nfcd" path="system/nfcd" remote="b2g" revision="54a712b46fe937dacdaed9b1261c63847129a719"/>
   <project name="android-sdk" path="sdk" remote="b2g" revision="8b1365af38c9a653df97349ee53a3f5d64fd590a"/>
   <project name="darwinstreamingserver" path="system/darwinstreamingserver" remote="b2g" revision="cf85968c7f85e0ec36e72c87ceb4837a943b8af6"/>
 </manifest>

--- a/b2g/config/emulator-kk/sources.xml
+++ b/b2g/config/emulator-kk/sources.xml
@@ -10,17 +10,17 @@
   <!--original fetch url was git://codeaurora.org/-->
   <remote fetch="https://git.mozilla.org/external/caf" name="caf"/>
   <!--original fetch url was https://git.mozilla.org/releases-->
   <remote fetch="https://git.mozilla.org/releases" name="mozillaorg"/>
   <!-- B2G specific things. -->
   <project name="platform_build" path="build" remote="b2g" revision="fe92ddd450e03b38edb2d465de7897971d68ac68">
     <copyfile dest="Makefile" src="core/root.mk"/>
   </project>
-  <project name="gaia" path="gaia" remote="mozillaorg" revision="f108c706fae43cd61628babdd9463e7695b2496e"/>
+  <project name="gaia" path="gaia" remote="mozillaorg" revision="7f21bdda274f0329393ef0e5a9374c06255c6f57"/>
   <project name="fake-libdvm" path="dalvik" remote="b2g" revision="d50ae982b19f42f0b66d08b9eb306be81687869f"/>
   <project name="gonk-misc" path="gonk-misc" remote="b2g" revision="6969df171e5295f855f12d12db0382048e6892e7"/>
   <project name="librecovery" path="librecovery" remote="b2g" revision="891e5069c0ad330d8191bf8c7b879c814258c89f"/>
   <project name="moztt" path="external/moztt" remote="b2g" revision="562d357b72279a9e35d4af5aeecc8e1ffa2f44f1"/>
   <project name="rilproxy" path="rilproxy" remote="b2g" revision="827214fcf38d6569aeb5c6d6f31cb296d1f09272"/>
   <project name="valgrind" path="external/valgrind" remote="b2g" revision="daa61633c32b9606f58799a3186395fd2bbb8d8c"/>
   <project name="vex" path="external/VEX" remote="b2g" revision="47f031c320888fe9f3e656602588565b52d43010"/>
   <project name="apitrace" path="external/apitrace" remote="apitrace" revision="facdb3593e63dcbb740709303a5b2527113c50a0"/>

--- a/b2g/config/emulator/sources.xml
+++ b/b2g/config/emulator/sources.xml
@@ -10,21 +10,21 @@
   <!--original fetch url was git://github.com/mozilla/-->
   <remote fetch="https://git.mozilla.org/b2g" name="mozilla"/>
   <!--original fetch url was https://git.mozilla.org/releases-->
   <remote fetch="https://git.mozilla.org/releases" name="mozillaorg"/>
   <!--original fetch url was git://github.com/apitrace/-->
   <remote fetch="https://git.mozilla.org/external/apitrace" name="apitrace"/>
   <default remote="caf" revision="refs/tags/android-4.0.4_r2.1" sync-j="4"/>
   <!-- Gonk specific things and forks -->
-  <project name="platform_build" path="build" remote="b2g" revision="700b031a54079f791344aa091798f6b43a9e2900">
+  <project name="platform_build" path="build" remote="b2g" revision="4d1e85908d792d9468c4da7040acd191fbb51b40">
     <copyfile dest="Makefile" src="core/root.mk"/>
   </project>
   <project name="fake-dalvik" path="dalvik" remote="b2g" revision="ca1f327d5acc198bb4be62fa51db2c039032c9ce"/>
-  <project name="gaia.git" path="gaia" remote="mozillaorg" revision="f108c706fae43cd61628babdd9463e7695b2496e"/>
+  <project name="gaia.git" path="gaia" remote="mozillaorg" revision="7f21bdda274f0329393ef0e5a9374c06255c6f57"/>
   <project name="gonk-misc" path="gonk-misc" remote="b2g" revision="6969df171e5295f855f12d12db0382048e6892e7"/>
   <project name="rilproxy" path="rilproxy" remote="b2g" revision="827214fcf38d6569aeb5c6d6f31cb296d1f09272"/>
   <project name="platform_hardware_ril" path="hardware/ril" remote="b2g" revision="cd88d860656c31c7da7bb310d6a160d0011b0961"/>
   <project name="platform_external_qemu" path="external/qemu" remote="b2g" revision="c058843242068d0df7c107e09da31b53d2e08fa6"/>
   <project name="moztt" path="external/moztt" remote="b2g" revision="562d357b72279a9e35d4af5aeecc8e1ffa2f44f1"/>
   <project name="apitrace" path="external/apitrace" remote="apitrace" revision="facdb3593e63dcbb740709303a5b2527113c50a0"/>
   <!-- Stock Android things -->
   <project name="platform/abi/cpp" path="abi/cpp" revision="dd924f92906085b831bf1cbbc7484d3c043d613c"/>

--- a/b2g/config/flame-kk/sources.xml
+++ b/b2g/config/flame-kk/sources.xml
@@ -10,17 +10,17 @@
   <!--original fetch url was git://codeaurora.org/-->
   <remote fetch="https://git.mozilla.org/external/caf" name="caf"/>
   <!--original fetch url was https://git.mozilla.org/releases-->
   <remote fetch="https://git.mozilla.org/releases" name="mozillaorg"/>
   <!-- B2G specific things. -->
   <project name="platform_build" path="build" remote="b2g" revision="fe92ddd450e03b38edb2d465de7897971d68ac68">
     <copyfile dest="Makefile" src="core/root.mk"/>
   </project>
-  <project name="gaia" path="gaia" remote="mozillaorg" revision="f108c706fae43cd61628babdd9463e7695b2496e"/>
+  <project name="gaia" path="gaia" remote="mozillaorg" revision="7f21bdda274f0329393ef0e5a9374c06255c6f57"/>
   <project name="fake-libdvm" path="dalvik" remote="b2g" revision="d50ae982b19f42f0b66d08b9eb306be81687869f"/>
   <project name="gonk-misc" path="gonk-misc" remote="b2g" revision="6969df171e5295f855f12d12db0382048e6892e7"/>
   <project name="librecovery" path="librecovery" remote="b2g" revision="891e5069c0ad330d8191bf8c7b879c814258c89f"/>
   <project name="moztt" path="external/moztt" remote="b2g" revision="562d357b72279a9e35d4af5aeecc8e1ffa2f44f1"/>
   <project name="rilproxy" path="rilproxy" remote="b2g" revision="827214fcf38d6569aeb5c6d6f31cb296d1f09272"/>
   <project name="valgrind" path="external/valgrind" remote="b2g" revision="daa61633c32b9606f58799a3186395fd2bbb8d8c"/>
   <project name="vex" path="external/VEX" remote="b2g" revision="47f031c320888fe9f3e656602588565b52d43010"/>
   <project name="apitrace" path="external/apitrace" remote="apitrace" revision="facdb3593e63dcbb740709303a5b2527113c50a0"/>
@@ -127,17 +127,17 @@
   <remove-project name="platform/hardware/libhardware"/>
   <remove-project name="platform/external/bluetooth/bluedroid"/>
   <!--original fetch url was git://github.com/t2m-foxfone/-->
   <remote fetch="https://git.mozilla.org/external/t2m-foxfone" name="t2m"/>
   <default remote="caf" revision="LNX.LA.3.5.2.1.1" sync-j="4"/>
   <!-- Flame specific things -->
   <project name="device/generic/armv7-a-neon" path="device/generic/armv7-a-neon" revision="1bb28abbc215f45220620af5cd60a8ac1be93722"/>
   <project name="device/qcom/common" path="device/qcom/common" revision="54c32c2ddef066fbdf611d29e4b7c47e0363599e"/>
-  <project name="device-flame" path="device/t2m/flame" remote="b2g" revision="540314ae9c56394c6b1f17a267db9f25c5acb9d6"/>
+  <project name="device-flame" path="device/t2m/flame" remote="b2g" revision="8f988f3950da8d55676b3b77b09d5722b967e07b"/>
   <project name="codeaurora_kernel_msm" path="kernel" remote="b2g" revision="893238eb1215f8fd4f3747169170cc5e1cc33969"/>
   <project name="kernel_lk" path="bootable/bootloader/lk" remote="b2g" revision="9e62af4da848d56841bdde326f9bba26c743c33a"/>
   <project name="platform/external/bluetooth/bluedroid" path="external/bluetooth/bluedroid" revision="082a1f98422e6a6b56f61218d6fcf465e85d4c58"/>
   <project name="platform/external/wpa_supplicant_8" path="external/wpa_supplicant_8" revision="5b71e40213f650459e95d35b6f14af7e88d8ab62"/>
   <project name="platform_external_libnfc-nci" path="external/libnfc-nci" remote="t2m" revision="4186bdecb4dae911b39a8202252cc2310d91b0be"/>
   <project name="platform/frameworks/av" path="frameworks/av" revision="c1814713bd2d07c2af0c236007badc8732a34324"/>
   <project name="platform/frameworks/base" path="frameworks/base" revision="6b58ab45e3e56c1fc20708cc39fa2264c52558df"/>
   <project name="platform/frameworks/native" path="frameworks/native" revision="a46a9f1ac0ed5662d614c277cbb14eb3f332f365"/>

--- a/b2g/config/flame/sources.xml
+++ b/b2g/config/flame/sources.xml
@@ -12,17 +12,17 @@
   <!--original fetch url was https://git.mozilla.org/releases-->
   <remote fetch="https://git.mozilla.org/releases" name="mozillaorg"/>
   <!-- B2G specific things. -->
   <project name="platform_build" path="build" remote="b2g" revision="8986df0f82e15ac2798df0b6c2ee3435400677ac">
     <copyfile dest="Makefile" src="core/root.mk"/>
   </project>
   <project name="librecovery" path="librecovery" remote="b2g" revision="891e5069c0ad330d8191bf8c7b879c814258c89f"/>
   <project name="fake-libdvm" path="dalvik" remote="b2g" revision="d50ae982b19f42f0b66d08b9eb306be81687869f"/>
-  <project name="gaia" path="gaia" remote="mozillaorg" revision="f108c706fae43cd61628babdd9463e7695b2496e"/>
+  <project name="gaia" path="gaia" remote="mozillaorg" revision="7f21bdda274f0329393ef0e5a9374c06255c6f57"/>
   <project name="gonk-misc" path="gonk-misc" remote="b2g" revision="6969df171e5295f855f12d12db0382048e6892e7"/>
   <project name="moztt" path="external/moztt" remote="b2g" revision="562d357b72279a9e35d4af5aeecc8e1ffa2f44f1"/>
   <project name="apitrace" path="external/apitrace" remote="apitrace" revision="facdb3593e63dcbb740709303a5b2527113c50a0"/>
   <project name="valgrind" path="external/valgrind" remote="b2g" revision="daa61633c32b9606f58799a3186395fd2bbb8d8c"/>
   <project name="vex" path="external/VEX" remote="b2g" revision="47f031c320888fe9f3e656602588565b52d43010"/>
   <!-- Stock Android things -->
   <project groups="linux" name="platform/prebuilts/clang/linux-x86/3.1" path="prebuilts/clang/linux-x86/3.1" revision="e95b4ce22c825da44d14299e1190ea39a5260bde"/>
   <project groups="linux" name="platform/prebuilts/clang/linux-x86/3.2" path="prebuilts/clang/linux-x86/3.2" revision="471afab478649078ad7c75ec6b252481a59e19b8"/>

--- a/b2g/config/gaia.json
+++ b/b2g/config/gaia.json
@@ -1,9 +1,9 @@
 {
     "git": {
         "git_revision": "", 
         "remote": "", 
         "branch": ""
     }, 
-    "revision": "a4a76a4221d7d963d01377f38d68768d0e829017", 
+    "revision": "6465db9982731ec95ad344901af20086ad94291f", 
     "repo_path": "/integration/gaia-central"
 }

--- a/b2g/config/hamachi/sources.xml
+++ b/b2g/config/hamachi/sources.xml
@@ -8,21 +8,21 @@
   <!--original fetch url was git://codeaurora.org/-->
   <remote fetch="https://git.mozilla.org/external/caf" name="caf"/>
   <!--original fetch url was https://git.mozilla.org/releases-->
   <remote fetch="https://git.mozilla.org/releases" name="mozillaorg"/>
   <!--original fetch url was git://github.com/apitrace/-->
   <remote fetch="https://git.mozilla.org/external/apitrace" name="apitrace"/>
   <default remote="caf" revision="b2g/ics_strawberry" sync-j="4"/>
   <!-- Gonk specific things and forks -->
-  <project name="platform_build" path="build" remote="b2g" revision="700b031a54079f791344aa091798f6b43a9e2900">
+  <project name="platform_build" path="build" remote="b2g" revision="4d1e85908d792d9468c4da7040acd191fbb51b40">
     <copyfile dest="Makefile" src="core/root.mk"/>
   </project>
   <project name="fake-dalvik" path="dalvik" remote="b2g" revision="ca1f327d5acc198bb4be62fa51db2c039032c9ce"/>
-  <project name="gaia.git" path="gaia" remote="mozillaorg" revision="f108c706fae43cd61628babdd9463e7695b2496e"/>
+  <project name="gaia.git" path="gaia" remote="mozillaorg" revision="7f21bdda274f0329393ef0e5a9374c06255c6f57"/>
   <project name="gonk-misc" path="gonk-misc" remote="b2g" revision="6969df171e5295f855f12d12db0382048e6892e7"/>
   <project name="rilproxy" path="rilproxy" remote="b2g" revision="827214fcf38d6569aeb5c6d6f31cb296d1f09272"/>
   <project name="librecovery" path="librecovery" remote="b2g" revision="891e5069c0ad330d8191bf8c7b879c814258c89f"/>
   <project name="moztt" path="external/moztt" remote="b2g" revision="562d357b72279a9e35d4af5aeecc8e1ffa2f44f1"/>
   <project name="apitrace" path="external/apitrace" remote="apitrace" revision="facdb3593e63dcbb740709303a5b2527113c50a0"/>
   <!-- Stock Android things -->
   <project name="platform/abi/cpp" path="abi/cpp" revision="6426040f1be4a844082c9769171ce7f5341a5528"/>
   <project name="platform/bionic" path="bionic" revision="d2eb6c7b6e1bc7643c17df2d9d9bcb1704d0b9ab"/>

--- a/b2g/config/helix/sources.xml
+++ b/b2g/config/helix/sources.xml
@@ -6,21 +6,21 @@
   <!--original fetch url was git://github.com/mozilla/-->
   <remote fetch="https://git.mozilla.org/b2g" name="mozilla"/>
   <!--original fetch url was git://codeaurora.org/-->
   <remote fetch="https://git.mozilla.org/external/caf" name="caf"/>
   <!--original fetch url was https://git.mozilla.org/releases-->
   <remote fetch="https://git.mozilla.org/releases" name="mozillaorg"/>
   <default remote="caf" revision="b2g/ics_strawberry" sync-j="4"/>
   <!-- Gonk specific things and forks -->
-  <project name="platform_build" path="build" remote="b2g" revision="700b031a54079f791344aa091798f6b43a9e2900">
+  <project name="platform_build" path="build" remote="b2g" revision="4d1e85908d792d9468c4da7040acd191fbb51b40">
     <copyfile dest="Makefile" src="core/root.mk"/>
   </project>
   <project name="fake-dalvik" path="dalvik" remote="b2g" revision="ca1f327d5acc198bb4be62fa51db2c039032c9ce"/>
-  <project name="gaia.git" path="gaia" remote="mozillaorg" revision="f108c706fae43cd61628babdd9463e7695b2496e"/>
+  <project name="gaia.git" path="gaia" remote="mozillaorg" revision="7f21bdda274f0329393ef0e5a9374c06255c6f57"/>
   <project name="gonk-misc" path="gonk-misc" remote="b2g" revision="6969df171e5295f855f12d12db0382048e6892e7"/>
   <project name="rilproxy" path="rilproxy" remote="b2g" revision="827214fcf38d6569aeb5c6d6f31cb296d1f09272"/>
   <project name="librecovery" path="librecovery" remote="b2g" revision="891e5069c0ad330d8191bf8c7b879c814258c89f"/>
   <project name="moztt" path="external/moztt" remote="b2g" revision="562d357b72279a9e35d4af5aeecc8e1ffa2f44f1"/>
   <project name="gonk-patches" path="patches" remote="b2g" revision="223a2421006e8f5da33f516f6891c87cae86b0f6"/>
   <!-- Stock Android things -->
   <project name="platform/abi/cpp" path="abi/cpp" revision="6426040f1be4a844082c9769171ce7f5341a5528"/>
   <project name="platform/bionic" path="bionic" revision="d2eb6c7b6e1bc7643c17df2d9d9bcb1704d0b9ab"/>

--- a/b2g/config/nexus-4/sources.xml
+++ b/b2g/config/nexus-4/sources.xml
@@ -12,17 +12,17 @@
   <!--original fetch url was https://git.mozilla.org/releases-->
   <remote fetch="https://git.mozilla.org/releases" name="mozillaorg"/>
   <!-- B2G specific things. -->
   <project name="platform_build" path="build" remote="b2g" revision="8986df0f82e15ac2798df0b6c2ee3435400677ac">
     <copyfile dest="Makefile" src="core/root.mk"/>
   </project>
   <project name="rilproxy" path="rilproxy" remote="b2g" revision="827214fcf38d6569aeb5c6d6f31cb296d1f09272"/>
   <project name="fake-libdvm" path="dalvik" remote="b2g" revision="d50ae982b19f42f0b66d08b9eb306be81687869f"/>
-  <project name="gaia" path="gaia" remote="mozillaorg" revision="f108c706fae43cd61628babdd9463e7695b2496e"/>
+  <project name="gaia" path="gaia" remote="mozillaorg" revision="7f21bdda274f0329393ef0e5a9374c06255c6f57"/>
   <project name="gonk-misc" path="gonk-misc" remote="b2g" revision="6969df171e5295f855f12d12db0382048e6892e7"/>
   <project name="moztt" path="external/moztt" remote="b2g" revision="562d357b72279a9e35d4af5aeecc8e1ffa2f44f1"/>
   <project name="apitrace" path="external/apitrace" remote="apitrace" revision="facdb3593e63dcbb740709303a5b2527113c50a0"/>
   <project name="valgrind" path="external/valgrind" remote="b2g" revision="daa61633c32b9606f58799a3186395fd2bbb8d8c"/>
   <project name="vex" path="external/VEX" remote="b2g" revision="47f031c320888fe9f3e656602588565b52d43010"/>
   <!-- Stock Android things -->
   <project groups="linux" name="platform/prebuilts/clang/linux-x86/3.1" path="prebuilts/clang/linux-x86/3.1" revision="5c45f43419d5582949284eee9cef0c43d866e03b"/>
   <project groups="linux" name="platform/prebuilts/clang/linux-x86/3.2" path="prebuilts/clang/linux-x86/3.2" revision="3748b4168e7bd8d46457d4b6786003bc6a5223ce"/>

--- a/b2g/config/wasabi/sources.xml
+++ b/b2g/config/wasabi/sources.xml
@@ -8,21 +8,21 @@
   <!--original fetch url was git://codeaurora.org/-->
   <remote fetch="https://git.mozilla.org/external/caf" name="caf"/>
   <!--original fetch url was https://git.mozilla.org/releases-->
   <remote fetch="https://git.mozilla.org/releases" name="mozillaorg"/>
   <!--original fetch url was git://github.com/apitrace/-->
   <remote fetch="https://git.mozilla.org/external/apitrace" name="apitrace"/>
   <default remote="caf" revision="ics_chocolate_rb4.2" sync-j="4"/>
   <!-- Gonk specific things and forks -->
-  <project name="platform_build" path="build" remote="b2g" revision="700b031a54079f791344aa091798f6b43a9e2900">
+  <project name="platform_build" path="build" remote="b2g" revision="4d1e85908d792d9468c4da7040acd191fbb51b40">
     <copyfile dest="Makefile" src="core/root.mk"/>
   </project>
   <project name="fake-dalvik" path="dalvik" remote="b2g" revision="ca1f327d5acc198bb4be62fa51db2c039032c9ce"/>
-  <project name="gaia.git" path="gaia" remote="mozillaorg" revision="f108c706fae43cd61628babdd9463e7695b2496e"/>
+  <project name="gaia.git" path="gaia" remote="mozillaorg" revision="7f21bdda274f0329393ef0e5a9374c06255c6f57"/>
   <project name="gonk-misc" path="gonk-misc" remote="b2g" revision="6969df171e5295f855f12d12db0382048e6892e7"/>
   <project name="rilproxy" path="rilproxy" remote="b2g" revision="827214fcf38d6569aeb5c6d6f31cb296d1f09272"/>
   <project name="librecovery" path="librecovery" remote="b2g" revision="891e5069c0ad330d8191bf8c7b879c814258c89f"/>
   <project name="moztt" path="external/moztt" remote="b2g" revision="562d357b72279a9e35d4af5aeecc8e1ffa2f44f1"/>
   <project name="apitrace" path="external/apitrace" remote="apitrace" revision="facdb3593e63dcbb740709303a5b2527113c50a0"/>
   <project name="gonk-patches" path="patches" remote="b2g" revision="223a2421006e8f5da33f516f6891c87cae86b0f6"/>
   <!-- Stock Android things -->
   <project name="platform/abi/cpp" path="abi/cpp" revision="6426040f1be4a844082c9769171ce7f5341a5528"/>

--- a/browser/app/profile/firefox.js
+++ b/browser/app/profile/firefox.js
@@ -1365,18 +1365,19 @@ pref("devtools.debugger.tracer", false);
 // The default Debugger UI settings
 pref("devtools.debugger.ui.panes-sources-width", 200);
 pref("devtools.debugger.ui.panes-instruments-width", 300);
 pref("devtools.debugger.ui.panes-visible-on-startup", false);
 pref("devtools.debugger.ui.variables-sorting-enabled", true);
 pref("devtools.debugger.ui.variables-only-enum-visible", false);
 pref("devtools.debugger.ui.variables-searchbox-visible", false);
 
-// Enable the Profiler
+// Enable the Profiler and the Timeline
 pref("devtools.profiler.enabled", true);
+pref("devtools.timeline.enabled", false);
 
 // The default Profiler UI settings
 pref("devtools.profiler.ui.show-platform-data", false);
 
 // The default cache UI setting
 pref("devtools.cache.disabled", false);
 
 // Enable the Network Monitor

--- a/browser/base/content/browser-syncui.js
+++ b/browser/base/content/browser-syncui.js
@@ -1,12 +1,21 @@
 # This Source Code Form is subject to the terms of the Mozilla Public
 # License, v. 2.0. If a copy of the MPL was not distributed with this
 # file, You can obtain one at http://mozilla.org/MPL/2.0/.
 
+Cu.import("resource://gre/modules/XPCOMUtils.jsm");
+
+#ifdef MOZ_SERVICES_CLOUDSYNC
+XPCOMUtils.defineLazyModuleGetter(this, "CloudSync",
+                                  "resource://gre/modules/CloudSync.jsm");
+#else
+let CloudSync = null;
+#endif
+
 // gSyncUI handles updating the tools menu and displaying notifications.
 let gSyncUI = {
   DEFAULT_EOL_URL: "https://www.mozilla.org/firefox/?utm_source=synceol",
 
   _obs: ["weave:service:sync:start",
          "weave:service:quota:remaining",
          "weave:service:setup-complete",
          "weave:service:login:start",
@@ -117,17 +126,19 @@ let gSyncUI = {
     let needsSetup = this._needsSetup();
     let loginFailed = this._loginFailed();
 
     // Start off with a clean slate
     document.getElementById("sync-reauth-state").hidden = true;
     document.getElementById("sync-setup-state").hidden = true;
     document.getElementById("sync-syncnow-state").hidden = true;
 
-    if (loginFailed) {
+    if (CloudSync && CloudSync.ready && CloudSync().adapters.count) {
+      document.getElementById("sync-syncnow-state").hidden = false;
+    } else if (loginFailed) {
       document.getElementById("sync-reauth-state").hidden = false;
     } else if (needsSetup) {
       document.getElementById("sync-setup-state").hidden = false;
     } else {
       document.getElementById("sync-syncnow-state").hidden = false;
     }
 
     if (!gBrowser)
@@ -270,17 +281,24 @@ let gSyncUI = {
 
   openServerStatus: function () {
     let statusURL = Services.prefs.getCharPref("services.sync.statusURL");
     window.openUILinkIn(statusURL, "tab");
   },
 
   // Commands
   doSync: function SUI_doSync() {
-    setTimeout(function() Weave.Service.errorHandler.syncAndReportErrors(), 0);
+    let needsSetup = this._needsSetup();
+    let loginFailed = this._loginFailed();
+
+    if (!(loginFailed || needsSetup)) {
+      setTimeout(function () Weave.Service.errorHandler.syncAndReportErrors(), 0);
+    }
+
+    Services.obs.notifyObservers(null, "cloudsync:user-sync", null);
   },
 
   handleToolbarButton: function SUI_handleStatusbarButton() {
     if (this._needsSetup())
       this.openSetup();
     else
       this.doSync();
   },

--- a/browser/base/content/test/general/browser_bug575561.js
+++ b/browser/base/content/test/general/browser_bug575561.js
@@ -1,84 +1,84 @@
-function test() {
-  waitForExplicitFinish();
-
-  // Pinned: Link to the same domain should not open a new tab
-  // Tests link to http://example.com/browser/browser/base/content/test/general/dummy_page.html  
-  testLink(0, true, false, function() {
-    // Pinned: Link to a different subdomain should open a new tab
-    // Tests link to http://test1.example.com/browser/browser/base/content/test/general/dummy_page.html
-    testLink(1, true, true, function() {
-      // Pinned: Link to a different domain should open a new tab
-      // Tests link to http://example.org/browser/browser/base/content/test/general/dummy_page.html
-      testLink(2, true, true, function() {
-        // Not Pinned: Link to a different domain should not open a new tab
-        // Tests link to http://example.org/browser/browser/base/content/test/general/dummy_page.html
-        testLink(2, false, false, function() {
-          // Pinned: Targetted link should open a new tab
-          // Tests link to http://example.org/browser/browser/base/content/test/general/dummy_page.html with target="foo"
-          testLink(3, true, true, function() {
-            // Pinned: Link in a subframe should not open a new tab
-            // Tests link to http://example.org/browser/browser/base/content/test/general/dummy_page.html in subframe
-            testLink(0, true, false, function() {
-              // Pinned: Link to the same domain (with www prefix) should not open a new tab
-              // Tests link to http://www.example.com/browser/browser/base/content/test/general/dummy_page.html      
-              testLink(4, true, false, function() {
-                // Pinned: Link to a data: URI should not open a new tab
-                // Tests link to data:text/html,<!DOCTYPE html><html><body>Another Page</body></html>
-                testLink(5, true, false, function() {
-                  // Pinned: Link to an about: URI should not open a new tab
-                  // Tests link to about:mozilla
-                  testLink(6, true, false, finish);
-                });
-              });
-            }, true);
-          });
-        });
-      });
-    });
-  });
-}
-
-function testLink(aLinkIndex, pinTab, expectNewTab, nextTest, testSubFrame) {
-  let appTab = gBrowser.addTab("http://example.com/browser/browser/base/content/test/general/app_bug575561.html", {skipAnimation: true});
-  if (pinTab)
-    gBrowser.pinTab(appTab);
-  gBrowser.selectedTab = appTab;
-
-  waitForDocLoadComplete(appTab.linkedBrowser).then(function() {
-    let browser = gBrowser.getBrowserForTab(appTab);
-    if (testSubFrame)
-      browser = browser.contentDocument.getElementsByTagName("iframe")[0];
-
-    let links = browser.contentDocument.getElementsByTagName("a");
-
-    if (expectNewTab)
-      gBrowser.tabContainer.addEventListener("TabOpen", onTabOpen, true);
-    else
-      waitForDocLoadComplete(appTab.linkedBrowser).then(onPageLoad);
-
-    info("Clicking " + links[aLinkIndex].textContent);
-    EventUtils.sendMouseEvent({type:"click"}, links[aLinkIndex], browser.contentWindow);
-    let linkLocation = links[aLinkIndex].href;
-
-    function onPageLoad() {
-      browser.removeEventListener("load", onPageLoad, true);
-      is(browser.contentDocument.location.href, linkLocation, "Link should not open in a new tab");
-      executeSoon(function(){
-        gBrowser.removeTab(appTab);
-        nextTest();
-      });
-    }
-
-    function onTabOpen(event) {
-      gBrowser.tabContainer.removeEventListener("TabOpen", onTabOpen, true);
-      ok(true, "Link should open a new tab");
-      waitForDocLoadComplete(event.target.linkedBrowser).then(function() {
-        executeSoon(function(){
-          gBrowser.removeTab(appTab);
-          gBrowser.removeCurrentTab();
-          nextTest();
-        });
-      });
-    }
-  });
-}
+const TEST_URL = "http://example.com/browser/browser/base/content/test/general/app_bug575561.html";
+
+add_task(function*() {
+  SimpleTest.requestCompleteLog();
+
+  // Pinned: Link to the same domain should not open a new tab
+  // Tests link to http://example.com/browser/browser/base/content/test/general/dummy_page.html
+  yield testLink(0, true, false);
+  // Pinned: Link to a different subdomain should open a new tab
+  // Tests link to http://test1.example.com/browser/browser/base/content/test/general/dummy_page.html
+  yield testLink(1, true, true);
+
+  // Pinned: Link to a different domain should open a new tab
+  // Tests link to http://example.org/browser/browser/base/content/test/general/dummy_page.html
+  yield testLink(2, true, true);
+
+  // Not Pinned: Link to a different domain should not open a new tab
+  // Tests link to http://example.org/browser/browser/base/content/test/general/dummy_page.html
+  yield testLink(2, false, false);
+
+  // Pinned: Targetted link should open a new tab
+  // Tests link to http://example.org/browser/browser/base/content/test/general/dummy_page.html with target="foo"
+  yield testLink(3, true, true);
+
+  // Pinned: Link in a subframe should not open a new tab
+  // Tests link to http://example.org/browser/browser/base/content/test/general/dummy_page.html in subframe
+  yield testLink(0, true, false, true);
+
+  // Pinned: Link to the same domain (with www prefix) should not open a new tab
+  // Tests link to http://www.example.com/browser/browser/base/content/test/general/dummy_page.html
+  yield testLink(4, true, false);
+
+  // Pinned: Link to a data: URI should not open a new tab
+  // Tests link to data:text/html,<!DOCTYPE html><html><body>Another Page</body></html>
+  yield testLink(5, true, false);
+
+  // Pinned: Link to an about: URI should not open a new tab
+  // Tests link to about:mozilla
+  yield testLink(6, true, false);
+});
+
+let waitForPageLoad = Task.async(function*(browser, linkLocation) {
+  yield waitForDocLoadComplete();
+
+  is(browser.contentDocument.location.href, linkLocation, "Link should not open in a new tab");
+});
+
+let waitForTabOpen = Task.async(function*() {
+  let event = yield promiseWaitForEvent(gBrowser.tabContainer, "TabOpen", true);
+  ok(true, "Link should open a new tab");
+
+  yield waitForDocLoadComplete(event.target.linkedBrowser);
+  yield Promise.resolve();
+
+  gBrowser.removeCurrentTab();
+});
+
+let testLink = Task.async(function*(aLinkIndex, pinTab, expectNewTab, testSubFrame) {
+  let appTab = gBrowser.addTab(TEST_URL, {skipAnimation: true});
+  if (pinTab)
+    gBrowser.pinTab(appTab);
+  gBrowser.selectedTab = appTab;
+
+  yield waitForDocLoadComplete();
+
+  let browser = appTab.linkedBrowser;
+  if (testSubFrame)
+    browser = browser.contentDocument.querySelector("iframe");
+
+  let link = browser.contentDocument.querySelectorAll("a")[aLinkIndex];
+
+  let promise;
+  if (expectNewTab)
+    promise = waitForTabOpen();
+  else
+    promise = waitForPageLoad(browser, link.href);
+
+  info("Clicking " + link.textContent);
+  link.click();
+
+  yield promise;
+
+  gBrowser.removeTab(appTab);
+});

--- a/browser/base/content/test/general/head.js
+++ b/browser/base/content/test/general/head.js
@@ -103,16 +103,29 @@ function waitForCondition(condition, nex
 }
 
 function promiseWaitForCondition(aConditionFn) {
   let deferred = Promise.defer();
   waitForCondition(aConditionFn, deferred.resolve, "Condition didn't pass.");
   return deferred.promise;
 }
 
+function promiseWaitForEvent(object, eventName, capturing = false) {
+  return new Promise((resolve) => {
+    function listener(event) {
+      info("Saw " + eventName);
+      object.removeEventListener(eventName, listener, capturing);
+      resolve(event);
+    }
+
+    info("Waiting for " + eventName);
+    object.addEventListener(eventName, listener, capturing);
+  });
+}
+
 function getTestPlugin(aName) {
   var pluginName = aName || "Test Plug-in";
   var ph = Cc["@mozilla.org/plugin/host;1"].getService(Ci.nsIPluginHost);
   var tags = ph.getPluginTags();
 
   // Find the test plugin
   for (var i = 0; i < tags.length; i++) {
     if (tags[i].name == pluginName)
@@ -438,16 +451,17 @@ function waitForDocLoadAndStopIt(aExpect
  * @return promise
  */
 function waitForDocLoadComplete(aBrowser=gBrowser) {
   let deferred = Promise.defer();
   let progressListener = {
     onStateChange: function (webProgress, req, flags, status) {
       let docStart = Ci.nsIWebProgressListener.STATE_IS_NETWORK |
                      Ci.nsIWebProgressListener.STATE_STOP;
+      info("Saw state " + flags.toString(16));
       if ((flags & docStart) == docStart) {
         aBrowser.removeProgressListener(progressListener);
         info("Browser loaded");
         deferred.resolve();
       }
     },
     QueryInterface: XPCOMUtils.generateQI([Ci.nsIWebProgressListener,
                                            Ci.nsISupportsWeakReference])

--- a/browser/components/loop/MozLoopAPI.jsm
+++ b/browser/components/loop/MozLoopAPI.jsm
@@ -117,16 +117,33 @@ function injectLoopAPI(targetWindow) {
     locale: {
       enumerable: true,
       get: function() {
         return MozLoopService.locale;
       }
     },
 
     /**
+     * Returns the callData for a specific callDataId
+     *
+     * The data was retrieved from the LoopServer via a GET/calls/<version> request
+     * triggered by an incoming message from the LoopPushServer.
+     *
+     * @param {int} loopCallId
+     * @returns {callData} The callData or undefined if error.
+     */
+    getCallData: {
+      enumerable: true,
+      writable: true,
+      value: function(loopCallId) {
+        return Cu.cloneInto(MozLoopService.getCallData(loopCallId), targetWindow);
+      }
+    },
+
+    /**
      * Returns the contacts API.
      *
      * @returns {Object} The contacts API object
      */
     contacts: {
       enumerable: true,
       get: function() {
         if (contactsAPI) {
@@ -333,25 +350,34 @@ function injectLoopAPI(targetWindow) {
      * @param {Object} payloadObj An object which is converted to JSON and
      *                            transmitted with the request.
      * @param {Function} callback Called when the request completes.
      */
     hawkRequest: {
       enumerable: true,
       writable: true,
       value: function(path, method, payloadObj, callback) {
+        // XXX: Bug 1065153 - Should take a sessionType parameter instead of hard-coding GUEST
         // XXX Should really return a DOM promise here.
-        return MozLoopService.hawkRequest(path, method, payloadObj).then((response) => {
+        return MozLoopService.hawkRequest(LOOP_SESSION_TYPE.GUEST, path, method, payloadObj).then((response) => {
           callback(null, response.body);
         }, (error) => {
           callback(Cu.cloneInto(error, targetWindow));
         });
       }
     },
 
+    LOOP_SESSION_TYPE: {
+      enumerable: true,
+      writable: false,
+      value: function() {
+        return LOOP_SESSION_TYPE;
+      },
+    },
+
     logInToFxA: {
       enumerable: true,
       writable: true,
       value: function() {
         return MozLoopService.logInToFxA();
       }
     },
 

--- a/browser/components/loop/MozLoopService.jsm
+++ b/browser/components/loop/MozLoopService.jsm
@@ -10,24 +10,29 @@ const { classes: Cc, interfaces: Ci, uti
 // https://github.com/mozilla-services/loop-server/blob/45787d34108e2f0d87d74d4ddf4ff0dbab23501c/loop/errno.json#L6
 const INVALID_AUTH_TOKEN = 110;
 
 // Ticket numbers are 24 bits in length.
 // The highest valid ticket number is 16777214 (2^24 - 2), so that a "now
 // serving" number of 2^24 - 1 is greater than it.
 const MAX_SOFT_START_TICKET_NUMBER = 16777214;
 
+const LOOP_SESSION_TYPE = {
+  GUEST: 1,
+  FXA: 2,
+};
+
 Cu.import("resource://gre/modules/Services.jsm");
 Cu.import("resource://gre/modules/XPCOMUtils.jsm");
 Cu.import("resource://gre/modules/Promise.jsm");
 Cu.import("resource://gre/modules/osfile.jsm", this);
 Cu.import("resource://gre/modules/Task.jsm");
 Cu.import("resource://gre/modules/FxAccountsOAuthClient.jsm");
 
-this.EXPORTED_SYMBOLS = ["MozLoopService"];
+this.EXPORTED_SYMBOLS = ["MozLoopService", "LOOP_SESSION_TYPE"];
 
 XPCOMUtils.defineLazyModuleGetter(this, "console",
   "resource://gre/modules/devtools/Console.jsm");
 
 XPCOMUtils.defineLazyModuleGetter(this, "injectLoopAPI",
   "resource:///modules/loop/MozLoopAPI.jsm");
 
 XPCOMUtils.defineLazyModuleGetter(this, "convertToRTCStatsReport",
@@ -76,16 +81,18 @@ let gErrors = new Map();
 /**
  * Internal helper methods and state
  *
  * The registration is a two-part process. First we need to connect to
  * and register with the push server. Then we need to take the result of that
  * and register with the Loop server.
  */
 let MozLoopServiceInternal = {
+  callsData: {data: undefined},
+
   // The uri of the Loop server.
   get loopServerUri() Services.prefs.getCharPref("loop.server"),
 
   /**
    * The initial delay for push registration. This ensures we don't start
    * kicking off straight after browser startup, just a few seconds later.
    */
   get initialRegistrationDelayMilliseconds() {
@@ -197,34 +204,36 @@ let MozLoopServiceInternal = {
       this.onHandleNotification.bind(this));
 
     return result;
   },
 
   /**
    * Performs a hawk based request to the loop server.
    *
+   * @param {LOOP_SESSION_TYPE} sessionType The type of session to use for the request.
+   *                                        This is one of the LOOP_SESSION_TYPE members.
    * @param {String} path The path to make the request to.
    * @param {String} method The request method, e.g. 'POST', 'GET'.
    * @param {Object} payloadObj An object which is converted to JSON and
    *                            transmitted with the request.
    * @returns {Promise}
    *        Returns a promise that resolves to the response of the API call,
    *        or is rejected with an error.  If the server response can be parsed
    *        as JSON and contains an 'error' property, the promise will be
    *        rejected with this JSON-parsed response.
    */
-  hawkRequest: function(path, method, payloadObj) {
+  hawkRequest: function(sessionType, path, method, payloadObj) {
     if (!gHawkClient) {
       gHawkClient = new HawkClient(this.loopServerUri);
     }
 
     let sessionToken;
     try {
-      sessionToken = Services.prefs.getCharPref("loop.hawk-session-token");
+      sessionToken = Services.prefs.getCharPref(this.getSessionTokenPrefName(sessionType));
     } catch (x) {
       // It is ok for this not to exist, we'll default to sending no-creds
     }
 
     let credentials;
     if (sessionToken) {
       // true = use a hex key, as required by the server (see bug 1032738).
       credentials = deriveHawkCredentials(sessionToken, "sessionToken",
@@ -232,29 +241,47 @@ let MozLoopServiceInternal = {
     }
 
     return gHawkClient.request(path, method, credentials, payloadObj).catch(error => {
       console.error("Loop hawkRequest error:", error);
       throw error;
     });
   },
 
+  getSessionTokenPrefName: function(sessionType) {
+    let suffix;
+    switch (sessionType) {
+      case LOOP_SESSION_TYPE.GUEST:
+        suffix = "";
+        break;
+      case LOOP_SESSION_TYPE.FXA:
+        suffix = ".fxa";
+        break;
+      default:
+        throw new Error("Unknown LOOP_SESSION_TYPE");
+        break;
+    }
+    return "loop.hawk-session-token" + suffix;
+  },
+
   /**
    * Used to store a session token from a request if it exists in the headers.
    *
+   * @param {LOOP_SESSION_TYPE} sessionType The type of session to use for the request.
+   *                                        One of the LOOP_SESSION_TYPE members.
    * @param {Object} headers The request headers, which may include a
    *                         "hawk-session-token" to be saved.
    * @return true on success or no token, false on failure.
    */
-  storeSessionToken: function(headers) {
+  storeSessionToken: function(sessionType, headers) {
     let sessionToken = headers["hawk-session-token"];
     if (sessionToken) {
       // XXX should do more validation here
       if (sessionToken.length === 64) {
-        Services.prefs.setCharPref("loop.hawk-session-token", sessionToken);
+        Services.prefs.setCharPref(this.getSessionTokenPrefName(sessionType), sessionToken);
       } else {
         // XXX Bubble the precise details up to the UI somehow (bug 1013248).
         console.warn("Loop server sent an invalid session token");
         gRegisteredDeferred.reject("session-token-wrong-size");
         gRegisteredDeferred = null;
         return false;
       }
     }
@@ -269,59 +296,70 @@ let MozLoopServiceInternal = {
    */
   onPushRegistered: function(err, pushUrl) {
     if (err) {
       gRegisteredDeferred.reject(err);
       gRegisteredDeferred = null;
       return;
     }
 
-    this.registerWithLoopServer(pushUrl);
+    this.registerWithLoopServer(LOOP_SESSION_TYPE.GUEST, pushUrl).then(() => {
+      // storeSessionToken could have rejected and nulled the promise if the token was malformed.
+      if (!gRegisteredDeferred) {
+        return;
+      }
+      gRegisteredDeferred.resolve();
+      // No need to clear the promise here, everything was good, so we don't need
+      // to re-register.
+    }, (error) => {
+      Cu.reportError("Failed to register with Loop server: " + error.errno);
+      gRegisteredDeferred.reject(error.errno);
+      gRegisteredDeferred = null;
+    });
   },
 
   /**
-   * Registers with the Loop server.
+   * Registers with the Loop server either as a guest or a FxA user.
    *
+   * @param {LOOP_SESSION_TYPE} sessionType The type of session e.g. guest or FxA
    * @param {String} pushUrl The push url given by the push server.
-   * @param {Boolean} noRetry Optional, don't retry if authentication fails.
+   * @param {Boolean} [retry=true] Whether to retry if authentication fails.
+   * @return {Promise}
    */
-  registerWithLoopServer: function(pushUrl, noRetry) {
-    this.hawkRequest("/registration", "POST", { simplePushURL: pushUrl})
+  registerWithLoopServer: function(sessionType, pushUrl, retry = true) {
+    return this.hawkRequest(sessionType, "/registration", "POST", { simplePushURL: pushUrl})
       .then((response) => {
         // If this failed we got an invalid token. storeSessionToken rejects
         // the gRegisteredDeferred promise for us, so here we just need to
         // early return.
-        if (!this.storeSessionToken(response.headers))
+        if (!this.storeSessionToken(sessionType, response.headers))
           return;
 
         this.clearError("registration");
-        gRegisteredDeferred.resolve();
-        // No need to clear the promise here, everything was good, so we don't need
-        // to re-register.
       }, (error) => {
         // There's other errors than invalid auth token, but we should only do the reset
         // as a last resort.
         if (error.code === 401 && error.errno === INVALID_AUTH_TOKEN) {
           if (this.urlExpiryTimeIsInFuture()) {
             // XXX Should this be reported to the user is a visible manner?
             Cu.reportError("Loop session token is invalid, all previously "
                            + "generated urls will no longer work.");
           }
 
           // Authorization failed, invalid token, we need to try again with a new token.
-          Services.prefs.clearUserPref("loop.hawk-session-token");
-          this.registerWithLoopServer(pushUrl, true);
-          return;
+          Services.prefs.clearUserPref(this.getSessionTokenPrefName(sessionType));
+          if (retry) {
+            return this.registerWithLoopServer(sessionType, pushUrl, false);
+          }
         }
 
         // XXX Bubble the precise details up to the UI somehow (bug 1013248).
         Cu.reportError("Failed to register with the loop server. error: " + error);
         this.setError("registration", error);
-        gRegisteredDeferred.reject(error.errno);
-        gRegisteredDeferred = null;
+        throw error;
       }
     );
   },
 
   /**
    * Callback from MozLoopPushHandler - A push notification has been received from
    * the server.
    *
@@ -332,19 +370,33 @@ let MozLoopServiceInternal = {
       return;
     }
 
     // We set this here as it is assumed that once the user receives an incoming
     // call, they'll have had enough time to see the terms of service. See
     // bug 1046039 for background.
     Services.prefs.setCharPref("loop.seenToS", "seen");
 
-    this.openChatWindow(null,
-                        this.localizedStrings["incoming_call_title2"].textContent,
-                        "about:loopconversation#incoming/" + version);
+    /* Request the information on the new call(s) associated with this version. */
+    this.hawkRequest(LOOP_SESSION_TYPE.GUEST,
+      "/calls?version=" + version, "GET").then(response => {
+      try {
+        let respData = JSON.parse(response.body);
+        if (respData.calls && respData.calls[0]) {
+          this.callsData.data = respData.calls[0];
+          this.openChatWindow(null,
+            this.localizedStrings["incoming_call_title2"].textContent,
+            "about:loopconversation#incoming/" + version);
+        } else {
+          console.warn("Error: missing calls[] in response");
+        }
+      } catch (err) {
+        console.warn("Error parsing calls info", err);
+      }
+    });
   },
 
   /**
    * A getter to obtain and store the strings for loop. This is structured
    * for use by l10n.js.
    *
    * @returns {Object} a map of element ids with attributes to set.
    */
@@ -504,17 +556,17 @@ let MozLoopServiceInternal = {
   },
 
   /**
    * Fetch Firefox Accounts (FxA) OAuth parameters from the Loop Server.
    *
    * @return {Promise} resolved with the body of the hawk request for OAuth parameters.
    */
   promiseFxAOAuthParameters: function() {
-    return this.hawkRequest("/fxa-oauth/params", "POST").then(response => {
+    return this.hawkRequest(LOOP_SESSION_TYPE.FXA, "/fxa-oauth/params", "POST").then(response => {
       return JSON.parse(response.body);
     });
   },
 
   /**
    * Get the OAuth client constructed with Loop OAauth parameters.
    *
    * @return {Promise}
@@ -582,17 +634,17 @@ let MozLoopServiceInternal = {
     if (!code || !state) {
       throw new Error("promiseFxAOAuthToken: code and state are required.");
     }
 
     let payload = {
       code: code,
       state: state,
     };
-    return this.hawkRequest("/fxa-oauth/token", "POST", payload).then(response => {
+    return this.hawkRequest(LOOP_SESSION_TYPE.FXA, "/fxa-oauth/token", "POST", payload).then(response => {
       return JSON.parse(response.body);
     });
   },
 
   /**
    * Called once gFxAOAuthClient fires onComplete.
    *
    * @param {Deferred} deferred used to resolve or reject the gFxAOAuthClientPromise
@@ -837,16 +889,29 @@ this.MozLoopService = {
       return Services.prefs.getComplexValue("general.useragent.locale",
         Ci.nsISupportsString).data;
     } catch (ex) {
       return "en-US";
     }
   },
 
   /**
+   * Returns the callData for a specific callDataId
+   *
+   * The data was retrieved from the LoopServer via a GET/calls/<version> request
+   * triggered by an incoming message from the LoopPushServer.
+   *
+   * @param {int} loopCallId
+   * @return {callData} The callData or undefined if error.
+   */
+  getCallData: function(loopCallId) {
+    return MozLoopServiceInternal.callsData.data;
+  },
+
+  /**
    * Set any character preference under "loop.".
    *
    * @param {String} prefName The name of the pref without the preceding "loop."
    * @param {String} value The value to set.
    *
    * Any errors thrown by the Mozilla pref API are logged to the console.
    */
   setLoopCharPref: function(prefName, value) {
@@ -916,33 +981,44 @@ this.MozLoopService = {
       return Promise.resolve(gFxAOAuthTokenData);
     }
 
     return MozLoopServiceInternal.promiseFxAOAuthAuthorization().then(response => {
       return MozLoopServiceInternal.promiseFxAOAuthToken(response.code, response.state);
     }).then(tokenData => {
       gFxAOAuthTokenData = tokenData;
       return tokenData;
+    }).then(tokenData => {
+      return gRegisteredDeferred.promise.then(Task.async(function*() {
+        if (gPushHandler.pushUrl) {
+          yield MozLoopServiceInternal.registerWithLoopServer(LOOP_SESSION_TYPE.FXA, gPushHandler.pushUrl);
+        } else {
+          throw new Error("No pushUrl for FxA registration");
+        }
+        return gFxAOAuthTokenData;
+      }));
     },
     error => {
       gFxAOAuthTokenData = null;
       throw error;
     });
   },
 
   /**
    * Performs a hawk based request to the loop server.
    *
+   * @param {LOOP_SESSION_TYPE} sessionType The type of session to use for the request.
+   *                                        One of the LOOP_SESSION_TYPE members.
    * @param {String} path The path to make the request to.
    * @param {String} method The request method, e.g. 'POST', 'GET'.
    * @param {Object} payloadObj An object which is converted to JSON and
    *                            transmitted with the request.
    * @returns {Promise}
    *        Returns a promise that resolves to the response of the API call,
    *        or is rejected with an error.  If the server response can be parsed
    *        as JSON and contains an 'error' property, the promise will be
    *        rejected with this JSON-parsed response.
    */
-  hawkRequest: function(path, method, payloadObj) {
-    return MozLoopServiceInternal.hawkRequest(path, method, payloadObj);
+  hawkRequest: function(sessionType, path, method, payloadObj) {
+    return MozLoopServiceInternal.hawkRequest(sessionType, path, method, payloadObj);
   },
 };
 Object.freeze(this.MozLoopService);

--- a/browser/components/loop/content/js/client.js
+++ b/browser/components/loop/content/js/client.js
@@ -99,17 +99,16 @@ loop.Client = (function($) {
      * Internal handler for requesting a call url from the server.
      *
      * Callback parameters:
      * - err null on successful registration, non-null otherwise.
      * - callUrlData an object of the obtained call url data if successful:
      * -- callUrl: The url of the call
      * -- expiresAt: The amount of hours until expiry of the url
      *
-     * @param  {String} simplepushUrl a registered Simple Push URL
      * @param  {string} nickname the nickname of the future caller
      * @param  {Function} cb Callback(err, callUrlData)
      */
     _requestCallUrlInternal: function(nickname, cb) {
       this.mozLoop.hawkRequest("/call-url/", "POST", {callerId: nickname},
                                function (error, responseText) {
         if (error) {
           this._failureHandler(cb, error);
@@ -183,45 +182,12 @@ loop.Client = (function($) {
         if (err) {
           cb(err);
           return;
         }
 
         this._requestCallUrlInternal(nickname, cb);
       }.bind(this));
     },
-
-    /**
-     * Requests call information from the server for all calls since the
-     * given version.
-     *
-     * @param  {String} version the version identifier from the push
-     *                          notification
-     * @param  {Function} cb Callback(err, calls)
-     */
-    requestCallsInfo: function(version, cb) {
-      // XXX It is likely that we'll want to move some of this to whatever
-      // opens the chat window, but we'll need to decide on this in bug 1002418
-      if (!version) {
-        throw new Error("missing required parameter version");
-      }
-
-      this.mozLoop.hawkRequest("/calls?version=" + version, "GET", null,
-                               function (error, responseText) {
-        if (error) {
-          this._failureHandler(cb, error);
-          return;
-        }
-
-        try {
-          var callsData = JSON.parse(responseText);
-
-          cb(null, this._validate(callsData, expectedCallProperties));
-        } catch (err) {
-          console.log("Error requesting calls info", err);
-          cb(err);
-        }
-      }.bind(this));
-    }
   };
 
   return Client;
 })(jQuery);

--- a/browser/components/loop/content/js/conversation.js
+++ b/browser/components/loop/content/js/conversation.js
@@ -152,17 +152,17 @@ loop.conversation = (function(OT, mozL10
    * Required options:
    * - {loop.shared.models.ConversationModel} conversation Conversation model.
    * - {loop.shared.models.NotificationCollection} notifications
    *
    * @type {loop.shared.router.BaseConversationRouter}
    */
   var ConversationRouter = loop.desktopRouter.DesktopConversationRouter.extend({
     routes: {
-      "incoming/:version": "incoming",
+      "incoming/:callId": "incoming",
       "call/accept": "accept",
       "call/decline": "decline",
       "call/ongoing": "conversation",
       "call/declineAndBlock": "declineAndBlock",
       "call/feedback": "feedback"
     },
 
     /**
@@ -177,53 +177,44 @@ loop.conversation = (function(OT, mozL10
      */
     endCall: function() {
       this.navigate("call/feedback", {trigger: true});
     },
 
     /**
      * Incoming call route.
      *
-     * @param {String} loopVersion The version from the push notification, set
-     *                             by the router from the URL.
+     * @param {String} callId  Identifier assigned by the LoopService
+     *                         to this incoming call.
      */
-    incoming: function(loopVersion) {
+    incoming: function(callId) {
       navigator.mozLoop.startAlerting();
-      this._conversation.set({loopVersion: loopVersion});
       this._conversation.once("accept", function() {
         this.navigate("call/accept", {trigger: true});
       }.bind(this));
       this._conversation.once("decline", function() {
         this.navigate("call/decline", {trigger: true});
       }.bind(this));
       this._conversation.once("declineAndBlock", function() {
         this.navigate("call/declineAndBlock", {trigger: true});
       }.bind(this));
       this._conversation.once("call:incoming", this.startCall, this);
       this._conversation.once("change:publishedStream", this._checkConnected, this);
       this._conversation.once("change:subscribedStream", this._checkConnected, this);
 
-      this._client.requestCallsInfo(loopVersion, function(err, sessionData) {
-        if (err) {
-          console.error("Failed to get the sessionData", err);
-          // XXX Not the ideal response, but bug 1047410 will be replacing
-          // this by better "call failed" UI.
-          this._notifications.errorL10n("cannot_start_call_session_not_ready");
-          return;
-        }
-
-        // XXX For incoming calls we might have more than one call queued.
-        // For now, we'll just assume the first call is the right information.
-        // We'll probably really want to be getting this data from the
-        // background worker on the desktop client.
-        // Bug 1032700 should fix this.
-        this._conversation.setIncomingSessionData(sessionData[0]);
-
-        this._setupWebSocketAndCallView();
-      }.bind(this));
+      var callData = navigator.mozLoop.getCallData(callId);
+      if (!callData) {
+        console.error("Failed to get the call data");
+        // XXX Not the ideal response, but bug 1047410 will be replacing
+        // this by better "call failed" UI.
+        this._notifications.errorL10n("cannot_start_call_session_not_ready");
+        return;
+      }
+      this._conversation.setIncomingSessionData(callData);
+      this._setupWebSocketAndCallView();
     },
 
     /**
      * Used to set up the web socket connection and navigate to the
      * call view if appropriate.
      */
     _setupWebSocketAndCallView: function() {
       this._websocket = new loop.CallConnectionWebSocket({

--- a/browser/components/loop/content/js/conversation.jsx
+++ b/browser/components/loop/content/js/conversation.jsx
@@ -152,17 +152,17 @@ loop.conversation = (function(OT, mozL10
    * Required options:
    * - {loop.shared.models.ConversationModel} conversation Conversation model.
    * - {loop.shared.models.NotificationCollection} notifications
    *
    * @type {loop.shared.router.BaseConversationRouter}
    */
   var ConversationRouter = loop.desktopRouter.DesktopConversationRouter.extend({
     routes: {
-      "incoming/:version": "incoming",
+      "incoming/:callId": "incoming",
       "call/accept": "accept",
       "call/decline": "decline",
       "call/ongoing": "conversation",
       "call/declineAndBlock": "declineAndBlock",
       "call/feedback": "feedback"
     },
 
     /**
@@ -177,53 +177,44 @@ loop.conversation = (function(OT, mozL10
      */
     endCall: function() {
       this.navigate("call/feedback", {trigger: true});
     },
 
     /**
      * Incoming call route.
      *
-     * @param {String} loopVersion The version from the push notification, set
-     *                             by the router from the URL.
+     * @param {String} callId  Identifier assigned by the LoopService
+     *                         to this incoming call.
      */
-    incoming: function(loopVersion) {
+    incoming: function(callId) {
       navigator.mozLoop.startAlerting();
-      this._conversation.set({loopVersion: loopVersion});
       this._conversation.once("accept", function() {
         this.navigate("call/accept", {trigger: true});
       }.bind(this));
       this._conversation.once("decline", function() {
         this.navigate("call/decline", {trigger: true});
       }.bind(this));
       this._conversation.once("declineAndBlock", function() {
         this.navigate("call/declineAndBlock", {trigger: true});
       }.bind(this));
       this._conversation.once("call:incoming", this.startCall, this);
       this._conversation.once("change:publishedStream", this._checkConnected, this);
       this._conversation.once("change:subscribedStream", this._checkConnected, this);
 
-      this._client.requestCallsInfo(loopVersion, function(err, sessionData) {
-        if (err) {
-          console.error("Failed to get the sessionData", err);
-          // XXX Not the ideal response, but bug 1047410 will be replacing
-          // this by better "call failed" UI.
-          this._notifications.errorL10n("cannot_start_call_session_not_ready");
-          return;
-        }
-
-        // XXX For incoming calls we might have more than one call queued.
-        // For now, we'll just assume the first call is the right information.
-        // We'll probably really want to be getting this data from the
-        // background worker on the desktop client.
-        // Bug 1032700 should fix this.
-        this._conversation.setIncomingSessionData(sessionData[0]);
-
-        this._setupWebSocketAndCallView();
-      }.bind(this));
+      var callData = navigator.mozLoop.getCallData(callId);
+      if (!callData) {
+        console.error("Failed to get the call data");
+        // XXX Not the ideal response, but bug 1047410 will be replacing
+        // this by better "call failed" UI.
+        this._notifications.errorL10n("cannot_start_call_session_not_ready");
+        return;
+      }
+      this._conversation.setIncomingSessionData(callData);
+      this._setupWebSocketAndCallView();
     },
 
     /**
      * Used to set up the web socket connection and navigate to the
      * call view if appropriate.
      */
     _setupWebSocketAndCallView: function() {
       this._websocket = new loop.CallConnectionWebSocket({

--- a/browser/components/loop/content/shared/js/models.js
+++ b/browser/components/loop/content/shared/js/models.js
@@ -13,20 +13,17 @@ loop.shared.models = (function(l10n) {
    * Conversation model.
    */
   var ConversationModel = Backbone.Model.extend({
     defaults: {
       connected:    false,         // Session connected flag
       ongoing:      false,         // Ongoing call flag
       callerId:     undefined,     // Loop caller id
       loopToken:    undefined,     // Loop conversation token
-      loopVersion:  undefined,     // Loop version for /calls/ information. This
-                                   // is the version received from the push
-                                   // notification and is used by the server to
-                                   // determine the pending calls
+      loopCallId:   undefined,     // LoopService id for incoming session
       sessionId:    undefined,     // OT session id
       sessionToken: undefined,     // OT session token
       apiKey:       undefined,     // OT api key
       callId:       undefined,     // The callId on the server
       progressURL:  undefined,     // The websocket url to use for progress
       websocketToken: undefined,   // The token to use for websocket auth, this is
                                    // stored as a hex string which is what the server
                                    // requires.

--- a/browser/components/loop/test/desktop-local/client_test.js
+++ b/browser/components/loop/test/desktop-local/client_test.js
@@ -177,57 +177,10 @@ describe("loop.Client", function() {
         client.requestCallUrl("foo", callback);
 
         sinon.assert.calledOnce(callback);
         sinon.assert.calledWithMatch(callback, sinon.match(function(err) {
           return /Invalid data received/.test(err.message);
         }));
       });
     });
-
-    describe("#requestCallsInfo", function() {
-      it("should prevent launching a conversation when version is missing",
-        function() {
-          expect(function() {
-            client.requestCallsInfo();
-          }).to.Throw(Error, /missing required parameter version/);
-        });
-
-      it("should perform a get on /calls", function() {
-        client.requestCallsInfo(42, callback);
-
-        sinon.assert.calledOnce(hawkRequestStub);
-        sinon.assert.calledWith(hawkRequestStub,
-                                "/calls?version=42", "GET", null);
-
-      });
-
-      it("should request data for all calls", function() {
-        hawkRequestStub.callsArgWith(3, null,
-                                     '{"calls": [{"apiKey": "fake"}]}');
-
-        client.requestCallsInfo(42, callback);
-
-        sinon.assert.calledWithExactly(callback, null, [{apiKey: "fake"}]);
-      });
-
-      it("should send an error when the request fails", function() {
-        hawkRequestStub.callsArgWith(3, fakeErrorRes);
-
-        client.requestCallsInfo(42, callback);
-
-        sinon.assert.calledWithMatch(callback, sinon.match(function(err) {
-          return /400.*invalid token/.test(err.message);
-        }));
-      });
-
-      it("should send an error if the data is not valid", function() {
-        hawkRequestStub.callsArgWith(3, null, "{}");
-
-        client.requestCallsInfo(42, callback);
-
-        sinon.assert.calledWithMatch(callback, sinon.match(function(err) {
-          return /Invalid data received/.test(err.message);
-        }));
-      });
-    });
   });
 });

--- a/browser/components/loop/test/desktop-local/conversation_test.js
+++ b/browser/components/loop/test/desktop-local/conversation_test.js
@@ -27,16 +27,17 @@ describe("loop.conversation", function()
         return JSON.stringify({textContent: "fakeText"});
       },
       get locale() {
         return "en-US";
       },
       setLoopCharPref: sandbox.stub(),
       getLoopCharPref: sandbox.stub(),
       getLoopBoolPref: sandbox.stub(),
+      getCallData: sandbox.stub(),
       startAlerting: function() {},
       stopAlerting: function() {},
       ensureRegistered: function() {},
       get appVersionInfo() {
         return {
           version: "42",
           channel: "test",
           platform: "test"
@@ -107,17 +108,16 @@ describe("loop.conversation", function()
     var conversation, client;
 
     beforeEach(function() {
       client = new loop.Client();
       conversation = new loop.shared.models.ConversationModel({}, {
         sdk: {},
         pendingCallTimeout: 1000,
       });
-      sandbox.stub(client, "requestCallsInfo");
       sandbox.spy(conversation, "setIncomingSessionData");
       sandbox.stub(conversation, "setOutgoingSessionData");
     });
 
     describe("Routes", function() {
       var router;
 
       beforeEach(function() {
@@ -152,57 +152,41 @@ describe("loop.conversation", function()
 
         it("should start alerting", function() {
           sandbox.stub(navigator.mozLoop, "startAlerting");
           router.incoming("fakeVersion");
 
           sinon.assert.calledOnce(navigator.mozLoop.startAlerting);
         });
 
-        it("should set the loopVersion on the conversation model", function() {
-          router.incoming("fakeVersion");
-
-          expect(conversation.get("loopVersion")).to.equal("fakeVersion");
-        });
-
-        it("should call requestCallsInfo on the client",
+        it("should call getCallData on navigator.mozLoop",
           function() {
             router.incoming(42);
 
-            sinon.assert.calledOnce(client.requestCallsInfo);
-            sinon.assert.calledWith(client.requestCallsInfo, 42);
+            sinon.assert.calledOnce(navigator.mozLoop.getCallData);
+            sinon.assert.calledWith(navigator.mozLoop.getCallData, 42);
           });
 
-        it("should display an error if requestCallsInfo returns an error",
-          function(){
-            sandbox.stub(notifications, "errorL10n");
-            client.requestCallsInfo.callsArgWith(1, "failed");
-
-            router.incoming(42);
-
-            sinon.assert.calledOnce(notifications.errorL10n);
-          });
-
-        describe("requestCallsInfo successful", function() {
+        describe("getCallData successful", function() {
           var fakeSessionData, resolvePromise, rejectPromise;
 
           beforeEach(function() {
             fakeSessionData  = {
               sessionId:      "sessionId",
               sessionToken:   "sessionToken",
               apiKey:         "apiKey",
               callType:       "callType",
               callId:         "Hello",
               progressURL:    "http://progress.example.com",
               websocketToken: 123
             };
 
             sandbox.stub(router, "_setupWebSocketAndCallView");
 
-            client.requestCallsInfo.callsArgWith(1, null, [fakeSessionData]);
+            navigator.mozLoop.getCallData.returns(fakeSessionData);
           });
 
           it("should store the session data", function() {
             router.incoming("fakeVersion");
 
             sinon.assert.calledOnce(conversation.setIncomingSessionData);
             sinon.assert.calledWithExactly(conversation.setIncomingSessionData,
                                            fakeSessionData);

--- a/browser/components/loop/test/mochitest/browser_fxa_login.js
+++ b/browser/components/loop/test/mochitest/browser_fxa_login.js
@@ -2,27 +2,34 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Test FxA logins with Loop.
  */
 
 "use strict";
 
-const gFxAOAuthTokenData = Cu.import("resource:///modules/loop/MozLoopService.jsm", {}).gFxAOAuthTokenData;
+const {
+  LOOP_SESSION_TYPE,
+  gFxAOAuthTokenData
+} = Cu.import("resource:///modules/loop/MozLoopService.jsm", {});
+
 const BASE_URL = "http://mochi.test:8888/browser/browser/components/loop/test/mochitest/loop_fxa.sjs?";
+const HAWK_TOKEN_LENGTH = 64;
 
 add_task(function* setup() {
   Services.prefs.setCharPref("loop.server", BASE_URL);
   Services.prefs.setCharPref("services.push.serverURL", "ws://localhost/");
   registerCleanupFunction(function* () {
     info("cleanup time");
     yield promiseDeletedOAuthParams(BASE_URL);
     Services.prefs.clearUserPref("loop.server");
     Services.prefs.clearUserPref("services.push.serverURL");
+    Services.prefs.clearUserPref(MozLoopServiceInternal.getSessionTokenPrefName(LOOP_SESSION_TYPE.GUEST));
+    Services.prefs.clearUserPref(MozLoopServiceInternal.getSessionTokenPrefName(LOOP_SESSION_TYPE.FXA));
   });
 });
 
 add_task(function* checkOAuthParams() {
   let params = {
     client_id: "client_id",
     content_uri: BASE_URL + "/content",
     oauth_uri: BASE_URL + "/oauth",
@@ -156,33 +163,51 @@ add_task(function* basicAuthorizationAnd
     client_id: "client_id",
     content_uri: BASE_URL + "/content",
     oauth_uri: BASE_URL + "/oauth",
     profile_uri: BASE_URL + "/profile",
     state: "state",
   };
   yield promiseOAuthParamsSetup(BASE_URL, params);
 
+  info("registering");
+  mockPushHandler.pushUrl = "https://localhost/pushUrl/guest";
+  yield MozLoopService.register(mockPushHandler);
+  let prefName = MozLoopServiceInternal.getSessionTokenPrefName(LOOP_SESSION_TYPE.GUEST);
+  let padding = new Array(HAWK_TOKEN_LENGTH - mockPushHandler.pushUrl.length).fill("X").join("");
+  ise(Services.prefs.getCharPref(prefName), mockPushHandler.pushUrl + padding, "Check guest hawk token");
+
+  // Normally the same pushUrl would be registered but we change it in the test
+  // to be able to check for success on the second registration.
+  mockPushHandler.pushUrl = "https://localhost/pushUrl/fxa";
+
   let tokenData = yield MozLoopService.logInToFxA();
   ise(tokenData.access_token, "code1_access_token", "Check access_token");
   ise(tokenData.scope, "profile", "Check scope");
   ise(tokenData.token_type, "bearer", "Check token_type");
+
+  let registrationResponse = yield promiseOAuthGetRegistration(BASE_URL);
+  ise(registrationResponse.response.simplePushURL, "https://localhost/pushUrl/fxa", "Check registered push URL");
+  prefName = MozLoopServiceInternal.getSessionTokenPrefName(LOOP_SESSION_TYPE.FXA);
+  padding = new Array(HAWK_TOKEN_LENGTH - mockPushHandler.pushUrl.length).fill("X").join("");
+  ise(Services.prefs.getCharPref(prefName), mockPushHandler.pushUrl + padding, "Check FxA hawk token");
 });
 
 add_task(function* loginWithParams401() {
   resetFxA();
   let params = {
     client_id: "client_id",
     content_uri: BASE_URL + "/content",
     oauth_uri: BASE_URL + "/oauth",
     profile_uri: BASE_URL + "/profile",
     state: "state",
     test_error: "params_401",
   };
   yield promiseOAuthParamsSetup(BASE_URL, params);
+  yield MozLoopService.register(mockPushHandler);
 
   let loginPromise = MozLoopService.logInToFxA();
   yield loginPromise.then(tokenData => {
     ok(false, "Promise should have rejected");
   },
   error => {
     ise(error.code, 401, "Check error code");
     ise(gFxAOAuthTokenData, null, "Check there is no saved token data");

--- a/browser/components/loop/test/mochitest/head.js
+++ b/browser/components/loop/test/mochitest/head.js
@@ -107,8 +107,51 @@ function promiseDeletedOAuthParams(baseU
               createInstance(Ci.nsIXMLHttpRequest);
   xhr.open("DELETE", baseURL + "/setup_params", true);
   xhr.addEventListener("load", () => deferred.resolve(xhr));
   xhr.addEventListener("error", deferred.reject);
   xhr.send();
 
   return deferred.promise;
 }
+
+/**
+ * Get the last registration on the test server.
+ */
+function promiseOAuthGetRegistration(baseURL) {
+  let deferred = Promise.defer();
+  let xhr = Cc["@mozilla.org/xmlextras/xmlhttprequest;1"].
+              createInstance(Ci.nsIXMLHttpRequest);
+  xhr.open("GET", baseURL + "/get_registration", true);
+  xhr.responseType = "json";
+  xhr.addEventListener("load", () => deferred.resolve(xhr));
+  xhr.addEventListener("error", deferred.reject);
+  xhr.send();
+
+  return deferred.promise;
+}
+
+/**
+ * This is used to fake push registration and notifications for
+ * MozLoopService tests. There is only one object created per test instance, as
+ * once registration has taken place, the object cannot currently be changed.
+ */
+let mockPushHandler = {
+  // This sets the registration result to be returned when initialize
+  // is called. By default, it is equivalent to success.
+  registrationResult: null,
+  pushUrl: undefined,
+
+  /**
+   * MozLoopPushHandler API
+   */
+  initialize: function(registerCallback, notificationCallback) {
+    registerCallback(this.registrationResult, this.pushUrl);
+    this._notificationCallback = notificationCallback;
+  },
+
+  /**
+   * Test-only API to simplify notifying a push notification result.
+   */
+  notify: function(version) {
+    this._notificationCallback(version);
+  }
+};

--- a/browser/components/loop/test/mochitest/loop_fxa.sjs
+++ b/browser/components/loop/test/mochitest/loop_fxa.sjs
@@ -3,37 +3,44 @@
 
 /**
  * This is a mock server that implements the FxA endpoints on the Loop server.
  */
 
 "use strict";
 
 const REQUIRED_PARAMS = ["client_id", "content_uri", "oauth_uri", "profile_uri", "state"];
+const HAWK_TOKEN_LENGTH = 64;
 
 Components.utils.import("resource://gre/modules/NetUtil.jsm");
 
 /**
  * Entry point for HTTP requests.
  */
 function handleRequest(request, response) {
   // Look at the query string but ignore past the encoded ? when deciding on the handler.
   switch (request.queryString.replace(/%3F.*/,"")) {
-    case "/setup_params":
+    case "/setup_params": // Test-only
       setup_params(request, response);
       return;
     case "/fxa-oauth/params":
       params(request, response);
       return;
     case encodeURIComponent("/oauth/authorization"):
       oauth_authorization(request, response);
       return;
     case "/fxa-oauth/token":
       token(request, response);
       return;
+    case "/registration":
+      registration(request, response);
+      return;
+    case "/get_registration": // Test-only
+      get_registration(request, response);
+      return;
   }
   response.setStatusLine(request.httpVersion, 404, "Not Found");
 }
 
 /**
  * POST /setup_params
  * DELETE /setup_params
  *
@@ -42,16 +49,17 @@ function handleRequest(request, response
  * For a POST the X-Params header should contain a JSON object with keys to set for /fxa-oauth/params.
  * A DELETE request will delete the stored parameters and should be run in a cleanup function to
  * avoid interfering with subsequen tests.
  */
 function setup_params(request, response) {
   response.setHeader("Content-Type", "text/plain", false);
   if (request.method == "DELETE") {
     setSharedState("/fxa-oauth/params", "");
+    setSharedState("/registration", "");
     response.write("Params deleted");
     return;
   }
   let params = JSON.parse(request.getHeader("X-Params"));
   if (!params) {
     response.setStatusLine(request.httpVersion, 400, "Bad Request");
     return;
   }
@@ -136,8 +144,35 @@ function token(request, response) {
   let tokenData = {
     access_token: payload.code + "_access_token",
     scope: "profile",
     token_type: "bearer",
   };
   response.setHeader("Content-Type", "application/json; charset=utf-8", false);
   response.write(JSON.stringify(tokenData, null, 2));
 }
+
+/**
+ * POST /registration
+ *
+ * Mock Loop registration endpoint which simply returns the simplePushURL with
+ * padding as the hawk session token.
+ */
+function registration(request, response) {
+  let body = NetUtil.readInputStreamToString(request.bodyInputStream,
+                                             request.bodyInputStream.available());
+  let payload = JSON.parse(body);
+  setSharedState("/registration", body);
+  let pushURL = payload.simplePushURL;
+  // Pad the pushURL with "X" to the token length to simulate a token
+  let padding = new Array(HAWK_TOKEN_LENGTH - pushURL.length).fill("X").join("");
+  response.setHeader("hawk-session-token", pushURL + padding, false);
+}
+
+/**
+ * GET /get_registration
+ *
+ * Used for testing purposes to check if registration succeeded by returning the POST body.
+ */
+function get_registration(request, response) {
+  response.setHeader("Content-Type", "application/json; charset=utf-8", false);
+  response.write(getSharedState("/registration"));
+}

--- a/browser/components/loop/test/xpcshell/head.js
+++ b/browser/components/loop/test/xpcshell/head.js
@@ -22,16 +22,23 @@ const kEndPointUrl = "http://example.com
 const kUAID = "f47ac11b-58ca-4372-9567-0e02b2c3d479";
 
 // Fake loop server
 var loopServer;
 
 // Ensure loop is always enabled for tests
 Services.prefs.setBoolPref("loop.enabled", true);
 
+function hawkGetCallsRequest() {
+  let response = {body: JSON.stringify({calls: [{callId: 4444333221, websocketToken: "0deadbeef0"}]})},
+      // Call the first non-null then(resolve) function attached to the fakePromise.
+      fakePromise = {then: (resolve) => {return resolve ? resolve(response) : fakePromise;},
+                     catch: () => {return fakePromise;}};
+  return fakePromise;
+}
 
 function setupFakeLoopServer() {
   loopServer = new HttpServer();
   loopServer.start(-1);
 
   Services.prefs.setCharPref("services.push.serverURL", kServerPushUrl);
 
   Services.prefs.setCharPref("loop.server",

--- a/browser/components/loop/test/xpcshell/test_loopservice_dnd.js
+++ b/browser/components/loop/test/xpcshell/test_loopservice_dnd.js
@@ -1,16 +1,17 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this file,
  * You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 XPCOMUtils.defineLazyModuleGetter(this, "Chat",
                                   "resource:///modules/Chat.jsm");
+let openChatOrig = Chat.open;
 
-let openChatOrig = Chat.open;
+const loopServiceModule = Cu.import("resource:///modules/loop/MozLoopService.jsm", {});
 
 add_test(function test_get_do_not_disturb() {
   Services.prefs.setBoolPref("loop.do_not_disturb", false);
 
   do_check_false(MozLoopService.doNotDisturb);
 
   Services.prefs.setBoolPref("loop.do_not_disturb", true);
 
@@ -33,20 +34,25 @@ add_test(function test_do_not_disturb_di
   MozLoopService.doNotDisturb = false;
 
   MozLoopService.register(mockPushHandler).then(() => {
     let opened = false;
     Chat.open = function() {
       opened = true;
     };
 
+    let savedHawkClient = loopServiceModule.gHawkClient;
+    loopServiceModule.gHawkClient = {request: hawkGetCallsRequest};
+
     mockPushHandler.notify(1);
 
     do_check_true(opened, "should open a chat window");
 
+    loopServiceModule.gHawkClient = savedHawkClient;
+
     run_next_test();
   });
 });
 
 add_task(function test_do_not_disturb_enabled_shouldnt_open_chat_window() {
   MozLoopService.doNotDisturb = true;
 
   // We registered in the previous test, so no need to do that on this one.

--- a/browser/components/loop/test/xpcshell/test_loopservice_notification.js
+++ b/browser/components/loop/test/xpcshell/test_loopservice_notification.js
@@ -2,32 +2,39 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this file,
  * You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 XPCOMUtils.defineLazyModuleGetter(this, "Chat",
                                   "resource:///modules/Chat.jsm");
 
 let openChatOrig = Chat.open;
 
+const loopServiceModule = Cu.import("resource:///modules/loop/MozLoopService.jsm", {});
+
 add_test(function test_openChatWindow_on_notification() {
   Services.prefs.setCharPref("loop.seenToS", "unseen");
 
   MozLoopService.register(mockPushHandler).then(() => {
     let opened = false;
     Chat.open = function() {
       opened = true;
     };
 
+    let savedHawkClient = loopServiceModule.gHawkClient;
+    loopServiceModule.gHawkClient = {request: hawkGetCallsRequest};
+
     mockPushHandler.notify(1);
 
     do_check_true(opened, "should open a chat window");
 
     do_check_eq(Services.prefs.getCharPref("loop.seenToS"), "seen",
                 "should set the pref to 'seen'");
 
+    loopServiceModule.gHawkClient = savedHawkClient;
+
     run_next_test();
   });
 });
 
 function run_test()
 {
   setupFakeLoopServer();
 

--- a/browser/components/preferences/in-content/main.js
+++ b/browser/components/preferences/in-content/main.js
@@ -55,32 +55,25 @@ var gMainPane = {
 #endif
 
     // set up the "use current page" label-changing listener
     this._updateUseCurrentButton();
     window.addEventListener("focus", this._updateUseCurrentButton.bind(this), false);
 
     this.updateBrowserStartupLastSession();
 
-    // Notify observers that the UI is now ready
-    Components.classes["@mozilla.org/observer-service;1"]
-              .getService(Components.interfaces.nsIObserverService)
-              .notifyObservers(window, "main-pane-loaded", null);
-
 #ifdef XP_WIN
     // Functionality for "Show tabs in taskbar" on Windows 7 and up.
-
     try {
       let sysInfo = Cc["@mozilla.org/system-info;1"].
                     getService(Ci.nsIPropertyBag2);
       let ver = parseFloat(sysInfo.getProperty("version"));
       let showTabsInTaskbar = document.getElementById("showTabsInTaskbar");
       showTabsInTaskbar.hidden = ver < 6.1;
     } catch (ex) {}
-
 #endif
 
     setEventListener("browser.privatebrowsing.autostart", "change",
                      gMainPane.updateBrowserStartupLastSession);
     setEventListener("browser.download.dir", "change",
                      gMainPane.displayDownloadDirPref);
 #ifdef HAVE_SHELL_SERVICE
     setEventListener("setDefaultButton", "command",
@@ -89,16 +82,21 @@ var gMainPane = {
     setEventListener("useCurrent", "command",
                      gMainPane.setHomePageToCurrent);
     setEventListener("useBookmark", "command",
                      gMainPane.setHomePageToBookmark);
     setEventListener("restoreDefaultHomePage", "command",
                      gMainPane.restoreDefaultHomePage);
     setEventListener("chooseFolder", "command",
                      gMainPane.chooseFolder);
+
+    // Notify observers that the UI is now ready
+    Components.classes["@mozilla.org/observer-service;1"]
+              .getService(Components.interfaces.nsIObserverService)
+              .notifyObservers(window, "main-pane-loaded", null);
   },
 
   // HOME PAGE
 
   /*
    * Preferences:
    *
    * browser.startup.homepage

--- a/browser/devtools/jar.mn
+++ b/browser/devtools/jar.mn
@@ -114,8 +114,10 @@ browser.jar:
     content/browser/devtools/graphs-frame.xhtml                        (shared/widgets/graphs-frame.xhtml)
     content/browser/devtools/spectrum-frame.xhtml                      (shared/widgets/spectrum-frame.xhtml)
     content/browser/devtools/spectrum.css                              (shared/widgets/spectrum.css)
     content/browser/devtools/cubic-bezier-frame.xhtml                  (shared/widgets/cubic-bezier-frame.xhtml)
     content/browser/devtools/cubic-bezier.css                          (shared/widgets/cubic-bezier.css)
     content/browser/devtools/eyedropper.xul                            (eyedropper/eyedropper.xul)
     content/browser/devtools/eyedropper/crosshairs.css                 (eyedropper/crosshairs.css)
     content/browser/devtools/eyedropper/nocursor.css                   (eyedropper/nocursor.css)
+    content/browser/devtools/timeline/timeline.xul                     (timeline/timeline.xul)
+    content/browser/devtools/timeline/timeline.js                      (timeline/timeline.js)

--- a/browser/devtools/main.js
+++ b/browser/devtools/main.js
@@ -26,46 +26,49 @@ loader.lazyGetter(this, "OptionsPanel", 
 loader.lazyGetter(this, "InspectorPanel", () => require("devtools/inspector/inspector-panel").InspectorPanel);
 loader.lazyGetter(this, "WebConsolePanel", () => require("devtools/webconsole/panel").WebConsolePanel);
 loader.lazyGetter(this, "DebuggerPanel", () => require("devtools/debugger/panel").DebuggerPanel);
 loader.lazyGetter(this, "StyleEditorPanel", () => require("devtools/styleeditor/styleeditor-panel").StyleEditorPanel);
 loader.lazyGetter(this, "ShaderEditorPanel", () => require("devtools/shadereditor/panel").ShaderEditorPanel);
 loader.lazyGetter(this, "CanvasDebuggerPanel", () => require("devtools/canvasdebugger/panel").CanvasDebuggerPanel);
 loader.lazyGetter(this, "WebAudioEditorPanel", () => require("devtools/webaudioeditor/panel").WebAudioEditorPanel);
 loader.lazyGetter(this, "ProfilerPanel", () => require("devtools/profiler/panel").ProfilerPanel);
+loader.lazyGetter(this, "TimelinePanel", () => require("devtools/timeline/panel").TimelinePanel);
 loader.lazyGetter(this, "NetMonitorPanel", () => require("devtools/netmonitor/panel").NetMonitorPanel);
+loader.lazyGetter(this, "StoragePanel", () => require("devtools/storage/panel").StoragePanel);
 loader.lazyGetter(this, "ScratchpadPanel", () => require("devtools/scratchpad/scratchpad-panel").ScratchpadPanel);
-loader.lazyGetter(this, "StoragePanel", () => require("devtools/storage/panel").StoragePanel);
 
 // Strings
 const toolboxProps = "chrome://browser/locale/devtools/toolbox.properties";
 const inspectorProps = "chrome://browser/locale/devtools/inspector.properties";
+const webConsoleProps = "chrome://browser/locale/devtools/webconsole.properties";
 const debuggerProps = "chrome://browser/locale/devtools/debugger.properties";
 const styleEditorProps = "chrome://browser/locale/devtools/styleeditor.properties";
 const shaderEditorProps = "chrome://browser/locale/devtools/shadereditor.properties";
 const canvasDebuggerProps = "chrome://browser/locale/devtools/canvasdebugger.properties";
 const webAudioEditorProps = "chrome://browser/locale/devtools/webaudioeditor.properties";
-const webConsoleProps = "chrome://browser/locale/devtools/webconsole.properties";
 const profilerProps = "chrome://browser/locale/devtools/profiler.properties";
+const timelineProps = "chrome://browser/locale/devtools/timeline.properties";
 const netMonitorProps = "chrome://browser/locale/devtools/netmonitor.properties";
+const storageProps = "chrome://browser/locale/devtools/storage.properties";
 const scratchpadProps = "chrome://browser/locale/devtools/scratchpad.properties";
-const storageProps = "chrome://browser/locale/devtools/storage.properties";
 
 loader.lazyGetter(this, "toolboxStrings", () => Services.strings.createBundle(toolboxProps));
+loader.lazyGetter(this, "profilerStrings",() => Services.strings.createBundle(profilerProps));
 loader.lazyGetter(this, "webConsoleStrings", () => Services.strings.createBundle(webConsoleProps));
 loader.lazyGetter(this, "debuggerStrings", () => Services.strings.createBundle(debuggerProps));
 loader.lazyGetter(this, "styleEditorStrings", () => Services.strings.createBundle(styleEditorProps));
 loader.lazyGetter(this, "shaderEditorStrings", () => Services.strings.createBundle(shaderEditorProps));
 loader.lazyGetter(this, "canvasDebuggerStrings", () => Services.strings.createBundle(canvasDebuggerProps));
 loader.lazyGetter(this, "webAudioEditorStrings", () => Services.strings.createBundle(webAudioEditorProps));
 loader.lazyGetter(this, "inspectorStrings", () => Services.strings.createBundle(inspectorProps));
-loader.lazyGetter(this, "profilerStrings",() => Services.strings.createBundle(profilerProps));
+loader.lazyGetter(this, "timelineStrings", () => Services.strings.createBundle(timelineProps));
 loader.lazyGetter(this, "netMonitorStrings", () => Services.strings.createBundle(netMonitorProps));
+loader.lazyGetter(this, "storageStrings", () => Services.strings.createBundle(storageProps));
 loader.lazyGetter(this, "scratchpadStrings", () => Services.strings.createBundle(scratchpadProps));
-loader.lazyGetter(this, "storageStrings", () => Services.strings.createBundle(storageProps));
 
 let Tools = {};
 exports.Tools = Tools;
 
 // Definitions
 Tools.options = {
   id: "options",
   ordinal: 0,
@@ -73,19 +76,21 @@ Tools.options = {
   icon: "chrome://browser/skin/devtools/tool-options.svg",
   invertIconForLightTheme: true,
   bgTheme: "theme-body",
   label: l10n("options.label", toolboxStrings),
   iconOnly: true,
   panelLabel: l10n("options.panelLabel", toolboxStrings),
   tooltip: l10n("optionsButton.tooltip", toolboxStrings),
   inMenu: false,
+
   isTargetSupported: function(target) {
     return true;
   },
+
   build: function(iframeWindow, toolbox) {
     return new OptionsPanel(iframeWindow, toolbox);
   }
 }
 
 Tools.webConsole = {
   id: "webconsole",
   key: l10n("cmd.commandkey", webConsoleStrings),
@@ -108,16 +113,17 @@ Tools.webConsole = {
       return toolbox.focusConsoleInput();
 
     panel.focusInput();
   },
 
   isTargetSupported: function(target) {
     return true;
   },
+
   build: function(iframeWindow, toolbox) {
     return new WebConsolePanel(iframeWindow, toolbox);
   }
 };
 
 Tools.inspector = {
   id: "inspector",
   accesskey: l10n("inspector.accesskey", inspectorStrings),
@@ -225,39 +231,43 @@ Tools.canvasDebugger = {
   ordinal: 6,
   visibilityswitch: "devtools.canvasdebugger.enabled",
   icon: "chrome://browser/skin/devtools/tool-styleeditor.svg",
   invertIconForLightTheme: true,
   url: "chrome://browser/content/devtools/canvasdebugger.xul",
   label: l10n("ToolboxCanvasDebugger.label", canvasDebuggerStrings),
   panelLabel: l10n("ToolboxCanvasDebugger.panelLabel", canvasDebuggerStrings),
   tooltip: l10n("ToolboxCanvasDebugger.tooltip", canvasDebuggerStrings),
+
   // Hide the Canvas Debugger in the Add-on Debugger and Browser Toolbox
   // (bug 1047520).
   isTargetSupported: function(target) {
     return !target.isAddon && !target.chrome;
   },
+
   build: function (iframeWindow, toolbox) {
     return new CanvasDebuggerPanel(iframeWindow, toolbox);
   }
 };
 
 Tools.webAudioEditor = {
   id: "webaudioeditor",
   ordinal: 10,
   visibilityswitch: "devtools.webaudioeditor.enabled",
   icon: "chrome://browser/skin/devtools/tool-webaudio.svg",
   invertIconForLightTheme: true,
   url: "chrome://browser/content/devtools/webaudioeditor.xul",
   label: l10n("ToolboxWebAudioEditor1.label", webAudioEditorStrings),
   panelLabel: l10n("ToolboxWebAudioEditor1.panelLabel", webAudioEditorStrings),
   tooltip: l10n("ToolboxWebAudioEditor1.tooltip", webAudioEditorStrings),
+
   isTargetSupported: function(target) {
     return !target.isAddon;
   },
+
   build: function(iframeWindow, toolbox) {
     return new WebAudioEditorPanel(iframeWindow, toolbox);
   }
 };
 
 Tools.jsprofiler = {
   id: "jsprofiler",
   accesskey: l10n("profiler.accesskey", profilerStrings),
@@ -279,21 +289,42 @@ Tools.jsprofiler = {
     return !target.isAddon && (!target.isApp || target.form.profilerActor);
   },
 
   build: function (frame, target) {
     return new ProfilerPanel(frame, target);
   }
 };
 
+Tools.timeline = {
+  id: "timeline",
+  ordinal: 8,
+  visibilityswitch: "devtools.timeline.enabled",
+  icon: "chrome://browser/skin/devtools/tool-network.svg",
+  invertIconForLightTheme: true,
+  url: "chrome://browser/content/devtools/timeline/timeline.xul",
+  label: l10n("timeline.label", timelineStrings),
+  panelLabel: l10n("timeline.panelLabel", timelineStrings),
+  tooltip: l10n("timeline.tooltip", timelineStrings),
+
+  isTargetSupported: function(target) {
+    return !target.isAddon;
+  },
+
+  build: function (iframeWindow, toolbox) {
+    let panel = new TimelinePanel(iframeWindow, toolbox);
+    return panel.open();
+  }
+};
+
 Tools.netMonitor = {
   id: "netmonitor",
   accesskey: l10n("netmonitor.accesskey", netMonitorStrings),
   key: l10n("netmonitor.commandkey", netMonitorStrings),
-  ordinal: 8,
+  ordinal: 9,
   modifiers: osString == "Darwin" ? "accel,alt" : "accel,shift",
   visibilityswitch: "devtools.netmonitor.enabled",
   icon: "chrome://browser/skin/devtools/tool-network.svg",
   invertIconForLightTheme: true,
   url: "chrome://browser/content/devtools/netmonitor.xul",
   label: l10n("netmonitor.label", netMonitorStrings),
   panelLabel: l10n("netmonitor.panelLabel", netMonitorStrings),
   tooltip: l10n("netmonitor.tooltip", netMonitorStrings),
@@ -307,17 +338,17 @@ Tools.netMonitor = {
   build: function(iframeWindow, toolbox) {
     return new NetMonitorPanel(iframeWindow, toolbox);
   }
 };
 
 Tools.storage = {
   id: "storage",
   key: l10n("storage.commandkey", storageStrings),
-  ordinal: 9,
+  ordinal: 10,
   accesskey: l10n("storage.accesskey", storageStrings),
   modifiers: "shift",
   visibilityswitch: "devtools.storage.enabled",
   icon: "chrome://browser/skin/devtools/tool-storage.svg",
   invertIconForLightTheme: true,
   url: "chrome://browser/content/devtools/storage.xul",
   label: l10n("storage.label", storageStrings),
   menuLabel: l10n("storage.menuLabel", storageStrings),
@@ -332,17 +363,17 @@ Tools.storage = {
 
   build: function(iframeWindow, toolbox) {
     return new StoragePanel(iframeWindow, toolbox);
   }
 };
 
 Tools.scratchpad = {
   id: "scratchpad",
-  ordinal: 10,
+  ordinal: 11,
   visibilityswitch: "devtools.scratchpad.enabled",
   icon: "chrome://browser/skin/devtools/tool-scratchpad.svg",
   invertIconForLightTheme: true,
   url: "chrome://browser/content/devtools/scratchpad.xul",
   label: l10n("scratchpad.label", scratchpadStrings),
   panelLabel: l10n("scratchpad.panelLabel", scratchpadStrings),
   tooltip: l10n("scratchpad.tooltip", scratchpadStrings),
   inMenu: false,
@@ -362,16 +393,17 @@ let defaultTools = [
   Tools.webConsole,
   Tools.inspector,
   Tools.jsdebugger,
   Tools.styleEditor,
   Tools.shaderEditor,
   Tools.canvasDebugger,
   Tools.webAudioEditor,
   Tools.jsprofiler,
+  Tools.timeline,
   Tools.netMonitor,
   Tools.storage,
   Tools.scratchpad
 ];
 
 exports.defaultTools = defaultTools;
 
 for (let definition of defaultTools) {

--- a/browser/devtools/moz.build
+++ b/browser/devtools/moz.build
@@ -8,30 +8,31 @@ DIRS += [
     'app-manager',
     'canvasdebugger',
     'commandline',
     'debugger',
     'eyedropper',
     'fontinspector',
     'framework',
     'inspector',
-    'projecteditor',
     'layoutview',
     'markupview',
     'netmonitor',
     'profiler',
+    'projecteditor',
     'responsivedesign',
     'scratchpad',
     'shadereditor',
     'shared',
     'sourceeditor',
     'storage',
     'styleeditor',
     'styleinspector',
     'tilt',
+    'timeline',
     'webaudioeditor',
     'webconsole',
     'webide',
 ]
 
 EXTRA_COMPONENTS += [
     'devtools-clhandler.js',
     'devtools-clhandler.manifest',

--- a/browser/devtools/profiler/test/browser_profiler_data-massaging-01.js
+++ b/browser/devtools/profiler/test/browser_profiler_data-massaging-01.js
@@ -1,9 +1,9 @@
-/* Any copyright is dedicated to the Public Domain.
+s/* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if the retrieved profiler data samples are correctly filtered and
  * normalized before passed to consumers.
  */
 
 const WAIT_TIME = 1000; // ms

--- a/browser/devtools/shared/test/browser.ini
+++ b/browser/devtools/shared/test/browser.ini
@@ -16,17 +16,18 @@ support-files =
 [browser_cubic-bezier-02.js]
 [browser_cubic-bezier-03.js]
 [browser_graphs-01.js]
 [browser_graphs-02.js]
 [browser_graphs-03.js]
 [browser_graphs-04.js]
 [browser_graphs-05.js]
 [browser_graphs-06.js]
-[browser_graphs-07.js]
+[browser_graphs-07a.js]
+[browser_graphs-07b.js]
 [browser_graphs-08.js]
 [browser_graphs-09.js]
 [browser_graphs-10a.js]
 [browser_graphs-10b.js]
 [browser_graphs-11a.js]
 [browser_graphs-11b.js]
 [browser_graphs-12.js]
 [browser_graphs-13.js]

rename from browser/devtools/shared/test/browser_graphs-07.js
rename to browser/devtools/shared/test/browser_graphs-07a.js

new file mode 100644
--- /dev/null
+++ b/browser/devtools/shared/test/browser_graphs-07b.js
@@ -0,0 +1,69 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+// Tests if selections can't be added via clicking, while not allowed.
+
+const TEST_DATA = [{ delta: 112, value: 48 }, { delta: 213, value: 59 }, { delta: 313, value: 60 }, { delta: 413, value: 59 }, { delta: 530, value: 59 }, { delta: 646, value: 58 }, { delta: 747, value: 60 }, { delta: 863, value: 48 }, { delta: 980, value: 37 }, { delta: 1097, value: 30 }, { delta: 1213, value: 29 }, { delta: 1330, value: 23 }, { delta: 1430, value: 10 }, { delta: 1534, value: 17 }, { delta: 1645, value: 20 }, { delta: 1746, value: 22 }, { delta: 1846, value: 39 }, { delta: 1963, value: 26 }, { delta: 2080, value: 27 }, { delta: 2197, value: 35 }, { delta: 2312, value: 47 }, { delta: 2412, value: 53 }, { delta: 2514, value: 60 }, { delta: 2630, value: 37 }, { delta: 2730, value: 36 }, { delta: 2830, value: 37 }, { delta: 2946, value: 36 }, { delta: 3046, value: 40 }, { delta: 3163, value: 47 }, { delta: 3280, value: 41 }, { delta: 3380, value: 35 }, { delta: 3480, value: 27 }, { delta: 3580, value: 39 }, { delta: 3680, value: 42 }, { delta: 3780, value: 49 }, { delta: 3880, value: 55 }, { delta: 3980, value: 60 }, { delta: 4080, value: 60 }, { delta: 4180, value: 60 }];
+let {LineGraphWidget} = Cu.import("resource:///modules/devtools/Graphs.jsm", {});
+let {DOMHelpers} = Cu.import("resource:///modules/devtools/DOMHelpers.jsm", {});
+let {Promise} = devtools.require("resource://gre/modules/Promise.jsm");
+let {Hosts} = devtools.require("devtools/framework/toolbox-hosts");
+
+let test = Task.async(function*() {
+  yield promiseTab("about:blank");
+  yield performTest();
+  gBrowser.removeCurrentTab();
+  finish();
+});
+
+function* performTest() {
+  let [host, win, doc] = yield createHost();
+  let graph = new LineGraphWidget(doc.body, "fps");
+  yield graph.once("ready");
+
+  testGraph(graph);
+
+  graph.destroy();
+  host.destroy();
+}
+
+function testGraph(graph) {
+  graph.setData(TEST_DATA);
+  graph.selectionEnabled = false;
+
+  info("Attempting to make a selection.");
+
+  dragStart(graph, 300);
+  is(graph.hasSelection() || graph.hasSelectionInProgress(), false,
+    "The graph shouldn't have a selection (1).");
+
+  hover(graph, 400);
+  is(graph.hasSelection() || graph.hasSelectionInProgress(), false,
+    "The graph shouldn't have a selection (2).");
+
+  dragStop(graph, 500);
+  is(graph.hasSelection() || graph.hasSelectionInProgress(), false,
+    "The graph shouldn't have a selection (3).");
+}
+
+// EventUtils just doesn't work!
+
+function hover(graph, x, y = 1) {
+  x /= window.devicePixelRatio;
+  y /= window.devicePixelRatio;
+  graph._onMouseMove({ clientX: x, clientY: y });
+}
+
+function dragStart(graph, x, y = 1) {
+  x /= window.devicePixelRatio;
+  y /= window.devicePixelRatio;
+  graph._onMouseMove({ clientX: x, clientY: y });
+  graph._onMouseDown({ clientX: x, clientY: y });
+}
+
+function dragStop(graph, x, y = 1) {
+  x /= window.devicePixelRatio;
+  y /= window.devicePixelRatio;
+  graph._onMouseMove({ clientX: x, clientY: y });
+  graph._onMouseUp({ clientX: x, clientY: y });
+}

--- a/browser/devtools/shared/widgets/Graphs.jsm
+++ b/browser/devtools/shared/widgets/Graphs.jsm
@@ -5,17 +5,22 @@
 
 const Cu = Components.utils;
 
 Cu.import("resource:///modules/devtools/ViewHelpers.jsm");
 const promise = Cu.import("resource://gre/modules/Promise.jsm", {}).Promise;
 const {EventEmitter} = Cu.import("resource://gre/modules/devtools/event-emitter.js", {});
 const {Task} = Cu.import("resource://gre/modules/Task.jsm", {});
 
-this.EXPORTED_SYMBOLS = ["LineGraphWidget", "BarGraphWidget", "CanvasGraphUtils"];
+this.EXPORTED_SYMBOLS = [
+  "AbstractCanvasGraph",
+  "LineGraphWidget",
+  "BarGraphWidget",
+  "CanvasGraphUtils"
+];
 
 const HTML_NS = "http://www.w3.org/1999/xhtml";
 const GRAPH_SRC = "chrome://browser/content/devtools/graphs-frame.xhtml";
 
 // Generic constants.
 
 const GRAPH_RESIZE_EVENTS_DRAIN = 100; // ms
 const GRAPH_WHEEL_ZOOM_SENSITIVITY = 0.00075;
@@ -490,16 +495,22 @@ AbstractCanvasGraph.prototype = {
    * via a click+drag operation.
    * @return boolean
    */
   hasSelectionInProgress: function() {
     return this._selection.start != null && this._selection.end == null;
   },
 
   /**
+   * Specifies whether or not mouse selection is allowed.
+   * @type boolean
+   */
+  selectionEnabled: true,
+
+  /**
    * Sets the selection bounds.
    * Use `dropCursor` to hide the cursor.
    *
    * @param object cursor
    *        The cursor's { x, y } position.
    */
   setCursor: function(cursor) {
     if (!cursor || cursor.x == null || cursor.y == null) {
@@ -950,16 +961,19 @@ AbstractCanvasGraph.prototype = {
    */
   _onMouseDown: function(e) {
     let offset = this._getContainerOffset();
     let mouseX = (e.clientX - offset.left) * this._pixelRatio;
 
     switch (this._canvas.getAttribute("input")) {
       case "hovering-background":
       case "hovering-region":
+        if (!this.selectionEnabled) {
+          break;
+        }
         this._selection.start = mouseX;
         this._selection.end = null;
         this.emit("selecting");
         break;
 
       case "hovering-selection-start-boundary":
         this._selectionResizer.margin = "start";
         break;
@@ -985,16 +999,19 @@ AbstractCanvasGraph.prototype = {
    */
   _onMouseUp: function(e) {
     let offset = this._getContainerOffset();
     let mouseX = (e.clientX - offset.left) * this._pixelRatio;
 
     switch (this._canvas.getAttribute("input")) {
       case "hovering-background":
       case "hovering-region":
+        if (!this.selectionEnabled) {
+          break;
+        }
         if (this.getSelectionWidth() < 1) {
           let region = this.getHoveredRegion();
           if (region) {
             this._selection.start = region.start;
             this._selection.end = region.end;
             this.emit("selecting");
           } else {
             this._selection.start = null;

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/moz.build
@@ -0,0 +1,13 @@
+# vim: set filetype=python:
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+EXTRA_JS_MODULES.devtools.timeline += [
+    'panel.js',
+    'widgets/global.js',
+    'widgets/overview.js',
+    'widgets/waterfall.js'
+]
+
+BROWSER_CHROME_MANIFESTS += ['test/browser.ini']

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/panel.js
@@ -0,0 +1,63 @@
+/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+"use strict";
+
+const { Cc, Ci, Cu, Cr } = require("chrome");
+
+Cu.import("resource://gre/modules/Task.jsm");
+
+loader.lazyRequireGetter(this, "promise");
+loader.lazyRequireGetter(this, "EventEmitter",
+  "devtools/toolkit/event-emitter");
+
+loader.lazyRequireGetter(this, "TimelineFront",
+  "devtools/server/actors/timeline", true);
+
+function TimelinePanel(iframeWindow, toolbox) {
+  this.panelWin = iframeWindow;
+  this._toolbox = toolbox;
+
+  EventEmitter.decorate(this);
+};
+
+exports.TimelinePanel = TimelinePanel;
+
+TimelinePanel.prototype = {
+  /**
+   * Open is effectively an asynchronous constructor.
+   *
+   * @return object
+   *         A promise that is resolved when the timeline completes opening.
+   */
+  open: Task.async(function*() {
+    // Local debugging needs to make the target remote.
+    yield this.target.makeRemote();
+
+    this.panelWin.gToolbox = this._toolbox;
+    this.panelWin.gTarget = this.target;
+    this.panelWin.gFront = new TimelineFront(this.target.client, this.target.form);
+    yield this.panelWin.startupTimeline();
+
+    this.isReady = true;
+    this.emit("ready");
+    return this;
+  }),
+
+  // DevToolPanel API
+
+  get target() this._toolbox.target,
+
+  destroy: Task.async(function*() {
+    // Make sure this panel is not already destroyed.
+    if (this._destroyed) {
+      return;
+    }
+
+    yield this.panelWin.shutdownTimeline();
+    this.emit("destroyed");
+    this._destroyed = true;
+  })
+};

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/test/browser.ini
@@ -0,0 +1,17 @@
+[DEFAULT]
+skip-if = e10s # Bug 1065355 - devtools tests disabled with e10s
+subsuite = devtools
+support-files =
+  doc_simple-test.html
+  head.js
+
+[browser_timeline_aaa_run_first_leaktest.js]
+[browser_timeline_blueprint.js]
+[browser_timeline_overview-initial-selection-01.js]
+[browser_timeline_overview-initial-selection-02.js]
+[browser_timeline_overview-update.js]
+[browser_timeline_panels.js]
+[browser_timeline_recording.js]
+[browser_timeline_waterfall-background.js]
+[browser_timeline_waterfall-generic.js]
+[browser_timeline_waterfall-styles.js]

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/test/browser_timeline_aaa_run_first_leaktest.js
@@ -0,0 +1,22 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+/**
+ * Tests if the timeline leaks on initialization and sudden destruction.
+ * You can also use this initialization format as a template for other tests.
+ */
+
+let test = Task.async(function*() {
+  let [target, debuggee, panel] = yield initTimelinePanel(SIMPLE_URL);
+
+  ok(target, "Should have a target available.");
+  ok(debuggee, "Should have a debuggee available.");
+  ok(panel, "Should have a panel available.");
+
+  ok(panel.panelWin.gToolbox, "Should have a toolbox reference on the panel window.");
+  ok(panel.panelWin.gTarget, "Should have a target reference on the panel window.");
+  ok(panel.panelWin.gFront, "Should have a front reference on the panel window.");
+
+  yield teardown(panel);
+  finish();
+});

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/test/browser_timeline_blueprint.js
@@ -0,0 +1,29 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+/**
+ * Tests if the timeline blueprint has a correct structure.
+ */
+
+function test() {
+  let { TIMELINE_BLUEPRINT } = devtools.require("devtools/timeline/global");
+
+  ok(TIMELINE_BLUEPRINT,
+    "A timeline blueprint should be available.");
+
+  ok(Object.keys(TIMELINE_BLUEPRINT).length,
+    "The timeline blueprint has at least one entry.");
+
+  for (let [key, value] of Iterator(TIMELINE_BLUEPRINT)) {
+    ok("group" in value,
+      "Each entry in the timeline blueprint contains a `group` key.");
+    ok("fill" in value,
+      "Each entry in the timeline blueprint contains a `fill` key.");
+    ok("stroke" in value,
+      "Each entry in the timeline blueprint contains a `stroke` key.");
+    ok("label" in value,
+      "Each entry in the timeline blueprint contains a `label` key.");
+  }
+
+  finish();
+}

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/test/browser_timeline_overview-initial-selection-01.js
@@ -0,0 +1,41 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+/**
+ * Tests if the overview has an initial selection when recording has finished
+ * and there is data available.
+ */
+
+let test = Task.async(function*() {
+  let [target, debuggee, panel] = yield initTimelinePanel(SIMPLE_URL);
+  let { EVENTS, TimelineView, TimelineController } = panel.panelWin;
+  let { OVERVIEW_INITIAL_SELECTION_RATIO: selectionRatio } = panel.panelWin;
+
+  yield TimelineController.toggleRecording();
+  ok(true, "Recording has started.");
+
+  let updated = 0;
+  panel.panelWin.on(EVENTS.OVERVIEW_UPDATED, () => updated++);
+
+  ok((yield waitUntil(() => updated > 10)),
+    "The overview graph was updated a bunch of times.");
+  ok((yield waitUntil(() => TimelineController.getMarkers().length > 0)),
+    "There are some markers available.");
+
+  yield TimelineController.toggleRecording();
+  ok(true, "Recording has ended.");
+
+  let markers = TimelineController.getMarkers();
+  let selection = TimelineView.overview.getSelection();
+
+  is((selection.start) | 0,
+     (markers[0].start * TimelineView.overview.dataScaleX) | 0,
+    "The initial selection start is correct.");
+
+  is((selection.end - selection.start) | 0,
+     (selectionRatio * TimelineView.overview.width) | 0,
+    "The initial selection end is correct.");
+
+  yield teardown(panel);
+  finish();
+});

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/test/browser_timeline_overview-initial-selection-02.js
@@ -0,0 +1,32 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+/**
+ * Tests if the overview has no initial selection when recording has finished
+ * and there is no data available.
+ */
+
+let test = Task.async(function*() {
+  let [target, debuggee, panel] = yield initTimelinePanel(SIMPLE_URL);
+  let { EVENTS, TimelineView, TimelineController } = panel.panelWin;
+  let { OVERVIEW_INITIAL_SELECTION_RATIO: selectionRatio } = panel.panelWin;
+
+  yield TimelineController.toggleRecording();
+  ok(true, "Recording has started.");
+
+  yield TimelineController._stopRecordingAndDiscardData();
+  ok(true, "Recording has ended.");
+
+  let markers = TimelineController.getMarkers();
+  let selection = TimelineView.overview.getSelection();
+
+  is(markers.length, 0,
+    "There are no markers available.");
+  is(selection.start, null,
+    "The initial selection start is correct.");
+  is(selection.end, null,
+    "The initial selection end is correct.");
+
+  yield teardown(panel);
+  finish();
+});

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/test/browser_timeline_overview-update.js
@@ -0,0 +1,48 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+/**
+ * Tests if the overview graph is continuously updated.
+ */
+
+let test = Task.async(function*() {
+  let [target, debuggee, panel] = yield initTimelinePanel("about:blank");
+  let { EVENTS, TimelineView, TimelineController } = panel.panelWin;
+
+  yield DevToolsUtils.waitForTime(1000);
+  yield TimelineController.toggleRecording();
+  ok(true, "Recording has started.");
+
+  ok("selectionEnabled" in TimelineView.overview,
+    "The selection should not be enabled for the overview graph (1).");
+  is(TimelineView.overview.selectionEnabled, false,
+    "The selection should not be enabled for the overview graph (2).");
+  is(TimelineView.overview.hasSelection(), false,
+    "The overview graph shouldn't have a selection before recording.");
+
+  let updated = 0;
+  panel.panelWin.on(EVENTS.OVERVIEW_UPDATED, () => updated++);
+
+  ok((yield waitUntil(() => updated > 10)),
+    "The overview graph was updated a bunch of times.");
+
+  ok("selectionEnabled" in TimelineView.overview,
+    "The selection should still not be enabled for the overview graph (3).");
+  is(TimelineView.overview.selectionEnabled, false,
+    "The selection should still not be enabled for the overview graph (4).");
+  is(TimelineView.overview.hasSelection(), false,
+    "The overview graph should not have a selection while recording.");
+
+  yield TimelineController.toggleRecording();
+  ok(true, "Recording has ended.");
+
+  is(TimelineController.getMarkers().length, 0,
+    "There are no markers available.");
+  is(TimelineView.overview.selectionEnabled, true,
+    "The selection should now be enabled for the overview graph.");
+  is(TimelineView.overview.hasSelection(), false,
+    "The overview graph should not have a selection after recording.");
+
+  yield teardown(panel);
+  finish();
+});

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/test/browser_timeline_panels.js
@@ -0,0 +1,42 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+/**
+ * Tests if the timeline panels are correctly shown and hidden when
+ * recording starts and stops.
+ */
+
+let test = Task.async(function*() {
+  let [target, debuggee, panel] = yield initTimelinePanel(SIMPLE_URL);
+  let { $, EVENTS } = panel.panelWin;
+
+  is($("#record-button").hasAttribute("checked"), false,
+    "The record button should not be checked yet.");
+  is($("#timeline-pane").selectedPanel, $("#empty-notice"),
+    "An empty notice is initially displayed instead of the waterfall view.");
+
+  let whenRecStarted = panel.panelWin.once(EVENTS.RECORDING_STARTED);
+  EventUtils.synthesizeMouseAtCenter($("#record-button"), {}, panel.panelWin);
+  yield whenRecStarted;
+
+  ok(true, "Recording has started.");
+
+  is($("#record-button").getAttribute("checked"), "true",
+    "The record button should be checked now.");
+  is($("#timeline-pane").selectedPanel, $("#recording-notice"),
+    "A recording notice is now displayed instead of the waterfall view.");
+
+  let whenRecEnded = panel.panelWin.once(EVENTS.RECORDING_ENDED);
+  EventUtils.synthesizeMouseAtCenter($("#record-button"), {}, panel.panelWin);
+  yield whenRecEnded;
+
+  ok(true, "Recording has ended.");
+
+  is($("#record-button").hasAttribute("checked"), false,
+    "The record button should be unchecked again.");
+  is($("#timeline-pane").selectedPanel, $("#timeline-waterfall"),
+    "A waterfall view is now displayed.");
+
+  yield teardown(panel);
+  finish();
+});

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/test/browser_timeline_recording.js
@@ -0,0 +1,34 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+/**
+ * Tests if the timeline can properly start and stop a recording.
+ */
+
+let test = Task.async(function*() {
+  let [target, debuggee, panel] = yield initTimelinePanel(SIMPLE_URL);
+  let { gFront, TimelineController } = panel.panelWin;
+
+  is((yield gFront.isRecording()), false,
+    "The timeline actor should not be recording when the tool starts.");
+  is(TimelineController.getMarkers().length, 0,
+    "There should be no markers available when the tool starts.");
+
+  yield TimelineController.toggleRecording();
+
+  is((yield gFront.isRecording()), true,
+    "The timeline actor should be recording now.");
+  ok((yield waitUntil(() => TimelineController.getMarkers().length > 0)),
+    "There are some markers available now.");
+
+  ok("startTime" in TimelineController.getMarkers(),
+    "A `startTime` field was set on the markers array.");
+  ok("endTime" in TimelineController.getMarkers(),
+    "An `endTime` field was set on the markers array.");
+  ok(TimelineController.getMarkers().endTime >
+     TimelineController.getMarkers().startTime,
+    "Some time has passed since the recording started.");
+
+  yield teardown(panel);
+  finish();
+});

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/test/browser_timeline_waterfall-background.js
@@ -0,0 +1,47 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+/**
+ * Tests if the waterfall background is a 1px high canvas stretching across
+ * the container bounds.
+ */
+
+let test = Task.async(function*() {
+  let [target, debuggee, panel] = yield initTimelinePanel(SIMPLE_URL);
+  let { $, EVENTS, TimelineView, TimelineController } = panel.panelWin;
+
+  yield TimelineController.toggleRecording();
+  ok(true, "Recording has started.");
+
+  let updated = 0;
+  panel.panelWin.on(EVENTS.OVERVIEW_UPDATED, () => updated++);
+
+  ok((yield waitUntil(() => updated > 0)),
+    "The overview graph was updated a bunch of times.");
+  ok((yield waitUntil(() => TimelineController.getMarkers().length > 0)),
+    "There are some markers available.");
+
+  yield TimelineController.toggleRecording();
+  ok(true, "Recording has ended.");
+
+  // Test the waterfall background.
+
+  let parentWidth = $("#timeline-waterfall").getBoundingClientRect().width;
+  let waterfallWidth = TimelineView.waterfall._waterfallWidth;
+  let sidebarWidth = 150; // px
+  is(waterfallWidth, parentWidth - sidebarWidth,
+    "The waterfall width is correct.")
+
+  ok(TimelineView.waterfall._canvas,
+    "A canvas should be created after the recording ended.");
+  ok(TimelineView.waterfall._ctx,
+    "A 2d context should be created after the recording ended.");
+
+  is(TimelineView.waterfall._canvas.width, waterfallWidth,
+    "The canvas width is correct.");
+  is(TimelineView.waterfall._canvas.height, 1,
+    "The canvas height is correct.");
+
+  yield teardown(panel);
+  finish();
+});

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/test/browser_timeline_waterfall-generic.js
@@ -0,0 +1,68 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+/**
+ * Tests if the waterfall is properly built after finishing a recording.
+ */
+
+let test = Task.async(function*() {
+  let [target, debuggee, panel] = yield initTimelinePanel(SIMPLE_URL);
+  let { $, $$, EVENTS, TimelineController } = panel.panelWin;
+
+  yield TimelineController.toggleRecording();
+  ok(true, "Recording has started.");
+
+  let updated = 0;
+  panel.panelWin.on(EVENTS.OVERVIEW_UPDATED, () => updated++);
+
+  ok((yield waitUntil(() => updated > 0)),
+    "The overview graph was updated a bunch of times.");
+  ok((yield waitUntil(() => TimelineController.getMarkers().length > 0)),
+    "There are some markers available.");
+
+  yield TimelineController.toggleRecording();
+  ok(true, "Recording has ended.");
+
+  // Test the header container.
+
+  ok($(".timeline-header-container"),
+    "A header container should have been created.");
+
+  // Test the header sidebar (left).
+
+  ok($(".timeline-header-sidebar"),
+    "A header sidebar node should have been created.");
+  ok($(".timeline-header-sidebar > .timeline-header-name"),
+    "A header name label should have been created inside the sidebar.");
+
+  // Test the header ticks (right).
+
+  ok($(".timeline-header-ticks"),
+    "A header ticks node should have been created.");
+  ok($$(".timeline-header-ticks > .timeline-header-tick").length > 0,
+    "Some header tick labels should have been created inside the tick node.");
+
+  // Test the markers container.
+
+  ok($(".timeline-marker-container"),
+    "A marker container should have been created.");
+
+  // Test the markers sidebar (left).
+
+  ok($$(".timeline-marker-sidebar").length,
+    "Some marker sidebar nodes should have been created.");
+  ok($$(".timeline-marker-sidebar > .timeline-marker-bullet").length,
+    "Some marker color bullets should have been created inside the sidebar.");
+  ok($$(".timeline-marker-sidebar > .timeline-marker-name").length,
+    "Some marker name labels should have been created inside the sidebar.");
+
+  // Test the markers waterfall (right).
+
+  ok($$(".timeline-marker-waterfall").length,
+    "Some marker waterfall nodes should have been created.");
+  ok($$(".timeline-marker-waterfall > .timeline-marker-bar").length,
+    "Some marker color bars should have been created inside the waterfall.");
+
+  yield teardown(panel);
+  finish();
+});

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/test/browser_timeline_waterfall-styles.js
@@ -0,0 +1,89 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+/**
+ * Tests if the waterfall is properly built after making a selection
+ * and the child nodes are styled correctly.
+ */
+
+var gRGB_TO_HSL = {
+ "rgb(193, 132, 214)": "hsl(285,50%,68%)",
+ "rgb(152, 61, 183)": "hsl(285,50%,48%)",
+ "rgb(161, 223, 138)": "hsl(104,57%,71%)",
+ "rgb(96, 201, 58)": "hsl(104,57%,51%)",
+ "rgb(240, 195, 111)": "hsl(39,82%,69%)",
+ "rgb(227, 155, 22)": "hsl(39,82%,49%)",
+};
+
+let test = Task.async(function*() {
+  let [target, debuggee, panel] = yield initTimelinePanel(SIMPLE_URL);
+  let { TIMELINE_BLUEPRINT } = devtools.require("devtools/timeline/global");
+  let { $, $$, EVENTS, TimelineController } = panel.panelWin;
+
+  yield TimelineController.toggleRecording();
+  ok(true, "Recording has started.");
+
+  let updated = 0;
+  panel.panelWin.on(EVENTS.OVERVIEW_UPDATED, () => updated++);
+
+  ok((yield waitUntil(() => updated > 0)),
+    "The overview graph was updated a bunch of times.");
+  ok((yield waitUntil(() => TimelineController.getMarkers().length > 0)),
+    "There are some markers available.");
+
+  yield TimelineController.toggleRecording();
+  ok(true, "Recording has ended.");
+
+  // Test the table sidebars.
+
+  for (let sidebar of [
+    ...$$(".timeline-header-sidebar"),
+    ...$$(".timeline-marker-sidebar")
+  ]) {
+    is(sidebar.getAttribute("width"), "150",
+      "The table's sidebar width is correct.");
+  }
+
+  // Test the table ticks.
+
+  for (let tick of $$(".timeline-header-tick")) {
+    ok(tick.getAttribute("value").match(/^\d+ ms$/),
+      "The table's timeline ticks appear to have correct labels.");
+    ok(tick.style.transform.match(/^translateX\(.*px\)$/),
+      "The table's timeline ticks appear to have proper translations.");
+  }
+
+  // Test the marker bullets.
+
+  for (let bullet of $$(".timeline-marker-bullet")) {
+    let type = bullet.getAttribute("type");
+
+    ok(type in TIMELINE_BLUEPRINT,
+      "The bullet type is present in the timeline blueprint.");
+    is(gRGB_TO_HSL[bullet.style.backgroundColor], TIMELINE_BLUEPRINT[type].fill,
+      "The bullet's background color is correct.");
+    is(gRGB_TO_HSL[bullet.style.borderColor], TIMELINE_BLUEPRINT[type].stroke,
+      "The bullet's border color is correct.");
+  }
+
+  // Test the marker bars.
+
+  for (let bar of $$(".timeline-marker-bar")) {
+    let type = bar.getAttribute("type");
+
+    ok(type in TIMELINE_BLUEPRINT,
+      "The bar type is present in the timeline blueprint.");
+    is(gRGB_TO_HSL[bar.style.backgroundColor], TIMELINE_BLUEPRINT[type].fill,
+      "The bar's background color is correct.");
+    is(gRGB_TO_HSL[bar.style.borderColor], TIMELINE_BLUEPRINT[type].stroke,
+      "The bar's border color is correct.");
+
+    ok(bar.getAttribute("width") > 0,
+      "The bar appears to have a proper width.");
+    ok(bar.style.transform.match(/^translateX\(.*px\)$/),
+      "The bar appears to have proper translations.");
+  }
+
+  yield teardown(panel);
+  finish();
+});

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/test/doc_simple-test.html
@@ -0,0 +1,26 @@
+<!-- Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/ -->
+<!doctype html>
+
+<html>
+  <head>
+    <meta charset="utf-8"/>
+    <title>Timeline test page</title>
+  </head>
+
+  <body>
+    <script type="text/javascript">
+      function test() {
+        var a = "Hello world!";
+        document.body.style.backgroundColor = "rgba(" +
+          ((Math.random() * 64)|0) + "," +
+          ((Math.random() * 16)|0) + "," +
+          ((Math.random() * 16)|0) + ",1)";
+      }
+
+      // Prevent this script from being garbage collected.
+      window.setInterval(test, 1);
+    </script>
+  </body>
+
+</html>

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/test/head.js
@@ -0,0 +1,133 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+"use strict";
+
+const { classes: Cc, interfaces: Ci, utils: Cu, results: Cr } = Components;
+
+let { Services } = Cu.import("resource://gre/modules/Services.jsm", {});
+
+// Disable logging for all the tests. Both the debugger server and frontend will
+// be affected by this pref.
+let gEnableLogging = Services.prefs.getBoolPref("devtools.debugger.log");
+Services.prefs.setBoolPref("devtools.debugger.log", false);
+
+// Enable the tool while testing.
+let gToolEnabled = Services.prefs.getBoolPref("devtools.timeline.enabled");
+Services.prefs.setBoolPref("devtools.timeline.enabled", true);
+
+let { Task } = Cu.import("resource://gre/modules/Task.jsm", {});
+let { Promise: promise } = Cu.import("resource://gre/modules/Promise.jsm", {});
+let { DevToolsUtils } = Cu.import("resource://gre/modules/devtools/DevToolsUtils.jsm", {});
+let { gDevTools } = Cu.import("resource:///modules/devtools/gDevTools.jsm", {});
+let { devtools } = Cu.import("resource://gre/modules/devtools/Loader.jsm", {});
+
+let TargetFactory = devtools.TargetFactory;
+let Toolbox = devtools.Toolbox;
+
+const EXAMPLE_URL = "http://example.com/browser/browser/devtools/timeline/test/";
+const SIMPLE_URL = EXAMPLE_URL + "doc_simple-test.html";
+
+// All tests are asynchronous.
+waitForExplicitFinish();
+
+registerCleanupFunction(() => {
+  info("finish() was called, cleaning up...");
+  Services.prefs.setBoolPref("devtools.debugger.log", gEnableLogging);
+  Services.prefs.setBoolPref("devtools.timeline.enabled", gToolEnabled);
+});
+
+function addTab(url) {
+  info("Adding tab: " + url);
+
+  let deferred = promise.defer();
+  let tab = gBrowser.selectedTab = gBrowser.addTab(url);
+  let linkedBrowser = tab.linkedBrowser;
+
+  linkedBrowser.addEventListener("load", function onLoad() {
+    linkedBrowser.removeEventListener("load", onLoad, true);
+    info("Tab added and finished loading: " + url);
+    deferred.resolve(tab);
+  }, true);
+
+  return deferred.promise;
+}
+
+function removeTab(tab) {
+  info("Removing tab.");
+
+  let deferred = promise.defer();
+  let tabContainer = gBrowser.tabContainer;
+
+  tabContainer.addEventListener("TabClose", function onClose(aEvent) {
+    tabContainer.removeEventListener("TabClose", onClose, false);
+    info("Tab removed and finished closing.");
+    deferred.resolve();
+  }, false);
+
+  gBrowser.removeTab(tab);
+  return deferred.promise;
+}
+
+/**
+ * Spawns a new tab and starts up a toolbox with the timeline panel
+ * automatically selected.
+ *
+ * Must be used within a task.
+ *
+ * @param string url
+ *        The location of the new tab to spawn.
+ * @return object
+ *         A promise resolved once the timeline is initialized, with the
+ *         [target, debuggee, panel] instances.
+ */
+function* initTimelinePanel(url) {
+  info("Initializing a timeline pane.");
+
+  let tab = yield addTab(url);
+  let target = TargetFactory.forTab(tab);
+  let debuggee = target.window.wrappedJSObject;
+
+  yield target.makeRemote();
+
+  let toolbox = yield gDevTools.showToolbox(target, "timeline");
+  let panel = toolbox.getCurrentPanel();
+  return [target, debuggee, panel];
+}
+
+/**
+ * Closes a tab and destroys the toolbox holding a timeline panel.
+ *
+ * Must be used within a task.
+ *
+ * @param object panel
+ *        The timeline panel, created by the toolbox.
+ * @return object
+ *         A promise resolved once the timeline, toolbox and debuggee tab
+ *         are destroyed.
+ */
+function* teardown(panel) {
+  info("Destroying the specified timeline.");
+
+  let tab = panel.target.tab;
+  yield panel._toolbox.destroy();
+  yield removeTab(tab);
+}
+
+/**
+ * Waits until a predicate returns true.
+ *
+ * @param function predicate
+ *        Invoked once in a while until it returns true.
+ * @param number interval [optional]
+ *        How often the predicate is invoked, in milliseconds.
+ */
+function waitUntil(predicate, interval = 10) {
+  if (predicate()) {
+    return promise.resolve(true);
+  }
+  let deferred = promise.defer();
+  setTimeout(function() {
+    waitUntil(predicate).then(() => deferred.resolve(true));
+  }, interval);
+  return deferred.promise;
+}

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/timeline.js
@@ -0,0 +1,281 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this file,
+ * You can obtain one at http://mozilla.org/MPL/2.0/. */
+"use strict";
+
+const { classes: Cc, interfaces: Ci, utils: Cu, results: Cr } = Components;
+
+Cu.import("resource://gre/modules/Task.jsm");
+Cu.import("resource://gre/modules/devtools/Loader.jsm");
+
+devtools.lazyRequireGetter(this, "promise");
+devtools.lazyRequireGetter(this, "EventEmitter",
+  "devtools/toolkit/event-emitter");
+
+devtools.lazyRequireGetter(this, "Overview",
+  "devtools/timeline/overview", true);
+devtools.lazyRequireGetter(this, "Waterfall",
+  "devtools/timeline/waterfall", true);
+
+devtools.lazyImporter(this, "PluralForm",
+  "resource://gre/modules/PluralForm.jsm");
+
+const OVERVIEW_UPDATE_INTERVAL = 200;
+const OVERVIEW_INITIAL_SELECTION_RATIO = 0.15;
+
+// The panel's window global is an EventEmitter firing the following events:
+const EVENTS = {
+  // When a recording is started or stopped, via the `stopwatch` button.
+  RECORDING_STARTED: "Timeline:RecordingStarted",
+  RECORDING_ENDED: "Timeline:RecordingEnded",
+
+  // When the overview graph is populated with new markers.
+  OVERVIEW_UPDATED: "Timeline:OverviewUpdated",
+
+  // When the waterfall view is populated with new markers.
+  WATERFALL_UPDATED: "Timeline:WaterfallUpdated"
+};
+
+/**
+ * The current target and the timeline front, set by this tool's host.
+ */
+let gToolbox, gTarget, gFront;
+
+/**
+ * Initializes the timeline controller and views.
+ */
+let startupTimeline = Task.async(function*() {
+  yield TimelineView.initialize();
+  yield TimelineController.initialize();
+});
+
+/**
+ * Destroys the timeline controller and views.
+ */
+let shutdownTimeline = Task.async(function*() {
+  yield TimelineView.destroy();
+  yield TimelineController.destroy();
+  yield gFront.stop();
+});
+
+/**
+ * Functions handling the timeline frontend controller.
+ */
+let TimelineController = {
+  /**
+   * Permanent storage for the markers streamed by the backend.
+   */
+  _markers: [],
+
+  /**
+   * Initialization function, called when the tool is started.
+   */
+  initialize: function() {
+    this._onRecordingTick = this._onRecordingTick.bind(this);
+    this._onMarkers = this._onMarkers.bind(this);
+    gFront.on("markers", this._onMarkers);
+  },
+
+  /**
+   * Destruction function, called when the tool is closed.
+   */
+  destroy: function() {
+    gFront.off("markers", this._onMarkers);
+  },
+
+  /**
+   * Gets the accumulated markers in this recording.
+   * @return array.
+   */
+  getMarkers: function() {
+    return this._markers;
+  },
+
+  /**
+   * Starts/stops the timeline recording and streaming.
+   */
+  toggleRecording: Task.async(function*() {
+    let isRecording = yield gFront.isRecording();
+    if (isRecording == false) {
+      yield this._startRecording();
+    } else {
+      yield this._stopRecording();
+    }
+  }),
+
+  /**
+   * Starts the recording, updating the UI as needed.
+   */
+  _startRecording: function*() {
+    this._markers = [];
+    this._markers.startTime = performance.now();
+    this._markers.endTime = performance.now();
+    this._updateId = setInterval(this._onRecordingTick, OVERVIEW_UPDATE_INTERVAL);
+
+    TimelineView.handleRecordingStarted();
+    yield gFront.start();
+  },
+
+  /**
+   * Stops the recording, updating the UI as needed.
+   */
+  _stopRecording: function*() {
+    clearInterval(this._updateId);
+
+    TimelineView.handleMarkersUpdate(this._markers);
+    TimelineView.handleRecordingEnded();
+    yield gFront.stop();
+  },
+
+  /**
+   * Used in tests. Stops the recording, discarding the accumulated markers and
+   * updating the UI as needed.
+   */
+  _stopRecordingAndDiscardData: function*() {
+    this._markers.length = 0;
+    yield this._stopRecording();
+  },
+
+  /**
+   * Callback handling the "markers" event on the timeline front.
+   *
+   * @param array markers
+   *        A list of new markers collected since the last time this
+   *        function was invoked.
+   */
+  _onMarkers: function(markers) {
+    Array.prototype.push.apply(this._markers, markers);
+  },
+
+  /**
+   * Callback invoked at a fixed interval while recording.
+   * Updates the markers store with the current time and the timeline overview.
+   */
+  _onRecordingTick: function() {
+    this._markers.endTime = performance.now();
+    TimelineView.handleMarkersUpdate(this._markers);
+  }
+};
+
+/**
+ * Functions handling the timeline frontend view.
+ */
+let TimelineView = {
+  /**
+   * Initialization function, called when the tool is started.
+   */
+  initialize: Task.async(function*() {
+    this.overview = new Overview($("#timeline-overview"));
+    this.waterfall = new Waterfall($("#timeline-waterfall"));
+
+    this._onSelecting = this._onSelecting.bind(this);
+    this._onRefresh = this._onRefresh.bind(this);
+    this.overview.on("selecting", this._onSelecting);
+    this.overview.on("refresh", this._onRefresh);
+
+    yield this.overview.ready();
+    yield this.waterfall.recalculateBounds();
+  }),
+
+  /**
+   * Destruction function, called when the tool is closed.
+   */
+  destroy: function() {
+    this.overview.off("selecting", this._onSelecting);
+    this.overview.off("refresh", this._onRefresh);
+    this.overview.destroy();
+  },
+
+  /**
+   * Signals that a recording session has started and triggers the appropriate
+   * changes in the UI.
+   */
+  handleRecordingStarted: function() {
+    $("#record-button").setAttribute("checked", "true");
+    $("#timeline-pane").selectedPanel = $("#recording-notice");
+
+    this.overview.selectionEnabled = false;
+    this.overview.dropSelection();
+    this.overview.setData([]);
+    this.waterfall.clearView();
+
+    window.emit(EVENTS.RECORDING_STARTED);
+  },
+
+  /**
+   * Signals that a recording session has ended and triggers the appropriate
+   * changes in the UI.
+   */
+  handleRecordingEnded: function() {
+    $("#record-button").removeAttribute("checked");
+    $("#timeline-pane").selectedPanel = $("#timeline-waterfall");
+
+    this.overview.selectionEnabled = true;
+
+    let markers = TimelineController.getMarkers();
+    if (markers.length) {
+      let start = markers[0].start * this.overview.dataScaleX;
+      let end = start + this.overview.width * OVERVIEW_INITIAL_SELECTION_RATIO;
+      this.overview.setSelection({ start, end });
+    } else {
+      let duration = markers.endTime - markers.startTime;
+      this.waterfall.setData(markers, 0, duration);
+    }
+
+    window.emit(EVENTS.RECORDING_ENDED);
+  },
+
+  /**
+   * Signals that a new set of markers was made available by the controller,
+   * or that the overview graph needs to be updated.
+   *
+   * @param array markers
+   *        A list of new markers collected since the recording has started.
+   */
+  handleMarkersUpdate: function(markers) {
+    this.overview.setData(markers);
+    window.emit(EVENTS.OVERVIEW_UPDATED);
+  },
+
+  /**
+   * Callback handling the "selecting" event on the timeline overview.
+   */
+  _onSelecting: function() {
+    if (!this.overview.hasSelection() &&
+        !this.overview.hasSelectionInProgress()) {
+      this.waterfall.clearView();
+      return;
+    }
+    let selection = this.overview.getSelection();
+    let start = selection.start / this.overview.dataScaleX;
+    let end = selection.end / this.overview.dataScaleX;
+
+    let markers = TimelineController.getMarkers();
+    let timeStart = Math.min(start, end);
+    let timeEnd = Math.max(start, end);
+    this.waterfall.setData(markers, timeStart, timeEnd);
+  },
+
+  /**
+   * Callback handling the "refresh" event on the timeline overview.
+   */
+  _onRefresh: function() {
+    this.waterfall.recalculateBounds();
+    this._onSelecting();
+  }
+};
+
+/**
+ * Convenient way of emitting events from the panel window.
+ */
+EventEmitter.decorate(this);
+
+/**
+ * DOM query helpers.
+ */
+function $(selector, target = document) {
+  return target.querySelector(selector);
+}
+function $$(selector, target = document) {
+  return target.querySelectorAll(selector);
+}

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/timeline.xul
@@ -0,0 +1,68 @@
+<?xml version="1.0"?>
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<?xml-stylesheet href="chrome://browser/skin/" type="text/css"?>
+<?xml-stylesheet href="chrome://browser/content/devtools/widgets.css" type="text/css"?>
+<?xml-stylesheet href="chrome://browser/skin/devtools/common.css" type="text/css"?>
+<?xml-stylesheet href="chrome://browser/skin/devtools/timeline.css" type="text/css"?>
+<!DOCTYPE window [
+  <!ENTITY % timelineDTD SYSTEM "chrome://browser/locale/devtools/timeline.dtd">
+  %timelineDTD;
+]>
+
+<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
+  <script src="chrome://browser/content/devtools/theme-switching.js"/>
+  <script type="application/javascript" src="timeline.js"/>
+
+  <vbox class="theme-body" flex="1">
+    <toolbar id="timeline-toolbar"
+             class="devtools-toolbar">
+      <hbox id="recordings-controls"
+            class="devtools-toolbarbutton-group"
+            align="center">
+        <toolbarbutton id="record-button"
+                       class="devtools-toolbarbutton"
+                       oncommand="TimelineController.toggleRecording()"
+                       tooltiptext="&timelineUI.recordButton.tooltip;"/>
+        <spacer flex="1"/>
+        <label id="record-label"
+               value="&timelineUI.recordLabel;"/>
+      </hbox>
+    </toolbar>
+
+    <vbox id="timeline-overview"/>
+
+    <deck id="timeline-pane"
+          flex="1">
+      <hbox id="empty-notice"
+            class="notice-container"
+            align="center"
+            pack="center"
+            flex="1">
+        <label value="&timelineUI.emptyNotice1;"/>
+        <button id="profiling-notice-button"
+                class="devtools-toolbarbutton"
+                standalone="true"
+                oncommand="TimelineController.toggleRecording()"/>
+        <label value="&timelineUI.emptyNotice2;"/>
+      </hbox>
+
+      <hbox id="recording-notice"
+            class="notice-container"
+            align="center"
+            pack="center"
+            flex="1">
+        <label value="&timelineUI.stopNotice1;"/>
+        <button id="profiling-notice-button"
+                class="devtools-toolbarbutton"
+                standalone="true"
+                checked="true"
+                oncommand="TimelineController.toggleRecording()"/>
+        <label value="&timelineUI.stopNotice2;"/>
+      </hbox>
+
+      <vbox id="timeline-waterfall" flex="1"/>
+    </deck>
+  </vbox>
+</window>

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/widgets/global.js
@@ -0,0 +1,51 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+"use strict";
+
+const {Cc, Ci, Cu, Cr} = require("chrome");
+
+Cu.import("resource:///modules/devtools/ViewHelpers.jsm");
+
+/**
+ * Localization convenience methods.
+ */
+const STRINGS_URI = "chrome://browser/locale/devtools/timeline.properties";
+const L10N = new ViewHelpers.L10N(STRINGS_URI);
+
+/**
+ * A simple schema for mapping markers to the timeline UI. The keys correspond
+ * to marker names, while the values are objects with the following format:
+ *   - group: the row index in the timeline overview graph; multiple markers
+ *            can be added on the same row. @see <overview.js/buildGraphImage>
+ *   - fill: a fill color used when drawing the marker
+ *   - stroke: a stroke color used when drawing the marker
+ *   - label: the label used in the waterfall to identify the marker
+ *
+ * Whenever this is changed, browser_timeline_waterfall-styles.js *must* be
+ * updated as well.
+ */
+const TIMELINE_BLUEPRINT = {
+  "Styles": {
+    group: 0,
+    fill: "hsl(285,50%,68%)",
+    stroke: "hsl(285,50%,48%)",
+    label: L10N.getStr("timeline.label.styles")
+  },
+  "Reflow": {
+    group: 2,
+    fill: "hsl(104,57%,71%)",
+    stroke: "hsl(104,57%,51%)",
+    label: L10N.getStr("timeline.label.reflow")
+  },
+  "Paint": {
+    group: 1,
+    fill: "hsl(39,82%,69%)",
+    stroke: "hsl(39,82%,49%)",
+    label: L10N.getStr("timeline.label.paint")
+  }
+};
+
+// Exported symbols.
+exports.L10N = L10N;
+exports.TIMELINE_BLUEPRINT = TIMELINE_BLUEPRINT;

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/widgets/overview.js
@@ -0,0 +1,208 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this file,
+ * You can obtain one at http://mozilla.org/MPL/2.0/. */
+"use strict";
+
+/**
+ * This file contains the "overview" graph, which is a minimap of all the
+ * timeline data. Regions inside it may be selected, determining which markers
+ * are visible in the "waterfall".
+ */
+
+const {Cc, Ci, Cu, Cr} = require("chrome");
+
+Cu.import("resource:///modules/devtools/Graphs.jsm");
+Cu.import("resource:///modules/devtools/ViewHelpers.jsm");
+
+loader.lazyRequireGetter(this, "L10N",
+  "devtools/timeline/global", true);
+loader.lazyRequireGetter(this, "TIMELINE_BLUEPRINT",
+  "devtools/timeline/global", true);
+
+const HTML_NS = "http://www.w3.org/1999/xhtml";
+
+const OVERVIEW_HEADER_HEIGHT = 20; // px
+const OVERVIEW_BODY_HEIGHT = 50; // px
+
+const OVERVIEW_BACKGROUND_COLOR = "#fff";
+const OVERVIEW_CLIPHEAD_LINE_COLOR = "#666";
+const OVERVIEW_SELECTION_LINE_COLOR = "#555";
+const OVERVIEW_SELECTION_BACKGROUND_COLOR = "rgba(76,158,217,0.25)";
+const OVERVIEW_SELECTION_STRIPES_COLOR = "rgba(255,255,255,0.1)";
+
+const OVERVIEW_HEADER_TICKS_MULTIPLE = 100; // ms
+const OVERVIEW_HEADER_TICKS_SPACING_MIN = 75; // px
+const OVERVIEW_HEADER_SAFE_BOUNDS = 50; // px
+const OVERVIEW_HEADER_BACKGROUND = "#ebeced";
+const OVERVIEW_HEADER_TEXT_COLOR = "#18191a";
+const OVERVIEW_HEADER_TEXT_FONT_SIZE = 9; // px
+const OVERVIEW_HEADER_TEXT_FONT_FAMILY = "sans-serif";
+const OVERVIEW_HEADER_TEXT_PADDING = 6; // px
+const OVERVIEW_TIMELINE_STROKES = "#aaa";
+const OVERVIEW_MARKERS_COLOR_STOPS = [0, 0.1, 0.75, 1];
+const OVERVIEW_MARKER_DURATION_MIN = 4; // ms
+const OVERVIEW_GROUP_VERTICAL_PADDING = 6; // px
+const OVERVIEW_GROUP_ALTERNATING_BACKGROUND = "rgba(0,0,0,0.05)";
+
+/**
+ * An overview for the timeline data.
+ *
+ * @param nsIDOMNode parent
+ *        The parent node holding the overview.
+ */
+function Overview(parent, ...args) {
+  AbstractCanvasGraph.apply(this, [parent, "timeline-overview", ...args]);
+  this.once("ready", () => {
+    this.setBlueprint(TIMELINE_BLUEPRINT);
+
+    var preview = [];
+    preview.startTime = 0;
+    preview.endTime = 1000;
+    this.setData(preview);
+  });
+}
+
+Overview.prototype = Heritage.extend(AbstractCanvasGraph.prototype, {
+  fixedHeight: OVERVIEW_HEADER_HEIGHT + OVERVIEW_BODY_HEIGHT,
+  clipheadLineColor: OVERVIEW_CLIPHEAD_LINE_COLOR,
+  selectionLineColor: OVERVIEW_SELECTION_LINE_COLOR,
+  selectionBackgroundColor: OVERVIEW_SELECTION_BACKGROUND_COLOR,
+  selectionStripesColor: OVERVIEW_SELECTION_STRIPES_COLOR,
+
+  /**
+   * List of names and colors used to paint this overview.
+   * @see TIMELINE_BLUEPRINT in timeline/widgets/global.js
+   */
+  setBlueprint: function(blueprint) {
+    this._paintBatches = new Map();
+    this._lastGroup = 0;
+
+    for (let type in blueprint) {
+      this._paintBatches.set(type, { style: blueprint[type], batch: [] });
+      this._lastGroup = Math.max(this._lastGroup, blueprint[type].group);
+    }
+  },
+
+  /**
+   * Renders the graph's data source.
+   * @see AbstractCanvasGraph.prototype.buildGraphImage
+   */
+  buildGraphImage: function() {
+    let { canvas, ctx } = this._getNamedCanvas("overview-data");
+    let canvasWidth = this._width;
+    let canvasHeight = this._height;
+    let safeBounds = OVERVIEW_HEADER_SAFE_BOUNDS * this._pixelRatio;
+    let availableWidth = canvasWidth - safeBounds;
+
+    // Group markers into separate paint batches. This is necessary to
+    // draw all markers sharing the same style at once.
+
+    for (let marker of this._data) {
+      this._paintBatches.get(marker.name).batch.push(marker);
+    }
+
+    // Calculate each group's height, and the time-based scaling.
+
+    let totalGroups = this._lastGroup + 1;
+    let headerHeight = OVERVIEW_HEADER_HEIGHT * this._pixelRatio;
+    let groupHeight = OVERVIEW_BODY_HEIGHT * this._pixelRatio / totalGroups;
+    let groupPadding = OVERVIEW_GROUP_VERTICAL_PADDING * this._pixelRatio;
+
+    let totalTime = (this._data.endTime - this._data.startTime) || 0;
+    let dataScale = this.dataScaleX = availableWidth / totalTime;
+
+    // Draw the header and overview background.
+
+    ctx.fillStyle = OVERVIEW_HEADER_BACKGROUND;
+    ctx.fillRect(0, 0, canvasWidth, headerHeight);
+
+    ctx.fillStyle = OVERVIEW_BACKGROUND_COLOR;
+    ctx.fillRect(0, headerHeight, canvasWidth, canvasHeight);
+
+    // Draw the alternating odd/even group backgrounds.
+
+    ctx.fillStyle = OVERVIEW_GROUP_ALTERNATING_BACKGROUND;
+    ctx.beginPath();
+
+    for (let i = 1; i < totalGroups; i += 2) {
+      let top = headerHeight + i * groupHeight;
+      ctx.rect(0, top, canvasWidth, groupHeight);
+    }
+
+    ctx.fill();
+
+    // Draw the timeline header ticks.
+
+    ctx.textBaseline = "middle";
+    let fontSize = OVERVIEW_HEADER_TEXT_FONT_SIZE * this._pixelRatio;
+    let fontFamily = OVERVIEW_HEADER_TEXT_FONT_FAMILY;
+    ctx.font = fontSize + "px " + fontFamily;
+    ctx.fillStyle = OVERVIEW_HEADER_TEXT_COLOR;
+    ctx.strokeStyle = OVERVIEW_TIMELINE_STROKES;
+    ctx.beginPath();
+
+    let tickInterval = this._findOptimalTickInterval(dataScale);
+    let headerTextPadding = OVERVIEW_HEADER_TEXT_PADDING * this._pixelRatio;
+
+    for (let x = 0; x < availableWidth; x += tickInterval) {
+      let left = x + headerTextPadding;
+      let time = Math.round(x / dataScale);
+      let label = L10N.getFormatStr("timeline.tick", time);
+      ctx.fillText(label, left, headerHeight / 2 + 1);
+      ctx.moveTo(x, 0);
+      ctx.lineTo(x, canvasHeight);
+    }
+
+    ctx.stroke();
+
+    // Draw the timeline markers.
+
+    for (let [, { style, batch }] of this._paintBatches) {
+      let top = headerHeight + style.group * groupHeight + groupPadding / 2;
+      let height = groupHeight - groupPadding;
+
+      let gradient = ctx.createLinearGradient(0, top, 0, top + height);
+      gradient.addColorStop(OVERVIEW_MARKERS_COLOR_STOPS[0], style.stroke);
+      gradient.addColorStop(OVERVIEW_MARKERS_COLOR_STOPS[1], style.fill);
+      gradient.addColorStop(OVERVIEW_MARKERS_COLOR_STOPS[2], style.fill);
+      gradient.addColorStop(OVERVIEW_MARKERS_COLOR_STOPS[3], style.stroke);
+      ctx.fillStyle = gradient;
+      ctx.beginPath();
+
+      for (let { start, end } of batch) {
+        let left = start * dataScale;
+        let duration = Math.max(end - start, OVERVIEW_MARKER_DURATION_MIN);
+        let width = Math.max(duration * dataScale, this._pixelRatio);
+        ctx.rect(left, top, width, height);
+      }
+
+      ctx.fill();
+
+      // Since all the markers in this batch (thus sharing the same style) have
+      // been drawn, empty it. The next time new markers will be available,
+      // they will be sorted and drawn again.
+      batch.length = 0;
+    }
+
+    return canvas;
+  },
+
+  /**
+   * Finds the optimal tick interval between time markers in this overview.
+   */
+  _findOptimalTickInterval: function(dataScale) {
+    let timingStep = OVERVIEW_HEADER_TICKS_MULTIPLE;
+    let spacingMin = OVERVIEW_HEADER_TICKS_SPACING_MIN * this._pixelRatio;
+
+    while (true) {
+      let scaledStep = dataScale * timingStep;
+      if (scaledStep < spacingMin) {
+        timingStep <<= 1;
+        continue;
+      }
+      return scaledStep;
+    }
+  }
+});
+
+exports.Overview = Overview;

new file mode 100644
--- /dev/null
+++ b/browser/devtools/timeline/widgets/waterfall.js
@@ -0,0 +1,444 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this file,
+ * You can obtain one at http://mozilla.org/MPL/2.0/. */
+"use strict";
+
+/**
+ * This file contains the "waterfall" view, essentially a detailed list
+ * of all the markers in the timeline data.
+ */
+
+const {Cc, Ci, Cu, Cr} = require("chrome");
+
+loader.lazyRequireGetter(this, "L10N",
+  "devtools/timeline/global", true);
+loader.lazyRequireGetter(this, "TIMELINE_BLUEPRINT",
+  "devtools/timeline/global", true);
+
+loader.lazyImporter(this, "setNamedTimeout",
+  "resource:///modules/devtools/ViewHelpers.jsm");
+loader.lazyImporter(this, "clearNamedTimeout",
+  "resource:///modules/devtools/ViewHelpers.jsm");
+
+const HTML_NS = "http://www.w3.org/1999/xhtml";
+
+const TIMELINE_IMMEDIATE_DRAW_MARKERS_COUNT = 30;
+const TIMELINE_FLUSH_OUTSTANDING_MARKERS_DELAY = 75; // ms
+
+const TIMELINE_HEADER_TICKS_MULTIPLE = 5; // ms
+const TIMELINE_HEADER_TICKS_SPACING_MIN = 50; // px
+const TIMELINE_HEADER_TEXT_PADDING = 3; // px
+
+const TIMELINE_MARKER_SIDEBAR_WIDTH = 150; // px
+const TIMELINE_MARKER_BAR_WIDTH_MIN = 5; // px
+
+const WATERFALL_BACKGROUND_TICKS_MULTIPLE = 5; // ms
+const WATERFALL_BACKGROUND_TICKS_SCALES = 3;
+const WATERFALL_BACKGROUND_TICKS_SPACING_MIN = 10; // px
+const WATERFALL_BACKGROUND_TICKS_COLOR_RGB = [128, 136, 144];
+const WATERFALL_BACKGROUND_TICKS_OPACITY_MIN = 32; // byte
+const WATERFALL_BACKGROUND_TICKS_OPACITY_ADD = 32; // byte
+
+/**
+ * A detailed waterfall view for the timeline data.
+ *
+ * @param nsIDOMNode parent
+ *        The parent node holding the waterfall.
+ */
+function Waterfall(parent) {
+  this._parent = parent;
+  this._document = parent.ownerDocument;
+  this._fragment = this._document.createDocumentFragment();
+  this._outstandingMarkers = [];
+
+  this._headerContents = this._document.createElement("hbox");
+  this._headerContents.className = "timeline-header-contents";
+  this._parent.appendChild(this._headerContents);
+
+  this._listContents = this._document.createElement("vbox");
+  this._listContents.className = "timeline-list-contents";
+  this._listContents.setAttribute("flex", "1");
+  this._parent.appendChild(this._listContents);
+
+  this._isRTL = this._getRTL();
+
+  // Lazy require is a bit slow, and these are hot objects.
+  this._l10n = L10N;
+  this._blueprint = TIMELINE_BLUEPRINT;
+  this._setNamedTimeout = setNamedTimeout;
+  this._clearNamedTimeout = clearNamedTimeout;
+}
+
+Waterfall.prototype = {
+  /**
+   * Populates this view with the provided data source.
+   *
+   * @param array markers
+   *        A list of markers received from the controller.
+   * @param number timeStart
+   *        The delta time (in milliseconds) to start drawing from.
+   * @param number timeEnd
+   *        The delta time (in milliseconds) to end drawing at.
+   */
+  setData: function(markers, timeStart, timeEnd) {
+    this.clearView();
+
+    let dataScale = this._waterfallWidth / (timeEnd - timeStart);
+    this._drawWaterfallBackground(dataScale);
+    this._buildHeader(this._headerContents, timeStart, dataScale);
+    this._buildMarkers(this._listContents, markers, timeStart, timeEnd, dataScale);
+  },
+
+  /**
+   * Depopulates this view.
+   */
+  clearView: function() {
+    while (this._headerContents.hasChildNodes()) {
+      this._headerContents.firstChild.remove();
+    }
+    while (this._listContents.hasChildNodes()) {
+      this._listContents.firstChild.remove();
+    }
+    this._listContents.scrollTop = 0;
+    this._outstandingMarkers.length = 0;
+    this._clearNamedTimeout("flush-outstanding-markers");
+  },
+
+  /**
+   * Calculates and stores the available width for the waterfall.
+   * This should be invoked every time the container window is resized.
+   */
+  recalculateBounds: function() {
+    let bounds = this._parent.getBoundingClientRect();
+    this._waterfallWidth = bounds.width - TIMELINE_MARKER_SIDEBAR_WIDTH;
+  },
+
+  /**
+   * Creates the header part of this view.
+   *
+   * @param nsIDOMNode parent
+   *        The parent node holding the header.
+   * @param number timeStart
+   *        @see Waterfall.prototype.setData
+   * @param number dataScale
+   *        The time scale of the data source.
+   */
+  _buildHeader: function(parent, timeStart, dataScale) {
+    let container = this._document.createElement("hbox");
+    container.className = "timeline-header-container";
+    container.setAttribute("flex", "1");
+
+    let sidebar = this._document.createElement("hbox");
+    sidebar.className = "timeline-header-sidebar theme-sidebar";
+    sidebar.setAttribute("width", TIMELINE_MARKER_SIDEBAR_WIDTH);
+    sidebar.setAttribute("align", "center");
+    container.appendChild(sidebar);
+
+    let name = this._document.createElement("label");
+    name.className = "plain timeline-header-name";
+    name.setAttribute("value", this._l10n.getStr("timeline.records"));
+    sidebar.appendChild(name);
+
+    let ticks = this._document.createElement("hbox");
+    ticks.className = "timeline-header-ticks";
+    ticks.setAttribute("align", "center");
+    ticks.setAttribute("flex", "1");
+    container.appendChild(ticks);
+
+    let offset = this._isRTL ? this._waterfallWidth : 0;
+    let direction = this._isRTL ? -1 : 1;
+    let tickInterval = this._findOptimalTickInterval({
+      ticksMultiple: TIMELINE_HEADER_TICKS_MULTIPLE,
+      ticksSpacingMin: TIMELINE_HEADER_TICKS_SPACING_MIN,
+      dataScale: dataScale
+    });
+
+    for (let x = 0; x < this._waterfallWidth; x += tickInterval) {
+      let start = x + direction * TIMELINE_HEADER_TEXT_PADDING;
+      let time = Math.round(timeStart + x / dataScale);
+      let label = this._l10n.getFormatStr("timeline.tick", time);
+
+      let node = this._document.createElement("label");
+      node.className = "plain timeline-header-tick";
+      node.style.transform = "translateX(" + (start - offset) + "px)";
+      node.setAttribute("value", label);
+      ticks.appendChild(node);
+    }
+
+    parent.appendChild(container);
+  },
+
+  /**
+   * Creates the markers part of this view.
+   *
+   * @param nsIDOMNode parent
+   *        The parent node holding the markers.
+   * @param number timeStart
+   *        @see Waterfall.prototype.setData
+   * @param number dataScale
+   *        The time scale of the data source.
+   */
+  _buildMarkers: function(parent, markers, timeStart, timeEnd, dataScale) {
+    let processed = 0;
+
+    for (let marker of markers) {
+      if (!isMarkerInRange(marker, timeStart, timeEnd)) {
+        continue;
+      }
+      // Only build and display a finite number of markers initially, to
+      // preserve a snappy UI. After a certain delay, continue building the
+      // outstanding markers while there's (hopefully) no user interaction.
+      let arguments_ = [this._fragment, marker, timeStart, dataScale];
+      if (processed++ < TIMELINE_IMMEDIATE_DRAW_MARKERS_COUNT) {
+        this._buildMarker.apply(this, arguments_);
+      } else {
+        this._outstandingMarkers.push(arguments_);
+      }
+    }
+
+    // If there are no outstanding markers, add a dummy "spacer" at the end
+    // to fill up any remaining available space in the UI.
+    if (!this._outstandingMarkers.length) {
+      this._buildMarker(this._fragment, null);
+    }
+    // Otherwise prepare flushing the outstanding markers after a small delay.
+    else {
+      this._setNamedTimeout("flush-outstanding-markers",
+        TIMELINE_FLUSH_OUTSTANDING_MARKERS_DELAY,
+        () => this._buildOutstandingMarkers(parent));
+    }
+
+    parent.appendChild(this._fragment);
+  },
+
+  /**
+   * Finishes building the outstanding markers in this view.
+   * @see Waterfall.prototype._buildMarkers
+   */
+  _buildOutstandingMarkers: function(parent) {
+    if (!this._outstandingMarkers.length) {
+      return;
+    }
+    for (let args of this._outstandingMarkers) {
+      this._buildMarker.apply(this, args);
+    }
+    this._outstandingMarkers.length = 0;
+    parent.appendChild(this._fragment);
+  },
+
+  /**
+   * Creates a single marker in this view.
+   *
+   * @param nsIDOMNode parent
+   *        The parent node holding the marker.
+   * @param object marker
+   *        The { name, start, end } marker in the data source.
+   * @param timeStart
+   *        @see Waterfall.prototype.setData
+   * @param number dataScale
+   *        @see Waterfall.prototype._buildMarkers
+   */
+  _buildMarker: function(parent, marker, timeStart, dataScale) {
+    let container = this._document.createElement("hbox");
+    container.className = "timeline-marker-container";
+
+    if (marker) {
+      this._buildMarkerSidebar(container, marker);
+      this._buildMarkerWaterfall(container, marker, timeStart, dataScale);
+    } else {
+      this._buildMarkerSpacer(container);
+      container.setAttribute("flex", "1");
+      container.setAttribute("is-spacer", "");
+    }
+
+    parent.appendChild(container);
+  },
+
+  /**
+   * Creates the sidebar part of a marker in this view.
+   *
+   * @param nsIDOMNode container
+   *        The container node representing the marker in this view.
+   * @param object marker
+   *        @see Waterfall.prototype._buildMarker
+   */
+  _buildMarkerSidebar: function(container, marker) {
+    let blueprint = this._blueprint[marker.name];
+
+    let sidebar = this._document.createElement("hbox");
+    sidebar.className = "timeline-marker-sidebar theme-sidebar";
+    sidebar.setAttribute("width", TIMELINE_MARKER_SIDEBAR_WIDTH);
+    sidebar.setAttribute("align", "center");
+
+    let bullet = this._document.createElement("hbox");
+    bullet.className = "timeline-marker-bullet";
+    bullet.style.backgroundColor = blueprint.fill;
+    bullet.style.borderColor = blueprint.stroke;
+    bullet.setAttribute("type", marker.name);
+    sidebar.appendChild(bullet);
+
+    let name = this._document.createElement("label");
+    name.className = "plain timeline-marker-name";
+    name.setAttribute("value", blueprint.label);
+    sidebar.appendChild(name);
+
+    container.appendChild(sidebar);
+  },
+
+  /**
+   * Creates the waterfall part of a marker in this view.
+   *
+   * @param nsIDOMNode container
+   *        The container node representing the marker.
+   * @param object marker
+   *        @see Waterfall.prototype._buildMarker
+   * @param timeStart
+   *        @see Waterfall.prototype.setData
+   * @param number dataScale
+   *        @see Waterfall.prototype._buildMarkers
+   */
+  _buildMarkerWaterfall: function(container, marker, timeStart, dataScale) {
+    let blueprint = this._blueprint[marker.name];
+
+    let waterfall = this._document.createElement("hbox");
+    waterfall.className = "timeline-marker-waterfall";
+    waterfall.setAttribute("flex", "1");
+
+    let start = (marker.start - timeStart) * dataScale;
+    let width = (marker.end - marker.start) * dataScale;
+    let offset = this._isRTL ? this._waterfallWidth : 0;
+
+    let bar = this._document.createElement("hbox");
+    bar.className = "timeline-marker-bar";
+    bar.style.backgroundColor = blueprint.fill;
+    bar.style.borderColor = blueprint.stroke;
+    bar.style.transform = "translateX(" + (start - offset) + "px)";
+    bar.setAttribute("type", marker.name);
+    bar.setAttribute("width", Math.max(width, TIMELINE_MARKER_BAR_WIDTH_MIN));
+    waterfall.appendChild(bar);
+
+    container.appendChild(waterfall);
+  },
+
+  /**
+   * Creates a dummy spacer as an empty marker.
+   *
+   * @param nsIDOMNode container
+   *        The container node representing the marker.
+   */
+  _buildMarkerSpacer: function(container) {
+    let sidebarSpacer = this._document.createElement("spacer");
+    sidebarSpacer.className = "timeline-marker-sidebar theme-sidebar";
+    sidebarSpacer.setAttribute("width", TIMELINE_MARKER_SIDEBAR_WIDTH);
+
+    let waterfallSpacer = this._document.createElement("spacer");
+    waterfallSpacer.className = "timeline-marker-waterfall";
+    waterfallSpacer.setAttribute("flex", "1");
+
+    container.appendChild(sidebarSpacer);
+    container.appendChild(waterfallSpacer);
+  },
+
+  /**
+   * Creates the background displayed on the marker's waterfall.
+   *
+   * @param number dataScale
+   *        @see Waterfall.prototype._buildMarkers
+   */
+  _drawWaterfallBackground: function(dataScale) {
+    if (!this._canvas || !this._ctx) {
+      this._canvas = this._document.createElementNS(HTML_NS, "canvas");
+      this._ctx = this._canvas.getContext("2d");
+    }
+    let canvas = this._canvas;
+    let ctx = this._ctx;
+
+    // Nuke the context.
+    let canvasWidth = canvas.width = this._waterfallWidth;
+    let canvasHeight = canvas.height = 1; // Awww yeah, 1px, repeats on Y axis.
+
+    // Start over.
+    let imageData = ctx.createImageData(canvasWidth, canvasHeight);
+    let pixelArray = imageData.data;
+
+    let buf = new ArrayBuffer(pixelArray.length);
+    let view8bit = new Uint8ClampedArray(buf);
+    let view32bit = new Uint32Array(buf);
+
+    // Build new millisecond tick lines...
+    let [r, g, b] = WATERFALL_BACKGROUND_TICKS_COLOR_RGB;
+    let alphaComponent = WATERFALL_BACKGROUND_TICKS_OPACITY_MIN;
+    let tickInterval = this._findOptimalTickInterval({
+      ticksMultiple: WATERFALL_BACKGROUND_TICKS_MULTIPLE,
+      ticksSpacingMin: WATERFALL_BACKGROUND_TICKS_SPACING_MIN,
+      dataScale: dataScale
+    });
+
+    // Insert one pixel for each division on each scale.
+    for (let i = 1; i <= WATERFALL_BACKGROUND_TICKS_SCALES; i++) {
+      let increment = tickInterval * Math.pow(2, i);
+      for (let x = 0; x < canvasWidth; x += increment) {
+        let position = x | 0;
+        view32bit[position] = (alphaComponent << 24) | (b << 16) | (g << 8) | r;
+      }
+      alphaComponent += WATERFALL_BACKGROUND_TICKS_OPACITY_ADD;
+    }
+
+    // Flush the image data and cache the waterfall background.
+    pixelArray.set(view8bit);
+    ctx.putImageData(imageData, 0, 0);
+    this._document.mozSetImageElement("waterfall-background", canvas);
+  },
+
+  /**
+   * Finds the optimal tick interval between time markers in this timeline.
+   *
+   * @param number ticksMultiple
+   * @param number ticksSpacingMin
+   * @param number dataScale
+   * @return number
+   */
+  _findOptimalTickInterval: function({ ticksMultiple, ticksSpacingMin, dataScale }) {
+    let timingStep = ticksMultiple;
+
+    while (true) {
+      let scaledStep = dataScale * timingStep;
+      if (scaledStep < ticksSpacingMin) {
+        timingStep <<= 1;
+        continue;
+      }
+      return scaledStep;
+    }
+  },
+
+  /**
+   * Returns true if this is document is in RTL mode.
+   * @return boolean
+   */
+  _getRTL: function() {
+    let win = this._document.defaultView;
+    let doc = this._document.documentElement;
+    return win.getComputedStyle(doc, null).direction == "rtl";
+  }
+};
+
+/**
+ * Checks if a given marker is in the specified time range.
+ *
+ * @param object e
+ *        The marker containing the { start, end } timestamps.
+ * @param number start
+ *        The earliest allowed time.
+ * @param number end
+ *        The latest allowed time.
+ * @return boolean
+ *         True if the marker fits inside the specified time range.
+ */
+function isMarkerInRange(e, start, end) {
+  return (e.start >= start && e.end <= end) || // bounds inside
+         (e.start < start && e.end > end) || // bounds outside
+         (e.start < start && e.end >= start && e.end <= end) || // overlap start
+         (e.end > end && e.start >= start && e.start <= end); // overlap end
+}
+
+exports.Waterfall = Waterfall;