// EShip Extension Content Script
// Injects into protected website to enforce auth and apply tools
(function() {
'use strict';
// State
let isAuthenticated = false;
let currentTools = [];
let blockedOverlay = null;
// Initialize on page load
init();
async function init() {
// Check auth status immediately
const authResponse = await sendMessage({ action: 'CHECK_AUTH' });
if (authResponse.success && authResponse.authenticated) {
isAuthenticated = true;
await loadAndApplyTools();
} else {
isAuthenticated = false;
showBlockedScreen();
}
// Listen for messages from service worker (settings updates)
chrome.runtime.onMessage.addListener(handleMessage);
}
// Send message to service worker
function sendMessage(message) {
return new Promise((resolve) => {
chrome.runtime.sendMessage(message, (response) => {
if (chrome.runtime.lastError) {
resolve({ success: false, error: chrome.runtime.lastError.message });
} else {
resolve(response || { success: false, error: 'No response' });
}
});
});
}
// Handle incoming messages
function handleMessage(request, sender, sendResponse) {
switch (request.action) {
case 'SETTINGS_UPDATED':
currentTools = request.tools;
applyTools();
sendResponse({ success: true });
break;
case 'AUTH_CHANGED':
if (request.authenticated) {
isAuthenticated = true;
hideBlockedScreen();
loadAndApplyTools();
} else {
isAuthenticated = false;
showBlockedScreen();
}
sendResponse({ success: true });
break;
}
return true;
}
// Show blocked screen when not authenticated
function showBlockedScreen() {
// Wait for DOM to be ready
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', createBlockedOverlay);
} else {
createBlockedOverlay();
}
}
function createBlockedOverlay() {
// Remove existing overlay if any
hideBlockedScreen();
// Create overlay
blockedOverlay = document.createElement('div');
blockedOverlay.id = 'eship-blocked-overlay';
blockedOverlay.innerHTML = `
🔒
Zugriff gesperrt
Diese Website ist geschuetzt und erfordert eine Authentifizierung ueber die EShip Browser-Extension.
So melden Sie sich an:
- Klicken Sie auf das EShip-Icon in der Browser-Toolbar
- Geben Sie Ihre E-Mail und Passwort ein
- Klicken Sie auf "Anmelden"
- Die Seite wird automatisch freigeschaltet
`;
document.body.appendChild(blockedOverlay);
// Prevent scrolling on body
document.body.style.overflow = 'hidden';
}
// Hide blocked screen
function hideBlockedScreen() {
if (blockedOverlay) {
blockedOverlay.remove();
blockedOverlay = null;
document.body.style.overflow = '';
}
}
// Load and apply tool settings
async function loadAndApplyTools() {
const response = await sendMessage({ action: 'GET_SETTINGS' });
if (response.success) {
currentTools = response.tools;
applyTools();
}
}
// Apply all enabled tools
function applyTools() {
if (!isAuthenticated) return;
// Wait for DOM to be ready
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', () => executeTools());
} else {
executeTools();
}
}
function executeTools() {
currentTools.forEach(tool => {
if (tool.enabled) {
applyTool(tool);
} else {
removeTool(tool);
}
});
}
// Apply a specific tool
function applyTool(tool) {
switch (tool.id) {
case 'highlight_prices':
applyHighlightPrices(tool.settings);
break;
// Add more tools here as needed
default:
console.log('[EShip] Unknown tool:', tool.id);
}
}
// Remove a specific tool's effects
function removeTool(tool) {
switch (tool.id) {
case 'highlight_prices':
removeHighlightPrices(tool.settings);
break;
default:
break;
}
}
// ============================================
// TOOL: Highlight Prices
// ============================================
function applyHighlightPrices(settings) {
const selector = settings.selector || '.price';
const borderColor = settings.borderColor || '#ff0000';
const borderWidth = settings.borderWidth || '2px';
// Add custom style if not exists
let styleEl = document.getElementById('eship-highlight-prices-style');
if (!styleEl) {
styleEl = document.createElement('style');
styleEl.id = 'eship-highlight-prices-style';
document.head.appendChild(styleEl);
}
styleEl.textContent = `
${selector} {
border: ${borderWidth} solid ${borderColor} !important;
box-shadow: 0 0 8px ${borderColor}40 !important;
border-radius: 4px !important;
padding: 2px 4px !important;
transition: all 0.2s ease !important;
}
`;
// Also add data attribute to track highlighted elements
document.querySelectorAll(selector).forEach(el => {
el.dataset.eshipHighlighted = 'true';
});
console.log('[EShip] Highlight Prices applied with selector:', selector);
}
function removeHighlightPrices(settings) {
// Remove style element
const styleEl = document.getElementById('eship-highlight-prices-style');
if (styleEl) {
styleEl.remove();
}
// Remove data attributes
document.querySelectorAll('[data-eship-highlighted]').forEach(el => {
delete el.dataset.eshipHighlighted;
});
console.log('[EShip] Highlight Prices removed');
}
// ============================================
// Mutation Observer for dynamic content
// ============================================
// Re-apply tools when new content is added
const observer = new MutationObserver((mutations) => {
if (!isAuthenticated) return;
let shouldReapply = false;
mutations.forEach(mutation => {
if (mutation.addedNodes.length > 0) {
shouldReapply = true;
}
});
if (shouldReapply) {
// Debounce reapplication
clearTimeout(observer.timeout);
observer.timeout = setTimeout(() => {
applyTools();
}, 100);
}
});
// Start observing once DOM is ready
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', () => {
observer.observe(document.body, { childList: true, subtree: true });
});
} else {
observer.observe(document.body, { childList: true, subtree: true });
}
})();