zynfly/sqliteviz
1
0
Fork 0
mirror of https://github.com/lana-k/sqliteviz.git synced 2025-12-06 18:18:53 +08:00
Code Issues Projects Releases Wiki Activity

add manifest and offline support #12

Browse Source
This commit is contained in:
lana-k
2021-04-29 16:19:25 +02:00
parent 92022f9083
commit 9b6aa3d6c7
10 changed files with 2954 additions and 1082 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3958
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

1
package.json
View File

@@ -52,6 +52,7 @@
"karma-webpack": "^4.0.2", "karma-webpack": "^4.0.2",
"vue-cli-plugin-ui-karma": "^0.2.5", "vue-cli-plugin-ui-karma": "^0.2.5",
"vue-template-compiler": "^2.6.11", "vue-template-compiler": "^2.6.11",
"workbox-webpack-plugin": "^6.1.5",
"worker-loader": "^3.0.8" "worker-loader": "^3.0.8"
} }
} }

BIN
public/Logo192x192.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.9 KiB

BIN
public/Logo512x512.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.4 KiB

1
public/index.html
View File

@@ -5,6 +5,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.png"> <link rel="icon" href="<%= BASE_URL %>favicon.png">
<link rel="manifest" href="<%= BASE_URL %>manifest.webmanifest">
<title><%= htmlWebpackPlugin.options.title %></title> <title><%= htmlWebpackPlugin.options.title %></title>
</head> </head>
<body> <body>

20
public/manifest.webmanifest Normal file
View File

@@ -0,0 +1,20 @@
{
"background_color": "white",
"description": "Sqliteviz is a single-page application for fully client-side visualisation of SQLite databases or CSV.",
"display": "fullscreen",
"icons": [
{
"src": "Logo192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "Logo512x512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"name": "sqliteviz",
"short_name": "sqliteviz",
"start_url": "index.html"
}

42
registerServiceWorker.js Normal file
View File

@@ -0,0 +1,42 @@
function invokeServiceWorkerUpdateFlow (registration) {
const agree = confirm('New version of the app is available. Refresh now?')
if (agree) {
if (registration.waiting) {
// let waiting Service Worker know it should became active
registration.waiting.postMessage({ type: 'SKIP_WAITING' })
}
}
}
if ('serviceWorker' in navigator) {
window.addEventListener('load', async () => {
const registration = await navigator.serviceWorker.register('/service-worker.js')
// ensure the case when the updatefound event was missed is also handled
// by re-invoking the prompt when there's a waiting Service Worker
if (registration.waiting) {
invokeServiceWorkerUpdateFlow(registration)
}
// detect Service Worker update available and wait for it to become installed
registration.addEventListener('updatefound', () => {
const newRegestration = registration.installing
if (newRegestration) {
// wait until the new Service worker is actually installed (ready to take over)
newRegestration.addEventListener('statechange', () => {
if (registration.waiting) {
invokeServiceWorkerUpdateFlow(registration)
}
})
}
})
let refreshing = false
// detect controller change and refresh the page
navigator.serviceWorker.addEventListener('controllerchange', () => {
if (!refreshing) {
window.location.reload()
refreshing = true
}
})
})
}

2
src/main.js
View File

@@ -12,6 +12,8 @@ import '@/assets/styles/dialogs.css'
import '@/assets/styles/tooltips.css' import '@/assets/styles/tooltips.css'
import '@/assets/styles/messages.css' import '@/assets/styles/messages.css'
import '../registerServiceWorker'
Vue.use(VuePlugin) Vue.use(VuePlugin)
Vue.use(VModal) Vue.use(VModal)

8
vue.config.js
View File

@@ -1,4 +1,5 @@
const CopyPlugin = require('copy-webpack-plugin') const CopyPlugin = require('copy-webpack-plugin')
const WorkboxPlugin = require('workbox-webpack-plugin')
module.exports = { module.exports = {
publicPath: '', publicPath: '',
@@ -9,7 +10,12 @@ module.exports = {
// It is important that we do not change its name, and that it is in the same folder as the js // It is important that we do not change its name, and that it is in the same folder as the js
{ from: 'node_modules/sql.js/dist/sql-wasm.wasm', to: 'js/' }, { from: 'node_modules/sql.js/dist/sql-wasm.wasm', to: 'js/' },
{ from: 'LICENSE', to: './' } { from: 'LICENSE', to: './' }
]) ]),
new WorkboxPlugin.GenerateSW({
clientsClaim: true,
skipWaiting: false,
maximumFileSizeToCacheInBytes: 40000000
})
] ]
}, },
chainWebpack: config => { chainWebpack: config => {