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:
@@ -319,3 +319,44 @@ window.downloadStandaloneArrowDXF = function() {
|
||||
window.TextExport.downloadDxf(svg, 'pfeil.dxf');
|
||||
}
|
||||
};
|
||||
|
||||
// Zur Legende hinzufuegen
|
||||
window.addTextToLegend = function() {
|
||||
var state = window.TextGenState.current;
|
||||
var svg = window.SvgGenerator.generate(state);
|
||||
var name = state.text || 'Text-Symbol';
|
||||
|
||||
if (typeof legendItems !== 'undefined' && typeof updateLegendCount === 'function') {
|
||||
legendItems.push({
|
||||
id: 'text_' + Date.now(),
|
||||
name: name.split('\n')[0].substring(0, 30),
|
||||
svg: svg,
|
||||
description: ''
|
||||
});
|
||||
updateLegendCount();
|
||||
saveLegendToStorage();
|
||||
if (typeof showNotification === 'function') {
|
||||
showNotification('Zur Legende hinzugefuegt!');
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
window.addStandaloneArrowToLegend = function() {
|
||||
var state = window.TextGenState.current;
|
||||
var svg = window.SvgGenerator.generateArrowOnly(state);
|
||||
if (!svg) return;
|
||||
|
||||
if (typeof legendItems !== 'undefined' && typeof updateLegendCount === 'function') {
|
||||
legendItems.push({
|
||||
id: 'arrow_' + Date.now(),
|
||||
name: 'Pfeil ' + state.arrow,
|
||||
svg: svg,
|
||||
description: ''
|
||||
});
|
||||
updateLegendCount();
|
||||
saveLegendToStorage();
|
||||
if (typeof showNotification === 'function') {
|
||||
showNotification('Pfeil zur Legende hinzugefuegt!');
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@@ -44,9 +44,19 @@ var SvgGenerator = {
|
||||
case 'rect':
|
||||
shapeEl = draw.rect(width, height).move(x, y).radius(4);
|
||||
break;
|
||||
case 'square':
|
||||
var squareSize = Math.max(width, height);
|
||||
var squareX = x - (squareSize - width) / 2;
|
||||
var squareY = y - (squareSize - height) / 2;
|
||||
shapeEl = draw.rect(squareSize, squareSize).move(squareX, squareY).radius(4);
|
||||
break;
|
||||
case 'rounded':
|
||||
shapeEl = draw.rect(width, height).move(x, y).radius(Math.min(halfW, halfH) * 0.5);
|
||||
break;
|
||||
case 'circle':
|
||||
var circleRadius = Math.max(halfW, halfH);
|
||||
shapeEl = draw.circle(circleRadius * 2).center(cx, cy);
|
||||
break;
|
||||
case 'oval':
|
||||
shapeEl = draw.ellipse(width, height).center(cx, cy);
|
||||
break;
|
||||
|
||||
@@ -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();
|
||||
});
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user