The spawning system for THREE.Object3D() is now operational

Can anyone help me with the spawning issue I'm facing?

Currently, random blocks are falling down the screen one at a time. I want them to spawn every 2 seconds instead of just having one block appear at a time.

If you have any suggestions or solutions, please let me know!

You can check out my Codepen here: http://codepen.io/anon/pen/Qwpqex

var callSpawn = setInterval(function(){
    if (RandomBlock.position.x < paddle.position.x*2.5) {
        spawning();
        newBlock = false;
    }
},50);

function spawning() 
{
    shapes = [LeftBlock, RightBlock, middleRightBlock, middleLeftBlock, middleBlock];
    var shape = shapes[Math.floor(Math.random()*shapes.length)];
    RandomBlock = new THREE.Object3D();
    RandomBlock.add(shape);
    scene.add(RandomBlock);
    hit = false; 
}

Answer №1

To create a block spawn every 2 seconds, simply adjust the function within your setInterval.
For example:

var callSpawn = setInterval(function(){
     spawning();
    }
},2000);

Next step is to store these blocks in an array instead of the RandomBlock variable. Then, modify all other code that interacts with the RandomBlock variable to iterate through this new array.

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

Run Javascript code if a specific CSS class is present on an element

Whenever a user enters an incorrect value into a textbox on my page, an error message is displayed within a div with the class 'validation-errors'. I'm looking for a solution to trigger a javascript function (which adds a CSS property to a ...

Guide for making an accordion with a close button that is specific to multiple dynamic IDs

I am looking to create an accordion feature. The idea is that when the user clicks on "Show," the text "Show" should be hidden, and the content along with a "Close" button should be displayed. Then, when the user clicks on "Close," the content and "Close" ...

How can I retrieve properties from a superclass in Typescript/Phaser?

Within my parent class, I have inherited from Phaser.GameObjects.Container. This parent class contains a property called InformationPanel which is of a custom class. The container also has multiple children of type Container. I am attempting to access the ...

Conceal all elements until a search query is entered using the search bar

I want to create a search bar that hides all elements until the user actually searches for them, you can check out my JSfiddle for reference: `JSfiddle Link <div id="search"> <form> <input type="text" name="search" id="m ...

Storing a collection of objects in session storage

I've been struggling to save an array containing the items in my online shopping cart. Even though both the object and the array are being filled correctly, when I check the sessionStorage, it shows an array with an empty object. I've spent a lot ...

Tips for Resolving the Problem with React Hook Closures

import React, { useState } from "react"; import ReactDOM from "react-dom"; function App() { const [count, setCount] = useState(0); function handleAlertClick() { return (setTimeout(() => { alert("You clicked on: & ...

The resizing function on the droppable element is malfunctioning on Mozilla browsers

I've been working on making one div both droppable and resizable. Surprisingly, everything is functioning perfectly in Chrome but not in Firefox. If you'd like to see the issue for yourself, here is my jsFiddle demo that you can open in Firefox: ...

Detecting when an object exits the proximity of another object in ThreeJS

In my ThreeJS project, I have planes (Object3D) flying inside a sphere (Mesh). My goal is to detect when a plane collides with the border of the sphere so that I can remove it and respawn it in a different location within the sphere. I am wondering how I ...

Tips on incorporating variable tension feature into D3 hierarchical edge bundling

I found a d3 sample on hierarchical edge bundling that I am experimenting with - My main focus is how to add tension functionality to the example provided at the following link (code can be found here): While I have reviewed the code in the first link, I ...

Utilizing multiple div IDs within the same script functionality

I have multiple dropdown menus on a webpage, and whenever an onchange event happens with any of these menus, I want to utilize the same block of code rather than creating individual scripts for each menu's id. This approach is preferred as the page ma ...

Efficiently managing AJAX requests in PHP

One aspect of my work involves a substantial amount of UI coding that requires sending AJAX requests to the backend PHP. I've been managing this by using: if(isset($_REQUEST["UniquePostName"])){ /* Do Something*/ } if(isset($_REQUEST["AnotherUniqueP ...

Changing the background color of a page to match the background color of a button in React, which can be updated at any time

I have a special button called ArbitraryBtn that, when clicked, changes the page's background color to random colors: import React from 'react'; export const changeToArbitraryColor = () => (document.body.style.backgroundColor = ...

Using Firefox to cache Ajax calls after navigating back in the browsing history

Currently, I am utilizing an ajax call to invoke a php script that waits for 40 seconds using sleep and then generates the output RELOAD. Subsequently, in JavaScript, the generated output is validated to be RELOAD, following which the call commences again. ...

Next.js encountered an issue with the element type, as it expected either a string for built-in components or a class/function for composite components, but received undefined instead

Recently, while working with next js, I encountered an issue when trying to import a rich text editor into my project. Specifically, when attempting to integrate react-draft-wysiwyg, an error message was displayed: Error: Element type is invalid... (full e ...

How to switch the active tab using redirection

I am currently facing an issue with my code. The specific problem I am encountering involves setting an active tab after redirecting a user to the page "http://localhost/account#tab-verification". Below is a snippet of the code I am working with: <ul ...

Error message displayed for invalid date format in Material UI (dateTime picker) after form submission

I recently integrated the Material Ui DateTime picker into my form. However, upon submitting the form, I encountered the following error: Invalid Date Format Image In my React app, I am utilizing JSON Server to store data. Displayed below is the outpu ...

Guide on resetting the scrollHeight values of DOM elements obtained using ClientFunction

I am currently using TestCafe to run tests in two separate fixtures and classes for different app pages. I have noticed that when I use the "ClientFunction" to access the "window.document" object in these tests, the values can vary depending on the executi ...

I am encountering an error with addToCart, as I am unable to read properties of undefined when trying to use the 'push' function

import { createSlice } from '@reduxjs/toolkit'; const cartReducer = createSlice({ name: 'cart', initialState: { items: [], }, reducers: { addToCart: (state, action) => { state.items.push(action.payl ...

Incorporating EJS Template Body Parameters into AWS Lambda's Handler.js Using Serverless.yml

I have a scenario where I am trying to embed an EJS template named 'ui.ejs' into my handler.js file. The goal is to extract URL query parameters, then pass them to a function called 'ui.js' to retrieve data, which will then be displayed ...

jQuery enables the creation of fresh form fields

Currently, I am working on a form that initially consists of 2 text input fields. The typical use case involves the user entering a number in one field and their name in the other. Following this, the page updates itself without reloading. However, there a ...