supernets/hardlounge
supernets/hardlounge
4
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

Move some init code around

Browse Source
This commit is contained in:
Pavel Djundik 2019-11-12 13:09:12 +02:00
parent 033f565c0e
commit 54a1e11f50
6 changed files with 123 additions and 116 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
client/components/App.vue
View File

@ -1,6 +1,6 @@
<template>
<div id="viewport" :class="viewportClasses" role="tablist">
<Sidebar :overlay="$refs.overlay" />
<Sidebar v-if="$store.state.appLoaded" :overlay="$refs.overlay" />
<div id="sidebar-overlay" ref="overlay" @click="$store.commit('sidebarOpen', false)" />
<article id="windows">
<router-view ref="window"></router-view>
@ -11,6 +11,8 @@
<script>
const throttle = require("lodash/throttle");
const constants = require("../js/constants");
const storage = require("../js/localStorage");
import Sidebar from "./Sidebar.vue";
import ImageViewer from "./ImageViewer.vue";
@ -25,12 +27,15 @@ export default {
viewportClasses() {
return {
notified: this.$store.getters.highlightCount > 0,
"menu-open": this.$store.state.sidebarOpen,
"menu-open": this.$store.state.appLoaded && this.$store.state.sidebarOpen,
"menu-dragging": this.$store.state.sidebarDragging,
"userlist-open": this.$store.state.userlistOpen,
};
},
},
created() {
this.prepareOpenStates();
},
mounted() {
// Make a single throttled resize listener available to all components
this.debouncedResize = throttle(() => {
@ -60,6 +65,25 @@ export default {
return tommorow - today;
},
prepareOpenStates() {
const viewportWidth = window.outerWidth;
let isUserlistOpen = storage.get("thelounge.state.userlist");
if (viewportWidth > constants.mobileViewportPixels) {
this.$store.commit(
"sidebarOpen",
storage.get("thelounge.state.sidebar") !== "false"
);
}
// If The Lounge is opened on a small screen (less than 1024px), and we don't have stored
// user list state, close it by default
if (viewportWidth >= 1024 && isUserlistOpen !== "true" && isUserlistOpen !== "false") {
isUserlistOpen = "true";
}
this.$store.commit("userlistOpen", isUserlistOpen === "true");
},
},
};
</script>

4
client/components/Windows/SignIn.vue
View File

@ -72,10 +72,10 @@ export default {
};
},
mounted() {
this.$root.$on("auth:failed", this.onAuthFailed);
socket.on("auth:failed", this.onAuthFailed);
},
beforeDestroy() {
this.$root.$off("auth:failed", this.onAuthFailed);
socket.off("auth:failed", this.onAuthFailed);
},
methods: {
onAuthFailed() {

3
client/js/socket-events/auth.js
View File

@ -2,7 +2,6 @@
const socket = require("../socket");
const storage = require("../localStorage");
const {vueApp} = require("../vue");
const {router, navigate} = require("../router");
const store = require("../store").default;
let lastServerHash = null;
@ -20,8 +19,6 @@ socket.on("auth:failed", function() {
}
showSignIn();
vueApp.$emit("auth:failed");
});
socket.on("auth:start", function(serverHash) {

87
client/js/socket-events/configuration.js
View File

@ -27,12 +27,12 @@ socket.once("configuration", function(data) {
// 'theme' setting depends on serverConfiguration.themes so
// settings cannot be applied before this point
store.dispatch("settings/applyAll");
socket.emit("setting:get");
if (data.fileUpload) {
upload.initialize(data.fileUploadMaxFileSize);
upload.initialize();
}
socket.emit("setting:get");
webpush.initialize();
router.initialize();
@ -46,83 +46,10 @@ socket.once("configuration", function(data) {
document.querySelector('meta[name="theme-color"]').content = currentTheme.themeColor;
}
if ("URLSearchParams" in window) {
handleQueryParams();
if (document.body.classList.contains("public")) {
window.addEventListener(
"beforeunload",
() => "Are you sure you want to navigate away from this page?"
);
}
});
function handleQueryParams() {
const params = new URLSearchParams(document.location.search);
const cleanParams = () => {
// Remove query parameters from url without reloading the page
const cleanUri = window.location.origin + window.location.pathname + window.location.hash;
window.history.replaceState({}, document.title, cleanUri);
};
if (params.has("uri")) {
// Set default connection settings from IRC protocol links
const uri =
params.get("uri") +
(location.hash.startsWith("#/") ? `#${location.hash.substring(2)}` : location.hash);
const queryParams = parseIrcUri(uri);
cleanParams();
router.router.push({name: "Connect", query: queryParams});
} else if (document.body.classList.contains("public") && document.location.search) {
// Set default connection settings from url params
const queryParams = Object.fromEntries(params.entries());
cleanParams();
router.router.push({name: "Connect", query: queryParams});
}
}
function parseIrcUri(stringUri) {
const data = {};
try {
// https://tools.ietf.org/html/draft-butcher-irc-url-04
const uri = new URL(stringUri);
// Replace protocol with a "special protocol" (that's what it's called in WHATWG spec)
// So that the uri can be properly parsed
if (uri.protocol === "irc:") {
uri.protocol = "http:";
if (!uri.port) {
uri.port = 6667;
}
data.tls = false;
} else if (uri.protocol === "ircs:") {
uri.protocol = "https:";
if (!uri.port) {
uri.port = 6697;
}
data.tls = true;
} else {
return;
}
data.host = data.name = uri.hostname;
data.port = uri.port;
data.username = window.decodeURIComponent(uri.username);
data.password = window.decodeURIComponent(uri.password);
let channel = (uri.pathname + uri.hash).substr(1);
const index = channel.indexOf(",");
if (index > -1) {
channel = channel.substring(0, index);
}
data.join = channel;
} catch (e) {
// do nothing on invalid uri
}
return data;
}

111
client/js/socket-events/init.js
View File

@ -3,7 +3,6 @@
const socket = require("../socket");
const webpush = require("../webpush");
const storage = require("../localStorage");
const constants = require("../constants");
const {initChannel} = require("../vue");
const {router, switchToChannel, navigate} = require("../router");
const store = require("../store").default;
@ -13,36 +12,23 @@ socket.on("init", function(data) {
store.commit("isConnected", true);
store.commit("currentUserVisibleError", null);
if (data.token) {
storage.set("token", data.token);
}
if (!store.state.appLoaded) {
store.commit("appLoaded");
if (data.token) {
storage.set("token", data.token);
}
// TODO: Try to move webpush key to configuration event
webpush.configurePushNotifications(data.pushSubscription, data.applicationServerKey);
const viewportWidth = window.outerWidth;
let isUserlistOpen = storage.get("thelounge.state.userlist");
if (viewportWidth > constants.mobileViewportPixels) {
store.commit("sidebarOpen", storage.get("thelounge.state.sidebar") !== "false");
}
// If The Lounge is opened on a small screen (less than 1024px), and we don't have stored
// user list state, close it by default
if (viewportWidth >= 1024 && isUserlistOpen !== "true" && isUserlistOpen !== "false") {
isUserlistOpen = "true";
}
store.commit("userlistOpen", isUserlistOpen === "true");
document.body.classList.remove("signed-out");
if (window.g_TheLoungeRemoveLoading) {
window.g_TheLoungeRemoveLoading();
}
// TODO: Review this code and make it better
if (!router.currentRoute.name || router.currentRoute.name === "SignIn") {
const channel = store.getters.findChannel(data.active);
@ -56,13 +42,10 @@ socket.on("init", function(data) {
navigate("Connect");
}
}
}
if (document.body.classList.contains("public")) {
window.addEventListener(
"beforeunload",
() => "Are you sure you want to navigate away from this page?"
);
if ("URLSearchParams" in window) {
handleQueryParams();
}
}
});
@ -169,3 +152,79 @@ function mergeChannelData(oldChannels, newChannels) {
return newChannels;
}
function handleQueryParams() {
const params = new URLSearchParams(document.location.search);
const cleanParams = () => {
// Remove query parameters from url without reloading the page
const cleanUri = window.location.origin + window.location.pathname + window.location.hash;
window.history.replaceState({}, document.title, cleanUri);
};
if (params.has("uri")) {
// Set default connection settings from IRC protocol links
const uri =
params.get("uri") +
(location.hash.startsWith("#/") ? `#${location.hash.substring(2)}` : location.hash);
const queryParams = parseIrcUri(uri);
cleanParams();
router.router.push({name: "Connect", query: queryParams});
} else if (document.body.classList.contains("public") && document.location.search) {
// Set default connection settings from url params
const queryParams = Object.fromEntries(params.entries());
cleanParams();
router.router.push({name: "Connect", query: queryParams});
}
}
function parseIrcUri(stringUri) {
const data = {};
try {
// https://tools.ietf.org/html/draft-butcher-irc-url-04
const uri = new URL(stringUri);
// Replace protocol with a "special protocol" (that's what it's called in WHATWG spec)
// So that the uri can be properly parsed
if (uri.protocol === "irc:") {
uri.protocol = "http:";
if (!uri.port) {
uri.port = 6667;
}
data.tls = false;
} else if (uri.protocol === "ircs:") {
uri.protocol = "https:";
if (!uri.port) {
uri.port = 6697;
}
data.tls = true;
} else {
return;
}
data.host = data.name = uri.hostname;
data.port = uri.port;
data.username = window.decodeURIComponent(uri.username);
data.password = window.decodeURIComponent(uri.password);
let channel = (uri.pathname + uri.hash).substr(1);
const index = channel.indexOf(",");
if (index > -1) {
channel = channel.substring(0, index);
}
data.join = channel;
} catch (e) {
// do nothing on invalid uri
}
return data;
}

6
client/js/upload.js
View File

@ -5,8 +5,7 @@ const updateCursor = require("undate").update;
const store = require("./store").default;
class Uploader {
init(maxFileSize) {
this.maxFileSize = maxFileSize;
init() {
this.xhr = null;
this.fileQueue = [];
@ -98,9 +97,10 @@ class Uploader {
}
const wasQueueEmpty = this.fileQueue.length === 0;
const maxFileSize = store.state.serverConfiguration.fileUploadMaxFileSize;
for (const file of files) {
if (this.maxFileSize > 0 && file.size > this.maxFileSize) {
if (maxFileSize > 0 && file.size > maxFileSize) {
this.handleResponse({
error: `File ${file.name} is over the maximum allowed size`,
});