From e6db488aa6572f7eb377551578ed95d5ff0b88a2 Mon Sep 17 00:00:00 2001 From: Justin Date: Wed, 16 Aug 2023 16:22:39 +0800 Subject: [PATCH] r/place frontend added --- static/app.js | 62 ++++++++++++++++++++++++++++++++++++++++++++++++--- 1 file changed, 59 insertions(+), 3 deletions(-) diff --git a/static/app.js b/static/app.js index 58a2605..906ae84 100755 --- a/static/app.js +++ b/static/app.js @@ -52,6 +52,7 @@ var economicFeatures = document.querySelectorAll("#economic-list li"); var jokesFeatures = document.querySelectorAll("#jokes-list li"); var marketFeatures = document.querySelectorAll("#market-list li"); var sectorFeatures = document.querySelectorAll("#sector-list li"); +var placeFeatures = document.querySelectorAll("#place-list li"); var allFeaturesList = [ stocksFeatures, @@ -75,6 +76,7 @@ var allFeaturesList = [ jokesFeatures, marketFeatures, sectorFeatures, + placeFeatures, ]; // features remove buttons @@ -105,6 +107,7 @@ var economicRemoveBtn = document.getElementById("economic-remove-btn"); var jokesRemoveBtn = document.getElementById("jokes-remove-btn"); var marketRemoveBtn = document.getElementById("market-remove-btn"); var sectorRemoveBtn = document.getElementById("sector-remove-btn"); +var placeRemoveBtn = document.getElementById("place-remove-btn"); var allFeaturesRemoveBtns = [ stocksRemoveBtn, @@ -128,6 +131,7 @@ var allFeaturesRemoveBtns = [ jokesRemoveBtn, marketRemoveBtn, sectorRemoveBtn, + placeRemoveBtn, ]; // features increase buttons var stocksincreaseBtn = document.getElementById("stocks-increase-btn"); @@ -157,6 +161,7 @@ var economicincreaseBtn = document.getElementById("economic-increase-btn"); var jokesincreaseBtn = document.getElementById("jokes-increase-btn"); var marketincreaseBtn = document.getElementById("market-increase-btn"); var sectorincreaseBtn = document.getElementById("sector-increase-btn"); +var placeincreaseBtn = document.getElementById("place-increase-btn"); var allFeaturesIncreaseBtns = [ stocksincreaseBtn, @@ -180,6 +185,7 @@ var allFeaturesIncreaseBtns = [ jokesincreaseBtn, marketincreaseBtn, sectorincreaseBtn, + placeincreaseBtn, ]; // features decrease buttons @@ -210,6 +216,7 @@ var economicDecreaseBtn = document.getElementById("economic-decrease-btn"); var jokesDecreaseBtn = document.getElementById("jokes-decrease-btn"); var marketDecreaseBtn = document.getElementById("market-decrease-btn"); var sectorDecreaseBtn = document.getElementById("sector-decrease-btn"); +var placeDecreaseBtn = document.getElementById("place-decrease-btn"); var allFeaturesDecreaseBtns = [ stocksDecreaseBtn, @@ -233,6 +240,7 @@ var allFeaturesDecreaseBtns = [ jokesDecreaseBtn, marketDecreaseBtn, sectorDecreaseBtn, + placeDecreaseBtn, ]; const changeVarValue = () => { @@ -263,6 +271,7 @@ const changeVarValue = () => { jokesFeatures = document.querySelectorAll("#jokes-list li"); marketFeatures = document.querySelectorAll("#market-list li"); sectorFeatures = document.querySelectorAll("#sector-list li"); + placeFeatures = document.querySelectorAll("#place-list li"); allFeaturesList = [ stocksFeatures, @@ -286,6 +295,7 @@ const changeVarValue = () => { jokesFeatures, marketFeatures, sectorFeatures, + placeFeatures, ]; }; @@ -667,6 +677,7 @@ var economics = document.getElementById("economic-list"); var jokes = document.getElementById("jokes-list"); var market = document.getElementById("market-list"); var sector = document.getElementById("sector-list"); +var place = document.getElementById("place-list"); var allFeatures = [ stocks, @@ -690,6 +701,7 @@ var allFeatures = [ jokes, market, sector, + place, ]; // features select box @@ -703,6 +715,7 @@ var economicSelect = document.getElementById("inputTransition2222"); var jokesSelect = document.getElementById("jokes-categories"); var marketSelect = document.getElementById("market-categories"); var sectorSelect = document.getElementById("sector-categories"); +var placeSelect = document.getElementById("place-categories"); var allFeaturesSelectBox = [ null, null, @@ -725,6 +738,7 @@ var allFeaturesSelectBox = [ jokesSelect, marketSelect, sectorSelect, + placeSelect, ]; // features select add buttons @@ -737,6 +751,7 @@ var economicAddBtn = document.getElementById("economic-countries-btn"); var jokesAddBtn = document.getElementById("jokes-categories-btn"); var marketAddBtn = document.getElementById("market-categories-btn"); var sectorAddBtn = document.getElementById("sector-categories-btn"); +var placeAddBtn = document.getElementById("place-categories-btn"); var allFeaturesSelectAddBtn = [ null, @@ -760,6 +775,7 @@ var allFeaturesSelectAddBtn = [ jokesAddBtn, marketAddBtn, sectorAddBtn, + placeAddBtn, ]; allFeaturesSelectAddBtn.map((value, index) => { @@ -801,6 +817,7 @@ var allFeaturesFile = [ null, null, null, + null, ]; // features file add button var imagesFileAddBtn = document.getElementById("inputTextBtn11"); @@ -828,6 +845,7 @@ var allFeaturesFileAddBtn = [ null, null, null, + null, ]; // features input text @@ -862,6 +880,7 @@ var allFeaturesText = [ null, null, null, + null, ]; // features text add button @@ -896,6 +915,7 @@ var allFeaturesTextAddBtn = [ null, null, null, + null, ]; @@ -921,6 +941,7 @@ var allFeaturesLimit = [ null, null, null, + null, ]; @@ -1197,6 +1218,7 @@ function getFeatureSettings() { "Jokes", "Gainers, Losers, Active", "Sector Performance", + "r/place (Reddit)", ]; let pageNum = features.indexOf(feature) + 1; let pageSelector = "Page" + pageNum.toString(); @@ -1271,6 +1293,9 @@ function getFeatureSettings() { case 21: s = getSectorSettings(page); break; + case 22: + s = getPlaceSettings(page); + break; } settings = { ...settings, ...s }; // merge both sets of settings @@ -1470,6 +1495,7 @@ function saveMovieAPIKey(){ "Jokes", "Gainers, Losers, Active", "Sector Performance", + "r/place (Reddit)", ]; let pageNum = features.indexOf(feature) + 1; let pageSelector = "Page" + pageNum.toString(); @@ -1515,6 +1541,7 @@ function saveIpoAPIKey(){ "Jokes", "Gainers, Losers, Active", "Sector Performance", + "r/place (Reddit)", ]; let pageNum = features.indexOf(feature) + 1; let pageSelector = "Page" + pageNum.toString(); @@ -1990,7 +2017,7 @@ inputAnimationBtn.addEventListener("click", () => { // scroll speed row two let inputScrollSpeedRow = []; -for (let i = 1; i <= 21; i++) { +for (let i = 1; i <= 22; i++) { inputScrollSpeedRow.push( document.getElementById( i === 1 ? "inputScrollSpeedRow" : `inputScrollSpeedRow${i}` @@ -3358,7 +3385,7 @@ function featureSavePrompt() { const pageIDs = ['Page1', 'Page2', 'Page3', 'Page4', 'Page5', 'Page6', 'Page7', 'Page8', 'Page9', 'Page10', 'Page11', 'Page12', 'Page13', - 'Page14', 'Page15', 'Page16', 'Page17', 'Page18', 'Page19', 'Page20', 'Page21']; + 'Page14', 'Page15', 'Page16', 'Page17', 'Page18', 'Page19', 'Page20', 'Page21', 'Page22']; for (const pageID of pageIDs) { // Select the parent div @@ -3366,7 +3393,7 @@ for (const pageID of pageIDs) { // Add event listeners to select menus const excludedIds = ['base-select', 'quote-select', 'commodities-items', 'indices-items', 'inputTransition73', 'inputTransition83', 'inputTransition93', 'inputTransition103', 'inputTransition2222', 'jokes-categories', 'golf-ranking-number', - 'inputScrollSpeed16', 'inputScrollSpeed17', 'inputScrollSpeed19BG', 'market-categories', 'sector-categories']; + 'inputScrollSpeed16', 'inputScrollSpeed17', 'inputScrollSpeed19BG', 'market-categories', 'sector-categories', 'place-categories']; const selectMenus = parentDiv.querySelectorAll('select'); selectMenus.forEach(selectMenu => { @@ -3377,6 +3404,22 @@ for (const pageID of pageIDs) { }); } }); + // Add event listeners for input text fields specifically for page22 (r/place) + if (pageID === 'Page22') { + const inputForms = parentDiv.querySelectorAll('input[type="text"]'); + inputForms.forEach(inputForm => { + inputForm.addEventListener('input', function(event) { + displaySavePrompt2(); + }); + }); + } + // Add event listeners for sliders specifically for page22 (r/place) + if (pageID === 'Page22') { + const slider = parentDiv.querySelector('#myRange'); + slider.addEventListener('input', function(event) { + displaySavePrompt2(); + }); + } // Add event listeners to input checkboxes const inputForms = parentDiv.querySelectorAll('input[type="checkbox"]'); inputForms.forEach(inputForm => { @@ -3489,3 +3532,16 @@ function uploadCryptoLogo() { } } + + +// TO GET SLIDER VALUE FOR IMAGE WIDTH IN R/PLACE +var slider = document.getElementById("myRange"); +var output = document.getElementById("slider-value"); +output.innerHTML = slider.value; // Display the default slider value + +// Update the current slider value (each time you drag the slider handle) +slider.oninput = function() { + output.innerHTML = this.value; +} + +