Sharing a local storage class

  • This isn't perfect, but I thought somebody may be interested in using this as a base for a code only local storage solution that is indexDB based, like the construct3 local storage plugin. It also wraps the indexDB functions in promises so that you can use async await.

    First I'll show the class that provides the functionality and then a small sample of it being used.

    class RGLocalStorage
    {
    	constructor(){
    		this.indexDB = globalThis.indexedDB || globalThis.mozIndexedDB ||
    			globalThis.webkitIndexedDB || globalThis.msIndexedDB;
    		
    		if (!this.indexDB) {
    			throw "IndexDB is not supported in this browser!";
    		}
    		
    		this.db=undefined;
    	}
    	
    	static Initialize(){
    		return new Promise((resolve, reject)=>{
    			const dblocal = new RGLocalStorage();
    		
    			const openReq = dblocal.indexDB.open('rgbz', 1);
    			
    			openReq.onerror = (event)=>{
    				reject('Error opening database odii - ' +
    					 event.target.errorCode);
    			};
    			
    			openReq.onsuccess = (event)=>{
    				dblocal.db = event.target.result;
    				resolve(dblocal);
    			};
    			
    			openReq.onupgradeneeded = (event)=>{
    				event.target.result.createObjectStore("rglocalstorage");
    			};
    		});
    	}
    	
    	put(key, obj) {
    		return new Promise((resolve, reject)=>{
    			const transaction = this.db.transaction(["rglocalstorage"], "readwrite");
    			
    			transaction.onerror = (event)=>{
    				reject({
    					result: false,
    					message: event.target.errorCode
    				});
    			}
    			
    			const objStore = transaction.objectStore("rglocalstorage");
    			
    			const operation = objStore.put(obj, key);
    			
    			operation.onsuccess = (event)=>{
    				resolve({
    					result: true,
    					message: 'success'
    				});
    			};
    			
    			operation.onerror =(event)=>{
    				reject({
    					result: false,
    					message: event.target.errorCode
    				});
    			}
    		});
    	}
    	
    	clearAll() {
    		return new Promise((resolve, reject)=>{
    			const transaction = this.db.transaction(["rglocalstorage"], "readwrite");
    			
    			transaction.onerror = (event)=>{
    				reject({
    					result: false,
    					message: event.target.errorCode
    				});
    			}
    			
    			const objStore = transaction.objectStore("rglocalstorage");
    			
    			const operation = objStore.clear();
    			
    			operation.onsuccess = (event)=>{
    				resolve({
    					result: true,
    					message: 'success'
    				});
    			};
    			
    			operation.onerror =(event)=>{
    				reject({
    					result: false,
    					message: event.target.errorCode
    				});
    			}
    		});
    	}
    	
    	delete(key) {
    		return new Promise((resolve, reject)=>{
    			const transaction = this.db.transaction(["rglocalstorage"], "readwrite");
    			
    			transaction.onerror = (event)=>{
    				reject({
    					result: false,
    					message: event.target.errorCode
    				});
    			}
    			
    			const objStore = transaction.objectStore("rglocalstorage");
    			
    			const operation = objStore.delete(key);
    			
    			operation.onsuccess = (event)=>{
    				resolve({
    					result: true,
    					message: 'success'
    				});
    			};
    			
    			operation.onerror =(event)=>{
    				reject({
    					result: false,
    					message: event.target.errorCode
    				});
    			}
    		});
    	}
    	
    	get(key) {
    		return new Promise((resolve, reject)=>{
    			const transaction = this.db.transaction(["rglocalstorage"], "readonly");
    			
    			transaction.onerror = (event)=>{
    				reject({
    					result: false,
    					message: event.target.errorCode
    				});
    			}
    			
    			const objStore = transaction.objectStore("rglocalstorage");
    			
    			const operation = objStore.get(key);
    			
    			operation.onsuccess = (event)=>{
    				resolve({
    					result: event.target.result,
    					message: 'success'
    				});
    			};
    			
    			operation.onerror =(event)=>{
    				reject({
    					result: false,
    					message: event.target.errorCode
    				});
    			}
    		});
    	}
    	
    	getAll() {
    		return new Promise((resolve, reject)=>{
    			const transaction = this.db.transaction(["rglocalstorage"], "readonly");
    			
    			transaction.onerror = (event)=>{
    				reject({
    					result: false,
    					message: event.target.errorCode
    				});
    			}
    			
    			const objStore = transaction.objectStore("rglocalstorage");
    			
    			const operation = objStore.getAll();
    			
    			operation.onsuccess = (event)=>{
    				resolve({
    					result: event.target.result,
    					message: 'success'
    				});
    			};
    			
    			operation.onerror =(event)=>{
    				reject({
    					result: false,
    					message: event.target.errorCode
    				});
    			}
    		});
    	}
    }
    

    Here is some script start up code I am using to store stuff in "local storage". I am using an async await with a try catch structure. I am also showing awaiting multiple items on startup.

    let config,rgLocalStorage;
    
    runOnStartup(async runtime =>
    {
    	// Code to run on the loading screen
    	
    	try {
    		[config, rgLocalStorage] = await Promise.all([
    				runtime.assets.fetchJson("state.json"),
    				RGLocalStorage.Initialize()
    				]);
    		
    //		const result = await rgLocalStorage.put('Stuff', {name:'Rob'});
    //		const result = await rgLocalStorage.getAll();
    //		const result = await rgLocalStorage.get('Stuff');
    //		const result = await rgLocalStorage.delete('Stuff');
    //		const result = await rgLocalStorage.clearAll();
    //		console.log(result);
    	}
    	catch (e) {
    		console.log(e);
    		throw e;
    	}
    });
    

    Tagged:

  • Thanks for this, it is nice to have a good class example. I hope that we start building on these and have a repo somewhere to easily share them, as we do for C3 addons.

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • Mikal a good starting place for sharing code snippets is https://gist.github.com/. Allows you to share one or more files, with support for revisions and comments.

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)