Refactor symbols app: cleanup and fix issues

- Removed duplicate files (index2/3/4.html, symbols.js duplicates)
- Kept index4.html as the main index.html (modular version)
- Removed old text-generator.js (replaced by modular version)
- Fixed ID mismatch in ui-bindings.js to match HTML
- Added square and circle shape support in svg-generator.js
- Added legend preview with copy functionality
- Removed 580 lines of obsolete text-generator v4 code from app.js
- Added addTextToLegend and addStandaloneArrowToLegend to export.js

Still TODO: Split large files to comply with 300 line limit
- app.js: 1219 lines
- styles.css: 1319 lines
- symbols.js: 870 lines

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
architeur
2025-12-14 21:09:39 +01:00
parent 2a50a15745
commit c0ae55a597
12 changed files with 286 additions and 4693 deletions

View File

@@ -18,11 +18,13 @@ var UiBindings = {
var e = this.elements;
// Text & Farben
e.textInput = document.getElementById('textInput');
e.textInput = document.getElementById('customText');
e.fontSizeInput = document.getElementById('fontSize');
e.fontSizeValue = document.getElementById('fontSizeValue');
e.textColorInput = document.getElementById('textColor');
e.textColorValue = document.getElementById('textColorValue');
e.frameColorInput = document.getElementById('frameColor');
e.frameColorValue = document.getElementById('frameColorValue');
// Rahmen
e.frameScaleInput = document.getElementById('frameScale');
@@ -30,16 +32,16 @@ var UiBindings = {
e.frameScaleRow = document.getElementById('frameScaleRow');
// Padding
e.paddingAllInput = document.getElementById('framePaddingAll');
e.paddingAllValue = document.getElementById('framePaddingAllValue');
e.paddingTopInput = document.getElementById('framePaddingTop');
e.paddingTopValue = document.getElementById('framePaddingTopValue');
e.paddingRightInput = document.getElementById('framePaddingRight');
e.paddingRightValue = document.getElementById('framePaddingRightValue');
e.paddingBottomInput = document.getElementById('framePaddingBottom');
e.paddingBottomValue = document.getElementById('framePaddingBottomValue');
e.paddingLeftInput = document.getElementById('framePaddingLeft');
e.paddingLeftValue = document.getElementById('framePaddingLeftValue');
e.paddingAllInput = document.getElementById('paddingAll');
e.paddingAllValue = document.getElementById('paddingAllValue');
e.paddingTopInput = document.getElementById('paddingTop');
e.paddingTopValue = document.getElementById('paddingTopValue');
e.paddingRightInput = document.getElementById('paddingRight');
e.paddingRightValue = document.getElementById('paddingRightValue');
e.paddingBottomInput = document.getElementById('paddingBottom');
e.paddingBottomValue = document.getElementById('paddingBottomValue');
e.paddingLeftInput = document.getElementById('paddingLeft');
e.paddingLeftValue = document.getElementById('paddingLeftValue');
e.paddingAllRow = document.getElementById('framePaddingAllRow');
e.paddingRow = document.getElementById('framePaddingRow');
@@ -64,8 +66,8 @@ var UiBindings = {
// Buttons
e.shapeButtons = document.querySelectorAll('.shape-btn');
e.arrowButtons = document.querySelectorAll('.arrow-btn');
e.lineStyleButtons = document.querySelectorAll('.line-style-btn');
e.lineWeightButtons = document.querySelectorAll('.line-weight-btn');
e.lineStyleButtons = document.querySelectorAll('.line-btn');
e.lineWeightButtons = document.querySelectorAll('.weight-btn');
},
bindEvents: function() {
@@ -95,12 +97,14 @@ var UiBindings = {
if (e.textColorInput) {
e.textColorInput.addEventListener('input', function(ev) {
state.set('textColor', ev.target.value);
if (e.textColorValue) e.textColorValue.textContent = ev.target.value;
self.updatePreview();
});
}
if (e.frameColorInput) {
e.frameColorInput.addEventListener('input', function(ev) {
state.set('frameColor', ev.target.value);
if (e.frameColorValue) e.frameColorValue.textContent = ev.target.value;
self.updatePreview();
});
}