export.js 115 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027202820292030203120322033203420352036203720382039204020412042204320442045204620472048204920502051205220532054205520562057205820592060206120622063206420652066206720682069207020712072207320742075207620772078207920802081208220832084208520862087208820892090209120922093209420952096209720982099210021012102210321042105210621072108210921102111211221132114211521162117211821192120212121222123212421252126212721282129213021312132213321342135213621372138213921402141214221432144214521462147214821492150215121522153215421552156215721582159216021612162216321642165216621672168216921702171217221732174217521762177217821792180218121822183218421852186218721882189219021912192219321942195219621972198219922002201220222032204220522062207220822092210221122122213221422152216221722182219222022212222222322242225222622272228222922302231223222332234223522362237223822392240224122422243224422452246224722482249225022512252225322542255225622572258225922602261226222632264226522662267226822692270227122722273227422752276227722782279228022812282228322842285228622872288228922902291229222932294229522962297229822992300230123022303230423052306230723082309231023112312231323142315231623172318231923202321232223232324232523262327232823292330233123322333233423352336233723382339234023412342234323442345234623472348234923502351235223532354235523562357235823592360236123622363236423652366236723682369237023712372237323742375237623772378237923802381238223832384238523862387238823892390239123922393239423952396239723982399240024012402240324042405240624072408240924102411241224132414241524162417241824192420242124222423242424252426242724282429243024312432243324342435243624372438243924402441244224432444244524462447244824492450245124522453245424552456245724582459246024612462246324642465246624672468246924702471247224732474247524762477247824792480248124822483248424852486248724882489249024912492249324942495249624972498249925002501250225032504250525062507250825092510251125122513251425152516251725182519252025212522252325242525252625272528252925302531253225332534253525362537253825392540254125422543254425452546254725482549255025512552255325542555255625572558255925602561256225632564256525662567256825692570257125722573257425752576257725782579258025812582258325842585258625872588258925902591259225932594259525962597259825992600260126022603260426052606260726082609261026112612261326142615261626172618261926202621262226232624262526262627262826292630263126322633263426352636263726382639264026412642264326442645264626472648264926502651265226532654265526562657265826592660266126622663266426652666266726682669267026712672267326742675267626772678267926802681268226832684268526862687268826892690269126922693269426952696269726982699270027012702270327042705270627072708270927102711271227132714271527162717271827192720272127222723272427252726272727282729273027312732273327342735273627372738273927402741274227432744274527462747274827492750275127522753275427552756275727582759276027612762276327642765276627672768276927702771277227732774277527762777277827792780278127822783278427852786278727882789279027912792279327942795279627972798279928002801280228032804280528062807280828092810281128122813281428152816281728182819282028212822282328242825282628272828282928302831283228332834283528362837283828392840284128422843284428452846284728482849285028512852285328542855285628572858285928602861286228632864286528662867286828692870287128722873287428752876287728782879288028812882288328842885288628872888288928902891289228932894289528962897289828992900290129022903290429052906290729082909291029112912291329142915291629172918291929202921292229232924292529262927292829292930293129322933293429352936293729382939294029412942294329442945294629472948294929502951295229532954295529562957295829592960296129622963
  1. /**
  2. * Export functionality for homeRoughEditor floorplan data
  3. * Allows saving floorplan data as JSON files
  4. */
  5. /**
  6. * Export the current floorplan data to a JSON file
  7. * @param {string} filename - Optional filename (without extension)
  8. * @param {boolean} includeMetadata - Whether to include additional metadata
  9. */
  10. function exportFloorplanJSON(filename = 'floorplan', includeMetadata = true) {
  11. try {
  12. // Prepare wall data for export (handle cyclic references)
  13. const wallDataForExport = [];
  14. for (let k in WALLS) {
  15. const wall = { ...WALLS[k] };
  16. // Convert parent/child references to indices for JSON serialization
  17. if (wall.child != null) {
  18. wall.child = WALLS.indexOf(wall.child);
  19. }
  20. if (wall.parent != null) {
  21. wall.parent = WALLS.indexOf(wall.parent);
  22. }
  23. wallDataForExport.push(wall);
  24. }
  25. // Prepare object data for export
  26. const objDataForExport = [];
  27. for (let k in OBJDATA) {
  28. const obj = { ...OBJDATA[k] };
  29. // Remove SVG graph references that can't be serialized
  30. delete obj.graph;
  31. objDataForExport.push(obj);
  32. }
  33. // Prepare room data for export
  34. const roomDataForExport = [...ROOM];
  35. // Create the export data structure
  36. const exportData = {
  37. version: "0.95",
  38. exportDate: new Date().toISOString(),
  39. data: {
  40. walls: wallDataForExport,
  41. objects: objDataForExport,
  42. rooms: roomDataForExport
  43. }
  44. };
  45. // Add metadata if requested
  46. if (includeMetadata) {
  47. exportData.metadata = {
  48. totalWalls: wallDataForExport.length,
  49. totalObjects: objDataForExport.length,
  50. totalRooms: roomDataForExport.length,
  51. totalArea: typeof globalArea !== 'undefined' ? (globalArea / 3600).toFixed(2) + ' m²' : 'Not calculated',
  52. settings: {
  53. wallSize: wallSize,
  54. partitionSize: partitionSize,
  55. meter: meter,
  56. grid: grid,
  57. colorSettings: {
  58. background: colorbackground,
  59. line: colorline,
  60. room: colorroom,
  61. wall: colorWall
  62. }
  63. }
  64. };
  65. }
  66. // Convert to JSON string
  67. const jsonString = JSON.stringify(exportData, null, 2);
  68. // Create and trigger download
  69. const blob = new Blob([jsonString], { type: 'application/json' });
  70. const url = URL.createObjectURL(blob);
  71. const a = document.createElement('a');
  72. a.href = url;
  73. a.download = filename.endsWith('.json') ? filename : filename + '.json';
  74. document.body.appendChild(a);
  75. a.click();
  76. document.body.removeChild(a);
  77. // Clean up the URL object
  78. URL.revokeObjectURL(url);
  79. // Restore original wall references
  80. for (let k in WALLS) {
  81. if (WALLS[k].child != null && typeof WALLS[k].child === 'number') {
  82. WALLS[k].child = WALLS[WALLS[k].child];
  83. }
  84. if (WALLS[k].parent != null && typeof WALLS[k].parent === 'number') {
  85. WALLS[k].parent = WALLS[WALLS[k].parent];
  86. }
  87. }
  88. console.log('Floorplan exported successfully as:', a.download);
  89. if (typeof $('#boxinfo') !== 'undefined') {
  90. $('#boxinfo').html('Floorplan exported successfully');
  91. }
  92. return true;
  93. } catch (error) {
  94. console.error('Error exporting floorplan:', error);
  95. if (typeof $('#boxinfo') !== 'undefined') {
  96. $('#boxinfo').html('Export failed: ' + error.message);
  97. }
  98. return false;
  99. }
  100. }
  101. // ------------------------ Floorplan Mode (view floorplan under walls) ------------------------
  102. /**
  103. * Make walls translucent and trigger the same behavior as a double-click on the floorplan.
  104. * Useful for aligning to a background image.
  105. */
  106. function enterFloorplanMode() {
  107. try {
  108. // Dim only walls layer so underlying background remains visible
  109. const boxWall = document.getElementById('boxwall');
  110. if (boxWall) {
  111. boxWall.setAttribute('opacity', '0.35');
  112. boxWall.setAttribute('pointer-events', 'none');
  113. }
  114. // Dim identified room layers similarly
  115. const boxRoom = document.getElementById('boxRoom');
  116. if (boxRoom) {
  117. boxRoom.setAttribute('opacity', '0.35');
  118. boxRoom.setAttribute('pointer-events', 'none');
  119. }
  120. const boxSurface = document.getElementById('boxSurface');
  121. if (boxSurface) {
  122. boxSurface.setAttribute('opacity', '0.35');
  123. boxSurface.setAttribute('pointer-events', 'none');
  124. }
  125. // If a background image exists, show its tools (equivalent to double-clicking the image)
  126. const bgImg = document.getElementById('backgroundImage');
  127. if (bgImg && typeof showBackgroundImageTools === 'function') {
  128. showBackgroundImageTools();
  129. }
  130. window.__floorplanMode = true;
  131. if (typeof $ !== 'undefined') $('#boxinfo').html('Floorplan mode: walls translucent');
  132. // Update stored toggle button label if any
  133. if (window.__floorplanBtn && window.__floorplanBtn instanceof HTMLElement) {
  134. window.__floorplanBtn.innerText = 'Exit floorplan mode';
  135. }
  136. } catch (e) { console.error('enterFloorplanMode error:', e); }
  137. }
  138. /**
  139. * Restore normal wall opacity
  140. */
  141. function exitFloorplanMode() {
  142. try {
  143. const boxWall = document.getElementById('boxwall');
  144. if (boxWall) {
  145. boxWall.setAttribute('opacity', '1');
  146. // Explicitly restore interactivity
  147. boxWall.setAttribute('pointer-events', 'auto');
  148. }
  149. // Restore room layers opacity
  150. const boxRoom = document.getElementById('boxRoom');
  151. if (boxRoom) {
  152. boxRoom.setAttribute('opacity', '1');
  153. boxRoom.setAttribute('pointer-events', 'auto');
  154. }
  155. const boxSurface = document.getElementById('boxSurface');
  156. if (boxSurface) {
  157. boxSurface.setAttribute('opacity', '1');
  158. boxSurface.setAttribute('pointer-events', 'auto');
  159. }
  160. // Restore binder/highlight layer
  161. const boxBind = document.getElementById('boxbind');
  162. if (boxBind) {
  163. boxBind.removeAttribute('display');
  164. }
  165. // Hide background image tools if visible
  166. if (typeof hideBackgroundImageTools === 'function') {
  167. hideBackgroundImageTools();
  168. }
  169. window.__floorplanMode = false;
  170. if (typeof $ !== 'undefined') $('#boxinfo').html('Floorplan mode: off');
  171. // Update stored toggle button label if any
  172. if (window.__floorplanBtn && window.__floorplanBtn instanceof HTMLElement) {
  173. window.__floorplanBtn.innerText = 'Floorplan mode';
  174. }
  175. } catch (e) { console.error('exitFloorplanMode error:', e); }
  176. }
  177. /**
  178. * Toggle floorplan mode and update button label if present
  179. */
  180. function toggleFloorplanMode(btn) {
  181. // Remember the last-used toggle button for later label sync
  182. if (btn && btn instanceof HTMLElement) {
  183. window.__floorplanBtn = btn;
  184. }
  185. const on = !!window.__floorplanMode;
  186. if (on) {
  187. exitFloorplanMode();
  188. if (btn && btn instanceof HTMLElement) btn.innerText = 'Floorplan mode';
  189. } else {
  190. enterFloorplanMode();
  191. if (btn && btn instanceof HTMLElement) btn.innerText = 'Exit floorplan mode';
  192. }
  193. }
  194. /**
  195. * Toggle scaling mode and update button label if present
  196. */
  197. function toggleScalingMode(btn) {
  198. // Remember the last-used toggle button for later label sync
  199. if (btn && btn instanceof HTMLElement) {
  200. window.__scalingBtn = btn;
  201. }
  202. const on = !!window.__scalingMode;
  203. if (on) {
  204. exitScalingMode();
  205. if (btn && btn instanceof HTMLElement) btn.innerText = 'Scaling mode';
  206. } else {
  207. enterScalingMode();
  208. if (btn && btn instanceof HTMLElement) btn.innerText = 'Exit scaling mode';
  209. }
  210. }
  211. /**
  212. * Enter scaling mode - show scaling panel and calculate current dimensions
  213. */
  214. function enterScalingMode() {
  215. try {
  216. window.__scalingMode = true;
  217. // Hide other panels
  218. $('.leftBox').hide();
  219. $('#scalingTools').show();
  220. // Calculate current floorplan dimensions and store original state
  221. const bounds = calculateFloorplanBounds();
  222. const currentWidth = bounds.width;
  223. const currentHeight = bounds.height;
  224. console.log('Calculated bounds:', bounds);
  225. console.log('WALLS array:', WALLS);
  226. // Store original dimensions and bounds for reference
  227. window.__originalDimensions = { width: currentWidth, height: currentHeight };
  228. window.__originalBounds = bounds;
  229. // Store original wall coordinates for proper scaling
  230. if (WALLS && WALLS.length > 0) {
  231. window.__originalWalls = WALLS.map(wall => ({...wall}));
  232. } else {
  233. console.warn('No walls found for scaling');
  234. window.__originalWalls = [];
  235. }
  236. // Store original furniture positions if they exist
  237. if (window.OBJDATA) {
  238. window.__originalObjData = window.OBJDATA.map(obj => ({...obj}));
  239. }
  240. // Store relative positions of doors/windows on their walls
  241. if (OBJDATA) {
  242. window.__originalObjWallPositions = OBJDATA.map(obj => {
  243. if (typeof editor !== 'undefined' && editor.rayCastingWalls) {
  244. const wallBind = editor.rayCastingWalls(obj, WALLS);
  245. if (wallBind && wallBind.length > 0) {
  246. const wall = wallBind.length > 1 ? wallBind[wallBind.length - 1] : wallBind[0];
  247. if (wall) {
  248. // Calculate relative position along wall (0 = start, 1 = end)
  249. const wallLength = qSVG.measure(wall.start.x, wall.start.y, wall.end.x, wall.end.y);
  250. const objDistFromStart = qSVG.measure(wall.start.x, wall.start.y, obj.x, obj.y);
  251. const relativePos = wallLength > 0 ? objDistFromStart / wallLength : 0;
  252. return {
  253. wallIndex: WALLS.indexOf(wall),
  254. relativePosition: relativePos,
  255. originalSize: obj.size,
  256. originalThick: obj.thick
  257. };
  258. }
  259. }
  260. }
  261. return null;
  262. });
  263. }
  264. // Store aspect ratio for maintaining proportions
  265. window.__originalAspectRatio = currentWidth / currentHeight;
  266. // Use setTimeout to ensure DOM elements are accessible after panel is shown
  267. setTimeout(() => {
  268. // Use bounds calculation instead of measurement ribbons for more accurate dimensions
  269. const bounds = calculateFloorplanBounds();
  270. const widthInMeters = (bounds.width / meter);
  271. const heightInMeters = (bounds.height / meter);
  272. const widthInput = document.getElementById('floorplanWidth');
  273. const heightInput = document.getElementById('floorplanHeight');
  274. const originalDimSpan = document.getElementById('originalDimensions');
  275. const scaleFactorSpan = document.getElementById('scaleFactor');
  276. if (widthInput && heightInput && originalDimSpan && scaleFactorSpan) {
  277. // Round to match displayed measurements precision
  278. const displayWidth = Math.round(widthInMeters);
  279. const displayHeight = Math.round(heightInMeters);
  280. widthInput.value = displayWidth;
  281. heightInput.value = displayHeight;
  282. originalDimSpan.textContent = `${displayWidth}m × ${displayHeight}m`;
  283. scaleFactorSpan.textContent = '1.0';
  284. // Store exact dimensions for scaling calculations
  285. window.__originalDimensions = {
  286. width: bounds.width,
  287. height: bounds.height
  288. };
  289. console.log('Set input values from bounds calculation:', displayWidth, displayHeight);
  290. } else {
  291. console.error('Could not find scaling UI elements');
  292. }
  293. }, 500); // Increased delay to ensure measurements are rendered
  294. // Update button text
  295. if (window.__scalingBtn) {
  296. window.__scalingBtn.innerText = 'Exit scaling mode';
  297. }
  298. console.log('Entered scaling mode. Current dimensions:', currentWidth, 'x', currentHeight);
  299. } catch (e) {
  300. console.error('enterScalingMode error:', e);
  301. }
  302. }
  303. /**
  304. * Exit scaling mode - hide scaling panel and return to normal mode
  305. */
  306. function exitScalingMode() {
  307. try {
  308. window.__scalingMode = false;
  309. // Hide scaling panel
  310. $('#scalingTools').hide();
  311. // Show main panel
  312. $('#panel').show();
  313. // Update button text
  314. if (window.__scalingBtn) {
  315. window.__scalingBtn.innerText = 'Scaling mode';
  316. }
  317. // Clear stored dimensions and original data
  318. delete window.__originalDimensions;
  319. delete window.__originalBounds;
  320. delete window.__originalWalls;
  321. delete window.__originalObjData;
  322. delete window.__originalAspectRatio;
  323. console.log('Exited scaling mode');
  324. } catch (e) {
  325. console.error('exitScalingMode error:', e);
  326. }
  327. }
  328. /**
  329. * Calculate current floorplan bounds based on walls (no padding)
  330. */
  331. function calculateFloorplanBounds() {
  332. if (!WALLS || WALLS.length === 0) {
  333. return { width: 600, height: 400, minX: 0, minY: 0, maxX: 600, maxY: 400 };
  334. }
  335. let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
  336. // Find bounds from all wall coordinates (walls are objects with start/end properties)
  337. WALLS.forEach(wall => {
  338. if (wall && wall.start && wall.end) {
  339. const x1 = wall.start.x;
  340. const y1 = wall.start.y;
  341. const x2 = wall.end.x;
  342. const y2 = wall.end.y;
  343. minX = Math.min(minX, x1, x2);
  344. minY = Math.min(minY, y1, y2);
  345. maxX = Math.max(maxX, x1, x2);
  346. maxY = Math.max(maxY, y1, y2);
  347. }
  348. });
  349. // Handle case where no valid walls found
  350. if (minX === Infinity) {
  351. return { width: 600, height: 400, minX: 0, minY: 0, maxX: 600, maxY: 400 };
  352. }
  353. return {
  354. width: maxX - minX,
  355. height: maxY - minY,
  356. minX: minX,
  357. minY: minY,
  358. maxX: maxX,
  359. maxY: maxY
  360. };
  361. }
  362. /**
  363. * Update floorplan width while maintaining aspect ratio
  364. */
  365. function updateFloorplanWidth() {
  366. if (!window.__scalingMode) return;
  367. try {
  368. const newWidthM = parseFloat(document.getElementById('floorplanWidth').value);
  369. if (isNaN(newWidthM) || newWidthM <= 0) {
  370. return;
  371. }
  372. // Calculate current floorplan bounds
  373. const currentBounds = calculateFloorplanBounds();
  374. const currentWidthM = currentBounds.width / meter;
  375. const currentHeightM = currentBounds.height / meter;
  376. // Calculate scale factor based on width change
  377. const scaleFactor = newWidthM / currentWidthM;
  378. // Update height to maintain aspect ratio (both dimensions scale by same factor)
  379. const newHeightM = currentHeightM * scaleFactor;
  380. document.getElementById('floorplanHeight').value = newHeightM.toFixed(1);
  381. // Update scale factor display
  382. document.getElementById('scaleFactor').textContent = scaleFactor.toFixed(2);
  383. // Apply uniform scaling to all elements (same factor for X and Y)
  384. scaleAllElementsUniformly(scaleFactor);
  385. } catch (e) {
  386. console.error('updateFloorplanWidth error:', e);
  387. }
  388. }
  389. /**
  390. * Update floorplan height while maintaining aspect ratio
  391. */
  392. function updateFloorplanHeight() {
  393. if (!window.__scalingMode) return;
  394. try {
  395. const newHeightM = parseFloat(document.getElementById('floorplanHeight').value);
  396. if (isNaN(newHeightM) || newHeightM <= 0) {
  397. return;
  398. }
  399. // Calculate current floorplan bounds
  400. const currentBounds = calculateFloorplanBounds();
  401. const currentWidthM = currentBounds.width / meter;
  402. const currentHeightM = currentBounds.height / meter;
  403. // Calculate scale factor based on height change
  404. const scaleFactor = newHeightM / currentHeightM;
  405. // Update width to maintain aspect ratio (both dimensions scale by same factor)
  406. const newWidthM = currentWidthM * scaleFactor;
  407. document.getElementById('floorplanWidth').value = newWidthM.toFixed(1);
  408. // Update scale factor display
  409. document.getElementById('scaleFactor').textContent = scaleFactor.toFixed(2);
  410. // Apply uniform scaling to all elements (same factor for X and Y)
  411. scaleAllElementsUniformly(scaleFactor);
  412. } catch (e) {
  413. console.error('updateFloorplanHeight error:', e);
  414. }
  415. }
  416. /**
  417. * Scale all elements uniformly by the given factor (maintains shape)
  418. */
  419. function scaleAllElementsUniformly(scaleFactor) {
  420. try {
  421. // Calculate bounds and origin point for rigid scaling
  422. const bounds = calculateFloorplanBounds();
  423. const originX = bounds.minX;
  424. const originY = bounds.minY;
  425. console.log('Rigid scaling by factor:', scaleFactor, 'Origin:', originX, originY);
  426. WALLS.forEach(wall => {
  427. // Scale from fixed origin point (top-left) to maintain wall angles
  428. wall.start.x = originX + (wall.start.x - originX) * scaleFactor;
  429. wall.start.y = originY + (wall.start.y - originY) * scaleFactor;
  430. wall.end.x = originX + (wall.end.x - originX) * scaleFactor;
  431. wall.end.y = originY + (wall.end.y - originY) * scaleFactor;
  432. });
  433. // Restore doors/windows to their exact relative positions on scaled walls
  434. if (OBJDATA && window.__originalObjWallPositions) {
  435. OBJDATA.forEach((obj, index) => {
  436. const wallPos = window.__originalObjWallPositions[index];
  437. if (wallPos && wallPos.wallIndex >= 0 && WALLS[wallPos.wallIndex]) {
  438. const wall = WALLS[wallPos.wallIndex];
  439. // Scale size properties
  440. if (wallPos.originalSize !== undefined) {
  441. obj.size = wallPos.originalSize * scaleFactor;
  442. }
  443. if (wallPos.originalThick !== undefined) {
  444. obj.thick = wallPos.originalThick * scaleFactor;
  445. }
  446. // Calculate new position based on relative position along scaled wall
  447. const wallLength = qSVG.measure(wall.start.x, wall.start.y, wall.end.x, wall.end.y);
  448. const distFromStart = wallLength * wallPos.relativePosition;
  449. // Position object at exact relative position on wall
  450. const wallAngle = Math.atan2(wall.end.y - wall.start.y, wall.end.x - wall.start.x);
  451. obj.x = wall.start.x + Math.cos(wallAngle) * distFromStart;
  452. obj.y = wall.start.y + Math.sin(wallAngle) * distFromStart;
  453. // Recalculate limits for the new position and size
  454. if (wall.equations && typeof limitObj === 'function') {
  455. const newLimits = limitObj(wall.equations.base, obj.size, obj);
  456. if (Array.isArray(newLimits) && newLimits.length >= 2) {
  457. obj.limit = newLimits;
  458. }
  459. }
  460. }
  461. });
  462. }
  463. // Scale furniture from fixed origin point
  464. if (window.OBJDATA) {
  465. window.OBJDATA.forEach(obj => {
  466. if (obj) {
  467. // Scale position from fixed origin point
  468. obj.x = originX + (obj.x - originX) * scaleFactor;
  469. obj.y = originY + (obj.y - originY) * scaleFactor;
  470. // Scale furniture size
  471. if (obj.size !== undefined) {
  472. obj.size = obj.size * scaleFactor;
  473. }
  474. }
  475. });
  476. }
  477. // Clear all visual elements first
  478. $('#boxcarpentry').empty();
  479. $('#boxRib').empty();
  480. // Rebuild walls with new coordinates - this triggers wall equations recalculation
  481. if (typeof editor !== 'undefined' && editor.architect) {
  482. editor.architect(WALLS);
  483. }
  484. // Rebuild rooms with new wall positions
  485. if (typeof editor !== 'undefined' && editor.make_rooms) {
  486. editor.make_rooms();
  487. }
  488. // Rebuild all objects (doors, windows, furniture) with updated positions
  489. if (OBJDATA) {
  490. OBJDATA.forEach(obj => {
  491. if (obj && obj.update) {
  492. obj.update();
  493. if (obj.graph) {
  494. $('#boxcarpentry').append(obj.graph);
  495. }
  496. }
  497. });
  498. }
  499. // Rebuild furniture if it exists in window.OBJDATA
  500. if (window.OBJDATA) {
  501. window.OBJDATA.forEach(obj => {
  502. if (obj && obj.update) {
  503. obj.update();
  504. if (obj.graph) {
  505. $('#boxcarpentry').append(obj.graph);
  506. }
  507. }
  508. });
  509. }
  510. // Rebuild all measurements and scale bars - this updates the displayed dimensions
  511. if (typeof rib === 'function') {
  512. rib();
  513. }
  514. // Update individual wall measurements if available
  515. WALLS.forEach(wall => {
  516. if (typeof inWallRib === 'function') {
  517. inWallRib(wall, true); // true = append mode, don't clear existing
  518. }
  519. });
  520. // Update the top-level total width/height scale bars
  521. if (typeof editor !== 'undefined' && editor.showScaleBox) {
  522. editor.showScaleBox();
  523. }
  524. // Force save the new state
  525. if (typeof save === 'function') {
  526. save();
  527. }
  528. } catch (e) {
  529. console.error('scaleAllElementsUniformly error:', e);
  530. }
  531. }
  532. /**
  533. * Get the actual displayed dimensions by checking the measurement ribbons
  534. */
  535. function getActualFloorplanDimensions() {
  536. try {
  537. // Look for measurement text elements that show the actual dimensions
  538. const ribElements = document.querySelectorAll('#boxRib text');
  539. let maxWidth = 0;
  540. let maxHeight = 0;
  541. ribElements.forEach(element => {
  542. const text = element.textContent;
  543. if (text && text.includes('.')) {
  544. const value = parseFloat(text);
  545. if (!isNaN(value)) {
  546. // Determine if this is likely a width or height measurement
  547. const rect = element.getBoundingClientRect();
  548. if (rect.width > rect.height) {
  549. maxWidth = Math.max(maxWidth, value);
  550. } else {
  551. maxHeight = Math.max(maxHeight, value);
  552. }
  553. }
  554. }
  555. });
  556. // If no measurements found, fall back to bounds calculation
  557. if (maxWidth === 0 || maxHeight === 0) {
  558. const bounds = calculateFloorplanBounds();
  559. return {
  560. width: bounds.width / meter,
  561. height: bounds.height / meter
  562. };
  563. }
  564. return {
  565. width: maxWidth,
  566. height: maxHeight
  567. };
  568. } catch (e) {
  569. console.error('getActualFloorplanDimensions error:', e);
  570. const bounds = calculateFloorplanBounds();
  571. return {
  572. width: bounds.width / meter,
  573. height: bounds.height / meter
  574. };
  575. }
  576. }
  577. /**
  578. * Trigger AI import modal dialog for importing AI JSON with scaling option
  579. */
  580. function triggerAIImportDialog() {
  581. // Clear previous values and messages
  582. document.getElementById('ai_json_input').value = '';
  583. document.getElementById('ai_target_width').value = '';
  584. document.getElementById('ai_json_name').textContent = '';
  585. document.getElementById('ai_error_msg').textContent = '';
  586. document.getElementById('ai_success_msg').textContent = '';
  587. document.getElementById('ai_import_btn').disabled = true;
  588. // Set up file input event listener
  589. const fileInput = document.getElementById('ai_json_input');
  590. fileInput.addEventListener('change', function(event) {
  591. const file = event.target.files[0];
  592. if (file) {
  593. document.getElementById('ai_json_name').textContent = file.name;
  594. validateAIImportForm();
  595. } else {
  596. document.getElementById('ai_json_name').textContent = '';
  597. validateAIImportForm();
  598. }
  599. });
  600. // Set up width input event listener
  601. const widthInput = document.getElementById('ai_target_width');
  602. widthInput.addEventListener('input', validateAIImportForm);
  603. // Set up import button event listener
  604. const importBtn = document.getElementById('ai_import_btn');
  605. importBtn.addEventListener('click', function() {
  606. const file = fileInput.files[0];
  607. const targetWidth = parseFloat(widthInput.value);
  608. if (file && targetWidth > 0) {
  609. importAIFloorplanJSONWithScaling(file, targetWidth).then((success) => {
  610. if (success) {
  611. // Close modal on success
  612. const modal = bootstrap.Modal.getInstance(document.getElementById('aiImportModal'));
  613. if (modal) modal.hide();
  614. }
  615. });
  616. }
  617. });
  618. // Show the modal
  619. const modal = new bootstrap.Modal(document.getElementById('aiImportModal'));
  620. modal.show();
  621. }
  622. /**
  623. * Validate AI import form and enable/disable import button
  624. */
  625. function validateAIImportForm() {
  626. const file = document.getElementById('ai_json_input').files[0];
  627. const targetWidth = parseFloat(document.getElementById('ai_target_width').value);
  628. const importBtn = document.getElementById('ai_import_btn');
  629. const isValid = file && targetWidth > 0;
  630. importBtn.disabled = !isValid;
  631. }
  632. /**
  633. * Import AI floorplan JSON with automatic scaling to target width
  634. * @param {File} file
  635. * @param {number} targetWidthM - Target width in meters
  636. * @returns {Promise<boolean>}
  637. */
  638. function importAIFloorplanJSONWithScaling(file, targetWidthM) {
  639. return new Promise((resolve) => {
  640. if (!file) {
  641. console.error('No file provided for AI import');
  642. document.getElementById('ai_error_msg').textContent = 'No file selected for AI import';
  643. resolve(false);
  644. return;
  645. }
  646. if (!targetWidthM || targetWidthM <= 0) {
  647. document.getElementById('ai_error_msg').textContent = 'Please specify a valid target width';
  648. resolve(false);
  649. return;
  650. }
  651. const reader = new FileReader();
  652. reader.onload = function (e) {
  653. try {
  654. const jsonData = JSON.parse(e.target.result);
  655. // Validate the JSON structure
  656. if (!validateAIImportData(jsonData)) {
  657. document.getElementById('ai_error_msg').textContent = 'Invalid AI JSON format. Expected {"walls": [[x0,y0,x1,y1], ...]}';
  658. resolve(false);
  659. return;
  660. }
  661. // Clear current plan
  662. clearCurrentFloorplan();
  663. // Import walls first (without scaling)
  664. const importSuccess = importAIWallsData(jsonData);
  665. if (!importSuccess) {
  666. document.getElementById('ai_error_msg').textContent = 'Failed to import wall data';
  667. resolve(false);
  668. return;
  669. }
  670. // Calculate current floorplan bounds after import
  671. const currentBounds = calculateFloorplanBounds();
  672. const currentWidthM = currentBounds.width / meter;
  673. if (currentWidthM <= 0) {
  674. document.getElementById('ai_error_msg').textContent = 'Invalid floorplan dimensions after import';
  675. resolve(false);
  676. return;
  677. }
  678. // Calculate and apply scale factor
  679. const scaleFactor = targetWidthM / currentWidthM;
  680. scaleAllElementsUniformly(scaleFactor);
  681. // Save state
  682. if (typeof save === 'function') save();
  683. document.getElementById('ai_success_msg').textContent = `AI floorplan imported and scaled to ${targetWidthM}m width (scale factor: ${scaleFactor.toFixed(2)})`;
  684. if (typeof fonc_button === 'function') {
  685. try { fonc_button('select_mode'); } catch (e) { /* noop */ }
  686. }
  687. // Center the imported plan in view
  688. if (typeof centerFloorplanView === 'function') {
  689. try { centerFloorplanView(40); } catch (e) { /* noop */ }
  690. }
  691. resolve(true);
  692. } catch (err) {
  693. console.error('Error importing AI JSON:', err);
  694. document.getElementById('ai_error_msg').textContent = 'AI import failed: ' + err.message;
  695. resolve(false);
  696. }
  697. };
  698. reader.onerror = function () {
  699. console.error('Error reading AI JSON file');
  700. document.getElementById('ai_error_msg').textContent = 'Error reading AI JSON file';
  701. resolve(false);
  702. };
  703. reader.readAsText(file);
  704. });
  705. }
  706. /**
  707. * Import walls data from AI JSON format
  708. * @param {Object} jsonData - The parsed JSON data
  709. * @returns {boolean} - Success status
  710. */
  711. function importAIWallsData(jsonData) {
  712. try {
  713. // Create walls (skip malformed segments)
  714. const created = [];
  715. const defaultThick = typeof wallSize !== 'undefined' ? wallSize : 0.2;
  716. const isFiniteNum = (v) => typeof v === 'number' && isFinite(v);
  717. const dist2 = (a, b) => {
  718. const dx = a.x - b.x, dy = a.y - b.y; return dx * dx + dy * dy;
  719. };
  720. let skipped = 0;
  721. for (let i = 0; i < jsonData.walls.length; i++) {
  722. const seg = jsonData.walls[i];
  723. // Validate structure and values
  724. if (!Array.isArray(seg) || seg.length !== 4) { skipped++; continue; }
  725. const start = { x: seg[0], y: seg[1] };
  726. const end = { x: seg[2], y: seg[3] };
  727. if (!isFiniteNum(start.x) || !isFiniteNum(start.y) || !isFiniteNum(end.x) || !isFiniteNum(end.y)) { skipped++; continue; }
  728. // Reject zero-length or near-zero walls
  729. if (dist2(start, end) < 1e-10) { skipped++; continue; }
  730. try {
  731. const w = new editor.wall(start, end, 'normal', defaultThick);
  732. // Basic sanity on constructed wall
  733. if (!w || !w.start || !w.end || !isFiniteNum(w.start.x) || !isFiniteNum(w.start.y) || !isFiniteNum(w.end.x) || !isFiniteNum(w.end.y)) { skipped++; continue; }
  734. WALLS.push(w);
  735. created.push(w);
  736. } catch (e2) {
  737. skipped++;
  738. }
  739. }
  740. // Connect walls by matching endpoints (with small tolerance)
  741. const tol = 1e-3;
  742. const eq = (a, b) => (Math.abs(a.x - b.x) <= tol && Math.abs(a.y - b.y) <= tol);
  743. for (let i = 0; i < created.length; i++) {
  744. const wi = created[i];
  745. for (let j = 0; j < created.length; j++) {
  746. if (i === j) continue;
  747. const wj = created[j];
  748. if (!wi.parent && eq(wj.end, wi.start)) wi.parent = wj;
  749. if (!wi.child && eq(wj.start, wi.end)) wi.child = wj;
  750. if (wi.parent && wi.child) break;
  751. }
  752. }
  753. // Compute wall geometry first
  754. editor.architect(WALLS);
  755. // If doors/windows provided, place them
  756. try {
  757. if (Array.isArray(jsonData.doors) || Array.isArray(jsonData.windows)) {
  758. addOpeningsFromAI(jsonData);
  759. }
  760. } catch (openErr) {
  761. console.warn('Opening placement warning:', openErr);
  762. }
  763. return true;
  764. } catch (err) {
  765. console.error('Error importing AI walls data:', err);
  766. return false;
  767. }
  768. }
  769. /**
  770. * Import simple AI floorplan JSON with format: { "walls": [[x0,y0,x1,y1], ...] }
  771. * @param {File} file
  772. * @returns {Promise<boolean>}
  773. */
  774. function importAIFloorplanJSON(file) {
  775. return new Promise((resolve) => {
  776. if (!file) {
  777. console.error('No file provided for AI import');
  778. if (typeof $('#boxinfo') !== 'undefined') $('#boxinfo').html('No file selected for AI import');
  779. resolve(false);
  780. return;
  781. }
  782. const reader = new FileReader();
  783. reader.onload = function (e) {
  784. try {
  785. const jsonData = JSON.parse(e.target.result);
  786. // Validate the JSON structure
  787. if (!validateAIImportData(jsonData)) {
  788. if (typeof $('#boxinfo') !== 'undefined') $('#boxinfo').html('Invalid AI JSON format. Expected {"walls": [[x0,y0,x1,y1], ...]}');
  789. resolve(false);
  790. return;
  791. }
  792. // Clear current plan
  793. clearCurrentFloorplan();
  794. // Create walls (skip malformed segments)
  795. const created = [];
  796. const defaultThick = typeof wallSize !== 'undefined' ? wallSize : 0.2;
  797. const isFiniteNum = (v) => typeof v === 'number' && isFinite(v);
  798. const dist2 = (a, b) => {
  799. const dx = a.x - b.x, dy = a.y - b.y; return dx * dx + dy * dy;
  800. };
  801. let skipped = 0;
  802. for (let i = 0; i < jsonData.walls.length; i++) {
  803. const seg = jsonData.walls[i];
  804. // Validate structure and values
  805. if (!Array.isArray(seg) || seg.length !== 4) { skipped++; continue; }
  806. const start = { x: seg[0], y: seg[1] };
  807. const end = { x: seg[2], y: seg[3] };
  808. if (!isFiniteNum(start.x) || !isFiniteNum(start.y) || !isFiniteNum(end.x) || !isFiniteNum(end.y)) { skipped++; continue; }
  809. // Reject zero-length or near-zero walls
  810. if (dist2(start, end) < 1e-10) { skipped++; continue; }
  811. try {
  812. const w = new editor.wall(start, end, 'normal', defaultThick);
  813. // Basic sanity on constructed wall
  814. if (!w || !w.start || !w.end || !isFiniteNum(w.start.x) || !isFiniteNum(w.start.y) || !isFiniteNum(w.end.x) || !isFiniteNum(w.end.y)) { skipped++; continue; }
  815. WALLS.push(w);
  816. created.push(w);
  817. } catch (e2) {
  818. skipped++;
  819. }
  820. }
  821. // Connect walls by matching endpoints (with small tolerance)
  822. const tol = 1e-3;
  823. const eq = (a, b) => (Math.abs(a.x - b.x) <= tol && Math.abs(a.y - b.y) <= tol);
  824. for (let i = 0; i < created.length; i++) {
  825. const wi = created[i];
  826. for (let j = 0; j < created.length; j++) {
  827. if (i === j) continue;
  828. const wj = created[j];
  829. if (!wi.parent && eq(wj.end, wi.start)) wi.parent = wj;
  830. if (!wi.child && eq(wj.start, wi.end)) wi.child = wj;
  831. if (wi.parent && wi.child) break;
  832. }
  833. }
  834. // Compute wall geometry first
  835. editor.architect(WALLS);
  836. // If doors/windows provided, place them
  837. try {
  838. if (Array.isArray(jsonData.doors) || Array.isArray(jsonData.windows)) {
  839. addOpeningsFromAI(jsonData);
  840. }
  841. } catch (openErr) {
  842. console.warn('Opening placement warning:', openErr);
  843. }
  844. // Save state
  845. if (typeof save === 'function') save();
  846. if (typeof $('#boxinfo') !== 'undefined') {
  847. const msg = skipped > 0 ? `AI floorplan imported successfully (skipped ${skipped} malformed wall${skipped>1?'s':''})` : 'AI floorplan imported successfully';
  848. $('#boxinfo').html(msg);
  849. }
  850. if (typeof fonc_button === 'function') {
  851. try { fonc_button('select_mode'); } catch (e) { /* noop */ }
  852. }
  853. // Center the imported plan in view
  854. if (typeof centerFloorplanView === 'function') {
  855. try { centerFloorplanView(40); } catch (e) { /* noop */ }
  856. }
  857. resolve(true);
  858. } catch (err) {
  859. console.error('Error importing AI JSON:', err);
  860. if (typeof $('#boxinfo') !== 'undefined') $('#boxinfo').html('AI import failed: ' + err.message);
  861. resolve(false);
  862. }
  863. };
  864. reader.onerror = function () {
  865. console.error('Error reading AI JSON file');
  866. if (typeof $('#boxinfo') !== 'undefined') $('#boxinfo').html('Error reading AI JSON file');
  867. resolve(false);
  868. };
  869. reader.readAsText(file);
  870. });
  871. }
  872. /**
  873. * Validate AI import data
  874. * @param {Object} data
  875. */
  876. function validateAIImportData(data) {
  877. if (!data || !Array.isArray(data.walls)) return false;
  878. // walls: [[x0,y0,x1,y1], ...]
  879. for (let i = 0; i < data.walls.length; i++) {
  880. const seg = data.walls[i];
  881. if (!Array.isArray(seg) || seg.length !== 4) return false;
  882. for (let k = 0; k < 4; k++) {
  883. if (typeof seg[k] !== 'number' || !isFinite(seg[k])) return false;
  884. }
  885. }
  886. // Optional doors/windows: arrays of 8 numbers per rectangle
  887. const checkRects = (arr) => {
  888. if (!arr) return true;
  889. if (!Array.isArray(arr)) return false;
  890. for (let i = 0; i < arr.length; i++) {
  891. const r = arr[i];
  892. if (!Array.isArray(r) || r.length !== 8) return false;
  893. for (let k = 0; k < 8; k++) {
  894. if (typeof r[k] !== 'number' || !isFinite(r[k])) return false;
  895. }
  896. }
  897. return true;
  898. };
  899. if (!checkRects(data.doors)) return false;
  900. if (!checkRects(data.windows)) return false;
  901. return true;
  902. }
  903. // ------------------------ Helpers for AI openings placement ------------------------
  904. function addOpeningsFromAI(jsonData) {
  905. const rectsWithType = [];
  906. if (Array.isArray(jsonData.doors)) {
  907. for (const r of jsonData.doors) rectsWithType.push({ type: 'simple', rect: r });
  908. }
  909. if (Array.isArray(jsonData.windows)) {
  910. for (const r of jsonData.windows) rectsWithType.push({ type: 'fix', rect: r });
  911. }
  912. for (const item of rectsWithType) {
  913. const pts = [
  914. { x: item.rect[0], y: item.rect[1] },
  915. { x: item.rect[2], y: item.rect[3] },
  916. { x: item.rect[4], y: item.rect[5] },
  917. { x: item.rect[6], y: item.rect[7] }
  918. ];
  919. const center = {
  920. x: (pts[0].x + pts[1].x + pts[2].x + pts[3].x) / 4,
  921. y: (pts[0].y + pts[1].y + pts[2].y + pts[3].y) / 4
  922. };
  923. // Standardized sizes (pixels) based on meter scale
  924. const meterPx = 100;
  925. const standardDoorWidthPx = 0.6 * meterPx; // 0.6 m doors
  926. const standardWindowWidthPx = 0.8 * meterPx; // 0.8 m windows
  927. const minWindowSpacing = 0.2 * meterPx; // 0.2 m minimum spacing between windows
  928. // Find best wall by distance to the bounds midpoint (no intersection required)
  929. let best = null; // { wall, pos, widthAlongClamped, widthAlongDesired, angleSign }
  930. for (const wall of WALLS) {
  931. const wdx = wall.end.x - wall.start.x;
  932. const wdy = wall.end.y - wall.start.y;
  933. const wlen = Math.hypot(wdx, wdy);
  934. if (wlen < 1e-6) continue;
  935. const ux = wdx / wlen, uy = wdy / wlen; // along-wall unit
  936. const vx = -uy, vy = ux; // perpendicular unit
  937. // projections of corners along wall (s) and perpendicular (p)
  938. let sMin = Infinity, sMax = -Infinity;
  939. for (const P of pts) {
  940. const rx = P.x - wall.start.x, ry = P.y - wall.start.y;
  941. const s = rx * ux + ry * uy;
  942. if (s < sMin) sMin = s;
  943. if (s > sMax) sMax = s;
  944. }
  945. // center projection and closest point on wall
  946. const rcx = center.x - wall.start.x, rcy = center.y - wall.start.y;
  947. const sCenter = rcx * ux + rcy * uy;
  948. const pCenter = rcx * vx + rcy * vy;
  949. const t = Math.max(0, Math.min(wlen, sCenter));
  950. const closest = { x: wall.start.x + ux * t, y: wall.start.y + uy * t };
  951. // Distance from center to the wall segment
  952. const perpDist = Math.hypot(center.x - closest.x, center.y - closest.y);
  953. // Calculate available space for windows/doors
  954. const clamp = (v) => Math.max(0, Math.min(wlen, v));
  955. const sMinC = clamp(sMin);
  956. const sMaxC = clamp(sMax);
  957. const widthAlongClamped = Math.max(0, sMaxC - sMinC);
  958. const widthAlongDesired = (item.type === 'simple') ? standardDoorWidthPx : widthAlongClamped;
  959. const angleSign = (pCenter > 0) ? 1 : 0;
  960. const candidate = { wall, pos: { x: closest.x, y: closest.y, wall }, widthAlongClamped, widthAlongDesired, angleSign, score: perpDist, sMinC, sMaxC, ux, uy };
  961. if (!best || candidate.score < best.score) best = candidate;
  962. }
  963. if (!best) continue; // no walls available
  964. // For windows, create multiple default-sized windows instead of one large window
  965. if (item.type === 'fix') { // windows
  966. const availableSpace = best.widthAlongClamped;
  967. const numWindows = Math.floor(availableSpace / (standardWindowWidthPx + minWindowSpacing));
  968. if (numWindows > 0) {
  969. // Calculate total width needed for all windows and spacing
  970. const totalWindowWidth = numWindows * standardWindowWidthPx;
  971. const totalSpacingWidth = (numWindows - 1) * minWindowSpacing;
  972. const totalNeededWidth = totalWindowWidth + totalSpacingWidth;
  973. // Center the window group in the available space
  974. const startOffset = (availableSpace - totalNeededWidth) / 2;
  975. // Create each window
  976. for (let i = 0; i < numWindows; i++) {
  977. try {
  978. const wall = best.wall;
  979. const angleDeg = qSVG.angleDeg(wall.start.x, wall.start.y, wall.end.x, wall.end.y);
  980. // Calculate position for this window
  981. const windowOffset = best.sMinC + startOffset + (i * (standardWindowWidthPx + minWindowSpacing)) + (standardWindowWidthPx / 2);
  982. const windowPos = {
  983. x: wall.start.x + best.ux * windowOffset,
  984. y: wall.start.y + best.uy * windowOffset,
  985. wall: wall
  986. };
  987. const obj = new editor.obj2D('inWall', 'doorWindow', item.type, windowPos, 0, 0, standardWindowWidthPx, 'normal', wall.thick);
  988. let finalAngle = angleDeg;
  989. let sign = 0;
  990. if (best.angleSign === 1) { finalAngle += 180; sign = 1; }
  991. obj.x = windowPos.x;
  992. obj.y = windowPos.y;
  993. obj.angle = finalAngle;
  994. obj.angleSign = sign;
  995. // Limits along the wall
  996. let limits = limitObj(wall.equations.base, obj.size, windowPos);
  997. if (Array.isArray(limits)) {
  998. const onSeg = (pt) => qSVG.btwn(pt.x, wall.start.x, wall.end.x) && qSVG.btwn(pt.y, wall.start.y, wall.end.y);
  999. if (onSeg(limits[0]) && onSeg(limits[1])) {
  1000. obj.limit = limits;
  1001. }
  1002. }
  1003. OBJDATA.push(obj);
  1004. if (typeof $ !== 'undefined') {
  1005. $('#boxcarpentry').append(obj.graph);
  1006. }
  1007. obj.update();
  1008. } catch (e) {
  1009. console.warn('Failed to create window object:', e);
  1010. }
  1011. }
  1012. }
  1013. } else {
  1014. // Original door logic (single door)
  1015. try {
  1016. const wall = best.wall;
  1017. const angleDeg = qSVG.angleDeg(wall.start.x, wall.start.y, wall.end.x, wall.end.y);
  1018. // Use standardized width for doors; clamped bounds width for windows
  1019. // Ensure it fits the usable span on the wall; shrink if necessary
  1020. const minWidthPx = 20; // don't create degenerate tiny openings
  1021. const spanFit = Math.max(0, best.widthAlongClamped);
  1022. let sizeForObj = Math.max(minWidthPx, Math.min(best.widthAlongDesired, spanFit));
  1023. const obj = new editor.obj2D('inWall', 'doorWindow', item.type, best.pos, 0, 0, sizeForObj, 'normal', wall.thick);
  1024. let finalAngle = angleDeg;
  1025. let sign = 0;
  1026. if (best.angleSign === 1) { finalAngle += 180; sign = 1; }
  1027. obj.x = best.pos.x;
  1028. obj.y = best.pos.y;
  1029. obj.angle = finalAngle;
  1030. obj.angleSign = sign;
  1031. // Limits along the wall
  1032. let limits = limitObj(wall.equations.base, obj.size, best.pos);
  1033. if (Array.isArray(limits)) {
  1034. // verify both points are on the segment
  1035. const onSeg = (pt) => qSVG.btwn(pt.x, wall.start.x, wall.end.x) && qSVG.btwn(pt.y, wall.start.y, wall.end.y);
  1036. // If limits are off the segment, clamp size to fit the segment span
  1037. if (!(onSeg(limits[0]) && onSeg(limits[1]))) {
  1038. // Compute clamped endpoints projected to the wall segment extents
  1039. const clampToSeg = (pt) => ({
  1040. x: qSVG.btwn(pt.x, wall.start.x, wall.end.x) ? pt.x : (Math.abs(pt.x - wall.start.x) < Math.abs(pt.x - wall.end.x) ? wall.start.x : wall.end.x),
  1041. y: qSVG.btwn(pt.y, wall.start.y, wall.end.y) ? pt.y : (Math.abs(pt.y - wall.start.y) < Math.abs(pt.y - wall.end.y) ? wall.start.y : wall.end.y)
  1042. });
  1043. const c0 = clampToSeg(limits[0]);
  1044. const c1 = clampToSeg(limits[1]);
  1045. const clampedSpan = qSVG.measure(c0.x, c0.y, c1.x, c1.y);
  1046. if (isFinite(clampedSpan) && clampedSpan > 0) {
  1047. obj.size = Math.max(minWidthPx, Math.min(obj.size, clampedSpan));
  1048. limits = limitObj(wall.equations.base, obj.size, best.pos);
  1049. }
  1050. }
  1051. if (Array.isArray(limits)) {
  1052. const onSeg2 = (pt) => qSVG.btwn(pt.x, wall.start.x, wall.end.x) && qSVG.btwn(pt.y, wall.start.y, wall.end.y);
  1053. if (onSeg2(limits[0]) && onSeg2(limits[1])) {
  1054. obj.limit = limits;
  1055. // SNAP: set position exactly to the midpoint of the limits on the wall
  1056. const mid = qSVG.middle(limits[0].x, limits[0].y, limits[1].x, limits[1].y);
  1057. obj.x = mid.x;
  1058. obj.y = mid.y;
  1059. }
  1060. }
  1061. }
  1062. OBJDATA.push(obj);
  1063. if (typeof $ !== 'undefined') {
  1064. $('#boxcarpentry').append(obj.graph);
  1065. }
  1066. obj.update();
  1067. } catch (e) {
  1068. console.warn('Failed to create opening object:', e);
  1069. }
  1070. }
  1071. }
  1072. // Refresh ribbons/indicators
  1073. if (typeof rib === 'function') rib();
  1074. }
  1075. /**
  1076. * Export floorplan data with custom options
  1077. * @param {Object} options - Export configuration
  1078. * @param {string} options.filename - Custom filename
  1079. * @param {boolean} options.includeMetadata - Include metadata
  1080. * @param {boolean} options.minified - Export minified JSON (no formatting)
  1081. */
  1082. function exportFloorplanCustom(options = {}) {
  1083. const {
  1084. filename = 'floorplan_' + new Date().toISOString().slice(0, 10),
  1085. includeMetadata = true,
  1086. minified = false
  1087. } = options;
  1088. try {
  1089. // Prepare data similar to main export function
  1090. const wallDataForExport = [];
  1091. for (let k in WALLS) {
  1092. const wall = { ...WALLS[k] };
  1093. if (wall.child != null) {
  1094. wall.child = WALLS.indexOf(wall.child);
  1095. }
  1096. if (wall.parent != null) {
  1097. wall.parent = WALLS.indexOf(wall.parent);
  1098. }
  1099. wallDataForExport.push(wall);
  1100. }
  1101. const objDataForExport = [];
  1102. for (let k in OBJDATA) {
  1103. const obj = { ...OBJDATA[k] };
  1104. delete obj.graph;
  1105. objDataForExport.push(obj);
  1106. }
  1107. const exportData = {
  1108. version: "0.95",
  1109. exportDate: new Date().toISOString(),
  1110. data: {
  1111. walls: wallDataForExport,
  1112. objects: objDataForExport,
  1113. rooms: [...ROOM]
  1114. }
  1115. };
  1116. if (includeMetadata) {
  1117. exportData.metadata = {
  1118. totalWalls: wallDataForExport.length,
  1119. totalObjects: objDataForExport.length,
  1120. totalRooms: ROOM.length,
  1121. settings: {
  1122. wallSize: wallSize,
  1123. partitionSize: partitionSize,
  1124. meter: meter,
  1125. grid: grid
  1126. }
  1127. };
  1128. }
  1129. // Create JSON with or without formatting
  1130. const jsonString = minified ?
  1131. JSON.stringify(exportData) :
  1132. JSON.stringify(exportData, null, 2);
  1133. // Download the file
  1134. const blob = new Blob([jsonString], { type: 'application/json' });
  1135. const url = URL.createObjectURL(blob);
  1136. const a = document.createElement('a');
  1137. a.href = url;
  1138. a.download = filename.endsWith('.json') ? filename : filename + '.json';
  1139. document.body.appendChild(a);
  1140. a.click();
  1141. document.body.removeChild(a);
  1142. URL.revokeObjectURL(url);
  1143. // Restore wall references
  1144. for (let k in WALLS) {
  1145. if (WALLS[k].child !== null && typeof WALLS[k].child === 'number') {
  1146. WALLS[k].child = WALLS[WALLS[k].child];
  1147. }
  1148. if (WALLS[k].parent !== null && typeof WALLS[k].parent === 'number') {
  1149. WALLS[k].parent = WALLS[WALLS[k].parent];
  1150. }
  1151. }
  1152. return true;
  1153. } catch (error) {
  1154. console.error('Error exporting floorplan:', error);
  1155. return false;
  1156. }
  1157. }
  1158. /**
  1159. * Get floorplan data as JSON string (without downloading)
  1160. * @param {boolean} includeMetadata - Whether to include metadata
  1161. * @returns {string} JSON string of floorplan data
  1162. */
  1163. function getFloorplanJSON(includeMetadata = true) {
  1164. try {
  1165. // Prepare data for JSON conversion
  1166. const wallDataForExport = [];
  1167. for (let k in WALLS) {
  1168. const wall = { ...WALLS[k] };
  1169. if (wall.child != null) {
  1170. wall.child = WALLS.indexOf(wall.child);
  1171. }
  1172. if (wall.parent != null) {
  1173. wall.parent = WALLS.indexOf(wall.parent);
  1174. }
  1175. wallDataForExport.push(wall);
  1176. }
  1177. const objDataForExport = [];
  1178. for (let k in OBJDATA) {
  1179. const obj = { ...OBJDATA[k] };
  1180. delete obj.graph;
  1181. objDataForExport.push(obj);
  1182. }
  1183. const exportData = {
  1184. version: "0.95",
  1185. exportDate: new Date().toISOString(),
  1186. data: {
  1187. walls: wallDataForExport,
  1188. objects: objDataForExport,
  1189. rooms: [...ROOM]
  1190. }
  1191. };
  1192. if (includeMetadata) {
  1193. exportData.metadata = {
  1194. totalWalls: wallDataForExport.length,
  1195. totalObjects: objDataForExport.length,
  1196. totalRooms: ROOM.length
  1197. };
  1198. }
  1199. // Restore wall references
  1200. for (let k in WALLS) {
  1201. if (WALLS[k].child !== null && typeof WALLS[k].child === 'number') {
  1202. WALLS[k].child = WALLS[WALLS[k].child];
  1203. }
  1204. if (WALLS[k].parent !== null && typeof WALLS[k].parent === 'number') {
  1205. WALLS[k].parent = WALLS[WALLS[k].parent];
  1206. }
  1207. }
  1208. return JSON.stringify(exportData, null, 2);
  1209. } catch (error) {
  1210. console.error('Error generating floorplan JSON:', error);
  1211. return null;
  1212. }
  1213. }
  1214. /**
  1215. * Import floorplan data from a JSON file
  1216. * @param {File} file - The JSON file to import
  1217. * @returns {Promise<boolean>} - Success status
  1218. */
  1219. function importFloorplanJSON(file) {
  1220. return new Promise((resolve, reject) => {
  1221. if (!file) {
  1222. console.error('No file provided for import');
  1223. if (typeof $('#boxinfo') !== 'undefined') {
  1224. $('#boxinfo').html('No file selected for import');
  1225. }
  1226. resolve(false);
  1227. return;
  1228. }
  1229. // Check if it's a JSON file
  1230. if (!file.name.toLowerCase().endsWith('.json')) {
  1231. console.error('File must be a JSON file');
  1232. if (typeof $('#boxinfo') !== 'undefined') {
  1233. $('#boxinfo').html('Please select a JSON file');
  1234. }
  1235. resolve(false);
  1236. return;
  1237. }
  1238. const reader = new FileReader();
  1239. reader.onload = function(e) {
  1240. try {
  1241. const jsonData = JSON.parse(e.target.result);
  1242. // Validate the JSON structure
  1243. if (!validateImportData(jsonData)) {
  1244. console.error('Invalid floorplan JSON format');
  1245. if (typeof $('#boxinfo') !== 'undefined') {
  1246. $('#boxinfo').html('Invalid floorplan file format');
  1247. }
  1248. resolve(false);
  1249. return;
  1250. }
  1251. // Load the data into the editor
  1252. if (loadFloorplanData(jsonData)) {
  1253. console.log('Floorplan imported successfully');
  1254. if (typeof $('#boxinfo') !== 'undefined') {
  1255. $('#boxinfo').html('Floorplan imported successfully!');
  1256. }
  1257. if (typeof fonc_button === 'function') {
  1258. try { fonc_button('select_mode'); } catch (e) { /* noop */ }
  1259. }
  1260. resolve(true);
  1261. } else {
  1262. console.error('Failed to load floorplan data');
  1263. if (typeof $('#boxinfo') !== 'undefined') {
  1264. $('#boxinfo').html('Failed to load floorplan data');
  1265. }
  1266. resolve(false);
  1267. }
  1268. } catch (error) {
  1269. console.error('Error parsing JSON file:', error);
  1270. if (typeof $('#boxinfo') !== 'undefined') {
  1271. $('#boxinfo').html('Error reading file: Invalid JSON');
  1272. }
  1273. resolve(false);
  1274. }
  1275. };
  1276. reader.onerror = function() {
  1277. console.error('Error reading file');
  1278. if (typeof $('#boxinfo') !== 'undefined') {
  1279. $('#boxinfo').html('Error reading file');
  1280. }
  1281. resolve(false);
  1282. };
  1283. reader.readAsText(file);
  1284. });
  1285. }
  1286. /**
  1287. * Validate the structure of imported JSON data
  1288. * @param {Object} jsonData - The parsed JSON data
  1289. * @returns {boolean} - Whether the data is valid
  1290. */
  1291. function validateImportData(jsonData) {
  1292. // Check for required top-level structure
  1293. if (!jsonData || typeof jsonData !== 'object') {
  1294. return false;
  1295. }
  1296. // Check for data object
  1297. if (!jsonData.data || typeof jsonData.data !== 'object') {
  1298. return false;
  1299. }
  1300. const data = jsonData.data;
  1301. // Check for required arrays
  1302. if (!Array.isArray(data.walls) || !Array.isArray(data.objects) || !Array.isArray(data.rooms)) {
  1303. return false;
  1304. }
  1305. // Basic validation of wall structure
  1306. for (let wall of data.walls) {
  1307. if (!wall.start || !wall.end || typeof wall.thick === 'undefined') {
  1308. return false;
  1309. }
  1310. if (typeof wall.start.x === 'undefined' || typeof wall.start.y === 'undefined' ||
  1311. typeof wall.end.x === 'undefined' || typeof wall.end.y === 'undefined') {
  1312. return false;
  1313. }
  1314. }
  1315. return true;
  1316. }
  1317. /**
  1318. * Load floorplan data into the editor
  1319. * @param {Object} jsonData - The validated JSON data
  1320. * @returns {boolean} - Success status
  1321. */
  1322. function loadFloorplanData(jsonData) {
  1323. try {
  1324. // Clear existing data
  1325. clearCurrentFloorplan();
  1326. const data = jsonData.data;
  1327. // Load walls
  1328. WALLS = [];
  1329. for (let wallData of data.walls) {
  1330. WALLS.push(wallData);
  1331. }
  1332. // Restore wall parent/child references from indices
  1333. for (let k in WALLS) {
  1334. if (WALLS[k].child !== null && typeof WALLS[k].child === 'number') {
  1335. WALLS[k].child = WALLS[WALLS[k].child];
  1336. }
  1337. if (WALLS[k].parent !== null && typeof WALLS[k].parent === 'number') {
  1338. WALLS[k].parent = WALLS[WALLS[k].parent];
  1339. }
  1340. }
  1341. // Load rooms
  1342. ROOM = [];
  1343. for (let roomData of data.rooms) {
  1344. ROOM.push(roomData);
  1345. }
  1346. // Load objects
  1347. OBJDATA = [];
  1348. for (let objData of data.objects) {
  1349. try {
  1350. // Recreate the object using the editor's obj2D constructor
  1351. let obj = new editor.obj2D(
  1352. objData.family || 'free',
  1353. objData.class || 'furniture',
  1354. objData.type || 'default',
  1355. { x: objData.x || 0, y: objData.y || 0 },
  1356. objData.angle || 0,
  1357. objData.angleSign || 0,
  1358. objData.size || 60,
  1359. objData.hinge || 'normal',
  1360. objData.thick || 20,
  1361. objData.value || null
  1362. );
  1363. // Restore additional properties
  1364. if (objData.limit) obj.limit = objData.limit;
  1365. OBJDATA.push(obj);
  1366. // Add to appropriate SVG container
  1367. if (obj.class === 'energy') {
  1368. $('#boxEnergy').append(obj.graph);
  1369. } else {
  1370. $('#boxcarpentry').append(obj.graph);
  1371. }
  1372. obj.update();
  1373. } catch (objError) {
  1374. console.warn('Failed to load object:', objData, objError);
  1375. // Continue loading other objects even if one fails
  1376. }
  1377. }
  1378. // Rebuild the visual representation
  1379. if (typeof editor !== 'undefined' && editor.architect) {
  1380. editor.architect(WALLS);
  1381. }
  1382. if (typeof editor !== 'undefined' && editor.showScaleBox) {
  1383. editor.showScaleBox();
  1384. }
  1385. if (typeof rib === 'function') {
  1386. rib();
  1387. }
  1388. // Save the imported state to history.
  1389. // Suppress save if background image element is not present but previous snapshot had one.
  1390. if (typeof save === 'function') {
  1391. try { if (typeof window !== 'undefined') window.__suppressSaveIfNoBg = true; } catch(_) {}
  1392. save();
  1393. }
  1394. return true;
  1395. } catch (error) {
  1396. console.error('Error loading floorplan data:', error);
  1397. return false;
  1398. }
  1399. }
  1400. /**
  1401. * Clear the current floorplan data
  1402. */
  1403. function clearCurrentFloorplan() {
  1404. try {
  1405. // Clear objects and their SVG elements
  1406. for (let k in OBJDATA) {
  1407. if (OBJDATA[k].graph && OBJDATA[k].graph.remove) {
  1408. OBJDATA[k].graph.remove();
  1409. }
  1410. }
  1411. OBJDATA = [];
  1412. // Clear walls
  1413. WALLS = [];
  1414. // Clear rooms
  1415. ROOM = [];
  1416. // Clear SVG containers
  1417. if (typeof $ !== 'undefined') {
  1418. $('#boxwall').empty();
  1419. $('#boxcarpentry').empty();
  1420. $('#boxEnergy').empty();
  1421. $('#boxRoom').empty();
  1422. $('#boxArea').empty();
  1423. $('#boxRib').empty();
  1424. $('#boxText').empty();
  1425. }
  1426. } catch (error) {
  1427. console.error('Error clearing floorplan:', error);
  1428. }
  1429. }
  1430. /**
  1431. * Trigger file input dialog for importing
  1432. */
  1433. function triggerImportDialog() {
  1434. // Create a hidden file input element
  1435. const fileInput = document.createElement('input');
  1436. fileInput.type = 'file';
  1437. fileInput.accept = '.json';
  1438. fileInput.style.display = 'none';
  1439. fileInput.addEventListener('change', function(event) {
  1440. const file = event.target.files[0];
  1441. if (file) {
  1442. importFloorplanJSON(file).then(success => {
  1443. // Clean up the temporary input element
  1444. document.body.removeChild(fileInput);
  1445. });
  1446. } else {
  1447. document.body.removeChild(fileInput);
  1448. }
  1449. });
  1450. // Add to DOM and trigger click
  1451. document.body.appendChild(fileInput);
  1452. fileInput.click();
  1453. }
  1454. /**
  1455. * Import an image file as background layer
  1456. * @param {File} file - The image file to import
  1457. * @returns {Promise<boolean>} - Success status
  1458. */
  1459. function importBackgroundImage(file) {
  1460. return new Promise((resolve, reject) => {
  1461. if (!file) {
  1462. console.error('No file provided for image import');
  1463. if (typeof $('#boxinfo') !== 'undefined') {
  1464. $('#boxinfo').html('No image file selected');
  1465. }
  1466. resolve(false);
  1467. return;
  1468. }
  1469. // Check if it's an image file
  1470. const validTypes = ['image/png', 'image/jpeg', 'image/jpg'];
  1471. const validExtensions = ['.png', '.jpg', '.jpeg'];
  1472. const fileName = file.name.toLowerCase();
  1473. if (!validTypes.includes(file.type) && !validExtensions.some(ext => fileName.endsWith(ext))) {
  1474. console.error('File must be a PNG or JPG image');
  1475. if (typeof $('#boxinfo') !== 'undefined') {
  1476. $('#boxinfo').html('Please select a PNG or JPG image file');
  1477. }
  1478. resolve(false);
  1479. return;
  1480. }
  1481. const reader = new FileReader();
  1482. reader.onload = function(e) {
  1483. try {
  1484. const imageDataUrl = e.target.result;
  1485. // Add the image as a background layer
  1486. if (addBackgroundImage(imageDataUrl, file.name)) {
  1487. console.log('Background image imported successfully');
  1488. if (typeof $('#boxinfo') !== 'undefined') {
  1489. $('#boxinfo').html('Background image imported successfully!');
  1490. }
  1491. // Update UI: show filename and enable Floorplan mode button
  1492. try {
  1493. const nameEl = document.getElementById('floorplan_filename');
  1494. if (nameEl) nameEl.textContent = file.name || '';
  1495. const btn = document.getElementById('floorplan_mode_btn');
  1496. if (btn) btn.disabled = false;
  1497. } catch(_) {}
  1498. resolve(true);
  1499. } else {
  1500. console.error('Failed to add background image');
  1501. if (typeof $('#boxinfo') !== 'undefined') {
  1502. $('#boxinfo').html('Failed to add background image');
  1503. }
  1504. resolve(false);
  1505. }
  1506. } catch (error) {
  1507. console.error('Error processing image file:', error);
  1508. if (typeof $('#boxinfo') !== 'undefined') {
  1509. $('#boxinfo').html('Error processing image file');
  1510. }
  1511. resolve(false);
  1512. }
  1513. };
  1514. reader.onerror = function() {
  1515. console.error('Error reading image file');
  1516. if (typeof $('#boxinfo') !== 'undefined') {
  1517. $('#boxinfo').html('Error reading image file');
  1518. }
  1519. resolve(false);
  1520. };
  1521. reader.readAsDataURL(file);
  1522. });
  1523. }
  1524. /**
  1525. * Add an image as a background layer to the SVG
  1526. * @param {string} imageDataUrl - The data URL of the image
  1527. * @param {string} fileName - The original filename
  1528. * @returns {boolean} - Success status
  1529. */
  1530. function addBackgroundImage(imageDataUrl, fileName) {
  1531. try {
  1532. // Capture existing image geometry if same image is being reloaded
  1533. let previousGeometry = null;
  1534. try {
  1535. const existingEl = document.getElementById('backgroundImage');
  1536. if (existingEl) {
  1537. const prevHref = existingEl.getAttribute('href') || existingEl.getAttribute('xlink:href') || '';
  1538. if (prevHref && imageDataUrl && prevHref === imageDataUrl) {
  1539. previousGeometry = {
  1540. x: parseFloat(existingEl.getAttribute('x')) || 0,
  1541. y: parseFloat(existingEl.getAttribute('y')) || 0,
  1542. width: parseFloat(existingEl.getAttribute('width')) || 0,
  1543. height: parseFloat(existingEl.getAttribute('height')) || 0,
  1544. opacity: parseFloat(existingEl.getAttribute('opacity'))
  1545. };
  1546. if (typeof console !== 'undefined' && console.debug) {
  1547. console.debug('[addBackgroundImage] preserving previous geometry for same image', previousGeometry);
  1548. }
  1549. }
  1550. }
  1551. } catch (_) {}
  1552. // Remove any existing background image
  1553. removeBackgroundImage();
  1554. // Create an image element in the SVG
  1555. const svgElement = document.getElementById('lin');
  1556. if (!svgElement) {
  1557. console.error('SVG element not found');
  1558. return false;
  1559. }
  1560. // Create image element
  1561. const imageElement = document.createElementNS('http://www.w3.org/2000/svg', 'image');
  1562. imageElement.setAttribute('id', 'backgroundImage');
  1563. // Add double-click event handler
  1564. imageElement.addEventListener('dblclick', function(e) {
  1565. e.preventDefault();
  1566. e.stopPropagation();
  1567. showBackgroundImageTools();
  1568. });
  1569. // Add drag functionality
  1570. let isDragging = false;
  1571. let dragStartX = 0;
  1572. let dragStartY = 0;
  1573. let imageStartX = 0;
  1574. let imageStartY = 0;
  1575. imageElement.addEventListener('mousedown', function(e) {
  1576. // Only enable dragging when background image tools are visible
  1577. if (!document.getElementById('backgroundImageTools').style.display ||
  1578. document.getElementById('backgroundImageTools').style.display === 'none') {
  1579. return;
  1580. }
  1581. e.preventDefault();
  1582. e.stopPropagation();
  1583. isDragging = true;
  1584. window.draggingBackgroundImage = true; // inform engine to pause scene panning
  1585. dragStartX = e.clientX;
  1586. dragStartY = e.clientY;
  1587. imageStartX = parseFloat(imageElement.getAttribute('x')) || 0;
  1588. imageStartY = parseFloat(imageElement.getAttribute('y')) || 0;
  1589. imageElement.style.cursor = 'grabbing';
  1590. });
  1591. document.addEventListener('mousemove', function(e) {
  1592. if (!isDragging) return;
  1593. e.preventDefault();
  1594. const deltaX = e.clientX - dragStartX;
  1595. const deltaY = e.clientY - dragStartY;
  1596. const newX = imageStartX + deltaX;
  1597. const newY = imageStartY + deltaY;
  1598. imageElement.setAttribute('x', newX);
  1599. imageElement.setAttribute('y', newY);
  1600. });
  1601. document.addEventListener('mouseup', function(e) {
  1602. if (isDragging) {
  1603. isDragging = false;
  1604. window.draggingBackgroundImage = false;
  1605. updateImageCursor();
  1606. }
  1607. });
  1608. // Function to update cursor based on tools panel visibility
  1609. function updateImageCursor() {
  1610. const toolsPanel = document.getElementById('backgroundImageTools');
  1611. if (toolsPanel && toolsPanel.style.display !== 'none' &&
  1612. window.getComputedStyle(toolsPanel).display !== 'none') {
  1613. imageElement.style.cursor = 'grab';
  1614. } else {
  1615. imageElement.style.cursor = 'pointer';
  1616. }
  1617. }
  1618. // Store the cursor update function for later use
  1619. imageElement.updateCursor = updateImageCursor;
  1620. // Set initial cursor
  1621. updateImageCursor();
  1622. // Do not show default size/position; wait for intrinsic probe to set them
  1623. // Keep preserveAspectRatio but hide initially to avoid flashing at 0,0 1100x700
  1624. imageElement.setAttribute('preserveAspectRatio', 'xMinYMin meet');
  1625. imageElement.setAttribute('opacity', '0'); // will be restored after sizing
  1626. // Mark that background image sizing is in progress to avoid premature snapshotting
  1627. try { if (typeof window !== 'undefined') window.__bgSizing = true; } catch(_) {}
  1628. // Add to the SVG, but after the grid and before other elements
  1629. const boxGrid = document.getElementById('boxgrid');
  1630. if (boxGrid && boxGrid.nextSibling) {
  1631. svgElement.insertBefore(imageElement, boxGrid.nextSibling);
  1632. } else {
  1633. // Fallback: add as first child after defs
  1634. const defs = svgElement.querySelector('defs');
  1635. if (defs && defs.nextSibling) {
  1636. svgElement.insertBefore(imageElement, defs.nextSibling);
  1637. } else {
  1638. svgElement.insertBefore(imageElement, svgElement.firstChild);
  1639. }
  1640. }
  1641. // Attach a MutationObserver to trace attribute changes on the background image
  1642. try {
  1643. if (window._bgImgObserver) {
  1644. try { window._bgImgObserver.disconnect(); } catch(_) {}
  1645. }
  1646. const attrsToWatch = ['x','y','width','height','opacity','href','xlink:href'];
  1647. const observer = new MutationObserver((mutations) => {
  1648. mutations.forEach(m => {
  1649. if (m.type === 'attributes') {
  1650. const name = m.attributeName;
  1651. if (attrsToWatch.includes(name)) {
  1652. const newVal = imageElement.getAttribute(name) || imageElement.getAttributeNS('http://www.w3.org/1999/xlink', name) || null;
  1653. const oldVal = m.oldValue;
  1654. if (typeof console !== 'undefined') {
  1655. console.debug('[bgImage observe]', { name, oldVal, newVal });
  1656. if (console.trace) console.trace('[bgImage attribute changed]');
  1657. }
  1658. }
  1659. }
  1660. });
  1661. });
  1662. observer.observe(imageElement, { attributes: true, attributeOldValue: true, attributeFilter: attrsToWatch });
  1663. window._bgImgObserver = observer;
  1664. } catch(_) { /* ignore observer errors */ }
  1665. // Use the uploaded image's intrinsic size to set initial SVG image dimensions
  1666. // so landscape/portrait are respected, and center it within the 1100x700 viewBox
  1667. try {
  1668. const probe = new Image();
  1669. probe.onload = function() {
  1670. const natW = probe.naturalWidth || 1100;
  1671. const natH = probe.naturalHeight || 700;
  1672. // Establish base viewBox size (SVG is 1100x700)
  1673. const baseW = 1100;
  1674. const baseH = 700;
  1675. // Compute initial size preserving aspect ratio to fit within viewBox
  1676. const scale = Math.min(baseW / natW, baseH / natH);
  1677. const w = Math.max(1, Math.round(natW * scale));
  1678. const h = Math.max(1, Math.round(natH * scale));
  1679. // Centered position
  1680. const cx = Math.round((baseW - w) / 2);
  1681. const cy = Math.round((baseH - h) / 2);
  1682. // Apply geometry; if reloading same image, preserve previous geometry
  1683. if (previousGeometry) {
  1684. const pw = previousGeometry.width > 0 ? previousGeometry.width : w;
  1685. const ph = previousGeometry.height > 0 ? previousGeometry.height : h;
  1686. const px = previousGeometry.x != null ? previousGeometry.x : cx;
  1687. const py = previousGeometry.y != null ? previousGeometry.y : cy;
  1688. imageElement.setAttribute('width', String(pw));
  1689. imageElement.setAttribute('height', String(ph));
  1690. imageElement.setAttribute('x', String(px));
  1691. imageElement.setAttribute('y', String(py));
  1692. } else {
  1693. imageElement.setAttribute('width', String(w));
  1694. imageElement.setAttribute('height', String(h));
  1695. imageElement.setAttribute('x', String(cx));
  1696. imageElement.setAttribute('y', String(cy));
  1697. }
  1698. if (imageElement.dataset) {
  1699. const naturalAspect = natW / natH;
  1700. imageElement.dataset.naturalAspect = String(naturalAspect);
  1701. imageElement.dataset.aspectRatio = String(naturalAspect);
  1702. }
  1703. // Update stored reference geometry if present
  1704. if (window.currentBackgroundImage) {
  1705. window.currentBackgroundImage.x = cx;
  1706. window.currentBackgroundImage.y = cy;
  1707. window.currentBackgroundImage.width = w;
  1708. window.currentBackgroundImage.height = h;
  1709. }
  1710. if (typeof console !== 'undefined' && console.debug) {
  1711. console.debug('[addBackgroundImage] sized & centered', { natW, natH, baseW, baseH, w, h, cx, cy });
  1712. }
  1713. // Now set the image source; this will paint with the correct geometry
  1714. imageElement.setAttribute('href', imageDataUrl);
  1715. imageElement.setAttributeNS('http://www.w3.org/1999/xlink', 'xlink:href', imageDataUrl);
  1716. // Reveal now that proper size/position are applied
  1717. imageElement.setAttribute('opacity', String(previousGeometry && previousGeometry.opacity != null ? previousGeometry.opacity : 0.7));
  1718. // If we didn't capture previousGeometry from an existing element, try restoring
  1719. // geometry from the most recent HISTORY snapshot that matches this image by href or fileName.
  1720. try {
  1721. if (!previousGeometry && typeof localStorage !== 'undefined') {
  1722. const histStr = localStorage.getItem('history');
  1723. if (histStr) {
  1724. const histArr = JSON.parse(histStr);
  1725. for (let i = histArr.length - 1; i >= 0; i--) {
  1726. try {
  1727. const snap = JSON.parse(histArr[i]);
  1728. if (snap && snap.backgroundImage) {
  1729. const hrefMatch = (snap.backgroundImage.href === imageDataUrl);
  1730. const nameMatch = (fileName && snap.backgroundImage.fileName && String(fileName).toLowerCase() === String(snap.backgroundImage.fileName).toLowerCase());
  1731. if (hrefMatch || nameMatch) {
  1732. const props = snap.backgroundImage;
  1733. if (props.width != null) imageElement.setAttribute('width', props.width);
  1734. if (props.height != null) imageElement.setAttribute('height', props.height);
  1735. if (props.x != null) imageElement.setAttribute('x', props.x);
  1736. if (props.y != null) imageElement.setAttribute('y', props.y);
  1737. if (props.opacity != null) imageElement.setAttribute('opacity', props.opacity);
  1738. if (typeof console !== 'undefined' && console.debug) {
  1739. console.debug('[addBackgroundImage] restored geometry from HISTORY snapshot', { hrefMatch, nameMatch });
  1740. }
  1741. break;
  1742. }
  1743. }
  1744. } catch(_) { /* skip malformed entry */ }
  1745. }
  1746. }
  1747. }
  1748. } catch(_) { /* ignore history restore errors */ }
  1749. // Persist correct geometry now that it's set
  1750. try {
  1751. // Clear sizing guard before saving so save() proceeds
  1752. if (typeof window !== 'undefined') window.__bgSizing = false;
  1753. if (typeof save === 'function') save();
  1754. } catch(_) { /* ignore */ }
  1755. // If the background image tools are open, refresh their fields to reflect new geometry
  1756. try {
  1757. const tools = document.getElementById('backgroundImageTools');
  1758. const visible = tools && tools.style.display !== 'none' && window.getComputedStyle(tools).display !== 'none';
  1759. if (visible && typeof showBackgroundImageTools === 'function') {
  1760. showBackgroundImageTools();
  1761. }
  1762. } catch(_) { /* ignore */ }
  1763. };
  1764. probe.src = imageDataUrl;
  1765. } catch (e) {
  1766. console.warn('Could not derive intrinsic image size:', e);
  1767. try { if (typeof window !== 'undefined') window.__bgSizing = false; } catch(_) {}
  1768. }
  1769. // Store reference for later manipulation
  1770. window.currentBackgroundImage = {
  1771. element: imageElement,
  1772. fileName: fileName,
  1773. dataUrl: imageDataUrl
  1774. };
  1775. // Update UI: set filename display and enable Floorplan mode button
  1776. try {
  1777. const nameEl = document.getElementById('floorplan_filename');
  1778. if (nameEl) nameEl.textContent = fileName || '';
  1779. const btn = document.getElementById('floorplan_mode_btn');
  1780. if (btn) btn.disabled = false;
  1781. } catch(_) {}
  1782. return true;
  1783. } catch (error) {
  1784. console.error('Error adding background image:', error);
  1785. return false;
  1786. }
  1787. }
  1788. /**
  1789. * Remove the current background image
  1790. */
  1791. function removeBackgroundImage() {
  1792. try {
  1793. const existingImage = document.getElementById('backgroundImage');
  1794. if (existingImage) {
  1795. existingImage.remove();
  1796. }
  1797. // Clear the reference
  1798. if (window.currentBackgroundImage) {
  1799. delete window.currentBackgroundImage;
  1800. }
  1801. // Update UI: clear filename, disable Floorplan mode button, and exit mode if active
  1802. try {
  1803. const nameEl = document.getElementById('floorplan_filename');
  1804. if (nameEl) nameEl.textContent = '';
  1805. const btn = document.getElementById('floorplan_mode_btn');
  1806. if (btn) {
  1807. btn.disabled = true;
  1808. btn.innerText = 'Floorplan mode';
  1809. }
  1810. if (window.__floorplanMode && typeof exitFloorplanMode === 'function') {
  1811. exitFloorplanMode();
  1812. }
  1813. } catch(_) {}
  1814. } catch (error) {
  1815. console.error('Error removing background image:', error);
  1816. }
  1817. }
  1818. /**
  1819. * Trigger file input dialog for importing background images
  1820. */
  1821. function triggerImageImportDialog() {
  1822. // Create a hidden file input element
  1823. const fileInput = document.createElement('input');
  1824. fileInput.type = 'file';
  1825. fileInput.accept = 'image/png,image/jpeg,image/jpg,.png,.jpg,.jpeg';
  1826. fileInput.style.display = 'none';
  1827. fileInput.addEventListener('change', function(event) {
  1828. const file = event.target.files[0];
  1829. if (file) {
  1830. importBackgroundImage(file).then(success => {
  1831. // Clean up the temporary input element
  1832. document.body.removeChild(fileInput);
  1833. });
  1834. } else {
  1835. document.body.removeChild(fileInput);
  1836. }
  1837. });
  1838. // Add to DOM and trigger click
  1839. document.body.appendChild(fileInput);
  1840. fileInput.click();
  1841. }
  1842. /**
  1843. * Adjust background image properties
  1844. * @param {Object} properties - Properties to adjust (x, y, width, height, opacity)
  1845. */
  1846. function adjustBackgroundImage(properties) {
  1847. try {
  1848. const imageElement = document.getElementById('backgroundImage');
  1849. if (!imageElement) {
  1850. console.warn('No background image to adjust');
  1851. return false;
  1852. }
  1853. try { if (console && console.debug) console.debug('[adjustBackgroundImage] input', properties); } catch(_) {}
  1854. const keys = ['x', 'y', 'width', 'height', 'opacity'];
  1855. keys.forEach(key => {
  1856. if (properties[key] !== undefined) imageElement.setAttribute(key, properties[key]);
  1857. });
  1858. try {
  1859. if (console && console.debug) {
  1860. console.debug('[adjustBackgroundImage] applied', {
  1861. x: imageElement.getAttribute('x'),
  1862. y: imageElement.getAttribute('y'),
  1863. width: imageElement.getAttribute('width'),
  1864. height: imageElement.getAttribute('height'),
  1865. opacity: imageElement.getAttribute('opacity')
  1866. });
  1867. }
  1868. } catch(_) {}
  1869. return true;
  1870. } catch (error) {
  1871. console.error('Error adjusting background image:', error);
  1872. return false;
  1873. }
  1874. }
  1875. /**
  1876. * Show the background image tools panel
  1877. */
  1878. function showBackgroundImageTools() {
  1879. try {
  1880. const imageElement = document.getElementById('backgroundImage');
  1881. if (!imageElement) {
  1882. console.warn('No background image found');
  1883. return;
  1884. }
  1885. // Hide other panels and show background image tools
  1886. $('.leftBox').hide();
  1887. $('#backgroundImageTools').show(200);
  1888. // Initialize size inputs based on current image properties
  1889. const currentWidthPx = parseFloat(imageElement.getAttribute('width')) || 1100;
  1890. const currentHeightPx = parseFloat(imageElement.getAttribute('height')) || 700;
  1891. const currentOpacity = parseFloat(imageElement.getAttribute('opacity')) || 0.7;
  1892. // Prefer intrinsic aspect ratio if available
  1893. let aspect = undefined;
  1894. if (imageElement.dataset && imageElement.dataset.aspectRatio) {
  1895. aspect = parseFloat(imageElement.dataset.aspectRatio);
  1896. }
  1897. if (!isFinite(aspect) || aspect <= 0) {
  1898. aspect = (currentWidthPx > 0 && currentHeightPx > 0)
  1899. ? (currentWidthPx / currentHeightPx)
  1900. : (1100 / 700);
  1901. if (imageElement.dataset) imageElement.dataset.aspectRatio = String(aspect);
  1902. }
  1903. const pxPerMeter = 60; // editor scale
  1904. const widthMInput = document.getElementById('backgroundImageWidthM');
  1905. const heightMInput = document.getElementById('backgroundImageHeightM');
  1906. const aspectInfo = document.getElementById('backgroundImageAspectInfo');
  1907. if (widthMInput) widthMInput.value = (currentWidthPx / pxPerMeter).toFixed(2);
  1908. if (heightMInput) heightMInput.value = (currentHeightPx / pxPerMeter).toFixed(2);
  1909. if (aspectInfo) aspectInfo.textContent = `Aspect ratio: ${(aspect).toFixed(4)} (W/H)`;
  1910. // Bind input handlers to maintain aspect ratio
  1911. if (widthMInput) {
  1912. widthMInput.oninput = function(e) {
  1913. const img = document.getElementById('backgroundImage');
  1914. if (!img) return;
  1915. const curX = parseFloat(img.getAttribute('x')) || 0;
  1916. const curY = parseFloat(img.getAttribute('y')) || 0;
  1917. const ar = parseFloat(img.dataset.aspectRatio) || aspect;
  1918. const wM = parseFloat(e.target.value);
  1919. if (!isFinite(wM) || wM <= 0) return;
  1920. const wPx = wM * pxPerMeter;
  1921. const hPx = wPx / ar;
  1922. img.setAttribute('width', String(wPx));
  1923. img.setAttribute('height', String(hPx));
  1924. img.setAttribute('x', String(curX));
  1925. img.setAttribute('y', String(curY));
  1926. if (heightMInput) heightMInput.value = (hPx / pxPerMeter).toFixed(2);
  1927. };
  1928. }
  1929. if (heightMInput) {
  1930. heightMInput.oninput = function(e) {
  1931. const img = document.getElementById('backgroundImage');
  1932. if (!img) return;
  1933. const curX = parseFloat(img.getAttribute('x')) || 0;
  1934. const curY = parseFloat(img.getAttribute('y')) || 0;
  1935. const ar = parseFloat(img.dataset.aspectRatio) || aspect;
  1936. const hM = parseFloat(e.target.value);
  1937. if (!isFinite(hM) || hM <= 0) return;
  1938. const hPx = hM * pxPerMeter;
  1939. const wPx = hPx * ar;
  1940. img.setAttribute('width', String(wPx));
  1941. img.setAttribute('height', String(hPx));
  1942. img.setAttribute('x', String(curX));
  1943. img.setAttribute('y', String(curY));
  1944. if (widthMInput) widthMInput.value = (wPx / pxPerMeter).toFixed(2);
  1945. };
  1946. }
  1947. // Initialize opacity slider and label
  1948. const opacityPercent = Math.round(currentOpacity * 100);
  1949. const opacitySlider = document.getElementById('backgroundImageOpacitySlider');
  1950. const opacityLabel = document.getElementById('backgroundImageOpacityVal');
  1951. if (opacitySlider) opacitySlider.value = opacityPercent;
  1952. if (opacityLabel) opacityLabel.textContent = opacityPercent;
  1953. if (opacitySlider) {
  1954. opacitySlider.oninput = function(e) {
  1955. const v = parseInt(e.target.value, 10) || 70;
  1956. setBackgroundImageOpacity(v);
  1957. if (opacityLabel) opacityLabel.textContent = v;
  1958. };
  1959. }
  1960. // Update info box
  1961. if (typeof $('#boxinfo') !== 'undefined') {
  1962. $('#boxinfo').html('Background image settings - drag to move');
  1963. }
  1964. // Update cursor to indicate draggable state
  1965. if (imageElement.updateCursor) {
  1966. imageElement.updateCursor();
  1967. }
  1968. } catch (error) {
  1969. console.error('Error showing background image tools:', error);
  1970. }
  1971. }
  1972. /**
  1973. * Scale the background image
  1974. * @param {number} scalePercent - Scale percentage (10-300)
  1975. */
  1976. function scaleBackgroundImage(scalePercent) {
  1977. try {
  1978. const imageElement = document.getElementById('backgroundImage');
  1979. if (!imageElement) {
  1980. return false;
  1981. }
  1982. // Calculate new dimensions based on scale
  1983. const baseWidth = 1100;
  1984. const baseHeight = 700;
  1985. const scale = scalePercent / 100;
  1986. const newWidth = baseWidth * scale;
  1987. const newHeight = baseHeight * scale;
  1988. // Update image dimensions
  1989. imageElement.setAttribute('width', newWidth);
  1990. imageElement.setAttribute('height', newHeight);
  1991. // Update the stored reference if it exists
  1992. if (window.currentBackgroundImage) {
  1993. window.currentBackgroundImage.scale = scale;
  1994. }
  1995. return true;
  1996. } catch (error) {
  1997. console.error('Error scaling background image:', error);
  1998. return false;
  1999. }
  2000. }
  2001. /**
  2002. * Set the background image opacity
  2003. * @param {number} opacityPercent - Opacity percentage (0-100)
  2004. */
  2005. function setBackgroundImageOpacity(opacityPercent) {
  2006. try {
  2007. const imageElement = document.getElementById('backgroundImage');
  2008. if (!imageElement) {
  2009. return false;
  2010. }
  2011. const opacity = opacityPercent / 100;
  2012. imageElement.setAttribute('opacity', opacity);
  2013. // Update the stored reference if it exists
  2014. if (window.currentBackgroundImage) {
  2015. window.currentBackgroundImage.opacity = opacity;
  2016. }
  2017. return true;
  2018. } catch (error) {
  2019. console.error('Error setting background image opacity:', error);
  2020. return false;
  2021. }
  2022. }
  2023. /**
  2024. * Hide the background image tools panel and update cursor
  2025. */
  2026. function hideBackgroundImageTools() {
  2027. try {
  2028. // Hide the tools panel
  2029. $('#backgroundImageTools').hide(100);
  2030. $('#panel').show(200);
  2031. // Update cursor state for the background image
  2032. const imageElement = document.getElementById('backgroundImage');
  2033. if (imageElement && imageElement.updateCursor) {
  2034. imageElement.updateCursor();
  2035. }
  2036. } catch (error) {
  2037. console.error('Error hiding background image tools:', error);
  2038. }
  2039. }
  2040. /**
  2041. * Export floorplan data in Blender-compatible format
  2042. * @param {string} filename - Optional filename (without extension)
  2043. * @param {number} wallHeight - Wall height in meters (default: 2.8)
  2044. * @param {number} wallThickness - Wall thickness in meters (default: 0.08)
  2045. */
  2046. function exportForBlender(filename = 'floorplan_blender', wallHeight = 2.8, wallThickness = 0.08) {
  2047. try {
  2048. // Initialize the Blender export data structure
  2049. const blenderData = {
  2050. wall_height: wallHeight,
  2051. wall_thickness: wallThickness,
  2052. floors: [],
  2053. walls: [],
  2054. doors: [],
  2055. windows: [],
  2056. styles: []
  2057. };
  2058. // First pass: collect all coordinates to calculate extents
  2059. let minX = Infinity, maxX = -Infinity;
  2060. let minY = Infinity, maxY = -Infinity;
  2061. // Helper function to update extents
  2062. function updateExtents(x, y) {
  2063. minX = Math.min(minX, x);
  2064. maxX = Math.max(maxX, x);
  2065. minY = Math.min(minY, y);
  2066. maxY = Math.max(maxY, y);
  2067. }
  2068. // Calculate extents from rooms
  2069. for (let i = 0; i < ROOM.length; i++) {
  2070. const room = ROOM[i];
  2071. if (room.coords && room.coords.length > 0) {
  2072. for (let j = 0; j < room.coords.length; j++) {
  2073. const coord = room.coords[j];
  2074. const x = coord.x / 60;
  2075. const y = coord.y / 60;
  2076. updateExtents(x, y);
  2077. }
  2078. }
  2079. }
  2080. // Calculate extents from walls
  2081. for (let i = 0; i < WALLS.length; i++) {
  2082. const wall = WALLS[i];
  2083. if (wall.start && wall.end) {
  2084. updateExtents(wall.start.x / 60, wall.start.y / 60);
  2085. updateExtents(wall.end.x / 60, wall.end.y / 60);
  2086. }
  2087. }
  2088. // Calculate extents from objects (doors and windows)
  2089. for (let i = 0; i < OBJDATA.length; i++) {
  2090. const obj = OBJDATA[i];
  2091. if (obj.x !== undefined && obj.y !== undefined) {
  2092. let x = obj.x / 60;
  2093. let y = obj.y / 60;
  2094. // Apply angle-based adjustments for extent calculation
  2095. if (obj.angle !== undefined) {
  2096. const angle = obj.angle;
  2097. if (angle === 90) {
  2098. x += 0.1;
  2099. } else if (angle === 270) {
  2100. x -= 0.1;
  2101. } else if (angle === 180) {
  2102. y += 0.1;
  2103. } else if (angle === 0) {
  2104. y -= 0.1;
  2105. }
  2106. }
  2107. // Only include doors and windows in extent calculation
  2108. if (obj.type === 'door' || obj.type === 'doorDouble' || obj.type === 'doorSliding' || obj.type === 'simple' ||
  2109. obj.type === 'window' || obj.type === 'windowDouble' || obj.type === 'windowBay' || obj.type === 'fix') {
  2110. updateExtents(x, y);
  2111. }
  2112. }
  2113. }
  2114. // Calculate extents from furniture items
  2115. if (typeof FURNITURE_ITEMS !== 'undefined' && Array.isArray(FURNITURE_ITEMS)) {
  2116. for (let i = 0; i < FURNITURE_ITEMS.length; i++) {
  2117. const furniture = FURNITURE_ITEMS[i];
  2118. if (furniture.x !== undefined && furniture.y !== undefined) {
  2119. const x = furniture.x / 60;
  2120. const y = furniture.y / 60;
  2121. updateExtents(x, y);
  2122. }
  2123. }
  2124. }
  2125. // Calculate center offset
  2126. const centerX = (minX + maxX) / 2;
  2127. const centerY = (minY + maxY) / 2;
  2128. console.log(`Floorplan extents: X[${minX.toFixed(2)}, ${maxX.toFixed(2)}], Y[${minY.toFixed(2)}, ${maxY.toFixed(2)}]`);
  2129. console.log(`Center offset: [${centerX.toFixed(2)}, ${centerY.toFixed(2)}]`);
  2130. // Convert rooms to floors array
  2131. // Each room becomes an object with materials and a polygon of [x, y] coordinates
  2132. for (let i = 0; i < ROOM.length; i++) {
  2133. const room = ROOM[i];
  2134. if (room.coords && room.coords.length > 0) {
  2135. const roomPolygon = [];
  2136. for (let j = 0; j < room.coords.length; j++) {
  2137. const coord = room.coords[j];
  2138. // Convert from editor coordinates to Blender coordinates and center around (0,0)
  2139. // Scale down from pixels to meters (assuming 60 pixels = 1 meter based on grid)
  2140. const x = parseFloat(((coord.x / 60) - centerX).toFixed(2));
  2141. const y = parseFloat(((coord.y / 60) - centerY).toFixed(2));
  2142. roomPolygon.push([x, y]);
  2143. }
  2144. // Ensure polygon is closed (last point equals first)
  2145. if (roomPolygon.length > 0) {
  2146. const first = roomPolygon[0];
  2147. const last = roomPolygon[roomPolygon.length - 1];
  2148. if (first[0] !== last[0] || first[1] !== last[1]) {
  2149. roomPolygon.push([first[0], first[1]]);
  2150. }
  2151. blenderData.floors.push({
  2152. floor_material: 'WoodFloor',
  2153. ceiling_material: 'DefaultCeiling',
  2154. points: roomPolygon
  2155. });
  2156. }
  2157. }
  2158. }
  2159. // Convert walls to line segments
  2160. // Each wall becomes [[start.x, start.y], [end.x, end.y]]
  2161. for (let i = 0; i < WALLS.length; i++) {
  2162. const wall = WALLS[i];
  2163. if (wall.start && wall.end) {
  2164. const startX = parseFloat(((wall.start.x / 60) - centerX).toFixed(2));
  2165. const startY = parseFloat(((wall.start.y / 60) - centerY).toFixed(2));
  2166. const endX = parseFloat(((wall.end.x / 60) - centerX).toFixed(2));
  2167. const endY = parseFloat(((wall.end.y / 60) - centerY).toFixed(2));
  2168. blenderData.walls.push([
  2169. [startX, startY],
  2170. [endX, endY]
  2171. ]);
  2172. }
  2173. }
  2174. // Classify walls
  2175. const { internal, external } = classifyWalls(blenderData);
  2176. // Attempt to stitch external walls into a single outline polygon
  2177. const externalOutline = buildExternalPolygon(external, 0.03);
  2178. // if (externalOutline && externalOutline.length >= 3) {
  2179. // blenderData.external_outline = externalOutline;
  2180. // }
  2181. // Build internal outlines by joining segments (chains may be open)
  2182. const internalOutlines = buildJoinedChains(internal, 0.03);
  2183. // if (internalOutlines && internalOutlines.length > 0) {
  2184. // blenderData.internal_outlines = internalOutlines;
  2185. // }
  2186. // Convert wall outlines into requested object structure
  2187. blenderData.walls = [];
  2188. // Create wall object with all outlines
  2189. const wallObject = {
  2190. material: "Walls",
  2191. trim: "SquareTrim",
  2192. trim_material: "Walls",
  2193. points: []
  2194. };
  2195. if (externalOutline && externalOutline.length >= 2) {
  2196. wallObject.points.push(externalOutline);
  2197. }
  2198. if (internalOutlines && internalOutlines.length > 0) {
  2199. for (const outline of internalOutlines) {
  2200. wallObject.points.push(outline);
  2201. }
  2202. }
  2203. // Only add wall object if it has points
  2204. if (wallObject.points.length > 0) {
  2205. blenderData.walls.push(wallObject);
  2206. }
  2207. // Convert objects (doors and windows) to individual objects with asset, position, and rotation
  2208. for (let i = 0; i < OBJDATA.length; i++) {
  2209. const obj = OBJDATA[i];
  2210. if (obj.x !== undefined && obj.y !== undefined) {
  2211. let x = parseFloat((obj.x / 60).toFixed(2));
  2212. let y = parseFloat((obj.y / 60).toFixed(2));
  2213. // Adjust position based on angle property
  2214. // if (obj.angle !== undefined) {
  2215. // const angle = obj.angle;
  2216. // if (angle === 90) {
  2217. // x += 0.1;
  2218. // } else if (angle === 270) {
  2219. // x -= 0.1;
  2220. // } else if (angle === 180) {
  2221. // y += 0.1;
  2222. // } else if (angle === 0) {
  2223. // y -= 0.1;
  2224. // }
  2225. // // Round to 2 decimal places after adjustment
  2226. // x = parseFloat(x.toFixed(2));
  2227. // y = parseFloat(y.toFixed(2));
  2228. // }
  2229. // Apply center offset to position coordinates
  2230. x = parseFloat((x - centerX).toFixed(2));
  2231. y = parseFloat((y - centerY).toFixed(2));
  2232. // Categorize objects based on their type
  2233. if (obj.type === 'door' || obj.type === 'doorDouble' || obj.type === 'doorSliding' || obj.type === 'simple') {
  2234. blenderData.doors.push({
  2235. asset: 'OpenDoor',
  2236. position: [x, y],
  2237. rotation: obj.angle || 0
  2238. });
  2239. } else if (obj.type === 'window' || obj.type === 'windowDouble' || obj.type === 'windowBay' || obj.type === 'fix') {
  2240. blenderData.windows.push({
  2241. asset: 'WindowPanel',
  2242. position: [x, y],
  2243. rotation: obj.angle || 0
  2244. });
  2245. }
  2246. }
  2247. }
  2248. // Convert furniture items to Blender format and wrap in styles
  2249. const furnitureArray = [];
  2250. if (typeof FURNITURE_ITEMS !== 'undefined' && Array.isArray(FURNITURE_ITEMS)) {
  2251. for (let i = 0; i < FURNITURE_ITEMS.length; i++) {
  2252. const furniture = FURNITURE_ITEMS[i];
  2253. if (furniture.x !== undefined && furniture.y !== undefined) {
  2254. // Convert position from pixels to meters and apply center offset
  2255. const x = parseFloat(((furniture.x / 60) - centerX).toFixed(1));
  2256. const y = parseFloat(((furniture.y / 60) - centerY).toFixed(1));
  2257. // Get rotation (default to 0 if not specified)
  2258. const rotation = (-furniture.rotation || 0) - 90;
  2259. // Get on_ceiling property from furniture definition
  2260. let onCeiling = false;
  2261. if (typeof FURNITURE_DATA !== 'undefined' && Array.isArray(FURNITURE_DATA)) {
  2262. const furnitureType = FURNITURE_DATA.find(f => f.id === furniture.furnitureId || f.type === furniture.type);
  2263. if (furnitureType && furnitureType.on_ceiling !== undefined) {
  2264. onCeiling = furnitureType.on_ceiling;
  2265. }
  2266. }
  2267. // Use furnitureId as asset identifier, fallback to type if not available
  2268. const asset = furniture.furnitureId || furniture.type || 'unknown';
  2269. furnitureArray.push({
  2270. asset: asset,
  2271. position: [x, y],
  2272. rotation: rotation,
  2273. on_ceiling: onCeiling
  2274. });
  2275. }
  2276. }
  2277. }
  2278. // Wrap furniture in styles structure
  2279. if (furnitureArray.length > 0) {
  2280. blenderData.styles.push({
  2281. name: "furnished",
  2282. furniture: furnitureArray
  2283. });
  2284. }
  2285. // Convert to JSON string with custom formatting for compact coordinate arrays
  2286. let jsonString = JSON.stringify(blenderData, null, '\t');
  2287. // Post-process to make coordinate arrays more compact
  2288. // Replace multi-line coordinate arrays with single-line format
  2289. jsonString = jsonString.replace(/\[\s*\n\s*([\d.-]+),\s*\n\s*([\d.-]+)\s*\n\s*\]/g, '[$1, $2]');
  2290. // Create and trigger download
  2291. const blob = new Blob([jsonString], { type: 'application/json' });
  2292. const url = URL.createObjectURL(blob);
  2293. const link = document.createElement('a');
  2294. link.href = url;
  2295. link.download = filename + '.json';
  2296. document.body.appendChild(link);
  2297. link.click();
  2298. document.body.removeChild(link);
  2299. URL.revokeObjectURL(url);
  2300. console.log('Blender export completed:', filename + '.json');
  2301. return true;
  2302. } catch (error) {
  2303. console.error('Error exporting for Blender:', error);
  2304. return false;
  2305. }
  2306. }
  2307. /**
  2308. * Classify wall segments into internal vs external using room polygons from blenderData.floors[*].points.
  2309. * A wall is considered INTERNAL if points on both sides of its midpoint lie inside any room polygon.
  2310. * Otherwise it is EXTERNAL.
  2311. *
  2312. * Coordinate system: expects the same centered, meter-scaled coords used by exportForBlender
  2313. * - blenderData.floors: Array of floors -> [ { points: [ [x,y], ... ], ... }, ... ]
  2314. * - blenderData.walls: Array of wall outlines/segments -> [ [ [x1,y1], [x2,y2] ], ... ] or arrays of points
  2315. *
  2316. * @param {Object} blenderData
  2317. * @param {number} [epsilon=0.2] - Offset distance from midpoint in meters for inside/outside tests
  2318. * @returns {{ internal: Array, external: Array }}
  2319. */
  2320. function classifyWalls(blenderData, epsilon = 0.2) {
  2321. if (!blenderData || !Array.isArray(blenderData.walls) || !Array.isArray(blenderData.floors)) {
  2322. console.warn('classifyWalls: Invalid blenderData structure.');
  2323. return { internal: [], external: blenderData && blenderData.walls ? [...blenderData.walls] : [] };
  2324. }
  2325. // Ray-casting point-in-polygon test
  2326. function pointInPolygon(point, polygon) {
  2327. // polygon: [ [x,y], [x,y], ... ]
  2328. let inside = false;
  2329. for (let i = 0, j = polygon.length - 1; i < polygon.length; j = i++) {
  2330. const xi = polygon[i][0], yi = polygon[i][1];
  2331. const xj = polygon[j][0], yj = polygon[j][1];
  2332. const intersect = ((yi > point[1]) !== (yj > point[1])) &&
  2333. (point[0] < (xj - xi) * (point[1] - yi) / ((yj - yi) || 1e-12) + xi);
  2334. if (intersect) inside = !inside;
  2335. }
  2336. return inside;
  2337. }
  2338. function insideAnyRoom(pt) {
  2339. for (let k = 0; k < blenderData.floors.length; k++) {
  2340. const floor = blenderData.floors[k];
  2341. const poly = floor && Array.isArray(floor.points) ? floor.points : null;
  2342. if (Array.isArray(poly) && poly.length >= 3 && pointInPolygon(pt, poly)) {
  2343. return true;
  2344. }
  2345. }
  2346. return false;
  2347. }
  2348. const internal = [];
  2349. const external = [];
  2350. for (let i = 0; i < blenderData.walls.length; i++) {
  2351. const seg = blenderData.walls[i];
  2352. if (!Array.isArray(seg) || seg.length !== 2) {
  2353. // Malformed segment, treat as external by default
  2354. external.push(seg);
  2355. continue;
  2356. }
  2357. const ax = seg[0][0], ay = seg[0][1];
  2358. const bx = seg[1][0], by = seg[1][1];
  2359. // Midpoint
  2360. const mx = (ax + bx) / 2;
  2361. const my = (ay + by) / 2;
  2362. // Perpendicular unit vector (normal)
  2363. const dx = bx - ax;
  2364. const dy = by - ay;
  2365. const len = Math.hypot(dx, dy) || 1e-12;
  2366. // Normal vectors: ( -dy/len, dx/len ) and opposite
  2367. const nx = -dy / len;
  2368. const ny = dx / len;
  2369. // Sample points on both sides of the wall
  2370. const p1 = [mx + nx * epsilon, my + ny * epsilon];
  2371. const p2 = [mx - nx * epsilon, my - ny * epsilon];
  2372. const side1Inside = insideAnyRoom(p1);
  2373. const side2Inside = insideAnyRoom(p2);
  2374. if (side1Inside && side2Inside) {
  2375. internal.push(seg);
  2376. } else {
  2377. external.push(seg);
  2378. }
  2379. }
  2380. return { internal, external };
  2381. }
  2382. /**
  2383. * Build a closed polygon by stitching wall segments whose endpoints meet within a tolerance.
  2384. * Returns the largest closed loop found (by area) as an array of [x, y] points.
  2385. * If no closed loop can be formed, returns null.
  2386. *
  2387. * @param {Array} segments - Array of segments: [ [ [x1,y1], [x2,y2] ], ... ]
  2388. * @param {number} [tolerance=0.03] - Max distance between endpoints to be considered matching
  2389. * @returns {Array|null}
  2390. */
  2391. function buildExternalPolygon(segments, tolerance = 0.03) {
  2392. if (!Array.isArray(segments) || segments.length === 0) return null;
  2393. // Utility: distance between points
  2394. const dist = (a, b) => Math.hypot(a[0] - b[0], a[1] - b[1]);
  2395. // Shoelace area (signed)
  2396. function polygonArea(poly) {
  2397. let area = 0;
  2398. for (let i = 0, n = poly.length; i < n; i++) {
  2399. const j = (i + 1) % n;
  2400. area += poly[i][0] * poly[j][1] - poly[j][0] * poly[i][1];
  2401. }
  2402. return area / 2;
  2403. }
  2404. // Make a mutable copy of segments
  2405. const pool = segments.map(s => [[s[0][0], s[0][1]], [s[1][0], s[1][1]]]);
  2406. let bestLoop = null;
  2407. let bestArea = 0;
  2408. // Try building loops starting from each segment in the pool
  2409. for (let startIdx = 0; startIdx < pool.length; startIdx++) {
  2410. if (!pool[startIdx]) continue; // already consumed
  2411. // Start a new chain
  2412. let [a, b] = pool[startIdx];
  2413. let chain = [a, b];
  2414. pool[startIdx] = null; // consume
  2415. // Extend chain forward until closed or stuck
  2416. let guard = 0;
  2417. while (guard++ < segments.length + 5) {
  2418. const tail = chain[chain.length - 1];
  2419. let found = false;
  2420. for (let i = 0; i < pool.length; i++) {
  2421. const seg = pool[i];
  2422. if (!seg) continue;
  2423. const sA = seg[0];
  2424. const sB = seg[1];
  2425. if (dist(tail, sA) <= tolerance) {
  2426. chain.push(sB);
  2427. pool[i] = null;
  2428. found = true;
  2429. break;
  2430. } else if (dist(tail, sB) <= tolerance) {
  2431. chain.push(sA);
  2432. pool[i] = null;
  2433. found = true;
  2434. break;
  2435. }
  2436. }
  2437. // Closed loop?
  2438. if (dist(chain[chain.length - 1], chain[0]) <= tolerance && chain.length > 3) {
  2439. // Remove duplicated last point if extremely close to first
  2440. chain[chain.length - 1] = chain[0];
  2441. // Compute area and keep the largest absolute-area loop
  2442. const unique = dedupeConsecutive(chain);
  2443. const clean = ensureClosed(unique);
  2444. const cleanNoDup = clean.slice(0, clean.length - 1); // area expects no repeated final point
  2445. const area = Math.abs(polygonArea(cleanNoDup));
  2446. if (area > bestArea) {
  2447. bestArea = area;
  2448. bestLoop = cleanNoDup;
  2449. }
  2450. break;
  2451. }
  2452. if (!found) break; // stuck
  2453. }
  2454. }
  2455. // Ensure closed loop by appending the first vertex at the end
  2456. return bestLoop && bestLoop.length >= 3 ? [...bestLoop, bestLoop[0]] : null;
  2457. // Remove consecutive duplicates (within tolerance)
  2458. function dedupeConsecutive(points) {
  2459. const out = [];
  2460. for (let i = 0; i < points.length; i++) {
  2461. if (i === 0 || dist(points[i], points[i - 1]) > tolerance / 4) {
  2462. out.push(points[i]);
  2463. }
  2464. }
  2465. return out;
  2466. }
  2467. // Ensure first == last (closed)
  2468. function ensureClosed(points) {
  2469. if (points.length === 0) return points;
  2470. const first = points[0];
  2471. const last = points[points.length - 1];
  2472. if (dist(first, last) > tolerance) {
  2473. return [...points, first];
  2474. }
  2475. return points;
  2476. }
  2477. }
  2478. /**
  2479. * Join segments into chains by matching endpoints within a tolerance.
  2480. * Chains do NOT need to be closed; returns all chains of 2+ points.
  2481. * Each chain is an array of [x,y] points in order.
  2482. *
  2483. * @param {Array} segments - [ [ [x1,y1], [x2,y2] ], ... ]
  2484. * @param {number} [tolerance=0.03]
  2485. * @returns {Array<Array<[number,number]>>}
  2486. */
  2487. function buildJoinedChains(segments, tolerance = 0.03) {
  2488. if (!Array.isArray(segments) || segments.length === 0) return [];
  2489. const dist = (a, b) => Math.hypot(a[0] - b[0], a[1] - b[1]);
  2490. // Calculate deviation angle from current chain direction
  2491. function calculateDeviationAngle(chain, currentPoint, nextPoint) {
  2492. if (chain.length < 2) return 0; // No existing direction to compare
  2493. // Get the current direction vector (from second-to-last to last point)
  2494. const prevPoint = chain[chain.length - 2];
  2495. const currentDir = [currentPoint[0] - prevPoint[0], currentPoint[1] - prevPoint[1]];
  2496. const currentDirMag = Math.hypot(currentDir[0], currentDir[1]);
  2497. if (currentDirMag < 1e-6) return 0; // Degenerate case
  2498. // Get the proposed direction vector
  2499. const nextDir = [nextPoint[0] - currentPoint[0], nextPoint[1] - currentPoint[1]];
  2500. const nextDirMag = Math.hypot(nextDir[0], nextDir[1]);
  2501. if (nextDirMag < 1e-6) return Math.PI; // Degenerate case - maximum deviation
  2502. // Calculate angle between vectors using dot product
  2503. const dot = (currentDir[0] * nextDir[0] + currentDir[1] * nextDir[1]) / (currentDirMag * nextDirMag);
  2504. const clampedDot = Math.max(-1, Math.min(1, dot)); // Clamp to avoid numerical errors
  2505. return Math.acos(clampedDot); // Return angle in radians (0 = straight, π = opposite)
  2506. }
  2507. // Initialize pool of unused segments
  2508. const pool = segments.map(s => ({ pts: [[s[0][0], s[0][1]], [s[1][0], s[1][1]]], used: false }));
  2509. const chains = [];
  2510. for (let i = 0; i < pool.length; i++) {
  2511. if (pool[i].used) continue;
  2512. let [a, b] = pool[i].pts;
  2513. let chain = [a, b];
  2514. pool[i].used = true;
  2515. let extended = true;
  2516. let guard = 0;
  2517. while (extended && guard++ < segments.length * 3) {
  2518. extended = false;
  2519. const head = chain[0];
  2520. const tail = chain[chain.length - 1];
  2521. // Try to extend at tail - prioritize straight connections
  2522. let bestTailOption = null;
  2523. let bestTailAngle = Infinity;
  2524. for (let j = 0; j < pool.length; j++) {
  2525. if (pool[j].used) continue;
  2526. const [p, q] = pool[j].pts;
  2527. if (dist(tail, p) <= tolerance) {
  2528. const angle = calculateDeviationAngle(chain, tail, q);
  2529. if (angle < bestTailAngle) {
  2530. bestTailAngle = angle;
  2531. bestTailOption = { index: j, nextPoint: q };
  2532. }
  2533. } else if (dist(tail, q) <= tolerance) {
  2534. const angle = calculateDeviationAngle(chain, tail, p);
  2535. if (angle < bestTailAngle) {
  2536. bestTailAngle = angle;
  2537. bestTailOption = { index: j, nextPoint: p };
  2538. }
  2539. }
  2540. }
  2541. if (bestTailOption) {
  2542. chain.push(bestTailOption.nextPoint);
  2543. pool[bestTailOption.index].used = true;
  2544. extended = true;
  2545. }
  2546. // Try to extend at head if no tail extension - prioritize straight connections
  2547. if (!extended) {
  2548. let bestHeadOption = null;
  2549. let bestHeadAngle = Infinity;
  2550. for (let j = 0; j < pool.length; j++) {
  2551. if (pool[j].used) continue;
  2552. const [p, q] = pool[j].pts;
  2553. if (dist(head, p) <= tolerance) {
  2554. const angle = calculateDeviationAngle(chain.slice().reverse(), head, q);
  2555. if (angle < bestHeadAngle) {
  2556. bestHeadAngle = angle;
  2557. bestHeadOption = { index: j, nextPoint: q };
  2558. }
  2559. } else if (dist(head, q) <= tolerance) {
  2560. const angle = calculateDeviationAngle(chain.slice().reverse(), head, p);
  2561. if (angle < bestHeadAngle) {
  2562. bestHeadAngle = angle;
  2563. bestHeadOption = { index: j, nextPoint: p };
  2564. }
  2565. }
  2566. }
  2567. if (bestHeadOption) {
  2568. chain.unshift(bestHeadOption.nextPoint);
  2569. pool[bestHeadOption.index].used = true;
  2570. extended = true;
  2571. }
  2572. }
  2573. }
  2574. // Deduplicate consecutive near-equal points
  2575. const cleaned = [];
  2576. for (let k = 0; k < chain.length; k++) {
  2577. if (k === 0 || dist(chain[k], chain[k - 1]) > tolerance / 5) cleaned.push(chain[k]);
  2578. }
  2579. if (cleaned.length >= 2) chains.push(cleaned);
  2580. }
  2581. return chains;
  2582. }