user choosing options to display working on new frontend

This commit is contained in:
Neythen 2021-08-11 20:58:01 +01:00
parent 768cfa72d0
commit cdf2906ad9
38 changed files with 4233 additions and 148 deletions

View File

@ -1,4 +1,4 @@
symbol,name,base,current,24hr change
BTC,bitcoin,usd,38562,-3.1527074759072398
ETH,ethereum,gbp,1804.79,-5.029820064487153
DOGE,dogecoin,usd,0.198365,-3.4809067470776904
BTC,bitcoin,usd,46362,1.8691205900650751
ETH,ethereum,gbp,2339.29,3.3388729475852204
DOGE,dogecoin,usd,0.278677,9.96397119802603

1 symbol name base current 24hr change
2 BTC bitcoin usd 38562 46362 -3.1527074759072398 1.8691205900650751
3 ETH ethereum gbp 1804.79 2339.29 -5.029820064487153 3.3388729475852204
4 DOGE dogecoin usd 0.198365 0.278677 -3.4809067470776904 9.96397119802603

View File

@ -1 +1 @@
["USD", {"AUD": [1.3535, 1.358], "CAD": [1.2515, 1.2465], "CHF": [0.90324, 0.90535], "EUR": [0.8414, 0.84133], "GBP": [0.71817, 0.71991], "JPY": [109.13, 109.52], "NZD": [1.4264, 1.4337]}]
["USD", {"AUD": [1.3618, 1.362], "CAD": [1.2525, 1.2565], "CHF": [0.9232, 0.92245], "EUR": [0.85339, 0.8531], "GBP": [0.7228, 0.72145], "JPY": [110.67, 110.46], "NZD": [1.4255, 1.4296]}]

View File

@ -1 +1 @@
[{"main_weather": "Clouds", "description": "broken clouds", "temp": 27.33, "min_temp": 26.86, "max_temp": 29.57, "feels_like": 31.44, "humidity": 88, "clouds": 70, "wind_speed": 4.92, "wind_direction": 40, "visibility": 10000, "uv": 0, "rain_chance": 0.82}, {"main_weather": "Clouds", "description": "overcast clouds", "temp": 19.25, "min_temp": 13.89, "max_temp": 20.27, "feels_like": 19.01, "humidity": 68, "clouds": 94, "wind_speed": 4.63, "wind_direction": 130, "visibility": 10000, "uv": 1.06, "rain_chance": 0.56}]
[{"main_weather": "Clouds", "description": "overcast clouds", "temp": 27.3, "min_temp": 27.3, "max_temp": 29.42, "feels_like": 31.86, "humidity": 92, "clouds": 100, "wind_speed": 0.45, "wind_direction": 8, "visibility": 10000, "uv": 0, "rain_chance": 0.65}, {"main_weather": "Clouds", "description": "overcast clouds", "temp": 18.32, "min_temp": 14.58, "max_temp": 23.64, "feels_like": 17.96, "humidity": 67, "clouds": 98, "wind_speed": 4.63, "wind_direction": 210, "visibility": 10000, "uv": 0, "rain_chance": 0}]

View File

@ -1 +1 @@
[[{"main_weather": "Rain", "description": "moderate rain", "min_temp": 26.86, "max_temp": 29.57}, {"main_weather": "Rain", "description": "moderate rain", "min_temp": 26.72, "max_temp": 28.32}, {"main_weather": "Rain", "description": "moderate rain", "min_temp": 26.03, "max_temp": 27.98}, {"main_weather": "Rain", "description": "moderate rain", "min_temp": 27.2, "max_temp": 28.08}, {"main_weather": "Rain", "description": "moderate rain", "min_temp": 27.91, "max_temp": 28.84}, {"main_weather": "Rain", "description": "light rain", "min_temp": 28.18, "max_temp": 29.87}, {"main_weather": "Rain", "description": "light rain", "min_temp": 28.09, "max_temp": 29.25}, {"main_weather": "Rain", "description": "light rain", "min_temp": 28.23, "max_temp": 29.96}], [{"main_weather": "Rain", "description": "light rain", "min_temp": 13.89, "max_temp": 20.27}, {"main_weather": "Rain", "description": "light rain", "min_temp": 13.12, "max_temp": 22.97}, {"main_weather": "Rain", "description": "moderate rain", "min_temp": 13.54, "max_temp": 21.04}, {"main_weather": "Rain", "description": "light rain", "min_temp": 15, "max_temp": 19.8}, {"main_weather": "Rain", "description": "moderate rain", "min_temp": 13.95, "max_temp": 19.15}, {"main_weather": "Rain", "description": "light rain", "min_temp": 13.39, "max_temp": 19.7}, {"main_weather": "Rain", "description": "light rain", "min_temp": 14.31, "max_temp": 22.84}, {"main_weather": "Clouds", "description": "overcast clouds", "min_temp": 15.14, "max_temp": 23.12}]]
[[{"main_weather": "Rain", "description": "light rain", "min_temp": 27.3, "max_temp": 29.42}, {"main_weather": "Rain", "description": "moderate rain", "min_temp": 27.36, "max_temp": 29.08}, {"main_weather": "Rain", "description": "moderate rain", "min_temp": 25.87, "max_temp": 27.79}, {"main_weather": "Rain", "description": "moderate rain", "min_temp": 25.96, "max_temp": 27.5}, {"main_weather": "Rain", "description": "moderate rain", "min_temp": 26.6, "max_temp": 28.27}, {"main_weather": "Rain", "description": "light rain", "min_temp": 27.12, "max_temp": 28.64}, {"main_weather": "Rain", "description": "moderate rain", "min_temp": 26.75, "max_temp": 27.57}, {"main_weather": "Rain", "description": "light rain", "min_temp": 26.33, "max_temp": 27.22}], [{"main_weather": "Clouds", "description": "broken clouds", "min_temp": 14.58, "max_temp": 23.64}, {"main_weather": "Clouds", "description": "overcast clouds", "min_temp": 15.41, "max_temp": 23.1}, {"main_weather": "Clouds", "description": "overcast clouds", "min_temp": 14.49, "max_temp": 21.73}, {"main_weather": "Rain", "description": "light rain", "min_temp": 15.51, "max_temp": 23.53}, {"main_weather": "Rain", "description": "light rain", "min_temp": 16.91, "max_temp": 23.62}, {"main_weather": "Rain", "description": "moderate rain", "min_temp": 14.19, "max_temp": 17.08}, {"main_weather": "Clouds", "description": "scattered clouds", "min_temp": 13.11, "max_temp": 22.04}, {"main_weather": "Rain", "description": "light rain", "min_temp": 15.32, "max_temp": 18.95}]]

1
csv/display_settings.json Executable file
View File

@ -0,0 +1 @@
["Forex", "Crypto", "Custom Messages", "Stocks"]

View File

@ -0,0 +1 @@
{"stocks": "11/08/2021 15:55:17", "crypto": "11/08/2021 15:55:21", "news": "11/08/2021 15:55:23", "weather": "11/08/2021 15:55:22", "forex": "11/08/2021 21:55:27", "sports": "11/08/2021 15:55:24"}

View File

@ -1,21 +1,21 @@
headline,source,date,time
Pentagon on lockdown after gunshots fired near Metro station - Daily Mail,Daily Mail,2021-08-03,16:26:56Z
Andrew Cuomo: New York Governor sexually harassed women^ report finds - BBC News,BBC News,2021-08-03,16:14:54Z
New York Gov. Andrew Cuomo sexually harassed multiple women^ state attorney general report says - CNN,CNN,2021-08-03,16:13:00Z
Vaccinated people are much more protected from COVID-19 than unvaccinated individuals; the benefits of the COVID-19 vaccines outweigh their risks - Health Feedback,Health Feedback,2021-08-03,16:08:36Z
Coronavirus live updates: Quebec reports 175 new cases^ no deaths - Montreal Gazette,Montreal Gazette,2021-08-03,16:06:05Z
Index surges anew ahead of Q2 earnings - Philstar.com,Philippine Star,2021-08-03,16:00:00Z
Matt Damons New Statement Saying He Doesnt “Use Slurs Of Any Kind” After “Retiring The F-Slur” Has Sparked A Huge Debate In Light Of Him Playing Gay Characters In The Past - BuzzFeed News,BuzzFeed News,2021-08-03,15:55:00Z
Pentagon reopens after brief lockdown due to shooting near Metro station - Hindustan Times,Hindustan Times,2021-08-03,15:51:14Z
Massive Balloon the Size of a Soccer Stadium to Launch Telescope to Edge of Space to Study How Stars Form - Good News Network,Good News Network,2021-08-03,15:51:01Z
Todays coronavirus news: Ontario reporting 164 cases Tuesday^ 168 cases Monday; NYC to require vaccination proof for indoor dining^ gyms - Toronto Star,Toronto Star,2021-08-03,15:45:00Z
NBA free agency Day 1 winners and losers: Heat make power moves; Lakers defense takes hit; Knicks go sideways - CBS Sports,CBS Sports,2021-08-03,15:45:00Z
Covid 19 coronavirus: China orders mass testing in Wuhan as outbreak spreads - New Zealand Herald,New Zealand Herald,2021-08-03,15:35:31Z
Celtic sign goalkeeper Joe Hart and midfielder James McCarthy - Sky Sports,Sky Sports,2021-08-03,15:33:55Z
At least 3 injured in workplace shooting at SmileDirectClub in Antioch^ Tennessee - NBC News,NBC News,2021-08-03,15:32:02Z
#UnrestSA: State wants to adds treason charges to lawyer Ike Khumalo's incitement case - News24,News24,2021-08-03,15:27:28Z
Boeing delays key uncrewed test flight of Starliner capsule to space station - The Straits Times,The Straits Times,2021-08-03,15:21:41Z
Florida's Broward County school district reverses its mask mandate after funding threat from the governor - CNN,CNN,2021-08-03,15:21:00Z
U.S. Gov. Cuomo sexually harassed multiple women^ probe finds - CTV News,Ctvnews.ca,2021-08-03,15:18:39Z
COVID-19: UK records another 138 coronavirus deaths - the highest daily total since 17 March - Sky News,Sky.com,2021-08-03,15:17:28Z
Tokyo Olympics: PV Sindhu^ India's Double Olympic Medallist^ Felicitated After Returning From Tokyo | Olympics News - NDTVSports.com,NDTV News,2021-08-03,15:17:00Z
Magnitude 7.3 earthquake jolts Davao Oriental town - CNN Philippines,CNN Philippines,2021-08-11,18:38:58Z
Kathy Hochul vows to change toxic environment as New Yorks next governor live - The Guardian,The Guardian,2021-08-11,18:36:25Z
Chelsea vs Villarreal LIVE: Uefa Super Cup team news^ line-ups and more tonight - The Independent,Independent,2021-08-11,18:36:23Z
Admiral Art McDonald plans to return to his job as chief of defence staff following sexual misconduct probe - CBC.ca,CBC News,2021-08-11,18:30:10Z
Samsung did Pixel owners dirty on trade-in values for the Z Fold3 and Flip3 - Android Police,Android Police,2021-08-11,18:05:00Z
Gavin Williamson should be sacked over exam failures^ says Keir Starmer - The Guardian,The Guardian,2021-08-11,18:03:00Z
C.D.C. Endorses Covid Vaccinations for Pregnant People - The New York Times,New York Times,2021-08-11,18:02:06Z
Global warming begets more warming^ new paleoclimate study finds - Phys.org,Phys.Org,2021-08-11,18:00:05Z
Oregon indoor mask mandate will go into effect Friday - KATU,KATU,2021-08-11,18:00:00Z
ISRO's Chandrayaan-2 instrument detects hydroxyl^ water molecules on the Moon - Deccan Herald,Deccan Herald,2021-08-11,17:53:07Z
Federal judge says Trumps accountants must turn over tax records to House panel - POLITICO,Politico,2021-08-11,17:42:45Z
Hackers Return Nearly Half Of $600 Million Stolen In Biggest Crypto Heist - NDTV Profit,NDTV News,2021-08-11,17:42:08Z
'Jeopardy' will replace Alex Trebek with not one^ but two hosts - CNN,CNN,2021-08-11,17:30:00Z
Razers Fantastic New Wireless Earbuds Put a Light Show in Your Earholes - Gizmodo,Gizmodo.com,2021-08-11,17:30:00Z
Tokyo Olympics 2020: Aussie Olympians face 28 days of quarantine - New Zealand Herald,New Zealand Herald,2021-08-11,17:29:56Z
Instagram says sorry for removing Pedro Almodovar film poster - BBC News,BBC News,2021-08-11,17:27:49Z
'More pepper^ please': New study analyzes role of scent compounds in the coevolution of bats and pepper plants - UW News,UW News,2021-08-11,17:26:08Z
1 man dead^ another injured in Lowertown shooting - CBC.ca,CBC News,2021-08-11,17:23:37Z
Mike Richards to replace Alex Trebek as 'Jeopardy!' host; Mayim Bialik gets role too - CTV News,Ctvnews.ca,2021-08-11,17:23:00Z
Judge rejects acquittal of soldier accused of feeding troops cannabis-laced cupcakes - CBC.ca,CBC News,2021-08-11,17:21:49Z

1 headline source date time
2 Pentagon on lockdown after gunshots fired near Metro station - Daily Mail Magnitude 7.3 earthquake jolts Davao Oriental town - CNN Philippines Daily Mail CNN Philippines 2021-08-03 2021-08-11 16:26:56Z 18:38:58Z
3 Andrew Cuomo: New York Governor sexually harassed women^ report finds - BBC News Kathy Hochul vows to change ‘toxic’ environment as New York’s next governor – live - The Guardian BBC News The Guardian 2021-08-03 2021-08-11 16:14:54Z 18:36:25Z
4 New York Gov. Andrew Cuomo sexually harassed multiple women^ state attorney general report says - CNN Chelsea vs Villarreal LIVE: Uefa Super Cup team news^ line-ups and more tonight - The Independent CNN Independent 2021-08-03 2021-08-11 16:13:00Z 18:36:23Z
5 Vaccinated people are much more protected from COVID-19 than unvaccinated individuals; the benefits of the COVID-19 vaccines outweigh their risks - Health Feedback Admiral Art McDonald plans to return to his job as chief of defence staff following sexual misconduct probe - CBC.ca Health Feedback CBC News 2021-08-03 2021-08-11 16:08:36Z 18:30:10Z
6 Coronavirus live updates: Quebec reports 175 new cases^ no deaths - Montreal Gazette Samsung did Pixel owners dirty on trade-in values for the Z Fold3 and Flip3 - Android Police Montreal Gazette Android Police 2021-08-03 2021-08-11 16:06:05Z 18:05:00Z
7 Index surges anew ahead of Q2 earnings - Philstar.com Gavin Williamson should be sacked over exam failures^ says Keir Starmer - The Guardian Philippine Star The Guardian 2021-08-03 2021-08-11 16:00:00Z 18:03:00Z
8 Matt Damon’s New Statement Saying He Doesn’t “Use Slurs Of Any Kind” After “Retiring The F-Slur” Has Sparked A Huge Debate In Light Of Him Playing Gay Characters In The Past - BuzzFeed News C.D.C. Endorses Covid Vaccinations for Pregnant People - The New York Times BuzzFeed News New York Times 2021-08-03 2021-08-11 15:55:00Z 18:02:06Z
9 Pentagon reopens after brief lockdown due to shooting near Metro station - Hindustan Times Global warming begets more warming^ new paleoclimate study finds - Phys.org Hindustan Times Phys.Org 2021-08-03 2021-08-11 15:51:14Z 18:00:05Z
10 Massive Balloon the Size of a Soccer Stadium to Launch Telescope to Edge of Space to Study How Stars Form - Good News Network Oregon indoor mask mandate will go into effect Friday - KATU Good News Network KATU 2021-08-03 2021-08-11 15:51:01Z 18:00:00Z
11 Today’s coronavirus news: Ontario reporting 164 cases Tuesday^ 168 cases Monday; NYC to require vaccination proof for indoor dining^ gyms - Toronto Star ISRO's Chandrayaan-2 instrument detects hydroxyl^ water molecules on the Moon - Deccan Herald Toronto Star Deccan Herald 2021-08-03 2021-08-11 15:45:00Z 17:53:07Z
12 NBA free agency Day 1 winners and losers: Heat make power moves; Lakers defense takes hit; Knicks go sideways - CBS Sports Federal judge says Trump’s accountants must turn over tax records to House panel - POLITICO CBS Sports Politico 2021-08-03 2021-08-11 15:45:00Z 17:42:45Z
13 Covid 19 coronavirus: China orders mass testing in Wuhan as outbreak spreads - New Zealand Herald Hackers Return Nearly Half Of $600 Million Stolen In Biggest Crypto Heist - NDTV Profit New Zealand Herald NDTV News 2021-08-03 2021-08-11 15:35:31Z 17:42:08Z
14 Celtic sign goalkeeper Joe Hart and midfielder James McCarthy - Sky Sports 'Jeopardy' will replace Alex Trebek with not one^ but two hosts - CNN Sky Sports CNN 2021-08-03 2021-08-11 15:33:55Z 17:30:00Z
15 At least 3 injured in workplace shooting at SmileDirectClub in Antioch^ Tennessee - NBC News Razer’s Fantastic New Wireless Earbuds Put a Light Show in Your Earholes - Gizmodo NBC News Gizmodo.com 2021-08-03 2021-08-11 15:32:02Z 17:30:00Z
16 #UnrestSA: State wants to adds treason charges to lawyer Ike Khumalo's incitement case - News24 Tokyo Olympics 2020: Aussie Olympians face 28 days of quarantine - New Zealand Herald News24 New Zealand Herald 2021-08-03 2021-08-11 15:27:28Z 17:29:56Z
17 Boeing delays key uncrewed test flight of Starliner capsule to space station - The Straits Times Instagram says sorry for removing Pedro Almodovar film poster - BBC News The Straits Times BBC News 2021-08-03 2021-08-11 15:21:41Z 17:27:49Z
18 Florida's Broward County school district reverses its mask mandate after funding threat from the governor - CNN 'More pepper^ please': New study analyzes role of scent compounds in the coevolution of bats and pepper plants - UW News CNN UW News 2021-08-03 2021-08-11 15:21:00Z 17:26:08Z
19 U.S. Gov. Cuomo sexually harassed multiple women^ probe finds - CTV News 1 man dead^ another injured in Lowertown shooting - CBC.ca Ctvnews.ca CBC News 2021-08-03 2021-08-11 15:18:39Z 17:23:37Z
20 COVID-19: UK records another 138 coronavirus deaths - the highest daily total since 17 March - Sky News Mike Richards to replace Alex Trebek as 'Jeopardy!' host; Mayim Bialik gets role too - CTV News Sky.com Ctvnews.ca 2021-08-03 2021-08-11 15:17:28Z 17:23:00Z
21 Tokyo Olympics: PV Sindhu^ India's Double Olympic Medallist^ Felicitated After Returning From Tokyo | Olympics News - NDTVSports.com Judge rejects acquittal of soldier accused of feeding troops cannabis-laced cupcakes - CBC.ca NDTV News CBC News 2021-08-03 2021-08-11 15:17:00Z 17:21:49Z

View File

@ -1,4 +1,4 @@
name,current,opening
MSFT,286.9,285.605
NFLX,510.84,514.24
GOOG,2720.7,2721.21
MSFT,286.91,287.17
NFLX,512.04,516.025
GOOG,2756.21,2768.665

1 name current opening
2 MSFT 286.9 286.91 285.605 287.17
3 NFLX 510.84 512.04 514.24 516.025
4 GOOG 2720.7 2756.21 2721.21 2768.665

BIN
display_images/Crypto.ppm Normal file

Binary file not shown.

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.9 KiB

Binary file not shown.

Binary file not shown.

Binary file not shown.

BIN
display_images/Forex.ppm Normal file

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

BIN
display_images/Stocks.ppm Normal file

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -17,6 +17,7 @@ import time
import json
from multiprocessing import Process
from subprocess import Popen, PIPE
import numpy as np
#stock_ticker = StockTicker()
api_caller = pexpect.spawn("sudo -E python3 api_caller.py")
@ -267,8 +268,48 @@ def AddLogo():
return hello()
return hello()
@app.route("/matrix", methods=['POST'])
@app.route("/start", methods = ['PUT', 'POST'])
def start():
data = str(request.data)
all_settings = ['Stocks', 'Crypto', 'Forex', 'Current Weather', 'Daily Forecast', 'News', 'Sports (Upcoming Games)', 'Sports (Past Games)',
'Sports (Live Games)', 'Sports (Team Stats)', 'Custom Images', 'Custom GIFs', 'Custom Messages']
positions = []
display_settings = []
for setting in all_settings:
pos = data.find(setting)
if pos != -1:
display_settings.append(setting)
positions.append(pos)
# sort settings by display
inds = np.argsort(positions)
display_settings = np.array(display_settings)[inds]
with open('csv/display_settings.json', 'w+') as f:
json.dump(list(display_settings), f)
ticker.sendline('K')
ticker.sendline('A')
return hello()
@app.route("/stop")
def stop():
ticker.sendline('K')
return hello()
@app.route("/shutdown")
def shutdown():
os.system("sudo shutdown now")
return hello()
@app.route("/matrix")
def matrix():
if "Run Stocks" in request.form:
ticker.sendline('K')
ticker.sendline('S')

Binary file not shown.

579
static/app.js Normal file
View File

@ -0,0 +1,579 @@
var availableFeatures = document.querySelectorAll("#available-features li");
var displayFormat = document.querySelector("#display-format");
var featureToDisplay = document.querySelector("#feature-to-display");
var displayToFeature = document.querySelector("#display-to-feature");
var displayToFormat = document.querySelectorAll("#display-format li");
var availableToDisplay = document.querySelector("#available-features");
var displayincreaseBtn = document.getElementById("display-increase-btn");
var displayDecreaseBtn = document.getElementById("display-decrease-btn");
// features lists
var stocksFeatures = document.querySelectorAll("#stocks-features li");
var cryptoFeatures = document.querySelectorAll("#crypto-features li");
var forexFeatures = document.querySelectorAll("#forex-features li");
var currentWeatherFeatures = document.querySelectorAll(
"#current-weather-features li"
);
var dailyForecastFeatures = document.querySelectorAll(
"#daily-forecast-features li"
);
var newsFeatures = document.querySelectorAll("#news-features li");
var upcomingGamesFeatures = document.querySelectorAll(
"#upcoming-games-features li"
);
var pastGamesFeatures = document.querySelectorAll("#past-games-features li");
var liveGamesFeatures = document.querySelectorAll("#live-games-features li");
var teamStatsFeatures = document.querySelectorAll("#team-stats-features li");
var imagesFeatures = document.querySelectorAll("#images-features li");
var gifsFeatures = document.querySelectorAll("#gifs-features li");
var messagesFeatures = document.querySelectorAll("#messages-features li");
var allFeaturesList = [
stocksFeatures,
cryptoFeatures,
forexFeatures,
currentWeatherFeatures,
dailyForecastFeatures,
newsFeatures,
upcomingGamesFeatures,
pastGamesFeatures,
liveGamesFeatures,
teamStatsFeatures,
imagesFeatures,
gifsFeatures,
messagesFeatures,
];
// features remove buttons
var stocksRemoveBtn = document.getElementById("stocks-remove-btn");
var cryptoRemoveBtn = document.getElementById("crypto-remove-btn");
var forexRemoveBtn = document.getElementById("forex-remove-btn");
var currentWeatherRemoveBtn = document.getElementById(
"current-weather-remove-btn"
);
var dailyForecastRemoveBtn = document.getElementById(
"daily-forecast-remove-btn"
);
var newsRemoveBtn = document.getElementById("news-remove-btn");
var upcomingGamesRemoveBtn = document.getElementById(
"upcoming-games-remove-btn"
);
var pastGamesRemoveBtn = document.getElementById("past-games-remove-btn");
var liveGamesRemoveBtn = document.getElementById("live-games-remove-btn");
var teamStatsRemoveBtn = document.getElementById("team-stats-remove-btn");
var imagesRemoveBtn = document.getElementById("images-remove-btn");
var gifsRemoveBtn = document.getElementById("gifs-remove-btn");
var messagesRemoveBtn = document.getElementById("messages-remove-btn");
var allFeaturesRemoveBtns = [
stocksRemoveBtn,
cryptoRemoveBtn,
forexRemoveBtn,
currentWeatherRemoveBtn,
dailyForecastRemoveBtn,
newsRemoveBtn,
upcomingGamesRemoveBtn,
pastGamesRemoveBtn,
liveGamesRemoveBtn,
teamStatsRemoveBtn,
imagesRemoveBtn,
gifsRemoveBtn,
messagesRemoveBtn,
];
// features increase buttons
var stocksincreaseBtn = document.getElementById("stocks-increase-btn");
var cryptoincreaseBtn = document.getElementById("crypto-increase-btn");
var forexincreaseBtn = document.getElementById("forex-increase-btn");
var currentWeatherincreaseBtn = document.getElementById(
"current-weather-increase-btn"
);
var dailyForecastincreaseBtn = document.getElementById(
"daily-forecast-increase-btn"
);
var newsincreaseBtn = document.getElementById("news-increase-btn");
var upcomingGamesincreaseBtn = document.getElementById(
"upcoming-games-increase-btn"
);
var pastGamesincreaseBtn = document.getElementById("past-games-increase-btn");
var liveGamesincreaseBtn = document.getElementById("live-games-increase-btn");
var teamStatsincreaseBtn = document.getElementById("team-stats-increase-btn");
var imagesincreaseBtn = document.getElementById("images-increase-btn");
var gifsincreaseBtn = document.getElementById("gifs-increase-btn");
var messagesincreaseBtn = document.getElementById("messages-increase-btn");
var allFeaturesIncreaseBtns = [
stocksincreaseBtn,
cryptoincreaseBtn,
forexincreaseBtn,
currentWeatherincreaseBtn,
dailyForecastincreaseBtn,
newsincreaseBtn,
upcomingGamesincreaseBtn,
pastGamesincreaseBtn,
liveGamesincreaseBtn,
teamStatsincreaseBtn,
imagesincreaseBtn,
gifsincreaseBtn,
messagesincreaseBtn,
];
// features decrease buttons
var stocksDecreaseBtn = document.getElementById("stocks-decrease-btn");
var cryptoDecreaseBtn = document.getElementById("crypto-decrease-btn");
var forexDecreaseBtn = document.getElementById("forex-decrease-btn");
var currentWeatherDecreaseBtn = document.getElementById(
"current-weather-decrease-btn"
);
var dailyForecastDecreaseBtn = document.getElementById(
"daily-forecast-decrease-btn"
);
var newsDecreaseBtn = document.getElementById("news-decrease-btn");
var upcomingGamesDecreaseBtn = document.getElementById(
"upcoming-games-decrease-btn"
);
var pastGamesDecreaseBtn = document.getElementById("past-games-decrease-btn");
var liveGamesDecreaseBtn = document.getElementById("live-games-decrease-btn");
var teamStatsDecreaseBtn = document.getElementById("team-stats-decrease-btn");
var imagesDecreaseBtn = document.getElementById("images-decrease-btn");
var gifsDecreaseBtn = document.getElementById("gifs-decrease-btn");
var messagesDecreaseBtn = document.getElementById("messages-decrease-btn");
var allFeaturesDecreaseBtns = [
stocksDecreaseBtn,
cryptoDecreaseBtn,
forexDecreaseBtn,
currentWeatherDecreaseBtn,
dailyForecastDecreaseBtn,
newsDecreaseBtn,
upcomingGamesDecreaseBtn,
pastGamesDecreaseBtn,
liveGamesDecreaseBtn,
teamStatsDecreaseBtn,
imagesDecreaseBtn,
gifsDecreaseBtn,
messagesDecreaseBtn,
];
const changeVarValue = () => {
stocksFeatures = document.querySelectorAll("#stocks-features li");
cryptoFeatures = document.querySelectorAll("#crypto-features li");
forexFeatures = document.querySelectorAll("#forex-features li");
currentWeatherFeatures = document.querySelectorAll(
"#current-weather-features li"
);
dailyForecastFeatures = document.querySelectorAll(
"#daily-forecast-features li"
);
newsFeatures = document.querySelectorAll("#news-features li");
upcomingGamesFeatures = document.querySelectorAll(
"#upcoming-games-features li"
);
pastGamesFeatures = document.querySelectorAll("#past-games-features li");
liveGamesFeatures = document.querySelectorAll("#live-games-features li");
teamStatsFeatures = document.querySelectorAll("#team-stats-features li");
imagesFeatures = document.querySelectorAll("#images-features li");
gifsFeatures = document.querySelectorAll("#gifs-features li");
messagesFeatures = document.querySelectorAll("#messages-features li");
allFeaturesList = [
stocksFeatures,
cryptoFeatures,
forexFeatures,
currentWeatherFeatures,
dailyForecastFeatures,
newsFeatures,
upcomingGamesFeatures,
pastGamesFeatures,
liveGamesFeatures,
teamStatsFeatures,
imagesFeatures,
gifsFeatures,
messagesFeatures,
];
};
const addEventOnList = () => {
// for available feature
for (let i = 0; i < availableFeatures.length; i++) {
const availableFeature = availableFeatures[i];
availableFeature.addEventListener("click", () => {
for (let i = 0; i < availableFeatures.length; i++) {
availableFeatures[i].setAttribute("class", "");
}
if (availableFeature.getAttribute("class") == "active") {
availableFeature.setAttribute("class", "");
} else {
availableFeature.setAttribute("class", "active");
}
});
}
// for display format
for (let i = 0; i < displayToFormat.length; i++) {
const display_format = displayToFormat[i];
display_format.addEventListener("click", () => {
for (let i = 0; i < displayToFormat.length; i++) {
displayToFormat[i].setAttribute("class", "");
}
if (display_format.getAttribute("class") == "active") {
display_format.setAttribute("class", "");
} else {
display_format.setAttribute("class", "active");
}
});
}
};
const addEventonBtns = () => {
featureToDisplay.addEventListener("click", () => {
for (let i = 0; i < availableFeatures.length; i++) {
const availableFeature = availableFeatures[i];
if (availableFeature.getAttribute("class") == "active") {
availableFeature.remove();
availableFeature.setAttribute("class", "");
displayFormat.appendChild(availableFeature);
availableFeatures = document.querySelectorAll("#available-features li");
displayToFormat = document.querySelectorAll("#display-format li");
addEventOnList();
}
}
});
displayToFeature.addEventListener("click", () => {
for (let i = 0; i < displayToFormat.length; i++) {
const availableFormat = displayToFormat[i];
if (availableFormat.getAttribute("class") == "active") {
availableFormat.remove();
availableFormat.setAttribute("class", "");
availableToDisplay.appendChild(availableFormat);
availableFeatures = document.querySelectorAll("#available-features li");
displayToFormat = document.querySelectorAll("#display-format li");
addEventOnList();
}
}
});
};
addEventOnList();
addEventonBtns();
const addEventOnFeaturesList = () => {
allFeaturesList.map((value) => {
for (let i = 0; i < value.length; i++) {
const availableFeature = value[i];
availableFeature.addEventListener("click", () => {
for (let i = 0; i < value.length; i++) {
value[i].setAttribute("class", "");
}
if (availableFeature.getAttribute("class") == "active") {
availableFeature.setAttribute("class", "");
} else {
availableFeature.setAttribute("class", "active");
}
});
}
});
};
addEventOnFeaturesList();
// display increase function
displayincreaseBtn.addEventListener("click", () => {
for (let i = 0; i < displayToFormat.length; i++) {
var displayItem = displayToFormat[i];
if (displayItem.getAttribute("class") == "active") {
var prevElement = displayItem.previousElementSibling;
var currentText = displayItem.innerText;
displayItem.innerText = prevElement.innerText;
prevElement.innerText = currentText;
prevElement.setAttribute("class", "active");
displayItem.setAttribute("class", "");
}
}
});
// display decrease function
displayDecreaseBtn.addEventListener("click", () => {
for (let i = 0; i < displayToFormat.length; i++) {
var displayItem = displayToFormat[i];
if (displayItem.getAttribute("class") == "active") {
var nextElement = displayItem.nextElementSibling;
var currentText = displayItem.innerText;
displayItem.innerText = nextElement.innerText;
nextElement.innerText = currentText;
nextElement.setAttribute("class", "active");
displayItem.setAttribute("class", "");
break;
}
}
});
// feature remove function
allFeaturesRemoveBtns.map((value, index) => {
value.addEventListener("click", () => {
for (let i = 0; i < allFeaturesList[index].length; i++) {
var item = allFeaturesList[index][i];
if (item.getAttribute("class") == "active") {
item.remove();
}
}
});
});
// feature increase function
allFeaturesIncreaseBtns.map((value, index) => {
value.addEventListener("click", () => {
for (let i = 0; i < allFeaturesList[index].length; i++) {
var item = allFeaturesList[index][i];
if (item.getAttribute("class") == "active") {
var prevElement = item.previousElementSibling;
var currentText = item.innerText;
item.innerText = prevElement.innerText;
prevElement.innerText = currentText;
prevElement.setAttribute("class", "active");
item.setAttribute("class", "");
}
}
});
});
// feature decrease function
allFeaturesDecreaseBtns.map((value, index) => {
value.addEventListener("click", () => {
for (let i = 0; i < allFeaturesList[index].length; i++) {
var item = allFeaturesList[index][i];
if (item.getAttribute("class") == "active") {
var nextElement = item.nextElementSibling;
var currentText = item.innerText;
item.innerText = nextElement.innerText;
nextElement.innerText = currentText;
nextElement.setAttribute("class", "active");
item.setAttribute("class", "");
break;
}
}
});
});
// all features
var stocks = document.getElementById("stocks-features");
var crypto1 = document.getElementById("crypto-features");
var forex = document.getElementById("forex-features");
var currentWeather = document.getElementById("current-weather-features");
var dailyForecast = document.getElementById("daily-forecast-features");
var news = document.getElementById("news-features");
var upcomingGames = document.getElementById("upcoming-games-features");
var pastGames = document.getElementById("past-games-features");
var liveGames = document.getElementById("live-games-features");
var teamStats = document.getElementById("team-stats-features");
var images = document.getElementById("images-features");
var gifs = document.getElementById("gifs-features");
var messages = document.getElementById("messages-features");
var allFeatures = [
stocks,
crypto1,
forex,
currentWeather,
dailyForecast,
news,
upcomingGames,
pastGames,
liveGames,
teamStats,
images,
gifs,
messages,
];
// features select box
var newsSelect = document.getElementById("inputTransition63");
var upcomingGamesSelect = document.getElementById("inputTransition73");
var pastGamesSelect = document.getElementById("inputTransition83");
var liveGamesSelect = document.getElementById("inputTransition93");
var teamStatsSelect = document.getElementById("inputTransition103");
var allFeaturesSelectBox = [
null,
null,
null,
null,
null,
newsSelect,
upcomingGamesSelect,
pastGamesSelect,
liveGamesSelect,
teamStatsSelect,
null,
null,
null,
];
// features select add buttons
var newsAddBtn = document.getElementById("inputTransitionBtn63");
var upcomingGamesAddBtn = document.getElementById("inputTransitionBtn73");
var pastGamesAddBtn = document.getElementById("inputTransitionBtn83");
var liveGamesAddBtn = document.getElementById("inputTransitionBtn93");
var teamStatsAddBtn = document.getElementById("inputTransitionBtn103");
var allFeaturesSelectAddBtn = [
null,
null,
null,
null,
null,
newsAddBtn,
upcomingGamesAddBtn,
pastGamesAddBtn,
liveGamesAddBtn,
teamStatsAddBtn,
null,
null,
null,
];
allFeaturesSelectAddBtn.map((value, index) => {
if (value != null) {
value.addEventListener("click", () => {
var tag = document.createElement("li");
tag.innerHTML = allFeaturesSelectBox[index].value;
allFeatures[index].appendChild(tag);
changeVarValue();
addEventOnFeaturesList();
});
}
});
// features input file
var imagesFile = document.getElementById("inputText11");
var gifsFile = document.getElementById("inputText1112");
var allFeaturesFile = [
null,
null,
null,
null,
null,
null,
null,
null,
null,
null,
imagesFile,
gifsFile,
null,
];
// features file add button
var imagesFileAddBtn = document.getElementById("inputTextBtn11");
var gifsFileAddBtn = document.getElementById("inputTextBtn1112");
var allFeaturesFileAddBtn = [
null,
null,
null,
null,
null,
null,
null,
null,
null,
null,
imagesFileAddBtn,
gifsFileAddBtn,
null,
];
allFeaturesFileAddBtn.map((value, index) => {
if (value !== null) {
value.addEventListener("click", () => {
var tag = document.createElement("li");
tag.innerHTML = allFeaturesFile[index].files[0].name;
allFeatures[index].appendChild(tag);
changeVarValue();
addEventOnFeaturesList();
});
}
});
// features input text
var stocksText = document.getElementById("inputText3");
var cryptoText = document.getElementById("inputText4");
var forexText = document.getElementById("inputText5");
var currentWeatherText = document.getElementById("inputText6");
var dailyForecastText = document.getElementById("inputText7");
var messagesText = document.getElementById("inputText13");
var allFeaturesText = [
stocksText,
cryptoText,
forexText,
currentWeatherText,
dailyForecastText,
null,
null,
null,
null,
null,
null,
null,
messagesText,
];
// features text add button
var stocksTextAddBtn = document.getElementById("inputTextBtn3");
var cryptoTextAddBtn = document.getElementById("inputTextBtn4");
var forexTextAddBtn = document.getElementById("inputTextBtn5");
var currentWeatherTextAddBtn = document.getElementById("inputTextBtn6");
var dailyForecastTextAddBtn = document.getElementById("inputTextBtn7");
var messagesTextAddBtn = document.getElementById("inputTextBtn13");
var allFeaturesTextAddBtn = [
stocksTextAddBtn,
cryptoTextAddBtn,
forexTextAddBtn,
currentWeatherTextAddBtn,
dailyForecastTextAddBtn,
null,
null,
null,
null,
null,
null,
null,
messagesTextAddBtn,
];
allFeaturesTextAddBtn.map((value, index) => {
if (value !== null) {
value.addEventListener("click", () => {
var tag = document.createElement("li");
tag.innerHTML = allFeaturesText[index].value;
allFeatures[index].appendChild(tag);
changeVarValue();
addEventOnFeaturesList();
});
}
});
var startButton = document.getElementById("start-btn");
// start the display
startButton.addEventListener("click", () => {
var HTML = document.getElementById('display-format').innerHTML;
console.log('pressed');
console.log(HTML);
fetch("/start", {
method:"PUT",
body:JSON.stringify(HTML)
});
});

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

View File

@ -1,11 +1,165 @@
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html body {
max-width: 100%;
overflow-x: hidden;
}
html {
scroll-behavior: smooth;
}
body {
background: black;
color: white;
background-color: black;
}
@font-face {
font-family: Encode;
src: EncodeSans.ttf;
}
/* Top logo bar */
header {
display: block;
margin-top: 30px;
border-bottom: 2px solid white;
padding-bottom: 20px;
}
.logo {
width: 200px;
height: 70px;
}
.update-btn,
.update-btn:hover {
background-color: gray;
float: right;
margin-top: 20px;
color: white;
}
/* General Ticker */
.buttons-list {
display: flex;
justify-content: space-around;
list-style-type: none;
}
.btn-stop-display,
.btn-stop-display:hover {
background-color: purple;
color: white;
}
.set-btn,
.set-btn:hover {
background-color: gray;
color: white;
}
.row-2 {
border-bottom: 2px solid white;
padding-bottom: 30px;
}
/* Features to display */
.features-div {
background-color: white;
padding-block: 10px;
height: 200px;
overflow-y: scroll;
}
.features-div-two {
background-color: white;
padding-block: 10px;
height: 370px;
overflow-y: scroll;
}
.display-features-list {
list-style-type: none;
}
.fa-chevron-right,
.fa-chevron-left,
.fa-chevron-up,
.fa-chevron-down,
.fa-minus {
background-color: gray;
padding: 10px;
}
.icons-list {
margin-block: 70px;
}
.icons-list a {
color: white;
}
.icons-list i {
cursor: pointer;
}
.display-features-list li:hover {
background-color: blue;
cursor: pointer;
}
.save-btn-div {
text-align: center;
margin-top: 60px;
}
.save-btn,
.save-btn:hover {
background-color: gray;
color: white;
padding-inline: 40px;
}
.footer {
text-align: center;
color: white;
margin-top: 120px;
}
li.active {
background-color: skyblue;
}
.row-1, .row-3{
margin-block: 50px;
}
/* Responsiveness */
@media (max-width: 767px) {
.buttons-list{
display: flex;
flex-wrap: wrap;
gap: 25px;
position: relative;
right: 20px;
}
.row-1, .row-3{
margin-block: 25px;
}
.screen-saver{
margin-block: 25px;
}
.display-none-div{
display: none;
}
.icons-list{
display: flex;
justify-content: center;
gap: 20px;
}
.icons-list a{
margin-left: -120px;
}
.remove{
margin-right: -100px;
margin-left: -100px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.icons-list a{
position: relative;
top: 10px;
}
font-family: Encode;
}

View File

@ -58,15 +58,18 @@ class StockTicker():
self.matrix = RGBMatrix(options = options)
self.points = True # display crypto change in points or percent
self.functions = {'stocks': self.getStockImage, 'crypto': self.getCryptoImage, 'forex': self.getForexImage,
'daily_weather':self.getDailyWeatherImage, 'today_weather': self.getTodayWeatherImage,
'league_table':lambda : self.getLeagueTableImage('premier_league'), 'past_games': lambda:self.getLeagueImage('NBA', 'past'),
'future_games': lambda : self.getLeagueImage('NHL', 'future'), 'live_games': lambda: self.getLeagueImage('NBA', 'live'),
'news':self.getNewsImage, 'text': self.getUserText, 'display_image': self.getUserImage, 'display_gif':self.getUserGIF,
self.functions = {'Stocks': self.getStockImage, 'Crypto': self.getCryptoImage, 'Forex': self.getForexImage,
'Daily Forecast':self.getDailyWeatherImage, 'Current Weather': self.getTodayWeatherImage,
'Sports (Team Stats)':lambda : self.getLeagueTableImage('premier_league'), 'Sports (Past Games)': lambda:self.getLeagueImage('NBA', 'past'),
'Sports (Upcoming Games)': lambda : self.getLeagueImage('NHL', 'future'), 'Sports (Live Games)': lambda: self.getLeagueImage('NBA', 'live'),
'News':self.getNewsImage, 'Custom Messages': self.getUserText, 'Custom Images': self.getUserImage, 'Custom GIFs':self.getUserGIF,
'stocks_prof': self.getStockProfessional, 'crypto_prof': self.getCryptoProfessional, 'forex_prof': self.getForexProfessional,
'today_weather_prof': self.getTodayWeatherProfessional, 'news_prof':self.getNewsProfessional}
def openImage(self, image_file):
@ -272,8 +275,9 @@ class StockTicker():
for option in options:
img = self.functions[option]()
if option not in ['display_gif']: # aving the gif like this kills the animation
if option not in ['Custom GIFs']: # aving the gif like this kills the animation
img.save('./display_images/'+ option+ '.ppm')
def incrementGIF(self, image):
try:
@ -314,11 +318,11 @@ class StockTicker():
update_process.start()
if options[i % len(options)] != 'display_gif':
if options[i % len(options)] != 'Custom GIFs':
image = self.openImage('./display_images/' + options[i % len(options)] +'.ppm')
image = image.convert('RGB')
else:
image = self.openImage('./display_images/display_gif.gif')
image = self.openImage('./display_images/Custom GIFs.gif')
img_width, img_height = image.size
@ -340,11 +344,11 @@ class StockTicker():
if animation == 'up':
offset_y = 33
direction = -1
kill = self.scrollImageY(image, direction = direction, offset_x = offset_x, offset_y = offset_y, frame_skip = frame_skip, gif = options[i % len(options)] == 'display_gif')
kill = self.scrollImageY(image, direction = direction, offset_x = offset_x, offset_y = offset_y, frame_skip = frame_skip, gif = options[i % len(options)] == 'Custom GIFs')
elif animation == 'down':
direction = 1
offset_y = -33
kill = self.scrollImageY(image, direction = direction, offset_x = offset_x, offset_y = offset_y, frame_skip = frame_skip, gif = options[i % len(options)] == 'display_gif')
kill = self.scrollImageY(image, direction = direction, offset_x = offset_x, offset_y = offset_y, frame_skip = frame_skip, gif = options[i % len(options)] == 'Custom GIFs')
if kill: break
offset_y = 0
@ -356,7 +360,7 @@ class StockTicker():
self.incrementGIF(image)
pause_frames -=1
if options[i % len(options)] != 'display_gif':
if options[i % len(options)] != 'Custom GIFs':
self.double_buffer.SetImage(image, offset_x, offset_y)
else:
self.double_buffer.SetImage(image.convert('RGB'), offset_x, offset_y)
@ -373,7 +377,7 @@ class StockTicker():
if kill: break
kill = self.scrollImage(image, offset_x = offset_x, offset_y = offset_y, frame_skip = frame_skip, gif = options[i % len(options)] == 'display_gif')
kill = self.scrollImage(image, offset_x = offset_x, offset_y = offset_y, frame_skip = frame_skip, gif = options[i % len(options)] == 'Custom GIFs')
if kill: break
@ -1899,7 +1903,7 @@ class StockTicker():
frames.append(f)
frames[0].save('./display_images/display_gif.gif', save_all=True, append_images=frames[1:], loop=0, optimize = False)
frames[0].save('./display_images/Custom GIFs.gif', save_all=True, append_images=frames[1:], loop=0, optimize = False)
return None
@ -2106,11 +2110,11 @@ class StockTicker():
elif msg == 'A': #everything
userSettings = ['display_gif', 'text', 'display_image', 'stocks', 'crypto', 'forex', 'today_weather', 'daily_weather', 'league_table', 'league_games', 'news'] # these wil be read from csv, just for demo
#userSettings = ['display_gif', 'text', 'display_image', 'stocks', 'crypto', 'forex', 'today_weather', 'daily_weather', 'league_table', 'league_games', 'news'] # these wil be read from csv, just for demo
#userSettings = [ 'daily_weather']
#userSettings = ['crypto', 'stocks'] # these wil be read from csv, just for demo
#userSettings = [ 'display_image', 'news'] # these wil be read from csv, just for demo
userSettings = json.load(open('csv/display_settings.json'))
self.scrollFunctionsAnimated(userSettings, animation = 'down')
elif msg == 'b':

569
templates/app.js Normal file
View File

@ -0,0 +1,569 @@
var availableFeatures = document.querySelectorAll("#available-features li");
var displayFormat = document.querySelector("#display-format");
var featureToDisplay = document.querySelector("#feature-to-display");
var displayToFeature = document.querySelector("#display-to-feature");
var displayToFormat = document.querySelectorAll("#display-format li");
var availableToDisplay = document.querySelector("#available-features");
var displayincreaseBtn = document.getElementById("display-increase-btn");
var displayDecreaseBtn = document.getElementById("display-decrease-btn");
// features lists
var stocksFeatures = document.querySelectorAll("#stocks-features li");
var cryptoFeatures = document.querySelectorAll("#crypto-features li");
var forexFeatures = document.querySelectorAll("#forex-features li");
var currentWeatherFeatures = document.querySelectorAll(
"#current-weather-features li"
);
var dailyForecastFeatures = document.querySelectorAll(
"#daily-forecast-features li"
);
var newsFeatures = document.querySelectorAll("#news-features li");
var upcomingGamesFeatures = document.querySelectorAll(
"#upcoming-games-features li"
);
var pastGamesFeatures = document.querySelectorAll("#past-games-features li");
var liveGamesFeatures = document.querySelectorAll("#live-games-features li");
var teamStatsFeatures = document.querySelectorAll("#team-stats-features li");
var imagesFeatures = document.querySelectorAll("#images-features li");
var gifsFeatures = document.querySelectorAll("#gifs-features li");
var messagesFeatures = document.querySelectorAll("#messages-features li");
var allFeaturesList = [
stocksFeatures,
cryptoFeatures,
forexFeatures,
currentWeatherFeatures,
dailyForecastFeatures,
newsFeatures,
upcomingGamesFeatures,
pastGamesFeatures,
liveGamesFeatures,
teamStatsFeatures,
imagesFeatures,
gifsFeatures,
messagesFeatures,
];
// features remove buttons
var stocksRemoveBtn = document.getElementById("stocks-remove-btn");
var cryptoRemoveBtn = document.getElementById("crypto-remove-btn");
var forexRemoveBtn = document.getElementById("forex-remove-btn");
var currentWeatherRemoveBtn = document.getElementById(
"current-weather-remove-btn"
);
var dailyForecastRemoveBtn = document.getElementById(
"daily-forecast-remove-btn"
);
var newsRemoveBtn = document.getElementById("news-remove-btn");
var upcomingGamesRemoveBtn = document.getElementById(
"upcoming-games-remove-btn"
);
var pastGamesRemoveBtn = document.getElementById("past-games-remove-btn");
var liveGamesRemoveBtn = document.getElementById("live-games-remove-btn");
var teamStatsRemoveBtn = document.getElementById("team-stats-remove-btn");
var imagesRemoveBtn = document.getElementById("images-remove-btn");
var gifsRemoveBtn = document.getElementById("gifs-remove-btn");
var messagesRemoveBtn = document.getElementById("messages-remove-btn");
var allFeaturesRemoveBtns = [
stocksRemoveBtn,
cryptoRemoveBtn,
forexRemoveBtn,
currentWeatherRemoveBtn,
dailyForecastRemoveBtn,
newsRemoveBtn,
upcomingGamesRemoveBtn,
pastGamesRemoveBtn,
liveGamesRemoveBtn,
teamStatsRemoveBtn,
imagesRemoveBtn,
gifsRemoveBtn,
messagesRemoveBtn,
];
// features increase buttons
var stocksincreaseBtn = document.getElementById("stocks-increase-btn");
var cryptoincreaseBtn = document.getElementById("crypto-increase-btn");
var forexincreaseBtn = document.getElementById("forex-increase-btn");
var currentWeatherincreaseBtn = document.getElementById(
"current-weather-increase-btn"
);
var dailyForecastincreaseBtn = document.getElementById(
"daily-forecast-increase-btn"
);
var newsincreaseBtn = document.getElementById("news-increase-btn");
var upcomingGamesincreaseBtn = document.getElementById(
"upcoming-games-increase-btn"
);
var pastGamesincreaseBtn = document.getElementById("past-games-increase-btn");
var liveGamesincreaseBtn = document.getElementById("live-games-increase-btn");
var teamStatsincreaseBtn = document.getElementById("team-stats-increase-btn");
var imagesincreaseBtn = document.getElementById("images-increase-btn");
var gifsincreaseBtn = document.getElementById("gifs-increase-btn");
var messagesincreaseBtn = document.getElementById("messages-increase-btn");
var allFeaturesIncreaseBtns = [
stocksincreaseBtn,
cryptoincreaseBtn,
forexincreaseBtn,
currentWeatherincreaseBtn,
dailyForecastincreaseBtn,
newsincreaseBtn,
upcomingGamesincreaseBtn,
pastGamesincreaseBtn,
liveGamesincreaseBtn,
teamStatsincreaseBtn,
imagesincreaseBtn,
gifsincreaseBtn,
messagesincreaseBtn,
];
// features decrease buttons
var stocksDecreaseBtn = document.getElementById("stocks-decrease-btn");
var cryptoDecreaseBtn = document.getElementById("crypto-decrease-btn");
var forexDecreaseBtn = document.getElementById("forex-decrease-btn");
var currentWeatherDecreaseBtn = document.getElementById(
"current-weather-decrease-btn"
);
var dailyForecastDecreaseBtn = document.getElementById(
"daily-forecast-decrease-btn"
);
var newsDecreaseBtn = document.getElementById("news-decrease-btn");
var upcomingGamesDecreaseBtn = document.getElementById(
"upcoming-games-decrease-btn"
);
var pastGamesDecreaseBtn = document.getElementById("past-games-decrease-btn");
var liveGamesDecreaseBtn = document.getElementById("live-games-decrease-btn");
var teamStatsDecreaseBtn = document.getElementById("team-stats-decrease-btn");
var imagesDecreaseBtn = document.getElementById("images-decrease-btn");
var gifsDecreaseBtn = document.getElementById("gifs-decrease-btn");
var messagesDecreaseBtn = document.getElementById("messages-decrease-btn");
var allFeaturesDecreaseBtns = [
stocksDecreaseBtn,
cryptoDecreaseBtn,
forexDecreaseBtn,
currentWeatherDecreaseBtn,
dailyForecastDecreaseBtn,
newsDecreaseBtn,
upcomingGamesDecreaseBtn,
pastGamesDecreaseBtn,
liveGamesDecreaseBtn,
teamStatsDecreaseBtn,
imagesDecreaseBtn,
gifsDecreaseBtn,
messagesDecreaseBtn,
];
const changeVarValue = () => {
stocksFeatures = document.querySelectorAll("#stocks-features li");
cryptoFeatures = document.querySelectorAll("#crypto-features li");
forexFeatures = document.querySelectorAll("#forex-features li");
currentWeatherFeatures = document.querySelectorAll(
"#current-weather-features li"
);
dailyForecastFeatures = document.querySelectorAll(
"#daily-forecast-features li"
);
newsFeatures = document.querySelectorAll("#news-features li");
upcomingGamesFeatures = document.querySelectorAll(
"#upcoming-games-features li"
);
pastGamesFeatures = document.querySelectorAll("#past-games-features li");
liveGamesFeatures = document.querySelectorAll("#live-games-features li");
teamStatsFeatures = document.querySelectorAll("#team-stats-features li");
imagesFeatures = document.querySelectorAll("#images-features li");
gifsFeatures = document.querySelectorAll("#gifs-features li");
messagesFeatures = document.querySelectorAll("#messages-features li");
allFeaturesList = [
stocksFeatures,
cryptoFeatures,
forexFeatures,
currentWeatherFeatures,
dailyForecastFeatures,
newsFeatures,
upcomingGamesFeatures,
pastGamesFeatures,
liveGamesFeatures,
teamStatsFeatures,
imagesFeatures,
gifsFeatures,
messagesFeatures,
];
};
const addEventOnList = () => {
// for available feature
for (let i = 0; i < availableFeatures.length; i++) {
const availableFeature = availableFeatures[i];
availableFeature.addEventListener("click", () => {
for (let i = 0; i < availableFeatures.length; i++) {
availableFeatures[i].setAttribute("class", "");
}
if (availableFeature.getAttribute("class") == "active") {
availableFeature.setAttribute("class", "");
} else {
availableFeature.setAttribute("class", "active");
}
});
}
// for display format
for (let i = 0; i < displayToFormat.length; i++) {
const display_format = displayToFormat[i];
display_format.addEventListener("click", () => {
for (let i = 0; i < displayToFormat.length; i++) {
displayToFormat[i].setAttribute("class", "");
}
if (display_format.getAttribute("class") == "active") {
display_format.setAttribute("class", "");
} else {
display_format.setAttribute("class", "active");
}
});
}
};
const addEventonBtns = () => {
featureToDisplay.addEventListener("click", () => {
for (let i = 0; i < availableFeatures.length; i++) {
const availableFeature = availableFeatures[i];
if (availableFeature.getAttribute("class") == "active") {
availableFeature.remove();
availableFeature.setAttribute("class", "");
displayFormat.appendChild(availableFeature);
availableFeatures = document.querySelectorAll("#available-features li");
displayToFormat = document.querySelectorAll("#display-format li");
addEventOnList();
}
}
});
displayToFeature.addEventListener("click", () => {
for (let i = 0; i < displayToFormat.length; i++) {
const availableFormat = displayToFormat[i];
if (availableFormat.getAttribute("class") == "active") {
availableFormat.remove();
availableFormat.setAttribute("class", "");
availableToDisplay.appendChild(availableFormat);
availableFeatures = document.querySelectorAll("#available-features li");
displayToFormat = document.querySelectorAll("#display-format li");
addEventOnList();
}
}
});
};
addEventOnList();
addEventonBtns();
const addEventOnFeaturesList = () => {
allFeaturesList.map((value) => {
for (let i = 0; i < value.length; i++) {
const availableFeature = value[i];
availableFeature.addEventListener("click", () => {
for (let i = 0; i < value.length; i++) {
value[i].setAttribute("class", "");
}
if (availableFeature.getAttribute("class") == "active") {
availableFeature.setAttribute("class", "");
} else {
availableFeature.setAttribute("class", "active");
}
});
}
});
};
addEventOnFeaturesList();
// display increase function
displayincreaseBtn.addEventListener("click", () => {
console.log('hello');
for (let i = 0; i < displayToFormat.length; i++) {
var displayItem = displayToFormat[i];
if (displayItem.getAttribute("class") == "active") {
var prevElement = displayItem.previousElementSibling;
var currentText = displayItem.innerText;
displayItem.innerText = prevElement.innerText;
prevElement.innerText = currentText;
prevElement.setAttribute("class", "active");
displayItem.setAttribute("class", "");
}
}
});
// display decrease function
displayDecreaseBtn.addEventListener("click", () => {
for (let i = 0; i < displayToFormat.length; i++) {
var displayItem = displayToFormat[i];
if (displayItem.getAttribute("class") == "active") {
var nextElement = displayItem.nextElementSibling;
var currentText = displayItem.innerText;
displayItem.innerText = nextElement.innerText;
nextElement.innerText = currentText;
nextElement.setAttribute("class", "active");
displayItem.setAttribute("class", "");
break;
}
}
});
// feature remove function
allFeaturesRemoveBtns.map((value, index) => {
value.addEventListener("click", () => {
for (let i = 0; i < allFeaturesList[index].length; i++) {
var item = allFeaturesList[index][i];
if (item.getAttribute("class") == "active") {
item.remove();
}
}
});
});
// feature increase function
allFeaturesIncreaseBtns.map((value, index) => {
value.addEventListener("click", () => {
for (let i = 0; i < allFeaturesList[index].length; i++) {
var item = allFeaturesList[index][i];
if (item.getAttribute("class") == "active") {
var prevElement = item.previousElementSibling;
var currentText = item.innerText;
item.innerText = prevElement.innerText;
prevElement.innerText = currentText;
prevElement.setAttribute("class", "active");
item.setAttribute("class", "");
}
}
});
});
// feature decrease function
allFeaturesDecreaseBtns.map((value, index) => {
value.addEventListener("click", () => {
for (let i = 0; i < allFeaturesList[index].length; i++) {
var item = allFeaturesList[index][i];
if (item.getAttribute("class") == "active") {
var nextElement = item.nextElementSibling;
var currentText = item.innerText;
item.innerText = nextElement.innerText;
nextElement.innerText = currentText;
nextElement.setAttribute("class", "active");
item.setAttribute("class", "");
break;
}
}
});
});
// all features
var stocks = document.getElementById("stocks-features");
var crypto1 = document.getElementById("crypto-features");
var forex = document.getElementById("forex-features");
var currentWeather = document.getElementById("current-weather-features");
var dailyForecast = document.getElementById("daily-forecast-features");
var news = document.getElementById("news-features");
var upcomingGames = document.getElementById("upcoming-games-features");
var pastGames = document.getElementById("past-games-features");
var liveGames = document.getElementById("live-games-features");
var teamStats = document.getElementById("team-stats-features");
var images = document.getElementById("images-features");
var gifs = document.getElementById("gifs-features");
var messages = document.getElementById("messages-features");
var allFeatures = [
stocks,
crypto1,
forex,
currentWeather,
dailyForecast,
news,
upcomingGames,
pastGames,
liveGames,
teamStats,
images,
gifs,
messages,
];
// features select box
var newsSelect = document.getElementById("inputTransition63");
var upcomingGamesSelect = document.getElementById("inputTransition73");
var pastGamesSelect = document.getElementById("inputTransition83");
var liveGamesSelect = document.getElementById("inputTransition93");
var teamStatsSelect = document.getElementById("inputTransition103");
var allFeaturesSelectBox = [
null,
null,
null,
null,
null,
newsSelect,
upcomingGamesSelect,
pastGamesSelect,
liveGamesSelect,
teamStatsSelect,
null,
null,
null,
];
// features select add buttons
var newsAddBtn = document.getElementById("inputTransitionBtn63");
var upcomingGamesAddBtn = document.getElementById("inputTransitionBtn73");
var pastGamesAddBtn = document.getElementById("inputTransitionBtn83");
var liveGamesAddBtn = document.getElementById("inputTransitionBtn93");
var teamStatsAddBtn = document.getElementById("inputTransitionBtn103");
var allFeaturesSelectAddBtn = [
null,
null,
null,
null,
null,
newsAddBtn,
upcomingGamesAddBtn,
pastGamesAddBtn,
liveGamesAddBtn,
teamStatsAddBtn,
null,
null,
null,
];
allFeaturesSelectAddBtn.map((value, index) => {
if (value != null) {
value.addEventListener("click", () => {
var tag = document.createElement("li");
tag.innerHTML = allFeaturesSelectBox[index].value;
allFeatures[index].appendChild(tag);
changeVarValue();
addEventOnFeaturesList();
});
}
});
// features input file
var imagesFile = document.getElementById("inputText11");
var gifsFile = document.getElementById("inputText1112");
var allFeaturesFile = [
null,
null,
null,
null,
null,
null,
null,
null,
null,
null,
imagesFile,
gifsFile,
null,
];
// features file add button
var imagesFileAddBtn = document.getElementById("inputTextBtn11");
var gifsFileAddBtn = document.getElementById("inputTextBtn1112");
var allFeaturesFileAddBtn = [
null,
null,
null,
null,
null,
null,
null,
null,
null,
null,
imagesFileAddBtn,
gifsFileAddBtn,
null,
];
allFeaturesFileAddBtn.map((value, index) => {
if (value !== null) {
value.addEventListener("click", () => {
var tag = document.createElement("li");
tag.innerHTML = allFeaturesFile[index].files[0].name;
allFeatures[index].appendChild(tag);
changeVarValue();
addEventOnFeaturesList();
});
}
});
// features input text
var stocksText = document.getElementById("inputText3");
var cryptoText = document.getElementById("inputText4");
var forexText = document.getElementById("inputText5");
var currentWeatherText = document.getElementById("inputText6");
var dailyForecastText = document.getElementById("inputText7");
var messagesText = document.getElementById("inputText13");
var allFeaturesText = [
stocksText,
cryptoText,
forexText,
currentWeatherText,
dailyForecastText,
null,
null,
null,
null,
null,
null,
null,
messagesText,
];
// features text add button
var stocksTextAddBtn = document.getElementById("inputTextBtn3");
var cryptoTextAddBtn = document.getElementById("inputTextBtn4");
var forexTextAddBtn = document.getElementById("inputTextBtn5");
var currentWeatherTextAddBtn = document.getElementById("inputTextBtn6");
var dailyForecastTextAddBtn = document.getElementById("inputTextBtn7");
var messagesTextAddBtn = document.getElementById("inputTextBtn13");
var allFeaturesTextAddBtn = [
stocksTextAddBtn,
cryptoTextAddBtn,
forexTextAddBtn,
currentWeatherTextAddBtn,
dailyForecastTextAddBtn,
null,
null,
null,
null,
null,
null,
null,
messagesTextAddBtn,
];
allFeaturesTextAddBtn.map((value, index) => {
if (value !== null) {
value.addEventListener("click", () => {
var tag = document.createElement("li");
tag.innerHTML = allFeaturesText[index].value;
allFeatures[index].appendChild(tag);
changeVarValue();
addEventOnFeaturesList();
});
}
});

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

File diff suppressed because it is too large Load Diff

99
templates/index_old.html Normal file
View File

@ -0,0 +1,99 @@
<!DOCTYPE html>
<head>
<link rel="stylesheet" href='/static/style.css' />
<title>{{ title }}</title>
<style>p {color:gray}</style>
</head>
<body>
<center>
<h2>Stock Ticker Control Panel</h2>
<br><br>
<form action="/matrix" method="POST">
<input type="submit" name="Run Stocks" value="Run Stocks" style="height:50px" >
<input type="submit" name="Run Crypto" value="Run Crypto" style="height:50px" >
<input type="submit" name="Run Forex" value="Run Forex" style="height:50px" >
<input type="submit" name="Run News" value="Run News" style="height:50px" >
<input type="submit" name="Run Weather" value="Run Weather" style="height:50px" >
<input type="submit" name="Run Daily Weather" value="Run Daily Weather" style="height:50px" >
<input type="submit" name="Past NHL" value="Past NHL" style="height:50px" >
<input type="submit" name="Future NHL" value="Future NHL" style="height:50px" >
<input type="submit" name="Live NHL" value="Live NHL" style="height:50px" >
<input type="submit" name="Premier league table" value="Premier league table" style="height:50px" >
<input type="submit" name="Professional" value="Professional" style="height:50px" >
<input type="submit" name="All" value="All" style="height:50px" >
<input type="submit" name="Multiple" value="Multiple" style="height:50px" >
<input type="submit" name="Stop Display" value="Stop Display"style="height:50px">
<input type="submit" name="Shutdown the pi" value="Shutdown the pi"style="height:50px">
</form>
<br><br>
<br><br>
<p>Set the speed the image scrolls across the screen (s, m of f for slow, medium or fast)</p>
<form action="/Speed" method="POST">
<input name="text" placeholder="m"style="height:24px">
<input type="submit" value="Speed"style="height:30px">
</form>
<p>Set the brightness, an integer between 1 and 10, higher is brighter</p>
<form action="/Brightness" method="POST">
<input name="text" placeholder="10"style="height:24px">
<input type="submit" value="Brightness"style="height:30px">
</form>
<p>Display scrolling text. Enter the message followed by the rgb values seperated by commas. e.g. hello world!,255,255,0</p>
<form action="/DisplayText" method="POST">
<input name="text" placeholder="hello world!,255,255,0"style="height:24px">
<input type="submit" value="Display"style="height:30px">
</form>
<p>Set news search settings. keyword,category,country e.g. bitcoin,business,us </p>
<form action="/SetNews" method="POST">
<input name="text" placeholder="bitcoin,business,us"style="height:24px">
<input type="submit" value="Set"style="height:30px">
</form>
<p>Set weather location, enter city name e.g. London </p>
<form action="/SetWeather" method="POST">
<input name="text" placeholder="London"style="height:24px">
<input type="submit" value="Set"style="height:30px">
</form>
<p>Display a gif</p>
<form action="/DisplayGIF" method="POST" enctype=multipart/form-data>
<p><input type=file name=file style="height:30px">
<input type=submit value=Upload style="height:30px">
</form>
<p>Display an image</p>
<form action="/DisplayImage" method="POST" enctype=multipart/form-data>
<p><input type=file name=file style="height:30px">
<input type=submit value=Upload style="height:30px">
</form>
<br><br>
<h3>Tickers to display</h3>
<p>To change the tickers displayed please upload a CSV (comma separated value) file with 11 tickers on each row e.g</p>
<p>MSFT,NFLX,GOOG,TSLA,AAPL,INTC,TXN,HPQ,HOG,LUV,WMT</p>
<p>WMT,LUV,HOG,HPQ,TXN,INTC,AAPL,TSLA,GOOG,NFLX,MSFT</p>
<form action="/Ticker" method="POST" enctype=multipart/form-data>
<p><input type=file name=file style="height:30px">
<input type=submit value=Upload style="height:30px">
</form>
<br><br>
<h3>Logos</h3>
<p>Upload logo images (e.g "TICKER.png") or change the default images here</p>
<p>1) logos must be 32px in height and can be any width</p>
<p>2) "blank.png" is the space between stocks, default of 10x32px</p>
<p>3) "default.png" is the default logo to be used if no logo can be found</p>
<p>4) arrows (up/down.png) must be 16x14px</p>
<form action="/AddLogo" method="POST" enctype=multipart/form-data>
<p><input type=file name=file style="height:30px">
<input type=submit value=Upload style="height:30px">
</form>
</center>
</body>
</html>

165
templates/style.css Normal file
View File

@ -0,0 +1,165 @@
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html body {
max-width: 100%;
overflow-x: hidden;
}
html {
scroll-behavior: smooth;
}
body {
background-color: black;
}
/* Top logo bar */
header {
display: block;
margin-top: 30px;
border-bottom: 2px solid white;
padding-bottom: 20px;
}
.logo {
width: 200px;
height: 70px;
}
.update-btn,
.update-btn:hover {
background-color: gray;
float: right;
margin-top: 20px;
color: white;
}
/* General Ticker */
.buttons-list {
display: flex;
justify-content: space-around;
list-style-type: none;
}
.btn-stop-display,
.btn-stop-display:hover {
background-color: purple;
color: white;
}
.set-btn,
.set-btn:hover {
background-color: gray;
color: white;
}
.row-2 {
border-bottom: 2px solid white;
padding-bottom: 30px;
}
/* Features to display */
.features-div {
background-color: white;
padding-block: 10px;
height: 200px;
overflow-y: scroll;
}
.features-div-two {
background-color: white;
padding-block: 10px;
height: 370px;
overflow-y: scroll;
}
.display-features-list {
list-style-type: none;
}
.fa-chevron-right,
.fa-chevron-left,
.fa-chevron-up,
.fa-chevron-down,
.fa-minus {
background-color: gray;
padding: 10px;
}
.icons-list {
margin-block: 70px;
}
.icons-list a {
color: white;
}
.icons-list i {
cursor: pointer;
}
.display-features-list li:hover {
background-color: blue;
cursor: pointer;
}
.save-btn-div {
text-align: center;
margin-top: 60px;
}
.save-btn,
.save-btn:hover {
background-color: gray;
color: white;
padding-inline: 40px;
}
.footer {
text-align: center;
color: white;
margin-top: 120px;
}
li.active {
background-color: skyblue;
}
.row-1, .row-3{
margin-block: 50px;
}
/* Responsiveness */
@media (max-width: 767px) {
.buttons-list{
display: flex;
flex-wrap: wrap;
gap: 25px;
position: relative;
right: 20px;
}
.row-1, .row-3{
margin-block: 25px;
}
.screen-saver{
margin-block: 25px;
}
.display-none-div{
display: none;
}
.icons-list{
display: flex;
justify-content: center;
gap: 20px;
}
.icons-list a{
margin-left: -120px;
}
.remove{
margin-right: -100px;
margin-left: -100px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.icons-list a{
position: relative;
top: 10px;
}
}