Coder Social home page Coder Social logo

bryanyli / frcdashboard Goto Github PK

View Code? Open in Web Editor NEW

This project forked from frcdashboard/frcdashboard

0.0 0.0 0.0 14.08 MB

:video_game: Extensible, JavaScript-based driving dashboard framework for the FIRST Robotics Competition.

Home Page: http://frcdashboard.github.io

License: MIT License

CSS 11.03% HTML 10.50% JavaScript 78.47%

frcdashboard's Introduction

FRC Dashboard

FRC Dashboard is a fully customizable dashboard for FIRST Robotics Competition (FRC) which is based on web languages (JavaScript/CSS/HTML). It's completely legal for competition, and can be used to give your whole drive team significantly richer control of your robot.

The dashboard's code is designed to be 100% accessible and expandable. To this aim, the code is rigorously commented and a set of training exercises have been prepared to orient new users. In addition, the base system comes with several functioning example widgets and features, and we've build several helpful addons to speed up the development of your team's dashboard.

Contributions are VERY welcome! Please feel free to open a pull request or issue!

Screenshot slideshow

Click to view some example implementations of FRC Dashboard

1132's 2017 Dashboard
6325's 2017 Dashboard
1418's 2017 Dashboard
1418's 2016 Dashboard

Setup

You'll need nodejs & npm.

Before running your dashboard, you'll need to install the node dependencies by cding into the dashboard directory and running npm install.

Configuration

  • In ui.js, there are a bunch of key handler functions which controls the updating of control elements in the dashboard. Example NetworkTables key names are used, but you'll need to change them to match those used in your team's robot code for them to affect anything on your robot.

Camera feed

FRC Dashboard supports display of MJPG camera streams. Once you've created a stream (using WPILib's CameraServer class, mjpg-streamer (deprecated), or another method), update style.css to use the IP of your live camera feed. Usually this is something like roborio-XXXX-frc.local:5800/?action=stream, where XXXX is your team's number. The port may vary.

Building

Some users may wish to compile their dashboard applications into standalone .exe or .app files.

Assuming the necessary setup steps have been performed, users may run npm run package-[platform], where [platform] is linux, mac, or win according to the target platform, to pack the entire application into a single executable.

Running

Connect to your robot's network if you haven't already. (If you're just testing the dashboard and don't currently need to use it with your robot, you can skip this step.)

While in the dashboard directory, run:

npm start

This will open the dashboard application. Note that you can refresh the page and client-side updates will take effect; reopening the whole application is usually unnecessary.

It is recommended that while using the dashboard on your driver station, you close the top panel of the FRC DriverStation to make room for the dashboard.

Authors

  • Erik Boesen is the primary developer of FRC Dashboard.
  • Team 1418 used earlier versions of this code in 2015 and 2016.
  • Leon Tan led the original 1418 UI team, coded pynetworktables2js, and developed a browser-based UI which was years later reworked to create FRC Dashboard.
  • Dustin Spicuzza leads the RobotPy project, and mentored Team 1418 through much of FRC Dashboard's genesis.
  • Tomas Rakusan Developed Node based NetworkTables client and its interface in this project.

Licensing

This software is available under the MIT License.

frcdashboard's People

Contributors

calebeby avatar cardcaptorrlh85 avatar cjdenio avatar erikboesen avatar ianzullo avatar rakusan2 avatar stonemoney avatar

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.