When a fully validated bank account object is created, we can store it in local storage, also called the Web Storage API, that is widely supported in modern browsers. In this mechanism, the application's data are persisted locally (on the client-side) as a Map-like structure: a dictionary of key/value pairs. This is yet another example of the universal use of JSON for storage and transport of data (see Chapter 4, Modeling Web Applications with Model Concepts and Dartlero). Unlike cookies, local storage does not expire, but every application can only access its own data, up to a certain limit depending on the browser. With it, our application can also have an offline mode of functioning, when the server is not available to store the data in a database. Web Storage also has another way of storing data called sessionStorage, but this limits the persistence of the data to only the current browser session. So data is lost when the browser is closed or another application is started in the same browser window. In the localStorage mechanism, which we will use here, JSON strings are stored and retrieved, so we need a two-way mechanism to convert our objects to and from JSON and the corresponding toJson and fromJson methods in our classes, for example, in person.dart:

  Map<String, Object> toJson() {
    var per = new Map<String, Object>();
    per["name"] = name;
    per["address"] = address;
    per["email"] = email;
    per["gender"] = gender;
    per["birthdate"] = date_birth.toString();
    return per;
  }

The preceding method is called from the toJson method in the following BankAccount class (see bank_terminal_s3ank_account.dart):

  String toJson() {
    var acc = new Map<String, Object>();
    acc["number"] = number;
    acc["owner"] = owner.toJson();
    acc["balance"] = balance;
    acc["pin_code"] = pin_code;
    acc["creation_date"] = date_created.toString();
    acc["modified_date"] = date_modified.toString();
    var accs = JSON.encode(acc); // use only once for the root  // object (here a bank account)
    return accs;
  }

We will store our bank account object bac in localStorage using its number as the key:

window.localStorage["Bankaccount:${bac.number}"] = bac.toJson();

Now we can create bank accounts and store them on the browser's machine. In Chrome, verify this in Tools | Developer | Tools | Resources | Local Storage | http:127.0.0.1:port (where port is the port number, usually 3030):

Viewing local storage screen

Local Storage can be disabled (by user action, or via an installed plug-in or extension) so we must alert the user when this needs to be changed; we can do this by catching the Exception that occurs in this case:

try {
    window.localStorage["Bankaccount:${bac.number}"] =      bac.toJson();
} on Exception catch (ex) {
      window.alert("Data not stored: Local storage has been   deactivated!");
}

Local Storage is in fact of type Map<String, String>; so it has a length property; you can query whether it contains something with isEmpty, and you can loop through all stored values with:

for (var key in window.localStorage.keys) {
    String value = window.localStorage[key];
}