Added Google's model viewer within viewer_three.js (#372)

* New IFC previewer

* Added an IFC previewer and a GLTF previewer

* Changelog update

* Fix positioning issues of three.js previewer

* Added changes to CHANGELOG.md

* Improving the 3D model viewer

* Remove the console.log

---------

Co-authored-by: Chrysovalantis Constantinou <[email protected]>
Co-authored-by: Luigi Marini <[email protected]>
Co-authored-by: Luigi Marini <[email protected]>

Author: 3 people

CHANGELOG.md

@@ -25,12 +25,14 @@ registration or heartbeat to Clowder that will restrict use of that extractor to
 - Documentation on how to do easy testing of pull requests
 - Previewer source URL in the documentation to point to the Clowder GitHub repo. [#395](https://github.com/clowder-framework/clowder/issues/395)
 - Added a citation.cff file
+- Added Google's model viewer within viewer_three.js previewer
 
 ### Fixed
 - Updated lastModifiesDate when updating file or metadata to a dataset, added lastModified to UI  [386](https://github.com/clowder-framework/clowder/issues/386)
 - Disabled button while create dataset ajax call is still going on [#311](https://github.com/clowder-framework/clowder/issues/311)
 - Changed default to 'Viewer' while inviting users to new spaces [#375](https://github.com/clowder-framework/clowder/issues/375)
 - Fixed bug where complex JSON metadata objects using arrays were not being indexed properly for search.
+- Fixed positioning problems related to how the 3D models appear on the screen
 
 
 ## 1.21.0 - 2022-08-23

public/javascripts/previewers/ifc_previewer/package.json

@@ -2,5 +2,5 @@
   "name": "IFC-Viewer",
   "main": "ifc_viewer.js",
   "file": true,
-  "contentType": ["model/ifc", "model/IFC", "application/octet-stream"]
+  "contentType": ["model/ifc", "model/IFC"]
 }

public/javascripts/previewers/three_js/package.json

@@ -1,6 +1,6 @@
 {
-  "name": "Three-JS",
+  "name": "3D Viewer",
   "main": "viewer_three.js",
   "file": true,
-  "contentType": [ "model/fbx", "model/FBX","model/gltf","model/GLTF", "model/glb","model/GLB", "application/octet-stream"]
+  "contentType": [ "model/fbx", "model/FBX","model/gltf","model/GLTF", "model/glb","model/GLB"]
 }

…s/previewers/three_js/loading_screen.css …avascripts/previewers/three_js/style.csspublic/javascripts/previewers/three_js/loading_screen.css renamed to public/javascripts/previewers/three_js/style.css public/javascripts/previewers/three_js/loading_screen.css renamed to public/javascripts/previewers/three_js/style.css

@@ -84,4 +84,9 @@ html, body {
         -ms-transform: rotate(360deg);
         transform: rotate(360deg);
     }
+}
+
+model-viewer {
+    width: 640px;
+    height: 480px;
 }