Browse files

Fix our indexedDB init code, due to bugzil.la/770844 -- However FF is…

… also fixing it on their side.
  • Loading branch information...
1 parent 10cdda2 commit 358d158223a44d1fa060935218782d1a483f11cb @paulirish paulirish committed Aug 10, 2012
View
6 content/tutorials/indexeddb/todo/de/index.html
@@ -12,7 +12,7 @@
{% if is_mobile %}
<script>
var html5rocks = {};
- var indexedDB = window.indexedDB || window.webkitIndexedDB ||
+ window.indexedDB = window.indexedDB || window.webkitIndexedDB ||
window.mozIndexedDB;
if ('webkitIndexedDB' in window) {
@@ -303,7 +303,7 @@ <h2 id="toc-step3">3. Schritt: Daten zu einem Objektspeicher hinzufügen</h2>
<h2 id="toc-step4">4. Schritt: Daten in einem Speicher abfragen</h2>
<p>
- Da sich nun die Daten in der Datenbank befinden, brauchen Sie eine sinnvolle Möglichkeit zum Zugriff auf die Daten. Zum Glück ist das ziemlich einfach.
+ Da sich nun die Daten in der Datenbank befinden, brauchen Sie eine sinnvolle Möglichkeit zum Zugriff auf die Daten. Zum Glück ist das ziemlich einfach.
</p>
<pre class="prettyprint">
html5rocks.indexedDB.getAllTodoItems = function() {
@@ -418,4 +418,4 @@ <h2 id="toc-final">Das endgültige Produkt</h2>
<iframe src="http://playground.html5rocks.com/?mode=frame&hu=210&hl=150#a_simple_todo_list_using_indexeddb" style="border: none; width: 100%; height: 480px;"></iframe>
{% endif %}
-{% endblock %}
+{% endblock %}
View
4 content/tutorials/indexeddb/todo/en/index.html
@@ -12,7 +12,7 @@
{% if is_mobile %}
<script>
var html5rocks = {};
- var indexedDB = window.indexedDB || window.webkitIndexedDB ||
+ window.indexedDB = window.indexedDB || window.webkitIndexedDB ||
window.mozIndexedDB;
if ('webkitIndexedDB' in window) {
@@ -508,4 +508,4 @@ <h2 id="toc-final">The final product</h2>
<iframe src="http://playground.html5rocks.com/?mode=frame&hu=210&hl=150#a_simple_todo_list_using_indexeddb" style="border: none; width: 100%; height: 480px;"></iframe>
{% endif %}
-{% endblock %}
+{% endblock %}
View
8 content/tutorials/indexeddb/todo/es/index.html
@@ -12,7 +12,7 @@
{% if is_mobile %}
<script>
var html5rocks = {};
- var indexedDB = window.indexedDB || window.webkitIndexedDB ||
+ window.indexedDB = window.indexedDB || window.webkitIndexedDB ||
window.mozIndexedDB;
if ('webkitIndexedDB' in window) {
@@ -154,7 +154,7 @@
{% block content %}
<h2 id="toc-intro">Introducción</h2>
<p>
- <a href="http://www.w3.org/TR/IndexedDB/">IndexedDB</a> es una novedad de HTML5. Las bases de datos web se alojan y se guardan en el navegador del usuario. Al permitir a los desarrolladores crear aplicaciones con capacidad de consulta enriquecida, se espera que surja una nueva generación de aplicaciones web con la capacidad de trabajar tanto online como sin conexión.
+ <a href="http://www.w3.org/TR/IndexedDB/">IndexedDB</a> es una novedad de HTML5. Las bases de datos web se alojan y se guardan en el navegador del usuario. Al permitir a los desarrolladores crear aplicaciones con capacidad de consulta enriquecida, se espera que surja una nueva generación de aplicaciones web con la capacidad de trabajar tanto online como sin conexión.
</p>
<p>
El código de ejemplo incluido en este artículo muestra cómo crear un gestor de listas de tareas pendientes de una forma muy sencilla. Realizaremos un recorrido de alto nivel por las funciones disponibles en HTML5.
@@ -173,7 +173,7 @@ <h2 id="what">¿Qué es IndexedDB?</h2>
IndexedDB se diferencia en que crea un almacén de objetos de un tipo de datos y los objetos JavaScript simplemente se guardan en ese almacén. Cada almacén de objetos puede tener una colección de índices, lo que permite realizar consultas e iteraciones de forma eficiente.
</p>
<p>
- IndexedDB también acaba con la noción de lenguaje de consultas estándar (Standard Query Language,
+ IndexedDB también acaba con la noción de lenguaje de consultas estándar (Standard Query Language,
<abbr title="Standard Query Languag">SQL</abbr>), que es sustituido por una consulta en un índice, lo que produce un cursor que puedes utilizar para iterar en el conjunto de resultados.
</p>
<p>
@@ -418,4 +418,4 @@ <h2 id="toc-final">El producto final</h2>
<iframe src="http://playground.html5rocks.com/?mode=frame&hu=210&hl=150#a_simple_todo_list_using_indexeddb" style="border: none; width: 100%; height: 480px;"></iframe>
{% endif %}
-{% endblock %}
+{% endblock %}
View
4 content/tutorials/indexeddb/todo/ja/index.html
@@ -12,7 +12,7 @@
{% if is_mobile %}
<script>
var html5rocks = {};
- var indexedDB = window.indexedDB || window.webkitIndexedDB ||
+ window.indexedDB = window.indexedDB || window.webkitIndexedDB ||
window.mozIndexedDB;
if ('webkitIndexedDB' in window) {
@@ -418,4 +418,4 @@ <h2 id="toc-final">最終的な成果</h2>
<iframe src="http://playground.html5rocks.com/?mode=frame&hu=210&hl=150#a_simple_todo_list_using_indexeddb" style="border: none; width: 100%; height: 480px;"></iframe>
{% endif %}
-{% endblock %}
+{% endblock %}
View
4 content/tutorials/indexeddb/todo/pt/index.html
@@ -12,7 +12,7 @@
{% if is_mobile %}
<script>
var html5rocks = {};
- var indexedDB = window.indexedDB || window.webkitIndexedDB ||
+ window.indexedDB = window.indexedDB || window.webkitIndexedDB ||
window.mozIndexedDB;
if ('webkitIndexedDB' in window) {
@@ -418,4 +418,4 @@ <h2 id="toc-final">O produto final</h2>
<iframe src="http://playground.html5rocks.com/?mode=frame&hu=210&hl=150#a_simple_todo_list_using_indexeddb" style="border: none; width: 100%; height: 480px;"></iframe>
{% endif %}
-{% endblock %}
+{% endblock %}
View
4 content/tutorials/indexeddb/todo/ru/index.html
@@ -12,7 +12,7 @@
{% if is_mobile %}
<script>
var html5rocks = {};
- var indexedDB = window.indexedDB || window.webkitIndexedDB ||
+ window.indexedDB = window.indexedDB || window.webkitIndexedDB ||
window.mozIndexedDB;
if ('webkitIndexedDB' in window) {
@@ -418,4 +418,4 @@ <h2 id="toc-final">Конечный результат</h2>
<iframe src="http://playground.html5rocks.com/?mode=frame&hu=210&hl=150#a_simple_todo_list_using_indexeddb" style="border: none; width: 100%; height: 480px;"></iframe>
{% endif %}
-{% endblock %}
+{% endblock %}
View
5 content/tutorials/indexeddb/todo/zh/index.html
@@ -12,8 +12,7 @@
{% if is_mobile %}
<script>
var html5rocks = {};
- var indexedDB = window.indexedDB || window.webkitIndexedDB ||
- window.mozIndexedDB;
+ window.indexedDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB;
if ('webkitIndexedDB' in window) {
window.IDBTransaction = window.webkitIDBTransaction;
@@ -418,4 +417,4 @@ <h2 id="toc-final">最终产品</h2>
<iframe src="http://playground.html5rocks.com/?mode=frame&hu=210&hl=150#a_simple_todo_list_using_indexeddb" style="border: none; width: 100%; height: 480px;"></iframe>
{% endif %}
-{% endblock %}
+{% endblock %}
View
12 content/tutorials/indexeddb/uidatabinding/en/index.html
@@ -28,7 +28,7 @@ <h2 id="toc-intro">Introduction</h2>
<h2 id="toc-gettingstarted">Getting Started</h2>
-<p>We've got multiple parts to this demo, so to start things off simply, let's look at the HTML portion.
+<p>We've got multiple parts to this demo, so to start things off simply, let's look at the HTML portion.
<pre class="prettyprint">
&lt;form>
@@ -42,12 +42,12 @@ <h2 id="toc-gettingstarted">Getting Started</h2>
<p>Not a lot, right? There are three main aspects to this UI that we care about. First is the field, “name” that will be used for autocomplete. It loads disabled and will be enabled later via JavaScript. The span next to it is used during the initial seed to provide updates to the user. Finally, the div with the id displayEmployee will be used when you select an employee from the autosuggest.
-<p>Now let's take a look at the JavaScript. There's a lot to digest here so we'll take it step by step. The full code will be available at the end so you can see it in it's entirety.
+<p>Now let's take a look at the JavaScript. There's a lot to digest here so we'll take it step by step. The full code will be available at the end so you can see it in it's entirety.
<p>First off - there are some prefix issues we have to worry about among the browsers that support IndexedDB. Here's some code from the Mozilla documentation modified to provide simple aliases for the core IndexedDB components our application needs.
<pre class="prettyprint">
-var indexedDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB;
+window.indexedDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB;
var IDBTransaction = window.IDBTransaction || window.webkitIDBTransaction;
var IDBKeyRange = window.IDBKeyRange || window.webkitIDBKeyRange;
</pre>
@@ -217,7 +217,7 @@ <h2 id="toc-gimmedata">Gimme Some Data!</h2>
<p>As this is a client-specific modification, it's done here as opposed to on the back-end server (or in our case, the imaginary back-end server).
-<p>To perform the database additions in a performant fashion, you should reuse the transaction for all the batched writes. If you create a new transaction for each write, the browser may cause a disk write for each transaction, and that's going to make your performance terrible when adding a lot of items (think "1 minute to write a 1000 objects"-terrible).
+<p>To perform the database additions in a performant fashion, you should reuse the transaction for all the batched writes. If you create a new transaction for each write, the browser may cause a disk write for each transaction, and that's going to make your performance terrible when adding a lot of items (think "1 minute to write a 1000 objects"-terrible).
<figure>
<img src="https://lh3.googleusercontent.com/4m9jpgYPPGItefHJqK5xCrJuw5n4phWX0EI0g_e0ty0Ykal3_pKsB7HF1n-9Eowh1GfzVMG6ZNbsLFAKbMOajjUlwvbukrsF03G805QWyXR3cN5WF5k">
@@ -274,7 +274,7 @@ <h2 id="toc-autocomplete">Creating the Autocomplete</h2>
}
</pre>
-<p>The most complex part of this code is the creation of the source property. The jQuery UI's Autocomplete control allows you to define a source property that can be customized to meet any possible need - even our IndexedDB data. The API provides you with the request (basically what was typed into the form field) and a response callback. You are responsible for sending an array of results back to that callback.
+<p>The most complex part of this code is the creation of the source property. The jQuery UI's Autocomplete control allows you to define a source property that can be customized to meet any possible need - even our IndexedDB data. The API provides you with the request (basically what was typed into the form field) and a response callback. You are responsible for sending an array of results back to that callback.
<p>The first thing we do is hide the displayEmployee div. This is used to display an individual employee and if one is previously loaded up, to clear it out. Now we can start searching.
@@ -293,7 +293,7 @@ <h2 id="toc-autocomplete">Creating the Autocomplete</h2>
<h2 id="toc-wrapping-up">Wrapping Up</h2>
-<p>You can find the complete application attached <a href="/static/demos/idb-databinding/indexdbautocomplete.zip">here as a zip file</a>. You can also see <a href="/static/demos/idb-databinding/index_mark3.html">the demo here</a>.
+<p>You can find the complete application attached <a href="/static/demos/idb-databinding/indexdbautocomplete.zip">here as a zip file</a>. You can also see <a href="/static/demos/idb-databinding/index_mark3.html">the demo here</a>.
<p class="notice">Note - if you want to remove the data and test the 'seed' process again, simply go <a href="/static/demos/idb-databinding/delete.html">here</a>.
View
2 content/tutorials/offline/storage/static/indexed.js
@@ -1,6 +1,6 @@
!function() {
- var indexedDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB;
+ window.indexedDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB;
var IDBTransaction = window.webkitIDBTransaction || window.mozIDBTransaction || window.IDBTransaction // TODO moz
var IDBKeyRange = window.webkitIDBKeyRange || window.mozIDBKeyRange || window.IDBKeyRange // TODO moz
View
3 content/tutorials/webdatabase/websql-indexeddb/en/index.html
@@ -93,8 +93,7 @@ <h3 id="toc-idb-creating">IndexedDB - Creating the database</h3>
<p>In IndexedDB, we need a bit more code at the initialization phase because we wish to handle the prefix per browser (webkit, moz, etc). This enable us to have cleaner code during our application. Moreover, when more browsers implement this feature, we could use the window object without any prefix so our code is ready for that.
</p>
<pre class="prettyprint">
-var indexedDB = window.indexedDB || window.webkitIndexedDB ||
- window.mozIndexedDB || window.msIndexedDB;
+window.indexedDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB || window.msIndexedDB;
// Handle the prefix of Chrome to IDBTransaction/IDBKeyRange.
if ('webkitIndexedDB' in window) {
View
4 static/demos/idb-databinding/delete.html
@@ -1,6 +1,6 @@
<script>
-var indexedDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB || window.msIndexedDB;
+window.indexedDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB || window.msIndexedDB;
var request = indexedDB.deleteDatabase("employees");
console.log("done");
-</script>
+</script>
View
4 static/demos/idb-databinding/index_mark3.html
@@ -11,7 +11,7 @@
<script>
// https://developer.mozilla.org/en/IndexedDB/Using_IndexedDB
-var indexedDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB || window.msIndexedDB;
+window.indexedDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB || window.msIndexedDB;
var IDBTransaction = window.IDBTransaction || window.webkitIDBTransaction;
var IDBKeyRange = window.IDBKeyRange || window.webkitIDBKeyRange;
@@ -37,7 +37,7 @@
//Create Employee
if(!thisDb.objectStoreNames.contains("employee")) {
console.log("I need to make the employee objectstore");
- var objectStore = thisDb.createObjectStore("employee", { keyPath: "id", autoIncrement:true });
+ var objectStore = thisDb.createObjectStore("employee", { keyPath: "id", autoIncrement:true });
objectStore.createIndex("searchkey", "searchkey", { unique: false });
}

1 comment on commit 358d158

@ebidel
HTML5Rocks member

LGTM

Please sign in to comment.