mirror of
https://github.com/obsqrbtz/goose-highlighter.git
synced 2026-04-09 12:37:48 +03:00
Compare commits
15 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
4f575d9534 | ||
| affddd3dbc | |||
|
|
c8334f9e68 | ||
| 172aa7583b | |||
|
|
6d7d9ac151 | ||
| 5ef380e544 | |||
|
|
c634f6bc8b | ||
| 67577c89cf | |||
|
|
326e585021 | ||
| 8be53f3240 | |||
| f07617fa55 | |||
| e79874922a | |||
| 71216cbcd9 | |||
| f292bd7149 | |||
| 584ced252f |
6
.github/workflows/publish-extension.yml
vendored
6
.github/workflows/publish-extension.yml
vendored
@@ -2,7 +2,8 @@ name: Publish Chrome Extension
|
|||||||
|
|
||||||
on:
|
on:
|
||||||
push:
|
push:
|
||||||
branches: [ main ]
|
tags:
|
||||||
|
- 'v*'
|
||||||
|
|
||||||
jobs:
|
jobs:
|
||||||
publish:
|
publish:
|
||||||
@@ -32,6 +33,9 @@ jobs:
|
|||||||
id: version
|
id: version
|
||||||
run: echo "VERSION=${GITHUB_REF#refs/tags/v}" >> $GITHUB_OUTPUT
|
run: echo "VERSION=${GITHUB_REF#refs/tags/v}" >> $GITHUB_OUTPUT
|
||||||
|
|
||||||
|
- name: Update manifest version
|
||||||
|
run: node scripts/update-manifest-version.js ${{ steps.version.outputs.VERSION }}
|
||||||
|
|
||||||
- name: Create zip package
|
- name: Create zip package
|
||||||
run: |
|
run: |
|
||||||
zip -r goose-highlighter.zip . -x '*.git*' 'node_modules/*' 'src/*' 'scripts/*' 'versioning.md' '.releaserc.json' 'package.json' 'package-lock.json' 'README.md' 'tsconfig.json' 'eslint.config.mjs'
|
zip -r goose-highlighter.zip . -x '*.git*' 'node_modules/*' 'src/*' 'scripts/*' 'versioning.md' '.releaserc.json' 'package.json' 'package-lock.json' 'README.md' 'tsconfig.json' 'eslint.config.mjs'
|
||||||
|
|||||||
35
CHANGELOG.md
35
CHANGELOG.md
@@ -1,3 +1,38 @@
|
|||||||
|
## [1.9.2](https://github.com/obsqrbtz/goose-highlighter/compare/v1.9.1...v1.9.2) (2025-11-14)
|
||||||
|
|
||||||
|
|
||||||
|
### Bug Fixes
|
||||||
|
|
||||||
|
* **highlight:** prevent creating extra <span>'s ([#1](https://github.com/obsqrbtz/goose-highlighter/issues/1)) ([affddd3](https://github.com/obsqrbtz/goose-highlighter/commit/affddd3dbc7de30100ca134ec65f4dc090275ca5))
|
||||||
|
|
||||||
|
## [1.9.1](https://github.com/obsqrbtz/goose-highlighter/compare/v1.9.0...v1.9.1) (2025-11-05)
|
||||||
|
|
||||||
|
|
||||||
|
### Bug Fixes
|
||||||
|
|
||||||
|
* remove halowen styling ([172aa75](https://github.com/obsqrbtz/goose-highlighter/commit/172aa7583b325761af43c780db4ac61dc4bda99b))
|
||||||
|
|
||||||
|
# [1.9.0](https://github.com/obsqrbtz/goose-highlighter/compare/v1.8.5...v1.9.0) (2025-10-31)
|
||||||
|
|
||||||
|
|
||||||
|
### Features
|
||||||
|
|
||||||
|
* haloween styling ([5ef380e](https://github.com/obsqrbtz/goose-highlighter/commit/5ef380e54447f45f7360dd4b7b84456aae55bfee))
|
||||||
|
|
||||||
|
## [1.8.5](https://github.com/obsqrbtz/goose-highlighter/compare/v1.8.4...v1.8.5) (2025-10-29)
|
||||||
|
|
||||||
|
|
||||||
|
### Bug Fixes
|
||||||
|
|
||||||
|
* highlight colors when multiple list have different configurations ([67577c8](https://github.com/obsqrbtz/goose-highlighter/commit/67577c89cffca1ab6d40a8913e51b7c3c6f91c85))
|
||||||
|
|
||||||
|
## [1.8.4](https://github.com/obsqrbtz/goose-highlighter/compare/v1.8.3...v1.8.4) (2025-10-28)
|
||||||
|
|
||||||
|
|
||||||
|
### Bug Fixes
|
||||||
|
|
||||||
|
* do not re-highlight when already processing highlights ([8be53f3](https://github.com/obsqrbtz/goose-highlighter/commit/8be53f32402c2f0f228ca003ef3805c5ff0b6e88))
|
||||||
|
|
||||||
## [1.8.3](https://github.com/obsqrbtz/goose-highlighter/compare/v1.8.2...v1.8.3) (2025-10-08)
|
## [1.8.3](https://github.com/obsqrbtz/goose-highlighter/compare/v1.8.2...v1.8.3) (2025-10-08)
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
# Goose Highlighter
|
# <img src="img/logo.png" alt="Goose Highlighter Logo" width="32" style="vertical-align: middle;"> Goose Highlighter
|
||||||
|
|
||||||
Goose Highlighter is a browser extension that allows you to highlight words on any webpage.
|
Goose Highlighter is a browser extension that allows you to highlight words on any webpage.
|
||||||
|
|
||||||
|
|||||||
BIN
img/logo.png
Normal file
BIN
img/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 MiB |
@@ -2,7 +2,7 @@
|
|||||||
"manifest_version": 3,
|
"manifest_version": 3,
|
||||||
"name": "__MSG_extension_name__",
|
"name": "__MSG_extension_name__",
|
||||||
"description": "__MSG_extension_description__",
|
"description": "__MSG_extension_description__",
|
||||||
"version": "1.8.3",
|
"version": "1.9.2",
|
||||||
"default_locale": "en",
|
"default_locale": "en",
|
||||||
"permissions": [
|
"permissions": [
|
||||||
"scripting",
|
"scripting",
|
||||||
|
|||||||
@@ -613,3 +613,39 @@ body::-webkit-scrollbar-corner,
|
|||||||
.exception-remove:hover {
|
.exception-remove:hover {
|
||||||
background: #d00030;
|
background: #d00030;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Footer Styles */
|
||||||
|
.footer {
|
||||||
|
margin-top: 16px;
|
||||||
|
padding: 12px 16px;
|
||||||
|
border-top: 1px solid var(--input-border);
|
||||||
|
background: var(--section-bg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer-content {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 0.8em;
|
||||||
|
color: var(--text-color);
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.version {
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.github-link {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 4px;
|
||||||
|
color: var(--text-color);
|
||||||
|
text-decoration: none;
|
||||||
|
opacity: 0.7;
|
||||||
|
transition: opacity 0.2s ease, color 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.github-link:hover {
|
||||||
|
opacity: 1;
|
||||||
|
color: var(--accent);
|
||||||
|
}
|
||||||
@@ -149,6 +149,16 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<footer class="footer">
|
||||||
|
<div class="footer-content">
|
||||||
|
<span class="version">v<span id="version-number">...</span></span>
|
||||||
|
<a href="https://github.com/obsqrbtz/goose-highlighter" target="_blank" class="github-link">
|
||||||
|
<i class="fa-brands fa-github"></i>
|
||||||
|
<span>GitHub</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
|
||||||
<script type="module" src="../dist/popup/popup.js"></script>
|
<script type="module" src="../dist/popup/popup.js"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
|
|||||||
@@ -68,7 +68,7 @@ export class ContentScript {
|
|||||||
}
|
}
|
||||||
|
|
||||||
private setupScrollHandler(): void {
|
private setupScrollHandler(): void {
|
||||||
const debouncedProcess = DOMUtils.debounce(() => this.processHighlights(), 300);
|
const debouncedProcess = DOMUtils.debounce(() => this.processHighlights(), CONSTANTS.DEBOUNCE_DELAY);
|
||||||
window.addEventListener('scroll', debouncedProcess);
|
window.addEventListener('scroll', debouncedProcess);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -5,25 +5,31 @@ export class HighlightEngine {
|
|||||||
private styleSheet: CSSStyleSheet | null = null;
|
private styleSheet: CSSStyleSheet | null = null;
|
||||||
private wordStyleMap = new Map<string, string>();
|
private wordStyleMap = new Map<string, string>();
|
||||||
private observer: MutationObserver;
|
private observer: MutationObserver;
|
||||||
|
private isHighlighting = false;
|
||||||
|
|
||||||
constructor(private onUpdate: () => void) {
|
constructor(private onUpdate: () => void) {
|
||||||
this.observer = new MutationObserver(DOMUtils.debounce((mutations: MutationRecord[]) => {
|
this.observer = new MutationObserver(DOMUtils.debounce((mutations: MutationRecord[]) => {
|
||||||
const hasRelevantChanges = mutations.some((mutation: MutationRecord) => {
|
if (this.isHighlighting) return;
|
||||||
|
|
||||||
|
const hasContentChanges = mutations.some((mutation: MutationRecord) => {
|
||||||
|
if (mutation.type !== 'childList') return false;
|
||||||
|
|
||||||
if (mutation.target instanceof Element && mutation.target.hasAttribute('data-gh')) {
|
if (mutation.target instanceof Element && mutation.target.hasAttribute('data-gh')) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
const addedNodes = Array.from(mutation.addedNodes);
|
|
||||||
const removedNodes = Array.from(mutation.removedNodes);
|
const allNodes = [...Array.from(mutation.addedNodes), ...Array.from(mutation.removedNodes)];
|
||||||
const isOurChange = [...addedNodes, ...removedNodes].some(node =>
|
return allNodes.some(node => {
|
||||||
node instanceof Element && (node.hasAttribute('data-gh') || node.querySelector('[data-gh]'))
|
if (node.nodeType === Node.TEXT_NODE) return true;
|
||||||
);
|
if (node instanceof Element && !node.hasAttribute('data-gh')) return true;
|
||||||
return !isOurChange;
|
return false;
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
if (hasRelevantChanges) {
|
if (hasContentChanges) {
|
||||||
onUpdate();
|
this.onUpdate();
|
||||||
}
|
}
|
||||||
}, 300));
|
}, CONSTANTS.DEBOUNCE_DELAY));
|
||||||
}
|
}
|
||||||
|
|
||||||
private initializeStyleSheet(): void {
|
private initializeStyleSheet(): void {
|
||||||
@@ -35,7 +41,7 @@ export class HighlightEngine {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
private updateWordStyles(activeWords: ActiveWord[]): void {
|
private updateWordStyles(activeWords: ActiveWord[], matchCase: boolean): void {
|
||||||
this.initializeStyleSheet();
|
this.initializeStyleSheet();
|
||||||
|
|
||||||
while (this.styleSheet!.cssRules.length > 0) {
|
while (this.styleSheet!.cssRules.length > 0) {
|
||||||
@@ -55,7 +61,7 @@ export class HighlightEngine {
|
|||||||
this.styleSheet!.insertRule(rule, this.styleSheet!.cssRules.length);
|
this.styleSheet!.insertRule(rule, this.styleSheet!.cssRules.length);
|
||||||
}
|
}
|
||||||
|
|
||||||
const lookup = word.text;
|
const lookup = matchCase ? word.text : word.text.toLowerCase();
|
||||||
this.wordStyleMap.set(lookup, uniqueStyles.get(styleKey)!);
|
this.wordStyleMap.set(lookup, uniqueStyles.get(styleKey)!);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -109,6 +115,9 @@ export class HighlightEngine {
|
|||||||
}
|
}
|
||||||
|
|
||||||
highlight(lists: HighlightList[], matchCase: boolean, matchWhole: boolean): void {
|
highlight(lists: HighlightList[], matchCase: boolean, matchWhole: boolean): void {
|
||||||
|
if (this.isHighlighting) return;
|
||||||
|
this.isHighlighting = true;
|
||||||
|
|
||||||
this.observer.disconnect();
|
this.observer.disconnect();
|
||||||
|
|
||||||
this.clearHighlightsInternal();
|
this.clearHighlightsInternal();
|
||||||
@@ -116,10 +125,11 @@ export class HighlightEngine {
|
|||||||
const activeWords = this.extractActiveWords(lists);
|
const activeWords = this.extractActiveWords(lists);
|
||||||
if (activeWords.length === 0) {
|
if (activeWords.length === 0) {
|
||||||
this.startObserving();
|
this.startObserving();
|
||||||
|
this.isHighlighting = false;
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
this.updateWordStyles(activeWords);
|
this.updateWordStyles(activeWords, matchCase);
|
||||||
|
|
||||||
const wordMap = new Map<string, ActiveWord>();
|
const wordMap = new Map<string, ActiveWord>();
|
||||||
for (const word of activeWords) {
|
for (const word of activeWords) {
|
||||||
@@ -141,20 +151,41 @@ export class HighlightEngine {
|
|||||||
for (const node of textNodes) {
|
for (const node of textNodes) {
|
||||||
if (!node.nodeValue || !pattern.test(node.nodeValue)) continue;
|
if (!node.nodeValue || !pattern.test(node.nodeValue)) continue;
|
||||||
|
|
||||||
const span = document.createElement('span');
|
const fragment = document.createDocumentFragment();
|
||||||
span.innerHTML = node.nodeValue.replace(pattern, (match) => {
|
const text = node.nodeValue;
|
||||||
const lookup = matchCase ? match : match.toLowerCase();
|
let lastIndex = 0;
|
||||||
const className = this.wordStyleMap.get(lookup) || 'highlighted-word-0';
|
|
||||||
return `<span data-gh class="${className}">${match}</span>`;
|
|
||||||
});
|
|
||||||
|
|
||||||
node.parentNode?.replaceChild(span, node);
|
pattern.lastIndex = 0;
|
||||||
|
let match;
|
||||||
|
|
||||||
|
while ((match = pattern.exec(text)) !== null) {
|
||||||
|
if (match.index > lastIndex) {
|
||||||
|
fragment.appendChild(document.createTextNode(text.substring(lastIndex, match.index)));
|
||||||
|
}
|
||||||
|
|
||||||
|
const lookup = matchCase ? match[0] : match[0].toLowerCase();
|
||||||
|
const className = this.wordStyleMap.get(lookup) || 'highlighted-word-0';
|
||||||
|
const highlightSpan = document.createElement('span');
|
||||||
|
highlightSpan.setAttribute('data-gh', '');
|
||||||
|
highlightSpan.className = className;
|
||||||
|
highlightSpan.textContent = match[0];
|
||||||
|
fragment.appendChild(highlightSpan);
|
||||||
|
|
||||||
|
lastIndex = pattern.lastIndex;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (lastIndex < text.length) {
|
||||||
|
fragment.appendChild(document.createTextNode(text.substring(lastIndex)));
|
||||||
|
}
|
||||||
|
|
||||||
|
node.parentNode?.replaceChild(fragment, node);
|
||||||
}
|
}
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.error('Regex error:', e);
|
console.error('Regex error:', e);
|
||||||
}
|
}
|
||||||
|
|
||||||
this.startObserving();
|
this.startObserving();
|
||||||
|
this.isHighlighting = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
private clearHighlightsInternal(): void {
|
private clearHighlightsInternal(): void {
|
||||||
@@ -182,8 +213,6 @@ export class HighlightEngine {
|
|||||||
this.observer.observe(document.body, {
|
this.observer.observe(document.body, {
|
||||||
childList: true,
|
childList: true,
|
||||||
subtree: true,
|
subtree: true,
|
||||||
characterData: true,
|
|
||||||
// Don't observe attribute changes to avoid triggering on our own style changes
|
|
||||||
attributes: false
|
attributes: false
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -15,8 +15,17 @@ function localizePage(): void {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function displayVersion(): void {
|
||||||
|
const manifest = chrome.runtime.getManifest();
|
||||||
|
const versionElement = document.getElementById('version-number');
|
||||||
|
if (versionElement && manifest.version) {
|
||||||
|
versionElement.textContent = manifest.version;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', async () => {
|
document.addEventListener('DOMContentLoaded', async () => {
|
||||||
localizePage();
|
localizePage();
|
||||||
|
displayVersion();
|
||||||
const controller = new PopupController();
|
const controller = new PopupController();
|
||||||
await controller.initialize();
|
await controller.initialize();
|
||||||
});
|
});
|
||||||
Reference in New Issue
Block a user