PhongPham
c65cc97a33
✨ MAJOR FEATURES: • Auto-zoom intelligence với smart bounds fitting • Enhanced 3D GPS markers với pulsing effects • Professional route display với 6-layer rendering • Status-based parking icons với availability indicators • Production-ready build optimizations 🗺️ AUTO-ZOOM FEATURES: • Smart bounds fitting cho GPS + selected parking • Adaptive padding (50px) cho visual balance • Max zoom control (level 16) để tránh quá gần • Dynamic centering khi không có selection 🎨 ENHANCED VISUALS: • 3D GPS marker với multi-layer pulse effects • Advanced parking icons với status colors • Selection highlighting với animation • Dimming system cho non-selected items 🛣️ ROUTE SYSTEM: • OpenRouteService API integration • Multi-layer route rendering (glow, shadow, main, animated) • Real-time distance & duration calculation • Visual route info trong popup 📱 PRODUCTION READY: • SSR safe với dynamic imports • Build errors resolved • Global deployment via Vercel • Optimized performance 🌍 DEPLOYMENT: • Vercel: https://whatever-ctk2auuxr-phong12hexdockworks-projects.vercel.app • Bundle size: 22.8 kB optimized • Global CDN distribution • HTTPS enabled 💾 VERSION CONTROL: • MapView-v2.0.tsx backup created • MAPVIEW_VERSIONS.md documentation • Full version history tracking
65 lines
2.3 KiB
JavaScript
65 lines
2.3 KiB
JavaScript
import { mix } from './mix.mjs';
|
|
import { mixColor } from './mix-color.mjs';
|
|
import { pipe } from './pipe.mjs';
|
|
import { warning } from './errors.mjs';
|
|
import { color } from '../value/types/color/index.mjs';
|
|
import { complex, analyseComplexValue } from '../value/types/complex/index.mjs';
|
|
|
|
const mixImmediate = (origin, target) => (p) => `${p > 0 ? target : origin}`;
|
|
function getMixer(origin, target) {
|
|
if (typeof origin === "number") {
|
|
return (v) => mix(origin, target, v);
|
|
}
|
|
else if (color.test(origin)) {
|
|
return mixColor(origin, target);
|
|
}
|
|
else {
|
|
return origin.startsWith("var(")
|
|
? mixImmediate(origin, target)
|
|
: mixComplex(origin, target);
|
|
}
|
|
}
|
|
const mixArray = (from, to) => {
|
|
const output = [...from];
|
|
const numValues = output.length;
|
|
const blendValue = from.map((fromThis, i) => getMixer(fromThis, to[i]));
|
|
return (v) => {
|
|
for (let i = 0; i < numValues; i++) {
|
|
output[i] = blendValue[i](v);
|
|
}
|
|
return output;
|
|
};
|
|
};
|
|
const mixObject = (origin, target) => {
|
|
const output = { ...origin, ...target };
|
|
const blendValue = {};
|
|
for (const key in output) {
|
|
if (origin[key] !== undefined && target[key] !== undefined) {
|
|
blendValue[key] = getMixer(origin[key], target[key]);
|
|
}
|
|
}
|
|
return (v) => {
|
|
for (const key in blendValue) {
|
|
output[key] = blendValue[key](v);
|
|
}
|
|
return output;
|
|
};
|
|
};
|
|
const mixComplex = (origin, target) => {
|
|
const template = complex.createTransformer(target);
|
|
const originStats = analyseComplexValue(origin);
|
|
const targetStats = analyseComplexValue(target);
|
|
const canInterpolate = originStats.numVars === targetStats.numVars &&
|
|
originStats.numColors === targetStats.numColors &&
|
|
originStats.numNumbers >= targetStats.numNumbers;
|
|
if (canInterpolate) {
|
|
return pipe(mixArray(originStats.values, targetStats.values), template);
|
|
}
|
|
else {
|
|
warning(true, `Complex values '${origin}' and '${target}' too different to mix. Ensure all colors are of the same type, and that each contains the same quantity of number and color values. Falling back to instant transition.`);
|
|
return mixImmediate(origin, target);
|
|
}
|
|
};
|
|
|
|
export { mixArray, mixComplex, mixObject };
|