#tricks > [!tip] Save for use in other bots/tags > All these snippets work if they're in the same tag as `createDatabase` > If you want to access the IndexedDB in other tags or bots, I would recommend setting `globalThis.db` equal to the database, so that it can be accessed from anywhere in the inst as `db` # Contents - [[#Check IndexedDB Support|Check IndexedDB Support]] - [[#Create IndexedDB & Object Store|Create IndexedDB & Object Store]] - [[#Add Data|Add Data]] - [[#Remove Data|Remove Data]] - [[#Clear Object Store|Clear Object Store]] - [[#Get Data|Get Data]] - [[#Update Data|Update Data]] --- ## Check IndexedDB Support --- ```javascript const indexedDBSupport = () => { return typeof indexedDB == 'object' } ``` ## Create IndexedDB & Object Store --- ```javascript const createDatabase = async () => { if ( !indexedDBSupport() ) { throw new Error("Browser does not support indexedDB") } let forceExit = false const request = await indexedDB.open("xp.bot", 1) // Error request.onerror = () => { forceExit = true console.error(`IndexedDB error: ${request.errorCode}: ${request.error}`) } // Success request.onsuccess = () => { console.info('Successfully connected to IndexedDB') db = request.result // Update db, if it's been added to globalThis } // Upgrade Needed request.onupgradeneeded = () => { console.info('Indexed database created') db = request.result const objectStore = db.createObjectStore('xp.bot', {keyPath: 'key'}) // Indexes objectStore.createIndex('key', 'key', { unique: true }) objectStore.createIndex('value', 'value', { unique: false }) // Transaction completed objectStore.transaction.oncompleted = () => { console.log('Object store "xp.bot" created') } } while (!db) { if (forceExit) break await os.sleep(100) } return request.result } ``` ## Add Data --- ```javascript const addData = (payload) => { const transaction = db.transaction('xp.bot', 'readwrite') // Available events transaction.oncomplete = () => {} transaction.onerror = () => {} // Add payload to the database const objectStore = transaction.objectStore('xp.bot') const request = objectStore.add(payload) request.onsuccess = () => { console.log(`New data added | ${request.result}: ${payload.value}`) } request.onerror = (err) => { console.error(`Error adding data to xp.bot indexedDB at key ${payload.key}:`, err) } } ``` ## Remove Data --- ```javascript const removeData = (key) => { const request = db.transaction('xp.bot', 'readwrite') .objectStore('xp.bot') .delete(key) request.onsuccess = () => { console.log(`Data removed from indexedDB ${key}`) } request.onerror = (err) => { console.error(`Error removing ${key} from indexedDB:`, err) } } ``` ## Clear Object Store --- ```javascript const clearData = (storeName) => { const request = db.transaction(storeName, 'readwrite') .objectStore(storeName) .clear() request.onsuccess = () => { console.log(`Object Store "${storeName}" emptied`) } request.onerror = (err) => { console.error(`Error to empty Object Store "${storeName}"`, err) } } ``` ## Get Data --- ```javascript const getData = async (key) => { let result let forceExit = false const request = db.transaction('xp.bot') .objectStore('xp.bot') .get(key) request.onsuccess = () => { result = request.result } request.onerror = (err) => { forceExit = true console.error(`Error getting data from xp.bot db "${key}"`, err) } while (!result) { if (forceExit) break await os.sleep(100) } return result.value } ``` ## Update Data --- ```javascript const updateData = (key, value) => { const objectStore = db.transaction('xp.bot', 'readwrite') .objectStore('xp.bot') const request = objectStore.get(key) request.onsuccess = () => { const data = request.result // Change the value property data.value = value // Create a request to update const updateRequest = objectStore.put(data) updateRequest.onsuccess = () => { console.log(`Data updated | ${updateRequest.result}: ${data.value}`) } } } ```