Modifying the embed to shift colors over a specified duration in discord.js

    case 'test':
      let time = "10s"
      const testEmbed = new Discord.RichEmbed()
        .setTitle("Testing")
        .setColor('#000000')

      message.channel.send(testEmbed);
      setTimeout(function(){
        testEmbed.setColor('#5e4242')
      }, ms(time));

      break;

Trying to change the color of the embed after 10 seconds in this test command named 'test.' After numerous attempts and searching online, I came across this solution. However, it seems to have no effect at all. I opted for RichEmbed as using messagemebed resulted in a client error.

javascriptdiscorddiscord.jsembed

Answer №1

When changing the color after sending a message, you are modifying the object itself but not altering the original message. To edit the message content along with its color change, make sure to update both properties accordingly.

    let timeLimit = "10s"
      const exampleEmbed = new Discord.RichEmbed()
      .setTitle("Example")
      .setColor('#000000');

    var messageToSend = message.channel.send(exampleEmbed).then(
      setTimeout(function(){
         exampleEmbed.setColor('#5e4242');
         messageToSend.edit(exampleEmbed); // Edit the message using the same object with a different color
      }, ms(timeLimit));
)

      break;

Answer №2

To modify the message you send, you must first store it in a variable.

  let time = "10s"
  const example = new Discord.RichEmbed()
  .setTitle("example")
  .setColor('#000000')

  const response = await message.channel.send(example);
  setTimeout(function(){
     example.setColor('#5e4242');
    response.edit(example);
  }, ms(time));

It's important to remember that await can only be used in an asynchronous function.

Answer №3

Check out the V12 edition

    let newEmbed = new Discord.MessageEmbed()
    .setColor('#ffffff')
    .setTitle('I am an embed that changes colors')

    let messageSent = await message.channel.send(newEmbed)
setTimeout(() => {
     newEmbed.setColor('#5e4242');
     messageSent.edit(newEmbed);
  }, /*Delay*/);

This script generates a fresh embed, establishes a let variable to send the message (similar to tagging it), then adjusts the color of the embed and updates the previous message after a delay.

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

Comparing AJAX to a source script request

As I was exploring the Google API today, I came across their sample code where they simply request a URL using: <script src="src="https://www.googleapis.com/customsearch/v1?key=AIzaSyCVAXiUzRYsML1Pv6RwSG1.."></script> Before seeing this, I ha ...

javascriptjqueryajax

Creating a dropdown menu in Bootstrap 4 using JSON information

I am trying to create a dynamic drop-down menu using an input field with a drop-down button inside a form. Currently, I am attempting to populate the drop-down menu with static JSON data. However, I am encountering issues with getting it to function proper ...

javascriptjqueryhtml

Tips on how to ensure that an onClick JS function only runs when radio buttons are selected

I have implemented the formslider library for a form on my website. In the demo, the slide transitions to the next set of questions based on a click event triggered by radio buttons (answers). However, when I attempted to include checkboxes for users to s ...

javascriptjqueryhtml

jquery button returned to its default state

Jquery Form Field Generator |S.No|Name|Button1|Button2| When the first button is clicked, the S.No label and name label should become editable like a textbox. It works perfectly, but if I click the second button, the field becomes editable as expected, ...

javascriptjquery

A step-by-step guide on importing data from an external nested JSON file and displaying its contents

CODE Having trouble displaying the results from a JSON object on my view page. The screen appears empty, but I can see the data in the console. When using ng repeat, it shows an error "Duplicate Key in Repeater." The main requirement is to print the titl ...

javascriptangularjsjsonangularjs-ng-repeat

An error was encountered: SyntaxError - An unexpected token '!' was found

I am having trouble creating a react cluster map. I encountered a SyntaxError, and I'm not sure what went wrong. Initially, my map was working fine, but after using the use-supercluster npm package, it started showing an Uncaught SyntaxError: Unexpect ...

javascriptreactjsmarkerclusterer

Guide on setting up Tailwind CSS and material-tailwind concurrently within the tailwind.config.js configuration file

I am looking to integrate both Tailwind and Material Tailwind in a Next.js 14 project. Below is my customized tailwind.config.ts file (already configured with Tailwind CSS): import type { Config } from 'tailwindcss' const config: Config = { ...

javascriptnext.jsmaterial-uitailwind-cssnext.js13

The pause button will still function, even if the scrolling feature is enabled

I've successfully implemented a feature that pauses and plays the video on scroll when it reaches a certain pixel height. However, I'm facing an issue where the code automatically plays the video whenever the scroll position is more than 13500px ...

javascriptjqueryhtmlcss

What is the best way to interact with Redis without using any external modules?

I am curious about the communication process between the node redis wrapper and the RESP (REdis Serialization Protocol) database. Here is a simple example: const redis = function(uri) { this.client = '' // How do we establish a connection wit ...

javascriptnode.jsnpmredis

Using Node.js to access the public stream of app.net for streaming purposes

Exploring the world of streaming and HTTP long living connections for the first time. This is where I'm at: const accessToken = require('./config.js').accessToken; const https = require('https'); const req = https.request({ ...

javascriptnode.jsstreaminghttp-streaming

The nearby diversion inexplicably triggers a phantom GET request

My goal is to build a website with specific functionality: If a user tries to access the /home page without authentication, they should be redirected to the /login page. After successfully logging in on the /login page, the user should receive a session c ...

javascriptnode.jsexpresshttpfetch-api

Using Backbone.js to dynamically filter a collection when a user clicks a specific element

update added more details about my progress so far. I'm currently in the process of developing an app that showcases the gists of members belonging to a specific organization, drawing inspiration from bl.ocks.org. My goal is to enable users to click ...

javascriptjqueryeventsbackbone.jscoffeescript

Determine whether the element is visible in at least half of the viewport

I am working on a project that involves 4 cards with images. I want the image to animate in from the left when it comes into viewport. I have finalized the CSS for this effect, but the JavaScript code always returns false even when the element is visible o ...

javascripthtmlcss

Enhance the size of dynamically generated svg elements by scrolling the mouse wheel in and out

In my ASP.NET application, I have a view page where SVG elements are dynamically generated. Now, I want to implement zoom functionality for all the created SVG elements. Zooming in should occur when scrolling up and zooming out when scrolling down. <sv ...

javascriptjqueryasp.netasp.net-mvc-4svg

What causes my Excel file to become corrupted when inputting new data?

My intention with this code is to insert "ABC" into cell B3 of an existing Excel document. However, when the file is written, its size decreases significantly and Excel is unable to open it. const excel = require("exceljs"); const template = "./myexcel.xl ...

javascriptnode.jsexceljs

Requiring addresses for Google Maps in order to display directions

To display the directions between two addresses based on the chosen transportation mode, I need to pass the addresses to the code in page 2. After the user selects two cities from a Dropdown box on page 1, they will be sent to the code to show their locati ...

javascripthtmlgoogle-mapsgoogle-maps-api-3

Implementing adaptive window.scrollY listener in React to account for different screen sizes

I am currently using a useEffect hook to create a fade-in effect for text based on scroll position. While this works perfectly on my 27-inch MAC screen, I am facing challenges when viewing it on a smaller screen. I am unsure how to adjust the useEffect to ...

javascriptreactjsmaterial-ui

collaborating with numerous JavaScripts

I am currently working on a project that involves several JavaScript functionalities such as an image viewer, carousel, and toggles. Now, I need to implement a pop-up form, but when I add the JavaScript for the pop-up, the entire page stops working. I wou ...

javascriptjquery

There seems to be an issue with displaying the meta information in a Nuxtjs project using this.$

I am facing an issue with meta information in a Vue page. When I try to access "this.$route.meta", it does not display any meta information. However, when I inspect the Vue page element, I can see that there is indeed meta information present. How can I ...

javascriptvue.jsnuxt.js

What is the best way to ensure type safety in a Promise using Typescript?

It seems that Promises in Typescript can be type-unsafe. This simple example demonstrates that the resolve function accepts undefined, while Promise.then infers the argument to be non-undefined: function f() { return new Promise<number>((resolve) ...

javascripttypescriptes6-promise