Code Monkey home page Code Monkey logo

jid-ui's Introduction

CI Maintainability Rating Security Rating Coverage Quality Gate Status

JID UI

Web-based frontend for adding JID codes and track statistics.

jid-ui's People

Contributors

dependabot[bot] avatar frankbille avatar michaelkringelhede avatar

Stargazers

 avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

jid-ui's Issues

Show changes in last 15 mins in stats

jid-server now returns position and changes in the last 15 mins: https://github.com/jotajoti/jid-server/wiki

Stats page should show changes in the last 15 mins:
โ†‘ Anker: Countries 5 (+1), Jids: 37 (+3)
โ†“ Hilmar: Countries 4, Jids: 25 (+1)

When players change position it should display changes like in a Mario Kart game: https://i.redd.it/iz84p67pg7631.jpg

It would be cool if it could should multiple up/down arrows depending on the number of positions moved up/down like this one: https://static.thenounproject.com/png/2077993-200.png

Totals and countries can show similar changes for the last 15 mins.

Show large banner when a new code is added

Show a large banner on the dashboard for 30 seconds every time another user adds a JID code.
When multiple events occur the should be queued and display in sequence (might need to lower the 30 seconds if the queue gets too long)

Could look something like this:
image

Similar banners could be shown (in sequence prioritized in this order):
1a) "New country: ! Well done !"
1b) " added a code from "
2) has taken the th place
3) is now number

It should only show either 1a or 1b.

Each banner type (1a, 1b, 2 ,3) should have its own background color so that it is easy to spot which kind of banner is shown.

Cool feature would be to play a sound when a banner is shown:
1a: A simple "ding"?
1b: A double "ding-ding"?
2: A "dong"?
3: A double "dong-dong"?

Show standings next to map on wide screens

Mobile and narrow screens should display:
Map
Users
Countries

Wide screens should display users besides the map:
Map | Users
Countries

On a wide screen with little height the map currently fills the whole screen

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.