GithubHelp home page GithubHelp logo

pilotguy0920 / hamdashboard Goto Github PK

View Code? Open in Web Editor NEW

This project forked from va3hdl/hamdashboard

0.0 0.0 0.0 7.63 MB

Customizable Dashboard for Ham Radio

Home Page: https://youtu.be/sIdqMQTGNSc

License: MIT License

JavaScript 39.33% HTML 60.67%

hamdashboard's Introduction

YouTube - Presentation video

Instructions:

  1. Just download the files from the Github repository (hamdash.html, config.js, and wheelzoom.js) and keep them together on the same folder.
  2. Open hamdash.html with any browser of your preference and you done.
  3. With any text editor (like Notepad) you can change the source images (can be more than one per box) or the menu options from the config.js file.

YouTube - Configuration instructions contributed by Jason KM4ACK

Quick Help:

  • Double click on an image to expand to full screen.
  • Double click again to close full screen view.
  • Right click on an image to display the next one. (In the latest version is possible to add multiple images per box.)
  • The content refreshes automatically every 5 minutes.

Is that easy!

73 de Pablo, VA3HDL

Fix for Pi-Star iFrame embedding issues:

This error can occur if the server has certain security measures in place, such as the x-frame-options header, which prevents its content from being embedded on other websites using iframes.

  1. Login via ssh to the pi-star then run this command to switch to Read/Write mode:

     rpi-rw
    
  2. In the file /etc/nginx/default.d/security.conf comment the line below with a "#" in front, like this:

     # add_header X-Frame-Options  "SAMEORIGIN";
    
  3. Run this command to switch back to Read Only mode:

     rpi-ro
    
  4. Then reboot the pi-star

More on iFrame embedding:

There is very little that can be done on the client side if the source site does not allow embedding the site inside another page (like the dashboard!) specially if the user can't change the server settings (most cases.)

As a workaround for these issues, I've tested running a local proxy on my computer to strip out the x-frame-options header coming from the source server and it worked well on some cases. But setting up a proxy adds another layer of complexity to the setup.

Updates

2024.05.27 Changelog:

  • Moved the configuration parts of the JavaScript code to its own file "config.js" so it is easy to upgrade after updates to the main code. Suggested by Lou KI5FTY.
  • Improved menu usability

2024.05.25 Changelog:

  • Removed dependencies to local installed fonts. Fonts now are loaded from Google Fonts directly to ensure consistency.
  • Ability to add multiple images per position. Images are rotated automatically every 30 seconds.
  • Autorefresh is now paused automatically when switching to a website (from menu) or when an image is zoomed-in to full screen
  • Moved configuration variables to the top of the script and added extra commentary to ease the initial setup
  • Added menu to the right of the page. Now the left menu has ham radio links and right menu has weather links

Samples

VA3HDL Sample Dashboard

N4NBC Sample Dashboard

KM4ACK Sample Dashboard

Dual menu example:

Dual side Menu Sample Dashboard

hamdashboard's People

Contributors

va3hdl 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.