Download

Online

Gallery

Blog

  Index  | Recent Threads  | List Attachments  | Search
 Welcome Guest  |  Register  |  Login
Login Name  Password
 

Sweet Home 3D Forum



No member browsing this thread
Thread Status: Active
Total posts in this thread: 18
Posts: 18   Pages: 2   [ Previous Page | 1 2 ]
[ Jump to Last Post ]
Post new Thread
Author
Previous Thread This topic has been viewed 5021 times and has 17 replies Next Thread
kingoftailor
Member




Joined: Jan 13, 2016
Post Count: 21
Status: Offline
Reply to this Post  Reply with Quote 
Re: Sweet Home 3D JS Online

What is the correct html for the new version?

Later this works for me:
<div id="progress">
<div id="progress-bar" style="width: 0%;"></div>
</div>
<div style="width:100%;height:100%;">
<div id="home-pane" style="width:100%;height:600px;position:absolute;top:75px;left:0">
<div id="home-pane-toolbar"></div>
<canvas id="home-3D-view" style="display:none" tabIndex="1"></canvas>
<div id="home-plan" style="background-color: #FFFFFF; color: #000000" tabIndex="2"></div>
<div id="furniture-catalog"></div>
</div>
</div>
[Mar 28, 2022, 6:27:10 PM] Show Printable Version of Post    View Member Profile    Send Private Message [Link] Report threatening or abusive post: please login first  Go to top 
kingoftailor
Member




Joined: Jan 13, 2016
Post Count: 21
Status: Offline
Reply to this Post  Reply with Quote 
Re: Sweet Home 3D JS Online

How can I set the drawing canvas to appear (full size) but not the 3d view?

On earlier version this worked:

#home-3D-view {
display: none
}

#home-plan {
height: 100%;
width: 100%;
}


The largest problem is that the buttons seems disabled:


The 3. problem is that there are no right mouse context menu (sweethome online vs megveszLAK.hu test page)



The test page html:
<div style="width:100%;height:100%;">
<div id="home-pane" style="width:100%;height:600px;position:absolute;top:75px;left:0">
<div id="home-pane-toolbar" style="height:30px"></div>
<div id="plan-3D-view-splitter" class="pane-splitter horizontal" style="display: block; width:100%"></div>
<div id="catalog-furniture-pane">
<div id="furniture-catalog" style="height:100%;width:100%">
<div id="furniture-catalog-list" class="furniture-catalog-list"></div>
</div>
</div>
<div id="furniture-plan-splitter" class="pane-splitter vertical" style="display: block; left: 330px;"></div>
<div id="plan-3D-view-pane" style="position:absolute; left: 332px; width: calc(100% - 334px);height: calc(100% - 34px)">
<div id="home-plan" style="background-color: rgb(255, 255, 255); color: rgb(0, 0, 0); width:100%;height:100%" tabindex="2">
<canvas id="home-3D-view" tabIndex="1" width="1" height="1" style="width:100%;height:1px"></canvas>
</div>
</div>
</div>
</div>


The JavaScript:
<script>
var homeName = "emptyHome";
var urlBase = "https://alaprajz.megveszlak.hu/";
var application = new SweetHome3DJSApplication(
{
readHomeURL: urlBase + "homes/" + homeName + ".sh3d",
furnitureCatalogURLs: [urlBase + "lib/resources/DefaultFurnitureCatalog.json"],
furnitureResourcesURLBase: urlBase
});

application.getUserPreferences().setNewRoomFloorColor(0xFF9999A0);
application.getUserPreferences().setAerialViewCenteredOnSelectionEnabled(true);

application.getHomeRecorder().readHome(homeName,
{
homeLoaded: function (home) {
home.setName(homeName);
application.addHome(home);
application.getHomes()[0].setCamera(application.getHomes()[0].getTopCamera());
window.addEventListener("unload", function () {
application.deleteHome(home);
});
},
homeError: function (err) { },
progression: function (part, info, percentage) { }
});
</script>


Thank You
[Mar 29, 2022, 10:19:08 AM] Show Printable Version of Post    View Member Profile    Send Private Message [Link] Report threatening or abusive post: please login first  Go to top 
Puybaret
Expert
Member's Avatar

France
Joined: Nov 7, 2005
Post Count: 9141
Status: Offline
Reply to this Post  Reply with Quote 
Re: Sweet Home 3D JS Online

The CSS and HTML parts in the main page index.jsp changed a lot between versions 6.4 an 6.6, and you should probably add the changes carefully in your page.
----------------------------------------
Emmanuel Puybaret, Sweet Home 3D developer
[Mar 29, 2022, 10:57:16 AM] Show Printable Version of Post    View Member Profile    Send Private Message [Link] Report threatening or abusive post: please login first  Go to top 
kingoftailor
Member




Joined: Jan 13, 2016
Post Count: 21
Status: Offline
Reply to this Post  Reply with Quote 
Re: Sweet Home 3D JS Online

Thanks, I've already done it based on index.jsp.

There are two things I haven't found a solution to. I was unable to resize the drawing surface and the furniture selector jumps too wide from the initial width.

How can I set the width of the furniture selector?

How can I hide/remove the 3d view?

How can I hide/remove the furniture view?
[Mar 29, 2022, 10:21:19 PM] Show Printable Version of Post    View Member Profile    Send Private Message [Link] Report threatening or abusive post: please login first  Go to top 
kingoftailor
Member




Joined: Jan 13, 2016
Post Count: 21
Status: Offline
Reply to this Post  Reply with Quote 
Re: Sweet Home 3D JS Online

I resolved to hide 3d view and furniture details view:

#catalog-furniture-splitter {
display: none;
}

#furniture-view {
display: none;
}

#furniture-view .tree-table {
display: none;
}

#home-plan {
width: 100%;
height: calc(100% - 2px);
font-family: sans-serif;
border-top: 1px solid gray;
border-bottom: 1px solid gray;
}

#plan-3D-view-splitter {
display: none;
}

#home-3D-view {
display: none;
}


The right click menus work perfectly.
[Mar 30, 2022, 9:19:58 AM] Show Printable Version of Post    View Member Profile    Send Private Message [Link] Report threatening or abusive post: please login first  Go to top 
kingoftailor
Member




Joined: Jan 13, 2016
Post Count: 21
Status: Offline
Reply to this Post  Reply with Quote 
Re: Sweet Home 3D JS Online

I figured it out.

The furniture selector width was sette in the sh3d file (initial width).

I created another emptyHome.sh3d with the windows version and the problem is resolved.
[Mar 30, 2022, 2:26:57 PM] Show Printable Version of Post    View Member Profile    Send Private Message [Link] Report threatening or abusive post: please login first  Go to top 
Puybaret
Expert
Member's Avatar

France
Joined: Nov 7, 2005
Post Count: 9141
Status: Offline
Reply to this Post  Reply with Quote 
Re: Sweet Home 3D JS Online

Great that you could find out by yourself. Sweet Home 3D JS Online version uses CSS with well named styles for this purpose.
Please share a link to the final version when it's ready.
----------------------------------------
Emmanuel Puybaret, Sweet Home 3D developer
[Mar 30, 2022, 3:35:26 PM] Show Printable Version of Post    View Member Profile    Send Private Message [Link] Report threatening or abusive post: please login first  Go to top 
kingoftailor
Member




Joined: Jan 13, 2016
Post Count: 21
Status: Offline
Reply to this Post  Reply with Quote 
Re: Sweet Home 3D JS Online

Your software is very cool.

Here is the online version:

https://megveszlak.hu/alaprajz-tervezo
[Mar 30, 2022, 7:57:03 PM] Show Printable Version of Post    View Member Profile    Send Private Message [Link] Report threatening or abusive post: please login first  Go to top 
Posts: 18   Pages: 2   [ Previous Page | 1 2 ]
[ Jump to Last Post ]
Show Printable Version of Thread  Post new Thread

    Get Sweet Home 3D at SourceForge.net. Fast, secure and Free Open Source software downloads
   
© Copyright 2006-2024 eTeks - All rights reserved