fintic-tracker/static/app.js
2021-10-05 20:29:05 +01:00

784 lines
23 KiB
JavaScript

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)
});
});
var shutdownButton = document.getElementById("shutdown-btn");
shutdownButton.addEventListener("click", () => {
fetch("/shutdown", {
method:"GET",
});
});
var stopButton = document.getElementById("stop-btn");
stopButton.addEventListener("click", () => {
fetch("/stop", {
method:"GET",
});
});
var dispFormatButton = document.getElementById("dispformat-btn");
var displayFormats = document.getElementById("inputDisplayFormat");
// gets selected functions to display
function getSelected(selector) {
var opt;
for ( var i = 0, len = selector.options.length; i < len; i++ ) {
opt = selector.options[i];
if ( opt.selected === true ) {
break;
}
}
return opt.innerHTML;
}
function getListItems(list_el) {
let symbols = list_el.getElementsByTagName("li");
let items = []
for (var i = 0; i < symbols.length; ++i) {
items.push(symbols[i].innerText);
}
return items;
}
// toggle professional
dispFormatButton.addEventListener("click", () => {
opt = getSelected(displayFormats);
fetch("/display_format", {
method:"PUT",
body:JSON.stringify(opt)
});
});
// saves the feature specific settings
function saveSettings() {
let featureSelector = document.getElementById("drop");
feature = getSelected(featureSelector);
let features = ["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"];
let pageNum = features.indexOf(feature) + 1;
let pageSelector = "Page" + pageNum.toString();
let page = document.getElementById(pageSelector);
// these common to all settings
let speed = getSelected(page.querySelectorAll(".speed-select")[0]);
let animation = getSelected(page.querySelectorAll(".animation-select")[0]);
var settings = {'feature': feature, 'speed':speed, 'animation':animation}; // general settings
var s;
//function specific settings
switch(pageNum){
case 1: case 2: case 3:
s = getTradingSettings(page);
break;
case 4: case 5:
s = getWeatherSettings(page);
break;
case 6:
s = getNewsSettings(page);
break;
case 7: case 8: case 9: case 10:
s = getSportsSettings(page);
break;
case 11: case 12:
s = getImageSettings(page);
break;
case 13:
s = getMessageSettings(page);
break;
}
settings = {...settings, ...s}; // merge both sets of settings
console.log(settings);
fetch("/feature_settings", {
method:"PUT",
body:JSON.stringify(settings)
});
}
let saveSettingsButtons = document.querySelectorAll(".save-btn-div").forEach(button =>
button.addEventListener("click", saveSettings)
)
// gets the stock, crypto or forex specific settings
function getTradingSettings(page) {
// get all the tick boxes
let percent = page.querySelectorAll(".percent-select")[0].checked;
let point = page.querySelectorAll(".point-select")[0].checked;
let no_logos = page.querySelectorAll(".logo-select")[0].checked;
let chart = page.querySelectorAll(".chart-select")[0].checked;
let title = page.querySelectorAll(".title-select")[0].checked;
let symbols_el = page.querySelectorAll(".symbol-list")[0];
let symbols = getListItems(symbols_el);
let settings = {'percent': percent, 'point':point, 'logos':no_logos, 'chart':chart, 'title': title, 'symbols': symbols}
return settings;
}
// gets the current wether and forecast settings
function getWeatherSettings(page) {
let temp = getSelected(page.querySelectorAll(".temp-select")[0]);
let speed = getSelected(page.querySelectorAll(".wind-speed-select")[0]);
let colour = getSelected(page.querySelectorAll(".colour-select")[0]);
let city_colour = getSelected(page.querySelectorAll(".city-colour-select")[0]);
let title = page.querySelectorAll(".title-select")[0].checked;
settings = {'temp':temp, 'wind_speed': speed, 'colour':colour, 'city_colour':city_colour, 'title': title}
//only for daily weather
try {
current_weather = page.querySelectorAll(".current-weather-select")[0].checked;
console.log(current_weather);
settings['current_weather'] = current_weather;
} catch {
}
let locations_el = page.querySelectorAll(".location-list")[0];
let locations = getListItems(locations_el);
settings['locations'] = locations;
return settings;
}
function getNewsSettings(page){
let country = getSelected(page.querySelectorAll(".country-select")[0]);
let category = getSelected(page.querySelectorAll(".category-select")[0]);
let title = page.querySelectorAll(".title-select")[0].checked;
let use_sources = page.querySelectorAll(".sources-select")[0].checked;
let sources_el = page.querySelectorAll(".sources-list")[0];
let sources = getListItems(sources_el);
settings = {'country':country, 'category': category, 'title':title, 'use_sources':use_sources, 'sources': sources};
return settings;
}
function getSportsSettings(page){
let title = page.querySelectorAll(".title-select")[0].checked;
let leagues_el = page.querySelectorAll(".league-list")[0];
leagues = getListItems(leagues_el);
settings = {'title':title, 'leagues':leagues};
return settings;
}
//images and GIFs
function getImageSettings(page){
let pause = page.querySelectorAll(".pause-select")[0].value;
let title = page.querySelectorAll(".title-select")[0].checked;
let images_el = page.querySelectorAll(".image-list")[0];
images = getListItems(images_el);
settings = {'title':title, 'pause':pause, 'images':images};
return settings;
}
function getMessageSettings(page) {
}