@@ -331,6 +334,10 @@
Edit Selected Label
let currentZoom = 1;
let mapCanvas = null;
+// Numeric keying system
+let numericKeyMode = false;
+let numericKeyCounter = 1;
+
function loadMap(event) {
const file = event.target.files[0];
if (!file) return;
@@ -360,7 +367,11 @@
Edit Selected Label
height: img.naturalHeight,
filename: file.name
};
-
+
+ // Set initial label size to 5% of image width, rounded to nearest pixel
+ const initialLabelSize = Math.round(img.naturalWidth * 0.015);
+ document.getElementById('labelSize').value = initialLabelSize;
+
currentZoom = 1;
updateZoom();
};
@@ -494,9 +505,12 @@
Edit Selected Label
}
addLabel(originalX, originalY, labelText);
-
+
// Clear the input and deselect any previously selected label
- document.getElementById('labelText').value = '';
+ // Note: addLabel() handles setting the next numeric value if in numeric key mode
+ if (!numericKeyMode) {
+ document.getElementById('labelText').value = '';
+ }
deselectLabel();
document.getElementById('labelText').focus();
}
@@ -505,7 +519,7 @@
Edit Selected Label
const size = parseInt(document.getElementById('labelSize').value) || 16;
const color = document.getElementById('labelColor').value || '#000000';
const font = document.getElementById('labelFont').value || 'Arial, sans-serif';
-
+
const label = {
id: labelIdCounter++,
x: x,
@@ -515,9 +529,37 @@
Edit Selected Label
color: color,
font: font
};
-
+
labels.push(label);
renderLabels();
+
+ // Handle numeric key auto-increment
+ if (numericKeyMode) {
+ numericKeyCounter++;
+ document.getElementById('labelText').value = numericKeyCounter.toString();
+ }
+}
+
+function toggleNumericKey() {
+ const btn = document.getElementById('numericKeyBtn');
+ const labelTextInput = document.getElementById('labelText');
+
+ if (!numericKeyMode) {
+ // Enable numeric key mode
+ numericKeyMode = true;
+ numericKeyCounter = 1;
+ labelTextInput.value = numericKeyCounter.toString();
+ btn.style.backgroundColor = '#007acc';
+ btn.textContent = 'Numeric Key (ON)';
+ labelTextInput.focus();
+ } else {
+ // Disable numeric key mode
+ numericKeyMode = false;
+ labelTextInput.value = '';
+ btn.style.backgroundColor = '#666';
+ btn.textContent = 'Numeric Key';
+ labelTextInput.focus();
+ }
}
function renderLabels() {
@@ -706,12 +748,18 @@
Edit Selected Label
alert('No labels to clear.');
return;
}
-
+
if (confirm(`Delete all ${labels.length} labels?`)) {
labels = [];
selectedLabel = null;
hideEditControls();
renderLabels();
+
+ // Reset numeric key mode
+ if (numericKeyMode) {
+ numericKeyCounter = 1;
+ document.getElementById('labelText').value = numericKeyCounter.toString();
+ }
}
}
@@ -723,7 +771,12 @@
Edit Selected Label
currentZoom = 1;
mapCanvas = null;
hideEditControls();
-
+
+ // Reset numeric key mode
+ if (numericKeyMode) {
+ toggleNumericKey(); // This will turn off numeric key mode
+ }
+
const container = document.getElementById('mapContainer');
container.innerHTML = '
Load a map image (JPG or PNG) to start adding labels
';
document.getElementById('mapFile').value = '';
@@ -874,6 +927,10 @@
Edit Selected Label
// Wait for image to load before rendering labels
img.onload = function() {
+ // Set initial label size to 2% of image width, rounded to nearest pixel
+ const initialLabelSize = Math.round(img.naturalWidth * 0.02);
+ document.getElementById('labelSize').value = initialLabelSize;
+
renderLabels();
};
@@ -907,9 +964,25 @@
Edit Selected Label
}
});
-// Initialize
+// Handle input changes in numeric key mode
document.addEventListener('DOMContentLoaded', function() {
document.getElementById('labelText').focus();
+
+ // Add input event listener for numeric key mode
+ document.getElementById('labelText').addEventListener('input', function(event) {
+ if (numericKeyMode) {
+ const value = event.target.value.trim();
+ const numValue = parseInt(value);
+
+ // If user enters a valid number, update the counter to continue from there
+ if (!isNaN(numValue) && numValue > 0) {
+ numericKeyCounter = numValue;
+ } else if (value === '') {
+ // If user clears the input, turn off numeric key mode
+ toggleNumericKey();
+ }
+ }
+ });
});
// Add mouse wheel zoom support