Having trouble getting DeviceOrientationControls to function properly

For the past week, I've been attempting to use my smartphone's orientation controls to manipulate my three.js scene. Although I lost the tutorial that originally guided me, I managed to find the example I saved from it. However, despite studying how the controls were implemented in the example, I'm unable to reproduce the same effect. Perhaps someone else can identify the issue...

Below is an excerpt from my script.js file (where I load Three.js via CDN in my index.html):

import {sets} from './data/';
import threeOrbitControls from 'three-orbit-controls';
import ColladaLoader from 'three-collada-loader';
import threeStereoEffect from 'three-stereo-effect';

const DeviceOrientationControls = require(`./modules/util/DeviceOrientationControls`);
import {BufferLoader} from './modules/sound';
import {SpawnObject} from './modules/render';

// Remaining script contents...

Answer №1

It's still a mystery to me how I managed to resolve the issue, but rather than utilizing the function for defining DeviceOrientationControls, I opted to employ a regex to determine if I'm accessing the site via a browser or mobile device.

Surprisingly, that method proved effective in solving the problem.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

How can I display a PHP variable in JavaScript?

I am having trouble displaying a PHP variable in Javascript; Below is the code I am using: <script type="text/javascript> $(document).ready(function (){ var n=<?php echo json_encode($count)?>; for(var i=0;i<n;i++){ var div ...

When working with TypeScript, how do you determine the appropriate usage between "let" and "const"?

For TypeScript, under what circumstances would you choose to use "let" versus "const"? ...

Setting up StrongLoop LoopBack MongoDB datasource for successful deployment on Heroku

Currently, I am utilizing LoopBack version 1.6 and have a local mongoDB server operational for development purposes with the following datasource configuration: "mongodb": { "defaultForType": "mongodb", "connector": "loopback-connector-mongodb", ...

Having trouble deleting multiple rows with ng-repeat in datatables

Having followed the instructions in this post, I quickly integrated it with jquery datatables. However, the functionality is not as expected. When attempting to delete rows, they do not get deleted. Furthermore, if I navigate to the next page and return, ...

Building Dynamic Columns within a react.js Environment

Can anyone help me with creating a dynamic column in react.js? I've already managed to do it with static columns, but now I want to make them dynamic. Take a look at my code below and please provide suggestions. import React from 'react'; i ...

What is the best way to include a MongoDB match argument when it is received from the frontend, and to exclude it if it is not provided?

I'm currently working on creating an aggregation in MongoDB using NodeJS. The goal is to add an argument to the MongoDB match function if it exists when the resolver function is called. However, I'm encountering an issue where if no addition is m ...

Move tables by dragging and dropping them into place

Currently, I am on the lookout for a drag and drop plugin that works with jQuery, Angular, or JavaScript to help me create dynamic tables. Specifically, I need a plugin that allows me to add new tables through drag and drop functionality. While I have com ...

Confusion with Javascript callbacks - seeking clarity

I am having difficulty grasping the concept of callback functions. I know that they are functions passed as parameters to other functions. My assumption was that when a function is passed as a parameter, it would be recognized as a callback function and ex ...

What's the most effective method for transferring data to different components?

How can I efficiently pass a user info object to all low-level components, even if they are grandchildren? Would using @input work or is there another method to achieve this? Here is the code for my root component: constructor(private _state: GlobalSta ...

Leveraging JavaScript to extract data from a JSON file upon clicking a button

Currently, I am working on a problem where the user enters values into a search box, clicks the search button, and then with the onClick event, the search terms are compared to values in a JSON file. I do not have knowledge of jQuery, so if there is a solu ...

What is the reason for the hotel's Object _id not being saved in MongoDB?

Can you assist with troubleshooting this issue? This is the HotelRoom Module: const mongoose = require('mongoose'); const Schema = mongoose.Schema; const HotelRoomSchema = new Schema({ name : { type : String, require : true ...

Why is the Twitch api map function returning nothing, while the console log is showing output?

Presently, my Nextjs page is making multiple Twitch API calls successfully and displaying the correct data. However, one of the mapping functions is failing to render anything on the page, even though the console log shows the data. Although I am relativel ...

The manner in which sessionStorage or localStorage is shared between different domains

I am looking to persist data across different domains using sessionStorage or localStorage. How can I achieve this? The data needs to be shared between a Vue project and a React project. English is not my strong suit, so I hope you are able to understand ...

Issue with the react-redux Provider

Whenever I run my basic program Index.js function test(state = []) { return state } const store = createStore(test); render( <Provider store = { store } > <App / > < /Provider > , document.getElementById('root') ...

Methods for transferring data from an AJAX function

I have a database containing various links that I would like to retrieve and store within an array. I attempted to achieve this using the following code: var amz = new Array(); function CreateAmazonArray() { $.ajax({ url: "php/amazon_affilia ...

Is there a way to determine if a line has been automatically wrapped within a textarea element?

Is it possible to detect when text is wrapped onto the next line in a textarea after becoming wider than the area? ...

Synchronous async routes in Node Express

My express server requires fetching data from multiple external sources for each request, with the logic separated into various routers (some of which are not under my control). These routers operate independently, eliminating the need for one to wait on ...

What is the name of the file that contains a class?

I am curious about identifying the file that called a specific class: database.ts class Database { constructor() { console.log(`I want to know who called this class`); } } server.ts import Database from 'database.ts'; new Databa ...

How to execute a JavaScript function within PHP code

Hey there, seeking some assistance. On my main page index.php, I have a simple js function named function1() that opens test.php as a pop-up window when clicked. The content in this pop-up window comes from another page called p1.php. Now, I need to set it ...

What are your thoughts on the size of a React component being 500 lines long?

Currently, I am in the process of constructing a Table component that includes filters and requires an extensive amount of logic. Additionally, I have incorporated material UI which tends to add multiple lines of code. Despite these elements, I feel that ...