diff --git a/.github/labeler.yml b/.github/labeler.yml index 8d5534106..51e5c8b82 100644 --- a/.github/labeler.yml +++ b/.github/labeler.yml @@ -1,4 +1,4 @@ CI: - - .github/ + - .github/ MAIN: -- src/ + - src/ diff --git a/.github/workflows/desktop.yml b/.github/workflows/desktop.yml index 3f81be7c7..04b451c82 100644 --- a/.github/workflows/desktop.yml +++ b/.github/workflows/desktop.yml @@ -1,7 +1,7 @@ name: publish on: workflow_dispatch: - + jobs: Build-Deploy: runs-on: ubuntu-latest @@ -28,7 +28,7 @@ jobs: with: name: production-files path: ./build - + publish-tauri: needs: Build-Deploy strategy: @@ -46,7 +46,7 @@ jobs: with: node-version: 16 cache: npm - + - name: Download artifact uses: actions/download-artifact@v3 with: diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md index bf64d3968..40861b80b 100644 --- a/CODE_OF_CONDUCT.md +++ b/CODE_OF_CONDUCT.md @@ -17,23 +17,23 @@ diverse, inclusive, and healthy community. Examples of behavior that contributes to a positive environment for our community include: -* Demonstrating empathy and kindness toward other people -* Being respectful of differing opinions, viewpoints, and experiences -* Giving and gracefully accepting constructive feedback -* Accepting responsibility and apologizing to those affected by our mistakes, +- Demonstrating empathy and kindness toward other people +- Being respectful of differing opinions, viewpoints, and experiences +- Giving and gracefully accepting constructive feedback +- Accepting responsibility and apologizing to those affected by our mistakes, and learning from the experience -* Focusing on what is best not just for us as individuals, but for the +- Focusing on what is best not just for us as individuals, but for the overall community Examples of unacceptable behavior include: -* The use of sexualized language or imagery, and sexual attention or +- The use of sexualized language or imagery, and sexual attention or advances of any kind -* Trolling, insulting or derogatory comments, and personal or political attacks -* Public or private harassment -* Publishing others' private information, such as a physical or email +- Trolling, insulting or derogatory comments, and personal or political attacks +- Public or private harassment +- Publishing others' private information, such as a physical or email address, without their explicit permission -* Other conduct which could reasonably be considered inappropriate in a +- Other conduct which could reasonably be considered inappropriate in a professional setting ## Enforcement Responsibilities @@ -106,7 +106,7 @@ Violating these terms may lead to a permanent ban. ### 4. Permanent Ban **Community Impact**: Demonstrating a pattern of violation of community -standards, including sustained inappropriate behavior, harassment of an +standards, including sustained inappropriate behavior, harassment of an individual, or aggression toward or disparagement of classes of individuals. **Consequence**: A permanent ban from any sort of public interaction within diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 5fcd8f42e..ae8643b18 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -3,6 +3,7 @@ ## Getting started Before you begin: + - This site is powered โšก by React.js - Check out the [existing issues](https://github.com/blueedgetechno/win11React/issues), [pull requests](https://github.com/blueedgetechno/win11React/pulls) and [discussions](https://github.com/blueedgetechno/win11React/discussions). - Check the [already existing and upcoming features](https://github.com/blueedgetechno/win11React#features). @@ -22,11 +23,13 @@ If you spot something new, [open an issue](https://github.com/blueedgetechno/win - Fork with [GitHub Codespaces](https://github.com/features/codespaces): ### Open a pull request + When you're done making changes and you'd like to propose them for review, use the [pull request tab](https://github.com/blueedgetechno/win11React/pulls) to open your PR. Once you submit your PR, we will review it with you. The first thing you're going to want to do is a self review ๐Ÿงพ. ### Your PR is merged! + Congratulations ๐ŸŽŠ! Once your PR is merged, you will be proudly listed as a contributor in the [contributor chart](https://github.com/blueedgetechno/win11React/graphs/contributors). diff --git a/SECURITY.md b/SECURITY.md index 59c025f1b..02e21f1ec 100644 --- a/SECURITY.md +++ b/SECURITY.md @@ -1,7 +1,7 @@ # Security Policy - ## Reporting a Vulnerability + We highly value security and User Experience for this project. If you find a security vulnerability in the Win11react project, any minor issues, bugs, or want a new feature to be added, feel free to do so on our issues section.
If you have want to discuss something, take a look at the discussion section of the github repo. diff --git a/crowdin.yml b/crowdin.yml index f158b2408..6a5c4beda 100644 --- a/crowdin.yml +++ b/crowdin.yml @@ -1,4 +1,4 @@ -project_id: '506638' +project_id: "506638" api_token_env: api_token preserve_hierarchy: true files: diff --git a/index.html b/index.html index 930008a8b..05aa91d43 100644 --- a/index.html +++ b/index.html @@ -29,7 +29,7 @@ - + - - + + + diff --git a/public/console.js b/public/console.js index 6fef26df5..d6c290ff7 100644 --- a/public/console.js +++ b/public/console.js @@ -16,9 +16,9 @@ window.pythonRunner = new BrythonRunner({ stdin: { async readline() { var userInput = prompt(); - console.log('Received StdIn: ' + userInput); + console.log("Received StdIn: " + userInput); return userInput; }, }, - onInit() {} + onInit() {}, }); diff --git a/public/dycalendar.css b/public/dycalendar.css index 4e2581e1d..523794ad1 100644 --- a/public/dycalendar.css +++ b/public/dycalendar.css @@ -86,11 +86,15 @@ background: var(--bgHvr); } -.dycalendar-month-container .dycalendar-header .dycalendar-prev-next-btn.prev-btn { +.dycalendar-month-container + .dycalendar-header + .dycalendar-prev-next-btn.prev-btn { right: 40px; } -.dycalendar-month-container .dycalendar-header .dycalendar-prev-next-btn.next-btn { +.dycalendar-month-container + .dycalendar-header + .dycalendar-prev-next-btn.next-btn { right: 0; } @@ -108,7 +112,11 @@ border-radius: 50%; } -.dycalendar-month-container .dycalendar-body table tr:not(:first-child) td:not(.dycalendar-today-date):hover { +.dycalendar-month-container + .dycalendar-body + table + tr:not(:first-child) + td:not(.dycalendar-today-date):hover { background: var(--bgHvr); } diff --git a/public/dycalendar.js b/public/dycalendar.js index 7d734abeb..ed1c75b74 100644 --- a/public/dycalendar.js +++ b/public/dycalendar.js @@ -12,35 +12,62 @@ * Date: 2014-08-17 sunday */ /*! dyCalendarJS | (c) 2016 Yusuf Shakeel | https://github.com/yusufshakeel/dyCalendarJS */ -(function(global) { - +(function (global) { "use strict"; - var - //this will be used by the user. + var //this will be used by the user. dycalendar = {}, - //window document document = global.document, - //starting year START_YEAR = 1900, - //end year END_YEAR = 9999, - //name of the months monthName = { - full: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'], - mmm: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] + full: [ + "January", + "February", + "March", + "April", + "May", + "June", + "July", + "August", + "September", + "October", + "November", + "December", + ], + mmm: [ + "Jan", + "Feb", + "Mar", + "Apr", + "May", + "Jun", + "Jul", + "Aug", + "Sep", + "Oct", + "Nov", + "Dec", + ], }, - //name of the days dayName = { - full: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'], - d: ['S', 'M', 'T', 'W', 'T', 'F', 'S'], - dd: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'], - ddd: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'] + full: [ + "Sunday", + "Monday", + "Tuesday", + "Wednesday", + "Thursday", + "Friday", + "Saturday", + ], + d: ["S", "M", "T", "W", "T", "F", "S"], + dd: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], + ddd: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], }; /** @@ -51,10 +78,7 @@ * @return html */ function createMonthTable(data, option) { - - var - table, tr, td, - r, c, count; + var table, tr, td, r, c, count; table = document.createElement("table"); tr = document.createElement("tr"); @@ -85,11 +109,19 @@ while (c <= 6) { td = document.createElement("td"); td.innerHTML = count; - if (option.date === count && option.month === data.monthIndex && option.highlighttargetdate === true) { + if ( + option.date === count && + option.month === data.monthIndex && + option.highlighttargetdate === true + ) { td.setAttribute("class", "dycalendar-target-date"); } - if (data.today.date === count && data.today.monthIndex === data.monthIndex && option.highlighttoday === true) { + if ( + data.today.date === count && + data.today.monthIndex === data.monthIndex && + option.highlighttoday === true + ) { td.setAttribute("class", "dycalendar-today-date"); } @@ -107,13 +139,21 @@ table.appendChild(tr); return table; } - td = document.createElement('td'); + td = document.createElement("td"); td.innerHTML = count; - if (option.date === count && option.month === data.monthIndex && option.highlighttargetdate === true) { + if ( + option.date === count && + option.month === data.monthIndex && + option.highlighttargetdate === true + ) { td.setAttribute("class", "dycalendar-target-date"); } - if (data.today.date === count && data.today.monthIndex === data.monthIndex && option.highlighttoday === true) { + if ( + data.today.date === count && + data.today.monthIndex === data.monthIndex && + option.highlighttoday === true + ) { td.setAttribute("class", "dycalendar-today-date"); } @@ -134,10 +174,7 @@ * @return html */ function drawCalendarMonthTable(data, option) { - - var - table, - div, container, elem; + var table, div, container, elem; //get table table = createMonthTable(data, option); @@ -215,9 +252,7 @@ * @return html */ function drawCalendarDay(data, option) { - - var - div, container, elem; + var div, container, elem; //calendar container container = document.createElement("div"); @@ -302,9 +337,7 @@ * @return boolean|object if error return false, else calendar detail */ function getCalendar(year, month, date) { - - var - dateObj = new Date(), + var dateObj = new Date(), dateString, result = {}, idx; @@ -378,34 +411,40 @@ result.targetedDayFullName = dayName.full[idx]; return result; - } /** * this function will handle the on click event. */ function onClick() { - - document.body.onclick = function(e) { - + document.body.onclick = function (e) { //get event object (window.event for IE compatibility) e = global.event || e; - var - //get target dom object reference + var //get target dom object reference targetDomObject = e.target || e.srcElement, - //other variables - date, month, year, btn, option, dateObj; + date, + month, + year, + btn, + option, + dateObj; //prev-next button click //extra checks to make sure object exists and contains the class of interest - if ((targetDomObject) && (targetDomObject.classList) && (targetDomObject.classList.contains("dycalendar-prev-next-btn"))) { + if ( + targetDomObject && + targetDomObject.classList && + targetDomObject.classList.contains("dycalendar-prev-next-btn") + ) { date = parseInt(targetDomObject.getAttribute("data-date")); month = parseInt(targetDomObject.getAttribute("data-month")); year = parseInt(targetDomObject.getAttribute("data-year")); btn = targetDomObject.getAttribute("data-btn"); - option = JSON.parse(targetDomObject.parentElement.getAttribute("data-option")); + option = JSON.parse( + targetDomObject.parentElement.getAttribute("data-option") + ); if (btn === "prev") { month = month - 1; @@ -413,8 +452,7 @@ year = year - 1; month = 11; } - } - else if (btn === "next") { + } else if (btn === "next") { month = month + 1; if (month > 11) { year = year + 1; @@ -431,8 +469,14 @@ //month click //extra checks to make sure object exists and contains the class of interest - if ((targetDomObject) && (targetDomObject.classList) && (targetDomObject.classList.contains("dycalendar-span-month-year"))) { - option = JSON.parse(targetDomObject.parentElement.getAttribute("data-option")); + if ( + targetDomObject && + targetDomObject.classList && + targetDomObject.classList.contains("dycalendar-span-month-year") + ) { + option = JSON.parse( + targetDomObject.parentElement.getAttribute("data-option") + ); dateObj = new Date(); option.date = dateObj.getDate(); @@ -465,19 +509,15 @@ * @param object option user preferences * @return boolean true if success, false otherwise */ - dycalendar.draw = function(option) { - + dycalendar.draw = function (option) { //check if option is passed or not if (typeof option === "undefined") { global.console.error("Option missing"); return false; } - var - self = this, //pointing at dycalendar object - + var self = this, //pointing at dycalendar object dateObj = new Date(), - //default settings defaults = { type: "day", @@ -488,14 +528,13 @@ dayformat: "full", highlighttoday: false, highlighttargetdate: false, - prevnextbutton: "hide" + prevnextbutton: "hide", }; //extend user options with predefined options option = extendSource(option, defaults); drawCalendar(option); - }; //------------------------------ dycalendar.draw() ends here ------------ @@ -504,16 +543,15 @@ * this function will draw the calendar inside the target container. */ function drawCalendar(option) { - - var - //variables for creating calendar + var //variables for creating calendar calendar, calendarHTML, targetedElementBy = "id", targetElem, - //other variables - i, len, elemArr; + i, + len, + elemArr; //find target element by if (option.target[0] === "#") { @@ -546,16 +584,12 @@ //draw calendar if (targetedElementBy === "id") { - document.getElementById(targetElem).innerHTML = calendarHTML.outerHTML; - } else if (targetedElementBy === "class") { - elemArr = document.getElementsByClassName(targetElem); for (i = 0, len = elemArr.length; i < len; i = i + 1) { elemArr[i].innerHTML = calendarHTML.outerHTML; } - } } @@ -564,5 +598,4 @@ //attach to global window object global.dycalendar = dycalendar; - -}(typeof window !== "undefined" ? window : this)); +})(typeof window !== "undefined" ? window : this); diff --git a/public/google5c2eff7d87cfc5e5.html b/public/google5c2eff7d87cfc5e5.html index 1b3205d04..440ca5681 100644 --- a/public/google5c2eff7d87cfc5e5.html +++ b/public/google5c2eff7d87cfc5e5.html @@ -1 +1 @@ -google-site-verification: google5c2eff7d87cfc5e5.html \ No newline at end of file +google-site-verification: google5c2eff7d87cfc5e5.html diff --git a/public/script.js b/public/script.js index a729ac5d8..99034fd2a 100644 --- a/public/script.js +++ b/public/script.js @@ -11,6 +11,6 @@ function process() { } function processInterval() { - setTimeout(process, Math.random() * (1000 - 500) + 500) + setTimeout(process, Math.random() * (1000 - 500) + 500); } -processInterval(); \ No newline at end of file +processInterval(); diff --git a/public/serviceWorker.js b/public/serviceWorker.js index a00997dc1..d21f01b1d 100644 --- a/public/serviceWorker.js +++ b/public/serviceWorker.js @@ -1,42 +1,42 @@ -const CACHE_NAME = 'version-1'; -const urlsToCache = ['index.html']; +const CACHE_NAME = "version-1"; +const urlsToCache = ["index.html"]; const self = this; // Install SW -self.addEventListener('install', (event) => { - event.waitUntil( - caches.open(CACHE_NAME).then((cache) => { - console.log('Opened cache'); +self.addEventListener("install", (event) => { + event.waitUntil( + caches.open(CACHE_NAME).then((cache) => { + console.log("Opened cache"); - return cache.addAll(urlsToCache); - }) - ); + return cache.addAll(urlsToCache); + }) + ); }); // Listen for requests -self.addEventListener('fetch', (event) => { - event.respondWith( - caches.match(event.request).then(() => { - return fetch(event.request).catch(() => caches.match('index.html')); - }) - ); +self.addEventListener("fetch", (event) => { + event.respondWith( + caches.match(event.request).then(() => { + return fetch(event.request).catch(() => caches.match("index.html")); + }) + ); }); // Activate the SW -self.addEventListener('activate', (event) => { - const cacheWhitelist = []; - cacheWhitelist.push(CACHE_NAME); +self.addEventListener("activate", (event) => { + const cacheWhitelist = []; + cacheWhitelist.push(CACHE_NAME); - event.waitUntil( - caches.keys().then((cacheNames) => - Promise.all( - cacheNames.map((cacheName) => { - if (!cacheWhitelist.includes(cacheName)) { - return caches.delete(cacheName); - } - }) - ) - ) - ); + event.waitUntil( + caches.keys().then((cacheNames) => + Promise.all( + cacheNames.map((cacheName) => { + if (!cacheWhitelist.includes(cacheName)) { + return caches.delete(cacheName); + } + }) + ) + ) + ); }); diff --git a/signatures/version1/cla.json b/signatures/version1/cla.json index 5a00ec001..85412a8d9 100644 --- a/signatures/version1/cla.json +++ b/signatures/version1/cla.json @@ -137,4 +137,4 @@ "pullRequestNo": 679 } ] -} \ No newline at end of file +} diff --git a/src-tauri/tauri.conf.json b/src-tauri/tauri.conf.json index bfb18c456..4a7de2b47 100644 --- a/src-tauri/tauri.conf.json +++ b/src-tauri/tauri.conf.json @@ -22,9 +22,7 @@ "depends": [] }, "externalBin": [], - "icon": [ - "icons/icon.ico" - ], + "icon": ["icons/icon.ico"], "identifier": "com.blueedgetechno.win11react", "longDescription": "", "macOS": { diff --git a/src/App.jsx b/src/App.jsx index ca00b1587..d6fff3704 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -6,12 +6,12 @@ import "./index.css"; import ActMenu from "./components/menu"; import { - BandPane, - CalnWid, - DesktopApp, - SidePane, - StartMenu, - WidPane, + BandPane, + CalnWid, + DesktopApp, + SidePane, + StartMenu, + WidPane, } from "./components/start"; import Taskbar from "./components/taskbar"; import { Background, BootScreen, LockScreen } from "./containers/background"; @@ -21,155 +21,155 @@ import * as Applications from "./containers/applications"; import * as Drafts from "./containers/applications/draft"; function ErrorFallback({ error, resetErrorBoundary }) { - return ( -
- - 404 - Page - - - {/* partial:index.partial.html */} -
-
-

:(

-

- Your PC ran into a problem and needs to restart. We're just - collecting some error info, and then we'll restart for you. -

-

- 0% complete -

-
-
-
- QR Code -
-
-
-

- For more information about this issue and possible fixes, visit -
{" "} - - https://github.com/blueedgetechno/win11React/issues - {" "} -

-
- If you call a support person, give them this info: -
- Stop Code: {error.message} -
- -
-
-
-
- {/* partial */} -
- ); + return ( +
+ + 404 - Page + + + {/* partial:index.partial.html */} +
+
+

:(

+

+ Your PC ran into a problem and needs to restart. We're just + collecting some error info, and then we'll restart for you. +

+

+ 0% complete +

+
+
+
+ QR Code +
+
+
+

+ For more information about this issue and possible fixes, visit +
{" "} + + https://github.com/blueedgetechno/win11React/issues + {" "} +

+
+ If you call a support person, give them this info: +
+ Stop Code: {error.message} +
+ +
+
+
+
+ {/* partial */} +
+ ); } function App() { - const apps = useSelector((state) => state.apps); - const wall = useSelector((state) => state.wallpaper); - const dispatch = useDispatch(); + const apps = useSelector((state) => state.apps); + const wall = useSelector((state) => state.wallpaper); + const dispatch = useDispatch(); - const afterMath = (event) => { - var ess = [ - ["START", "STARTHID"], - ["BAND", "BANDHIDE"], - ["PANE", "PANEHIDE"], - ["WIDG", "WIDGHIDE"], - ["CALN", "CALNHIDE"], - ["MENU", "MENUHIDE"], - ]; + const afterMath = (event) => { + var ess = [ + ["START", "STARTHID"], + ["BAND", "BANDHIDE"], + ["PANE", "PANEHIDE"], + ["WIDG", "WIDGHIDE"], + ["CALN", "CALNHIDE"], + ["MENU", "MENUHIDE"], + ]; - var actionType = ""; - try { - actionType = event.target.dataset.action || ""; - } catch (err) {} + var actionType = ""; + try { + actionType = event.target.dataset.action || ""; + } catch (err) {} - var actionType0 = getComputedStyle(event.target).getPropertyValue( - "--prefix" - ); + var actionType0 = getComputedStyle(event.target).getPropertyValue( + "--prefix" + ); - ess.forEach((item, i) => { - if (!actionType.startsWith(item[0]) && !actionType0.startsWith(item[0])) { - dispatch({ - type: item[1], - }); - } - }); - }; + ess.forEach((item, i) => { + if (!actionType.startsWith(item[0]) && !actionType0.startsWith(item[0])) { + dispatch({ + type: item[1], + }); + } + }); + }; - window.oncontextmenu = (e) => { - afterMath(e); - e.preventDefault(); - // dispatch({ type: 'GARBAGE'}); - var data = { - top: e.clientY, - left: e.clientX, - }; + window.oncontextmenu = (e) => { + afterMath(e); + e.preventDefault(); + // dispatch({ type: 'GARBAGE'}); + var data = { + top: e.clientY, + left: e.clientX, + }; - if (e.target.dataset.menu != null) { - data.menu = e.target.dataset.menu; - data.attr = e.target.attributes; - data.dataset = e.target.dataset; - dispatch({ - type: "MENUSHOW", - payload: data, - }); - } - }; + if (e.target.dataset.menu != null) { + data.menu = e.target.dataset.menu; + data.attr = e.target.attributes; + data.dataset = e.target.dataset; + dispatch({ + type: "MENUSHOW", + payload: data, + }); + } + }; - window.onclick = afterMath; + window.onclick = afterMath; - window.onload = (e) => { - dispatch({ type: "WALLBOOTED" }); - }; + window.onload = (e) => { + dispatch({ type: "WALLBOOTED" }); + }; - useEffect(() => { - if (!window.onstart) { - loadSettings(); - window.onstart = setTimeout(() => { - // console.log("prematurely loading ( ๏พ‰ ๏พŸ๏ฝฐ๏พŸ)๏พ‰"); - dispatch({ type: "WALLBOOTED" }); - }, 5000); - } - }); + useEffect(() => { + if (!window.onstart) { + loadSettings(); + window.onstart = setTimeout(() => { + // console.log("prematurely loading ( ๏พ‰ ๏พŸ๏ฝฐ๏พŸ)๏พ‰"); + dispatch({ type: "WALLBOOTED" }); + }, 5000); + } + }); - return ( -
- - {!wall.booted ? : null} - {wall.locked ? : null} -
- -
- - {Object.keys(Applications).map((key, idx) => { - var WinApp = Applications[key]; - return ; - })} - {Object.keys(apps) - .filter((x) => x != "hz") - .map((key) => apps[key]) - .map((app, i) => { - if (app.pwa) { - var WinApp = Drafts[app.data.type]; - return ; - } - })} - - - - - -
- - -
- -
- ); + return ( +
+ + {!wall.booted ? : null} + {wall.locked ? : null} +
+ +
+ + {Object.keys(Applications).map((key, idx) => { + var WinApp = Applications[key]; + return ; + })} + {Object.keys(apps) + .filter((x) => x != "hz") + .map((key) => apps[key]) + .map((app, i) => { + if (app.pwa) { + var WinApp = Drafts[app.data.type]; + return ; + } + })} + + + + + +
+ + +
+ +
+ ); } export default App; diff --git a/src/actions/index.js b/src/actions/index.js index 95ad9b68a..37793914a 100644 --- a/src/actions/index.js +++ b/src/actions/index.js @@ -4,263 +4,263 @@ import { dfApps } from "../utils"; import { gene_name } from "../utils/apps"; export const dispatchAction = (event) => { - const action = { - type: event.target.dataset.action, - payload: event.target.dataset.payload, - }; - - if (action.type) { - store.dispatch(action); - } + const action = { + type: event.target.dataset.action, + payload: event.target.dataset.payload, + }; + + if (action.type) { + store.dispatch(action); + } }; export const refresh = (pl, menu) => { - if (menu.menus.desk[0].opts[4].check) { - store.dispatch({ type: "DESKHIDE" }); - setTimeout(() => store.dispatch({ type: "DESKSHOW" }), 100); - } + if (menu.menus.desk[0].opts[4].check) { + store.dispatch({ type: "DESKHIDE" }); + setTimeout(() => store.dispatch({ type: "DESKSHOW" }), 100); + } }; export const changeIconSize = (size, menu) => { - var tmpMenu = { ...menu }; - tmpMenu.menus.desk[0].opts[0].dot = false; - tmpMenu.menus.desk[0].opts[1].dot = false; - tmpMenu.menus.desk[0].opts[2].dot = false; - var isize = 1; - - if (size == "large") { - tmpMenu.menus.desk[0].opts[0].dot = true; - isize = 1.5; - } else if (size == "medium") { - tmpMenu.menus.desk[0].opts[1].dot = true; - isize = 1.2; - } else { - tmpMenu.menus.desk[0].opts[2].dot = true; - } - - refresh("", tmpMenu); - store.dispatch({ type: "DESKSIZE", payload: isize }); - store.dispatch({ type: "MENUCHNG", payload: tmpMenu }); + var tmpMenu = { ...menu }; + tmpMenu.menus.desk[0].opts[0].dot = false; + tmpMenu.menus.desk[0].opts[1].dot = false; + tmpMenu.menus.desk[0].opts[2].dot = false; + var isize = 1; + + if (size == "large") { + tmpMenu.menus.desk[0].opts[0].dot = true; + isize = 1.5; + } else if (size == "medium") { + tmpMenu.menus.desk[0].opts[1].dot = true; + isize = 1.2; + } else { + tmpMenu.menus.desk[0].opts[2].dot = true; + } + + refresh("", tmpMenu); + store.dispatch({ type: "DESKSIZE", payload: isize }); + store.dispatch({ type: "MENUCHNG", payload: tmpMenu }); }; export const deskHide = (payload, menu) => { - var tmpMenu = { ...menu }; - tmpMenu.menus.desk[0].opts[4].check ^= 1; + var tmpMenu = { ...menu }; + tmpMenu.menus.desk[0].opts[4].check ^= 1; - store.dispatch({ type: "DESKTOGG" }); - store.dispatch({ type: "MENUCHNG", payload: tmpMenu }); + store.dispatch({ type: "DESKTOGG" }); + store.dispatch({ type: "MENUCHNG", payload: tmpMenu }); }; export const changeSort = (sort, menu) => { - var tmpMenu = { ...menu }; - tmpMenu.menus.desk[1].opts[0].dot = false; - tmpMenu.menus.desk[1].opts[1].dot = false; - tmpMenu.menus.desk[1].opts[2].dot = false; - if (sort == "name") { - tmpMenu.menus.desk[1].opts[0].dot = true; - } else if (sort == "size") { - tmpMenu.menus.desk[1].opts[1].dot = true; - } else { - tmpMenu.menus.desk[1].opts[2].dot = true; - } - - refresh("", tmpMenu); - store.dispatch({ type: "DESKSORT", payload: sort }); - store.dispatch({ type: "MENUCHNG", payload: tmpMenu }); + var tmpMenu = { ...menu }; + tmpMenu.menus.desk[1].opts[0].dot = false; + tmpMenu.menus.desk[1].opts[1].dot = false; + tmpMenu.menus.desk[1].opts[2].dot = false; + if (sort == "name") { + tmpMenu.menus.desk[1].opts[0].dot = true; + } else if (sort == "size") { + tmpMenu.menus.desk[1].opts[1].dot = true; + } else { + tmpMenu.menus.desk[1].opts[2].dot = true; + } + + refresh("", tmpMenu); + store.dispatch({ type: "DESKSORT", payload: sort }); + store.dispatch({ type: "MENUCHNG", payload: tmpMenu }); }; export const changeTaskAlign = (align, menu) => { - var tmpMenu = { ...menu }; - if (tmpMenu.menus.task[0].opts[align == "left" ? 0 : 1].dot) return; + var tmpMenu = { ...menu }; + if (tmpMenu.menus.task[0].opts[align == "left" ? 0 : 1].dot) return; - tmpMenu.menus.task[0].opts[0].dot = false; - tmpMenu.menus.task[0].opts[1].dot = false; + tmpMenu.menus.task[0].opts[0].dot = false; + tmpMenu.menus.task[0].opts[1].dot = false; - if (align == "left") { - tmpMenu.menus.task[0].opts[0].dot = true; - } else { - tmpMenu.menus.task[0].opts[1].dot = true; - } + if (align == "left") { + tmpMenu.menus.task[0].opts[0].dot = true; + } else { + tmpMenu.menus.task[0].opts[1].dot = true; + } - store.dispatch({ type: "TASKTOG" }); - store.dispatch({ type: "MENUCHNG", payload: tmpMenu }); + store.dispatch({ type: "TASKTOG" }); + store.dispatch({ type: "MENUCHNG", payload: tmpMenu }); }; export const performApp = (act, menu) => { - var data = { - type: menu.dataset.action, - payload: menu.dataset.payload, - }; - - if (act == "open") { - if (data.type) store.dispatch(data); - } else if (act == "delshort") { - if (data.type) { - var apps = store.getState().apps; - var app = Object.keys(apps).filter( - (x) => - apps[x].action == data.type || - (apps[x].payload == data.payload && apps[x].payload != null) - ); - - app = apps[app]; - if (app) { - store.dispatch({ type: "DESKREM", payload: app.name }); - } - } - } + var data = { + type: menu.dataset.action, + payload: menu.dataset.payload, + }; + + if (act == "open") { + if (data.type) store.dispatch(data); + } else if (act == "delshort") { + if (data.type) { + var apps = store.getState().apps; + var app = Object.keys(apps).filter( + (x) => + apps[x].action == data.type || + (apps[x].payload == data.payload && apps[x].payload != null) + ); + + app = apps[app]; + if (app) { + store.dispatch({ type: "DESKREM", payload: app.name }); + } + } + } }; export const delApp = (act, menu) => { - var data = { - type: menu.dataset.action, - payload: menu.dataset.payload, - }; - - if (act == "delete") { - if (data.type) { - var apps = store.getState().apps; - var app = Object.keys(apps).filter((x) => apps[x].action == data.type); - if (app) { - app = apps[app]; - if (app.pwa == true) { - store.dispatch({ type: app.action, payload: "close" }); - store.dispatch({ type: "DELAPP", payload: app.icon }); - - var installed = localStorage.getItem("installed"); - if (!installed) installed = "[]"; - - installed = JSON.parse(installed); - installed = installed.filter((x) => x.icon != app.icon); - localStorage.setItem("installed", JSON.stringify(installed)); - - store.dispatch({ type: "DESKREM", payload: app.name }); - } - } - } - } + var data = { + type: menu.dataset.action, + payload: menu.dataset.payload, + }; + + if (act == "delete") { + if (data.type) { + var apps = store.getState().apps; + var app = Object.keys(apps).filter((x) => apps[x].action == data.type); + if (app) { + app = apps[app]; + if (app.pwa == true) { + store.dispatch({ type: app.action, payload: "close" }); + store.dispatch({ type: "DELAPP", payload: app.icon }); + + var installed = localStorage.getItem("installed"); + if (!installed) installed = "[]"; + + installed = JSON.parse(installed); + installed = installed.filter((x) => x.icon != app.icon); + localStorage.setItem("installed", JSON.stringify(installed)); + + store.dispatch({ type: "DESKREM", payload: app.name }); + } + } + } + } }; export const installApp = (data) => { - var app = { ...data, type: "app", pwa: true }; + var app = { ...data, type: "app", pwa: true }; - var installed = localStorage.getItem("installed"); - if (!installed) installed = "[]"; + var installed = localStorage.getItem("installed"); + if (!installed) installed = "[]"; - installed = JSON.parse(installed); - installed.push(app); - localStorage.setItem("installed", JSON.stringify(installed)); + installed = JSON.parse(installed); + installed.push(app); + localStorage.setItem("installed", JSON.stringify(installed)); - var desk = localStorage.getItem("desktop"); - if (!desk) desk = dfApps.desktop; - else desk = JSON.parse(desk); + var desk = localStorage.getItem("desktop"); + if (!desk) desk = dfApps.desktop; + else desk = JSON.parse(desk); - desk.push(app.name); - localStorage.setItem("desktop", JSON.stringify(desk)); + desk.push(app.name); + localStorage.setItem("desktop", JSON.stringify(desk)); - app.action = gene_name(); - store.dispatch({ type: "ADDAPP", payload: app }); - store.dispatch({ type: "DESKADD", payload: app }); - store.dispatch({ type: "WNSTORE", payload: "mnmz" }); + app.action = gene_name(); + store.dispatch({ type: "ADDAPP", payload: app }); + store.dispatch({ type: "DESKADD", payload: app }); + store.dispatch({ type: "WNSTORE", payload: "mnmz" }); }; export const getTreeValue = (obj, path) => { - if (path == null) return false; + if (path == null) return false; - var tdir = { ...obj }; - path = path.split("."); - for (var i = 0; i < path.length; i++) { - tdir = tdir[path[i]]; - } + var tdir = { ...obj }; + path = path.split("."); + for (var i = 0; i < path.length; i++) { + tdir = tdir[path[i]]; + } - return tdir; + return tdir; }; export const changeTheme = () => { - var thm = store.getState().setting.person.theme, - thm = thm == "light" ? "dark" : "light"; - var icon = thm == "light" ? "sun" : "moon"; - - document.body.dataset.theme = thm; - store.dispatch({ type: "STNGTHEME", payload: thm }); - store.dispatch({ type: "PANETHEM", payload: icon }); - store.dispatch({ type: "WALLSET", payload: thm == "light" ? 0 : 1 }); + var thm = store.getState().setting.person.theme, + thm = thm == "light" ? "dark" : "light"; + var icon = thm == "light" ? "sun" : "moon"; + + document.body.dataset.theme = thm; + store.dispatch({ type: "STNGTHEME", payload: thm }); + store.dispatch({ type: "PANETHEM", payload: icon }); + store.dispatch({ type: "WALLSET", payload: thm == "light" ? 0 : 1 }); }; const loadWidget = async () => { - var tmpWdgt = { - ...store.getState().widpane, - }, - date = new Date(); - - // console.log('fetching ON THIS DAY'); - var wikiurl = "https://en.wikipedia.org/api/rest_v1/feed/onthisday/events"; - await axios - .get(`${wikiurl}/${date.getMonth()}/${date.getDay()}`) - .then((res) => res.data) - .then((data) => { - var event = data.events[Math.floor(Math.random() * data.events.length)]; - date.setYear(event.year); - - tmpWdgt.data.date = date.toLocaleDateString("en-US", { - year: "numeric", - month: "short", - day: "numeric", - }); - - tmpWdgt.data.event = event; - }) - .catch((error) => {}); - - // console.log('fetching NEWS'); - await axios - .get("https://github.win11react.com/api-cache/news.json") - .then((res) => res.data) - .then((data) => { - var newsList = []; - data["articles"].forEach((e) => { - e.title = e["title"].split(`-`).slice(0, -1).join(`-`).trim(); - newsList.push(e); - }); - tmpWdgt.data.news = newsList; - }) - .catch((error) => {}); - - store.dispatch({ - type: "WIDGREST", - payload: tmpWdgt, - }); + var tmpWdgt = { + ...store.getState().widpane, + }, + date = new Date(); + + // console.log('fetching ON THIS DAY'); + var wikiurl = "https://en.wikipedia.org/api/rest_v1/feed/onthisday/events"; + await axios + .get(`${wikiurl}/${date.getMonth()}/${date.getDay()}`) + .then((res) => res.data) + .then((data) => { + var event = data.events[Math.floor(Math.random() * data.events.length)]; + date.setYear(event.year); + + tmpWdgt.data.date = date.toLocaleDateString("en-US", { + year: "numeric", + month: "short", + day: "numeric", + }); + + tmpWdgt.data.event = event; + }) + .catch((error) => {}); + + // console.log('fetching NEWS'); + await axios + .get("https://github.win11react.com/api-cache/news.json") + .then((res) => res.data) + .then((data) => { + var newsList = []; + data["articles"].forEach((e) => { + e.title = e["title"].split(`-`).slice(0, -1).join(`-`).trim(); + newsList.push(e); + }); + tmpWdgt.data.news = newsList; + }) + .catch((error) => {}); + + store.dispatch({ + type: "WIDGREST", + payload: tmpWdgt, + }); }; export const loadSettings = () => { - var sett = localStorage.getItem("setting") || "{}"; - sett = JSON.parse(sett); - - if (sett.person == null) { - sett = JSON.parse(JSON.stringify(store.getState().setting)); - if ( - window.matchMedia && - window.matchMedia("(prefers-color-scheme: dark)").matches - ) { - sett.person.theme = "dark"; - } - } - - if (sett.person.theme != "light") changeTheme(); - - store.dispatch({ type: "SETTLOAD", payload: sett }); - if (import.meta.env.MODE != "development") { - loadWidget(); - } + var sett = localStorage.getItem("setting") || "{}"; + sett = JSON.parse(sett); + + if (sett.person == null) { + sett = JSON.parse(JSON.stringify(store.getState().setting)); + if ( + window.matchMedia && + window.matchMedia("(prefers-color-scheme: dark)").matches + ) { + sett.person.theme = "dark"; + } + } + + if (sett.person.theme != "light") changeTheme(); + + store.dispatch({ type: "SETTLOAD", payload: sett }); + if (import.meta.env.MODE != "development") { + loadWidget(); + } }; // mostly file explorer export const handleFileOpen = (id) => { - // handle double click open - const item = store.getState().files.data.getId(id); - if (item != null) { - if (item.type == "folder") { - store.dispatch({ type: "FILEDIR", payload: item.id }); - } - } + // handle double click open + const item = store.getState().files.data.getId(id); + if (item != null) { + if (item.type == "folder") { + store.dispatch({ type: "FILEDIR", payload: item.id }); + } + } }; diff --git a/src/components/login.js b/src/components/login.js index fd782796c..49655b6f8 100644 --- a/src/components/login.js +++ b/src/components/login.js @@ -1,5 +1,5 @@ -import 'firebase/compat/auth'; -import firebase from 'firebase/compat/app'; +import "firebase/compat/auth"; +import firebase from "firebase/compat/app"; firebase.initializeApp({ apiKey: "AIzaSyBdZVIp08RqYKc2s88MfH6B8eiwIeK8mpI", @@ -8,7 +8,7 @@ firebase.initializeApp({ storageBucket: "auth.win11react.com", messagingSenderId: "213452110834", appId: "1:213452110834:web:3a7c957763b93cc29e096b", - measurementId: "G-N7CJ22ZMSJ" + measurementId: "G-N7CJ22ZMSJ", }); const auth = firebase.auth(); @@ -16,10 +16,10 @@ const githubLoginProvider = new firebase.auth.GithubAuthProvider(); async function login() { auth.signInWithPopup(githubLoginProvider).then((res) => { - const token = res.credential.accessToken + const token = res.credential.accessToken; const user = res.additionalUserInfo.username; const email = res.user.email; console.log(res); - }) + }); } export default login; diff --git a/src/components/menu/index.jsx b/src/components/menu/index.jsx index b76d3b857..bda57496a 100644 --- a/src/components/menu/index.jsx +++ b/src/components/menu/index.jsx @@ -6,143 +6,143 @@ import "./menu.scss"; import * as Actions from "../../actions"; export const ActMenu = () => { - const menu = useSelector((state) => state.menus); - const menudata = menu.data[menu.opts]; - const { abpos, isLeft } = useSelector((state) => { - var acount = state.menus.menus[state.menus.opts].length; - var tmpos = { - top: state.menus.top, - left: state.menus.left, - }, - tmpleft = false; + const menu = useSelector((state) => state.menus); + const menudata = menu.data[menu.opts]; + const { abpos, isLeft } = useSelector((state) => { + var acount = state.menus.menus[state.menus.opts].length; + var tmpos = { + top: state.menus.top, + left: state.menus.left, + }, + tmpleft = false; - var wnwidth = window.innerWidth, - wnheight = window.innerHeight; + var wnwidth = window.innerWidth, + wnheight = window.innerHeight; - var ewidth = 312, - eheight = acount * 28; + var ewidth = 312, + eheight = acount * 28; - tmpleft = wnwidth - tmpos.left > 504; - if (wnwidth - tmpos.left < ewidth) { - tmpos.left = wnwidth - ewidth; - } + tmpleft = wnwidth - tmpos.left > 504; + if (wnwidth - tmpos.left < ewidth) { + tmpos.left = wnwidth - ewidth; + } - if (wnheight - tmpos.top < eheight) { - tmpos.bottom = wnheight - tmpos.top; - tmpos.top = null; - } + if (wnheight - tmpos.top < eheight) { + tmpos.bottom = wnheight - tmpos.top; + tmpos.top = null; + } - return { - abpos: tmpos, - isLeft: tmpleft, - }; - }); + return { + abpos: tmpos, + isLeft: tmpleft, + }; + }); - const dispatch = useDispatch(); + const dispatch = useDispatch(); - const clickDispatch = (event) => { - event.stopPropagation(); - var action = { - type: event.target.dataset.action, - payload: event.target.dataset.payload, - }; + const clickDispatch = (event) => { + event.stopPropagation(); + var action = { + type: event.target.dataset.action, + payload: event.target.dataset.payload, + }; - if (action.type) { - if (action.type != action.type.toUpperCase()) { - Actions[action.type](action.payload, menu); - } else { - dispatch(action); - } - dispatch({ type: "MENUHIDE" }); - } - }; + if (action.type) { + if (action.type != action.type.toUpperCase()) { + Actions[action.type](action.payload, menu); + } else { + dispatch(action); + } + dispatch({ type: "MENUHIDE" }); + } + }; - const menuobj = (data) => { - var mnode = []; - data.map((opt, i) => { - if (opt.type == "hr") { - mnode.push(
); - } else { - mnode.push( -
- {menudata.ispace != false ? ( -
- {opt.icon && opt.type == "svg" ? ( - - ) : null} - {opt.icon && opt.type == "fa" ? ( - - ) : null} - {opt.icon && opt.type == null ? ( - - ) : null} -
- ) : null} -
{opt.name}
- {opt.opts ? ( - - ) : null} - {opt.dot ? ( - - ) : null} - {opt.check ? ( - - ) : null} - {opt.opts ? ( -
- {menuobj(opt.opts)} -
- ) : null} -
- ); - } - }); + const menuobj = (data) => { + var mnode = []; + data.map((opt, i) => { + if (opt.type == "hr") { + mnode.push(
); + } else { + mnode.push( +
+ {menudata.ispace != false ? ( +
+ {opt.icon && opt.type == "svg" ? ( + + ) : null} + {opt.icon && opt.type == "fa" ? ( + + ) : null} + {opt.icon && opt.type == null ? ( + + ) : null} +
+ ) : null} +
{opt.name}
+ {opt.opts ? ( + + ) : null} + {opt.dot ? ( + + ) : null} + {opt.check ? ( + + ) : null} + {opt.opts ? ( +
+ {menuobj(opt.opts)} +
+ ) : null} +
+ ); + } + }); - return mnode; - }; + return mnode; + }; - return ( -
- {menuobj(menu.menus[menu.opts])} -
- ); + return ( +
+ {menuobj(menu.menus[menu.opts])} +
+ ); }; export default ActMenu; diff --git a/src/components/menu/menu.scss b/src/components/menu/menu.scss index 34ec8dbaf..ac65c19be 100644 --- a/src/components/menu/menu.scss +++ b/src/components/menu/menu.scss @@ -1,97 +1,97 @@ .actmenu { - --bg1: rgba(249, 249, 249, 0.9); - --bg1a: rgba(248, 248, 248, 0.96); - --bg2: rgba(0, 0, 0, 0.08); + --bg1: rgba(249, 249, 249, 0.9); + --bg1a: rgba(248, 248, 248, 0.96); + --bg2: rgba(0, 0, 0, 0.08); - position: absolute; - background: var(--bg1); - backdrop-filter: saturate(2) blur(20px); - z-index: 10000; - opacity: 1; - pointer-events: all; - // border: solid 1px var(--comp-txt); - border-radius: 8px; - transition: opacity 0.1s ease; + position: absolute; + background: var(--bg1); + backdrop-filter: saturate(2) blur(20px); + z-index: 10000; + opacity: 1; + pointer-events: all; + // border: solid 1px var(--comp-txt); + border-radius: 8px; + transition: opacity 0.1s ease; - &[data-hide="true"] { - opacity: 0; - pointer-events: none; - } + &[data-hide="true"] { + opacity: 0; + pointer-events: none; + } - &[data-left="false"] .minimenu { - left: unset; - right: 98%; - } + &[data-left="false"] .minimenu { + left: unset; + right: 98%; + } } body[data-theme="dark"] .actmenu { - --bg1: rgba(34, 36, 47, 0.8); - --bg1a: rgba(30, 32, 47, 0.9); - --bg2: rgba(255, 255, 255, 0.08); + --bg1: rgba(34, 36, 47, 0.8); + --bg1a: rgba(30, 32, 47, 0.9); + --bg2: rgba(255, 255, 255, 0.08); } .minimenu { - position: absolute; - display: none; - top: 0; - left: 99%; - background: var(--bg1a); - z-index: 9999; - padding: 4px 0; - // border: solid 1px var(--comp-txt); - animation: fadein 600ms ease-in-out; - // backdrop-filter: saturate(2) blur(20px); - border-radius: 8px; + position: absolute; + display: none; + top: 0; + left: 99%; + background: var(--bg1a); + z-index: 9999; + padding: 4px 0; + // border: solid 1px var(--comp-txt); + animation: fadein 600ms ease-in-out; + // backdrop-filter: saturate(2) blur(20px); + border-radius: 8px; } .menuopt { - height: 28px; - box-sizing: border-box; - position: relative; - padding: 4px 6px; - font-size: 12px; - cursor: default; - margin: 6px; - border-radius: 4px; - display: flex; - align-items: center; - font-weight: 500; - color: var(--txt-col); - // transition: all 0.1s ease; + height: 28px; + box-sizing: border-box; + position: relative; + padding: 4px 6px; + font-size: 12px; + cursor: default; + margin: 6px; + border-radius: 4px; + display: flex; + align-items: center; + font-weight: 500; + color: var(--txt-col); + // transition: all 0.1s ease; - &:hover { - background: var(--bg2); + &:hover { + background: var(--bg2); - .minimenu { - display: block; - } - } + .minimenu { + display: block; + } + } - .spcont { - width: 16px; - margin-right: 12px; - } + .spcont { + width: 16px; + margin-right: 12px; + } - .micon { - position: absolute; - } + .micon { + position: absolute; + } - .rightIcon { - right: 8px; - } + .rightIcon { + right: 8px; + } - .dotIcon, - .checkIcon { - right: 8px; - color: var(--med-txt); - } + .dotIcon, + .checkIcon { + right: 8px; + color: var(--med-txt); + } } .menuhr { - position: relative; - left: 0; - width: 100%; - height: 1px; - background-color: #ccc5; - margin: 4px 0; + position: relative; + left: 0; + width: 100%; + height: 1px; + background-color: #ccc5; + margin: 4px 0; } diff --git a/src/components/start/index.jsx b/src/components/start/index.jsx index ff80c5d79..57fa3d39e 100644 --- a/src/components/start/index.jsx +++ b/src/components/start/index.jsx @@ -12,270 +12,270 @@ export * from "./start"; export * from "./widget"; export const DesktopApp = () => { - const deskApps = useSelector((state) => { - var arr = { ...state.desktop }; - var tmpApps = [...arr.apps]; + const deskApps = useSelector((state) => { + var arr = { ...state.desktop }; + var tmpApps = [...arr.apps]; - if (arr.sort == "name") { - tmpApps.sort((a, b) => (a.name > b.name ? 1 : b.name > a.name ? -1 : 0)); - } else if (arr.sort == "size") { - tmpApps.sort((a, b) => { - var anm = a.name, - bnm = b.name; + if (arr.sort == "name") { + tmpApps.sort((a, b) => (a.name > b.name ? 1 : b.name > a.name ? -1 : 0)); + } else if (arr.sort == "size") { + tmpApps.sort((a, b) => { + var anm = a.name, + bnm = b.name; - return anm[bnm.charCodeAt(0) % anm.length] > - bnm[anm.charCodeAt(0) % bnm.length] - ? 1 - : -1; - }); - } else if (arr.sort == "date") { - tmpApps.sort((a, b) => { - var anm = a.name, - bnm = b.name; - var anml = anm.length, - bnml = bnm.length; + return anm[bnm.charCodeAt(0) % anm.length] > + bnm[anm.charCodeAt(0) % bnm.length] + ? 1 + : -1; + }); + } else if (arr.sort == "date") { + tmpApps.sort((a, b) => { + var anm = a.name, + bnm = b.name; + var anml = anm.length, + bnml = bnm.length; - return anm[(bnml * 13) % anm.length] > bnm[(anml * 17) % bnm.length] - ? 1 - : -1; - }); - } + return anm[(bnml * 13) % anm.length] > bnm[(anml * 17) % bnm.length] + ? 1 + : -1; + }); + } - arr.apps = tmpApps; - return arr; - }); - const dispatch = useDispatch(); + arr.apps = tmpApps; + return arr; + }); + const dispatch = useDispatch(); - return ( -
- {!deskApps.hide && - deskApps.apps.map((app, i) => { - return ( - // to allow it to be focusable (:focus) -
- -
{app.name}
-
- ); - })} -
- ); + return ( +
+ {!deskApps.hide && + deskApps.apps.map((app, i) => { + return ( + // to allow it to be focusable (:focus) +
+ +
{app.name}
+
+ ); + })} +
+ ); }; export const BandPane = () => { - const sidepane = useSelector((state) => state.sidepane); + const sidepane = useSelector((state) => state.sidepane); - return ( -
-
- - - -
-
- ); + return ( +
+
+ + + +
+
+ ); }; export const SidePane = () => { - const sidepane = useSelector((state) => state.sidepane); - const setting = useSelector((state) => state.setting); - const tasks = useSelector((state) => state.taskbar); - const [pnstates, setPnstate] = useState([]); - const dispatch = useDispatch(); + const sidepane = useSelector((state) => state.sidepane); + const setting = useSelector((state) => state.setting); + const tasks = useSelector((state) => state.taskbar); + const [pnstates, setPnstate] = useState([]); + const dispatch = useDispatch(); - let [btlevel, setBtLevel] = useState(""); - const childToParent = () => {}; + let [btlevel, setBtLevel] = useState(""); + const childToParent = () => {}; - const clickDispatch = (event) => { - var action = { - type: event.target.dataset.action, - payload: event.target.dataset.payload, - }; + const clickDispatch = (event) => { + var action = { + type: event.target.dataset.action, + payload: event.target.dataset.payload, + }; - if (action.type) { - if (action.type != action.type.toUpperCase()) { - Actions[action.type](action.payload); - } else dispatch(action); - } - }; + if (action.type) { + if (action.type != action.type.toUpperCase()) { + Actions[action.type](action.payload); + } else dispatch(action); + } + }; - const vSlider = document.querySelector(".vSlider"); - const bSlider = document.querySelector(".bSlider"); + const vSlider = document.querySelector(".vSlider"); + const bSlider = document.querySelector(".bSlider"); - const setVolume = (e) => { - var aud = 3; - if (e.target.value < 70) aud = 2; - if (e.target.value < 30) aud = 1; - if (e.target.value == 0) aud = 0; + const setVolume = (e) => { + var aud = 3; + if (e.target.value < 70) aud = 2; + if (e.target.value < 30) aud = 1; + if (e.target.value == 0) aud = 0; - dispatch({ type: "TASKAUDO", payload: aud }); + dispatch({ type: "TASKAUDO", payload: aud }); - sliderBackground(vSlider, e.target.value); - }; + sliderBackground(vSlider, e.target.value); + }; - function sliderBackground(elem, e) { - elem.style.setProperty( - "--track-color", - `linear-gradient(90deg, var(--clrPrm) ${e - 3}%, #888888 ${e}%)` - ); - } + function sliderBackground(elem, e) { + elem.style.setProperty( + "--track-color", + `linear-gradient(90deg, var(--clrPrm) ${e - 3}%, #888888 ${e}%)` + ); + } - const setBrightness = (e) => { - var brgt = e.target.value; - document.getElementById("brightoverlay").style.opacity = (100 - brgt) / 100; - dispatch({ - type: "STNGSETV", - payload: { - path: "system.display.brightness", - value: brgt, - }, - }); - sliderBackground(bSlider, brgt); - }; + const setBrightness = (e) => { + var brgt = e.target.value; + document.getElementById("brightoverlay").style.opacity = (100 - brgt) / 100; + dispatch({ + type: "STNGSETV", + payload: { + path: "system.display.brightness", + value: brgt, + }, + }); + sliderBackground(bSlider, brgt); + }; - useEffect(() => { - sidepane.quicks.map((item, i) => { - if (item.src == "nightlight") { - if (pnstates[i]) document.body.dataset.sepia = true; - else document.body.dataset.sepia = false; - } - }); - }); + useEffect(() => { + sidepane.quicks.map((item, i) => { + if (item.src == "nightlight") { + if (pnstates[i]) document.body.dataset.sepia = true; + else document.body.dataset.sepia = false; + } + }); + }); - useEffect(() => { - // console.log("ok") - var tmp = []; - for (var i = 0; i < sidepane.quicks.length; i++) { - var val = getTreeValue(setting, sidepane.quicks[i].state); - if (sidepane.quicks[i].name == "Theme") val = val == "dark"; - tmp.push(val); - } + useEffect(() => { + // console.log("ok") + var tmp = []; + for (var i = 0; i < sidepane.quicks.length; i++) { + var val = getTreeValue(setting, sidepane.quicks[i].state); + if (sidepane.quicks[i].name == "Theme") val = val == "dark"; + tmp.push(val); + } - setPnstate(tmp); - }, [setting, sidepane]); + setPnstate(tmp); + }, [setting, sidepane]); - return ( -
-
-
- {sidepane.quicks.map((qk, idx) => { - return ( -
-
- -
-
{qk.name}
-
- ); - })} -
-
- - -
-
- - -
-
-
-
- -
-
-
- ); + return ( +
+
+
+ {sidepane.quicks.map((qk, idx) => { + return ( +
+
+ +
+
{qk.name}
+
+ ); + })} +
+
+ + +
+
+ + +
+
+
+
+ +
+
+
+ ); }; export const CalnWid = () => { - const sidepane = useSelector((state) => state.sidepane); - const [loaded, setLoad] = useState(false); + const sidepane = useSelector((state) => state.sidepane); + const [loaded, setLoad] = useState(false); - const [collapse, setCollapse] = useState(""); + const [collapse, setCollapse] = useState(""); - const collapseToggler = () => { - collapse === "" ? setCollapse("collapse") : setCollapse(""); - }; + const collapseToggler = () => { + collapse === "" ? setCollapse("collapse") : setCollapse(""); + }; - useEffect(() => { - if (!loaded) { - setLoad(true); - window.dycalendar.draw({ - target: "#dycalendar", - type: "month", - dayformat: "ddd", - monthformat: "full", - prevnextbutton: "show", - highlighttoday: true, - }); - } - }); + useEffect(() => { + if (!loaded) { + setLoad(true); + window.dycalendar.draw({ + target: "#dycalendar", + type: "month", + dayformat: "ddd", + monthformat: "full", + prevnextbutton: "show", + highlighttoday: true, + }); + } + }); - return ( -
-
-
- {new Date().toLocaleDateString(undefined, { - weekday: "long", - month: "long", - day: "numeric", - })} -
-
- {collapse === "" ? ( - - ) : ( - - )} -
-
-
-
- ); + return ( +
+
+
+ {new Date().toLocaleDateString(undefined, { + weekday: "long", + month: "long", + day: "numeric", + })} +
+
+ {collapse === "" ? ( + + ) : ( + + )} +
+
+
+
+ ); }; diff --git a/src/components/start/searchpane.scss b/src/components/start/searchpane.scss index 1e106e553..e680cccc7 100644 --- a/src/components/start/searchpane.scss +++ b/src/components/start/searchpane.scss @@ -1,131 +1,131 @@ .searchMenu { - min-height: 500px; - padding: 32px; - text-align: left; + min-height: 500px; + padding: 32px; + text-align: left; } .searchBar { - height: 30px; - border-bottom: solid 2px var(--clrPrm); - border-radius: 4px; - background: var(--comp-clr); - display: flex; - padding: 0 10px; - - .uicon { - filter: brightness(0.6); - margin-right: 12px; - } - - input { - width: 100%; - background: inherit; - color: var(--dark-txt); - - &::placeholder { - color: var(--txt-col); - } - } + height: 30px; + border-bottom: solid 2px var(--clrPrm); + border-radius: 4px; + background: var(--comp-clr); + display: flex; + padding: 0 10px; + + .uicon { + filter: brightness(0.6); + margin-right: 12px; + } + + input { + width: 100%; + background: inherit; + color: var(--dark-txt); + + &::placeholder { + color: var(--txt-col); + } + } } .smatch { - background: var(--bg2); + background: var(--bg2); } .opts { - color: var(--med-txt); + color: var(--med-txt); - div { - border: solid 0 var(--clrPrm); - cursor: pointer; + div { + border: solid 0 var(--clrPrm); + cursor: pointer; - &[value="true"] { - border-bottom-width: 2px; - color: var(--dark-txt); - } - } + &[value="true"] { + border-bottom-width: 2px; + color: var(--dark-txt); + } + } } .leftSide { - width: 100%; + width: 100%; } .leftSide[data-width="true"] { - width: 32%; + width: 32%; } .rightSide { - margin: 8px; - height: 560px; - background: var(--bg2); - display: flex; - flex-direction: column; - align-items: center; - - .hline { - width: 90%; - height: 1px; - border-radius: 10px; - background: var(--bg2); - } + margin: 8px; + height: 560px; + background: var(--bg2); + display: flex; + flex-direction: column; + align-items: center; + + .hline { + width: 90%; + height: 1px; + border-radius: 10px; + background: var(--bg2); + } } .topApp { - background: var(--bg2); - width: 19%; - display: flex; - flex-direction: column; - align-items: center; - border-radius: 4px; - - &:hover { - filter: brightness(0.9); - } + background: var(--bg2); + width: 19%; + display: flex; + flex-direction: column; + align-items: center; + border-radius: 4px; + + &:hover { + filter: brightness(0.9); + } } .qksrch { - border-radius: 4px; + border-radius: 4px; - .uicon { - font-size: 20px; - } + .uicon { + font-size: 20px; + } - &:hover { - background: var(--bg2); - } + &:hover { + background: var(--bg2); + } } .powerCont { - position: absolute; - top: -100px; - left: -36px; - width: 108px; - font-size: 12px; - background: var(--bg2); - padding: 4px 6px; - border-radius: 6px; - box-shadow: 2px 2px 12px rgba(46, 40, 40, 0.25); - opacity: 0; - transform: translateY(20px); - pointer-events: none; - transition: all 200ms ease-in-out; - - &[data-vis="true"] { - opacity: 1; - transform: translateY(0); - pointer-events: auto; - } - - .flex { - padding: 4px 6px; - border-radius: 4px; - - &:hover { - background: var(--bg2); - } - } - - .uicon { - margin-right: 8px; - } + position: absolute; + top: -100px; + left: -36px; + width: 108px; + font-size: 12px; + background: var(--bg2); + padding: 4px 6px; + border-radius: 6px; + box-shadow: 2px 2px 12px rgba(46, 40, 40, 0.25); + opacity: 0; + transform: translateY(20px); + pointer-events: none; + transition: all 200ms ease-in-out; + + &[data-vis="true"] { + opacity: 1; + transform: translateY(0); + pointer-events: auto; + } + + .flex { + padding: 4px 6px; + border-radius: 4px; + + &:hover { + background: var(--bg2); + } + } + + .uicon { + margin-right: 8px; + } } diff --git a/src/components/start/start.jsx b/src/components/start/start.jsx index e0ab130c6..ca3300219 100644 --- a/src/components/start/start.jsx +++ b/src/components/start/start.jsx @@ -3,474 +3,474 @@ import { useSelector, useDispatch } from "react-redux"; import { Icon } from "../../utils/general"; export const StartMenu = () => { - const { align } = useSelector((state) => state.taskbar); - const start = useSelector((state) => { - var arr = state.startmenu, - ln = (6 - (arr.pnApps.length % 6)) % 6; + const { align } = useSelector((state) => state.taskbar); + const start = useSelector((state) => { + var arr = state.startmenu, + ln = (6 - (arr.pnApps.length % 6)) % 6; - for (var i = 0; i < ln; i++) { - arr.pnApps.push({ - empty: true, - }); - } + for (var i = 0; i < ln; i++) { + arr.pnApps.push({ + empty: true, + }); + } - for (i = 0; i < arr.rcApps.length; i++) { - if (arr.rcApps[i].lastUsed < 0) { - arr.rcApps[i].lastUsed = "Recently Added"; - } else if (arr.rcApps[i].lastUsed < 10) { - arr.rcApps[i].lastUsed = "Just Now"; - } else if (arr.rcApps[i].lastUsed < 60) { - arr.rcApps[i].lastUsed += "m ago"; - } else if (arr.rcApps[i].lastUsed < 360) { - arr.rcApps[i].lastUsed = - Math.floor(arr.rcApps[i].lastUsed / 60) + "h ago"; - } - } + for (i = 0; i < arr.rcApps.length; i++) { + if (arr.rcApps[i].lastUsed < 0) { + arr.rcApps[i].lastUsed = "Recently Added"; + } else if (arr.rcApps[i].lastUsed < 10) { + arr.rcApps[i].lastUsed = "Just Now"; + } else if (arr.rcApps[i].lastUsed < 60) { + arr.rcApps[i].lastUsed += "m ago"; + } else if (arr.rcApps[i].lastUsed < 360) { + arr.rcApps[i].lastUsed = + Math.floor(arr.rcApps[i].lastUsed / 60) + "h ago"; + } + } - var allApps = [], - tmpApps = Object.keys(state.apps) - .filter((x) => x != "hz") - .map((key) => { - return state.apps[key]; - }); + var allApps = [], + tmpApps = Object.keys(state.apps) + .filter((x) => x != "hz") + .map((key) => { + return state.apps[key]; + }); - tmpApps.sort((a, b) => (a.name > b.name ? 1 : b.name > a.name ? -1 : 0)); + tmpApps.sort((a, b) => (a.name > b.name ? 1 : b.name > a.name ? -1 : 0)); - for (i = 0; i < 27; i++) { - allApps[i] = []; - } + for (i = 0; i < 27; i++) { + allApps[i] = []; + } - for (i = 0; i < tmpApps.length; i++) { - var t1 = tmpApps[i].name.trim().toUpperCase().charCodeAt(0); - if (t1 > 64 && t1 < 91) { - allApps[t1 - 64].push(tmpApps[i]); - } else { - allApps[0].push(tmpApps[i]); - } - } + for (i = 0; i < tmpApps.length; i++) { + var t1 = tmpApps[i].name.trim().toUpperCase().charCodeAt(0); + if (t1 > 64 && t1 < 91) { + allApps[t1 - 64].push(tmpApps[i]); + } else { + allApps[0].push(tmpApps[i]); + } + } - arr.contApps = allApps; - arr.allApps = tmpApps; - return arr; - }); + arr.contApps = allApps; + arr.allApps = tmpApps; + return arr; + }); - const [query, setQuery] = useState(""); - const [match, setMatch] = useState({}); - const [atab, setTab] = useState("All"); - // const [pwctrl, setPowCtrl] = useState + const [query, setQuery] = useState(""); + const [match, setMatch] = useState({}); + const [atab, setTab] = useState("All"); + // const [pwctrl, setPowCtrl] = useState - const dispatch = useDispatch(); - const tabSw = (e) => { - setTab(e.target.innerText.trim()); - }; + const dispatch = useDispatch(); + const tabSw = (e) => { + setTab(e.target.innerText.trim()); + }; - const clickDispatch = (event) => { - var action = { - type: event.target.dataset.action, - payload: event.target.dataset.payload, - }; + const clickDispatch = (event) => { + var action = { + type: event.target.dataset.action, + payload: event.target.dataset.payload, + }; - if (action.type) { - dispatch(action); - } + if (action.type) { + dispatch(action); + } - if ( - action.type && - (action.payload == "full" || action.type == "EDGELINK") - ) { - dispatch({ - type: "STARTHID", - }); - } + if ( + action.type && + (action.payload == "full" || action.type == "EDGELINK") + ) { + dispatch({ + type: "STARTHID", + }); + } - if (action.type == "STARTALPHA") { - var target = document.getElementById("char" + action.payload); - if (target) { - target.parentNode.scrollTop = target.offsetTop; - } else { - var target = document.getElementById("charA"); - target.parentNode.scrollTop = 0; - } - } - }; + if (action.type == "STARTALPHA") { + var target = document.getElementById("char" + action.payload); + if (target) { + target.parentNode.scrollTop = target.offsetTop; + } else { + var target = document.getElementById("charA"); + target.parentNode.scrollTop = 0; + } + } + }; - useEffect(() => { - if (query.length) { - for (var i = 0; i < start.allApps.length; i++) { - if (start.allApps[i].name.toLowerCase().includes(query.toLowerCase())) { - setMatch(start.allApps[i]); - break; - } - } - } - }, [query]); + useEffect(() => { + if (query.length) { + for (var i = 0; i < start.allApps.length; i++) { + if (start.allApps[i].name.toLowerCase().includes(query.toLowerCase())) { + setMatch(start.allApps[i]); + break; + } + } + } + }, [query]); - const userName = useSelector((state) => state.setting.person.name); + const userName = useSelector((state) => state.setting.person.name); - return ( -
- {start.menu ? ( - <> -
-
-
-
-
Pinned
-
-
All apps
- -
-
-
- {start.pnApps.map((app, i) => { - return app.empty ? ( -
- ) : ( -
- -
{app.name}
-
- ); - })} -
-
-
-
-
Recommended
-
-
More
- -
-
-
- {start.rcApps.slice(0, 6).map((app, i) => { - return app.name ? ( -
- -
-
{app.name}
-
{app.lastUsed}
-
-
- ) : null; - })} -
-
-
-
-
-
-
-
All apps
-
- -
Back
-
-
-
- {start.contApps.map((ldx, i) => { - if (ldx.length == 0) return null; + return ( +
+ {start.menu ? ( + <> +
+
+
+
+
Pinned
+
+
All apps
+ +
+
+
+ {start.pnApps.map((app, i) => { + return app.empty ? ( +
+ ) : ( +
+ +
{app.name}
+
+ ); + })} +
+
+
+
+
Recommended
+
+
More
+ +
+
+
+ {start.rcApps.slice(0, 6).map((app, i) => { + return app.name ? ( +
+ +
+
{app.name}
+
{app.lastUsed}
+
+
+ ) : null; + })} +
+
+
+
+
+
+
+
All apps
+
+ +
Back
+
+
+
+ {start.contApps.map((ldx, i) => { + if (ldx.length == 0) return null; - var tpApps = []; - tpApps.push( -
-
- {i == 0 ? "#" : String.fromCharCode(i + 64)} -
-
- ); + var tpApps = []; + tpApps.push( +
+
+ {i == 0 ? "#" : String.fromCharCode(i + 64)} +
+
+ ); - ldx.forEach((app, j) => { - tpApps.push( -
- -
{app.name}
-
- ); - }); + ldx.forEach((app, j) => { + tpApps.push( +
+ +
{app.name}
+
+ ); + }); - return tpApps; - })} -
-
-
-
-
&
-
- {start.contApps.map((ldx, i) => { - return ( -
-
- {i == 0 ? "#" : String.fromCharCode(i + 64)} -
-
- ); - })} -
-
-
-
-
-
- -
{userName}
-
-
-
-
- - - - Lock -
-
- - - - Shut down -
-
- - - - Restart -
-
- - - -
-
- - ) : ( -
-
- - { - setQuery(event.target.value.trim()); - }} - defaultValue={query} - placeholder="Type here to search" - autoFocus - /> -
-
-
-
- All -
-
- Apps -
-
- Documents -
-
- Web -
-
- More -
-
-
-
-
-
- {query.length ? "Best match" : "Top apps"} -
- {query.length ? ( -
-
- -
-
{match.name}
-
App
-
-
-
- -
-
Search online
-
Web
-
-
-
- ) : ( - <> -
- {start.rcApps.slice(1, 7).map((app, i) => { - return ( -
- -
{app.name}
-
- ); - })} -
-
- Quick Searches -
-
- {start.qksrch.map((srch, i) => { - return ( -
- -
{srch[2]}
-
- ); - })} -
- - )} -
- {query.length ? ( -
- -
{match.name}
-
App
-
-
- -
Open
-
-
- ) : null} -
-
- )} -
- ); + return tpApps; + })} +
+
+
+
+
&
+
+ {start.contApps.map((ldx, i) => { + return ( +
+
+ {i == 0 ? "#" : String.fromCharCode(i + 64)} +
+
+ ); + })} +
+
+
+
+
+
+ +
{userName}
+
+
+
+
+ + + + Lock +
+
+ + + + Shut down +
+
+ + + + Restart +
+
+ + + +
+
+ + ) : ( +
+
+ + { + setQuery(event.target.value.trim()); + }} + defaultValue={query} + placeholder="Type here to search" + autoFocus + /> +
+
+
+
+ All +
+
+ Apps +
+
+ Documents +
+
+ Web +
+
+ More +
+
+
+
+
+
+ {query.length ? "Best match" : "Top apps"} +
+ {query.length ? ( +
+
+ +
+
{match.name}
+
App
+
+
+
+ +
+
Search online
+
Web
+
+
+
+ ) : ( + <> +
+ {start.rcApps.slice(1, 7).map((app, i) => { + return ( +
+ +
{app.name}
+
+ ); + })} +
+
+ Quick Searches +
+
+ {start.qksrch.map((srch, i) => { + return ( +
+ +
{srch[2]}
+
+ ); + })} +
+ + )} +
+ {query.length ? ( +
+ +
{match.name}
+
App
+
+
+ +
Open
+
+
+ ) : null} +
+
+ )} +
+ ); }; diff --git a/src/components/start/widget.jsx b/src/components/start/widget.jsx index 4f32afad2..8f5bb3965 100644 --- a/src/components/start/widget.jsx +++ b/src/components/start/widget.jsx @@ -4,203 +4,203 @@ import { Icon, LazyComponent } from "../../utils/general"; import "./widget.scss"; export const WidPane = () => { - const dispatch = useDispatch(); - const widget = useSelector((state) => state.widpane); - const theme = useSelector((state) => state.setting.person.theme); - const getRandom = (x = 0) => { - if (theme == "light") - return `hsl(${Math.floor(Math.random() * 360)}deg 36% 84%)`; - if (theme == "dark") - return `hsl(${Math.floor(Math.random() * 360)}deg 36% 16%)`; - }; + const dispatch = useDispatch(); + const widget = useSelector((state) => state.widpane); + const theme = useSelector((state) => state.setting.person.theme); + const getRandom = (x = 0) => { + if (theme == "light") + return `hsl(${Math.floor(Math.random() * 360)}deg 36% 84%)`; + if (theme == "dark") + return `hsl(${Math.floor(Math.random() * 360)}deg 36% 16%)`; + }; - return ( -
- -
-
- -
-
- {new Date().toLocaleTimeString("en-US", { - hour: "numeric", - minute: "2-digit", - })} -
-
-
-
-
- Weather -
-
- - {widget.data.weather.city}, {widget.data.weather.country} -
-
-
- -
{widget.data.weather.temp}
-
ยบC
-
-
-
{widget.data.weather.wstate}
-
-
- - {widget.data.weather.rain}% -
-
- - {widget.data.weather.wind} -
-
-
-
-
- {widget.data.weather.days.map((item, i) => { - return ( -
-
{i == 0 ? "Today" : item.day}
- + return ( +
+ +
+
+ +
+
+ {new Date().toLocaleTimeString("en-US", { + hour: "numeric", + minute: "2-digit", + })} +
+
+
+
+
+ Weather +
+
+ + {widget.data.weather.city}, {widget.data.weather.country} +
+
+
+ +
{widget.data.weather.temp}
+
ยบC
+
+
+
{widget.data.weather.wstate}
+
+
+ + {widget.data.weather.rain}% +
+
+ + {widget.data.weather.wind} +
+
+
+
+
+ {widget.data.weather.days.map((item, i) => { + return ( +
+
{i == 0 ? "Today" : item.day}
+ -
{item.min}ยบ
-
{item.max}ยบ
-
- ); - })} -
-
-
-
-
MONEY | MARKET
-
-
- -
GOOGL
-
-
-
{widget.data.stock[0][0]}
-
- {widget.data.stock[0][2] ? "+" : "-"} - {widget.data.stock[0][1]}% -
-
-
-
-
- -
TSLA
-
-
-
{widget.data.stock[1][0]}
-
- {widget.data.stock[1][2] ? "+" : "-"} - {widget.data.stock[1][1]}% -
-
-
-
-
-
-
- -  ON THIS DAY -
-
{widget.data.date}
-
-
-
{widget.data.event.text}
- - more on wiki - -
-
-
-
-
-
-
TOP STORIES
-
- {[...widget.data.news].splice(0, 4).map((article, i) => { - return ( -
-
{article.source.name}
-
{article.title}
-
- ); - })} -
-
-
- {[...widget.data.news] - .splice(4, widget.data.news.length) - .map((article, i) => { - return ( - -
-
{article.source.name}
-
{article.title}
- {i % 5 == 4 ? ( -
{article.content}
- ) : null} -
- - ); - })} -
-
-
-
- -
- ); +
{item.min}ยบ
+
{item.max}ยบ
+
+ ); + })} +
+
+
+
+
MONEY | MARKET
+
+
+ +
GOOGL
+
+
+
{widget.data.stock[0][0]}
+
+ {widget.data.stock[0][2] ? "+" : "-"} + {widget.data.stock[0][1]}% +
+
+
+
+
+ +
TSLA
+
+
+
{widget.data.stock[1][0]}
+
+ {widget.data.stock[1][2] ? "+" : "-"} + {widget.data.stock[1][1]}% +
+
+
+
+
+
+
+ +  ON THIS DAY +
+
{widget.data.date}
+
+
+
{widget.data.event.text}
+ + more on wiki + +
+
+
+
+
+
+
TOP STORIES
+
+ {[...widget.data.news].splice(0, 4).map((article, i) => { + return ( +
+
{article.source.name}
+
{article.title}
+
+ ); + })} +
+
+
+ {[...widget.data.news] + .splice(4, widget.data.news.length) + .map((article, i) => { + return ( + +
+
{article.source.name}
+
{article.title}
+ {i % 5 == 4 ? ( +
{article.content}
+ ) : null} +
+ + ); + })} +
+
+
+
+ +
+ ); }; diff --git a/src/components/taskbar/index.jsx b/src/components/taskbar/index.jsx index 1d40fe8a4..1d2387ae9 100644 --- a/src/components/taskbar/index.jsx +++ b/src/components/taskbar/index.jsx @@ -5,178 +5,178 @@ import Battery from "../shared/Battery"; import "./taskbar.scss"; const Taskbar = () => { - const tasks = useSelector((state) => { - return state.taskbar; - }); - const apps = useSelector((state) => { - var tmpApps = { ...state.apps }; - for (var i = 0; i < state.taskbar.apps.length; i++) { - tmpApps[state.taskbar.apps[i].icon].task = true; - } - return tmpApps; - }); - const dispatch = useDispatch(); + const tasks = useSelector((state) => { + return state.taskbar; + }); + const apps = useSelector((state) => { + var tmpApps = { ...state.apps }; + for (var i = 0; i < state.taskbar.apps.length; i++) { + tmpApps[state.taskbar.apps[i].icon].task = true; + } + return tmpApps; + }); + const dispatch = useDispatch(); - const showPrev = (event) => { - var ele = event.target; - while (ele && ele.getAttribute("value") == null) { - ele = ele.parentElement; - } + const showPrev = (event) => { + var ele = event.target; + while (ele && ele.getAttribute("value") == null) { + ele = ele.parentElement; + } - var appPrev = ele.getAttribute("value"); - var xpos = window.scrollX + ele.getBoundingClientRect().left; + var appPrev = ele.getAttribute("value"); + var xpos = window.scrollX + ele.getBoundingClientRect().left; - var offsetx = Math.round((xpos * 10000) / window.innerWidth) / 100; + var offsetx = Math.round((xpos * 10000) / window.innerWidth) / 100; - dispatch({ - type: "TASKPSHOW", - payload: { - app: appPrev, - pos: offsetx, - }, - }); - }; + dispatch({ + type: "TASKPSHOW", + payload: { + app: appPrev, + pos: offsetx, + }, + }); + }; - const hidePrev = () => { - dispatch({ type: "TASKPHIDE" }); - }; + const hidePrev = () => { + dispatch({ type: "TASKPHIDE" }); + }; - const clickDispatch = (event) => { - var action = { - type: event.target.dataset.action, - payload: event.target.dataset.payload, - }; + const clickDispatch = (event) => { + var action = { + type: event.target.dataset.action, + payload: event.target.dataset.payload, + }; - if (action.type) { - dispatch(action); - } - }; + if (action.type) { + dispatch(action); + } + }; - const [time, setTime] = useState(new Date()); + const [time, setTime] = useState(new Date()); - useEffect(() => { - const interval = setInterval(() => { - setTime(new Date()); - }, 1000); - return () => clearInterval(interval); - }, []); + useEffect(() => { + const interval = setInterval(() => { + setTime(new Date()); + }, 1000); + return () => clearInterval(interval); + }, []); - return ( -
-
-
-
- - {tasks.search ? ( - - ) : null} - {tasks.widgets ? ( - - ) : null} - {tasks.apps.map((task, i) => { - var isHidden = apps[task.icon].hide; - var isActive = apps[task.icon].z == apps.hz; - return ( -
- -
- ); - })} - {Object.keys(apps).map((key, i) => { - if (key != "hz") { - var isActive = apps[key].z == apps.hz; - } - return key != "hz" && - key != "undefined" && - !apps[key].task && - !apps[key].hide ? ( -
- -
- ) : null; - })} -
-
-
-
- -
-
- - - -
+ return ( +
+
+
+
+ + {tasks.search ? ( + + ) : null} + {tasks.widgets ? ( + + ) : null} + {tasks.apps.map((task, i) => { + var isHidden = apps[task.icon].hide; + var isActive = apps[task.icon].z == apps.hz; + return ( +
+ +
+ ); + })} + {Object.keys(apps).map((key, i) => { + if (key != "hz") { + var isActive = apps[key].z == apps.hz; + } + return key != "hz" && + key != "undefined" && + !apps[key].task && + !apps[key].hide ? ( +
+ +
+ ) : null; + })} +
+
+
+
+ +
+
+ + + +
-
-
- {time.toLocaleTimeString("en-US", { - hour: "numeric", - minute: "numeric", - })} -
-
- {time.toLocaleDateString("en-US", { - year: "2-digit", - month: "2-digit", - day: "numeric", - })} -
-
- -
-
-
- ); +
+
+ {time.toLocaleTimeString("en-US", { + hour: "numeric", + minute: "numeric", + })} +
+
+ {time.toLocaleDateString("en-US", { + year: "2-digit", + month: "2-digit", + day: "numeric", + })} +
+
+ +
+
+
+ ); }; export default Taskbar; diff --git a/src/components/taskbar/taskbar.scss b/src/components/taskbar/taskbar.scss index 71e187ed6..88d9b8104 100644 --- a/src/components/taskbar/taskbar.scss +++ b/src/components/taskbar/taskbar.scss @@ -1,159 +1,159 @@ .taskbar { - --bg1: rgba(243, 243, 243, 0.85); - --bg2: rgba(255, 255, 255, 0.67); - - position: absolute; - width: 100vw; - height: 48px; - color: var(--dark-txt); - background: var(--bg1); - -webkit-backdrop-filter: saturate(3) blur(20px); - backdrop-filter: saturate(3) blur(20px); - bottom: 0; - z-index: 10000; + --bg1: rgba(243, 243, 243, 0.85); + --bg2: rgba(255, 255, 255, 0.67); + + position: absolute; + width: 100vw; + height: 48px; + color: var(--dark-txt); + background: var(--bg1); + -webkit-backdrop-filter: saturate(3) blur(20px); + backdrop-filter: saturate(3) blur(20px); + bottom: 0; + z-index: 10000; } body[data-theme="dark"] { - .taskbar { - --bg1: rgba(32, 32, 32, 0.75); - --bg2: rgba(255, 255, 255, 0.1); - } - - .taskIcon, - .searchIcon img { - filter: invert(1); - } + .taskbar { + --bg1: rgba(32, 32, 32, 0.75); + --bg2: rgba(255, 255, 255, 0.1); + } + + .taskIcon, + .searchIcon img { + filter: invert(1); + } } .taskcont { - position: relative; - width: 100%; - height: 100%; + position: relative; + width: 100%; + height: 100%; } .taskright { - position: absolute; - top: 0; - right: 0; - width: auto; - height: 100%; - margin-left: 10px; - display: flex; + position: absolute; + top: 0; + right: 0; + width: auto; + height: 100%; + margin-left: 10px; + display: flex; } .taskIcon { - display: flex; - flex-direction: column; - justify-content: center; - width: 24px; - - svg { - color: #303030; - } + display: flex; + flex-direction: column; + justify-content: center; + width: 24px; + + svg { + color: #303030; + } } .taskDate { - display: flex; - padding: 0 8px; - font-size: 11px; - flex-direction: column; - justify-content: center; - - div { - width: 100%; - text-align: center; - font-weight: 400; - } + display: flex; + padding: 0 8px; + font-size: 11px; + flex-direction: column; + justify-content: center; + + div { + width: 100%; + text-align: center; + font-weight: 400; + } } .tasksCont { - width: 100%; - height: 100%; - display: flex; - flex-direction: column; - - &[data-side="center"] { - align-items: center; - - .widget { - position: absolute; - left: 8px; - } - } - - &[data-side="left"] { - align-items: flex-start; - } + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + + &[data-side="center"] { + align-items: center; + + .widget { + position: absolute; + left: 8px; + } + } + + &[data-side="left"] { + align-items: flex-start; + } } .tsbar { - width: auto; - height: 100%; - display: flex; - align-items: center; - transition: all ease-in-out 200ms; + width: auto; + height: 100%; + display: flex; + align-items: center; + transition: all ease-in-out 200ms; } .tsIcon { - position: relative; - width: 38px; - height: 38px; - margin: auto 3px; - box-sizing: border-box; - border-radius: 0; - background: rgba(254, 254, 254, 0); - transform-origin: center; - animation: popintro 800ms ease-in-out; - transition: all 0.2s ease; - border-radius: 4px; - - &:after { - content: ""; - position: absolute; - display: block; - bottom: 0; - width: 0px; - height: 3px; - border-radius: 4px; - background: #858585; - transition: all 0.2s ease-in-out; - } - - &[data-open="true"]:after { - width: 6px; - } - - &[data-active="true"]:after { - width: 12px; - background: var(--clrPrm); - } - - &:hover, - &[data-active="true"] { - background: var(--bg2); - } + position: relative; + width: 38px; + height: 38px; + margin: auto 3px; + box-sizing: border-box; + border-radius: 0; + background: rgba(254, 254, 254, 0); + transform-origin: center; + animation: popintro 800ms ease-in-out; + transition: all 0.2s ease; + border-radius: 4px; + + &:after { + content: ""; + position: absolute; + display: block; + bottom: 0; + width: 0px; + height: 3px; + border-radius: 4px; + background: #858585; + transition: all 0.2s ease-in-out; + } + + &[data-open="true"]:after { + width: 6px; + } + + &[data-active="true"]:after { + width: 12px; + background: var(--clrPrm); + } + + &:hover, + &[data-active="true"] { + background: var(--bg2); + } } .graybd { - border: solid 1px transparent; - height: 1rem; + border: solid 1px transparent; + height: 1rem; } .graybd:hover { - border: solid 1px #a1a1a1; - border-width: 0 0 0 2px; + border: solid 1px #a1a1a1; + border-width: 0 0 0 2px; } @keyframes popintro { - 0% { - transform: scale(0); - } - 40% { - transform: scale(1.125); - } - 70% { - transform: scale(0.725); - } - 100% { - transform: scale(1); - } + 0% { + transform: scale(0); + } + 40% { + transform: scale(1.125); + } + 70% { + transform: scale(0.725); + } + 100% { + transform: scale(1); + } } diff --git a/src/containers/applications/apps/about.jsx b/src/containers/applications/apps/about.jsx index ab058d901..6d45f9bbe 100644 --- a/src/containers/applications/apps/about.jsx +++ b/src/containers/applications/apps/about.jsx @@ -3,74 +3,74 @@ import { useSelector, useDispatch } from "react-redux"; import { useTranslation } from "react-i18next"; export const AboutWin = () => { - const { abOpen } = useSelector((state) => state.desktop); - const { locked, booted } = useSelector((state) => state.wallpaper); - const [open, setOpen] = useState( - true && import.meta.env.MODE != "development" - ); - const [timer, setTimer] = useState( - localStorage.getItem("closeAbout") == "true" ? 0 : 5 - ); - const dispatch = useDispatch(); - const { t, i18n } = useTranslation(); + const { abOpen } = useSelector((state) => state.desktop); + const { locked, booted } = useSelector((state) => state.wallpaper); + const [open, setOpen] = useState( + true && import.meta.env.MODE != "development" + ); + const [timer, setTimer] = useState( + localStorage.getItem("closeAbout") == "true" ? 0 : 5 + ); + const dispatch = useDispatch(); + const { t, i18n } = useTranslation(); - const action = () => { - setOpen(false); - localStorage.setItem("closeAbout", true); - dispatch({ type: "DESKABOUT", payload: false }); - }; + const action = () => { + setOpen(false); + localStorage.setItem("closeAbout", true); + dispatch({ type: "DESKABOUT", payload: false }); + }; - useEffect(() => { - if (timer > 0 && !locked && booted) { - setTimeout(() => { - setTimer(timer - 1); - }, 1000); - } - }, [timer, locked, booted]); + useEffect(() => { + if (timer > 0 && !locked && booted) { + setTimeout(() => { + setTimer(timer - 1); + }, 1000); + } + }, [timer, locked, booted]); - return open || abOpen ? ( -
-
-
{t("about.title")}
-

{t("about.opensource")}

-

- {t("about.licensed")}  - - {t("about.Creative-Commons")} - - . -

-

- {t("about.contact")} :  - - blue@win11react.com - -

+ return open || abOpen ? ( +
+
+
{t("about.title")}
+

{t("about.opensource")}

+

+ {t("about.licensed")}  + + {t("about.Creative-Commons")} + + . +

+

+ {t("about.contact")} :  + + blue@win11react.com + +

-

{t("about.notmicrosoft")}

-

- {t("about.alsonot")}  - - Windows 365 cloud PC - - . -

-

{t("about.microsoftcopywrite")}.

-
-
-
- {t("about.understand")}{" "} - {timer > 0 ? {`( ${timer} )`} : null} -
-
-
- ) : null; +

{t("about.notmicrosoft")}

+

+ {t("about.alsonot")}  + + Windows 365 cloud PC + + . +

+

{t("about.microsoftcopywrite")}.

+
+
+
+ {t("about.understand")}{" "} + {timer > 0 ? {`( ${timer} )`} : null} +
+
+
+ ) : null; }; diff --git a/src/containers/applications/apps/assets/Langswitch.jsx b/src/containers/applications/apps/assets/Langswitch.jsx index ad18f653e..5358c12c0 100644 --- a/src/containers/applications/apps/assets/Langswitch.jsx +++ b/src/containers/applications/apps/assets/Langswitch.jsx @@ -2,29 +2,29 @@ import React from "react"; import i18next from "i18next"; function LangSwitch() { - return ( -
- -
- ); + return ( +
+ +
+ ); } export default LangSwitch; diff --git a/src/containers/applications/apps/assets/getstarted.scss b/src/containers/applications/apps/assets/getstarted.scss index ddfb987e9..3f290babe 100644 --- a/src/containers/applications/apps/assets/getstarted.scss +++ b/src/containers/applications/apps/assets/getstarted.scss @@ -213,4 +213,4 @@ body[data-theme="dark"] .getstarted { .acsblty { filter: invert(1); } -} \ No newline at end of file +} diff --git a/src/containers/applications/apps/assets/index.jsx b/src/containers/applications/apps/assets/index.jsx index b07698fd8..31c51032a 100644 --- a/src/containers/applications/apps/assets/index.jsx +++ b/src/containers/applications/apps/assets/index.jsx @@ -1,22 +1,22 @@ import React from "react"; export const Mark = (props) => { - return ( - - - - - ); + return ( + + + + + ); }; diff --git a/src/containers/applications/apps/assets/jiosaavn.js b/src/containers/applications/apps/assets/jiosaavn.js index cb2a13e19..85891698e 100644 --- a/src/containers/applications/apps/assets/jiosaavn.js +++ b/src/containers/applications/apps/assets/jiosaavn.js @@ -1,67 +1,83 @@ -'use babel'; -import axios from 'axios'; +"use babel"; +import axios from "axios"; -const search_url = "/search?query=" -const song_url = "/song?pids=" -const album_url = "/album?id=" +const search_url = "/search?query="; +const song_url = "/song?pids="; +const album_url = "/album?id="; -const { - floor, - random -} = Math; +const { floor, random } = Math; class JioSaavn { constructor() { // this.ignorewhitespace = true; this.defaultSongs = [ - "Szz0RZFb", "cgM-pRO9", "mPk9X_H_", "R2GnvPCo", "eR_xs61E", "ZGifVkqI", - "TEG8c_EJ", "gy17KLcd", "rkpNHSo1", "o8jkpKcg", "tUjXvoKS", "Kv6rGi1G" + "Szz0RZFb", + "cgM-pRO9", + "mPk9X_H_", + "R2GnvPCo", + "eR_xs61E", + "ZGifVkqI", + "TEG8c_EJ", + "gy17KLcd", + "rkpNHSo1", + "o8jkpKcg", + "tUjXvoKS", + "Kv6rGi1G", ]; - this.dfdata = [{ - id: "Szz0RZFb",//"Szz0RZFb", - album: "Raincoat", - albumArt: "https://c.saavncdn.com/432/Raincoat-Hindi-2004-20210125130707-150x150.jpg", - name: "Piya Tora Kaisa Abhiman", - artist: "Shubha Mudgal", - duration: 297, - src: "https://aac.saavncdn.com/432/545714e974b6138352be162e6f13c4f5_160.mp4" - }] + this.dfdata = [ + { + id: "Szz0RZFb", //"Szz0RZFb", + album: "Raincoat", + albumArt: + "https://c.saavncdn.com/432/Raincoat-Hindi-2004-20210125130707-150x150.jpg", + name: "Piya Tora Kaisa Abhiman", + artist: "Shubha Mudgal", + duration: 297, + src: "https://aac.saavncdn.com/432/545714e974b6138352be162e6f13c4f5_160.mp4", + }, + ]; this.instance = axios.create({ - baseURL: "https://dev.saavn.me" + baseURL: "https://dev.saavn.me", }); } fetch(url, config = {}) { return new Promise((resolve, reject) => { - this.instance(url, config).then((res) => { - resolve(res.data); - }).catch(error => { - reject({ - error: 'axios', - data: error + this.instance(url, config) + .then((res) => { + resolve(res.data); + }) + .catch((error) => { + reject({ + error: "axios", + data: error, + }); }); - }); }); } fetchSong(pids) { - if (typeof (pids) != "object") pids = [pids]; + if (typeof pids != "object") pids = [pids]; return new Promise((resolve, reject) => { - this.fetch(song_url + pids.join(",")).then(res => { - resolve(res[0]); - }).catch(err => reject(err)) - }) + this.fetch(song_url + pids.join(",")) + .then((res) => { + resolve(res[0]); + }) + .catch((err) => reject(err)); + }); } fetchSongs(pids) { - if (typeof (pids) != "object") pids = [pids]; + if (typeof pids != "object") pids = [pids]; return new Promise((resolve, reject) => { - this.fetch(song_url + pids.join(",")).then(res => { - resolve(res); - }).catch(err => reject(err)) - }) + this.fetch(song_url + pids.join(",")) + .then((res) => { + resolve(res); + }) + .catch((err) => reject(err)); + }); } mapToSong(obj) { @@ -72,44 +88,50 @@ class JioSaavn { name: obj.song_name, artist: obj.song_artist, duration: obj.song_duration, - src: obj.download_links && (obj.download_links[1] || obj.download_links[0]) - } + src: + obj.download_links && (obj.download_links[1] || obj.download_links[0]), + }; } getAlbum(id) { return new Promise((resolve, reject) => { - this.fetch(album_url + id).then(res => { - resolve(res); - }).catch(err => reject(err)) - }) + this.fetch(album_url + id) + .then((res) => { + resolve(res); + }) + .catch((err) => reject(err)); + }); } searchQuery(query) { if (query.length < 1) return; return new Promise((resolve, reject) => { this.fetch(search_url + query) - .then(res => resolve(res)).catch(err => reject(err)) - }) + .then((res) => resolve(res)) + .catch((err) => reject(err)); + }); } getDefault() { // console.log("Okay"); - return new Promise(resolve => { + return new Promise((resolve) => { this.fetchSong( this.defaultSongs[floor(random() * this.defaultSongs.length)] - ).then(res => { - resolve([this.mapToSong(res)]); - }).catch(err => { - console.log(err); - resolve(this.dfdata); - }) - }) + ) + .then((res) => { + resolve([this.mapToSong(res)]); + }) + .catch((err) => { + console.log(err); + resolve(this.dfdata); + }); + }); } formatTime(sec) { if (!sec) return "0:00"; var res = floor(sec / 60); - res += ':'; + res += ":"; sec %= 60; if (sec < 10) res += "0"; res += sec; @@ -119,18 +141,20 @@ class JioSaavn { formatPeriod(sec) { if (!sec) return ""; - var res = "", h = floor(sec / 3600); + var res = "", + h = floor(sec / 3600); if (h != 0) res += h + " hr "; sec = sec % 3600; - res += floor(sec / 60) + ' min '; + res += floor(sec / 60) + " min "; sec %= 60; - res += sec + ' sec'; + res += sec + " sec"; return res; } shuffle(arr) { var currentIndex = arr.length, - temporaryValue, randomIndex; + temporaryValue, + randomIndex; while (0 !== currentIndex) { randomIndex = floor(random() * currentIndex); currentIndex -= 1; @@ -142,16 +166,16 @@ class JioSaavn { } mixQueue(n) { - var arr = [] - for (var i = 0; i < n; i++) arr.push(i) - var brr = this.shuffle([...arr]) - for (var i = 0; i < n; i++) arr[brr[i]] = brr[(i + 1) % n] + var arr = []; + for (var i = 0; i < n; i++) arr.push(i); + var brr = this.shuffle([...arr]); + for (var i = 0; i < n; i++) arr[brr[i]] = brr[(i + 1) % n]; - return arr + return arr; } sliceArr(arr, i) { - return arr.slice(i + 1, arr.length).concat(arr.slice(0, i)) + return arr.slice(i + 1, arr.length).concat(arr.slice(0, i)); } } diff --git a/src/containers/applications/apps/assets/songs.json b/src/containers/applications/apps/assets/songs.json index ed77903f0..febf35811 100644 --- a/src/containers/applications/apps/assets/songs.json +++ b/src/containers/applications/apps/assets/songs.json @@ -1,309 +1,420 @@ { - "home": [{ + "home": [ + { "name": "Made for you", "desc": "Get better recommendations the more you listen", - "cards": [{ + "cards": [ + { "type": "mix", "img": "https://c.saavncdn.com/artists/Arijit_Singh_500x500.jpg", "name": "Daily Mix 1", "desc": "Arijit Singh, Jubin Nautiyal, Darshan Raval and more", - "data": ["1F6WUTJk","ZGifVkqI","m6DcVXHw","3x-IwBwd","aOEJX-ur", - "tIn7iq-R","7pyE_xRk","CaFn4YtS","9MZHxohI","gf4cA9Jj"] + "data": [ + "1F6WUTJk", + "ZGifVkqI", + "m6DcVXHw", + "3x-IwBwd", + "aOEJX-ur", + "tIn7iq-R", + "7pyE_xRk", + "CaFn4YtS", + "9MZHxohI", + "gf4cA9Jj" + ] }, { "type": "mix", "img": "https://c.saavncdn.com/artists/Kavita_Seth_500x500.jpg", "name": "Daily Mix 2", "desc": "Kavita Seth, Alka Yagnik, Shubha Mudgal and more", - "data": ["aUTlRd3u","9B8qM5Gv","Ut_lKlWE","DHrY5Sdd","3Be_U0qz", - "cgM-pRO9","mPk9X_H_","Ni6noMmw","0-5hUtBO","mbKEo3nm"] - }, { + "data": [ + "aUTlRd3u", + "9B8qM5Gv", + "Ut_lKlWE", + "DHrY5Sdd", + "3Be_U0qz", + "cgM-pRO9", + "mPk9X_H_", + "Ni6noMmw", + "0-5hUtBO", + "mbKEo3nm" + ] + }, + { "type": "mix", "img": "https://c.saavncdn.com/067/NF-English-2014-500x500.jpg", "name": "Daily Mix 3", "desc": "NF, Billie Eilish, Powfu and more", - "data": ["o8jkpKcg","ICA-0R1l","Kv6rGi1G","gy17KLcd","TEG8c_EJ", - "4t496tbc","4RmwbCw4","-Uu7zEWP","5QcFgcqA","2oWa2CKB"] - }, { + "data": [ + "o8jkpKcg", + "ICA-0R1l", + "Kv6rGi1G", + "gy17KLcd", + "TEG8c_EJ", + "4t496tbc", + "4RmwbCw4", + "-Uu7zEWP", + "5QcFgcqA", + "2oWa2CKB" + ] + }, + { "type": "mix", "img": "https://c.saavncdn.com/365/Runaway-English-2015-500x500.jpg", "name": "Daily Mix 4", "desc": "AURORA, Ane Brun, SVRCINA and more", - "data": ["tUjXvoKS","tO4KdkvZ","ZScWgymd","6IUC2JRX","ig1HkOTh", - "gSJ7LtZz","2DxytgUN","rkpNHSo1","SxdL_VN6","E0XUOgb0"] - }, { + "data": [ + "tUjXvoKS", + "tO4KdkvZ", + "ZScWgymd", + "6IUC2JRX", + "ig1HkOTh", + "gSJ7LtZz", + "2DxytgUN", + "rkpNHSo1", + "SxdL_VN6", + "E0XUOgb0" + ] + }, + { "type": "mix", "img": "https://c.saavncdn.com/editorial/JhankarBeats_saavn_radio_20201215120219_500x500.jpg", "name": "Discover weekly", "desc": "Your weekly mixtape of fresh music. Enjoy new music and deep cuts picked for you. Updates every Monday.", - "data": ["bniN_G_9","k0pZ9SOq","lteSMrqT","dPE6CaaW","-5HuljV0","izo8AG5O"] - }, { + "data": [ + "bniN_G_9", + "k0pZ9SOq", + "lteSMrqT", + "dPE6CaaW", + "-5HuljV0", + "izo8AG5O" + ] + }, + { "type": "mix", "img": "https://c.saavncdn.com/editorial/Chill_saavn_radio_500x500.jpg", "name": "Chill station", "desc": "Arrive! Your one stop shop to relax and groove.", - "data": ["1ZbsmMvx","49_6hqO9","sEdO8hht","QUNHFVVV", - "VM_1g4L3", "djov7ptD","GQDz4Ji6","4o2SQj5_"] - }, { + "data": [ + "1ZbsmMvx", + "49_6hqO9", + "sEdO8hht", + "QUNHFVVV", + "VM_1g4L3", + "djov7ptD", + "GQDz4Ji6", + "4o2SQj5_" + ] + }, + { "type": "mix", "img": "https://c.saavncdn.com/artists/Taylor_Swift_150x150.jpg", "name": "Daily Mix 5", "desc": "Taylor Swift, Katy Perry, Sophia Somajo and more", - "data": ["ywYcM5y0","CW0maQeQ","Bx-MHJzW","r1L8gMRa","3zP4JQOU"] + "data": ["ywYcM5y0", "CW0maQeQ", "Bx-MHJzW", "r1L8gMRa", "3zP4JQOU"] } ] }, { "name": "Recently Played", - "cards": [{ - "type": "song", - "img": "https://c.saavncdn.com/228/Ek-Nazar-Hindi-2020-20200518060806-500x500.jpg", - "name": "Ek Nazar", - "desc": "Kavita Seth", - "data": "cgM-pRO9" - }, { - "type": "song", - "img": "https://c.saavncdn.com/323/Better-Days-English-2020-20200325160343-500x500.jpg", - "name": "Better Days", - "desc": "OneRepublic", - "data": "JDJfNgEY" - }, { - "type": "artist", - "img": "https://c.saavncdn.com/artists/Sanam_-Band-_002_20201020080410_500x500.jpg", - "name": "Sanam", - "desc": "Band" - }, { - "type": "album", - "img": "https://c.saavncdn.com/066/R-I-S-E-English-2020-20201119060656-500x500.jpg", - "name": "RISE", - "desc": "By WILLOW, Jahnavi Harrison", - "data": "23601363" - },{ - "type": "album", - "img": "https://c.saavncdn.com/019/Still-Here-Hindi-2021-20210309211207-500x500.jpg", - "name": "Still Here", - "desc": "KR$NA", - "data": "25817358" - }] + "cards": [ + { + "type": "song", + "img": "https://c.saavncdn.com/228/Ek-Nazar-Hindi-2020-20200518060806-500x500.jpg", + "name": "Ek Nazar", + "desc": "Kavita Seth", + "data": "cgM-pRO9" + }, + { + "type": "song", + "img": "https://c.saavncdn.com/323/Better-Days-English-2020-20200325160343-500x500.jpg", + "name": "Better Days", + "desc": "OneRepublic", + "data": "JDJfNgEY" + }, + { + "type": "artist", + "img": "https://c.saavncdn.com/artists/Sanam_-Band-_002_20201020080410_500x500.jpg", + "name": "Sanam", + "desc": "Band" + }, + { + "type": "album", + "img": "https://c.saavncdn.com/066/R-I-S-E-English-2020-20201119060656-500x500.jpg", + "name": "RISE", + "desc": "By WILLOW, Jahnavi Harrison", + "data": "23601363" + }, + { + "type": "album", + "img": "https://c.saavncdn.com/019/Still-Here-Hindi-2021-20210309211207-500x500.jpg", + "name": "Still Here", + "desc": "KR$NA", + "data": "25817358" + } + ] }, { "name": "Favorite Songs", - "cards": [{ - "type": "song", - "img": "https://c.saavncdn.com/994/Tamasha-Hindi-2015-500x500.jpg", - "name": "Agar Tum Saath Ho", - "desc": "Alka Yagnik, Arijit Singh", - "data": "Ni6noMmw" - }, { - "type": "song", - "img": "https://c.saavncdn.com/565/Human-English-2016-500x500.jpg", - "name": "Human", - "desc": "Rag'N'Bone Man", - "data": "gLbWqLKC" - }, { - "type": "song", - "img": "https://c.saavncdn.com/855/Homesick-English-2018-20181025170408-500x500.jpg", - "name": "Falling", - "desc": "Trevor Daniel", - "data": "Jm6qLR3V" - }, { - "type": "song", - "img": "https://c.saavncdn.com/790/Gangs-Of-Wasseypur-2012-500x500.jpg", - "name": "Ik Bagal", - "desc": "Piyush Mishra", - "data": "Lo1zbaMa" - }, { - "type": "song", - "img": "https://c.saavncdn.com/032/Jaane-Woh-Kaise-Sanam-Hindi-2017-20171204-500x500.jpg", - "name": "Jaane Woh Kaise", - "desc": "Sanam (Band)", - "data": "FHIMkqMv" - }, { - "type": "song", - "img": "https://c.saavncdn.com/165/Stand-Up-From-Harriet--English-2019-20200414191117-500x500.jpg", - "name": "Stand Up (From Harriet)", - "desc": "Cynthia Erivo", - "data": "tWFkBuSv" - }, { - "type": "song", - "img": "https://c.saavncdn.com/562/Different-World-English-2018-20181130144209-500x500.jpg", - "name": "Lily", - "desc": "Alan Walker, K-391, ...", - "data": "1c-VGSyw" - }, { - "type": "song", - "img": "https://c.saavncdn.com/065/Citylights-Hindi-2014-20190607111647-500x500.jpg", - "name": "Muskurane", - "desc": "Arijit Singh, Jeet Gannguli", - "data": "1K9IsVVU" - }, { - "type": "song", - "img": "https://c.saavncdn.com/702/Dee-MC--Hindi-2019-20191015104339-500x500.jpg", - "name": "Rang", - "desc": "Dee MC (Deepa Unnikrishnan)", - "data": "4bjKwhJ1" - }, { - "type": "song", - "img": "https://c.saavncdn.com/024/Madness-English-2016-500x500.jpg", - "name": "Game of Survival", - "desc": "Ruelle", - "data": "dN9V6uUk" - }] - }, { + "cards": [ + { + "type": "song", + "img": "https://c.saavncdn.com/994/Tamasha-Hindi-2015-500x500.jpg", + "name": "Agar Tum Saath Ho", + "desc": "Alka Yagnik, Arijit Singh", + "data": "Ni6noMmw" + }, + { + "type": "song", + "img": "https://c.saavncdn.com/565/Human-English-2016-500x500.jpg", + "name": "Human", + "desc": "Rag'N'Bone Man", + "data": "gLbWqLKC" + }, + { + "type": "song", + "img": "https://c.saavncdn.com/855/Homesick-English-2018-20181025170408-500x500.jpg", + "name": "Falling", + "desc": "Trevor Daniel", + "data": "Jm6qLR3V" + }, + { + "type": "song", + "img": "https://c.saavncdn.com/790/Gangs-Of-Wasseypur-2012-500x500.jpg", + "name": "Ik Bagal", + "desc": "Piyush Mishra", + "data": "Lo1zbaMa" + }, + { + "type": "song", + "img": "https://c.saavncdn.com/032/Jaane-Woh-Kaise-Sanam-Hindi-2017-20171204-500x500.jpg", + "name": "Jaane Woh Kaise", + "desc": "Sanam (Band)", + "data": "FHIMkqMv" + }, + { + "type": "song", + "img": "https://c.saavncdn.com/165/Stand-Up-From-Harriet--English-2019-20200414191117-500x500.jpg", + "name": "Stand Up (From Harriet)", + "desc": "Cynthia Erivo", + "data": "tWFkBuSv" + }, + { + "type": "song", + "img": "https://c.saavncdn.com/562/Different-World-English-2018-20181130144209-500x500.jpg", + "name": "Lily", + "desc": "Alan Walker, K-391, ...", + "data": "1c-VGSyw" + }, + { + "type": "song", + "img": "https://c.saavncdn.com/065/Citylights-Hindi-2014-20190607111647-500x500.jpg", + "name": "Muskurane", + "desc": "Arijit Singh, Jeet Gannguli", + "data": "1K9IsVVU" + }, + { + "type": "song", + "img": "https://c.saavncdn.com/702/Dee-MC--Hindi-2019-20191015104339-500x500.jpg", + "name": "Rang", + "desc": "Dee MC (Deepa Unnikrishnan)", + "data": "4bjKwhJ1" + }, + { + "type": "song", + "img": "https://c.saavncdn.com/024/Madness-English-2016-500x500.jpg", + "name": "Game of Survival", + "desc": "Ruelle", + "data": "dN9V6uUk" + } + ] + }, + { "name": "Favorite Albums", - "cards": [{ - "type": "album", - "img": "https://c.saavncdn.com/531/Gulaal-Hindi-2009-500x500.jpg", - "name": "Gulaal", - "desc": "Piyush Mishra", - "data": "1028531" - }, { - "type": "album", - "img": "https://c.saavncdn.com/432/Raincoat-Hindi-2004-20210125130707-500x500.jpg", - "name": "Raincoat", - "desc": "Hariharan, Meena Mishra", - "data": "15827352" - }, { - "type": "album", - "img": "https://c.saavncdn.com/742/A-Star-Is-Born-Soundtrack-Without-Dialogue--English-2018-20181004234940-500x500.jpg", - "name": "A Star Is Born Soundtrack", - "desc": "Lady Gaga, Bradley Cooper", - "data": "14014305" - }, { - "type": "album", - "img": "https://sklktcdnems06.cdnsrv.jio.com/c.saavncdn.com/113/Main-Aur-Mera-Saya-Bhupen-Hazarika-2001-500x500.jpg", - "name": "Main Aur Mera Saya", - "desc": "Gulzar, Bhupen Hazarika", - "data": "1066045" - },{ - "type": "album", - "img": "https://c.saavncdn.com/228/Lover-English-2019-20190823031817-500x500.jpg", - "name": "Lover", - "desc": "Taylor Swift", - "data": "17037435" - }, { - "type": "album", - "img": "https://c.saavncdn.com/430/Aashiqui-2-Hindi-2013-500x500.jpg", - "name": "Aashiqui 2", - "desc": "Palak Muchhal, Arijit Singh", - "data": "1139549" - }, { - "type": "album", - "img": "https://c.saavncdn.com/369/I-Lost-a-Friend-English-2019-20200104144314-500x500.jpg", - "name": "I Lost a Friend", - "desc": "FINNEAS", - "data": "15655769" - }, { - "type": "album", - "img": "https://c.saavncdn.com/078/MELT-English-2018-20180919230507-500x500.jpg", - "name": "MELT", - "desc": "SHAED", - "data": "13912413" - }, { - "type": "album", - "img": "https://c.saavncdn.com/836/Malang-Unleash-The-Madness-Hindi-2020-20200619175502-500x500.jpg", - "name": "Malang", - "desc": "2020", - "data": "18574421" - }, { - "type": "album", - "img": "https://c.saavncdn.com/585/Cradles-English-2019-20191028124508-500x500.jpg", - "name": "Cradles", - "desc": "Sub Urban", - "data": "17442635" - }, { - "type": "album", - "img": "https://c.saavncdn.com/662/Chalo-Chalein-Hindi-2021-20210208203817-500x500.jpg", - "name": "Chalo Chalein", - "desc": "Ritviz", - "data": "25211111" - }] - }, { + "cards": [ + { + "type": "album", + "img": "https://c.saavncdn.com/531/Gulaal-Hindi-2009-500x500.jpg", + "name": "Gulaal", + "desc": "Piyush Mishra", + "data": "1028531" + }, + { + "type": "album", + "img": "https://c.saavncdn.com/432/Raincoat-Hindi-2004-20210125130707-500x500.jpg", + "name": "Raincoat", + "desc": "Hariharan, Meena Mishra", + "data": "15827352" + }, + { + "type": "album", + "img": "https://c.saavncdn.com/742/A-Star-Is-Born-Soundtrack-Without-Dialogue--English-2018-20181004234940-500x500.jpg", + "name": "A Star Is Born Soundtrack", + "desc": "Lady Gaga, Bradley Cooper", + "data": "14014305" + }, + { + "type": "album", + "img": "https://sklktcdnems06.cdnsrv.jio.com/c.saavncdn.com/113/Main-Aur-Mera-Saya-Bhupen-Hazarika-2001-500x500.jpg", + "name": "Main Aur Mera Saya", + "desc": "Gulzar, Bhupen Hazarika", + "data": "1066045" + }, + { + "type": "album", + "img": "https://c.saavncdn.com/228/Lover-English-2019-20190823031817-500x500.jpg", + "name": "Lover", + "desc": "Taylor Swift", + "data": "17037435" + }, + { + "type": "album", + "img": "https://c.saavncdn.com/430/Aashiqui-2-Hindi-2013-500x500.jpg", + "name": "Aashiqui 2", + "desc": "Palak Muchhal, Arijit Singh", + "data": "1139549" + }, + { + "type": "album", + "img": "https://c.saavncdn.com/369/I-Lost-a-Friend-English-2019-20200104144314-500x500.jpg", + "name": "I Lost a Friend", + "desc": "FINNEAS", + "data": "15655769" + }, + { + "type": "album", + "img": "https://c.saavncdn.com/078/MELT-English-2018-20180919230507-500x500.jpg", + "name": "MELT", + "desc": "SHAED", + "data": "13912413" + }, + { + "type": "album", + "img": "https://c.saavncdn.com/836/Malang-Unleash-The-Madness-Hindi-2020-20200619175502-500x500.jpg", + "name": "Malang", + "desc": "2020", + "data": "18574421" + }, + { + "type": "album", + "img": "https://c.saavncdn.com/585/Cradles-English-2019-20191028124508-500x500.jpg", + "name": "Cradles", + "desc": "Sub Urban", + "data": "17442635" + }, + { + "type": "album", + "img": "https://c.saavncdn.com/662/Chalo-Chalein-Hindi-2021-20210208203817-500x500.jpg", + "name": "Chalo Chalein", + "desc": "Ritviz", + "data": "25211111" + } + ] + }, + { "name": "Favorite Artists", - "cards": [{ - "type": "artist", - "img": "https://c.saavncdn.com/artists/Ed_Sheeran_500x500.jpg", - "name": "Ed Sheeran", - "desc": "Artist" - }, { - "type": "artist", - "img": "https://c.saavncdn.com/artists/Selena_Gomez_500x500.jpg", - "name": "Selena Gomez", - "desc": "Artist" - }, { - "type": "artist", - "name": "Neeti Mohan", - "img": "https://c.saavncdn.com/artists/Neeti_Mohan_003_20200211100510_500x500.jpg", - "desc": "Artist" - }, { - "type": "artist", - "name": "Alan Walker", - "img": "https://c.saavncdn.com/artists/Alan_Walker_002_20190507112228_500x500.jpg", - "desc": "Artist" - }, { - "type": "artist", - "name": "Armaan Malik", - "img": "https://c.saavncdn.com/artists/Armaan_Malik_500x500.jpg", - "desc": "Artist" - }, { - "type": "artist", - "name": "Shalmali", - "img": "https://c.saavncdn.com/artists/Shalmali_Kholgade_004_20200226073940_500x500.jpg", - "desc": "Artist" - }, { - "type": "artist", - "name": "Justin Bieber", - "img": "https://c.saavncdn.com/artists/Justin_Bieber_500x500.jpg", - "desc": "Artist" - }, { - "type": "artist", - "name": "DJ Snake", - "img": "https://c.saavncdn.com/artists/Dj_Snake_500x500.jpg", - "desc": "Artist" - }, { - "type": "artist", - "name": "Sia", - "img": "https://c.saavncdn.com/artists/Sia_500x500.jpg", - "desc": "Artist" - }, { - "type": "artist", - "name": "Arijit Singh", - "img": "https://c.saavncdn.com/artists/Arijit_Singh_500x500.jpg", - "desc": "Artist" - }, { - "type": "artist", - "name": "Alessia Cara", - "img": "https://c.saavncdn.com/artists/Alessia_Cara_20190306095839_500x500.jpg", - "desc": "Artist" - }, { - "type": "artist", - "name": "The Chainsmokers", - "img": "https://c.saavncdn.com/artists/The_Chainsmokers_500x500.jpg", - "desc": "Artist" - }, { - "type": "artist", - "name": "Alec Benjamin", - "img": "https://c.saavncdn.com/artists/Alec_Benjamin_000_20191129075848_500x500.jpg", - "desc": "Artist" - }, { - "type": "artist", - "name": "Darshan Raval", - "img": "https://c.saavncdn.com/artists/Darshan_Raval_500x500.jpg", - "desc": "Artist" - }, { - "type": "artist", - "name": "Atif Aslam", - "img": "https://c.saavncdn.com/artists/Atif_Aslam_500x500.jpg", - "desc": "Artist" - }, { - "type": "artist", - "name": "Monali Thakur", - "img": "https://c.saavncdn.com/artists/Monali_Thakur_500x500.jpg", - "desc": "Artist" - }] + "cards": [ + { + "type": "artist", + "img": "https://c.saavncdn.com/artists/Ed_Sheeran_500x500.jpg", + "name": "Ed Sheeran", + "desc": "Artist" + }, + { + "type": "artist", + "img": "https://c.saavncdn.com/artists/Selena_Gomez_500x500.jpg", + "name": "Selena Gomez", + "desc": "Artist" + }, + { + "type": "artist", + "name": "Neeti Mohan", + "img": "https://c.saavncdn.com/artists/Neeti_Mohan_003_20200211100510_500x500.jpg", + "desc": "Artist" + }, + { + "type": "artist", + "name": "Alan Walker", + "img": "https://c.saavncdn.com/artists/Alan_Walker_002_20190507112228_500x500.jpg", + "desc": "Artist" + }, + { + "type": "artist", + "name": "Armaan Malik", + "img": "https://c.saavncdn.com/artists/Armaan_Malik_500x500.jpg", + "desc": "Artist" + }, + { + "type": "artist", + "name": "Shalmali", + "img": "https://c.saavncdn.com/artists/Shalmali_Kholgade_004_20200226073940_500x500.jpg", + "desc": "Artist" + }, + { + "type": "artist", + "name": "Justin Bieber", + "img": "https://c.saavncdn.com/artists/Justin_Bieber_500x500.jpg", + "desc": "Artist" + }, + { + "type": "artist", + "name": "DJ Snake", + "img": "https://c.saavncdn.com/artists/Dj_Snake_500x500.jpg", + "desc": "Artist" + }, + { + "type": "artist", + "name": "Sia", + "img": "https://c.saavncdn.com/artists/Sia_500x500.jpg", + "desc": "Artist" + }, + { + "type": "artist", + "name": "Arijit Singh", + "img": "https://c.saavncdn.com/artists/Arijit_Singh_500x500.jpg", + "desc": "Artist" + }, + { + "type": "artist", + "name": "Alessia Cara", + "img": "https://c.saavncdn.com/artists/Alessia_Cara_20190306095839_500x500.jpg", + "desc": "Artist" + }, + { + "type": "artist", + "name": "The Chainsmokers", + "img": "https://c.saavncdn.com/artists/The_Chainsmokers_500x500.jpg", + "desc": "Artist" + }, + { + "type": "artist", + "name": "Alec Benjamin", + "img": "https://c.saavncdn.com/artists/Alec_Benjamin_000_20191129075848_500x500.jpg", + "desc": "Artist" + }, + { + "type": "artist", + "name": "Darshan Raval", + "img": "https://c.saavncdn.com/artists/Darshan_Raval_500x500.jpg", + "desc": "Artist" + }, + { + "type": "artist", + "name": "Atif Aslam", + "img": "https://c.saavncdn.com/artists/Atif_Aslam_500x500.jpg", + "desc": "Artist" + }, + { + "type": "artist", + "name": "Monali Thakur", + "img": "https://c.saavncdn.com/artists/Monali_Thakur_500x500.jpg", + "desc": "Artist" + } + ] } ], - "queue": [{ + "queue": [ + { "id": "Szz0RZFb", "type": "", "song": "Piya Tora Kaisa Abhiman", @@ -904,26 +1015,69 @@ "img": "/img/asset/hindi.jpg", "name": "Hindi", "desc": "Created by blueedge", - "data": ["jZj6FxTn","lWfLyI7Q","1EvZOLZA","7pyE_xRk","Vnpn-XBN","sRfXrLI3", - "5MALSALT","OhWCnpFD","nXoABtkj","466Fxnry","VCeN_rCT","DHrY5Sdd","eR_xs61E", - "L03PNwY-","sqCyEI52","p3CNoOta","W6RoExZr","m87V1xS7","egbFbCZA"] + "data": [ + "jZj6FxTn", + "lWfLyI7Q", + "1EvZOLZA", + "7pyE_xRk", + "Vnpn-XBN", + "sRfXrLI3", + "5MALSALT", + "OhWCnpFD", + "nXoABtkj", + "466Fxnry", + "VCeN_rCT", + "DHrY5Sdd", + "eR_xs61E", + "L03PNwY-", + "sqCyEI52", + "p3CNoOta", + "W6RoExZr", + "m87V1xS7", + "egbFbCZA" + ] }, { "type": "play", "img": "/img/asset/english.jpg", "name": "English", "desc": "Created by blueedge", - "data": ["Qh1CjVg7","bodW4p3V","TEG8c_EJ","Mej5z1fx","TS2O2Tve","3g5G9QTu", - "vMVZNcBe","j8hvJDPs","QW2Cc9f_","2DxytgUN","lkuNi3jw","ob5CYzSj", - "StDihZvc","r18ZGRhZ","w45WxXVs","SCViGhWY","hRwARnmN","NcZREsTd"] + "data": [ + "Qh1CjVg7", + "bodW4p3V", + "TEG8c_EJ", + "Mej5z1fx", + "TS2O2Tve", + "3g5G9QTu", + "vMVZNcBe", + "j8hvJDPs", + "QW2Cc9f_", + "2DxytgUN", + "lkuNi3jw", + "ob5CYzSj", + "StDihZvc", + "r18ZGRhZ", + "w45WxXVs", + "SCViGhWY", + "hRwARnmN", + "NcZREsTd" + ] }, { "type": "play", "img": "/img/asset/community.jpg", "name": "Community", "desc": "Created by community", - "data": ["mPk9X_H_","gy17KLcd","VD6u6NAU","0v8zw64U","-flLKGvp","4J4hpD8f", - "6-xaXxqJ","b5X96rOy"] + "data": [ + "mPk9X_H_", + "gy17KLcd", + "VD6u6NAU", + "0v8zw64U", + "-flLKGvp", + "4J4hpD8f", + "6-xaXxqJ", + "b5X96rOy" + ] } ] } diff --git a/src/containers/applications/apps/assets/spotify.scss b/src/containers/applications/apps/assets/spotify.scss index c4af2b1d0..3e0712efc 100644 --- a/src/containers/applications/apps/assets/spotify.scss +++ b/src/containers/applications/apps/assets/spotify.scss @@ -1,9 +1,9 @@ .spotify .windowScreen { - font-family: 'Spotify', sans-serif; + font-family: "Spotify", sans-serif; cursor: default; } -.navcover{ +.navcover { background: #121212; } @@ -290,7 +290,7 @@ } } -.scard{ +.scard { width: 200px; position: relative; transition: all 50ms ease-in-out; @@ -330,9 +330,10 @@ } } - -.scard , .topcard{ - .fplay, .fpause { +.scard, +.topcard { + .fplay, + .fpause { width: 40px; height: 40px; position: absolute; @@ -357,13 +358,13 @@ clip-path: polygon(20% 0, 100% 50%, 20% 100%); } - .fbars{ + .fbars { width: 12px; height: 12px; position: relative; background: #fefefe; - &::after{ + &::after { content: ""; position: absolute; left: 4px; @@ -374,7 +375,7 @@ } } - .fplay{ + .fplay { opacity: 0; transform: translateY(12px); } @@ -406,7 +407,7 @@ background-size: contain; background-position: bottom; transform-origin: bottom; - transform: scale(1,1.8); + transform: scale(1, 1.8); opacity: 0.5; filter: hue-rotate(var(--rot1)) brightness(3); } @@ -423,7 +424,7 @@ background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTgwIiBoZWlnaHQ9IjQwIiB2aWV3Qm94PSIwIDAgMTQ0MCAzMjAiPjxwYXRoIGZpbGw9IiMwMDk5ZmYiIGZpbGwtb3BhY2l0eT0iMSIgZD0iTTAsMEw0OCw0OEM5Niw5NiwxOTIsMTkyLDI4OCwyNDBDMzg0LDI4OCw0ODAsMjg4LDU3NiwyNTAuN0M2NzIsMjEzLDc2OCwxMzksODY0LDEzMy4zQzk2MCwxMjgsMTA1NiwxOTIsMTE1MiwyMzQuN0MxMjQ4LDI3NywxMzQ0LDI5OSwxMzkyLDMwOS4zTDE0NDAsMzIwTDE0NDAsMzIwTDEzOTIsMzIwQzEzNDQsMzIwLDEyNDgsMzIwLDExNTIsMzIwQzEwNTYsMzIwLDk2MCwzMjAsODY0LDMyMEM3NjgsMzIwLDY3MiwzMjAsNTc2LDMyMEM0ODAsMzIwLDM4NCwzMjAsMjg4LDMyMEMxOTIsMzIwLDk2LDMyMCw0OCwzMjBMMCwzMjBaIj48L3BhdGg+PC9zdmc+"); background-size: contain; background-position: bottom; - transform: scale(1,-1); + transform: scale(1, -1); opacity: 0.32; filter: hue-rotate(var(--rot1)) brightness(3); } @@ -435,7 +436,7 @@ right: 0; font-size: 1.2em; color: #444; - transform: scale(1,1.8); + transform: scale(1, 1.8); top: 10px; font-weight: 200; @@ -494,7 +495,7 @@ .alsongs { box-sizing: border-box; - .hr{ + .hr { height: 1px; background: #333; margin-bottom: 12px; @@ -507,7 +508,10 @@ align-items: center; justify-content: space-between; display: grid; - grid-template-columns: [index] 16px [first] 6fr [var1] 4fr [var2] 1.6fr [last] minmax(20px,1fr); + grid-template-columns: [index] 16px [first] 6fr [var1] 4fr [var2] 1.6fr [last] minmax( + 20px, + 1fr + ); padding: 8px; letter-spacing: 1px; border-radius: 4px; @@ -515,7 +519,7 @@ &:nth-child(1) { letter-spacing: 2px; - &:hover{ + &:hover { background: none; } } @@ -537,7 +541,7 @@ .scolsong { max-width: 100%; - &[data-play="true"]{ + &[data-play="true"] { margin-left: 16px; max-width: calc(100% - 56px); } @@ -568,7 +572,7 @@ -webkit-box-orient: vertical; } -.dotdot{ +.dotdot { max-height: 16px; overflow: hidden; text-overflow: ellipsis; @@ -577,13 +581,13 @@ -webkit-box-orient: vertical; } -.thiker{ +.thiker { -webkit-text-stroke-width: 2px; letter-spacing: 2px; max-height: 48px; } -.topcard{ +.topcard { position: relative; background: #222; border-radius: 4px; @@ -592,11 +596,12 @@ flex-direction: column; align-items: flex-start; - *{ + * { pointer-events: none; } - .fplay, .fpause { + .fplay, + .fpause { top: unset; bottom: 16px; right: 16px; @@ -604,7 +609,7 @@ transition: all 200ms ease-in-out; } - .imageCont{ + .imageCont { box-shadow: 2px 2px 12px rgba(0, 0, 0, 0.4); } } diff --git a/src/containers/applications/apps/assets/store.json b/src/containers/applications/apps/assets/store.json index 46d4cc21c..f789a8faa 100644 --- a/src/containers/applications/apps/assets/store.json +++ b/src/containers/applications/apps/assets/store.json @@ -1,4 +1,5 @@ -[{ +[ + { "name": "Minecraft", "icon": "https://raw.githubusercontent.com/andrewstech/windows11-1/master/public/img/icon/minecraft.png", "type": "game", @@ -13,7 +14,8 @@ "desc": "Minecraft is a sandbox construction video game developed by Mojang Studios where players interact with a fully modifiable three-dimensional environment made of blocks and entities.\nIts diverse gameplay lets players choose the way they play, allowing for countless possibilities. There are three actively maintained editions of Minecraft: Java Edition, Bedrock Edition, and Education Edition.", "feat": "1.1 Combat changes.\n1.2 Fletching table functionality.\n1.3 Voted updates.\n1.4 Super Fancy graphics.\n1.5 Phasing out of NBT-based crafting recipes.\n1.6 Full split of liquids from blocks.\n1.7 Shaders.\n1.8 Archaeology." } - }, { + }, + { "name": "Smash karts", "icon": "https://trefoilkingdom.com/uploads/games/42122/Smash-Karts.jpg", "type": "game", @@ -29,7 +31,8 @@ "desc": "Smash Karts is a free io Multiplayer Kart Battle Arena game.\nIt is a three-dimensional multiplayer kart racing game. To win, you must drive your go-kart, pick up weaponry, and blow up other karts.", "feat": "Drive fast\nFire rockets\nMake big explosions" } - }, { + }, + { "name": "Krunker", "icon": "https://krunker.io/img/newp.png", "type": "game", diff --git a/src/containers/applications/apps/assets/store.scss b/src/containers/applications/apps/assets/store.scss index 84666c38c..27694d1ab 100644 --- a/src/containers/applications/apps/assets/store.scss +++ b/src/containers/applications/apps/assets/store.scss @@ -1,317 +1,317 @@ .storeNav { - .uicon { - padding: 18px 0; - margin: 0 4px 4px; - color: #888888; - position: relative; - transition: all ease-in-out 100ms; - border-radius: 4px; + .uicon { + padding: 18px 0; + margin: 0 4px 4px; + color: #888888; + position: relative; + transition: all ease-in-out 100ms; + border-radius: 4px; &::after { - content: ""; - position: absolute; - width: 3px; - left: 0; - height: 24px; - border-radius: 10px; - background: var(--clrPrm); + content: ""; + position: absolute; + width: 3px; + left: 0; + height: 24px; + border-radius: 10px; + background: var(--clrPrm); opacity: 0; scale: 0; pointer-events: none; - transition: all ease-in-out 100ms; - } + transition: all ease-in-out 100ms; + } - &[data-payload="true"]::after { - opacity: 1; + &[data-payload="true"]::after { + opacity: 1; scale: 1; - } - - &:hover { - background: var(--nav-btn-hov); - color: var(--dark-txt); - } - - &[data-payload="true"] { - background: var(--nav-btn-hov); - color: var(--clrPrm); - } - } + } + + &:hover { + background: var(--nav-btn-hov); + color: var(--dark-txt); + } + + &[data-payload="true"] { + background: var(--nav-btn-hov); + color: var(--clrPrm); + } + } } .frontPage { - position: relative; - max-height: calc(100vh - 150px); - overflow-y: hidden; - - &:after { - content: ""; - width: 100%; - height: 100px; - position: absolute; - bottom: 0; - background: linear-gradient( - to top, - var(--page-bg) 10%, - #87888766 50%, - transparent 100% - ); - } + position: relative; + max-height: calc(100vh - 150px); + overflow-y: hidden; + + &:after { + content: ""; + width: 100%; + height: 100px; + position: absolute; + bottom: 0; + background: linear-gradient( + to top, + var(--page-bg) 10%, + #87888766 50%, + transparent 100% + ); + } } .panelName { - color: #fefefe; - text-shadow: -1px 1px 4px rgba(0, 0, 0, 0.4); + color: #fefefe; + text-shadow: -1px 1px 4px rgba(0, 0, 0, 0.4); } .storeRibbon { - display: flex; - width: max-content; - padding: 0 28px; - - &::-webkit-scroll-bar { - width: 0; - } - - .imageCont::before { - content: attr(data-var); - position: absolute; - bottom: 0; - left: 0; - width: 100%; - color: #fefefe; - font-size: 0.72em; - padding: 8px 12px; - text-transform: capitalize; - text-shadow: 0 0 4px #222; - } - - .imageCont:nth-child(1)::after { - content: ""; - width: 100%; - height: 100%; - position: absolute; - top: 0; - box-sizing: border-box; - border: solid 3px #294bff; - } + display: flex; + width: max-content; + padding: 0 28px; + + &::-webkit-scroll-bar { + width: 0; + } + + .imageCont::before { + content: attr(data-var); + position: absolute; + bottom: 0; + left: 0; + width: 100%; + color: #fefefe; + font-size: 0.72em; + padding: 8px 12px; + text-transform: capitalize; + text-shadow: 0 0 4px #222; + } + + .imageCont:nth-child(1)::after { + content: ""; + width: 100%; + height: 100%; + position: absolute; + top: 0; + box-sizing: border-box; + border: solid 3px #294bff; + } } .msfull { - // width: calc(100% - 61px); - display: flex; - flex-grow: 1; - flex-direction: column; - overflow-x: hidden; - overflow-y: scroll; - - .pagecont { - border-radius: 6px; - background: var(--page-bg); - border: 1px solid var(--page-bd-col); - min-height: 100%; - overflow: hidden; - } + // width: calc(100% - 61px); + display: flex; + flex-grow: 1; + flex-direction: column; + overflow-x: hidden; + overflow-y: scroll; + + .pagecont { + border-radius: 6px; + background: var(--page-bg); + border: 1px solid var(--page-bd-col); + min-height: 100%; + overflow: hidden; + } } .frontCont { - // height: 360px; - border-radius: 8px; + // height: 360px; + border-radius: 8px; } .amzApps { - background: #670cd7; - background: -webkit-linear-gradient( - 48deg, - #522f8b 0%, - rgba(113, 35, 133, 1) 100% - ); - background: -o-linear-gradient(48deg, #522f8b 0%, rgba(113, 35, 133, 1) 100%); - background: linear-gradient(138deg, #522f8b 0%, rgba(113, 35, 133, 1) 100%); + background: #670cd7; + background: -webkit-linear-gradient( + 48deg, + #522f8b 0%, + rgba(113, 35, 133, 1) 100% + ); + background: -o-linear-gradient(48deg, #522f8b 0%, rgba(113, 35, 133, 1) 100%); + background: linear-gradient(138deg, #522f8b 0%, rgba(113, 35, 133, 1) 100%); } .amzGames { - background: #214458; - background: -webkit-linear-gradient(47deg, #214458 0%, #098793 100%); - background: -o-linear-gradient(47deg, #214458 0%, #098793 100%); - background: linear-gradient(137deg, #214458 0%, #098793 100%); + background: #214458; + background: -webkit-linear-gradient(47deg, #214458 0%, #098793 100%); + background: -o-linear-gradient(47deg, #214458 0%, #098793 100%); + background: linear-gradient(137deg, #214458 0%, #098793 100%); } .amzMovies { - background: #217558; - background: -webkit-linear-gradient(47deg, #217558 0%, #0fa345 100%); - background: -o-linear-gradient(47deg, #217558 0%, #0fa345 100%); - background: linear-gradient(137deg, #217558 0%, #0fa345 100%); + background: #217558; + background: -webkit-linear-gradient(47deg, #217558 0%, #0fa345 100%); + background: -o-linear-gradient(47deg, #217558 0%, #0fa345 100%); + background: linear-gradient(137deg, #217558 0%, #0fa345 100%); } .ribcont { - background: var(--rib-bg); - margin: auto 6px; - height: auto; - width: 120px; - transform-origin: center; - transition: all ease-in-out 200ms; - color: var(--dark-txt); - - &:hover { - transform: scale(1.06); - transform: translateY(-4px); - } - - .uicon { - color: #aaa; - margin-right: 2px; - } - - .bluestar { - color: #006ff0; - } + background: var(--rib-bg); + margin: auto 6px; + height: auto; + width: 120px; + transform-origin: center; + transition: all ease-in-out 200ms; + color: var(--dark-txt); + + &:hover { + transform: scale(1.06); + transform: translateY(-4px); + } + + .uicon { + color: #aaa; + margin-right: 2px; + } + + .bluestar { + color: #006ff0; + } } .catbtn { - font-size: 0.8em; - padding: 1px 20px; - padding-bottom: 3px; - border: solid 1px #ccc; - border-radius: 100px; - margin-right: 16px; - color: var(--txt-col); - - &[value="true"] { - color: var(--clrPrm); - border-color: var(--clrPrm); - } + font-size: 0.8em; + padding: 1px 20px; + padding-bottom: 3px; + border: solid 1px #ccc; + border-radius: 100px; + margin-right: 16px; + color: var(--txt-col); + + &[value="true"] { + color: var(--clrPrm); + border-color: var(--clrPrm); + } } .appscont { - display: flex; - flex-wrap: wrap; + display: flex; + flex-wrap: wrap; } .appscont .ribcont { - background: var(--rib2-bg); - margin-right: 1em; - margin-bottom: 2em; - width: auto; - cursor: pointer; - border-radius: 6px; + background: var(--rib2-bg); + margin-right: 1em; + margin-bottom: 2em; + width: auto; + cursor: pointer; + border-radius: 6px; } .detailpage { - display: flex; - min-height: 100%; + display: flex; + min-height: 100%; } .detailcont { - width: 320px; - margin-right: 8px; - padding-top: 4em; - display: flex; - flex-direction: column; - align-items: center; + width: 320px; + margin-right: 8px; + padding-top: 4em; + display: flex; + flex-direction: column; + align-items: center; } .growcont { - width: auto; - width: calc(100% - 300px); - margin-right: 8px; + width: auto; + width: calc(100% - 300px); + margin-right: 8px; } .detailcont, .briefcont { - border-radius: 6px; - background: var(--rib2-bg); - border: 1px solid var(--page-bd-col); - color: var(--txt-col); + border-radius: 6px; + background: var(--rib2-bg); + border: 1px solid var(--page-bd-col); + color: var(--txt-col); } .instbtn { - font-size: 0.8em; - padding: 4px 36px; - padding-bottom: 6px; - background: #0067c0; - border-radius: 4px; - color: #eee; + font-size: 0.8em; + padding: 4px 36px; + padding-bottom: 6px; + background: #0067c0; + border-radius: 4px; + color: #eee; } .instbtn:hover { - background: #0157a2; + background: #0157a2; } .instbtn:active, .instbtn:focus-visible { - background: #03549b; + background: #03549b; } .descnt { - display: grid; - place-items: center; - width: 80%; - margin-top: 60px; - text-align: justify; - - overflow: hidden; - text-overflow: ellipsis; - display: -webkit-box; - -webkit-line-clamp: 3; - -webkit-box-orient: vertical; + display: grid; + place-items: center; + width: 80%; + margin-top: 60px; + text-align: justify; + + overflow: hidden; + text-overflow: ellipsis; + display: -webkit-box; + -webkit-line-clamp: 3; + -webkit-box-orient: vertical; } .briefcont { - width: 100%; - margin-bottom: 8px; - - pre { - font-family: inherit; - width: 100%; - white-space: pre-wrap; - } - - & > div { - padding: 0 16px; - padding-bottom: 6px; - } - - & > div:nth-child(1) { - border: 0 solid var(--comp-txt); - border-bottom-width: 1px; - } - - .bg-orange-200 { - --bg-opacity: 0.8; - } + width: 100%; + margin-bottom: 8px; + + pre { + font-family: inherit; + width: 100%; + white-space: pre-wrap; + } + + & > div { + padding: 0 16px; + padding-bottom: 6px; + } + + & > div:nth-child(1) { + border: 0 solid var(--comp-txt); + border-bottom-width: 1px; + } + + .bg-orange-200 { + --bg-opacity: 0.8; + } } .reviewtxt { - color: var(--med-txt); + color: var(--med-txt); } .downbar { - width: 120px; - border-radius: 8px; - background: #bfcef2; - overflow: hidden; - position: relative; - padding: 4px 0; + width: 120px; + border-radius: 8px; + background: #bfcef2; + overflow: hidden; + position: relative; + padding: 4px 0; } .downbar::after { - content: ""; - position: absolute; - top: 0; - left: -40%; - padding: 4px 0; - width: 40%; - border-radius: 8px; - background: #0069ff; - animation: downanim 1s linear infinite; + content: ""; + position: absolute; + top: 0; + left: -40%; + padding: 4px 0; + width: 40%; + border-radius: 8px; + background: #0069ff; + animation: downanim 1s linear infinite; } @keyframes downanim { - from { - left: -40%; - } + from { + left: -40%; + } - to { - left: 100%; - } + to { + left: 100%; + } } diff --git a/src/containers/applications/apps/calculator.jsx b/src/containers/applications/apps/calculator.jsx index 8ddf96c61..53fa8f211 100644 --- a/src/containers/applications/apps/calculator.jsx +++ b/src/containers/applications/apps/calculator.jsx @@ -3,274 +3,274 @@ import { useSelector } from "react-redux"; import { Icon, ToolBar } from "../../../utils/general"; export const Calculator = () => { - const wnapp = useSelector((state) => state.apps.calculator); - const [equa, setEqua] = useState([]); - const [cval, setCval] = useState("0"); - const [err, setErr] = useState(null); - const [hist, setHist] = useState([]); + const wnapp = useSelector((state) => state.apps.calculator); + const [equa, setEqua] = useState([]); + const [cval, setCval] = useState("0"); + const [err, setErr] = useState(null); + const [hist, setHist] = useState([]); - const getIdx = (node) => { - var i = 0; - while ((node = node.previousSibling) != null) { - i++; - } + const getIdx = (node) => { + var i = 0; + while ((node = node.previousSibling) != null) { + i++; + } - return i; - }; + return i; + }; - const action = (event) => { - var btn = event.target.dataset.ch, - idx = getIdx(event.target); + const action = (event) => { + var btn = event.target.dataset.ch, + idx = getIdx(event.target); - var val = cval; - if (idx == 2) { - setCval("0"); - setEqua([]); - setErr(null); - } else if (val == "Infinity" || val == "NaN") { - setErr(val); - } else if (idx == 1) { - setCval("0"); - } else if (idx == 3) { - val = val.substring(0, val.length - 1); - if (val.length == 0 || val == "-") val = "0"; - setCval(val); - } else if (idx < 7 && idx > 3) { - if (btn == "inv") { - var num = parseFloat(val); + var val = cval; + if (idx == 2) { + setCval("0"); + setEqua([]); + setErr(null); + } else if (val == "Infinity" || val == "NaN") { + setErr(val); + } else if (idx == 1) { + setCval("0"); + } else if (idx == 3) { + val = val.substring(0, val.length - 1); + if (val.length == 0 || val == "-") val = "0"; + setCval(val); + } else if (idx < 7 && idx > 3) { + if (btn == "inv") { + var num = parseFloat(val); - if (num != 0) { - var inv = 1 / num; - } else { - setErr("Cannot divide by zero"); - return; - } - setCval(inv.toString()); - } else if (btn == "sq") { - var num = parseFloat(val), - sq = num ** 2; - setCval(sq.toString()); - } else if (btn == "sqrt") { - var num = parseFloat(val); - if (val[0] != "-") { - var sqrt = Math.sqrt(num); - } else { - setErr("Invalid Input"); - return; - } - setCval(sqrt.toString()); - } - } else if (idx > 7 && (idx + 1) % 4 != 0) { - if (btn.length == 1) { - var tpq = [...equa]; + if (num != 0) { + var inv = 1 / num; + } else { + setErr("Cannot divide by zero"); + return; + } + setCval(inv.toString()); + } else if (btn == "sq") { + var num = parseFloat(val), + sq = num ** 2; + setCval(sq.toString()); + } else if (btn == "sqrt") { + var num = parseFloat(val); + if (val[0] != "-") { + var sqrt = Math.sqrt(num); + } else { + setErr("Invalid Input"); + return; + } + setCval(sqrt.toString()); + } + } else if (idx > 7 && (idx + 1) % 4 != 0) { + if (btn.length == 1) { + var tpq = [...equa]; - if (tpq[3] != null) { - if (btn == ".") { - val = "0"; - } else { - val = ""; - } + if (tpq[3] != null) { + if (btn == ".") { + val = "0"; + } else { + val = ""; + } - setEqua([]); - } + setEqua([]); + } - val += btn; - if (cval == "0" && btn != ".") { - val = btn; - } + val += btn; + if (cval == "0" && btn != ".") { + val = btn; + } - if (val.length < 17 && val.match(/^-?[0-9]+([.][0-9]*)?$/) != null) { - setCval(val); - } - } else if (cval != "0") { - if (cval[0] == "-") { - setCval(cval.substring(1)); - } else { - setCval("-" + cval); - } - } - } else if (idx > 3 && idx % 4 == 3) { - var tpq = [...equa]; - if (btn != "=") { - if (tpq[2] == null) { - if (tpq[0] == null) { - tpq[0] = parseFloat(cval); - } - tpq[1] = btn; - } else { - tpq = [cval, btn]; - } + if (val.length < 17 && val.match(/^-?[0-9]+([.][0-9]*)?$/) != null) { + setCval(val); + } + } else if (cval != "0") { + if (cval[0] == "-") { + setCval(cval.substring(1)); + } else { + setCval("-" + cval); + } + } + } else if (idx > 3 && idx % 4 == 3) { + var tpq = [...equa]; + if (btn != "=") { + if (tpq[2] == null) { + if (tpq[0] == null) { + tpq[0] = parseFloat(cval); + } + tpq[1] = btn; + } else { + tpq = [cval, btn]; + } - setCval("0"); - setEqua(tpq); - } else { - if (tpq[1] != null) { - if (tpq[2] == null) { - tpq[2] = parseFloat(cval); - } + setCval("0"); + setEqua(tpq); + } else { + if (tpq[1] != null) { + if (tpq[2] == null) { + tpq[2] = parseFloat(cval); + } - tpq[3] = "="; - if (tpq[1] == "/") { - if (tpq[2] != 0) { - tpq[4] = tpq[0] / tpq[2]; - } else { - setErr("Cannot divide by zero"); - return; - } - } else if (tpq[1] == "x") { - tpq[4] = tpq[0] * tpq[2]; - } else if (tpq[1] == "-") { - tpq[4] = tpq[0] - tpq[2]; - } else { - tpq[4] = tpq[0] + tpq[2]; - } + tpq[3] = "="; + if (tpq[1] == "/") { + if (tpq[2] != 0) { + tpq[4] = tpq[0] / tpq[2]; + } else { + setErr("Cannot divide by zero"); + return; + } + } else if (tpq[1] == "x") { + tpq[4] = tpq[0] * tpq[2]; + } else if (tpq[1] == "-") { + tpq[4] = tpq[0] - tpq[2]; + } else { + tpq[4] = tpq[0] + tpq[2]; + } - var tmpHist = [...hist]; - setEqua(tpq); - setCval(tpq[4]); - tmpHist.push(tpq); - setHist(tmpHist); - } - } - } - }; + var tmpHist = [...hist]; + setEqua(tpq); + setCval(tpq[4]); + tmpHist.push(tpq); + setHist(tmpHist); + } + } + } + }; - return ( -
- -
-
-
- -
Standard
-
-
-
-
-
-
- {equa[0]} {equa[1]} {equa[2]} {equa[3]} {equa[4]} -
-
{err == null ? cval : err}
-
-
-
MC
-
MR
-
M+
-
M-
-
MS
-
-
-
- % -
-
- CE -
-
- C -
-
- -
-
- 1/x -
-
- x2 -
-
- 2 - โˆšx -
-
- / -
-
- 7 -
-
- 8 -
-
- 9 -
-
- x -
-
- 4 -
-
- 5 -
-
- 6 -
-
- - -
-
- 1 -
-
- 2 -
-
- 3 -
-
- + -
-
- +/- -
-
- 0 -
-
- . -
-
- = -
-
-
-
-
History
- {hist.length != 0 ? null : ( -
There's no history yet
- )} -
-
- {hist.map((his) => { - return ( -
- {his[0]} {his[1]} {his[2]} {his[3]} -
{his[4]}
-
- ); - })} -
-
-
-
-
-
- ); + return ( +
+ +
+
+
+ +
Standard
+
+
+
+
+
+
+ {equa[0]} {equa[1]} {equa[2]} {equa[3]} {equa[4]} +
+
{err == null ? cval : err}
+
+
+
MC
+
MR
+
M+
+
M-
+
MS
+
+
+
+ % +
+
+ CE +
+
+ C +
+
+ +
+
+ 1/x +
+
+ x2 +
+
+ 2 + โˆšx +
+
+ / +
+
+ 7 +
+
+ 8 +
+
+ 9 +
+
+ x +
+
+ 4 +
+
+ 5 +
+
+ 6 +
+
+ - +
+
+ 1 +
+
+ 2 +
+
+ 3 +
+
+ + +
+
+ +/- +
+
+ 0 +
+
+ . +
+
+ = +
+
+
+
+
History
+ {hist.length != 0 ? null : ( +
There's no history yet
+ )} +
+
+ {hist.map((his) => { + return ( +
+ {his[0]} {his[1]} {his[2]} {his[3]} +
{his[4]}
+
+ ); + })} +
+
+
+
+
+
+ ); }; diff --git a/src/containers/applications/apps/camera.jsx b/src/containers/applications/apps/camera.jsx index e5a12e4f7..5d6fb74fa 100644 --- a/src/containers/applications/apps/camera.jsx +++ b/src/containers/applications/apps/camera.jsx @@ -4,89 +4,89 @@ import { Icon, ToolBar } from "../../../utils/general"; import { useTranslation } from "react-i18next"; export const Camera = () => { - const wnapp = useSelector((state) => state.apps.camera); - const hide = useSelector((state) => state.apps.camera.hide); - const [stream, setStream] = useState(null); - const { t } = useTranslation(); + const wnapp = useSelector((state) => state.apps.camera); + const hide = useSelector((state) => state.apps.camera.hide); + const [stream, setStream] = useState(null); + const { t } = useTranslation(); - const capture = () => { - var video = document.querySelector("video"); - var canvas = document.querySelector("canvas"); - canvas.width = video.videoWidth; - canvas.height = video.videoHeight; + const capture = () => { + var video = document.querySelector("video"); + var canvas = document.querySelector("canvas"); + canvas.width = video.videoWidth; + canvas.height = video.videoHeight; - var df = video.videoWidth - video.videoHeight; + var df = video.videoWidth - video.videoHeight; - canvas - .getContext("2d") - .drawImage(video, -df / 2, 0, video.videoWidth + df, video.videoHeight); - }; + canvas + .getContext("2d") + .drawImage(video, -df / 2, 0, video.videoWidth + df, video.videoHeight); + }; - useEffect(() => { - if (!wnapp.hide) { - var video = document.getElementById("camvideo"); + useEffect(() => { + if (!wnapp.hide) { + var video = document.getElementById("camvideo"); - video.setAttribute("playsinline", ""); - video.setAttribute("autoplay", ""); - video.setAttribute("muted", ""); + video.setAttribute("playsinline", ""); + video.setAttribute("autoplay", ""); + video.setAttribute("muted", ""); - var constraints = { - audio: false, - video: true, - }; + var constraints = { + audio: false, + video: true, + }; - navigator.mediaDevices.getUserMedia(constraints).then((dstream) => { - setStream(dstream); - console.log(dstream); - video.srcObject = dstream; - }); - } else { - if (stream != null) stream.getTracks().forEach((track) => track.stop()); - setStream(null); - } - }, [hide]); + navigator.mediaDevices.getUserMedia(constraints).then((dstream) => { + setStream(dstream); + console.log(dstream); + video.srcObject = dstream; + }); + } else { + if (stream != null) stream.getTracks().forEach((track) => track.stop()); + setStream(null); + } + }, [hide]); - return ( -
- -
-
-
-
-
- -
- -
-
-
- -
-
-
-
-
-
- ); + return ( +
+ +
+
+
+
+
+ +
+ +
+
+
+ +
+
+
+
+
+
+ ); }; diff --git a/src/containers/applications/apps/discord.jsx b/src/containers/applications/apps/discord.jsx index 28c08dc8f..2cc30856e 100644 --- a/src/containers/applications/apps/discord.jsx +++ b/src/containers/applications/apps/discord.jsx @@ -5,106 +5,106 @@ import { Icon, ToolBar, LazyComponent } from "../../../utils/general"; import WidgetBot from "@widgetbot/react-embed"; export const DScord = () => { - const wnapp = useSelector((state) => state.apps.discord); - const [url, setUrl] = useState(null); - const servers = [ - { - src: "arrtective.png", - link: "https://discord.io/arttective", - }, - { - src: "mimi.png", - link: "https://discord.gg/AGSCfjgDMc", - }, - { - src: "narjiday.png", - link: "https://discord.gg/K9wcgZJfXS", - }, - { - src: "aliyss.png", - link: "https://discord.gg/zAypMTH", - }, - ]; + const wnapp = useSelector((state) => state.apps.discord); + const [url, setUrl] = useState(null); + const servers = [ + { + src: "arrtective.png", + link: "https://discord.io/arttective", + }, + { + src: "mimi.png", + link: "https://discord.gg/AGSCfjgDMc", + }, + { + src: "narjiday.png", + link: "https://discord.gg/K9wcgZJfXS", + }, + { + src: "aliyss.png", + link: "https://discord.gg/zAypMTH", + }, + ]; - useEffect(() => { - if (url == null) { - setUrl( - "https://e.widgetbot.io/channels/868499076432408627/868499076432408631" - ); - // setUrl("https://emerald.widgetbot.io/channels/299881420891881473/450428756855750666/?api=e2f9b64f-5292-43f5-a0d8-26fa43447eeb") - } - }); + useEffect(() => { + if (url == null) { + setUrl( + "https://e.widgetbot.io/channels/868499076432408627/868499076432408631" + ); + // setUrl("https://emerald.widgetbot.io/channels/299881420891881473/450428756855750666/?api=e2f9b64f-5292-43f5-a0d8-26fa43447eeb") + } + }); - return ( -
- -
-
-
-
- -
- - {servers.map((server, i) => ( - - ))} -
- -
-
- - - -
-
-
-
- ); + return ( +
+ +
+
+
+
+ +
+ + {servers.map((server, i) => ( + + ))} +
+ +
+
+ + + +
+
+
+
+ ); }; diff --git a/src/containers/applications/apps/edge.jsx b/src/containers/applications/apps/edge.jsx index 0b3294485..d91001e8e 100644 --- a/src/containers/applications/apps/edge.jsx +++ b/src/containers/applications/apps/edge.jsx @@ -3,250 +3,250 @@ import { useSelector, useDispatch } from "react-redux"; import { Icon, ToolBar, LazyComponent } from "../../../utils/general"; export const EdgeMenu = () => { - const wnapp = useSelector((state) => state.apps.edge); - const [url, setUrl] = useState("https://www.google.com/?igu=1"); - const [ierror, setErr] = useState(true); - const [isTyping, setTyping] = useState(false); - const [hist, setHist] = useState(["https://bing.com", "https://bing.com"]); - const dispatch = useDispatch(); + const wnapp = useSelector((state) => state.apps.edge); + const [url, setUrl] = useState("https://www.google.com/?igu=1"); + const [ierror, setErr] = useState(true); + const [isTyping, setTyping] = useState(false); + const [hist, setHist] = useState(["https://bing.com", "https://bing.com"]); + const dispatch = useDispatch(); - const iframes = { - "https://www.google.com/webhp?igu=1": "Google", - "https://bing.com": "Bing", - "https://www.youtube.com/embed/m0EHSoZzHEA": "Youtube", - "https://blueedge.me": "blueedge", - "https://andrewstech.me": "\nandrewstech", - "https://blueedge.me/unescape": "Unescape", - "https://win11.blueedge.me": "Inception", - "https://open.spotify.com/embed/user/jhfivkgdtg4s97pwbo1rbvr9v/playlist/6IdR78TOog83PV4XhLDvWN": - "Spotify", - "https://bluelab.blueedge.me": "BlueLab", - "https://othello.blueedge.me": "Othello", - }; + const iframes = { + "https://www.google.com/webhp?igu=1": "Google", + "https://bing.com": "Bing", + "https://www.youtube.com/embed/m0EHSoZzHEA": "Youtube", + "https://blueedge.me": "blueedge", + "https://andrewstech.me": "\nandrewstech", + "https://blueedge.me/unescape": "Unescape", + "https://win11.blueedge.me": "Inception", + "https://open.spotify.com/embed/user/jhfivkgdtg4s97pwbo1rbvr9v/playlist/6IdR78TOog83PV4XhLDvWN": + "Spotify", + "https://bluelab.blueedge.me": "BlueLab", + "https://othello.blueedge.me": "Othello", + }; - const favicons = { - "https://andrewstech.me": - "https://avatars.githubusercontent.com/u/45342431", - }; + const favicons = { + "https://andrewstech.me": + "https://avatars.githubusercontent.com/u/45342431", + }; - const isValidURL = (string) => { - var res = string.match( - /(http(s)?:\/\/.)?(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/g - ); - return res !== null; - }; + const isValidURL = (string) => { + var res = string.match( + /(http(s)?:\/\/.)?(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/g + ); + return res !== null; + }; - const action = (e) => { - var iframe = document.getElementById("isite"); - var x = e.target && e.target.dataset.payload; + const action = (e) => { + var iframe = document.getElementById("isite"); + var x = e.target && e.target.dataset.payload; - if (iframe && x == 0) { - iframe.src = iframe.src; - } else if (iframe && x == 1) { - setHist([url, "https://www.bing.com"]); - setUrl("https://www.bing.com"); - setTyping(false); - } else if (iframe && x == 2) { - setHist([url, "https://www.google.com/webhp?igu=1"]); - setUrl("https://www.google.com/webhp?igu=1"); - setTyping(false); - } else if (iframe && x == 3) { - if (e.key === "Enter") { - var qry = e.target.value; + if (iframe && x == 0) { + iframe.src = iframe.src; + } else if (iframe && x == 1) { + setHist([url, "https://www.bing.com"]); + setUrl("https://www.bing.com"); + setTyping(false); + } else if (iframe && x == 2) { + setHist([url, "https://www.google.com/webhp?igu=1"]); + setUrl("https://www.google.com/webhp?igu=1"); + setTyping(false); + } else if (iframe && x == 3) { + if (e.key === "Enter") { + var qry = e.target.value; - if (isValidURL(qry)) { - if (!qry.startsWith("http")) { - qry = "https://" + qry; - } - } else { - qry = "https://www.bing.com/search?q=" + qry; - } + if (isValidURL(qry)) { + if (!qry.startsWith("http")) { + qry = "https://" + qry; + } + } else { + qry = "https://www.bing.com/search?q=" + qry; + } - e.target.value = qry; - setHist([hist[0], qry]); - setUrl(qry); - setTyping(false); - } - } else if (x == 4) { - setUrl(hist[0]); - setTyping(false); - } else if (x == 5) { - setUrl(hist[1]); - setTyping(false); - } else if (x == 6) { - var tmp = e.target.dataset.url; - setHist([url, tmp]); - setUrl(tmp); - setTyping(false); - } - }; + e.target.value = qry; + setHist([hist[0], qry]); + setUrl(qry); + setTyping(false); + } + } else if (x == 4) { + setUrl(hist[0]); + setTyping(false); + } else if (x == 5) { + setUrl(hist[1]); + setTyping(false); + } else if (x == 6) { + var tmp = e.target.dataset.url; + setHist([url, tmp]); + setUrl(tmp); + setTyping(false); + } + }; - const typing = (e) => { - if (!isTyping) { - setTyping(true); - console.log([url, url]); - setHist([url, url]); - } - setUrl(e.target.value); - }; + const typing = (e) => { + if (!isTyping) { + setTyping(true); + console.log([url, url]); + setHist([url, url]); + } + setUrl(e.target.value); + }; - const handleFailed = () => { - setErr(false); - }; + const handleFailed = () => { + setErr(false); + }; - useEffect(() => { - if (wnapp.url) { - setTyping(false); - setUrl(wnapp.url); - dispatch({ type: "EDGELINK" }); - } - }); + useEffect(() => { + if (wnapp.url) { + setTyping(false); + setUrl(wnapp.url); + dispatch({ type: "EDGELINK" }); + } + }); - return ( -
- -
-
- -
-
New Tab
- -
-
-
-
- - - - -
- - -
-
-
-
- {Object.keys(iframes).map((mark, i) => { - return ( -
- -
{iframes[mark].trim()}
-
- ); - })} -
-
-
- - - + return ( +
+ +
+
+ +
+
New Tab
+ +
+
+
+
+ + + + +
+ + +
+
+
+
+ {Object.keys(iframes).map((mark, i) => { + return ( +
+ +
{iframes[mark].trim()}
+
+ ); + })} +
+
+
+ + + -
-
- x -
-
- If it shows "Refused to connect", then{" "} - that website doesn't allow - other websites to show their content. I cannot fix it. -
-
-
-
-
-
- ); +
+
+ x +
+
+ If it shows "Refused to connect", then{" "} + that website doesn't allow + other websites to show their content. I cannot fix it. +
+
+
+
+
+
+ ); }; diff --git a/src/containers/applications/apps/explorer.jsx b/src/containers/applications/apps/explorer.jsx index c048c2159..7c5a8e550 100644 --- a/src/containers/applications/apps/explorer.jsx +++ b/src/containers/applications/apps/explorer.jsx @@ -5,395 +5,395 @@ import { dispatchAction, handleFileOpen } from "../../../actions"; import "./assets/fileexpo.scss"; const NavTitle = (props) => { - var src = props.icon || "folder"; + var src = props.icon || "folder"; - return ( -
- - {props.title} -
- ); + return ( +
+ + {props.title} +
+ ); }; const FolderDrop = ({ dir }) => { - const files = useSelector((state) => state.files); - const folder = files.data.getId(dir); + const files = useSelector((state) => state.files); + const folder = files.data.getId(dir); - return ( - <> - {folder.data && - folder.data.map((item, i) => { - if (item.type == "folder") { - return ( - - ); - } - })} - - ); + return ( + <> + {folder.data && + folder.data.map((item, i) => { + if (item.type == "folder") { + return ( + + ); + } + })} + + ); }; const Dropdown = (props) => { - const [open, setOpen] = useState(props.isDropped != null); - const special = useSelector((state) => state.files.data.special); - const [fid, setFID] = useState(() => { - if (props.spid) return special[props.spid]; - else return props.dir; - }); - const toggle = () => setOpen(!open); + const [open, setOpen] = useState(props.isDropped != null); + const special = useSelector((state) => state.files.data.special); + const [fid, setFID] = useState(() => { + if (props.spid) return special[props.spid]; + else return props.dir; + }); + const toggle = () => setOpen(!open); - return ( -
-
- {!props.notoggle ? ( - - ) : ( - - )} - - {props.pinned != null ? ( - - ) : null} -
- {!props.notoggle ? ( -
- {open ? props.children : null} - {open && fid != null ? : null} -
- ) : null} -
- ); + return ( +
+
+ {!props.notoggle ? ( + + ) : ( + + )} + + {props.pinned != null ? ( + + ) : null} +
+ {!props.notoggle ? ( +
+ {open ? props.children : null} + {open && fid != null ? : null} +
+ ) : null} +
+ ); }; export const Explorer = () => { - const apps = useSelector((state) => state.apps); - const wnapp = useSelector((state) => state.apps.explorer); - const files = useSelector((state) => state.files); - const fdata = files.data.getId(files.cdir); - const [cpath, setPath] = useState(files.cpath); - const [searchtxt, setShText] = useState(""); - const dispatch = useDispatch(); + const apps = useSelector((state) => state.apps); + const wnapp = useSelector((state) => state.apps.explorer); + const files = useSelector((state) => state.files); + const fdata = files.data.getId(files.cdir); + const [cpath, setPath] = useState(files.cpath); + const [searchtxt, setShText] = useState(""); + const dispatch = useDispatch(); - const handleChange = (e) => setPath(e.target.value); - const handleSearchChange = (e) => setShText(e.target.value); + const handleChange = (e) => setPath(e.target.value); + const handleSearchChange = (e) => setShText(e.target.value); - const handleEnter = (e) => { - if (e.key === "Enter") { - dispatch({ type: "FILEPATH", payload: cpath }); - } - }; + const handleEnter = (e) => { + if (e.key === "Enter") { + dispatch({ type: "FILEPATH", payload: cpath }); + } + }; - const DirCont = () => { - var arr = [], - curr = fdata, - index = 0; + const DirCont = () => { + var arr = [], + curr = fdata, + index = 0; - while (curr) { - arr.push( -
-
- {curr.name} -
- -
- ); + while (curr) { + arr.push( +
+
+ {curr.name} +
+ +
+ ); - curr = curr.host; - } + curr = curr.host; + } - arr.push( -
-
- This PC -
- -
- ); + arr.push( +
+
+ This PC +
+ +
+ ); - arr.push( -
- - -
- ); + arr.push( +
+ + +
+ ); - return ( -
- {arr.reverse()} -
- ); - }; + return ( +
+ {arr.reverse()} +
+ ); + }; - useEffect(() => { - setPath(files.cpath); - setShText(""); - }, [files.cpath]); + useEffect(() => { + setPath(files.cpath); + setShText(""); + }, [files.cpath]); - return ( -
- -
- -
-
- - - -
- - -
-
- - -
-
-
- - -
-
-
{fdata.data.length} items
-
- - -
-
-
-
-
- ); + return ( +
+ +
+ +
+
+ + + +
+ + +
+
+ + +
+
+
+ + +
+
+
{fdata.data.length} items
+
+ + +
+
+
+
+
+ ); }; const ContentArea = ({ searchtxt }) => { - const files = useSelector((state) => state.files); - const special = useSelector((state) => state.files.data.special); - const [selected, setSelect] = useState(null); - const fdata = files.data.getId(files.cdir); - const dispatch = useDispatch(); + const files = useSelector((state) => state.files); + const special = useSelector((state) => state.files.data.special); + const [selected, setSelect] = useState(null); + const fdata = files.data.getId(files.cdir); + const dispatch = useDispatch(); - const handleClick = (e) => { - e.stopPropagation(); - setSelect(e.target.dataset.id); - }; + const handleClick = (e) => { + e.stopPropagation(); + setSelect(e.target.dataset.id); + }; - const handleDouble = (e) => { - e.stopPropagation(); - handleFileOpen(e.target.dataset.id); - }; + const handleDouble = (e) => { + e.stopPropagation(); + handleFileOpen(e.target.dataset.id); + }; - const emptyClick = (e) => { - setSelect(null); - }; + const emptyClick = (e) => { + setSelect(null); + }; - const handleKey = (e) => { - if (e.key == "Backspace") { - dispatch({ type: "FILEPREV" }); - } - }; + const handleKey = (e) => { + if (e.key == "Backspace") { + dispatch({ type: "FILEPREV" }); + } + }; - return ( -
-
-
- {fdata.data.map((item, i) => { - return ( - item.name.includes(searchtxt) && ( -
- - {item.name} -
- ) - ); - })} -
- {fdata.data.length == 0 ? ( - This folder is empty. - ) : null} -
-
- ); + return ( +
+
+
+ {fdata.data.map((item, i) => { + return ( + item.name.includes(searchtxt) && ( +
+ + {item.name} +
+ ) + ); + })} +
+ {fdata.data.length == 0 ? ( + This folder is empty. + ) : null} +
+
+ ); }; const NavPane = ({}) => { - const files = useSelector((state) => state.files); - const special = useSelector((state) => state.files.data.special); + const files = useSelector((state) => state.files); + const special = useSelector((state) => state.files.data.special); - return ( -
-
- - - - - - - - - - - - - - - - - - -
-
- ); + return ( +
+
+ + + + + + + + + + + + + + + + + + +
+
+ ); }; const Ribbon = ({}) => { - return ( -
-
-
- - New -
-
-
- - - - -
-
-
- - Sort -
-
- - View -
-
-
- ); + return ( +
+
+
+ + New +
+
+
+ + + + +
+
+
+ + Sort +
+
+ + View +
+
+
+ ); }; diff --git a/src/containers/applications/apps/getstarted.jsx b/src/containers/applications/apps/getstarted.jsx index 5bbf0b2d2..a540f7406 100644 --- a/src/containers/applications/apps/getstarted.jsx +++ b/src/containers/applications/apps/getstarted.jsx @@ -8,199 +8,199 @@ import LangSwitch from "./assets/Langswitch"; import { useTranslation } from "react-i18next"; export const Getstarted = () => { - const wnapp = useSelector((state) => state.apps.getstarted); - const dispatch = useDispatch(); - const tasks = useSelector((state) => state.taskbar); - const { t } = useTranslation(); + const wnapp = useSelector((state) => state.apps.getstarted); + const dispatch = useDispatch(); + const tasks = useSelector((state) => state.taskbar); + const { t } = useTranslation(); - const [pageNo, setPageNo] = useState(1); - const nextPage = () => (pageNo !== 6 ? setPageNo(pageNo + 1) : null); + const [pageNo, setPageNo] = useState(1); + const nextPage = () => (pageNo !== 6 ? setPageNo(pageNo + 1) : null); - const changUserName = (e) => { - var newName = e.target.value; - dispatch({ - type: "STNGSETV", - payload: { - path: "person.name", - value: newName, - }, - }); - }; + const changUserName = (e) => { + var newName = e.target.value; + dispatch({ + type: "STNGSETV", + payload: { + path: "person.name", + value: newName, + }, + }); + }; - return ( -
- -
-
-
- {pageNo === 1 ? ( - <> -
- left image -
-
-
- {t("oobe.country")} -
-
-
-
- {countries.map((e, i) => { - return ( -
- {e} -
- ); - })} -
-
- - ) : null} - {pageNo === 2 ? ( - <> -
- -
-
-
- {t("oobe.keyboard")} -
- {t("oobe.anotherkeyboard")} -
-
-
- -
-
- - ) : null} - {pageNo === 3 ? ( - <> -
- -
-
- - Checking for updates. -
- - ) : null} - {pageNo === 4 ? ( - <> -
- -
-
-
Let's name your PC
-
- Make it yours with unique name that's easy to recognize when - connecting to it from other devices.Your Pc will restart - after you name it. -
-
- -
-
- No more than 15 character
- No spaces or any of the following special characters: -
- "/\ [ ] : | < >+ = ; , ? -
-
- - ) : null} - {pageNo === 5 ? ( - <> -
- -
-
-
- Let's connect you to a network -
- You'll need an internet connection to continue the setting - up your device.Once connected, you'll get the latest - features and security updates. -
-
-
- {" "} -
-
Ethernet 01
-
Not connected
-
-
-
-
-
-
- Having trouble to getting connected? -
-
- For troubleshooting tips use another device and visit - aka.ms/networksetup -
-
-
- - ) : null} - {pageNo === 6 ? ( - <> -
- -
-
-
The setup has completed.
-
You can close this now.
-
- - ) : null} + return ( +
+ +
+
+
+ {pageNo === 1 ? ( + <> +
+ left image +
+
+
+ {t("oobe.country")} +
+
+
+
+ {countries.map((e, i) => { + return ( +
+ {e} +
+ ); + })} +
+
+ + ) : null} + {pageNo === 2 ? ( + <> +
+ +
+
+
+ {t("oobe.keyboard")} +
+ {t("oobe.anotherkeyboard")} +
+
+
+ +
+
+ + ) : null} + {pageNo === 3 ? ( + <> +
+ +
+
+ + Checking for updates. +
+ + ) : null} + {pageNo === 4 ? ( + <> +
+ +
+
+
Let's name your PC
+
+ Make it yours with unique name that's easy to recognize when + connecting to it from other devices.Your Pc will restart + after you name it. +
+
+ +
+
+ No more than 15 character
+ No spaces or any of the following special characters: +
+ "/\ [ ] : | < >+ = ; , ? +
+
+ + ) : null} + {pageNo === 5 ? ( + <> +
+ +
+
+
+ Let's connect you to a network +
+ You'll need an internet connection to continue the setting + up your device.Once connected, you'll get the latest + features and security updates. +
+
+
+ {" "} +
+
Ethernet 01
+
Not connected
+
+
+
+
+
+
+ Having trouble to getting connected? +
+
+ For troubleshooting tips use another device and visit + aka.ms/networksetup +
+
+
+ + ) : null} + {pageNo === 6 ? ( + <> +
+ +
+
+
The setup has completed.
+
You can close this now.
+
+ + ) : null} -
- Yes -
-
+
+ Yes +
+
-
- accessibility - -
-
-
-
- ); +
+ accessibility + +
+
+
+
+ ); }; diff --git a/src/containers/applications/apps/notepad.jsx b/src/containers/applications/apps/notepad.jsx index a69896298..614c60b98 100644 --- a/src/containers/applications/apps/notepad.jsx +++ b/src/containers/applications/apps/notepad.jsx @@ -3,38 +3,38 @@ import { useSelector, useDispatch } from "react-redux"; import { ToolBar } from "../../../utils/general"; export const Notepad = () => { - const wnapp = useSelector((state) => state.apps.notepad); + const wnapp = useSelector((state) => state.apps.notepad); - return ( -
- -
-
-
File
-
Edit
-
View
-
-
-
-