/** * First we can deal with * offline state * */ function offlineState() { /** * The first thing we need to do is * get data that user could posibly * enter or change, e.g. form elements * */ const data = document.querySelector("#input").value; /** * Our example is simple, but usually here * we would collect all data and * put it in array or object. * */ localStorage.setItem("data", data); alert("Your connection is lost! Data is saved locally!"); } //Now, let's add event listener window.addEventListener("offline", offlineState); /** * Next thing we will do is create * function for when application is back * online * */ function onlineState() { /** * The first thing we will do is * get data from localStorage * and return it to form * */ let data = localStorage.getItem("data"); document.querySelector("#input").value = data; //Now we notify user that everything is //back online again alert("We are back online! Keep the good work!"); } //Next thing is creating event listener window.addEventListener("online", onlineState);