react-examples/professional_javascript_for_web/ch23/IndexedDBExample02.htm at master · zhangjunhd/react-examples · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
<!DOCTYPE html>
<html>
<head>
    <title>IndexedDB Example</title>
</head>
<body>
    <p>This example works in Firefox 4+ and Chrome. Note that Firefox does not allow local files to access <code>indexedDB</code>, so you'll need to run this example through a web server to get it to work on Firefox (Chrome does not have this restriction).</code></p>
    <script>
    (function(){

        var indexedDB = window.indexedDB || window.msIndexedDB || window.mozIndexedDB || window.webkitIndexedDB,
            request,
            store,
            database,
            users = [
                {
                    username: "007",
                    firstName: "James",
                    lastName: "Bond",
                    password: "foo"
                },
                {
                    username: "ace",
                    firstName: "John",
                    lastName: "Smith",
                    password: "bar"
                }
            ];

        request = indexedDB.open("example");
        request.onerror = function(event){
            alert("Something bad happened while trying to open: " + event.target.errorCode);
        };
        request.onsuccess = function(event){
            database = event.target.result;
            initializeDatabase();
        };

        function initializeDatabase(){
            if (database.version != "1.0"){
                request = database.setVersion("1.0");
                request.onerror = function(event){
                    alert("Something bad happened while trying to set version: " + event.target.errorCode);
                };
                request.onsuccess = function(event){
                    store = database.createObjectStore("users", { keyPath: "username" });
                    var i=0,
                        len = users.length;

                    while(i < len){
                        store.add(users[i++]);
                    }

                    alert("Database initialized for first time. Database name: " + database.name + ", Version: " + database.version);
                };
            } else {
                alert("Database already initialized. Database name: " + database.name + ", Version: " + database.version);
                request = database.transaction("users").objectStore("users").get("007");
                request.onsuccess = function(event){
                    alert(event.target.result.firstName);
                };
            }
        }

    })();

    </script>
</body>
</html>