Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

profile name shown on action bar #1799

Merged
merged 7 commits into from
Feb 18, 2025
Merged

profile name shown on action bar #1799

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
67b8bf1
profile name shown on action bar
Mjishu Feb 3, 2025
bbde265
removed verbose function, used css instead
Mjishu Feb 5, 2025
bce5de9
resolved uneeded code
Mjishu Feb 11, 2025
2d372e5
updates current profile from extension icon profile-switch
Mjishu Feb 11, 2025
bc9010c
cleaned up
Mjishu Feb 11, 2025
404da78
updates profile-name from extension icon change
Mjishu Feb 11, 2025
d4083b7
only shows profile button if more than 1 profile
Mjishu Feb 11, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions ext/css/display.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -475,6 +475,7 @@ a:has(rt) {
background-color: var(--sidebar-background-color);
display: flex;
flex-flow: column nowrap;
align-items: center;
}
:root[data-popup-action-bar-location=top] .content-outer,
:root[data-popup-action-bar-location=bottom] .content-outer {
Expand Down Expand Up @@ -579,6 +580,11 @@ button.sidebar-button.sidebar-button-highlight {
--button-active-content-color: var(--accent-color);
}

.vertical-text {
writing-mode: vertical-rl;
text-orientation: vertical;
letter-spacing: 2px;
}

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

whitespace change

/* Search page */
.search-header-wrapper {
Expand Down
14 changes: 14 additions & 0 deletions ext/js/display/display-profile-selection.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,13 +42,16 @@ export class DisplayProfileSelection {
this._eventListeners = new EventListenerCollection();
/** @type {string} */
this._source = generateId(16);
/** @type {HTMLElement} */
this._profileName = querySelectorNotNull(document, '#profile-name');
}

/** */
async prepare() {
this._display.application.on('optionsUpdated', this._onOptionsUpdated.bind(this));
this._profileButton.addEventListener('click', this._onProfileButtonClick.bind(this), false);
this._profileListNeedsUpdate = true;
await this._updateCurrentProfileName();
}

// Private
Expand Down Expand Up @@ -85,6 +88,15 @@ export class DisplayProfileSelection {
}
}

/**
*
*/
async _updateCurrentProfileName() {
const {profileCurrent, profiles} = await this._display.application.api.optionsGetFull();
const currentProfile = profiles[profileCurrent];
this._profileName.textContent = currentProfile.name;
}

/** */
async _updateProfileList() {
this._profileListNeedsUpdate = false;
Expand All @@ -109,6 +121,7 @@ export class DisplayProfileSelection {
}
this._profileList.textContent = '';
this._profileList.appendChild(fragment);
await this._updateCurrentProfileName();
}

/**
Expand Down Expand Up @@ -136,5 +149,6 @@ export class DisplayProfileSelection {
};
await this._display.application.api.modifySettings([modification], this._source);
this._setProfilePanelVisible(false);
await this._updateCurrentProfileName();
}
}
18 changes: 18 additions & 0 deletions ext/js/display/display.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -199,6 +199,8 @@ export class Display extends EventDispatcher {
this._languageSummaries = [];
/** @type {import('dictionary-importer').Summary[]} */
this._dictionaryInfo = [];
/** @type {?HTMLElement} */
this._profileName = document.querySelector('#profile-name');
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

variable now unused?


/* eslint-disable @stylistic/no-multi-spaces */
this._hotkeyHandler.registerActions([
Expand Down Expand Up @@ -486,6 +488,8 @@ export class Display extends EventDispatcher {
this._updateContentTextScanner(options);

this.trigger('optionsUpdated', {options});

await this._updateCurrentProfileDisplay(options);
}

/**
Expand Down Expand Up @@ -2280,4 +2284,18 @@ export class Display extends EventDispatcher {
this._searchHeader.classList.toggle('sticky-header', options.general.stickySearchHeader);
}
}

/**
* @param {import('settings').ProfileOptions} currentProfile
*/
async _updateCurrentProfileDisplay(currentProfile) {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe it would be simpler to not have this function, and just use CSS like

[data-popup-action-bar-location="right"] .sidebar-profile-name,
[data-popup-action-bar-location="left"] .sidebar-profile-name {
    writing-mode: vertical-rl;
    text-orientation: vertical;
    letter-spacing: 2px;
}

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

that makes life a lot easier @.@!

if (!this._profileName) {
return;
}
if (currentProfile.general.popupActionBarLocation === 'left' || currentProfile.general.popupActionBarLocation === 'right') {
this._profileName.classList.add('vertical-text');
} else {
this._profileName.classList.remove('vertical-text');
}
}
}
1 change: 1 addition & 0 deletions ext/popup.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,7 @@ <h3>Default Profile</h3>
<button type="button" class="sidebar-button" disabled id="navigate-next-button" title="Next definition" data-hotkey='["historyForward","title","Next definition ({0})"]'><span class="sidebar-button-icon icon" data-icon="right-chevron"></span></button>
</div>
<div class="content-sidebar-bottom">
<p class="sidebar-profile-language" id="profile-name"></p>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

sidebar-profile-language -> sidebar-profile-name

<button type="button" class="sidebar-button" id="profile-button"><span class="sidebar-button-icon icon" data-icon="profile"></span></button>
</div>
</div>
Expand Down
Loading