ifcjs / openbim-app-templates

TOC | documentation | demo | community | npm package

Open BIM App Templates

CLI command that allow to quickly start your next BIM application using That Open Engine and Vite.

Usage

Using it is really easy, just follow these steps:

• Create a project folder anywhere you want and open it within your IDE.
• In the terminal of the opened folder, run npm create bim-app@latest. Very likely the command will prompt you to install create-bim-app, accept it. Then, just follow the prompts.

Templates

Currently, the following templates are available:

• Vanilla

Templates are using TypeScript as That Open Engine is written with it, so you can get typing help when developing your app.

openbim-app-templates's Issues

[Bug]: RangeError: Set maximum size exceeded

What happened?

Loading a file on https://platform.thatopen.com/app and i receive the error below.

Version

latest

What browsers are you seeing the problem on?

Microsoft Edge

Relevant log output

Uncaught (in promise) RangeError: Set maximum size exceeded
    at Set.add (<anonymous>)
    at aG.getAllGeometriesIDs (9249.a39bde93b4db5cf6.js:6:393264)
    at async aG.export (9249.a39bde93b4db5cf6.js:6:392019)

Anything else?

Model has been sent to [email protected]

https://platform.thatopen.com/app currently appears flakey

Describe the bug 📝

I am visiting the beta demo site at
https://platform.thatopen.com/app

I expect to see "current view/current state" of the framework, while acknowledging that it is displayed as BETA (demo) software.

What I actually see:
The console log contains so many warnings and errors, I get doubts about proceeding.

15:43:10.899
GET
https://platform.thatopen.com/[object Object]
[HTTP/2 404 35ms]

15:43:10.930 Loading failed for the <script> with source “https://platform.thatopen.com/[object%20Object]”. app:1:1
15:43:12.327 Layout was forced before the page was fully loaded. If stylesheets are not yet loaded this may cause a flash of unstyled content. home
15:43:12.377 Loading failed for the <script> with source “https://rum-static.pingdom.net/pa-5ddb80049623b000080008be.js”. home:51:77
15:43:12.461 Loading failed for the <script> with source “https://js.partnerstack.com/v1/”. home:1:1
15:43:12.462 Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://static.cloudflareinsights.com/beacon.min.js/v84a3a4012de94ce1a686ba8c167c359c1696973893317. (Reason: CORS request did not succeed). Status code: (null).

15:43:12.462 None of the “sha512” hashes in the integrity attribute match the content of the subresource. The computed hash is “z4PhNX7vuL3xVChQ1m2AB9Yg5AULVxXcg/SpIdNs6c5H0NE8XYXysP+DGNKHfuwvY7kxvUdBeoGlODJ6+SfaPg==”. home
15:43:12.772 [DEPRECATED] Default export is deprecated. Instead use import { create } from 'zustand'. index.mjs:32:12
15:43:12.823 [bugsnag] Loaded! bugsnag.js:3616:20
15:43:12.884 Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://sessions.bugsnag.com/. (Reason: CORS request did not succeed). Status code: (null).
2
15:43:12.949 Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://static.cloudflareinsights.com/beacon.min.js/v84a3a4012de94ce1a686ba8c167c359c1696973893317. (Reason: CORS request did not succeed). Status code: (null).

15:43:12.949 None of the “sha512” hashes in the integrity attribute match the content of the subresource. The computed hash is “z4PhNX7vuL3xVChQ1m2AB9Yg5AULVxXcg/SpIdNs6c5H0NE8XYXysP+DGNKHfuwvY7kxvUdBeoGlODJ6+SfaPg==”. home
15:43:13.038 [Stripe.js] It looks like Stripe.js was loaded more than one time. Please only load it once per page. bugsnag.js:2610:15
15:43:13.081 Cookie “browser_time_zone” does not have a proper “SameSite” attribute value. Soon, cookies without the “SameSite” attribute or with an invalid value will be treated as “Lax”. This means that the cookie will no longer be sent in third-party contexts. If your application depends on this cookie being available in such contexts, please add the “SameSite=None“ attribute to it. To know more about the “SameSite“ attribute, read https://developer.mozilla.org/docs/Web/HTTP/Headers/Set-Cookie/SameSite 7871-cabe4fc18117e016002b.js:1:110743
15:43:13.236 Partitioned cookie or storage access was provided to “https://js.stripe.com/v3/m-outer-3437aaddcdf6922d623e172c2d6f9278.html#url=https%3A%2F%2Fpeople.thatopen.com%2Fhome&title=That%20Open%20People%20community%20%7C%20That%20Open%20People&referrer=https%3A%2F%2Fplatform.thatopen.com%2F&muid=42bb6e33-7236-4224-b21a-c6687ee32d767cb6bc&sid=7eb3328e-c1cc-4c51-b75f-8329f22c2f7963be45&version=6&preview=false” because it is loaded in the third-party context and dynamic state partitioning is enabled.

15:43:13.239 Partitioned cookie or storage access was provided to “https://js.stripe.com/v3/m-outer-3437aaddcdf6922d623e172c2d6f9278.html#url=https%3A%2F%2Fpeople.thatopen.com%2Fhome&title=That%20Open%20People%20community%20%7C%20That%20Open%20People&referrer=https%3A%2F%2Fplatform.thatopen.com%2F&muid=42bb6e33-7236-4224-b21a-c6687ee32d767cb6bc&sid=7eb3328e-c1cc-4c51-b75f-8329f22c2f7963be45&version=6&preview=false” because it is loaded in the third-party context and dynamic state partitioning is enabled.

15:43:13.291 Request to access cookie or storage on “https://platform.twitter.com/widgets/widget_iframe.2f70fb173b9000da126c79afe2098f02.html?origin=https%3A%2F%2Fpeople.thatopen.com” was blocked because it came from a tracker and content blocking is enabled.

15:43:13.519 Partitioned cookie or storage access was provided to “https://m.stripe.network/inner.html#url=https%3A%2F%2Fpeople.thatopen.com%2Fhome&title=That%20Open%20People%20community%20%7C%20That%20Open%20People&referrer=https%3A%2F%2Fplatform.thatopen.com%2F&muid=42bb6e33-7236-4224-b21a-c6687ee32d767cb6bc&sid=7eb3328e-c1cc-4c51-b75f-8329f22c2f7963be45&version=6&preview=false” because it is loaded in the third-party context and dynamic state partitioning is enabled.

15:43:13.567 Partitioned cookie or storage access was provided to “https://m.stripe.network/inner.html#url=https%3A%2F%2Fpeople.thatopen.com%2Fhome&title=That%20Open%20People%20community%20%7C%20That%20Open%20People&referrer=https%3A%2F%2Fplatform.thatopen.com%2F&muid=42bb6e33-7236-4224-b21a-c6687ee32d767cb6bc&sid=7eb3328e-c1cc-4c51-b75f-8329f22c2f7963be45&version=6&preview=false” because it is loaded in the third-party context and dynamic state partitioning is enabled.

15:43:13.620 Please replace data-target="mobile-sidebar.panel" with data-mobile-sidebar-target="panel". The data-target attribute is deprecated and will be removed in a future version of Stimulus.

[bugsnag.js:2610:15](webpack://circle/node_modules/@bugsnag/browser/dist/bugsnag.js) 15:43:13.621 Please replace data-target="mobile-sidebar.menu" with data-mobile-sidebar-target="menu". The data-target attribute is deprecated and will be removed in a future version of Stimulus.

[bugsnag.js:2610:15](webpack://circle/node_modules/@bugsnag/browser/dist/bugsnag.js) 15:43:13.627 XHRGET https://people.thatopen.com/internal_api/support_widget/conversations/check? [HTTP/2 401 216ms]

15:43:13.628
XHRGET
https://people.thatopen.com/internal_api/support_widget/chats/authenticate?
[HTTP/2 401 216ms]

15:43:13.657 findBy called communityId = undefined. bugsnag.js:2610:15
15:43:13.865
Object { message: "You cannot perform this action.", status: 401, statusText: "", errorDetails: "You cannot perform this action.", body: {…} }
bugsnag.js:2610:15
15:43:13.867
Object { message: "You cannot perform this action.", status: 401, statusText: "", errorDetails: "You cannot perform this action.", body: {…} }
bugsnag.js:2610:15
15:43:14.186 [tiptap warn]: Duplicate extension names found: ['extension']. This can lead to issues. 2 bugsnag.js:2610:15
15:43:14.215 [tiptap warn]: Duplicate extension names found: ['extension']. This can lead to issues. 8 bugsnag.js:2610:15
15:43:14.406 Cookie “m” will soon be rejected because it is foreign and does not have the “Partitioned“ attribute. 2 6
15:43:14.457 Cookie “m” will soon be rejected because it is foreign and does not have the “Partitioned“ attribute. 2 6
15:43:14.882 Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://js-agent.newrelic.com/nr-spa-1.252.1.min.js. (Reason: CORS request did not succeed). Status code: (null).

15:43:14.882 None of the “sha512” hashes in the integrity attribute match the content of the subresource. The computed hash is “z4PhNX7vuL3xVChQ1m2AB9Yg5AULVxXcg/SpIdNs6c5H0NE8XYXysP+DGNKHfuwvY7kxvUdBeoGlODJ6+SfaPg==”. home
15:43:14.882 New Relic: A problem occurred when starting up session manager. This page will not start or extend any session. bugsnag.js:2610:15
15:43:14.883 ChunkLoadError: Loading chunk 111 failed.
(error: https://js-agent.newrelic.com/nr-spa-1.252.1.min.js)
j https://people.thatopen.com/home:6
e https://people.thatopen.com/home:6
e https://people.thatopen.com/home:6
E https://people.thatopen.com/home:6
api https://people.thatopen.com/home:6
s https://people.thatopen.com/home:6
o https://people.thatopen.com/home:6
api https://people.thatopen.com/home:6
A https://people.thatopen.com/home:6
https://people.thatopen.com/home:6
https://people.thatopen.com/home:6
https://people.thatopen.com/home:6
https://people.thatopen.com/home:6
bugsnag.js:2610:15
15:43:14.884 New Relic: A problem occurred when starting up session manager. This page will not start or extend any session.

Reproduction ▶️

https://platform.thatopen.com/app

Steps to reproduce 🔢

Just enter the URL in a browser, enable the console log, and try to load the page.

System Info 💻

Windows, Firefox.

Used Package Manager 📦

npm

Error Trace/Logs 📃

No response

Validations ✅

• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a repository issue and not a framework-specific issue. For example, if it's a THREE.js related bug, it should likely be reported to mrdoob/threejs instead.
• Check that this is a concrete bug. For Q&A join our Community.
• The provided reproduction is a minimal reproducible example of the bug.

Shadow dropper on official App don't work

Describe the bug 📝

Shadows don't work. Changing the checkbox does not cause any changes to the view. By the way, there are some errors in the console.
I noticed that in my code the simple cube example from the documentation works fine, but when I try to push the loaded fragment meshes to shadows it doesn't work either (here, with all from component meshes, but I have tried with only one fragmentmesh - screen 3).

Reproduction ▶️

https://platform.thatopen.com/app

Steps to reproduce 🔢

load any ifc to app / try to use shadows with any fragmentMesh

System Info 💻

"openbim-components": "1.2.0"

Used Package Manager 📦

npm

Error Trace/Logs 📃

No response

Validations ✅

• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a repository issue and not a framework-specific issue. For example, if it's a THREE.js related bug, it should likely be reported to mrdoob/threejs instead.
• Check that this is a concrete bug. For Q&A join our Community.
• The provided reproduction is a minimal reproducible example of the bug.

Error building template

Hello guys,

After the last updates the template run as dev but doesn't build, with the following errors.

Thanks,

npm run build

> [email protected] build
> tsc && vite build

src/components/Panels/Sections/Groupings.ts:48:5 - error TS2739: Type 'FragmentIdMap' is missing the following properties from type '{ map: FragmentIdMap; name: string; id: number | null; }': map, name, id

48     classifier.list.CustomSelections[groupNameInput.value] =
       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

src/components/Tables/CustomSelections.ts:32:51 - error TS2345: Argument of type '{ map: FragmentIdMap; name: string; id: number | null; }' is not assignable to parameter of type 'FragmentIdMap'.
  Property 'map' is incompatible with index signature.
    Type 'FragmentIdMap' is missing the following properties from type 'Set<number>': add, clear, delete, forEach, and 7 more.

32             fragmentIdMap: serializeFragmentIdMap(fragmentIdMap),
                                                     ~~~~~~~~~~~~~


Found 2 errors in 2 files.

Errors  Files
     1  src/components/Panels/Sections/Groupings.ts:48
     1  src/components/Tables/CustomSelections.ts:32

Add Nuxt 3 template

@HoyosJuan and @agviegas are you interested in having a template for Nuxt3?
I have managed to create a project that replicates your vanilla template.

Let me know and I can open a PR.

Fix tools template

Make sure that tools template works and integrate it with Vite

Load large files has problem - low performance -Shader Error 0 - VALIDATE_STATUS false

Hi
I asked this question before and you told me we have to use culler and tiles.
In this template, the code contains culler and tiles but the result is not ok.
Let's check this file. I faced 'THREE.WebGLProgram: Shader Error 0 - VALIDATE_STATUS false'

my file is about 180 MB and the link is here:

https://solidcloud.parisashahbazi.com/orange.ifc
Sometimes, the model is loaded but look at speed. It takes a lot of time to rotate and the culler works very slowly.

largmodel-s.mp4