+
+
+
+
+
+
+
diff --git a/model_viewer_widget/static/src/assets/3d.glb b/model_viewer_widget/static/src/assets/3d.glb
new file mode 100644
index 000000000..820a00abe
Binary files /dev/null and b/model_viewer_widget/static/src/assets/3d.glb differ
diff --git a/model_viewer_widget/static/src/js/widget.js b/model_viewer_widget/static/src/js/widget.js
new file mode 100644
index 000000000..93f334b83
--- /dev/null
+++ b/model_viewer_widget/static/src/js/widget.js
@@ -0,0 +1,83 @@
+ /** @odoo-module **/
+import { registry } from "@web/core/registry";
+import { isBinarySize } from "@web/core/utils/binary";
+import { url } from "@web/core/utils/urls";
+import {ImageField, imageField} from "@web/views/fields/image/image_field";
+import { useRef, useEffect } from "@odoo/owl";
+const { useState } = owl;
+
+ /**
+ * Create canvas for adding 3D model
+ */
+export class Field3D extends ImageField {
+ setup(){
+ super.setup();
+ this.useRef = useRef("field_3d")
+ this.elId = `#${this.props.name}_el`
+ this.state = useState({
+ isValid: true,
+ value: url('/model_viewer_widget/static/src/assets/3d.glb')
+ });
+ this.canvasEl = ''
+ useEffect(() => {
+ this.createCanvas()
+ if (isBinarySize(this.props.record.data[this.props.name])) {
+ this.state.value = url("/web/content", {
+ model: this.props.record.resModel,
+ id: this.props.record.resId,
+ field: this.props.name,
+ unique: this.rawCacheKey,
+ });
+ } else if(this.props.record.data[this.props.name]){
+ this.state.value = `data:model/gltf-binary;base64, ${this.props.record.data[this.props.name]}`
+ }
+ this.view3D = new View3D(this.elId, {
+ src: this.state.value
+ });
+ })
+ }
+ /**
+ * At the time of removing file, a default 3D model will be displayed
+ */
+ onFileRemove(){
+ super.onFileRemove();
+ this.createCanvas()
+ this.state.value = url('/model_viewer_widget/static/src/assets/3d.glb');
+ if(this.view3D){
+ this.view3D.load(this.state.value)
+ }
+ }
+ /**
+ * Create canvas for adding 3D model
+ */
+ createCanvas(){
+ var elem = this.useRef.el.querySelector(this.elId)
+ const prevCanvas = this.useRef.el.querySelector('canvas');
+ if(prevCanvas)
+ elem.removeChild(prevCanvas)
+ const canvas = document.createElement('canvas');
+ canvas.width = 600;
+ canvas.height = 500;
+ canvas.classList.add('view3d-canvas')
+ elem.appendChild(canvas);
+ }
+ /**
+ * At the time of uploading file, the uploaded 3D model will be displayed
+ */
+ async onFileUploaded(info) {
+ super.onFileUploaded(info)
+ this.createCanvas()
+ this.props.record.update({ [this.props.name]: info.data });
+ }
+}
+
+Field3D.acceptedFileExtensions = "*"
+Field3D.template = "Field3DWidget"
+
+export const image3D = {
+ ...imageField,
+ component: Field3D,
+};
+
+
+registry.category("fields").add("3D_widget", image3D);
diff --git a/model_viewer_widget/static/src/xml/widget.xml b/model_viewer_widget/static/src/xml/widget.xml
new file mode 100644
index 000000000..18eed7ee2
--- /dev/null
+++ b/model_viewer_widget/static/src/xml/widget.xml
@@ -0,0 +1,31 @@
+
+
+
+
+
+
+
+
+
+ Community
+
+
+ Enterprise
+
+
+ Odoo.sh
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + This Module Helps to Render Interactive 3D Models. +
+3D Image Viewer Widget +
+
+ 
+
+
+
+
+ 
+ Email Us
+
+
+ 
+ Skype Us
+
+
+
+ Email Us
+
+
+
+ Skype Us
+
+
+ 
+
+
+
+ 
+
+
+
+ 
+
+
+
+
+
+
+
+
+
+ Key + Heighlights
+
+
+
+
+
+ 
+
+
+ + 3d Models +
++ It helps to render interactive 3D models.
+
+
+
+
+
+
+
+
+ + 3d Images +
++ It only supports 3D images with .glb extension. +
+
+
+
+
+
+
+
+
+ + Zoom in and zoom out feature is available. +
+
+
+
+
+
+
+
+
+ + Provides 360 degree view +
++ Able to Move in Any Direction. +
+
+
+
+
+
+
+
+
+
+ 3D Image Viewer Widget
+
+ Are you ready to make your business more
+ organized?
+
+
+
+
+ Are you ready to make your business more
+ organized?
+
Improve now!
+
+
+ 
+ 
+
+ 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+ 
+
+
+
+
+
+
+
+
+ + Here you can Add a + + 3D Model +
+
+
+ + If there is no 3D model uploaded, then + by default this is the 3D model you can + see. You can upload a new image. +
+
+
+
+ 
+
+
+
+
+
+
+
+
+
+
+ + Zoom In and + + Zoom Out +
+
+
+ + It provides a 3D effect and also the zoom in + and zoom out options are available. It is also + possible to move it in any direction. +
+
+
+
+ 
+
+
+
+
+
+
+
+
+
+
+ + 360 + Degree View +
+
+
+ + The 3D model is also possible to move in any direction. +
+
+
+
+ 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + Helps to Render Interactive 3D Models.
+
+
+
+
+
+
+
+
+
+ + Only Supports 3D Images with .glb Extension.
+
+
+
+
+
+
+
+
+
+ + Able to Zoom In and Zoom Out.
+
+
+
+
+
+
+
+
+
+ + Able to Move in Any Direction.
+
+
+
+
+
+
+
+
+
+ + Provides 360 degree view.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+ + While configuring a + backup, selecting + the Zip option will + include the + filestore in the + backup, while + choosing the Dump + option will create a + backup without the + filestore. +
+
+
+
+
+
+
+ + Enable the "Remove + Old Backups" option + in the backup + creation view to + automatically delete + previous backups + based on the number + of days specified. +
+
+
+
+
+
+
+ + Enable the "Notify + User" option and + specify a contact to + receive an email + containing a + detailed report with + the failure reason + and backup details. + This option will + also send an email + upon successful + backup. +
+
+
+
+
+
+ + Select the backup + destination as local + storage and specify + a backup path to a + location on the + system to create + backups on your own + system. +
+
+
+
+
+
+
+
+ + Latest Release 18.0.1.0.0 +
+ + 12th November, 2024 + +
+
+
+
+
+
+
+ Add
+
+
+
+ -
+
- + Initial Commit + +
+
+ + Related Products +
+ +
+ 
+ 
+ 
+ 
+ 
+ + Our Services
+
+
+
+
+
+
+
+
+
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+
+
+
+
+ ....
+
+
+
+
+
+
+
+
+
+
+
+
+
+