Skip to content

Commit c58c860

Browse files
thkruzthkruz
committed
fix: 🐛 fix search bar toggle and slide in animations
1 parent 61c93d3 commit c58c860

File tree

11 files changed

+71
-78
lines changed

11 files changed

+71
-78
lines changed

‎src/plugins/KeepTrackPlugin.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -523,7 +523,7 @@ export class KeepTrackPlugin {
523523

524524
hideSideMenus(): void {
525525
if (settingsManager.isMobileModeEnabled) {
526-
keepTrackApi.getUiManager().searchManager.searchToggle(false);
526+
keepTrackApi.getUiManager().searchManager.closeSearch();
527527
}
528528
keepTrackApi.getUiManager().hideSideMenus();
529529
this.isMenuButtonActive = false;

‎src/plugins/countries/countries.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -138,7 +138,7 @@ export class CountriesMenu extends KeepTrackPlugin {
138138
keepTrackApi.getPlugin(SelectSatManager)?.selectSat(-1);
139139

140140
// Close Menus
141-
if (settingsManager.isMobileModeEnabled) uiManagerInstance.searchManager.searchToggle(true);
141+
if (settingsManager.isMobileModeEnabled) uiManagerInstance.searchManager.closeSearch();
142142
uiManagerInstance.hideSideMenus();
143143
}
144144
}

‎src/plugins/missile/missilePlugin.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ export const bottomMenuClick = (iconName: string): void => {
3636
uiManagerInstance.hideSideMenus();
3737
return;
3838
} else {
39-
if (settingsManager.isMobileModeEnabled) uiManagerInstance.searchManager.searchToggle(false);
39+
if (settingsManager.isMobileModeEnabled) uiManagerInstance.searchManager.closeSearch();
4040
uiManagerInstance.hideSideMenus();
4141
slideInRight(getEl('missile-menu'), 1000);
4242
getEl('menu-missile').classList.add('bmenu-item-selected');

‎src/plugins/sat-changes/sat-changes.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -140,7 +140,7 @@ export const bottomMenuClick = (iconName: string): void => {
140140
uiManagerInstance.hideSideMenus();
141141
return;
142142
} else {
143-
if (settingsManager.isMobileModeEnabled) uiManagerInstance.searchManager.searchToggle(false);
143+
if (settingsManager.isMobileModeEnabled) uiManagerInstance.searchManager.closeSearch();
144144
uiManagerInstance.hideSideMenus();
145145
slideInRight(getEl('satChng-menu'), 1000);
146146
issatChngMenuOpen = true;

‎src/plugins/sat-constellations/sat-constellations.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -155,7 +155,7 @@ export class SatConstellations extends KeepTrackPlugin {
155155
uiManagerInstance.searchManager.doSearch(groupManagerInstance.groupList[groupName].ids.map((id: number) => catalogManagerInstance.getSat(id)?.sccNum).join(','));
156156

157157
// Close Menus
158-
if (settingsManager.isMobileModeEnabled) uiManagerInstance.searchManager.searchToggle(true);
158+
if (settingsManager.isMobileModeEnabled) uiManagerInstance.searchManager.closeSearch();
159159
uiManagerInstance.hideSideMenus();
160160
}
161161
}

‎src/settings/versionDate.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
11
// THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
2-
export const VERSION_DATE = 'January 20, 2024';
2+
export const VERSION_DATE = 'January 21, 2024';

‎src/singletons/input-manager/keyboard-input.ts

+10-7
Original file line numberDiff line numberDiff line change
@@ -95,10 +95,13 @@ export class KeyboardInput {
9595
// Open the search bar for faster searching
9696
// TODO: What if it isn't available?
9797
case 'F':
98-
if (this.isShiftPressed) {
99-
evt.preventDefault();
100-
uiManagerInstance.searchManager.searchToggle(true);
101-
getEl('search').focus();
98+
evt.preventDefault();
99+
100+
if (this.isShiftPressed && !uiManagerInstance.searchManager.isSearchOpen) {
101+
uiManagerInstance.searchManager.toggleSearch();
102+
setTimeout(() => {
103+
getEl('search').focus();
104+
}, 1000);
102105
this.releaseShiftKey(keepTrackApi.getMainCamera());
103106
}
104107
break;
@@ -111,12 +114,12 @@ export class KeyboardInput {
111114
break;
112115
case 'D':
113116
if (this.isShiftPressed && keepTrackApi.getMainCamera().cameraType !== CameraType.FPS) {
114-
if ((<DebugMenuPlugin>keepTrackApi.getPlugin(DebugMenuPlugin)).isErudaVisible) {
117+
if (keepTrackApi.getPlugin(DebugMenuPlugin).isErudaVisible) {
115118
eruda.hide();
116-
(<DebugMenuPlugin>keepTrackApi.getPlugin(DebugMenuPlugin)).isErudaVisible = false;
119+
keepTrackApi.getPlugin(DebugMenuPlugin).isErudaVisible = false;
117120
} else {
118121
eruda.show();
119-
(<DebugMenuPlugin>keepTrackApi.getPlugin(DebugMenuPlugin)).isErudaVisible = true;
122+
keepTrackApi.getPlugin(DebugMenuPlugin).isErudaVisible = true;
120123
}
121124
}
122125
break;

‎src/singletons/input-manager/mouse-input.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -524,10 +524,10 @@ export class MouseInput {
524524
break;
525525
case 'clear-screen-rmb':
526526
if (keepTrackApi.getPlugin(TimeMachine)) {
527-
(<TimeMachine>keepTrackApi.getPlugin(TimeMachine)).isTimeMachineRunning = false;
527+
keepTrackApi.getPlugin(TimeMachine).isTimeMachineRunning = false;
528528
}
529529
uiManagerInstance.doSearch('');
530-
uiManagerInstance.searchManager.searchToggle(false);
530+
uiManagerInstance.searchManager.closeSearch();
531531
uiManagerInstance.hideSideMenus();
532532

533533
// if (

‎src/singletons/mobileManager.ts

+1-5
Original file line numberDiff line numberDiff line change
@@ -56,11 +56,7 @@ export class MobileManager {
5656
event: KeepTrackApiEvents.selectSatData,
5757
cbName: 'MobileManager.selectSatData',
5858
cb: () => {
59-
const searchManager = keepTrackApi.getUiManager().searchManager;
60-
61-
if (searchManager.isResultsOpen) {
62-
searchManager.searchToggle(false);
63-
}
59+
keepTrackApi.getUiManager().searchManager.closeSearch();
6460
},
6561
});
6662

‎src/singletons/orbitManager.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -244,7 +244,7 @@ export class OrbitManager {
244244
updateAllVisibleOrbits(): void {
245245
const uiManagerInstance = keepTrackApi.getUiManager();
246246

247-
if (uiManagerInstance.searchManager.isResultsOpen() && !settingsManager.disableUI && !settingsManager.lowPerf) {
247+
if (uiManagerInstance.searchManager.isResultsOpen && !settingsManager.disableUI && !settingsManager.lowPerf) {
248248
const currentSearchSats = uiManagerInstance.searchManager.getLastResultGroup()?.ids;
249249
if (typeof currentSearchSats !== 'undefined') {
250250
if (this.updateAllThrottle_ >= currentSearchSats.length) this.updateAllThrottle_ = 0;

‎src/singletons/search-manager.ts

+51-57
Original file line numberDiff line numberDiff line change
@@ -38,12 +38,10 @@ export enum SearchResultType {
3838
* about the current search state.
3939
*/
4040
export class SearchManager {
41-
private resultsOpen_ = false;
41+
isSearchOpen = false;
42+
isResultsOpen = false;
4243
private lastResultGroup_ = <ObjectGroup>null;
4344
private uiManager_: UiManager;
44-
private isSearchOpen = false;
45-
private forceClose = false;
46-
private forceOpen = false;
4745

4846
constructor(uiManager: UiManager) {
4947
this.uiManager_ = uiManager;
@@ -73,7 +71,6 @@ export class SearchManager {
7371
keepTrackApi.getPlugin(SelectSatManager)?.selectSat(satId);
7472
}
7573
});
76-
7774
getEl('search-results')?.addEventListener('mouseover', (evt) => {
7875
let satId = SearchManager.getSatIdFromSearchResults_(evt);
7976
if (isNaN(satId) || satId === -1) return;
@@ -85,14 +82,17 @@ export class SearchManager {
8582
keepTrackApi.getHoverManager().setHoverId(-1);
8683
this.uiManager_.searchHoverSatId = -1;
8784
});
88-
8985
getEl('search')?.addEventListener('input', () => {
9086
const searchStr = (<HTMLInputElement>getEl('search')).value;
9187
this.doSearch(searchStr);
9288
});
93-
89+
getEl('search')?.addEventListener('blur', () => {
90+
if (this.isSearchOpen && this.getCurrentSearch().length === 0) {
91+
this.toggleSearch();
92+
}
93+
});
9494
getEl('search-icon')?.addEventListener('click', () => {
95-
this.searchToggle();
95+
this.toggleSearch();
9696
});
9797
}
9898

@@ -122,7 +122,7 @@ export class SearchManager {
122122
* Returns the current search string entered by the user.
123123
*/
124124
getCurrentSearch(): string {
125-
if (this.resultsOpen_) {
125+
if (this.isResultsOpen) {
126126
const searchDom = <HTMLInputElement>getEl('search', true);
127127
if (searchDom) {
128128
return searchDom.value;
@@ -132,10 +132,6 @@ export class SearchManager {
132132
return '';
133133
}
134134

135-
isResultsOpen(): boolean {
136-
return this.resultsOpen_;
137-
}
138-
139135
/**
140136
* Hides the search results box and clears the selected satellite group.
141137
* Also updates the color scheme if necessary.
@@ -149,7 +145,7 @@ export class SearchManager {
149145

150146
slideOutUp(getEl('search-results'), 1000);
151147
groupManagerInstance.clearSelect();
152-
this.resultsOpen_ = false;
148+
this.isResultsOpen = false;
153149

154150
settingsManager.lastSearch = '';
155151
settingsManager.lastSearchResults = [];
@@ -543,7 +539,7 @@ export class SearchManager {
543539
if (satInfoboxDom) SatInfoBox.resetMenuLocation(satInfoboxDom, false);
544540

545541
slideInDown(getEl('search-results'), 1000);
546-
this.resultsOpen_ = true;
542+
this.isResultsOpen = true;
547543

548544
if (
549545
colorSchemeManagerInstance.currentColorScheme === colorSchemeManagerInstance.groupCountries ||
@@ -555,51 +551,49 @@ export class SearchManager {
555551
}
556552
}
557553

558-
searchToggle(force?: boolean) {
559-
// Reset Force Options
560-
this.forceClose = false;
561-
this.forceOpen = false;
562-
563-
// Pass false to force close and true to force open
564-
if (typeof force != 'undefined') {
565-
if (!force) this.forceClose = true;
566-
if (force) this.forceOpen = true;
554+
toggleSearch() {
555+
if (!this.isSearchOpen) {
556+
this.openSearch();
557+
} else {
558+
this.closeSearch();
567559
}
560+
}
568561

569-
if ((!this.isSearchOpen && !this.forceClose) || this.forceOpen) {
570-
this.isSearchOpen = true;
571-
getEl('search-holder')?.classList.remove('search-slide-up');
572-
getEl('search-holder')?.classList.add('search-slide-down');
573-
getEl('search-icon')?.classList.add('search-icon-search-on');
574-
getEl('fullscreen-icon')?.classList.add('top-menu-icons-search-on');
575-
getEl('tutorial-icon')?.classList.add('top-menu-icons-search-on');
576-
getEl('legend-icon')?.classList.add('top-menu-icons-search-on');
577-
getEl('sound-icon')?.classList.add('top-menu-icons-search-on');
578-
579-
const searchDom = <HTMLInputElement>getEl('search');
580-
if (searchDom) {
581-
const curSearch = searchDom.value;
582-
if (curSearch.length > settingsManager.minimumSearchCharacters) {
583-
this.doSearch(curSearch);
584-
}
562+
closeSearch(isForce = false) {
563+
if (!this.isSearchOpen && !isForce) return;
564+
565+
this.isSearchOpen = false;
566+
getEl('search-holder')?.classList.remove('search-slide-down');
567+
getEl('search-holder')?.classList.add('search-slide-up');
568+
getEl('search-icon')?.classList.remove('search-icon-search-on');
569+
setTimeout(function () {
570+
getEl('fullscreen-icon')?.classList.remove('top-menu-icons-search-on');
571+
getEl('tutorial-icon')?.classList.remove('top-menu-icons-search-on');
572+
getEl('legend-icon')?.classList.remove('top-menu-icons-search-on');
573+
getEl('sound-icon')?.classList.remove('top-menu-icons-search-on');
574+
}, 500);
575+
this.uiManager_.hideSideMenus();
576+
this.hideResults();
577+
}
578+
579+
openSearch(isForce = false) {
580+
if (this.isSearchOpen && !isForce) return;
581+
582+
this.isSearchOpen = true;
583+
getEl('search-holder')?.classList.remove('search-slide-up');
584+
getEl('search-holder')?.classList.add('search-slide-down');
585+
getEl('search-icon')?.classList.add('search-icon-search-on');
586+
getEl('fullscreen-icon')?.classList.add('top-menu-icons-search-on');
587+
getEl('tutorial-icon')?.classList.add('top-menu-icons-search-on');
588+
getEl('legend-icon')?.classList.add('top-menu-icons-search-on');
589+
getEl('sound-icon')?.classList.add('top-menu-icons-search-on');
590+
591+
const searchDom = <HTMLInputElement>getEl('search');
592+
if (searchDom) {
593+
const curSearch = searchDom.value;
594+
if (curSearch.length > settingsManager.minimumSearchCharacters) {
595+
this.doSearch(curSearch);
585596
}
586-
} else {
587-
this.isSearchOpen = false;
588-
getEl('search-holder')?.classList.remove('search-slide-down');
589-
getEl('search-holder')?.classList.add('search-slide-up');
590-
getEl('search-icon')?.classList.remove('search-icon-search-on');
591-
setTimeout(function () {
592-
getEl('fullscreen-icon')?.classList.remove('top-menu-icons-search-on');
593-
getEl('tutorial-icon')?.classList.remove('top-menu-icons-search-on');
594-
getEl('legend-icon')?.classList.remove('top-menu-icons-search-on');
595-
getEl('sound-icon')?.classList.remove('top-menu-icons-search-on');
596-
}, 500);
597-
this.uiManager_.hideSideMenus();
598-
this.hideResults();
599-
// getEl('menu-space-stations').classList.remove('bmenu-item-selected');
600-
// This is getting called too much. Not sure what it was meant to prevent?
601-
// colorSchemeManagerInstance.setColorScheme(colorSchemeManagerInstance.default, true);
602-
// this.uiManager_.colorSchemeChangeAlert(settingsManager.currentColorScheme);
603597
}
604598
}
605599
}

0 commit comments

Comments
 (0)