From 5b5ecb6ff825365bc2e1f59078a140d2cbbc8e16 Mon Sep 17 00:00:00 2001 From: Sean Edmunds Date: Mon, 20 Dec 2021 15:33:20 -0600 Subject: [PATCH] Refactored code to move components out of index.js Added new folder structure --- src/index.js | 836 +-------------------------------------------------- 1 file changed, 5 insertions(+), 831 deletions(-) diff --git a/src/index.js b/src/index.js index a2fca0b1..75cd23c6 100644 --- a/src/index.js +++ b/src/index.js @@ -1,841 +1,15 @@ import React from 'react'; -import { useState, useEffect } from 'react'; import ReactDOM from 'react-dom'; -import { BrowserRouter, Routes, Route, matchPath } from "react-router-dom"; -import { Outlet, Link } from "react-router-dom"; +import { BrowserRouter } from "react-router-dom"; import './index.css'; +import './assets/functions.js' +import App from "./App.js"; -const setValueFromLocalStorage = property => { - let value = localStorage.getItem(property); - setValue(property, value); -}; -const setValue = (property, value) => { - if (value) { - document.documentElement.style.setProperty(`--${property}`, value); - const input = document.querySelector(`#${property}`); - if (input) { - value = value.replace('px', ''); - input.value = value; - } - } -}; - -function App() { - return ( - - ); -} - -function Homepage() { - setTheme(); - - return ( -
-
- -
-
-
-
-
- -
-
- -
-
- -
-
- ); -} - -function Search() { - return ( - - ) -} - -function Header(props) { - return ( - - ); -} - -const Applications = () => { - let data = (getApps()).apps; - return ( -
-

Applications

-
- {data.map((data) => ( - - ))} -
-
- - ); -} - -function Apps(props) { - - let classNameType = props.NSFW + "-content"; - let hrefUrl = "https://" + props.url; - let iconName = "mdi-" + props.icon; - return ( -
- -
-
- -
-
- {props.name} - {props.url} -
-
- -
- ); -} - -function Bookmarks() { - let bookmarkList = (getLinks()).bookmarks; - return ( - - ); -} - -function LinkGroups(props) { - let links = props.links; - return ( - - ); -} - -function LinkItem(props) { - return ( -
- {props.link.name} -
- ); -} - -function HideButton(props) { - if(props.checked === "true") { - return ( -
-
- ); - } else { - return ( -
-
- ); - } -} - -function Provider(props) { - return ( - - {props.provider.name} - {props.provider.prefix} - - ); -} - -function SettingsButton() { - setDisplayedItems(); - return ( - - ); -} - -function Settings() { - setTheme(); - var isChecked = localStorage.getItem("contenttype"); - return ( -
-
-

Settings

- - -
- -
- ); -} - -const PersonalizationSettings = () => { - const handleSubmit = (e) => { - e.preventDefault(); - }; - return ( -
-
-

Personalization

-

Personal details

-
-
- -
-

Greetings

-
- - - -
- - ); -}; - -function PersonalInfo() { - var personalData = getPersonalData(); - return ( - - ); -} - -function FormInput(props) { - let fname = props.fname; - let lname = props.lname; - let email = props.email; - return ( -
- - console.log()}> - - console.log()}> - - console.log()}> -
- ); -} - -function MessageInfo() { - let greetings = (require('./messages.json')).messages; - return ( -
- {greetings.map((greetings, index) => ( - - ))} -
- ); -} - -function Messages(props) { - - var eeChecked; - if(props.easterEgg === "TRUE") { - eeChecked = true; - } else if(props.easterEgg === "FALSE") { - eeChecked = false; - } else { - eeChecked = false; - } - return ( -
- - - - - - -
- ); -} - -const ApplicationSettings = () => { - let apps = (getApps()).apps - const handleSubmit = (e) => { - e.preventDefault(); - }; - return ( -
-
-

Applications

-
-
- {apps.map((apps) => ( - - ))} - - -
- - ); -} - -function ApplicationDetails(props) { - - var nsfwChecked; - if(props.NSFW === "NSFW") { - nsfwChecked = true; - } else if(props.easterEgg === "SAFE") { - nsfwChecked = false; - } else { - nsfwChecked = false; - } - return ( -
- - - - - - - - - - -
- ); -} - -const BookmarksSettings = () => { - let groups = (getLinks()).bookmarks; - const handleSubmit = (e) => { - e.preventDefault(); - }; - return ( -
-
-

Bookmarks

-
-
-
- {groups.map((groups) => ( - - ))} -
-
- -
- - ); -} - -function BookmarkGroups(props) { - let links = props.links; - return ( -
-

{props.category}

- {links.map((links) => ( - - ))} -
- ); -} - -function BookmarkDetails(props) { - return ( -
- - - - -
- ); -} - -function ThemesSettings() { - let themes = (getThemes()).themes; - console.log(themes[0].colorbackground); - return ( -
-

Themes

- -
- ); -} - -function ProviderSettings() { - let providers = (getProviders()).providers; - const handleSubmit = (e) => { - e.preventDefault(); - }; - return ( -
-
-

Providers

-
-
- {providers.map((providers) => ( - - ))} - - -
- - ); -} - -function ProvidersDetails(props) { - return ( -
- - - - - - -
- ); -} ReactDOM.render( - - } /> - }> - }/> - }/> - }/> - }/> - }/> - - + , document.getElementById('root') -); - -//Functions below this line are for calculating data for -//other functions - -function date() { - let currentDate = new Date(); - let dateOptions = { - weekday: "long", - year: "numeric", - month: "long", - day: "numeric" - }; - let date = currentDate.toLocaleDateString("en-GB", dateOptions); - return date; -} -function fixDigits(k) { - if (k < 10) { - return "0" + k; - } - else { - return k; - } -} -function greet() { - let currentTime = new Date(); - let greet = Math.floor(currentTime.getHours() / 6); - let easterEggChance = Math.floor(Math.random() * 100); - let greetings = require('./messages.json'); - let timeBased = []; - let easterEggs = []; - for (var i = 0; i < greetings.messages.length; i++) { - if (greetings.messages[i].easteregg === "FALSE") { - timeBased = timeBased.concat(greetings.messages[i]); - } else { - easterEggs = easterEggs.concat(greetings.messages[i]); - } - } - if (easterEggChance > 10) { - return timeBased[greet].message; - } else { - let easterEggText = Math.floor(Math.random() * easterEggs.length); - return easterEggs[easterEggText].message; - } -} -function Clock() { - const [date, setDate] = useState(new Date()); - - function refreshClock() { - setDate(new Date()); - } - useEffect(() => { - const timerId = setInterval(refreshClock, 1000); - return function cleanup() { - clearInterval(timerId); - }; - }, []); - - var hour = date.getHours(); - var minutes = date.getMinutes(); - //var seconds = date.getSeconds(); - var midday = "AM"; - midday = (hour >= 12) ? "PM" : "AM"; - hour = (hour === 0) ? 12 : ((hour > 12) ? (hour - 12) : hour); - minutes = fixDigits(minutes); - //seconds = fixDigits(seconds); - let time = hour + ":" + minutes + " " + midday; - - return ( -

{time}

- - ); -} -function getApps() { - let applications = require('./apps.json'); - return applications; -} -function getLinks() { - let links = require('./links.json'); - return links; -} -function getProviders() { - let providers = require('./providers.json'); - return providers; -} -function getThemes() { - let themes = require('./themes.json'); - return themes; -} -function getPersonalData() { - let personaldata = require('./personaldata.json'); - return personaldata; -} -function updateTheme(e) { - var themes = getThemes(); - var themeName = e.target.innerHTML.toLowerCase(); - var index = themes.themes.findIndex(function(item, i){ - return item.name === themeName; - }); - localStorage.setItem("image-background", themes.themes[index].imagebackground); - localStorage.setItem("color-background", themes.themes[index].colorbackground); - localStorage.setItem("color-search-background", themes.themes[index].colorserachbackground); - localStorage.setItem("color-text-pri",themes.themes[index].colortextpri); - localStorage.setItem("color-text-acc", themes.themes[index].colortextacc); - localStorage.setItem("color-border", themes.themes[index].colorborder); - - //document.documentElement.style.setProperty(prop, `var(--${themeName}${prop.substring(10)})`); - setTheme(); -} -function setTheme() { - if(localStorage.getItem("color-background") === null) { - localStorage.setItem("image-background", ""); - localStorage.setItem("color-background", "#ffffff"); - localStorage.setItem("color-search-background", "#22222220"); - localStorage.setItem("color-text-pri", "#222222"); - localStorage.setItem("color-text-acc", "#dddddd"); - localStorage.setItem("color-border", "#dddddd"); - } else { - setValueFromLocalStorage('image-background'); - setValueFromLocalStorage('color-background'); - setValueFromLocalStorage('color-search-background'); - setValueFromLocalStorage('color-text-pri'); - setValueFromLocalStorage('color-text-acc'); - setValueFromLocalStorage('color-border'); - setValueFromLocalStorage('content-display'); - } - -} -function handleKeyPress(e) { - var sindex = 0; - var cycle = false; - var key = e.keyCode || e.which; - var text = e.target.value.replaceAll("+", "%2B"); - var option = text.substr(1, text.indexOf(' ') - 1) || text.substr(1); - var subtext = text.substr(2 + option.length); - if (key === 13) { // Search functions - search(text); - } - if (key === 9) { // Tab Completion Functions - e.preventDefault(); - e.stopPropagation(); - if (text[0] === ';') { - switch (option) { - case 't': - var streamers = ['admiralbahroo', 'moonmoon_ow', 'witwix']; - if (!subtext || cycle) { - cycle = true; - if (sindex > streamers.length - 1) sindex = 0; - document.getElementById("keywords").value = ';t ' + streamers[sindex++]; - return; - } - for (var streamer of streamers) { - if (subtext === streamer.substr(0, subtext.length)) { - document.getElementById("keywords").value = ';t ' + streamer; - return; - } - } - break; - default : - break; - } - } - } - if(key === 32){ //Space to go to search - updateLabel(text); - } - sindex = 0; - cycle = false; - updateLabel(text); -} -function updateLabel(text) { - var option = text.substr(1, text.indexOf(' ') - 1) || text.substr(1); - if (text[0] === '/') { -// if (text.indexOf(' ') > -1) { - switch (option) { - case "am": - document.getElementById("searchType").innerHTML = "Allmusic search"; - break; - case "d": - document.getElementById("searchType").innerHTML = "Duck Duck Go search"; - break; - case "di": - document.getElementById("searchType").innerHTML = "Discogs search"; - break; - case "i": - document.getElementById("searchType").innerHTML = "IMDB search"; - break; - case "m": - document.getElementById("searchType").innerHTML = "TheMovieDB search"; - break; - case "r": - document.getElementById("searchType").innerHTML = "Reddit search"; - break; - case "q": - document.getElementById("searchType").innerHTML = "Qwant search"; - break; - case "so": - document.getElementById("searchType").innerHTML = "Soundcloud search"; - break; - case "s": - document.getElementById("searchType").innerHTML = "Spotify search"; - break; - case "tv": - document.getElementById("searchType").innerHTML = "TheTVDB search"; - break; - case "t": - document.getElementById("searchType").innerHTML = "Trakt search"; - break; - case "y": - document.getElementById("searchType").innerHTML = "YouTube search"; - break; - case "w": - document.getElementById("searchType").innerHTML = "Wikipedia search"; - break; - case "p": - document.getElementById("searchType").innerHTML = "Plex search"; - break; - case "rt": - document.getElementById("searchType").innerHTML = "Rotten Tomatoes search"; - break; - default: - document.getElementById("searchType").innerHTML = "Invalid search"; - break; - } -}else { - document.getElementById("searchType").innerHTML = "Google search"; - } -} -function search(text) { - if (text[0] === '/') { - if (text.indexOf(' ') > -1) { - let option = text.substr(1, text.indexOf(' ') - 1) || text.substr(1); - var subtext = text.substr(2 + option.length); - switch (option) { - case "am": - window.location = "https://www.allmusic.com/search/all/" + subtext; - break; - case "d": - window.location = "https://duckduckgo.com/?q=" + subtext; - break; - case "di": - window.location = "https://www.discogs.com/search/?q=" + subtext; - break; - case "i": - window.location = "https://www.imdb.com/find?q=" + subtext; - break; - case "m": - window.location = "https://www.themoviedb.org/search?query=" + subtext; - break; - case "r": - window.location = "https://www.reddit.com/search?q=" + subtext; - break; - case "q": - window.location = "https://www.qwant.com/?q=" + subtext; - break; - case "so": - window.location = "https://soundcloud.com/search?q=" + subtext; - break; - case "s": - window.location = "https://open.spotify.com/search/results/" + subtext; - break; - case "t": - window.location = "https://trakt.tv/search?query=" + subtext; - break; - case "tv": - window.location = "https://www.thetvdb.com/search?query=" + subtext; - break; - case "y": - window.location = "https://www.youtube.com/results?search_query=" + subtext; - break; - case "w": - window.location = "https://en.wikipedia.org/w/index.php?search=" + subtext; - break; - case "p": - window.location = "https://app.plex.tv/desktop/#!/search?query=" + subtext; - break; - case "rt": - window.location = "https://www.rottentomatoes.com/search?search=" + subtext; - break; - default : - break; - } - } else { - let option = text.substr(1); - switch (option) { - case "d": - window.location = "https://www.duckduckgo.com"; - break; - case "y": - window.location = "https://www.youtube.com"; - break; - case "r": - window.location = "https://reddit.com"; - break; - case "s": - window.location = "https://open.spotify.com"; - break; - default : - break; - } - } - } else if (validURL(text)) { - if (containsProtocol(text)) - window.location = text; - else - window.location = "https://" + text; - } else { - window.location = "https://www.google.com/search?q=" + text; - } -} -function validURL(str) { - var pattern = new RegExp('^(https?:\\/\\/)?' + // protocol - '((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|' + // domain name - '((\\d{1,3}\\.){3}\\d{1,3}))' + // OR ip (v4) address - '(\\:\\d+)?(\\/[-a-z\\d%_.~+]*)*' + // port and path - '(\\?[;&a-z\\d%_.~+=-]*)?' + // query string - '(\\#[-a-z\\d_]*)?$', 'i'); // fragment locator - return !!pattern.test(str); -} -function containsProtocol(str) { - var pattern = new RegExp('^(https?:\\/\\/){1}.*', 'i'); - return !!pattern.test(str); -} -String.prototype.replaceAll = function(search, replacement) { - var target = this; - return target.split(search).join(replacement); -}; -function udpateDisplayedItems(e) { - localStorage.setItem('contenttype', e.target.checked); - if (e.target.checked) { - localStorage.setItem('content-display', 'none'); - } else { - localStorage.setItem('content-display', 'block'); - } - setDisplayedItems(); -} -function setDisplayedItems() { - setValueFromLocalStorage('contenttype'); - setValueFromLocalStorage('content-display'); -} +); \ No newline at end of file