Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(4347)

Unified Diff: chrome/common/extensions/docs/server2/templates/articles/app_lifecycle.html

Issue 10832042: Extensions Docs Server: Doc conversion script (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: everything but svn stuff Created 8 years, 5 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: chrome/common/extensions/docs/server2/templates/articles/app_lifecycle.html
diff --git a/chrome/common/extensions/docs/server2/templates/articles/app_lifecycle.html b/chrome/common/extensions/docs/server2/templates/articles/app_lifecycle.html
new file mode 100644
index 0000000000000000000000000000000000000000..5e8d51b89e4336e5bb254fd2a4504ae6433bfca9
--- /dev/null
+++ b/chrome/common/extensions/docs/server2/templates/articles/app_lifecycle.html
@@ -0,0 +1,230 @@
+<meta name="doc-family" content="apps">
+<h1>Manage App Lifecycle</h1>
+
+
+<p>
+The app runtime and event page are responsible
+for managing the app lifecycle.
+The app runtime manages app installation,
+controls the event page,
+and can shutdown the app at anytime.
+The event page listens out for events from the app runtime
+and manages what gets launched and how.
+</p>
+
+<h2 id="lifecycle">How the lifecycle works</h2>
+
+<p>
+The app runtime loads the event page
+from a user's desktop and
+the <code>onLaunch()</code> event is fired.
+This event tells the event page what windows
+to launch and their dimensions.
+The lifecycle diagram here isn't the nicest to look at,
+but it's practical (and we will make it nicer soon).
+</p>
+
+<img src="{{static}}/images/applifecycle.png"
+ width="444"
+ height="329"
+ alt="how app lifecycle works">
+
+<p>
+When the event page has no executing JavaScript,
+no pending callbacks, and no open windows,
+the runtime unloads the event page and closes the app.
+Before unloading the event page,
+the <code>onSuspend()</code> event is fired.
+This gives the event page opportunity
+to do simple clean-up tasks
+before the app is closed.
+</p>
+
+<h2 id="eventpage">Create event page and windows</h2>
+
+<p>
+All apps must have an event page.
+This page contains the top-level logic of the application
+with none of its own UI and is responsible
+for creating the windows for all other app pages.
+</p>
+
+<h3>Create event page</h3>
+
+<p>
+To create the event page,
+include the "background" field in the app manifest
+and include the <code>background.js</code> in the scripts array.
+Any library scripts used by the event page need to be added
+to the "background" field first:
+</p>
+
+<pre>
+"background": {
+ "scripts": [
+ "foo.js",
+ "background.js"
+ ]
+}
+</pre>
+
+<p>
+Your event page must include the <code>onLaunched()</code> function.
+This function is called
+when your application is launched in any way:
+</p>
+
+<pre>
+chrome.experimental.app.onLaunched.addListener(function() {
+ // Tell your app what to launch and how.
+});
+</pre>
+
+<h3>Create windows</h3>
+
+<p>
+An event page may create one or more windows at its discretion.
+By default, these windows are created with a script connection
+to the event page and are directly scriptable by the event page.
+</p>
+
+<p>
+Windows can either be shells or panels.
+Shell windows have no browser chrome.
+Panel windows are the same as shell windows,
+except they have different size and position restrictions,
+for example, a chat panel.
+</p>
+
+<p>Here's a sample <code>background.js</code>
+ with a 'shell' window:</p>
+
+<pre>
+chrome.experimental.app.onLaunched.addListener(function() {
+ chrome.app.window.create('main.html', {
+ width: 800,
+ height: 600,
+ minWidth: 800,
+ minHeight: 600,
+ left: 100,
+ top: 100,
+ type: 'shell'
+ });
+});
+</pre>
+
+<p>Here's a sample <code>background.js</code>
+ with a 'panel' window:
+</p>
+
+<pre>
+chrome.experimental.app.onLaunched.addListener(function() {
+ chrome.app.window.create('index.html', {
+ width: 400,
+ height: 200,
+ type: 'panel'
+ });
+});
+</pre>
+
+<h3>Including Launch Data</h3>
+
+<p>
+Depending on how your app is launched,
+you may need to include launch data
+in your event page.
+By default, there is no launch data
+when the app is started by the app launcher.
+For apps that provide intents,
+you need to include the
+<code>launchData.intent</code> parameter.
+</p>
+
+<p>
+Web intents can be launched by other apps invoking their intent,
+or by the runtime when apps are launched to view or edit files,
+for example from the operating system file explorer.
+To find out how to launch an app with web intents,
+see <a href="app_intents.html#launching">Launching an App with a File</a>.
+</p>
+
+<h2 id="runtime">Listening for app runtime events</h2>
+
+<p>
+The app runtime controls the app installs, updates, and uninstalls.
+You don't need to do anything to set up the app runtime,
+but your event page can listen out for the <code>onInstalled()</code> event
+to store local settings and the
+<code>onSuspend()</code> event to do simple clean-up tasks
+before the event page is unloaded.
+</p>
+
+<h3>Storing local settings</h3>
+
+<p>
+<code>chrome.runtime.onInstalled()</code>
+is called when your app has first been installed,
+or when it has been updated.
+Any time this function is called,
+the <code>onInstalled</code> event is fired.
+The event page can listen for this event and use the
+<a href="storage.html">Storage API</a>
+to store and update local settings
+(see also <a href="app_storage.html#options">Storage options</a>).
+</p>
+
+<pre>
+chrome.runtime.onInstalled.addListener(function() {
+ chrome.storage.local.set(object items, function callback);
+});
+</pre>
+
+<h3>Preventing data loss</h3>
+
+<p>
+Users can uninstall your app at any time.
+When uninstalled,
+no executing code or private data is left behind.
+This can lead to data loss
+since the users may be uninstalling an app
+that has locally edited, unsynchronized data.
+You should stash data to prevent data loss.
+</p>
+
+<p>
+At a minimum,
+you should store user settings
+so that if users reinstall your app,
+their information is still available for reuse.
+Using the Storage API
+(<a href="storage.html#property-sync">chrome.storage.sync</a>),
+user data can be automatically synced
+with Chrome sync.
+</p>
+
+<h3>Clean-up before app closes</h3>
+
+<p>
+The app runtime sends the <code>onSuspend()</code>
+event to the event page before unloading it.
+Your event page can listen out for this event and
+do clean-up tasks before the app closes.
+</p>
+
+<p>
+Once this event is fired,
+the app runtime starts the process of closing the app:
+all events stop firing and
+JavaScript execution is halted.
+Any asynchronous operations started
+while handling this event are not guaranteed to complete.
+Keep the clean-up tasks synchronous and simple.
+</p>
+
+<pre>
+chrome.runtime.onSuspend.addListener(function() {
+ // Do some simple clean-up tasks.
+});
+</pre>
+
+<p class="backtotop"><a href="#top">Back to top</a></p>

Powered by Google App Engine
This is Rietveld 408576698