fix: Update text descriptions in Cross and Home components for clarity

components/templates/generator.js

@@ -43,34 +43,49 @@ export default function Generator() {
 
 	const getPath = (e, path) => {
 		let newLines = [];
+		const lines = path.split("\n");
 
-		for (let line of path.split("\n")) {
+		// Parse the data more accurately
-			if (line[0] == "P") continue;
+		for (let line of lines) {
-			if (line[0] == "S") continue;
+			line = line.trim();
-			if (line[0] == "X") continue;
+			// Skip header lines, segment lines, and empty lines
+			if (line.startsWith("Próbkowanie") || 
+				line.startsWith("Segment") || 
+				line.startsWith("X:") || 
+				line === "") {
+				continue;
+			}
 			newLines.push(line);
 		}
 		
-		let xs = [], ys = [], zs = [];
+		if (newLines.length === 0) {
-		let toti = 0, al = 0;
+			console.log("No valid coordinate data found");
+			return;
+		}
 
+		let points = [];
+		
+		// Parse coordinates more reliably
 		for (let line of newLines) {
-			al += 1;
+			const coords = line.split(/[,\t]+/).map(s => s.trim());
-			let theLine = line.split(",");
+			if (coords.length >= 3) {
+				const x = parseFloat(coords[0]);
+				const y = parseFloat(coords[1]);
+				const z = parseFloat(coords[2]);
 				
-			if (xs && parseFloat(theLine[0]) == xs[-1] && parseFloat(theLine[1]) == ys[-1])
+				if (!isNaN(x) && !isNaN(y) && !isNaN(z)) {
-				continue;
+					points.push({ x, y, z });
+				}
+			}
+		}
 
-			if (al > 2) {
+		if (points.length === 0) {
-				let dist = ((xs[xs.length - 1] - xs[xs.length - 2]) ** 2 +
+			console.log("No valid points parsed");
-					(ys[ys.length - 1] - ys[ys.length - 2]) ** 2) ** 0.5;
+			return;
-				toti += Math.round(dist);
-			}
-			xs.push(parseFloat(theLine[0]));
-			ys.push(parseFloat(theLine[1]));
-			zs.push(parseFloat(theLine[2]));
 		}
 
+		console.log(`Parsed ${points.length} points`);
+
 		const canvas = document.getElementById("canvas");
 		console.log("Canvas element:", canvas);
 		if (!canvas || !canvas.getContext) {
@@ -81,32 +96,138 @@ export default function Generator() {
 		}
 
 		const ctx = canvas.getContext("2d");
-		ctx.clearRect(0, 0, 700, 500);
+		const canvasWidth = 800;  // Match the canvas width
-		ctx.strokeStyle = "#3B82F6";
+		const canvasHeight = 400; // Match the canvas height
-		ctx.lineWidth = 2;
+		const padding = 50;
 		
-		let scaleFactor = 100000 / 2000;
+		// Clear canvas
-		let totalH = Math.max(...zs);
+		ctx.clearRect(0, 0, canvasWidth, canvasHeight);
-		let minH = Math.min(...zs);
 		
-		for (let line = 0; line < xs.length - 1; line++) {
+		// Calculate bounds
-			let x1 = line * scaleFactor;
+		const xCoords = points.map(p => p.x);
-			let y1 = zs[line];
+		const yCoords = points.map(p => p.y);
-			let x2 = (line + 1) * scaleFactor;
+		const zCoords = points.map(p => p.z);
-			let y2 = zs[line + 1];
 		
-			let b0 = 50, b1 = 450;
+		const minX = Math.min(...xCoords);
-			let z1 = b0 + (b1 - b0) * ((y1 - totalH) / (minH - totalH));
+		const maxX = Math.max(...xCoords);
-			let z2 = b0 + (b1 - b0) * ((y2 - totalH) / (minH - totalH));
+		const minY = Math.min(...yCoords);
+		const maxY = Math.max(...yCoords);
+		const minZ = Math.min(...zCoords);
+		const maxZ = Math.max(...zCoords);
 		
-			let x12 = b0 + (b1 - b0) * ((x1 - 0) / (toti * scaleFactor));
+		// Calculate distances along the path
-			let x22 = b0 + (b1 - b0) * ((x2 - 0) / (toti * scaleFactor));
+		let distances = [0];
+		let totalDistance = 0;
 		
+		for (let i = 1; i < points.length; i++) {
+			const dx = points[i].x - points[i-1].x;
+			const dy = points[i].y - points[i-1].y;
+			const distance = Math.sqrt(dx * dx + dy * dy);
+			totalDistance += distance;
+			distances.push(totalDistance);
+		}
+		
+		console.log(`Total distance: ${totalDistance.toFixed(2)}m, Height range: ${minZ.toFixed(2)}m - ${maxZ.toFixed(2)}m`);
+		
+		// Set up drawing area
+		const drawWidth = canvasWidth - 2 * padding;
+		const drawHeight = canvasHeight - 2 * padding;
+		
+		// Draw coordinate system
+		ctx.strokeStyle = "#E5E7EB";
+		ctx.lineWidth = 1;
+		
+		// Draw grid
+		const gridLines = 10;
+		for (let i = 0; i <= gridLines; i++) {
+			const x = padding + (i / gridLines) * drawWidth;
+			const y = padding + (i / gridLines) * drawHeight;
+			
+			// Vertical grid lines
 			ctx.beginPath();
-			ctx.moveTo(x12, z1);
+			ctx.moveTo(x, padding);
-			ctx.lineTo(x22, z2);
+			ctx.lineTo(x, canvasHeight - padding);
+			ctx.stroke();
+			
+			// Horizontal grid lines
+			ctx.beginPath();
+			ctx.moveTo(padding, y);
+			ctx.lineTo(canvasWidth - padding, y);
 			ctx.stroke();
 		}
+		
+		// Draw axes
+		ctx.strokeStyle = "#6B7280";
+		ctx.lineWidth = 2;
+		
+		// X-axis (bottom)
+		ctx.beginPath();
+		ctx.moveTo(padding, canvasHeight - padding);
+		ctx.lineTo(canvasWidth - padding, canvasHeight - padding);
+		ctx.stroke();
+		
+		// Y-axis (left)
+		ctx.beginPath();
+		ctx.moveTo(padding, padding);
+		ctx.lineTo(padding, canvasHeight - padding);
+		ctx.stroke();
+		
+		// Draw labels
+		ctx.fillStyle = "#374151";
+		ctx.font = "12px sans-serif";
+		ctx.textAlign = "center";
+		
+		// Distance labels (bottom)
+		for (let i = 0; i <= 5; i++) {
+			const distance = (totalDistance * i) / 5;
+			const x = padding + (i / 5) * drawWidth;
+			ctx.fillText(`${distance.toFixed(0)}m`, x, canvasHeight - padding + 20);
+		}
+		
+		// Height labels (left)
+		ctx.textAlign = "right";
+		for (let i = 0; i <= 5; i++) {
+			const height = minZ + ((maxZ - minZ) * i) / 5;
+			const y = canvasHeight - padding - (i / 5) * drawHeight;
+			ctx.fillText(`${height.toFixed(1)}m`, padding - 10, y + 4);
+		}
+		
+		// Draw profile line
+		ctx.strokeStyle = "#3B82F6";
+		ctx.lineWidth = 3;
+		ctx.lineCap = "round";
+		ctx.lineJoin = "round";
+		
+		ctx.beginPath();
+		for (let i = 0; i < points.length; i++) {
+			const x = padding + (distances[i] / totalDistance) * drawWidth;
+			const y = canvasHeight - padding - ((points[i].z - minZ) / (maxZ - minZ)) * drawHeight;
+			
+			if (i === 0) {
+				ctx.moveTo(x, y);
+			} else {
+				ctx.lineTo(x, y);
+			}
+		}
+		ctx.stroke();
+		
+		// Draw elevation points
+		ctx.fillStyle = "#3B82F6";
+		for (let i = 0; i < points.length; i++) {
+			const x = padding + (distances[i] / totalDistance) * drawWidth;
+			const y = canvasHeight - padding - ((points[i].z - minZ) / (maxZ - minZ)) * drawHeight;
+			
+			ctx.beginPath();
+			ctx.arc(x, y, 4, 0, 2 * Math.PI);
+			ctx.fill();
+		}
+		
+		// Add title
+		ctx.fillStyle = "#1F2937";
+		ctx.font = "16px sans-serif";
+		ctx.textAlign = "center";
+		ctx.fillText("Profil terenu", canvasWidth / 2, 30);
+		
 		setPreviewVisible(true);
 	};
 
@@ -265,9 +386,9 @@ export default function Generator() {
 						<div className="bg-gray-50 rounded-lg p-4">
 							<canvas 
 								id="canvas" 
-								height="500" 
+								height="400" 
-								width="700"
+								width="800"
-								className="border border-gray-200 rounded bg-white"
+								className="border border-gray-200 rounded bg-white w-full max-w-full"
 								style={{ display: previewVisible ? 'block' : 'none' }}
 							/>
 							{!previewVisible && (

pages/cross.js

@@ -77,7 +77,7 @@ export default function Cross() {
 							</div>
 							<div>
 								<h1 className="text-3xl font-bold text-gray-900">Generator siatki</h1>
-								<p className="text-gray-600">Przekształć pliki DXF na siatki instalacyjne</p>
+								<p className="text-gray-600">Dodaj siatkę do mapy w pliku DXF</p>
 							</div>
 						</div>
 					</div>

pages/index.js

@@ -20,7 +20,7 @@ export default function Home() {
 							Generator profilu przekroju terenu
 						</h1>
 						<p className="text-gray-600">
-							Twórz profesjonalne profile terenowe na podstawie danych z Geoportalu lub wprowadzonych ręcznie
+							Stwórz profil terenu
 						</p>
 					</div>
 
@@ -54,7 +54,7 @@ export default function Home() {
 					</Card>
 
 					{/* Info Cards */}
-					<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+					{/* <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
 						<Card>
 							<CardContent>
 								<div className="flex items-center space-x-3">
@@ -98,7 +98,7 @@ export default function Home() {
 								</div>
 							</CardContent>
 						</Card>
-					</div>
+					</div> */}
 				</div>
 			</Layout>
 		);