From d1661b9409ef4a279bf22c27295f303dd9238ec8 Mon Sep 17 00:00:00 2001 From: WolverinDEV Date: Thu, 11 Jun 2020 11:17:56 +0200 Subject: [PATCH] Some minor and major bugfixing --- ChangeLog.md | 2 ++ shared/css/static/menu-bar.scss | 4 ++++ shared/js/ConnectionHandler.ts | 6 ++++- shared/js/ui/frames/MenuBar.ts | 5 ++-- shared/js/ui/frames/connection_handlers.ts | 12 +++------- shared/js/ui/tree/View.scss | 18 ++++---------- shared/js/ui/tree/View.tsx | 28 ++++++++++++++++++++-- 7 files changed, 47 insertions(+), 28 deletions(-) diff --git a/ChangeLog.md b/ChangeLog.md index eee45a6f..5b6a5a49 100644 --- a/ChangeLog.md +++ b/ChangeLog.md @@ -1,6 +1,8 @@ # Changelog: * **11.06.20** - Fixed channel tree deletions + - Removed layout recalculate bottleneck on connection handler switching + - Fixed empty channel tree on tab change, if the tree has some scroll offset * **10.06.20** - Finalize the channel file explorer diff --git a/shared/css/static/menu-bar.scss b/shared/css/static/menu-bar.scss index d2084daa..a1530f9c 100644 --- a/shared/css/static/menu-bar.scss +++ b/shared/css/static/menu-bar.scss @@ -65,6 +65,10 @@ background-color: rgba(0, 0, 0, 0.13); } + &.hidden { + display: none; + } + .sub-menu { z-index: 1000; display: none; diff --git a/shared/js/ConnectionHandler.ts b/shared/js/ConnectionHandler.ts index 66e90c00..0126f262 100644 --- a/shared/js/ConnectionHandler.ts +++ b/shared/js/ConnectionHandler.ts @@ -32,7 +32,6 @@ import * as top_menu from "tc-shared/ui/frames/MenuBar"; import {EventHandler, Registry} from "tc-shared/events"; import {FileManager} from "tc-shared/file/FileManager"; import {FileTransferState, TransferProvider} from "tc-shared/file/Transfer"; -import {guid} from "tc-shared/crypto/uid"; import {traj} from "tc-shared/i18n/localize"; import {md5} from "tc-shared/crypto/md5"; @@ -1069,5 +1068,10 @@ export interface ConnectionEvents { notify_connection_state_changed: { old_state: ConnectionState, new_state: ConnectionState + }, + + /* the handler has become visible/invisible for the client */ + notify_visibility_changed: { + visible: boolean } } \ No newline at end of file diff --git a/shared/js/ui/frames/MenuBar.ts b/shared/js/ui/frames/MenuBar.ts index bc08f128..85166219 100644 --- a/shared/js/ui/frames/MenuBar.ts +++ b/shared/js/ui/frames/MenuBar.ts @@ -92,6 +92,7 @@ namespace html { private _label: string; private _callback_click: () => any; + private visible_: boolean = true; constructor(label: string, mode: "side" | "down") { this._label = label; @@ -167,9 +168,9 @@ namespace html { visible(value?: boolean): boolean { if(typeof(value) === "undefined") - return this.html_tag.is(':visible'); //FIXME! + return this.visible_; - this.html_tag.toggle(!!value); + this.html_tag.toggleClass("hidden", this.visible_ = !!value); return value; } diff --git a/shared/js/ui/frames/connection_handlers.ts b/shared/js/ui/frames/connection_handlers.ts index 93a77827..26d6dfd0 100644 --- a/shared/js/ui/frames/connection_handlers.ts +++ b/shared/js/ui/frames/connection_handlers.ts @@ -68,15 +68,6 @@ export class ConnectionManager { handler.initialize_client_state(this.active_handler); this.connection_handlers.push(handler); - //FIXME: Load last status from last connection or via global variables! - /* - handler.set_away_status(this.default_server_state.away, false); - handler.client_status.input_muted = this.default_server_state.microphone_disabled; - handler.client_status.output_muted = this.default_server_state.speaker_disabled; - if(!this.default_server_state.microphone_disabled) - handler.acquire_recorder(default_recorder, true); - */ - handler.tag_connection_handler.appendTo(this._tag_connection_entries); this._tag.toggleClass("shown", this.connection_handlers.length > 1); this._update_scroll(); @@ -142,6 +133,9 @@ export class ConnectionManager { old_handler: old_handler, new_handler: handler }); + old_handler?.events().fire("notify_visibility_changed", { visible: false }); + handler?.events().fire("notify_visibility_changed", { visible: true }); + top_menu.update_state(); //FIXME: Top menu should listen to our events! } diff --git a/shared/js/ui/tree/View.scss b/shared/js/ui/tree/View.scss index c0139b05..aaf07f7c 100644 --- a/shared/js/ui/tree/View.scss +++ b/shared/js/ui/tree/View.scss @@ -10,18 +10,6 @@ html:root { --channel-tree-entry-marker-unread: rgba(168, 20, 20, 0.5); } -@if 0 { - /* the channel tree */ - .channel-tree { - - .tree-entry { - &.client { - - } - } - } -} - .channelTree { @include user-select(none); width: 100%; @@ -109,8 +97,6 @@ html:root { .channelTreeContainer { @include chat-scrollbar-vertical(); - scroll-behavior: smooth; - position: relative; height: 100%; @@ -119,4 +105,8 @@ html:root { overflow: hidden; overflow-y: auto; + + &.smoothScroll { + scroll-behavior: smooth; + } } \ No newline at end of file diff --git a/shared/js/ui/tree/View.tsx b/shared/js/ui/tree/View.tsx index 378b7d52..accc7ff0 100644 --- a/shared/js/ui/tree/View.tsx +++ b/shared/js/ui/tree/View.tsx @@ -19,6 +19,7 @@ import {ServerEntry} from "tc-shared/ui/server"; import {ClientEntry, ClientType} from "tc-shared/ui/client"; import * as log from "tc-shared/log"; import {LogCategory} from "tc-shared/log"; +import {ConnectionEvents} from "tc-shared/ConnectionHandler"; const viewStyle = require("./View.scss"); @@ -35,6 +36,7 @@ export interface ChannelTreeViewState { view_height: number; /* in px */ tree_version: number; + smoothScroll: boolean; } export type TreeEntry = ChannelEntry | ServerEntry | ClientEntry; @@ -57,8 +59,10 @@ export class ChannelTreeView extends ReactComponentBase { + clearTimeout(this.fixScrollTimer); + if(!event.visible) { + this.setState({ smoothScroll: false }); + return; + } + + this.fixScrollTimer = setTimeout(() => { + this.ref_container.current.scrollTop = this.state.scroll_offset; + this.fixScrollTimer = setTimeout(() => { + this.setState({ smoothScroll: true }); + }, 50); + }, 50); + console.log("Update scroll!"); } } @@ -174,7 +198,7 @@ export class ChannelTreeView extends ReactComponentBase this.onScroll()} ref={this.ref_container} onMouseDown={e => this.onMouseDown(e)}