BetterSEQTA/BetterSEQTA-Plus
1
0
Fork 0
mirror of https://github.com/BetterSEQTA/BetterSEQTA-Plus.git synced 2026-06-06 03:34:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

remove editor

Browse Source
This commit is contained in:
sethburkart123
2024-07-02 20:24:51 +10:00
parent 9b8ed30d4e
commit 49e1924a88
5 changed files with 0 additions and 167 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/SEQTA.ts
-6
View File
@@ -27,7 +27,6 @@ import { initializeSettingsState, settingsState } from './seqta/utils/listeners/
import { StorageChangeHandler } from './seqta/utils/listeners/StorageChanges'
import { AddBetterSEQTAElements } from './seqta/ui/AddBetterSEQTAElements'
import { eventManager } from './seqta/utils/listeners/EventManager'
import handleComposeMessage from './seqta/ui/customMessageEditor'
declare global {
interface Window {
@@ -561,11 +560,6 @@ async function LoadPageElements(): Promise<void> {
className: 'timetablepage',
}, handleTimetable);
eventManager.register('composeMessage', {
elementType: 'div',
customCheck: (element: Element) => element.querySelector('.coneqtMessage') !== null
}, handleComposeMessage);
await handleSublink(sublink);
}
src/interface/main.tsx
-2
View File
@@ -10,7 +10,6 @@ import font from '../resources/fonts/IconFamily.woff'
import ThemeCreator from './pages/ThemeCreator';
import Store from './pages/Store';
import Editor from './pages/Editor';
browser.storage.local.get().then(({ DarkMode }) => {
if (DarkMode) document.documentElement.classList.add('dark');
@@ -53,7 +52,6 @@ root.render(
<Route path="/settings/embedded" element={<SettingsPage standalone={false} />} />
<Route path="/store" element={<Store />} />
<Route path="/themeCreator" element={<ThemeCreator />} />
<Route path="/editor" element={<Editor />} />
</Routes>
</HashRouter>
</ErrorBoundary>
src/interface/pages/Editor.css
-15
View File
@@ -1,15 +0,0 @@
body {
background: transparent !important;
}
.bn-container[data-color-scheme=dark] {
--bn-colors-editor-background: #18181B00 !important;
}
.bn-container > [contenteditable="true"] {
height: 100vh !important;
}
.ProseMirror {
background: transparent !important;
}
src/interface/pages/Editor.tsx
-23
View File
@@ -1,23 +0,0 @@
import "@blocknote/core/fonts/inter.css";
import { useCreateBlockNote } from "@blocknote/react";
import { BlockNoteView } from "@blocknote/mantine";
import "@blocknote/mantine/style.css";
import './Editor.css'
export default function Editor() {
const editor = useCreateBlockNote({});
editor._tiptapEditor.on('update', () => {
window.parent.postMessage({
type: 'message-html',
data: editor._tiptapEditor.getHTML(),
}, '*')
})
return (
<div className="h-screen">
<BlockNoteView editor={editor} />
</div>
)
}
src/seqta/ui/customMessageEditor.ts
-121
View File
@@ -1,121 +0,0 @@
import stringToHTML from "../utils/stringToHTML";
import browser from 'webextension-polyfill';
import styles from "@blocknote/mantine/style.css?raw";
export default async function handleComposeMessage(): Promise<void> {
console.log('COMPOSE MESSAGE!');
const container: HTMLElement | null = document.querySelector('.pane .footer .pillbox');
const simpleEditorButton: HTMLButtonElement | null = document.querySelector('.pane .footer .pillbox button.first') as HTMLButtonElement;
if (container && simpleEditorButton) {
const buttonHTML = /* html */ `
<button class="button" id="betterEditorButton">
Better Editor
</button>
`;
const button: HTMLElement = stringToHTML(buttonHTML);
// Check if the button already exists
if (!container.querySelector('#betterEditorButton')) {
// Insert the new button after the Simple editor button
simpleEditorButton.insertAdjacentElement('afterend', button.firstElementChild as HTMLElement);
}
// Add click event listeners to the container (event delegation)
container.addEventListener('click', handleButtonClick);
}
}
function handleButtonClick(event: MouseEvent): void {
console.log('handleButtonClick', event);
const target = event.target as HTMLElement;
if (target.tagName !== 'BUTTON') return;
const container = target.closest('.pillbox') as HTMLElement;
if (!container) return;
const simpleEditorButton = container.querySelector('button.first') as HTMLButtonElement;
const betterEditorButton = container.querySelector('#betterEditorButton') as HTMLButtonElement;
if (!simpleEditorButton || !betterEditorButton) {
console.error('Could not find Simple Editor or Better Editor buttons');
return;
}
const isBetterEditorButton = target === betterEditorButton;
const isSimpleEditorButton = target === simpleEditorButton;
if (isBetterEditorButton) {
activateBetterEditor(simpleEditorButton, betterEditorButton);
} else if (isSimpleEditorButton) {
activateSimpleEditor(simpleEditorButton, betterEditorButton);
} else {
deactivateBetterEditor(simpleEditorButton, betterEditorButton);
}
container.querySelectorAll('button').forEach(btn => btn.classList.remove('depressed'));
target.classList.add('depressed');
}
function activateBetterEditor(simpleEditorButton: HTMLButtonElement, betterEditorButton: HTMLButtonElement): void {
// Programmatically click the Simple Editor button first
simpleEditorButton.click();
// Then proceed with Better Editor activation
simpleEditorButton.classList.remove('depressed');
betterEditorButton.classList.add('depressed');
const ckeInner = document.querySelector('.pane .cke_inner') as HTMLElement;
if (ckeInner) ckeInner.style.display = 'none';
let extensionEditor: HTMLIFrameElement | null = document.querySelector('.extension-editor') as HTMLIFrameElement;
if (extensionEditor) {
extensionEditor.style.display = 'block';
} else {
const extensionEditorIframe: HTMLIFrameElement = document.createElement('iframe');
extensionEditorIframe.src = `${browser.runtime.getURL('src/interface/index.html')}#editor`;
extensionEditorIframe.setAttribute('allowTransparency', 'true');
extensionEditorIframe.setAttribute('excludeDarkCheck', 'true');
extensionEditorIframe.classList.add('extension-editor');
document.getElementById('cke_editor1')?.appendChild(extensionEditorIframe);
}
extensionEditor = document.querySelector('.extension-editor') as HTMLIFrameElement;
const ckeEditor = document.querySelector('#cke_1_contents iframe.cke_wysiwyg_frame') as HTMLIFrameElement;
window.addEventListener('message', (event) => handleEditorMessage(event, ckeEditor), { once: true });
}
function activateSimpleEditor(simpleEditorButton: HTMLButtonElement, betterEditorButton: HTMLButtonElement): void {
simpleEditorButton.classList.add('depressed');
betterEditorButton.classList.remove('depressed');
const ckeInner = document.querySelector('.pane .cke_inner') as HTMLElement;
const extensionEditor = document.querySelector('.extension-editor') as HTMLIFrameElement;
if (ckeInner) ckeInner.style.removeProperty('display')
if (extensionEditor) extensionEditor.style.display = 'none'
}
function deactivateBetterEditor(simpleEditorButton: HTMLButtonElement, betterEditorButton: HTMLButtonElement): void {
const ckeInner = document.querySelector('.pane .cke_inner') as HTMLElement;
const ckeContents = document.querySelector('.pane .cke_contents') as HTMLElement;
const extensionEditor = document.querySelector('.extension-editor') as HTMLIFrameElement;
if (ckeInner) ckeInner.style.removeProperty('display');
if (ckeContents) ckeContents.style.removeProperty('display');
if (extensionEditor) extensionEditor.style.removeProperty('display');
simpleEditorButton.classList.remove('depressed');
betterEditorButton.classList.remove('depressed');
}
function handleEditorMessage(event: MessageEvent, ckeEditor: HTMLIFrameElement): void {
if (!event.origin.includes(browser.runtime.id) || event.data.type !== "message-html") return;
if (ckeEditor.contentDocument) {
ckeEditor.contentDocument.body.innerHTML = event.data.data + `<style>${styles}</style>`;
}
}