182 lines
		
	
	
		
			5.5 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			182 lines
		
	
	
		
			5.5 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <!DOCTYPE html>
 | |
| <html lang="de">
 | |
| <head>
 | |
|     <meta charset="UTF-8">
 | |
|     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 | |
|     <title>Text Cleaner</title>
 | |
|     <meta property="og:title" content="Text Cleaner">
 | |
|     <meta property="og:description" content="Entferne doppelte Zeilen aus einem Text">
 | |
|     <meta property="og:type" content="website">
 | |
|     <meta property="og:url" content="https://tools.ponywave.de/text_cleaner">
 | |
|     <script defer src="https://stats.ponywave.de/script" data-website-id="9ef713d2-adb9-4906-9df5-708d8a8b9131" data-tag="text_cleaner"></script>
 | |
|     <style>
 | |
|         :root {
 | |
|             --bg-color: #ffffff;
 | |
|             --text-color: #333333;
 | |
|             --input-bg: #f0f0f0;
 | |
|             --border-color: #cccccc;
 | |
|             --button-bg: #007bff;
 | |
|         }
 | |
| 
 | |
|         .dark-mode {
 | |
|             --bg-color: #1a1a1a;
 | |
|             --text-color: #e0e0e0;
 | |
|             --input-bg: #2d2d2d;
 | |
|             --border-color: #404040;
 | |
|             --button-bg: #0056b3;
 | |
|         }
 | |
| 
 | |
|         body {
 | |
|             font-family: Arial, sans-serif;
 | |
|             margin: 0;
 | |
|             padding: 20px;
 | |
|             background-color: var(--bg-color);
 | |
|             color: var(--text-color);
 | |
|             transition: background-color 0.3s, color 0.3s;
 | |
|         }
 | |
| 
 | |
|         .container {
 | |
|             max-width: 800px;
 | |
|             margin: 0 auto;
 | |
|         }
 | |
| 
 | |
|         .theme-switch {
 | |
|             position: absolute;
 | |
|             top: 20px;
 | |
|             right: 20px;
 | |
|         }
 | |
| 
 | |
|         .text-boxes {
 | |
|             display: flex;
 | |
|             gap: 20px;
 | |
|             margin-top: 40px;
 | |
|         }
 | |
| 
 | |
|         textarea {
 | |
|             flex: 1;
 | |
|             height: 300px;
 | |
|             padding: 10px;
 | |
|             background-color: var(--input-bg);
 | |
|             border: 1px solid var(--border-color);
 | |
|             color: var(--text-color);
 | |
|             border-radius: 4px;
 | |
|             resize: vertical;
 | |
|         }
 | |
| 
 | |
|         .button-group {
 | |
|             display: flex;
 | |
|             gap: 10px;
 | |
|             justify-content: center;
 | |
|             margin: 20px 0;
 | |
|         }
 | |
| 
 | |
|         button {
 | |
|             padding: 10px 20px;
 | |
|             background-color: var(--button-bg);
 | |
|             color: white;
 | |
|             border: none;
 | |
|             border-radius: 4px;
 | |
|             cursor: pointer;
 | |
|             transition: background-color 0.2s;
 | |
|         }
 | |
| 
 | |
|         button:hover {
 | |
|             opacity: 0.9;
 | |
|         }
 | |
| 
 | |
|         #themeButton {
 | |
|             padding: 8px 15px;
 | |
|             font-size: 1.2em;
 | |
|             background-color: var(--input-bg);
 | |
|             color: var(--text-color);
 | |
|         }
 | |
|     </style>
 | |
| </head>
 | |
| <body>
 | |
|     <div class="container">
 | |
|         <button id="themeButton" class="theme-switch" onclick="toggleTheme()">🌙</button>
 | |
| 
 | |
|         <div class="text-boxes">
 | |
|             <textarea id="input" placeholder="Eingabe..."></textarea>
 | |
|             <textarea id="output" readonly placeholder="Bereinigter Text..."></textarea>
 | |
|         </div>
 | |
| 
 | |
|         <div class="button-group">
 | |
|             <button onclick="removeDuplicates()">Duplikate entfernen</button>
 | |
|             <button onclick="copyOutput()">📋 Kopieren</button>
 | |
|         </div>
 | |
|     </div>
 | |
| 
 | |
|     <script>
 | |
|         // Theme Handling
 | |
|         const themeButton = document.getElementById('themeButton');
 | |
|         const body = document.body;
 | |
| 
 | |
|         function updateThemeButton() {
 | |
|             themeButton.textContent = body.classList.contains('dark-mode') ? '☀️' : '🌙';
 | |
|         }
 | |
| 
 | |
|         function applySystemTheme() {
 | |
|             const systemDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
 | |
|             if (systemDark && !localStorage.getItem('theme')) {
 | |
|                 body.classList.add('dark-mode');
 | |
|             }
 | |
|             updateThemeButton();
 | |
|         }
 | |
| 
 | |
|         function toggleTheme() {
 | |
|             body.classList.toggle('dark-mode');
 | |
|             localStorage.setItem('theme', body.classList.contains('dark-mode') ? 'dark' : 'light');
 | |
|             updateThemeButton();
 | |
|         }
 | |
| 
 | |
|         // Initial Theme Setup
 | |
|         const savedTheme = localStorage.getItem('theme');
 | |
|         if (savedTheme) {
 | |
|             body.classList.toggle('dark-mode', savedTheme === 'dark');
 | |
|         } else {
 | |
|             applySystemTheme();
 | |
|         }
 | |
| 
 | |
|         // System Theme Change Listener
 | |
|         window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', e => {
 | |
|             if (!localStorage.getItem('theme')) {
 | |
|                 body.classList.toggle('dark-mode', e.matches);
 | |
|                 updateThemeButton();
 | |
|             }
 | |
|         });
 | |
| 
 | |
|         // Text Processing
 | |
|         function removeDuplicates() {
 | |
|             const input = document.getElementById('input').value;
 | |
|             const lines = input.split('\n');
 | |
|             const seen = new Set();
 | |
|             const result = [];
 | |
| 
 | |
|             for (const line of lines) {
 | |
|                 const trimmedLine = line.trim();
 | |
|                 if (trimmedLine && !seen.has(trimmedLine)) {
 | |
|                     seen.add(trimmedLine);
 | |
|                     result.push(trimmedLine);
 | |
|                 }
 | |
|             }
 | |
| 
 | |
|             document.getElementById('output').value = result.join('\n');
 | |
|         }
 | |
| 
 | |
|         // Copy Function
 | |
|         function copyOutput() {
 | |
|             const output = document.getElementById('output');
 | |
|             output.select();
 | |
|             try {
 | |
|                 document.execCommand('copy');
 | |
|                 const btn = event.target;
 | |
|                 btn.textContent = '✓ Kopiert!';
 | |
|                 setTimeout(() => btn.textContent = '📋 Kopieren', 1500);
 | |
|             } catch (err) {
 | |
|                 alert('Kopieren fehlgeschlagen. Bitte manuell kopieren.');
 | |
|             }
 | |
|         }
 | |
|     </script>
 | |
| </body>
 | |
| </html> |