User:Polygnotus/Scripts/Claude4.js: Difference between revisions

Content deleted Content added
Created page with '(function() { 'use strict'; class WikipediaClaudeProofreader { constructor() { this.apiKey = localStorage.getItem('claude_api_key'); this.sidebarWidth = localStorage.getItem('claude_sidebar_width') || '350px'; this.isVisible = localStorage.getItem('claude_sidebar_visible') !== 'false'; this.currentResults = localStorage.getItem('claude_current_results') || ''; this.init(); }...'
 
No edit summary
 
(10 intermediate revisions by the same user not shown)
Line 30:
<button id="claude-proofread-btn" ${!this.apiKey ? 'style="display:none"' : ''}>Proofread Article</button>
<button id="claude-change-key-btn" ${!this.apiKey ? 'style="display:none"' : ''}>Change Key</button>
<button id="claude-clear-btn" ${!this.currentResults ? 'style="display:none"' : ''}>Clear Results</button>
</div>
<div id="claude-results">
Line 188 ⟶ 187:
#ca-claude a:hover {
text-decoration: underline !important;
}
/* Universal theme compatibility - push all content to the left */
body.claude-sidebar-visible {
margin-right: ${this.sidebarWidth} !important;
max-width: calc(100% - ${this.sidebarWidth}) !important;
}
/* Target specific Wikipedia theme containers */
body.claude-sidebar-visible .mw-page-container,
body.claude-sidebar-visible .mw-page-container-inner,
body.claude-sidebar-visible #mw-page-base,
body.claude-sidebar-visible #mw-head-base,
body.claude-sidebar-visible #mw-head,
body.claude-sidebar-visible #content,
body.claude-sidebar-visible #footer,
body.claude-sidebar-visible .vector-header,
body.claude-sidebar-visible .vector-main,
body.claude-sidebar-visible .vector-footer,
body.claude-sidebar-visible #globalWrapper,
body.claude-sidebar-visible .skin-vector,
body.claude-sidebar-visible .skin-vector-legacy,
body.claude-sidebar-visible .skin-monobook,
body.claude-sidebar-visible .skin-timeless {
margin-right: ${this.sidebarWidth} !important;
max-width: calc(100% - ${this.sidebarWidth}) !important;
}
/* Additional targeting for persistent elements */
body.claude-sidebar-visible .vector-header-container,
body.claude-sidebar-visible .vector-main-menu,
body.claude-sidebar-visible .vector-search-box,
body.claude-sidebar-visible .vector-user-menu,
body.claude-sidebar-visible #p-personal,
body.claude-sidebar-visible #right-navigation,
body.claude-sidebar-visible #left-navigation {
margin-right: ${this.sidebarWidth} !important;
max-width: calc(100% - ${this.sidebarWidth}) !important;
}
/* Ensure fixed positioned elements are also pushed */
body.claude-sidebar-visible .vector-sticky-header,
body.claude-sidebar-visible .vector-header-sticky {
right: ${this.sidebarWidth} !important;
width: calc(100% - ${this.sidebarWidth}) !important;
}
Line 244 ⟶ 198:
/* Hidden state styles */
body.claude-sidebar-hidden #claude-proofreader-sidebar {
display: none;
}
body.claude-sidebar-hidden #ca-claude {
display: list-item !important;
}
/* Reset all margins when sidebar is hidden */
body:not(.claude-sidebar-visible) {
margin-right: 0 !important;
max-width: none !important;
}
body:not(.claude-sidebar-visible) .mw-page-container,
body:not(.claude-sidebar-visible) .mw-page-container-inner,
body:not(.claude-sidebar-visible) #mw-page-base,
body:not(.claude-sidebar-visible) #mw-head-base,
body:not(.claude-sidebar-visible) #mw-head,
body:not(.claude-sidebar-visible) #content,
body:not(.claude-sidebar-visible) #footer,
body:not(.claude-sidebar-visible) .vector-header,
body:not(.claude-sidebar-visible) .vector-main,
body:not(.claude-sidebar-visible) .vector-footer,
body:not(.claude-sidebar-visible) #globalWrapper,
body:not(.claude-sidebar-visible) .skin-vector,
body:not(.claude-sidebar-visible) .skin-vector-legacy,
body:not(.claude-sidebar-visible) .skin-monobook,
body:not(.claude-sidebar-visible) .skin-timeless,
body:not(.claude-sidebar-visible) .vector-header-container,
body:not(.claude-sidebar-visible) .vector-main-menu,
body:not(.claude-sidebar-visible) .vector-search-box,
body:not(.claude-sidebar-visible) .vector-user-menu,
body:not(.claude-sidebar-visible) #p-personal,
body:not(.claude-sidebar-visible) #right-navigation,
body:not(.claude-sidebar-visible) #left-navigation {
margin-right: 0 !important;
max-width: none !important;
}
body:not(.claude-sidebar-visible) .vector-sticky-header,
body:not(.claude-sidebar-visible) .vector-header-sticky {
right: 0 !important;
width: 100% !important;
}
`;
Line 299 ⟶ 217:
}
createClaudeTab() {
// Only create tab if we're in the main article namespace (namespace 0)
if (typeof mw !== 'undefined' && mw.config.get('wgNamespaceNumber') >=== 0) {
// Create the Claude tab
const claudeTab = document.createElement('li');
claudeTab.id = 'ca-claude';
claudeTab.className = 'mw-list-item';
const claudeLink = document.createElement('a');
claudeLink.href = '#';
claudeLink.title = 'Proofread with Claude AI';
claudeLink.textContent = 'Claude';
claudeLink.addEventListener('click', (e) => {
e.preventDefault();
this.showSidebar();
});
const claudeSpan = document.createElement('span');
claudeSpan.textContent = 'Claude';
claudeLink.appendChild(claudeSpan);
claudeTab.appendChild(claudeLink);
Line 378 ⟶ 300:
style.setAttribute('data-claude-proofreader', 'true');
style.textContent = `
body.claude/* Vector 2022 theme -sidebar-visible {comprehensive approach */
body.claude-sidebar-visible .mw-page-container {
margin-right: ${this.sidebarWidth} !important;
maxbox-widthsizing: calc(100% border- ${this.sidebarWidth})box !important;
}
body.claude-sidebar-visible .mw-page-container,
body.claude-sidebar-visible/* Vector 2022 .mw-page-container-inner, main content wrapper */
body.claude-sidebar-visible #.mw-page-base,container-inner {
body.claude-sidebar-visible #mw margin-head-base,right: 0 !important;
body.claude-sidebar-visible #mw padding-head,right: 0 !important;
body.claude max-sidebar-visiblewidth: none #content,!important;
body.claude-sidebar-visible #footer,}
body.claude-sidebar-visible .vector-header,
body.claude-sidebar-visible/* Vector 2022 .vector-main, content area */
body.claude-sidebar-visible .vectormw-footer,content-container {
body.claude max-sidebar-visiblewidth: none #globalWrapper,!important;
body.claude-sidebar-visible .skin margin-vector,right: 0 !important;
body.claude-sidebar-visible .skin-vector-legacy,}
body.claude-sidebar-visible .skin-monobook,
body.claude-sidebar-visible/* Vector 2022 .skin-timeless, article content */
body.claude-sidebar-visible .vectormw-header-container,body {
body.claude-sidebar-visible .vector margin-main-menu,right: 0 !important;
body.claude-sidebar-visible .vector max-search-box,width: none !important;
body.claude-sidebar-visible .vector-user-menu,}
body.claude-sidebar-visible #p-personal,
body.claude-sidebar-visible/* Vector 2022 #right-navigation, main content */
body.claude-sidebar-visible #left-navigationcontent {
margin-right: 0 !important;
max-width: none !important;
}
/* Legacy Vector and other themes */
body.claude-sidebar-visible #globalWrapper {
margin-right: ${this.sidebarWidth} !important;
maxbox-widthsizing: calc(100% border- ${this.sidebarWidth}) !importantbox;
}
/* Header adjustments */
body.claude-sidebar-visible .vector-header,
body.claude-sidebar-visible .vector-sticky-header,
body.claude-sidebar-visible .vector#mw-header-stickyhead {
right: ${this.sidebarWidth} !important;
width: calc(100% - ${this.sidebarWidth}) !important;
box-sizing: border-box;
}
`;
Line 437 ⟶ 370:
}
adjustMainContent() {
// Only apply layout changes when sidebar is actually visible
if (this.isVisible) {
document.body.classList.add('claude-sidebar-visible');
Line 457 ⟶ 391:
document.getElementById('claude-proofread-btn').addEventListener('click', () => {
this.proofreadArticle();
});
document.getElementById('claude-clear-btn').addEventListener('click', () => {
this.clearResults();
});
}
Line 480 ⟶ 411:
localStorage.removeItem('claude_current_results');
this.updateOutput('');
document.getElementById('claude-clear-btn').style.display = 'none';
this.updateStatus('Results cleared. Ready to proofread.');
}
Line 497 ⟶ 427:
outputEl.textContent = content;
}
// Store results and show clear button
if (content) {
this.currentResults = content;
localStorage.setItem('claude_current_results', content);
document.getElementById('claude-clear-btn').style.display = 'inline-block';
}
}