MagicMirror Forum
    • Recent
    • Tags
    • Unsolved
    • Solved
    • MagicMirror² Repository
    • Documentation
    • 3rd-Party-Modules
    • Donate
    • Discord
    • Register
    • Login
    A New Chapter for MagicMirror: The Community Takes the Lead
    Read the statement by Michael Teeuw here.

    [MMM-Rainbow] Animated text color transition

    Scheduled Pinned Locked Moved Entertainment
    34 Posts 8 Posters 18.0k Views 8 Watching
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • S Offline
      Seann Module Developer @Mykle1
      last edited by

      @mykle1 Thanks, I didn’t actually expect any response to this. I have started experimenting with other things though, so expect to see a few more posts from me. :grinning_face:

      Mykle1M 1 Reply Last reply Reply Quote 0
      • Mykle1M Offline
        Mykle1 Project Sponsor Module Developer @Seann
        last edited by

        @seann

        The more, the merrier. When I started this I never expected anyone to even look at my work. You never know what others might find interesting. My motto: Have fun!

        Create a working config
        How to add modules

        1 Reply Last reply Reply Quote 1
        • G Offline
          ganget
          last edited by

          I really like the idea of this module, I’m searching for the possibility to make only my clock have this effect and maybe a gradient kind of color shift. Can you help me with this idea?

          S cowboysdudeC 2 Replies Last reply Reply Quote 0
          • S Offline
            Seann Module Developer @ganget
            last edited by

            @ganget Sure man, seems simple enough. You could always customize the clock module, or recreate your own and just add a class name to the clock, then alter MMM-Rainbow.js to only change the css for that module. I cheated when creating this module by using jQuery so it’s really simple to mess with. But if you do need any help, feel free to give me a message.

            G 1 Reply Last reply Reply Quote 1
            • BKeyportB Offline
              BKeyport Module Developer
              last edited by

              Love the concept, actually. Would love to see it limited to the user’s choice of modules, however.

              The "E" in "Javascript" stands for "Easy"

              Mykle1M 1 Reply Last reply Reply Quote 0
              • Mykle1M Offline
                Mykle1 Project Sponsor Module Developer @BKeyport
                last edited by

                MMM-NOAA3 has been doing this for some time now, as an option

                Create a working config
                How to add modules

                BKeyportB 1 Reply Last reply Reply Quote 1
                • BKeyportB Offline
                  BKeyport Module Developer @Mykle1
                  last edited by

                  @mykle1 doing what? I was referring to the original rainbow color. Would be cool to apply it to modules of choice.

                  The "E" in "Javascript" stands for "Easy"

                  S 1 Reply Last reply Reply Quote 0
                  • Mykle1M Offline
                    Mykle1 Project Sponsor Module Developer
                    last edited by

                    @bkeyport said in [MMM-Rainbow] Animated text color transition:

                    doing what? I was referring to the original rainbow color.

                    Lets see. The topic states “[MMM-Rainbow] Animated text color transition” so I guess I was talking about that. Only noticed you because you mentioned me directly. I think @seann has done a fantastic job here. Joined the forum 8 days ago and already he’s contributing and offering his
                    help to others. He and I are going get along just fine. :-)

                    Create a working config
                    How to add modules

                    1 Reply Last reply Reply Quote 0
                    • BKeyportB Offline
                      BKeyport Module Developer
                      last edited by

                      So, you’re saying the NOAA weather app does rainbow colors for other modules?

                      … Okay.

                      The "E" in "Javascript" stands for "Easy"

                      1 Reply Last reply Reply Quote 0
                      • S Offline
                        Seann Module Developer @BKeyport
                        last edited by

                        @bkeyport Also, this is easily done. I’ll work on this for you when I have some more free time. The only issue with doing it to the clock is; the current clock uses “updateDom” to set the time each second, which from what I have seen basically re creates the elements. Meaning the transitions start from when the element is created so it’s not in time with the other transitions. So it would be easier to create your own clock module which just replaces the innerHTML of each element instead of re creating them. I have been making my own clock which will display down to minutes instead of seconds as i’m sure this would cause less strain on my terrible Pi 3 a+.

                        justjim1220J 1 Reply Last reply Reply Quote 0
                        • 1
                        • 2
                        • 3
                        • 4
                        • 1 / 4
                        • First post
                          Last post
                        Enjoying MagicMirror? Please consider a donation!
                        MagicMirror created by Michael Teeuw.
                        Forum managed by Sam, technical setup by Karsten.
                        This forum is using NodeBB as its core | Contributors
                        Contact | Privacy Policy