Move backgrounds to static, get dynamic backgrounds to work.

TODO: Add loading spinner and make background load ease in.
This commit is contained in:
Daniel Scalzi 2020-05-25 17:13:59 -04:00
parent 7ef375db7a
commit 18fbfe4289
No known key found for this signature in database
GPG Key ID: D18EA3FB4B142A57
16 changed files with 36 additions and 24 deletions

View File

@ -6,7 +6,6 @@
], ],
"extends": [ "extends": [
"eslint:recommended", "eslint:recommended",
"plugin:@typescript-eslint/eslint-recommended",
"plugin:@typescript-eslint/recommended", "plugin:@typescript-eslint/recommended",
"plugin:react/recommended" "plugin:react/recommended"
], ],

32
package-lock.json generated
View File

@ -1892,12 +1892,12 @@
"dev": true "dev": true
}, },
"@typescript-eslint/eslint-plugin": { "@typescript-eslint/eslint-plugin": {
"version": "3.0.0", "version": "3.0.1",
"resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-3.0.0.tgz", "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-3.0.1.tgz",
"integrity": "sha512-lcZ0M6jD4cqGccYOERKdMtg+VWpoq3NSnWVxpc/AwAy0zhkUYVioOUZmfNqiNH8/eBNGhCn6HXd6mKIGRgNc1Q==", "integrity": "sha512-RxGldRQD3hgOK2xtBfNfA5MMV3rn5gVChe+MIf14hKm51jO2urqF64xOyVrGtzThkrd4rS1Kihqx2nkSxkXHvA==",
"dev": true, "dev": true,
"requires": { "requires": {
"@typescript-eslint/experimental-utils": "3.0.0", "@typescript-eslint/experimental-utils": "3.0.1",
"functional-red-black-tree": "^1.0.1", "functional-red-black-tree": "^1.0.1",
"regexpp": "^3.0.0", "regexpp": "^3.0.0",
"semver": "^7.3.2", "semver": "^7.3.2",
@ -1905,33 +1905,33 @@
} }
}, },
"@typescript-eslint/experimental-utils": { "@typescript-eslint/experimental-utils": {
"version": "3.0.0", "version": "3.0.1",
"resolved": "https://registry.npmjs.org/@typescript-eslint/experimental-utils/-/experimental-utils-3.0.0.tgz", "resolved": "https://registry.npmjs.org/@typescript-eslint/experimental-utils/-/experimental-utils-3.0.1.tgz",
"integrity": "sha512-BN0vmr9N79M9s2ctITtChRuP1+Dls0x/wlg0RXW1yQ7WJKPurg6X3Xirv61J2sjPif4F8SLsFMs5Nzte0WYoTQ==", "integrity": "sha512-GdwOVz80MOWxbc/br1DC30eeqlxfpVzexHgHtf3L0hcbOu1xAs1wSCNcaBTLMOMZbh1gj/cKZt0eB207FxWfFA==",
"dev": true, "dev": true,
"requires": { "requires": {
"@types/json-schema": "^7.0.3", "@types/json-schema": "^7.0.3",
"@typescript-eslint/typescript-estree": "3.0.0", "@typescript-eslint/typescript-estree": "3.0.1",
"eslint-scope": "^5.0.0", "eslint-scope": "^5.0.0",
"eslint-utils": "^2.0.0" "eslint-utils": "^2.0.0"
} }
}, },
"@typescript-eslint/parser": { "@typescript-eslint/parser": {
"version": "3.0.0", "version": "3.0.1",
"resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-3.0.0.tgz", "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-3.0.1.tgz",
"integrity": "sha512-8RRCA9KLxoFNO0mQlrLZA0reGPd/MsobxZS/yPFj+0/XgMdS8+mO8mF3BDj2ZYQj03rkayhSJtF1HAohQ3iylw==", "integrity": "sha512-Pn2tDmOc4Ri93VQnT70W0pqQr6i/pEZqIPXfWXm4RuiIprL0t6SG13ViVXHgfScknL2Fm2G4IqXhUzxSRCWXCw==",
"dev": true, "dev": true,
"requires": { "requires": {
"@types/eslint-visitor-keys": "^1.0.0", "@types/eslint-visitor-keys": "^1.0.0",
"@typescript-eslint/experimental-utils": "3.0.0", "@typescript-eslint/experimental-utils": "3.0.1",
"@typescript-eslint/typescript-estree": "3.0.0", "@typescript-eslint/typescript-estree": "3.0.1",
"eslint-visitor-keys": "^1.1.0" "eslint-visitor-keys": "^1.1.0"
} }
}, },
"@typescript-eslint/typescript-estree": { "@typescript-eslint/typescript-estree": {
"version": "3.0.0", "version": "3.0.1",
"resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-3.0.0.tgz", "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-3.0.1.tgz",
"integrity": "sha512-nevQvHyNghsfLrrByzVIH4ZG3NROgJ8LZlfh3ddwPPH4CH7W4GAiSx5qu+xHuX5pWsq6q/eqMc1io840ZhAnUg==", "integrity": "sha512-FrbMdgVCeIGHKaP9OYTttFTlF8Ds7AkjMca2GzYCE7pVch10PAJc1mmAFt+DfQPgu/2TrLAprg2vI0PK/WTdcg==",
"dev": true, "dev": true,
"requires": { "requires": {
"debug": "^4.1.1", "debug": "^4.1.1",

View File

@ -62,8 +62,8 @@
"@types/tar-fs": "^2.0.0", "@types/tar-fs": "^2.0.0",
"@types/triple-beam": "^1.3.1", "@types/triple-beam": "^1.3.1",
"@types/winreg": "^1.2.30", "@types/winreg": "^1.2.30",
"@typescript-eslint/eslint-plugin": "^3.0.0", "@typescript-eslint/eslint-plugin": "^3.0.1",
"@typescript-eslint/parser": "^3.0.0", "@typescript-eslint/parser": "^3.0.1",
"chai": "^4.2.0", "chai": "^4.2.0",
"cross-env": "^7.0.2", "cross-env": "^7.0.2",
"electron": "^8.3.0", "electron": "^8.3.0",

View File

@ -175,6 +175,7 @@ export class ConfigManager {
* @param {Object} destObj The destination object. * @param {Object} destObj The destination object.
* @returns {Object} A validated destination object. * @returns {Object} A validated destination object.
*/ */
// eslint-disable-next-line @typescript-eslint/no-explicit-any
private static validateKeySet(srcObj: any, destObj: any){ private static validateKeySet(srcObj: any, destObj: any){
if(srcObj == null){ if(srcObj == null){
srcObj = {} srcObj = {}

View File

@ -1,12 +1,12 @@
import { ipcMain, app, BrowserWindow, Menu, MenuItem } from 'electron' import { ipcMain, app, BrowserWindow, Menu, MenuItem } from 'electron'
import { prerelease } from 'semver' import { prerelease } from 'semver'
import { join } from 'path' import { join } from 'path'
import { readdirSync } from 'fs-extra'
import { format } from 'url' import { format } from 'url'
import { autoUpdater } from 'electron-updater' import { autoUpdater } from 'electron-updater'
import isdev from '../common/util/isdev' import isdev from '../common/util/isdev'
const installExtensions = async () => { const installExtensions = async () => {
// eslint-disable-next-line @typescript-eslint/no-var-requires
const installer = require('electron-devtools-installer') const installer = require('electron-devtools-installer')
const forceDownload = !!process.env.UPGRADE_EXTENSIONS const forceDownload = !!process.env.UPGRADE_EXTENSIONS
const extensions = ['REACT_DEVELOPER_TOOLS', 'REDUX_DEVTOOLS'] const extensions = ['REACT_DEVELOPER_TOOLS', 'REDUX_DEVTOOLS']
@ -116,8 +116,6 @@ async function createWindow() {
backgroundColor: '#171614' backgroundColor: '#171614'
}) })
// ejse.data('bkid', Math.floor((Math.random() * readdirSync(join(__dirname, '..', 'assets', 'images', 'backgrounds')).length)))
if (isdev) { if (isdev) {
win.loadURL(`http://localhost:${process.env.ELECTRON_WEBPACK_WDS_PORT}`) win.loadURL(`http://localhost:${process.env.ELECTRON_WEBPACK_WDS_PORT}`)
} }

View File

@ -104,6 +104,7 @@ export default class Login extends React.Component<LoginProperties, LoginState>
event.preventDefault() event.preventDefault()
} }
// eslint-disable-next-line @typescript-eslint/no-unused-vars
handleLoginButtonClick = (event: React.MouseEvent<HTMLButtonElement, MouseEvent>): void => { handleLoginButtonClick = (event: React.MouseEvent<HTMLButtonElement, MouseEvent>): void => {
console.log(this.userRef.current!.getValue()) console.log(this.userRef.current!.getValue())
console.log(this.passRef.current!.getValue()) console.log(this.passRef.current!.getValue())

View File

@ -27,7 +27,7 @@
/* TODO: Temp for development */ /* TODO: Temp for development */
body { body {
background-image: url('../../assets/images/backgrounds/3.jpg'); /* background-image: url('../../static/images/backgrounds/3.jpg'); */
background-size: cover; background-size: cover;
} }

View File

@ -6,6 +6,19 @@ import './index.css'
import Application from './components/Application' import Application from './components/Application'
import { Provider } from 'react-redux' import { Provider } from 'react-redux'
import { readdirSync } from 'fs-extra'
import { join } from 'path'
declare const __static: string
function setBackground(id: number) {
// eslint-disable-next-line @typescript-eslint/no-var-requires
const bk = require('../../static/images/backgrounds/' + id + '.jpg')
document.body.style.backgroundImage = `url('${bk.default}')`
}
const id = Math.floor((Math.random() * readdirSync(join(__static, 'images', 'backgrounds')).length))
setBackground(id)
// Create main element // Create main element
const mainElement = document.createElement('div') const mainElement = document.createElement('div')

View File

Before

Width:  |  Height:  |  Size: 160 KiB

After

Width:  |  Height:  |  Size: 160 KiB

View File

Before

Width:  |  Height:  |  Size: 181 KiB

After

Width:  |  Height:  |  Size: 181 KiB

View File

Before

Width:  |  Height:  |  Size: 502 KiB

After

Width:  |  Height:  |  Size: 502 KiB

View File

Before

Width:  |  Height:  |  Size: 1.0 MiB

After

Width:  |  Height:  |  Size: 1.0 MiB

View File

Before

Width:  |  Height:  |  Size: 268 KiB

After

Width:  |  Height:  |  Size: 268 KiB

View File

Before

Width:  |  Height:  |  Size: 456 KiB

After

Width:  |  Height:  |  Size: 456 KiB

View File

Before

Width:  |  Height:  |  Size: 2.6 MiB

After

Width:  |  Height:  |  Size: 2.6 MiB

View File

Before

Width:  |  Height:  |  Size: 5.0 MiB

After

Width:  |  Height:  |  Size: 5.0 MiB