Navigation

    MagicMirror Forum

    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unsolved
    • Solved
    • MagicMirror² Repository
    • Documentation
    • Donate
    • Discord

    Help with creating a table

    Development
    4
    22
    173
    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
      Schmaniel last edited by

      Hey!

      I started to work on a FACEIT module that shows up a few informations about a player.

      The API thing is done, now I need to create a table to visualize the output nicely.

      At first I created it in html/css. It should look something like this: 88aac78e-3dff-46af-9eff-8196ee11157b-grafik.png

      I started now with this code: https://pastebin.com/jK2jGmjA (only for the thead), but I think it’s too complicated.
      Do you have any ideas, how I can improve it?

      1 Reply Last reply Reply Quote 0
      • J
        Jalibu Module Developer last edited by Jalibu

        @Schmaniel said in Help with creating a table:

        https://pastebin.com/jK2jGmjA

        You could either use the nunjucks template engine, which is baked in the magic mirror core or you could use javascript template strings:

        let markup = `
        <table>
          <tr>
            <td>Matches</td>
            <td>${numMatches}</td>
          </tr>
        </table>
        `
        wrapper.innerHTML = markup
        
        1 Reply Last reply Reply Quote 0
        • S
          Schmaniel last edited by

          uuh, that worked pretty well, thank you!

          Now I’m stuck with the size of the module…

          0a033cb9-b01a-4428-aaa4-6d1462066cd6-grafik.png

          S 1 Reply Last reply Reply Quote 0
          • S
            sdetweil @Schmaniel last edited by sdetweil

            @Schmaniel welcome to the fun. 900,000 details to consider. size color, font … css

            https://forum.magicmirror.builders/topic/6808/css-101-getting-started-with-css-and-understanding-how-css-works?_=1611671889049

            S 1 Reply Last reply Reply Quote 2
            • S
              Schmaniel @sdetweil last edited by

              @sdetweil said in Help with creating a table:

              welcome to the fun.

              you misspelt nightmare…
              Thanks for your help!

              S 1 Reply Last reply Reply Quote 1
              • S
                sdetweil @Schmaniel last edited by

                @Schmaniel it gives u an appreciation for the art of good user experience web pages

                1 Reply Last reply Reply Quote 0
                • S
                  Schmaniel last edited by

                  Everytime my module do an API request to refresh the data, the table is disappearing for a second or two, this shouldn’t be normal, right?

                  S 1 Reply Last reply Reply Quote 0
                  • S
                    sdetweil @Schmaniel last edited by sdetweil

                    @Schmaniel u get new data, then say, this.updateDom(how-fast)

                    then mm calls your getDom() routine to get the new content to display

                    so, what is the number u pass to updateDom()

                    0 means immediately
                    2000 means transition new content in 2 seconds

                    S 1 Reply Last reply Reply Quote 0
                    • S
                      Schmaniel @sdetweil last edited by

                      @sdetweil thats the code I got:

                          start: function() {
                              var self = this;
                              setInterval(function() {
                                  self.updateDom(1000);
                              }, 60000);
                          },
                      

                      So as I understand now it updates every minute (60000) and it needs 1 second (1000) to update?
                      Should I change the 1000 to 0, so it updates immediately?

                      S 1 Reply Last reply Reply Quote 0
                      • S
                        sdetweil @Schmaniel last edited by

                        @Schmaniel yes, 0.

                        doesnt NEED 1 second. should TAKE 1 second

                        so.u slowed it down

                        S 1 Reply Last reply Reply Quote 0
                        • 1
                        • 2
                        • 3
                        • 1 / 3
                        • First post
                          Last post
                        Enjoying MagicMirror? Please consider a donation!
                        MagicMirror created by Michael Teeuw.
                        Forum managed by Paul-Vincent Roll and Rodrigo Ramírez Norambuena.
                        This forum is using NodeBB as its core | Contributors
                        Contact | Privacy Policy