2021-05-03 19:16:34 +03:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="en">
|
2021-07-04 01:48:04 +03:00
|
|
|
<head>
|
|
|
|
|
<meta charset="UTF-8" />
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
|
|
|
<title>Tauri</title>
|
|
|
|
|
</head>
|
2021-05-03 19:16:34 +03:00
|
|
|
|
2021-07-04 01:48:04 +03:00
|
|
|
<body>
|
|
|
|
|
<h3>Counter</h3>
|
|
|
|
|
<div>
|
|
|
|
|
<button id="increment-btn">Increment counter</button>
|
|
|
|
|
</div>
|
|
|
|
|
<h3>Database</h3>
|
|
|
|
|
<div>
|
|
|
|
|
<input id="store-input" placeholder="The value to store" />
|
|
|
|
|
<button id="store-btn">Store</button>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<button id="read-btn">Read</button>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="response"></div>
|
2021-05-03 19:16:34 +03:00
|
|
|
|
2021-07-04 01:48:04 +03:00
|
|
|
<script>
|
|
|
|
|
const KEY = 'db-key'
|
|
|
|
|
const storeBtn = document.querySelector('#store-btn')
|
|
|
|
|
const readBtn = document.querySelector('#read-btn')
|
|
|
|
|
const incrementBtn = document.querySelector('#increment-btn')
|
|
|
|
|
const storeInput = document.querySelector('#store-input')
|
|
|
|
|
const responseContainer = document.querySelector('#response')
|
2021-05-03 19:16:34 +03:00
|
|
|
|
2021-07-04 01:48:04 +03:00
|
|
|
function updateResponse(response) {
|
2022-01-09 20:35:30 +03:00
|
|
|
responseContainer.innerText =
|
2021-07-04 01:48:04 +03:00
|
|
|
typeof response === 'string' ? response : JSON.stringify(response)
|
|
|
|
|
}
|
2021-05-03 19:16:34 +03:00
|
|
|
|
2021-07-04 01:48:04 +03:00
|
|
|
incrementBtn.addEventListener('click', () => {
|
|
|
|
|
window.__TAURI__
|
|
|
|
|
.invoke('increment_counter')
|
|
|
|
|
.then(updateResponse)
|
|
|
|
|
.catch(updateResponse)
|
|
|
|
|
})
|
2021-05-03 19:16:34 +03:00
|
|
|
|
2021-07-04 01:48:04 +03:00
|
|
|
storeBtn.addEventListener('click', () => {
|
|
|
|
|
window.__TAURI__
|
|
|
|
|
.invoke('db_insert', {
|
|
|
|
|
key: KEY,
|
|
|
|
|
value: storeInput.value
|
|
|
|
|
})
|
|
|
|
|
.then(updateResponse)
|
|
|
|
|
.catch(updateResponse)
|
|
|
|
|
})
|
2021-05-03 19:16:34 +03:00
|
|
|
|
2021-07-04 01:48:04 +03:00
|
|
|
readBtn.addEventListener('click', () => {
|
|
|
|
|
window.__TAURI__
|
|
|
|
|
.invoke('db_read', {
|
|
|
|
|
key: KEY
|
|
|
|
|
})
|
|
|
|
|
.then(updateResponse)
|
|
|
|
|
.catch(updateResponse)
|
|
|
|
|
})
|
|
|
|
|
</script>
|
|
|
|
|
</body>
|
2021-05-03 19:16:34 +03:00
|
|
|
</html>
|
