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

Side by Side Diff: chrome/common/extensions/docs/templates/articles/app_storage.html

Issue 561733004: Fixing path to chrome app samples in documentation (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Adding app.yaml and cron.yaml vesion update Created 6 years, 3 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 unified diff | Download patch
OLDNEW
1 <h1>Storage APIs</h1> 1 <h1>Storage APIs</h1>
2 2
3 <p> 3 <p>
4 Almost every aspect of app development involves some element 4 Almost every aspect of app development involves some element
5 of sending or receiving data. 5 of sending or receiving data.
6 Starting with the basics, 6 Starting with the basics,
7 you should use an MVC framework to help you design and implement your app 7 you should use an MVC framework to help you design and implement your app
8 so that data is completely separate from the app's view on that data 8 so that data is completely separate from the app's view on that data
9 (see <a href="app_frameworks">MVC Architecture</a>). 9 (see <a href="app_frameworks">MVC Architecture</a>).
10 </p> 10 </p>
11 11
12 <p> 12 <p>
13 You also need to think about how data is handled when your app is offline 13 You also need to think about how data is handled when your app is offline
14 (see <a href="offline_apps">Offline First</a>). 14 (see <a href="offline_apps">Offline First</a>).
15 This doc briefly introduces the storage options 15 This doc briefly introduces the storage options
16 for sending, receiving, and saving data locally; 16 for sending, receiving, and saving data locally;
17 the remainder of the doc shows you how 17 the remainder of the doc shows you how
18 to use Chrome's File System and Sync File System APIs 18 to use Chrome's File System and Sync File System APIs
19 (see also <a href="fileSystem">fileSystem API</a> and 19 (see also <a href="fileSystem">fileSystem API</a> and
20 <a href="syncFileSystem">syncFileSystem API</a>). 20 <a href="syncFileSystem">syncFileSystem API</a>).
21 </p> 21 </p>
22 22
23 <p class="note"> 23 <p class="note">
24 <b>API Samples: </b> 24 <b>API Samples: </b>
25 Want to play with the code? 25 Want to play with the code?
26 Check out the 26 Check out the
27 <a href="https://github.com/GoogleChrome/chrome-app-samples/tree/master/filesyst em-access">filesystem-access</a>, 27 <a href="https://github.com/GoogleChrome/chrome-app-samples/tree/master/samples/ filesystem-access">filesystem-access</a>,
28 <a href="https://github.com/GoogleChrome/chrome-app-samples/tree/master/syncfs-e ditor">syncfs-editor</a> 28 <a href="https://github.com/GoogleChrome/chrome-app-samples/tree/master/samples/ syncfs-editor">syncfs-editor</a>
29 and <a href="https://github.com/GoogleChrome/chrome-app-samples/tree/master/stor age">storage</a> samples. 29 and <a href="https://github.com/GoogleChrome/chrome-app-samples/tree/master/samp les/storage">storage</a> samples.
30 </p> 30 </p>
31 31
32 <h2 id="options">Storage options</h2> 32 <h2 id="options">Storage options</h2>
33 33
34 <p> 34 <p>
35 Packaged apps use many different mechanisms 35 Packaged apps use many different mechanisms
36 to send and receive data. 36 to send and receive data.
37 For external data (resources, web pages), 37 For external data (resources, web pages),
38 you need to be aware of the 38 you need to be aware of the
39 <a href="contentSecurityPolicy">Content Security Policy (CSP)</a>. 39 <a href="contentSecurityPolicy">Content Security Policy (CSP)</a>.
(...skipping 31 matching lines...) Expand 10 before | Expand all | Expand 10 after
71 a photo-sharing app can use the Filesystem API 71 a photo-sharing app can use the Filesystem API
72 to read and write any photos that a user selects. 72 to read and write any photos that a user selects.
73 </p> 73 </p>
74 74
75 <p> 75 <p>
76 With Chrome's Sync Filesystem API, 76 With Chrome's Sync Filesystem API,
77 apps can save and synchronize data 77 apps can save and synchronize data
78 on a user's Google Drive 78 on a user's Google Drive
79 so that the same data can be available across different clients. 79 so that the same data can be available across different clients.
80 For example, a 80 For example, a
81 <a href="https://github.com/GoogleChrome/chrome-app-samples/tree/master/syncfs-e ditor">cloud-backed text editor</a> 81 <a href="https://github.com/GoogleChrome/chrome-app-samples/tree/master/samples/ syncfs-editor">cloud-backed text editor</a>
82 app can automatically sync new text files to a user's Google Drive account. 82 app can automatically sync new text files to a user's Google Drive account.
83 When the user opens the text editor in a new client, 83 When the user opens the text editor in a new client,
84 Google Drive pushes new text files to that instance of the text editor. 84 Google Drive pushes new text files to that instance of the text editor.
85 </p> 85 </p>
86 86
87 <p> 87 <p>
88 Note: Unlike regular Filesystem API, Chrome's Sync Filesystem API 88 Note: Unlike regular Filesystem API, Chrome's Sync Filesystem API
89 currently does <b>NOT</b> support directory operations, except for 89 currently does <b>NOT</b> support directory operations, except for
90 reading directory entries in the root directory. 90 reading directory entries in the root directory.
91 An attempt to create a directory in Sync Filesystem will result 91 An attempt to create a directory in Sync Filesystem will result
(...skipping 46 matching lines...) Expand 10 before | Expand all | Expand 10 after
138 }); 138 });
139 } 139 }
140 </pre> 140 </pre>
141 141
142 <h3 id="drag">Implementing drag-and-drop</h3> 142 <h3 id="drag">Implementing drag-and-drop</h3>
143 143
144 <p> 144 <p>
145 If you need to implement drag-and-drop selection, 145 If you need to implement drag-and-drop selection,
146 the drag-and-drop file controller 146 the drag-and-drop file controller
147 (<code>dnd.js</code>) in the 147 (<code>dnd.js</code>) in the
148 <a href="https://github.com/GoogleChrome/chrome-app-samples/tree/master/filesyst em-access">filesystem-access</a> 148 <a href="https://github.com/GoogleChrome/chrome-app-samples/tree/master/samples/ filesystem-access">filesystem-access</a>
149 sample is a good starting point. 149 sample is a good starting point.
150 The controller creates a file entry 150 The controller creates a file entry
151 from a <code>DataTransferItem</code> 151 from a <code>DataTransferItem</code>
152 via drag-and-drop. 152 via drag-and-drop.
153 In this example, 153 In this example,
154 the <code>fileEntry</code> is set 154 the <code>fileEntry</code> is set
155 to the first dropped item. 155 to the first dropped item.
156 </p> 156 </p>
157 157
158 <pre> 158 <pre>
159 var dnd = new DnDFileController('body', function(data) { 159 var dnd = new DnDFileController('body', function(data) {
160 var fileEntry = data.items[0].webkitGetAsEntry(); 160 var fileEntry = data.items[0].webkitGetAsEntry();
161 displayPath(fileEntry); 161 displayPath(fileEntry);
162 }); 162 });
163 </pre> 163 </pre>
164 164
165 <h3 id="read">Reading a file</h3> 165 <h3 id="read">Reading a file</h3>
166 166
167 <p> 167 <p>
168 The following code opens the file (read-only) and 168 The following code opens the file (read-only) and
169 reads it as text using a <code>FileReader</code> object. 169 reads it as text using a <code>FileReader</code> object.
170 If the file doesn't exist, an error is thrown. 170 If the file doesn't exist, an error is thrown.
171 </p> 171 </p>
172 172
173 <pre> 173 <pre>
174 var chosenFileEntry = null; 174 var chosenFileEntry = null;
175 175
176 chooseFileButton.addEventListener('click', function(e) { 176 chooseFileButton.addEventListener('click', function(e) {
177 chrome.fileSystem.chooseEntry({type: 'openFile'}, function(readOnlyEntry) { 177 chrome.fileSystem.chooseEntry({type: 'openFile'}, function(readOnlyEntry) {
178 178
179 readOnlyEntry.file(function(file) { 179 readOnlyEntry.file(function(file) {
180 var reader = new FileReader(); 180 var reader = new FileReader();
181 181
182 reader.onerror = errorHandler; 182 reader.onerror = errorHandler;
183 reader.onloadend = function(e) { 183 reader.onloadend = function(e) {
184 console.log(e.target.result); 184 console.log(e.target.result);
185 }; 185 };
186 186
187 reader.readAsText(file); 187 reader.readAsText(file);
188 }); 188 });
(...skipping 226 matching lines...) Expand 10 before | Expand all | Expand 10 after
415 You can also look at the user's sync backend service storage (in Google Drive). 415 You can also look at the user's sync backend service storage (in Google Drive).
416 Synced files are saved in a hidden Google Drive folder, 416 Synced files are saved in a hidden Google Drive folder,
417 <strong>Chrome Syncable FileSystem</strong>. The folder won't be shown in 417 <strong>Chrome Syncable FileSystem</strong>. The folder won't be shown in
418 your 'My Drive' list but can be accessed by searching the folder name 418 your 'My Drive' list but can be accessed by searching the folder name
419 in the search box. (Note that the remote folder layout is 419 in the search box. (Note that the remote folder layout is
420 <strong>not</strong> guaranteed to remain backwards compatible between 420 <strong>not</strong> guaranteed to remain backwards compatible between
421 releases.) 421 releases.)
422 </p> 422 </p>
423 423
424 <p class="backtotop"><a href="#top">Back to top</a></p> 424 <p class="backtotop"><a href="#top">Back to top</a></p>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698