{"id":1396,"date":"2021-03-15T10:58:14","date_gmt":"2021-03-15T09:58:14","guid":{"rendered":"https:\/\/www.dyos.fr\/?page_id=1396"},"modified":"2025-09-24T13:41:29","modified_gmt":"2025-09-24T11:41:29","slug":"configurateur","status":"publish","type":"page","link":"https:\/\/www.dyos.fr\/en\/configurateur\/","title":{"rendered":"Explore your possibilities"},"content":{"rendered":"<p>[et_pb_section fb_built=\u00a0\u00bb1&Prime; fullwidth=\u00a0\u00bbon\u00a0\u00bb _builder_version=\u00a0\u00bb4.16&Prime; _module_preset=\u00a0\u00bbdefault\u00a0\u00bb custom_margin=\u00a0\u00bb||||false|false\u00a0\u00bb global_colors_info=\u00a0\u00bb{}\u00a0\u00bb][et_pb_fullwidth_code _builder_version=\u00a0\u00bb4.16&Prime; _module_preset=\u00a0\u00bbdefault\u00a0\u00bb global_colors_info=\u00a0\u00bb{}\u00a0\u00bb]<link type=\"text\/css\" rel=\"stylesheet\" href=\"\/3Dconfigurator\/stylesheets\/my.css\"><!-- [et_pb_line_break_holder] --><script src=\"\/3Dconfigurator\/scripts\/sku2pid.js\"><\/script><!-- [et_pb_line_break_holder] --><body><!-- [et_pb_line_break_holder] -->    <\/p>\n<div id=\"loader\"><\/div>\n<p><!-- [et_pb_line_break_holder] -->    <script><!-- [et_pb_line_break_holder] -->        function toggleConf(config) {<!-- [et_pb_line_break_holder] -->            let radios = document.getElementsByClassName(\"toggle\");<!-- [et_pb_line_break_holder] -->            for(i=0; i<radios.length; i++ ) {<!-- [et_pb_line_break_holder] -->                if (radios[i].id != config) radios[i].checked = false;<!-- [et_pb_line_break_holder] -->            }<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->    <\/script><!-- [et_pb_line_break_holder] -->    <script type=\"module\"><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        \/\/ Library imports<!-- [et_pb_line_break_holder] -->        import * as THREE from '\/3Dconfigurator\/node_modules\/three\/build\/three.module.js';<!-- [et_pb_line_break_holder] -->        import { GLTFLoader } from '\/3Dconfigurator\/node_modules\/three\/examples\/jsm\/loaders\/GLTFLoader.js';        <!-- [et_pb_line_break_holder] -->        import { OrbitControls } from '\/3Dconfigurator\/node_modules\/three\/examples\/jsm\/controls\/OrbitControls.js'; <!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        \/\/ Global vars<!-- [et_pb_line_break_holder] -->        let container3dloader;<!-- [et_pb_line_break_holder] -->        let camera, controls, scene, renderer;<!-- [et_pb_line_break_holder] -->        let windowHalfX = window.innerWidth \/ 2;<!-- [et_pb_line_break_holder] -->        let windowHalfY = window.innerHeight \/ 2;<!-- [et_pb_line_break_holder] -->        let totem; \/\/ The totem object<!-- [et_pb_line_break_holder] -->        let silhouette; \/\/ The man\/woman silhouette used to give the scale<!-- [et_pb_line_break_holder] -->        let currentSize = 'grand'; \/\/ The totem size - defaulting to grand <!-- [et_pb_line_break_holder] -->        \/\/ let currentModel = 'girafe'; \/\/ The totem type - girafe by default<!-- [et_pb_line_break_holder] -->        \/\/ let currentColor = 'rouge'; \/\/ The totem color - rouge by default<!-- [et_pb_line_break_holder] -->        let price = \"Prix 1490\u20ac\"; \/\/ The price tag<!-- [et_pb_line_break_holder] -->        let plane; \/\/ The plane reprensenting the ground<!-- [et_pb_line_break_holder] -->        const manager = new THREE.LoadingManager();<!-- [et_pb_line_break_holder] -->        const loader = new GLTFLoader( manager );<!-- [et_pb_line_break_holder] -->        const textureLoader = new THREE.TextureLoader();<!-- [et_pb_line_break_holder] -->        let modelLoading = false;<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        \/\/ Materials (2)<!-- [et_pb_line_break_holder] -->        \/\/ 1: The material with a plain color that we use for everything except corten<!-- [et_pb_line_break_holder] -->        let meshColorMaterial = new THREE.MeshPhongMaterial( {<!-- [et_pb_line_break_holder] -->            color: 0xb9201b,<!-- [et_pb_line_break_holder] -->            shininess: 100,<!-- [et_pb_line_break_holder] -->            specular: 0x161616,<!-- [et_pb_line_break_holder] -->            emissive: 0x0,<!-- [et_pb_line_break_holder] -->            reflectivity: 1,<!-- [et_pb_line_break_holder] -->        } );<!-- [et_pb_line_break_holder] -->        \/\/ 2: Corten material <!-- [et_pb_line_break_holder] -->        const cortenTexture = textureLoader.load( '\/3Dconfigurator\/3d_assets\/textures\/Corten.jpg' );<!-- [et_pb_line_break_holder] -->        cortenTexture.wrapS = cortenTexture.wrapT = THREE.RepeatWrapping;<!-- [et_pb_line_break_holder] -->        cortenTexture.repeat.set( 30, 30 );<!-- [et_pb_line_break_holder] -->        \/\/ cortenTexture.anisotropy = 16;<!-- [et_pb_line_break_holder] -->        cortenTexture.encoding = THREE.sRGBEncoding;<!-- [et_pb_line_break_holder] -->        const cortenMaterial = new THREE.MeshLambertMaterial( { map: cortenTexture } );<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        \/\/ Menu management <!-- [et_pb_line_break_holder] -->        document.getElementById(\"openbtn\").hidden = true;<!-- [et_pb_line_break_holder] -->        \/\/document.getElementById(\"sidebarconfigurator\").hidden = true;<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        \/\/ Event listener for open button <!-- [et_pb_line_break_holder] -->        document.getElementById(\"openbtn\").addEventListener(\"click\", function () {<!-- [et_pb_line_break_holder] -->            document.getElementById(\"openbtn\").hidden = true;<!-- [et_pb_line_break_holder] -->            document.getElementById(\"closebtn\").hidden = false;<!-- [et_pb_line_break_holder] -->            document.getElementById(\"sidebarconfigurator\").hidden = false;<!-- [et_pb_line_break_holder] -->        });<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        \/\/ Event listener for close button <!-- [et_pb_line_break_holder] -->        document.getElementById(\"closebtn\").addEventListener(\"click\", function () {<!-- [et_pb_line_break_holder] -->            document.getElementById(\"openbtn\").hidden = false;<!-- [et_pb_line_break_holder] -->            document.getElementById(\"closebtn\").hidden = true;<!-- [et_pb_line_break_holder] -->            document.getElementById(\"sidebarconfigurator\").hidden = true;<!-- [et_pb_line_break_holder] -->        });<!-- [et_pb_line_break_holder] -->        <!-- [et_pb_line_break_holder] -->        \/\/ onclick event listener for colors<!-- [et_pb_line_break_holder] -->        let couleur = document.forms['couleurs'].elements['couleur'];<!-- [et_pb_line_break_holder] -->        for (var i=0, len=couleur.length; i<len; i++) {<!-- [et_pb_line_break_holder] -->            couleur[i].onclick = function() {<!-- [et_pb_line_break_holder] -->                console.log(\"couleur : \" + this.value);<!-- [et_pb_line_break_holder] -->                currentColor = this.value;<!-- [et_pb_line_break_holder] -->                if (this.value == 'Rouge') setMeshColor(0xb9201b);<!-- [et_pb_line_break_holder] -->                else if (this.value == 'Citron') setMeshColor(0xf9c944);<!-- [et_pb_line_break_holder] -->                else if (this.value == 'BleuRoi') setMeshColor(0x053a79);<!-- [et_pb_line_break_holder] -->                else if (this.value == 'BleuAzur') setMeshColor(0x148ab4);<!-- [et_pb_line_break_holder] -->                else if (this.value == 'Taupe') setMeshColor(0x766a5f);<!-- [et_pb_line_break_holder] -->                else if (this.value == 'Orange') setMeshColor(0xeb6b2f);<!-- [et_pb_line_break_holder] -->                else if (this.value == 'Anthracite') setMeshColor(0x383e42);<!-- [et_pb_line_break_holder] -->                else if (this.value == 'Lavande') setMeshColor(0x766999);<!-- [et_pb_line_break_holder] -->                else if (this.value == 'VertAnis') setMeshColor(0xb9cdad);<!-- [et_pb_line_break_holder] -->                else if (this.value == 'Neige') setMeshColor(0xf1f0ea);<!-- [et_pb_line_break_holder] -->                else if (this.value == 'Fushia') setMeshColor(0x8f3672);<!-- [et_pb_line_break_holder] -->                else if (this.value == 'Corten') setMeshMaterial(cortenMaterial);<!-- [et_pb_line_break_holder] -->            };<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        \/\/ onclick event listener for the model type<!-- [et_pb_line_break_holder] -->        let modele = document.forms['modele'].elements['model'];<!-- [et_pb_line_break_holder] -->        for (var i=0, len=modele.length; i<len; i++) {<!-- [et_pb_line_break_holder] -->            modele[i].onclick = function() {<!-- [et_pb_line_break_holder] -->                scene.remove( totem.scene );<!-- [et_pb_line_break_holder] -->                setModel( this.value );<!-- [et_pb_line_break_holder] -->            };<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->        <!-- [et_pb_line_break_holder] -->        \/\/ onclick event listener for the size<!-- [et_pb_line_break_holder] -->        let taille = document.forms['tailles'].elements['taille'];<!-- [et_pb_line_break_holder] -->        for (var u=0, len=taille.length; u<len; u++) {<!-- [et_pb_line_break_holder] -->            taille[u].onclick = function() {<!-- [et_pb_line_break_holder] -->                setScale( this.value );<!-- [et_pb_line_break_holder] -->            };<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->        <!-- [et_pb_line_break_holder] -->        \/\/ Progress and error functions (logging to console for troubleshooting)<!-- [et_pb_line_break_holder] -->        function onProgress( xhr ) {<!-- [et_pb_line_break_holder] -->            const percentComplete = xhr.loaded \/ xhr.total * 100;<!-- [et_pb_line_break_holder] -->            if ( xhr.lengthComputable ) {console.log( 'Model ' + percentComplete + '% downloaded' );}<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->        <!-- [et_pb_line_break_holder] -->        function onError() {<!-- [et_pb_line_break_holder] -->            console.log( 'An error happened');<!-- [et_pb_line_break_holder] -->        } <!-- [et_pb_line_break_holder] -->        <!-- [et_pb_line_break_holder] -->        init();<!-- [et_pb_line_break_holder] -->        animate();<!-- [et_pb_line_break_holder] -->        <!-- [et_pb_line_break_holder] -->        function init() {<!-- [et_pb_line_break_holder] -->            <!-- [et_pb_line_break_holder] -->            \/\/ Init scene and renderer + camera <!-- [et_pb_line_break_holder] -->            \/\/ Scene<!-- [et_pb_line_break_holder] -->            scene = new THREE.Scene();<!-- [et_pb_line_break_holder] -->            container3dloader = document.createElement( 'div' );<!-- [et_pb_line_break_holder] -->            document.body.appendChild( container3dloader );<!-- [et_pb_line_break_holder] -->            \/\/ Renderer including<!-- [et_pb_line_break_holder] -->            renderer = new THREE.WebGLRenderer( {antialias: true} );<!-- [et_pb_line_break_holder] -->            renderer.setPixelRatio( window.devicePixelRatio );<!-- [et_pb_line_break_holder] -->            renderer.setSize( window.innerWidth, window.innerHeight );<!-- [et_pb_line_break_holder] -->            renderer.shadowMap.enabled = true;<!-- [et_pb_line_break_holder] -->            renderer.shadowMapSoft = true;<!-- [et_pb_line_break_holder] -->            renderer.shadowMap.Type = THREE.SoftShadowMap;<!-- [et_pb_line_break_holder] -->            document.body.appendChild( renderer.domElement );<!-- [et_pb_line_break_holder] -->            \/\/ Camera<!-- [et_pb_line_break_holder] -->            camera = new THREE.PerspectiveCamera( 45, window.innerWidth \/ window.innerHeight, 0.1, 2000 );<!-- [et_pb_line_break_holder] -->            camera.position.set ( 1.5, 2, -4 );<!-- [et_pb_line_break_holder] -->            \/\/ Scene background color<!-- [et_pb_line_break_holder] -->            \/\/ TODO (one day): use a 360 picture as background, but it will take some time to load...<!-- [et_pb_line_break_holder] -->            scene.background = new THREE.Color( 0xcccccc );<!-- [et_pb_line_break_holder] -->            <!-- [et_pb_line_break_holder] -->            \/\/ Lights<!-- [et_pb_line_break_holder] -->            \/\/ Ambient light for global illumination<!-- [et_pb_line_break_holder] -->            const ambientLight = new THREE.AmbientLight( 0xffffff, 0.4 );<!-- [et_pb_line_break_holder] -->            scene.add( ambientLight );<!-- [et_pb_line_break_holder] -->            \/\/ Extra point light to get shadows<!-- [et_pb_line_break_holder] -->            const PointLight = new THREE.PointLight( 0xffffff, 0.9 );<!-- [et_pb_line_break_holder] -->            PointLight.position.set( 2, 4, -3 );<!-- [et_pb_line_break_holder] -->            PointLight.castShadow = true;<!-- [et_pb_line_break_holder] -->            PointLight.shadow.mapSize.width = 512; <!-- [et_pb_line_break_holder] -->            PointLight.shadow.mapSize.height = 512;<!-- [et_pb_line_break_holder] -->            PointLight.shadow.bias = 0.5;<!-- [et_pb_line_break_holder] -->            scene.add( PointLight )<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->            \/\/ const DirectionalLight = new THREE.DirectionalLight( 0xffffff, 0.8 );<!-- [et_pb_line_break_holder] -->            \/\/ DirectionalLight.position.set (20, 100, 10);<!-- [et_pb_line_break_holder] -->            \/\/ DirectionalLight.target.position.set (0, 0, 0);<!-- [et_pb_line_break_holder] -->            \/\/ DirectionalLight.castShadow = true;<!-- [et_pb_line_break_holder] -->            \/\/ DirectionalLight.shadow.mapSize.width = 1024;<!-- [et_pb_line_break_holder] -->            \/\/ DirectionalLight.shadow.mapSize.height = 1024;<!-- [et_pb_line_break_holder] -->            \/\/ DirectionalLight.shadow.bias = -0.001;<!-- [et_pb_line_break_holder] -->            \/\/ DirectionalLight.shadow.camera.near = 0.1;<!-- [et_pb_line_break_holder] -->            \/\/ DirectionalLight.shadow.camera.far = 500;<!-- [et_pb_line_break_holder] -->            \/\/ DirectionalLight.shadow.camera.left = -500;<!-- [et_pb_line_break_holder] -->            \/\/ DirectionalLight.shadow.camera.right = 500;<!-- [et_pb_line_break_holder] -->            \/\/ DirectionalLight.shadow.camera.top = 500;<!-- [et_pb_line_break_holder] -->            \/\/ DirectionalLight.shadow.camera.bottom = 500;<!-- [et_pb_line_break_holder] -->            \/\/ scene.add( DirectionalLight );<!-- [et_pb_line_break_holder] -->            <!-- [et_pb_line_break_holder] -->            \/\/ Ground and fog<!-- [et_pb_line_break_holder] -->            const groundTexture = textureLoader.load( '\/3Dconfigurator\/3d_assets\/textures\/grasslight.jpg' );<!-- [et_pb_line_break_holder] -->            groundTexture.wrapS = groundTexture.wrapT = THREE.RepeatWrapping;<!-- [et_pb_line_break_holder] -->            groundTexture.repeat.set( 200, 200 );<!-- [et_pb_line_break_holder] -->            groundTexture.anisotropy = 16;<!-- [et_pb_line_break_holder] -->            groundTexture.encoding = THREE.sRGBEncoding;<!-- [et_pb_line_break_holder] -->            const groundMaterial = new THREE.MeshLambertMaterial( {} );<!-- [et_pb_line_break_holder] -->            groundMaterial.receiveShadow = true;<!-- [et_pb_line_break_holder] -->            scene.fog = new THREE.FogExp2( 0xcccccc, 0.03 );<!-- [et_pb_line_break_holder] -->            plane = new THREE.Mesh( new THREE.PlaneGeometry(500,500, 500,500),<!-- [et_pb_line_break_holder] -->                                        groundMaterial );<!-- [et_pb_line_break_holder] -->                                        \/\/ new THREE.MeshPhongMaterial({color:0xffffff}) );<!-- [et_pb_line_break_holder] -->            plane.position.y = -1.50;<!-- [et_pb_line_break_holder] -->            plane.rotation.x = - Math.PI \/ 2;<!-- [et_pb_line_break_holder] -->            plane.receiveShadow = true;<!-- [et_pb_line_break_holder] -->            scene.add( plane );<!-- [et_pb_line_break_holder] -->            <!-- [et_pb_line_break_holder] -->            \/\/ 360 controls<!-- [et_pb_line_break_holder] -->            controls = new OrbitControls( camera, renderer.domElement );<!-- [et_pb_line_break_holder] -->            controls.listenToKeyEvents( window );<!-- [et_pb_line_break_holder] -->            controls.enableDamping = true;<!-- [et_pb_line_break_holder] -->            controls.dampingFactor = 0.05;<!-- [et_pb_line_break_holder] -->            controls.screenSpacePanning = false;<!-- [et_pb_line_break_holder] -->            controls.minDistance = 1;<!-- [et_pb_line_break_holder] -->            controls.maxDistance = 3.5;<!-- [et_pb_line_break_holder] -->            controls.maxPolarAngle = Math.PI \/ 2;<!-- [et_pb_line_break_holder] -->            <!-- [et_pb_line_break_holder] -->            \/\/ Load the silhouette next to the totem<!-- [et_pb_line_break_holder] -->            let rand = Math.random();<!-- [et_pb_line_break_holder] -->            let silhouette_src, silhouette_scale;<!-- [et_pb_line_break_holder] -->            if ( rand <= 0.5 ) {<!-- [et_pb_line_break_holder] -->                silhouette_src = '\/3Dconfigurator\/3d_assets\/femme.glb';<!-- [et_pb_line_break_holder] -->                silhouette_scale = 1;<!-- [et_pb_line_break_holder] -->            }<!-- [et_pb_line_break_holder] -->            else {<!-- [et_pb_line_break_holder] -->                silhouette_src = '\/3Dconfigurator\/3d_assets\/homme.glb';<!-- [et_pb_line_break_holder] -->                silhouette_scale = 0.9;<!-- [et_pb_line_break_holder] -->            }<!-- [et_pb_line_break_holder] -->            loader.load( silhouette_src, function ( gltf ) {<!-- [et_pb_line_break_holder] -->                silhouette = gltf;<!-- [et_pb_line_break_holder] -->                silhouette.scene.traverse( function ( child ) {<!-- [et_pb_line_break_holder] -->                    if ( child.isMesh ) {<!-- [et_pb_line_break_holder] -->                        child.castShadow = true;<!-- [et_pb_line_break_holder] -->                        \/\/ No material, it is just a silhouette<!-- [et_pb_line_break_holder] -->                    }<!-- [et_pb_line_break_holder] -->                } );<!-- [et_pb_line_break_holder] -->                scene.add( silhouette.scene );<!-- [et_pb_line_break_holder] -->                silhouette.scene.scale.x = silhouette.scene.scale.y = silhouette.scene.scale.z = silhouette_scale;<!-- [et_pb_line_break_holder] -->                silhouette.scene.position.y = -1.5;<!-- [et_pb_line_break_holder] -->                silhouette.scene.position.x = -0.6;<!-- [et_pb_line_break_holder] -->                silhouette.scene.rotation.y = 3;<!-- [et_pb_line_break_holder] -->                silhouette.receiveShadow = true;<!-- [et_pb_line_break_holder] -->            }, onProgress, onError );<!-- [et_pb_line_break_holder] -->            <!-- [et_pb_line_break_holder] -->            <!-- [et_pb_line_break_holder] -->            \/\/ Load the base model<!-- [et_pb_line_break_holder] -->            setModel('girafe');<!-- [et_pb_line_break_holder] -->            <!-- [et_pb_line_break_holder] -->            window.addEventListener( 'resize', onWindowResize );<!-- [et_pb_line_break_holder] -->        } \/\/ End of init()<!-- [et_pb_line_break_holder] -->        <!-- [et_pb_line_break_holder] -->        \/\/ Model loader function        <!-- [et_pb_line_break_holder] -->        function setModel(model) {<!-- [et_pb_line_break_holder] -->            if (modelLoading) return;<!-- [et_pb_line_break_holder] -->            modelLoading = true;<!-- [et_pb_line_break_holder] -->            console.log(\"Mod\u00e8le s\u00e9lectionn\u00e9 : \" + model);<!-- [et_pb_line_break_holder] -->            loader.load( '\/3Dconfigurator\/3d_assets\/' + model + '.glb', function ( gltf ) {<!-- [et_pb_line_break_holder] -->                document.getElementById( 'loader' ).style.display = 'visible';<!-- [et_pb_line_break_holder] -->                totem = gltf;<!-- [et_pb_line_break_holder] -->                totem.scene.traverse( function ( child ) {<!-- [et_pb_line_break_holder] -->                    if ( child.isMesh ) {<!-- [et_pb_line_break_holder] -->                        child.material = meshColorMaterial;<!-- [et_pb_line_break_holder] -->                        child.castShadow = true;<!-- [et_pb_line_break_holder] -->                    }<!-- [et_pb_line_break_holder] -->                } );<!-- [et_pb_line_break_holder] -->                \/\/ For now one of the models has a different orientation :-(<!-- [et_pb_line_break_holder] -->                if ( model != 'mosaique' ) { totem.scene.rotation.x = -Math.PI \/ 2; }<!-- [et_pb_line_break_holder] -->                totem.scene.position.y = -1.5;<!-- [et_pb_line_break_holder] -->                totem.scene.position.x = 0;<!-- [et_pb_line_break_holder] -->                totem.scene.position.z = 0;<!-- [et_pb_line_break_holder] -->                scene.add( totem.scene );<!-- [et_pb_line_break_holder] -->                setScale( currentSize );<!-- [et_pb_line_break_holder] -->                document.getElementById( 'loader' ).style.display = 'none';<!-- [et_pb_line_break_holder] -->                modelLoading = false;<!-- [et_pb_line_break_holder] -->            }, onProgress, onError );<!-- [et_pb_line_break_holder] -->            currentModel = model;<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->        <!-- [et_pb_line_break_holder] -->        <!-- [et_pb_line_break_holder] -->        \/\/ Function to change the model size - it just scales the totem homothetically compared to the silhouette<!-- [et_pb_line_break_holder] -->        \/\/ Since the price depends only on the model size, it also sets the price label in the add to cart button<!-- [et_pb_line_break_holder] -->        function setScale( size ) {<!-- [et_pb_line_break_holder] -->            let scale_factor;<!-- [et_pb_line_break_holder] -->            switch ( size ) {<!-- [et_pb_line_break_holder] -->                case 'grand':<!-- [et_pb_line_break_holder] -->                    scale_factor = 1;<!-- [et_pb_line_break_holder] -->                    document.getElementById(\"pricedisplay\").innerHTML = \"Prix 2340 \u20ac\";<!-- [et_pb_line_break_holder] -->                    currentSizeV2 = '240';<!-- [et_pb_line_break_holder] -->                    break;<!-- [et_pb_line_break_holder] -->                case 'moyen':<!-- [et_pb_line_break_holder] -->                    scale_factor = 0.625;<!-- [et_pb_line_break_holder] -->                    document.getElementById(\"pricedisplay\").innerHTML = \"Prix 1490 \u20ac\";<!-- [et_pb_line_break_holder] -->                    currentSizeV2 = '150';<!-- [et_pb_line_break_holder] -->                    break;<!-- [et_pb_line_break_holder] -->                case 'petit':<!-- [et_pb_line_break_holder] -->                    scale_factor = 0.354;<!-- [et_pb_line_break_holder] -->                    document.getElementById(\"pricedisplay\").innerHTML = \"Prix 490 \u20ac\";<!-- [et_pb_line_break_holder] -->                    currentSizeV2 = '85';<!-- [et_pb_line_break_holder] -->                    break;<!-- [et_pb_line_break_holder] -->            }<!-- [et_pb_line_break_holder] -->            currentSize = size;<!-- [et_pb_line_break_holder] -->            totem.scene.scale.y = scale_factor;<!-- [et_pb_line_break_holder] -->            totem.scene.scale.x = scale_factor;<!-- [et_pb_line_break_holder] -->            totem.scene.scale.z = scale_factor;<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->        <!-- [et_pb_line_break_holder] -->        <!-- [et_pb_line_break_holder] -->        function animate() {        <!-- [et_pb_line_break_holder] -->            requestAnimationFrame( animate );<!-- [et_pb_line_break_holder] -->            renderer.render(scene, camera);<!-- [et_pb_line_break_holder] -->            controls.update();<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->        <!-- [et_pb_line_break_holder] -->        function onWindowResize() {<!-- [et_pb_line_break_holder] -->            windowHalfX = window.innerWidth \/ 2;<!-- [et_pb_line_break_holder] -->            windowHalfY = window.innerHeight \/ 2;<!-- [et_pb_line_break_holder] -->            camera.aspect = window.innerWidth \/ window.innerHeight;<!-- [et_pb_line_break_holder] -->            camera.updateProjectionMatrix();<!-- [et_pb_line_break_holder] -->            renderer.setSize( window.innerWidth, window.innerHeight );<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->        <!-- [et_pb_line_break_holder] -->        \/\/ function render() {<!-- [et_pb_line_break_holder] -->        \/\/     renderer.render( scene, camera );<!-- [et_pb_line_break_holder] -->        \/\/ }<!-- [et_pb_line_break_holder] -->        <!-- [et_pb_line_break_holder] -->        function setMeshColor(color) {<!-- [et_pb_line_break_holder] -->            setMeshMaterial(meshColorMaterial);<!-- [et_pb_line_break_holder] -->            meshColorMaterial.color.setHex(color);<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        function setMeshMaterial(mat) {<!-- [et_pb_line_break_holder] -->            totem.scene.traverse( function ( child ) {<!-- [et_pb_line_break_holder] -->                if ( child.isMesh ) {<!-- [et_pb_line_break_holder] -->                    child.material = mat;<!-- [et_pb_line_break_holder] -->                    child.material.side = THREE.DoubleSide;<!-- [et_pb_line_break_holder] -->                    child.castShadow = true;<!-- [et_pb_line_break_holder] -->                }<!-- [et_pb_line_break_holder] -->            } );<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->        <!-- [et_pb_line_break_holder] -->        document.getElementById(\"pricedisplay\").innerHTML = price;<!-- [et_pb_line_break_holder] -->    <\/script><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    <\/p>\n<div id=\"info\"><!-- [et_pb_line_break_holder] -->        <\/p>\n<section class=\"mainmenu\"><!-- [et_pb_line_break_holder] -->            <button id=\"closebtn\" class=\"cross\">\u00d7<\/button><!-- [et_pb_line_break_holder] -->            <button id=\"openbtn\" class=\"actionbtn\">Configurer<\/button><!-- [et_pb_line_break_holder] -->            <\/p>\n<div id=\"sidebarconfigurator\" class=\"withadapt\"><!-- [et_pb_line_break_holder] -->            <\/p>\n<div class=\"title\">Explore your possibilities<\/div>\n<p><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->            <!-- Model selector --><!-- [et_pb_line_break_holder] -->            <\/p>\n<div class=\"wrap-collabsible\"> <input id=\"collapsible\" class=\"toggle\" name=\"conf\" type=\"checkbox\" onclick=\"toggleConf('collapsible');\"> <label for=\"collapsible\" class=\"lbl-toggle\">Design<\/label><!-- [et_pb_line_break_holder] -->                <\/p>\n<div class=\"collapsible-content\"><!-- [et_pb_line_break_holder] -->                  <\/p>\n<div class=\"content-inner\"><!-- [et_pb_line_break_holder] -->                    <\/p>\n<form id=\"modele\" class=\"rowandmodel\" action=\"\"><!-- [et_pb_line_break_holder] -->                        <label for=\"girafe\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"girafe\" name=\"model\" value=\"girafe\" checked><!-- [et_pb_line_break_holder] -->                                <\/p>\n<div class=\"typebox\"><!-- [et_pb_line_break_holder] -->                                    <\/p>\n<div class=\"typename\">Giraffe<\/div>\n<p><!-- [et_pb_line_break_holder] -->                                <\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"cuboide\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"cuboide\" name=\"model\" value=\"cuboide\"><!-- [et_pb_line_break_holder] -->                                <\/p>\n<div class=\"typebox\"><!-- [et_pb_line_break_holder] -->                                    <\/p>\n<div class=\"typename\">Cuboid<\/div>\n<p><!-- [et_pb_line_break_holder] -->                                <\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"tetris\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"tetris\" name=\"model\" value=\"tetris\"><!-- [et_pb_line_break_holder] -->                                <\/p>\n<div class=\"typebox\"><!-- [et_pb_line_break_holder] -->                                    <\/p>\n<div class=\"typename\">Tetris<\/div>\n<p><!-- [et_pb_line_break_holder] -->                                <\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"abeille\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"abeille\" name=\"model\" value=\"abeille\"><!-- [et_pb_line_break_holder] -->                                <\/p>\n<div class=\"typebox\"><!-- [et_pb_line_break_holder] -->                                    <\/p>\n<div class=\"typename\">Honeycomb<\/div>\n<p><!-- [et_pb_line_break_holder] -->                                <\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"bubble\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"bubble\" name=\"model\" value=\"bubble\"><!-- [et_pb_line_break_holder] -->                                <\/p>\n<div class=\"typebox\"><!-- [et_pb_line_break_holder] -->                                    <\/p>\n<div class=\"typename\">Bubble<\/div>\n<p><!-- [et_pb_line_break_holder] -->                                <\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"star\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"star\" name=\"model\" value=\"star\"><!-- [et_pb_line_break_holder] -->                                <\/p>\n<div class=\"typebox\"><!-- [et_pb_line_break_holder] -->                                    <\/p>\n<div class=\"typename\">Star<\/div>\n<p><!-- [et_pb_line_break_holder] -->                                <\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"pop\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"pop\" name=\"model\" value=\"pop\"><!-- [et_pb_line_break_holder] -->                                <\/p>\n<div class=\"typebox\"><!-- [et_pb_line_break_holder] -->                                    <\/p>\n<div class=\"typename\">Pop<\/div>\n<p><!-- [et_pb_line_break_holder] -->                                <\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"geometric\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"geometric\" name=\"model\" value=\"geometric\"><!-- [et_pb_line_break_holder] -->                                <\/p>\n<div class=\"typebox\"><!-- [et_pb_line_break_holder] -->                                    <\/p>\n<div class=\"typename\">Geometric<\/div>\n<p><!-- [et_pb_line_break_holder] -->                                <\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"mosaique\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"mosaique\" name=\"model\" value=\"mosaique\"><!-- [et_pb_line_break_holder] -->                                <\/p>\n<div class=\"typebox\"><!-- [et_pb_line_break_holder] -->                                    <\/p>\n<div class=\"typename\">Mosaic<\/div>\n<p><!-- [et_pb_line_break_holder] -->                                <\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                    <input type=\"hidden\" name=\"trp-form-language\" value=\"en\"\/><\/form>\n<p><!-- [et_pb_line_break_holder] -->                  <\/div>\n<p><!-- [et_pb_line_break_holder] -->                <\/div>\n<p><!-- [et_pb_line_break_holder] -->            <\/div>\n<p>            <!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->            <!-- Color selector --><!-- [et_pb_line_break_holder] -->            <\/p>\n<div class=\"wrap-collabsible\"> <input id=\"collapsiblecouleur\" class=\"toggle\" name=\"conf\" type=\"checkbox\" onclick=\"toggleConf('collapsiblecouleur');\"> <label for=\"collapsiblecouleur\" class=\"lbl-toggle\">Color<\/label><!-- [et_pb_line_break_holder] -->                <\/p>\n<div class=\"collapsible-content\"><!-- [et_pb_line_break_holder] -->                  <\/p>\n<div class=\"content-inner\"><!-- [et_pb_line_break_holder] -->                    <\/p>\n<form id=\"couleurs\" class=\"rowandcol\" action=\"\"><!-- [et_pb_line_break_holder] -->                        <label for=\"Rouge\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"Rouge\" name=\"couleur\" value=\"Rouge\" checked><!-- [et_pb_line_break_holder] -->                                <\/p>\n<div class=\"colorbox rouge\"><!-- [et_pb_line_break_holder] -->                                <\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"Citron\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"Citron\" name=\"couleur\" value=\"Citron\"><!-- [et_pb_line_break_holder] -->                            <\/p>\n<div class=\"colorbox citron\"><\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"Anthracite\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"Anthracite\" name=\"couleur\" value=\"Anthracite\"><!-- [et_pb_line_break_holder] -->                            <\/p>\n<div class=\"colorbox anthracite\"><\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"BleuAzur\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"BleuAzur\" name=\"couleur\" value=\"BleuAzur\"><!-- [et_pb_line_break_holder] -->                            <\/p>\n<div class=\"colorbox bleuazur\"><\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"BleuRoi\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"BleuRoi\" name=\"couleur\" value=\"BleuRoi\"><!-- [et_pb_line_break_holder] -->                            <\/p>\n<div class=\"colorbox bleuroi\"><\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"Orange\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"Orange\" name=\"couleur\" value=\"Orange\"><!-- [et_pb_line_break_holder] -->                            <\/p>\n<div class=\"colorbox orange\"><\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"Fushia\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"Fushia\" name=\"couleur\" value=\"Fushia\"><!-- [et_pb_line_break_holder] -->                            <\/p>\n<div class=\"colorbox fuchsia\"><\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"VertAnis\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"VertAnis\" name=\"couleur\" value=\"VertAnis\"><!-- [et_pb_line_break_holder] -->                            <\/p>\n<div class=\"colorbox vertanis\"><\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"Lavande\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"Lavande\" name=\"couleur\" value=\"Lavande\"><!-- [et_pb_line_break_holder] -->                            <\/p>\n<div class=\"colorbox lavande\"><\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"Taupe\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"Taupe\" name=\"couleur\" value=\"Taupe\"><!-- [et_pb_line_break_holder] -->                            <\/p>\n<div class=\"colorbox taupe\"><\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"Neige\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"Neige\" name=\"couleur\" value=\"Neige\"><!-- [et_pb_line_break_holder] -->                            <\/p>\n<div class=\"colorbox neige\"><\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"Corten\"><!-- [et_pb_line_break_holder] -->                            <input type=\"radio\" id=\"Corten\" name=\"couleur\" value=\"Corten\"><!-- [et_pb_line_break_holder] -->                            <\/p>\n<div class=\"colorbox corten\"><\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                    <input type=\"hidden\" name=\"trp-form-language\" value=\"en\"\/><\/form>\n<p><!-- [et_pb_line_break_holder] -->                  <\/div>\n<p><!-- [et_pb_line_break_holder] -->                <\/div>\n<p><!-- [et_pb_line_break_holder] -->            <\/div>\n<p><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->            <!-- Size selector --><!-- [et_pb_line_break_holder] -->            <\/p>\n<div class=\"wrap-collabsible\"> <input id=\"collapsibletaille\" class=\"toggle\" name=\"conf\" type=\"checkbox\" onclick=\"toggleConf('collapsibletaille');\"> <label for=\"collapsibletaille\" class=\"lbl-toggle\">Size<\/label><!-- [et_pb_line_break_holder] -->                <\/p>\n<div class=\"collapsible-content\"><!-- [et_pb_line_break_holder] -->                  <\/p>\n<div class=\"content-inner\"><!-- [et_pb_line_break_holder] -->                    <\/p>\n<form id=\"tailles\" action=\"\"><!-- [et_pb_line_break_holder] -->                        <label for=\"grand\"><!-- [et_pb_line_break_holder] -->                            <input id=\"grand\" type=\"radio\" name=\"taille\" value=\"grand\" checked=\"checked\"><!-- [et_pb_line_break_holder] -->                            <span class=\"controlind\"><\/span><!-- [et_pb_line_break_holder] -->                            <\/p>\n<div class=\"sizebox\"><!-- [et_pb_line_break_holder] -->                                <\/p>\n<div class=\"sizename\" style=\"font-weight: 600;\"> Large <\/div>\n<p><!-- [et_pb_line_break_holder] -->                                <\/p>\n<div class=\"sizename\">240 cm \/ 7ft 10in<\/div>\n<p><!-- [et_pb_line_break_holder] -->                            <\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"moyen\"><!-- [et_pb_line_break_holder] -->                            <input id=\"moyen\" type=\"radio\" name=\"taille\" value=\"moyen\"><!-- [et_pb_line_break_holder] -->                            <span class=\"controlind\"><\/span><!-- [et_pb_line_break_holder] -->                            <\/p>\n<div class=\"sizebox\"><!-- [et_pb_line_break_holder] -->                                <\/p>\n<div class=\"sizename\" style=\"font-weight: 600;\"> Medium <\/div>\n<p><!-- [et_pb_line_break_holder] -->                                <\/p>\n<div class=\"sizename\">150 cm \/ 4ft 11in<\/div>\n<p><!-- [et_pb_line_break_holder] -->                            <\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                        <label for=\"petit\"><!-- [et_pb_line_break_holder] -->                            <input id=\"petit\" type=\"radio\" name=\"taille\" value=\"petit\"><!-- [et_pb_line_break_holder] -->                            <span class=\"controlind\"><\/span><!-- [et_pb_line_break_holder] -->                            <\/p>\n<div class=\"sizebox\"><!-- [et_pb_line_break_holder] -->                                <\/p>\n<div class=\"sizename\" style=\"font-weight: 600;\"> Small <\/div>\n<p><!-- [et_pb_line_break_holder] -->                                <\/p>\n<div class=\"sizename\">85 cm \/ 2ft 9in<\/div>\n<p><!-- [et_pb_line_break_holder] -->                            <\/div>\n<p><!-- [et_pb_line_break_holder] -->                        <\/label><!-- [et_pb_line_break_holder] -->                <input type=\"hidden\" name=\"trp-form-language\" value=\"en\"\/><\/form>\n<p><!-- [et_pb_line_break_holder] -->                  <\/div>\n<p><!-- [et_pb_line_break_holder] -->                <\/div>\n<p><!-- [et_pb_line_break_holder] -->            <\/div>\n<p><!-- [et_pb_line_break_holder] -->            <pee id=\"pricedisplay\" class=\"pricedisplayconf\">                <!-- [et_pb_line_break_holder] -->            <\/pee><!-- [et_pb_line_break_holder] -->            <\/p>\n<div><!-- [et_pb_line_break_holder] -->                <button class=\"actionbtn basketbtn\" id=\"addtocart\" onclick=\"addToCart()\">Add to cart<\/button><!-- [et_pb_line_break_holder] -->            <\/div>\n<p><!-- [et_pb_line_break_holder] -->            <\/div>\n<p><!-- [et_pb_line_break_holder] -->        <\/section>\n<p><!-- [et_pb_line_break_holder] -->    <\/div>\n<p>    <!-- [et_pb_line_break_holder] --><\/body><!-- [et_pb_line_break_holder] --><\/html>[\/et_pb_fullwidth_code][\/et_pb_section]<\/p>","protected":false},"excerpt":{"rendered":"","protected":false},"author":11,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"class_list":["post-1396","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v23.4 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Configurateur - Design Your Own Space<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.dyos.fr\/en\/configurateur\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Configurateur - Design Your Own Space\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.dyos.fr\/en\/configurateur\/\" \/>\n<meta property=\"og:site_name\" content=\"Design Your Own Space\" \/>\n<meta property=\"article:modified_time\" content=\"2025-09-24T11:41:29+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.dyos.fr\/configurateur\/\",\"url\":\"https:\/\/www.dyos.fr\/configurateur\/\",\"name\":\"Configurateur - Design Your Own Space\",\"isPartOf\":{\"@id\":\"https:\/\/www.dyos.fr\/#website\"},\"datePublished\":\"2021-03-15T09:58:14+00:00\",\"dateModified\":\"2025-09-24T11:41:29+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.dyos.fr\/configurateur\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.dyos.fr\/configurateur\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.dyos.fr\/configurateur\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Accueil\",\"item\":\"https:\/\/www.dyos.fr\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Configurateur\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.dyos.fr\/#website\",\"url\":\"https:\/\/www.dyos.fr\/\",\"name\":\"Design Your Own Space\",\"description\":\"Vous allez en voir de toutes les couleurs !\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.dyos.fr\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Configurateur - Design Your Own Space","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.dyos.fr\/en\/configurateur\/","og_locale":"en_US","og_type":"article","og_title":"Configurateur - Design Your Own Space","og_url":"https:\/\/www.dyos.fr\/en\/configurateur\/","og_site_name":"Design Your Own Space","article_modified_time":"2025-09-24T11:41:29+00:00","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.dyos.fr\/configurateur\/","url":"https:\/\/www.dyos.fr\/configurateur\/","name":"Configurateur - Design Your Own Space","isPartOf":{"@id":"https:\/\/www.dyos.fr\/#website"},"datePublished":"2021-03-15T09:58:14+00:00","dateModified":"2025-09-24T11:41:29+00:00","breadcrumb":{"@id":"https:\/\/www.dyos.fr\/configurateur\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.dyos.fr\/configurateur\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.dyos.fr\/configurateur\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Accueil","item":"https:\/\/www.dyos.fr\/"},{"@type":"ListItem","position":2,"name":"Configurateur"}]},{"@type":"WebSite","@id":"https:\/\/www.dyos.fr\/#website","url":"https:\/\/www.dyos.fr\/","name":"Design Your Own Space","description":"Vous allez en voir de toutes les couleurs !","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.dyos.fr\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/www.dyos.fr\/en\/wp-json\/wp\/v2\/pages\/1396"}],"collection":[{"href":"https:\/\/www.dyos.fr\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.dyos.fr\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.dyos.fr\/en\/wp-json\/wp\/v2\/users\/11"}],"replies":[{"embeddable":true,"href":"https:\/\/www.dyos.fr\/en\/wp-json\/wp\/v2\/comments?post=1396"}],"version-history":[{"count":25,"href":"https:\/\/www.dyos.fr\/en\/wp-json\/wp\/v2\/pages\/1396\/revisions"}],"predecessor-version":[{"id":3255,"href":"https:\/\/www.dyos.fr\/en\/wp-json\/wp\/v2\/pages\/1396\/revisions\/3255"}],"wp:attachment":[{"href":"https:\/\/www.dyos.fr\/en\/wp-json\/wp\/v2\/media?parent=1396"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}