28 |
29 | 😔 Unable to reach hyper repositories: Check your internet connection
30 |
31 |
54 | {
55 | repositoryData[repoType].map( repo => {
56 | return
{
61 | }}
62 | key={`${repo.package}.${repo.user}.item`
63 | }/>
64 | })
65 | }
66 | Hyper is modular by core.
,
16 | image: 'assets://welcome_slidewidgets.png',
17 | color: '#7614F5'
18 | },
19 | {
20 | icon: 'Feather',
21 | title: 'Themes',
22 | text: Made with only modern CSS, the look can be drastically modified by installing themes.
,
25 | image: 'assets://welcome_slidethemes.png',
26 | color: '#000'
27 | },
28 | {
29 | icon: 'Zap',
30 | title: 'Tricks',
31 | image: 'assets://welcome_slidetricks.png',
32 | color: '#7614F5',
33 | text:
34 | • Hold CTRL and right click anywhere in the bar to show options.
38 | }
39 | ]
40 |
41 | const Welcome = () => {
42 | const [currentPage, setcurrentPage] = useState(0)
43 | const pageObj = Pages[currentPage]
44 | //@ts-ignore
45 | const Glyph : ElementType = Icon[pageObj.icon]
46 | return (
47 | ;
14 | change?: () => void;
15 | }
16 |
17 |
18 | function Input({ category, entry, field, value, type, options, change }: InputProps) {
19 |
20 |
21 | const config = new Config()
22 |
23 | function applyChange(newValue: any) {
24 | change?.()
25 | config.set(category, entry, field, newValue, (Err) => console.log)
26 | config.save(()=>{
27 | change?.()
28 | })
29 | }
30 |
31 |
32 | function renderForm() {
33 | switch (type) {
34 | case "color":
35 | const [color, setColor] = useColor("hex", value);
36 |
37 | if (color.hex !== value) {
38 | applyChange(color.hex)
39 | }
40 |
41 | return <>
42 |
43 |
45 |
46 | break;
47 | case "text":
48 | return <>
49 |
50 |
51 |
64 |
70 |
71 |
{
72 | change?.()
73 | applyChange(e.target.checked)
74 | }} defaultChecked={value} />
75 |
77 |
80 |
82 |
83 | case "number":
84 | return <>
85 |
86 |
87 | {
90 | const element = document.getElementById(`${category}.${entry}.${field}`)
91 | // @ts-ignore // We need to ignore this, the solution for that is a stupid type swap, which i'm not going to do
92 | let num = Number(element.value);
93 | num--;
94 | // @ts-ignore
95 | element.value = num
96 | applyChange(num)
97 | }}
98 | >
99 | −
100 |
101 | {
113 | const element = document.getElementById(`${category}.${entry}.${field}`)
114 | //@ts-ignore // I'm not doing type swap, sorry.
115 | let num = Number(element.value);
116 | num++;
117 | // @ts-ignore
118 | element.value = num
119 | applyChange(num)
120 | }}
121 | >
122 | +
123 |
124 |
125 |
130 |
131 |
132 | {value}
133 |
135 |
149 |
150 |
151 |
😞 Field type not recognized
156 |
157 | }
158 | }
159 |
160 |
161 | return (
162 |
163 | {renderForm()}
164 |
165 | );
166 | }
167 |
168 | export default Input;
--------------------------------------------------------------------------------
/src/render/components/settings/pages/about.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | function About() {
4 |
5 | return <>
6 | :)
7 |
8 | }
9 |
10 | export default About
--------------------------------------------------------------------------------
/src/render/components/settings/pages/default.tsx:
--------------------------------------------------------------------------------
1 | import React, { ElementType} from 'react';
2 | import { Config } from '../../../../shared/config';
3 | import * as Icon from 'react-feather';
4 | import type { ConfigItem } from'../../../../@types/hyper'
5 |
6 | import Input from '../input';
7 |
8 | type PageProps = {
9 | active: string,
10 | change?: () => void;
11 | }
12 |
13 | function ConfigPage( {active, change}: PageProps ) {
14 | const config = new Config()
15 | const { category, entry } = { category: active.split('.')[0], entry: active.split('.')[1] }
16 |
17 |
18 | function generateFields(entryData: ConfigItem) {
19 | return Object.keys(entryData.fields).map( field =>{
20 | const fieldData = entryData.fields[field]
21 |
22 | return <>
23 |
24 |
{fieldData.name}
25 |
{fieldData.description}
26 |
27 |
42 |
43 |
46 |
🤷♂️ There's nothing here
47 |
There's no fields for this config page
48 |
49 |
54 |
{Glyph &&
55 |
{entryData.description}
56 |
57 | {generateFields(entryData)}
58 |
59 |
67 |
68 |
71 |
😭 Oh, my...
72 |
This config page is invalid, call the devs
73 |
74 |
22 |
23 |
24 |
This list contains your installed and detected widgets
25 | {DetectedWidgets.loadedWidgets.map(widget => {
26 | if (!widget) { return }
27 | return
{
36 | const widgetRepository = new WidgetRepository()
37 | widgetRepository.uninstallWidget(widget, () => {
38 | window.location.reload()
39 | props.change?.()
40 | })}
41 | }
42 | />
43 | })}
44 |
63 | }
64 |
65 | export default Widgets
--------------------------------------------------------------------------------
/src/render/components/settings/refreshPrompt.tsx:
--------------------------------------------------------------------------------
1 | import React, { useState, useEffect } from 'react';
2 | import { motion, useAnimation } from "framer-motion";
3 | import { refresh } from '../../ipc'
4 |
5 | import { RefreshCw, ChevronUp } from 'react-feather';
6 |
7 |
8 | function refreshPrompt() {
9 | const [collapsed, setCollapsed] = useState(false)
10 | const controls = useAnimation()
11 | const arrowControls = useAnimation()
12 |
13 | const sequence = async () => {
14 | await controls.start({ y: 0, x: "-50%", transition: { duration: 0 } })
15 | await controls.start({ y: -60, transition: { duration: .5 } })
16 | await controls.start({ y: -25, transition: { duration: .3, delay: 2 } })
17 | setCollapsed(true)
18 | return await arrowControls.start({ opacity: 100, transition: { duration: .3 } })
19 | }
20 |
21 |
22 | useEffect(() => {
23 | sequence()
24 | }, [])
25 |
26 | return <>
27 |
31 | {
34 | controls.start({
35 | y: !collapsed ? -25 : -60,
36 | transition: { duration: .3 }
37 | })
38 | await arrowControls.start({ height: 2, opacity: !collapsed ? 100 : 0, transition: { duration: .3 } })
39 |
40 | setCollapsed(!collapsed)
41 | }}
42 | animate={arrowControls}
43 | >
44 |
46 |
47 |
50 | Refresh to apply
51 |
52 |
56 |
58 |
61 |
62 | }
63 |
64 | export default refreshPrompt
--------------------------------------------------------------------------------
/src/render/components/settings/sidebar/item.tsx:
--------------------------------------------------------------------------------
1 | import React, { ElementType } from 'react';
2 |
3 | import * as Icon from 'react-feather';
4 |
5 | type ItemProps = {
6 | name: string,
7 | category: string,
8 | entry: string,
9 | active?: string,
10 | click?: (category: string)=> void,
11 | icon: string,
12 | key?: string
13 | }
14 |
15 | function Item( {name, click, active, icon, category, entry } : ItemProps) {
16 | //@ts-ignore
17 | const Glyph : ElementType = Icon[icon]
18 |
19 | return <>
20 | {
32 | console.log("Clicked", name)
33 | if (click) { click(`${category}.${entry}`) }
34 | }}
35 | >
36 | { Glyph &&
39 |
40 | }
41 |
42 | export default Item
--------------------------------------------------------------------------------
/src/render/components/settings/sidebar/sidebar.tsx:
--------------------------------------------------------------------------------
1 | import React, { Component } from 'react';
2 | import PerfectScrollbar from 'perfect-scrollbar';
3 | import { Config } from '../../../../shared/config';
4 | import type { ConfigTable, ConfigCategory } from'../../../../@types/hyper'
5 |
6 | import '../../../style/index.css';
7 | import '../../../style/settings.module.css';
8 |
9 | import Item from './item';
10 |
11 | const config = new Config()
12 |
13 | type SidebarProps = {
14 | active: string;
15 | onChange?: (page: string)=> void;
16 | }
17 | class Sidebar extends Component {
18 |
19 | generateEntries(category: string) {
20 | const categoryData = config.data[category] as ConfigCategory
21 |
22 | return Object.keys(categoryData.items).map( entry => {
23 | const entryData = categoryData.items[entry]
24 | return -
25 | })
26 | }
27 |
28 | generateCategories() {
29 | return Object.keys(config.data as ConfigTable).map( entry => {
30 | const category = config.data[entry] as ConfigCategory
31 |
32 | return (
33 | <>
34 |
{category.name}
35 |
36 | {this.generateEntries(entry)}
37 |
38 |
39 | )
40 | })
41 | }
42 |
43 | componentDidMount(){
44 | new PerfectScrollbar('#container',{
45 | wheelSpeed: 2,
46 | wheelPropagation: true,
47 | minScrollbarLength: 20
48 | })
49 | }
50 |
51 | render() {
52 | return (
53 |
54 |
55 |
56 | Settings
58 |
59 | Hyper
60 |
65 | {this.generateCategories()}
66 | {this.props.children}
67 |
68 |
69 |
41 | { ipcRenderer.send('closeSettings') } }
51 | />
52 |
53 |
54 |
55 | }
56 |
57 | export default Titlebar
--------------------------------------------------------------------------------
/src/render/components/widgets/widgetItem.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import * as Icon from 'react-feather';
3 |
4 | interface Props {
5 | image?: string
6 | name: string
7 | description: string
8 | author?: string
9 | repository?: string
10 | installed?: boolean
11 | version?: string
12 | onClick?: () => void
13 | uninstall?: () => void
14 | install?: () => void
15 | }
16 |
17 | const WidgetItem = (props: Props) => {
18 | const defaultImage = "https://i.imgur.com/vccRW0H.png"
19 |
20 | return <>
21 |
22 |
23 |
24 |
{props.name} {props.version && `[${props.version}]`}
25 | {props.description}
26 | {props.author ?? 'Unknown author'}
27 |
28 |
29 | {props.repository &&
30 |
34 |
36 | }
37 | {props.installed ?
41 |
43 | :
47 |
49 | }
50 |
51 |
{
102 | if (selectedLine == line) {
103 | setSelectedLine(undefined)
104 | } else {
105 | setSelectedLine(line)
106 | }
107 | }}
108 | >
109 |
110 | {line.time.toLocaleTimeString()}
111 |
112 |
113 | {line.name.toUpperCase()}
114 |
115 |
120 | {line.message.split('\n').map((str: string) =>
{str}
)}
121 |
123 | })
124 | }
125 |
126 | return
127 |
128 |
129 |
Hyper Console - Last update: {lastUpdate.toLocaleTimeString()}
130 |
131 |
132 | {renderLines()}
133 |
134 |
135 |
136 | {
140 | if (filter.level === MessageLevel.WARN){
141 | setFilter({})
142 | } else {
143 | setFilter({level: MessageLevel.WARN})}
144 | }
145 | }>
146 | {history.filter(line=>{
147 | return line.level === MessageLevel.WARN
148 | }).length}
149 |
150 | {
151 | if (filter.level === MessageLevel.ERROR){
152 | setFilter({})
153 | } else {
154 | setFilter({level: MessageLevel.ERROR})}
155 | }
156 | }>
157 | {history.filter(line=>{
158 | return line.level === MessageLevel.ERROR
159 | }).length}
160 |
161 | {
162 | if (filter.level === MessageLevel.SUCCESS){
163 | setFilter({})
164 | } else {
165 | setFilter({level: MessageLevel.SUCCESS})}
166 | }
167 | }>
168 | {history.filter(line=>{
169 | return line.level === MessageLevel.SUCCESS
170 | }).length}
171 |
172 | {
173 | if (filter.level === MessageLevel.DEBUG){
174 | setFilter({})
175 | } else {
176 | setFilter({level: MessageLevel.DEBUG})}
177 | }
178 | }>
179 | {history.filter(line=>{
180 | return line.level === MessageLevel.DEBUG
181 | }).length}
182 |
183 | {
184 | if (filter.level === MessageLevel.INFO){
185 | setFilter({})
186 | } else {
187 | setFilter({level: MessageLevel.INFO})}
188 | }
189 | }>
190 | {history.filter(line=>{
191 | return line.level === MessageLevel.INFO
192 | }).length}
193 |
194 |
210 |
211 |
212 |
213 |
Logger
214 | {/*@ts-expect-error This is internal tooling, i don't give a fuck.*/}
215 |
{selectedLine ? selectedLine.name : '-'}
216 |
217 |
218 |
Level
219 | {/*@ts-expect-error This is internal tooling, i don't give a fuck.*/}
220 |
{selectedLine ? LevelStrings[selectedLine.level] : '-'}
221 |
222 |
223 |
Message
224 | {/*@ts-expect-error This is internal tooling, i don't give a fuck.*/}
225 |
{selectedLine ? selectedLine.message.split('\n').map((str: string) =>
{str}
) : '-'}
226 |
227 |
228 |
Stack
229 |
{selectedLine
230 | /*@ts-expect-error This is internal tooling, i don't give a fuck.*/
231 | ? selectedLine.stack.map(str=>{
232 | return
{str}
233 | })
234 | : '-'
235 | }
236 |
237 |
238 |
239 |
240 |
24 |
27 | }
28 |
--------------------------------------------------------------------------------
/src/render/windows/index.tsx:
--------------------------------------------------------------------------------
1 | import React, {useLayoutEffect} from "react"
2 | import ReactDOM from "react-dom"
3 |
4 | import '../style/index.css';
5 |
6 | //@ts-ignore
7 | import {loadWidgets, loadThemes} from '../utils'
8 | import {openExtensions, openContext} from '../ipc'
9 |
10 | ReactDOM.render({
24 | if (e.ctrlKey) {
25 | openContext()
26 | }
27 | }}
28 | style={{marginTop: 'var(--offset)'}}
29 | >
30 | { loadedWidgets.map(widget =>{
31 | if (typeof widget.default === 'function') {
32 | //@ts-expect-error
33 | return
34 | }
35 | }) }
36 | {/* Using plain CSS, just in case there's also no themes loaded... for some reason */}
37 | {loadedWidgets.length <= 0 &&
38 |
50 | HYPERBAR - CLICK HERE TO START ⚡
51 |
}
52 | {
17 |
18 | constructor(props: LoadingProps) {
19 | super(props)
20 | this.state = {
21 | artwork: {image:'', author: '', link: '', name: ''},
22 | phrase: ""
23 | }
24 | }
25 |
26 | componentWillMount() {
27 | axios.get('https://raw.githubusercontent.com/hyperts/hyperassets/main/loadingartwork.json') // TODO: Move this to .env?
28 | .then((response)=>{
29 | const artworkList = response.data
30 | const random = Math.floor(Math.random() * artworkList.length);
31 | this.setState({
32 | artwork : {
33 | image: artworkList[random].image,
34 | name: artworkList[random].name,
35 | link: artworkList[random].link,
36 | author: artworkList[random].author
37 | }
38 | })
39 | })
40 | .catch((err)=>{
41 | console.log(err)
42 | })
43 |
44 | axios.get('https://raw.githubusercontent.com/hyperts/hyperassets/main/loadingquotes.json')
45 | .then((response)=>{
46 | const phraseList = response.data
47 | const random = Math.floor(Math.random() * phraseList.length);
48 | this.setState({
49 | phrase: phraseList[random]
50 | })
51 | })
52 | }
53 |
54 | render() {
55 | return <>
56 |
57 |
58 |
59 |
60 |
61 |
64 |
65 |
Hyper is loading
66 |
{this.state.phrase}
67 |
68 |
Artwork: {this.state.artwork.name} by {this.state.artwork.author}
69 |
70 |
41 | }
42 | }
43 |
44 | return <>
45 |
47 |
48 |
49 | {renderPage()}
50 | {refreshPending &&
53 | Hyper ⚡ Settings
11 |
12 |
13 |
14 |
15 |
16 |
17 |
--------------------------------------------------------------------------------
/src/shared/config.ts:
--------------------------------------------------------------------------------
1 | import fs from 'fs'
2 | import { homedir } from 'os';
3 | import YAML from 'yaml'
4 | import * as objSearch from 'dot-prop'
5 | import type { ConfigTable, ConfigCategory, ConfigItem, ConfigField } from '../@types/hyper'
6 |
7 | export class Config {
8 |
9 | /**
10 | * Returns data using any object path
11 | * ex: .get("mario.items") -- will return object with all objects from the category mario
12 | * @return {any} The path content
13 | */
14 | public get: (configStr: string) => any;
15 | /**
16 | * Returns the value from specified field
17 | * @param {string} category The category which field belongs.
18 | * @param {string} field The field name
19 | * @return {string | boolean | number} The field value
20 | */
21 | public getValue: (category: string, entry: string, field: string) => string | boolean | number;
22 | /**
23 | * Returns a category object with the provided key and
24 | * @return {ConfigEntry | undefined} The category object or undefined
25 | */
26 | public getCategory: (category: string) => ConfigCategory;
27 | /**
28 | * Returns the item object with provided keys
29 | * @param {string} category The category which contains the wanted item
30 | * @param {string} entry The wanted entry
31 | * @return {ConfigItem} The item object
32 | */
33 | public getEntry: (category: string, entry: string) => ConfigItem;
34 | /**
35 | * Returns the entry object with provided keys
36 | * @param {string} category The category which contains the wanted entry
37 | * @param {string} entry The wanted entry which the field belongs to
38 | * @param {string} field The field name
39 | * @return {ConfigField} The field object
40 | */
41 | public getField: (category: string, entry: string, field:string) => ConfigField;
42 | /**
43 | * Set's a new value to the specified category and field value
44 | * @param {string} category Category where the desired entry
45 | * @param {string} entry Config entry where the desired field is
46 | * @param {string} field Field to change value
47 | * @param {string | boolean | number} value The value to be inserted
48 | * @param {(Error?: Error) => void} callback Action callback, will be called after the save procedure, may return Error.
49 | */
50 | public set: (category: string, entry: string, field: string, value: string | boolean | number, callback: (Error?: Error)=> void) => void;
51 | /**
52 | * Saves the current config values to the user directory
53 | * Without running this, every change on config will be reverted back to normal state
54 | * @param {function} [callback] Callback function to run after saving
55 | */
56 | public save: (callback?: () => void) => void;
57 | /**
58 | * Inserts a new category to the config table
59 | * @param {string} category The category name
60 | * @param {ConfigCategory} data The data to be inserted
61 | * @return {string} String with the object path (to be used withing config.get())
62 | */
63 | public insert: (category:string, data: ConfigCategory) => string;
64 | /**
65 | * Adds a new section under said category
66 | * A section is the block that holds fields, it's what the user sees on the sidebar
67 | * @param {string} category
68 | * @param {ConfigItem} data
69 | * @return {string} The oject path to the newly added entry
70 | */
71 | public addEntry: (category: string, data: ConfigItem) => string;
72 | /**
73 | * Adds a new field under specified category
74 | * @param {string} category The category name
75 | * @param {string} entry The section inside category which holds the fields
76 | * @param {ConfigField} field The field with all of it's data to be added
77 | * @return {string} The object path to the newly added field
78 | */
79 | public addField: (category:string, entry: string, data: ConfigField) => string;
80 | private path: string;
81 | private yaml: string;
82 | /**
83 | * The user config table itself or any other part of it based on the path used in constructor
84 | * If the constructor is empty, this will return the entire config table (ConfigTable type)
85 | */
86 | readonly data: ConfigTable | ConfigCategory | ConfigItem | ConfigField | any;
87 |
88 | constructor (entry?: string) {
89 | this.path = `${homedir()}\\.hyperbar\\config.yaml`
90 | this.yaml = fs.readFileSync(this.path, 'utf8').toString()
91 |
92 | if (!entry) {
93 | this.data = YAML.parse(this.yaml)
94 | } else {
95 | this.data = objSearch.get(YAML.parse(this.yaml), entry) as any
96 | }
97 |
98 | this.get = function (configStr) {
99 | const stack = objSearch.get(this.data, configStr, undefined)
100 | return stack
101 | }
102 |
103 | this.getCategory = function (category: string) {
104 | const stack = objSearch.get(this.data, `${category}`) as ConfigCategory
105 | return stack
106 | }
107 |
108 | this.getEntry = function (category: string, entry: string) {
109 | const entryKey = entry.toLowerCase().split(' ').join('_')
110 |
111 | const stack = objSearch.get(this.data, `${category}.items.${entryKey}`) as ConfigItem
112 | return stack
113 | }
114 |
115 | this.getField = function(category: string, entry: string, field:string) {
116 | const stack = objSearch.get(this.data, `${category}.items.${entry}.fields.${field}`) as ConfigField
117 | return stack
118 | }
119 |
120 | this.getValue = function (category: string, entry: string, field: string) {
121 | const stack = objSearch.get(this.data, `${category}.items.${entry}.fields.${field}.value`) as string | number | boolean
122 | return stack
123 | }
124 |
125 |
126 | this.set = function (category, entry, field, value, callback) {
127 | if (this.data) {
128 | objSearch.set(this.data, `${category}.items.${entry}.fields.${field}.value`, value)
129 | } else {
130 | callback(new Error(`No data found for < ${category}.fields.${field} >`))
131 | }
132 | if (callback) { callback() }
133 | }
134 |
135 | this.insert = function( category,{name} ) {
136 | const categoryKey = category.toLocaleLowerCase().split(' ').join('_')
137 |
138 | if (!this.data[categoryKey]) {
139 | this.data[categoryKey] = {
140 | name: name,
141 | items: {
142 | }
143 | }
144 | }
145 |
146 | return categoryKey
147 |
148 | }
149 |
150 | this.addEntry = function( category, {name, description, icon, fields}) {
151 | const categoryKey = category
152 |
153 | const explodedKey = name.split(" ")
154 | const key = explodedKey.join("_").toLowerCase()
155 |
156 | objSearch.set(this.data, `${categoryKey}.items.${key}`, {
157 | name,
158 | description,
159 | icon,
160 | fields: fields || {}
161 | })
162 |
163 | return `${categoryKey}.items.${key}`
164 | }
165 |
166 | this.addField = function(category, entry, {name, description, type, value, options}) {
167 | const categoryKey = category
168 |
169 | const explodedEntry = name.split(" ")
170 | const entryKey = explodedEntry.join("_").toLowerCase()
171 |
172 | const explodedKey = name.split(" ")
173 | const key = explodedKey.join("_").toLowerCase()
174 |
175 |
176 | objSearch.set(this.data, `${categoryKey}.items.${entryKey}.fields.${key}`, {
177 | name,
178 | description,
179 | type,
180 | value,
181 | options
182 | })
183 |
184 | return `${categoryKey}.items.${entry}.fields.${key}`
185 | }
186 |
187 | this.save = function (callback) {
188 | fs.writeFileSync(this.path, YAML.stringify(this.data), 'utf8')
189 | if (callback) { callback() }
190 | }
191 | }
192 | }
193 |
--------------------------------------------------------------------------------
/src/shared/logger.ts:
--------------------------------------------------------------------------------
1 | import { ipcMain, ipcRenderer } from 'electron';
2 | import {Config} from '../shared/config'
3 |
4 | export type MessagePayload = {message: string, level: number, name: string, stack: string[], time: Date}
5 |
6 | function stringify(message: any[]){
7 | const messageArray: string[] = []
8 |
9 | message.forEach( str => {
10 | if (typeof str === 'string') { messageArray.push(str)}
11 | else { messageArray.push(JSON.stringify(str))}
12 | })
13 |
14 | return messageArray.join(' ')
15 | }
16 |
17 | export class Logger {
18 | public name: string
19 | private isRenderer: boolean
20 | private queue: any[]
21 | private locked: boolean
22 | /**
23 | * Initializes a new logger instance.
24 | * @param name Identifier of this instance.
25 | **/
26 | constructor (name: string) {
27 | this.name = name
28 | this.isRenderer = process.type === 'renderer'
29 | this.queue = []
30 | this.locked = true
31 | if (!this.isRenderer) {
32 | this.listen()
33 | }
34 | }
35 |
36 | //@ts-ignore
37 | private send({message, level}: {message: any[], level: MessageLevel}) {
38 |
39 | if (!new Config().getValue('general','misc', "console-window")) {
40 | return
41 | }
42 | const stackLines: string[] = [];
43 |
44 | const error = new Error()
45 | if (error.stack) {
46 | (error.stack).split('at ').forEach( (stackLine, index) => {
47 | if (index < 2) { return }
48 | stackLines.push(stackLine.trim())
49 | })
50 | }
51 |
52 | const data = {
53 | message: stringify(message),
54 | level,
55 | name: this.name,
56 | stack: stackLines,
57 | time: new Date()
58 | }
59 |
60 | if (this.isRenderer) {
61 | ipcRenderer.send('h_logmessage', data)
62 | } else {
63 | const { windows }:{windows: {[key:string]:Electron.BrowserWindow}} = require('../main')
64 |
65 | if (!windows.console) {
66 | this.queue.push(data)
67 | const queueChecker = setInterval(()=>{
68 | console.log("Waiting for console window to be ready!")
69 |
70 | if (windows.console && !this.locked) {clearInterval(queueChecker)} // If it's unlocked, remove the checked and continue.
71 | else { return } // Otherwise we stop here
72 |
73 | this.queue.forEach( item => {
74 | windows?.console.webContents.send('h_logmessage', item)
75 | })
76 | }, 100)
77 |
78 | return
79 | }
80 |
81 | windows?.console.webContents.send('h_logmessage', data)
82 | }
83 | }
84 |
85 | private listen() {
86 | ipcMain.on('h_consoleready', ()=> {
87 | this.locked = false
88 | })
89 | }
90 |
91 | public info(...args: any[]) {
92 | this.send({
93 | message: args,
94 | level: MessageLevel.INFO
95 | })
96 | }
97 |
98 | public warn(...args: any[]) {
99 | this.send({
100 | message: args,
101 | level: MessageLevel.WARN,
102 | })
103 | }
104 |
105 | public error(...args: any[]) {
106 | this.send({
107 | message: args,
108 | level: MessageLevel.ERROR
109 | })
110 | }
111 |
112 | public silly(...args: any[]) {
113 | this.send({
114 | message: args,
115 | level: MessageLevel.DEBUG,
116 | })
117 | }
118 |
119 | public debug(...args: any[]) {
120 | this.send({
121 | message: args,
122 | level: MessageLevel.DEBUG,
123 | })
124 | }
125 |
126 | public success(...args: any[]) {
127 | this.send({
128 | message: args,
129 | level: MessageLevel.SUCCESS,
130 | })
131 | }
132 | }
133 |
134 | export enum MessageLevel {
135 | DEBUG = 1,
136 | INFO = 2,
137 | WARN = 3,
138 | ERROR = 4,
139 | SUCCESS = 5
140 | }
141 |
142 |
--------------------------------------------------------------------------------
/src/shared/theme.ts:
--------------------------------------------------------------------------------
1 | import chokidar from 'chokidar'
2 | import {ipcRenderer, app} from 'electron'
3 | import { Config } from './config'
4 | import { readdirSync, existsSync, readFileSync, lstatSync } from 'fs'
5 | import log from 'electron-log'
6 | import { join } from 'path'
7 | import { homedir } from 'os'
8 | const logger = log.scope('THEME')
9 |
10 | type CssVar = {
11 | name: string;
12 | value: string
13 | }
14 |
15 | type Theme = {
16 | name: string;
17 | author?: string;
18 | repository?: string;
19 | dependency?: string[];
20 | version?: string;
21 | supportedWidgets?: string[];
22 | file: string;
23 | folder: string;
24 | }
25 |
26 | class ThemeRepository {
27 | private isRenderer: boolean
28 | private config: Config
29 | public varList: CssVar[]
30 | public installedThemes: Theme[]
31 | public activeTheme: Theme | undefined;
32 |
33 | constructor() {
34 | this.config = new Config()
35 | this.isRenderer = process && process.type === 'renderer'
36 | this.varList = []
37 | this.installedThemes = []
38 | }
39 |
40 | public setVars() {
41 | const dockedTop = this.config.getValue('general', 'position', 'dock-pos') === 'top'
42 | const barHeight = this.config.getValue('appearence', 'sizes', 'height') as number
43 | const barPadding = this.config.getValue('appearence', 'sizes', 'padding') as number
44 | const offset = (dockedTop
45 | ? barHeight < 39
46 | ? (barHeight - 39) * - 1
47 | : 0
48 | : 0)
49 | const accentColor = this.config.getValue('appearence', 'color', 'accent') as string
50 | const primaryColor = this.config.getValue('appearence', 'color', 'primary') as string
51 | const secondaryColor = this.config.getValue('appearence', 'color', 'secondary') as string
52 |
53 | this.varList.push({ name: 'barsize', value: `${barHeight}px` })
54 | this.varList.push({ name: 'padding', value: `${barPadding}px` })
55 | this.varList.push({ name: 'offset', value: `${offset}px` })
56 |
57 | this.varList.push({ name: 'accent', value: accentColor })
58 | this.varList.push({ name: 'primary', value: primaryColor })
59 | this.varList.push({ name: 'secondary', value: secondaryColor })
60 |
61 | if (!this.isRenderer) {
62 | app.on('browser-window-created', (e, window) => {
63 | const cssStr = this.varList.map( variable => {
64 | return `--${variable.name}: ${variable.value}`
65 | })
66 | window.webContents.insertCSS(`
67 | :root {
68 | ${cssStr.join(';')}
69 | }
70 | `)
71 | })
72 |
73 | return
74 | }
75 | }
76 |
77 | setup() {
78 | this.setVars()
79 | this.varList.forEach(variable => {
80 | document.documentElement.style.setProperty(`--${variable.name}`, variable.value)
81 | })
82 | const style = document.createElement('link')
83 | style.setAttribute('rel', 'stylesheet')
84 | style.setAttribute('href', `theme://index.css`)
85 |
86 | document.head.appendChild(style)
87 |
88 | this.watchTheme()
89 | }
90 |
91 | install() {
92 |
93 | }
94 |
95 | uninstall() {
96 |
97 | }
98 |
99 | listThemes() {
100 | return this.installedThemes
101 | }
102 |
103 | validate() {
104 | const currentThemeList = this.config.getField('general', 'appearence', 'theme').options as string[]
105 | let tempList: string[] = []
106 | this.installedThemes.forEach(theme => {
107 | const path = theme.file.split('\\themes\\')
108 | const directory = path[path.length - 1].split('\\')[0]
109 |
110 | if (!currentThemeList.includes(directory)) {
111 | tempList = [...tempList, directory]
112 | }
113 |
114 | if ( this.config.getValue('general', 'appearence', 'theme') === directory) {
115 | this.activeTheme = theme
116 | }
117 | })
118 |
119 | this.config.data.appearence.items.theme.fields.selected.options = tempList
120 | this.config.save()
121 | }
122 |
123 | private loadTheme(theme: string, path: string) {
124 | const themePath = join(path, theme);
125 | const themePathManifest = join(themePath, 'manifest.json');
126 |
127 | if (!existsSync(themePath)) {
128 | logger.warn(`Path [${themePath}] is invalid`);
129 | return;
130 | }
131 |
132 | if (!existsSync(themePathManifest)) {
133 | logger.warn(`Failed to load [${themePath}]\n > ${themePathManifest} does not exist`);
134 | return;
135 | }
136 |
137 | const stats = lstatSync(path)
138 |
139 | if (stats && !stats.isDirectory()) {
140 | logger.warn(`Detected invalid file in widgets path.\n - You forgot to extract the widget?\n - Widget files must be on their own folder, not directly on widgets directory.\n - This file will not be loaded.`)
141 | }
142 |
143 |
144 | const themeInfo = JSON.parse(readFileSync(themePathManifest).toString());
145 | themeInfo.file = themePathManifest
146 |
147 | this.installedThemes.push(themeInfo)
148 | }
149 |
150 | loadThemes() {
151 | this.themesPath.forEach(path => {
152 | const themes = readdirSync(path);
153 |
154 | themes.forEach(theme => {
155 | this.loadTheme(theme, path);
156 | })
157 | });
158 | }
159 |
160 | watchTheme() {
161 |
162 | const watchThemes = this.config.getValue('general', 'misc', 'watch-themes')
163 | if (!watchThemes) { return }
164 |
165 | const watcher = chokidar.watch(this.themesPath)
166 |
167 | watcher.on('change', () => { ipcRenderer.send('forceReload') })
168 |
169 | }
170 |
171 | get themesPath() {
172 | const paths = [
173 | join(homedir(), "./.hyperbar/themes"),
174 | ];
175 |
176 | return paths;
177 | }
178 |
179 | }
180 |
181 | export default ThemeRepository
--------------------------------------------------------------------------------
/src/shared/widget.ts:
--------------------------------------------------------------------------------
1 | import { join } from 'path';
2 | import { homedir } from 'os';
3 | import { readdirSync, existsSync, readFileSync, lstatSync, unlinkSync, rmdirSync } from 'fs';
4 | import { Config } from './config';
5 | import chokidar from 'chokidar'
6 | import Zip from 'adm-zip';
7 | // import log from 'electron-log'
8 | import { ipcRenderer } from 'electron';
9 | import { Logger } from './logger';
10 |
11 | const logger = new Logger('WIDGET CONTROLLER')
12 | // log.transports.file.resolvePath = () => join(homedir(), '.hyperlogs/main.log');
13 |
14 | function rimraf(dir_path: string) {
15 | if (existsSync(dir_path)) {
16 | readdirSync(dir_path).forEach(function(entry) {
17 | var entry_path = join(dir_path, entry);
18 | if (lstatSync(entry_path).isDirectory()) {
19 | rimraf(entry_path);
20 | } else {
21 | unlinkSync(entry_path);
22 | }
23 | });
24 | rmdirSync(dir_path);
25 | }
26 | }
27 |
28 | export type WidgetInfo = {
29 | image?: string,
30 | name:string,
31 | author?:string,
32 | description:string,
33 | main?: string,
34 | renderer?: string,
35 | version: string,
36 | widgetPath?: string,
37 | repository?: string
38 | directory: string
39 | file: string
40 | }
41 | export interface WidgetObject extends WidgetInfo {
42 | default: () => void;
43 | styles?: string[];
44 | }
45 | class WidgetRepository {
46 | public loadedWidgets: WidgetObject[];
47 | private isRenderer: boolean;
48 |
49 | constructor() {
50 | this.loadedWidgets = [];
51 | this.isRenderer = false
52 | }
53 |
54 | getWidgetContext(widgetInfo: WidgetInfo) {
55 | if (!this.isRenderer) {
56 | const electron = require('electron')
57 | const directory = widgetInfo.file.split('\\widgets\\')
58 |
59 | return {
60 | config: new Config(),
61 | api: {
62 | show: electron.app.show,
63 | ipcMain: electron.ipcMain,
64 | browserWindow: electron.BrowserWindow,
65 | Menu: electron.Menu,
66 | shell: electron.shell,
67 | windows: require('../main').windows,
68 | directory: directory[directory.length -1].split('\\')[0],
69 | },
70 | logger: new Logger(`[MAIN] ${widgetInfo.name}`)
71 | }
72 | } else {
73 | const electron = require('electron')
74 |
75 | return {
76 | config: new Config(),
77 | api: {
78 | ipcRenderer: electron.ipcRenderer,
79 | },
80 | logger: new Logger(`[RENDER] ${widgetInfo.name}`)
81 | }
82 |
83 | }
84 | }
85 |
86 | requireWidget(widgetInfo: WidgetObject) {
87 | try {
88 | const widgetExecutor = require(widgetInfo.file) as WidgetObject;
89 | const directory = widgetInfo.file.split('\\widgets\\')
90 |
91 | widgetInfo.default = widgetExecutor.default.bind( this.getWidgetContext(widgetInfo), )
92 | widgetInfo.directory = directory[directory.length -1].split('\\')[0]
93 | widgetInfo.styles = widgetExecutor.styles
94 | this.loadedWidgets.push(widgetInfo);
95 | } catch (err) {
96 | logger.error(`Failed loading [${widgetInfo.file}] - ${err}`);
97 | }
98 | }
99 |
100 | loadWidget(widget: string, path: string) {
101 | const widgetPath = join(path, widget);
102 | const widgetPathPackageJson = join(widgetPath, 'package.json');
103 |
104 | if (!existsSync(widgetPath)) {
105 | logger.warn(`Path [${widgetPath}] is invalid`);
106 | return;
107 | }
108 |
109 | if (!existsSync(widgetPathPackageJson)) {
110 | logger.warn(`Failed to load [${widgetPath}]\n > ${widgetPathPackageJson} does not exist`);
111 | return;
112 | }
113 |
114 | const stats = lstatSync(path)
115 |
116 | if (stats && !stats.isDirectory()) {
117 | logger.warn(`Detected invalid file in widgets path.\n - You forgot to extract the widget?\n - Widget files must be on their own folder, not directly on widgets directory.\n - This file will not be loaded.`)
118 | }
119 |
120 | let widgetInfo = JSON.parse( readFileSync(widgetPathPackageJson).toString() );
121 |
122 | widgetInfo = Object.assign(widgetInfo, {
123 | widgetPath,
124 | file: join(widgetPath, this.isRenderer ? widgetInfo.renderer : widgetInfo.main)
125 | })
126 |
127 | if (widgetInfo.hypersettings && widgetInfo.hypersettings.fields && Object.keys(widgetInfo.hypersettings.fields).length > 0) {
128 | const config = new Config()
129 | if (!config.get('widgets')) {
130 | config.insert('widgets', {
131 | name: "Widgets",
132 | items: {}
133 | })
134 | }
135 |
136 | if (!config.getEntry('widgets', widgetInfo.hypersettings.name)) {
137 | config.addEntry('widgets', {
138 | name: widgetInfo.hypersettings.name,
139 | description: widgetInfo.hypersettings.description,
140 | icon: widgetInfo.hypersettings.icon,
141 | fields: widgetInfo.hypersettings.fields
142 | })
143 |
144 | config.save()
145 | }
146 | }
147 |
148 | this.requireWidget(widgetInfo);
149 | }
150 |
151 |
152 | loadWidgetsInPaths() {
153 | this.isRenderer = process && process.type === 'renderer'
154 | // TODO: Detect first run
155 | // TODO: Load default widgets from hyper repository
156 |
157 | this.widgetPaths.forEach(path => {
158 | const widgets = readdirSync(path);
159 |
160 | widgets.forEach(widget => {
161 | this.loadWidget(widget, path);
162 | })
163 | });
164 | }
165 |
166 | get widgetPaths() {
167 | const paths = [
168 | join(homedir(), "./.hyperbar/widgets"),
169 | ];
170 |
171 | return paths;
172 | }
173 |
174 | installWidget(path: string, callback?: (installedWidget: WidgetInfo) => void ) {
175 | if (!existsSync(path)) { logger.error(`Tried to install invalid widget file - Corrupted or missing :: ${path}`); return false; }
176 | if (!path.endsWith('.zip')) { logger.error(`This file is not a compressed folder - Skipping :: ${path}`); return false; }
177 |
178 | const zipFile = new Zip(path)
179 | let widgetData: string = ""
180 |
181 | if (zipFile.getEntries().length <= 0) { logger.error(`Empty or corrupt zip file :: ${path}`); return false; }
182 |
183 | zipFile.getEntries().forEach(function (zipEntry: any) { // TODO: Declaration files for adm-zip
184 | if (zipEntry.entryName.endsWith("package.json")) {
185 | widgetData = zipFile.readAsText(zipEntry)
186 | }
187 | });
188 |
189 | if (widgetData === "") { logger.error(`Tried to install non widget zip :: ${path}`); return false; }
190 |
191 | zipFile.extractAllTo(this.widgetPaths[0], true)
192 |
193 | logger.debug(`Installed widget - ${JSON.parse(widgetData).name}`)
194 |
195 | if (this.isRenderer) {
196 | this.loadWidgetsInPaths()
197 | this.watchWidgets()
198 | this.loadStyles()
199 | ipcRenderer.send('forceReload')
200 | } else {
201 | this.loadWidgetsInPaths()
202 | this.watchWidgets()
203 | this.loadedWidgets.forEach( widget =>{
204 | widget.default()
205 | })
206 | }
207 |
208 | callback?.(JSON.parse(widgetData))
209 |
210 | return JSON.parse(widgetData)
211 | }
212 |
213 | uninstallWidget(widget: WidgetObject, callback?: () => void) {
214 | const directory = widget.file.split('\\widgets\\')
215 | const widgetPath = join(homedir(), '.hyperbar', 'widgets', directory[directory.length -1].split('\\')[0])
216 | const widgetPathPackageJson = join(widgetPath, 'package.json');
217 | if (!existsSync(widgetPath)) {
218 | logger.error(`Path [${widgetPath}] is invalid`);
219 | return;
220 | }
221 |
222 | if (!existsSync(widgetPathPackageJson)) {
223 | logger.error(`Failed to remove [${widgetPath}]\n > ${widgetPathPackageJson} does not exist`);
224 | return;
225 | }
226 |
227 | const stats = lstatSync(widgetPath)
228 |
229 | if (stats && !stats.isDirectory()) {
230 | logger.warn(`Detected invalid file in widgets path.\n - You forgot to extract the widget?\n - Widget files must be on their own folder, not directly on widgets directory.\n - This file will not be loaded.`)
231 | }
232 |
233 | let widgetInfo = JSON.parse( readFileSync(widgetPathPackageJson).toString() );
234 |
235 | const config = new Config()
236 |
237 | const entryName = widgetInfo.hypersettings.name.toLowerCase().split(' ').join('_')
238 |
239 | if (config.getEntry('widgets', entryName)) {
240 | delete config.data.widgets.items[entryName]
241 | if (config.data.widgets.items.length <= 0) {
242 | delete config.data.widgets
243 | }
244 | config.save()
245 | }
246 |
247 | rimraf(widgetPath)
248 | callback?.()
249 | }
250 |
251 | watchWidgets() {
252 | const config = new Config()
253 | const watchWidgets = config.getValue('general', 'misc', 'watch-widgets')
254 | if (!watchWidgets) { return }
255 |
256 | const watchList: string[] = []
257 | this.loadedWidgets.forEach( widget => {
258 | watchList.push(widget.file)
259 | if (widget.styles) {
260 | widget.styles.forEach( style =>{
261 | logger.success(`Watching style: ${widget.name}/${style}`)
262 | const directory = widget.file.split('\\widgets\\')
263 | watchList.push(`${join(homedir(), "./.hyperbar/widgets", directory[directory.length -1].split('\\')[0], style)}`)
264 | })
265 | }
266 | })
267 |
268 | const watcher = chokidar.watch(watchList)
269 | logger.info("Total widget entries being watched:", watchList.length )
270 |
271 | const electron = require('electron');
272 |
273 | watcher.on('change', () =>{
274 |
275 | if(this.isRenderer) {
276 | electron.ipcRenderer.send('forceReload')
277 | } else {
278 | electron.app.relaunch()
279 | electron.app.exit()
280 | }
281 | })
282 | }
283 |
284 | loadStyles() {
285 | this.loadedWidgets.map( widget =>{
286 | widget.styles?.forEach( style => {
287 | const head = document.querySelector('head')
288 | if (head) { head.innerHTML += ` 
5 | 
37 |