Fix web app install button
This commit is contained in:
parent
fcf7488e1e
commit
b2cc8d9531
@ -20,13 +20,18 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div v-if="canRegisterProtocol" id="native-app" class="col-sm-12">
|
<div v-if="canRegisterProtocol || hasInstallPromptEvent" class="col-sm-12">
|
||||||
<h2>Native app</h2>
|
<h2>Native app</h2>
|
||||||
<button id="webapp-install-button" type="button" class="btn" hidden>
|
<button
|
||||||
|
v-if="hasInstallPromptEvent"
|
||||||
|
type="button"
|
||||||
|
class="btn"
|
||||||
|
@click.prevent="nativeInstallPrompt"
|
||||||
|
>
|
||||||
Add The Lounge to Home screen
|
Add The Lounge to Home screen
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
id="make-default-client"
|
v-if="canRegisterProtocol"
|
||||||
type="button"
|
type="button"
|
||||||
class="btn"
|
class="btn"
|
||||||
@click.prevent="registerProtocol"
|
@click.prevent="registerProtocol"
|
||||||
@ -455,6 +460,13 @@ import RevealPassword from "../RevealPassword.vue";
|
|||||||
import Session from "../Session.vue";
|
import Session from "../Session.vue";
|
||||||
import SidebarToggle from "../SidebarToggle.vue";
|
import SidebarToggle from "../SidebarToggle.vue";
|
||||||
|
|
||||||
|
let installPromptEvent = null;
|
||||||
|
|
||||||
|
window.addEventListener("beforeinstallprompt", (e) => {
|
||||||
|
e.preventDefault();
|
||||||
|
installPromptEvent = e;
|
||||||
|
});
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "Settings",
|
name: "Settings",
|
||||||
components: {
|
components: {
|
||||||
@ -475,6 +487,12 @@ export default {
|
|||||||
},
|
},
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
computed: {
|
||||||
|
hasInstallPromptEvent() {
|
||||||
|
// TODO: This doesn't hide the button after clicking
|
||||||
|
return installPromptEvent !== null;
|
||||||
|
},
|
||||||
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
socket.emit("sessions:get");
|
socket.emit("sessions:get");
|
||||||
|
|
||||||
@ -542,6 +560,10 @@ export default {
|
|||||||
window.navigator.registerProtocolHandler("irc", uri, "The Lounge");
|
window.navigator.registerProtocolHandler("irc", uri, "The Lounge");
|
||||||
window.navigator.registerProtocolHandler("ircs", uri, "The Lounge");
|
window.navigator.registerProtocolHandler("ircs", uri, "The Lounge");
|
||||||
},
|
},
|
||||||
|
nativeInstallPrompt() {
|
||||||
|
installPromptEvent.prompt();
|
||||||
|
installPromptEvent = null;
|
||||||
|
},
|
||||||
playNotification() {
|
playNotification() {
|
||||||
const pop = new Audio();
|
const pop = new Audio();
|
||||||
pop.src = "audio/pop.wav";
|
pop.src = "audio/pop.wav";
|
||||||
|
@ -1,25 +1,10 @@
|
|||||||
"use strict";
|
"use strict";
|
||||||
|
|
||||||
const $ = require("jquery");
|
|
||||||
const socket = require("../socket");
|
const socket = require("../socket");
|
||||||
const upload = require("../upload");
|
const upload = require("../upload");
|
||||||
const store = require("../store").default;
|
const store = require("../store").default;
|
||||||
const router = require("../router");
|
const router = require("../router");
|
||||||
|
|
||||||
window.addEventListener("beforeinstallprompt", (installPromptEvent) => {
|
|
||||||
$("#webapp-install-button")
|
|
||||||
.on("click", function() {
|
|
||||||
if (installPromptEvent && installPromptEvent.prompt) {
|
|
||||||
installPromptEvent.prompt();
|
|
||||||
}
|
|
||||||
|
|
||||||
$(this).prop("hidden", true);
|
|
||||||
})
|
|
||||||
.prop("hidden", false);
|
|
||||||
|
|
||||||
$("#native-app").prop("hidden", false);
|
|
||||||
});
|
|
||||||
|
|
||||||
socket.once("configuration", function(data) {
|
socket.once("configuration", function(data) {
|
||||||
store.commit("serverConfiguration", data);
|
store.commit("serverConfiguration", data);
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user