This commit is contained in:
SpikeHD
2022-07-03 15:10:49 -07:00
parent 98f530eb0c
commit 0ec9ef92ee
18 changed files with 99 additions and 99 deletions

View File

@@ -38,7 +38,7 @@ export default class BigButton extends React.Component<IProps, IState> {
render() {
return (
<div className={'BigButton ' + (this.state.disabled ? 'disabled' : '')} onClick={this.handleClick} id={this.props.id}>
<div className="BigButtonText" id={'commonBigButtonContent'}>{this.props.children}</div>
<div className="BigButtonText" id="commonBigButtonContent">{this.props.children}</div>
</div>
)
}

View File

@@ -40,10 +40,10 @@ export default class Checkbox extends React.Component<IProps, IState> {
render() {
return (
<div className="Checkbox" id={'commonCheckboxContainer'}>
<div className="Checkbox" id="commonCheckboxContainer">
<input type='checkbox' id={this.props.id} checked={this.state.checked} onChange={this.handleChange} />
<label id={'commonCheckboxLabel'} htmlFor={this.props.id}>
<div className="CheckboxDisplay" id={'commonCheckboxDisplay'}>
<label id="commonCheckboxLabel" htmlFor={this.props.id}>
<div className="CheckboxDisplay" id="commonCheckboxDisplay">
{this.state.checked ? <img src={checkmark} alt='Checkmark' /> : null}
</div>
<span>{this.props.label || ''}</span>

View File

@@ -100,8 +100,8 @@ export default class DirInput extends React.Component<IProps, IState> {
}}
customClearBehaviour={this.props.customClearBehaviour}
/>
<div className="FileSelectIcon" id={'commonDirInputFileSelContainer'} onClick={this.handleIconClick}>
<img id={'commonDirInputFileSelIcon'} src={File} />
<div className="FileSelectIcon" id="commonDirInputFileSelContainer" onClick={this.handleIconClick}>
<img id="commonDirInputFileSelIcon" src={File} />
</div>
</div>
)

View File

@@ -21,12 +21,12 @@ export default class DownloadSection extends React.Component<IProps, never> {
render() {
return (
<div className="DownloadSection" id={'commonDownloadSectionContainer'}>
<div className="DownloadTitle" id={'commonDownloadSectionTitle'}>
<div className="DownloadPath" id={'commonDownloadSectionPath'}>{this.getFilenameFromPath()}</div>
<div className="DownloadStatus" id={'commonDownloadSectionSize'}> - {this.props.downloadManager.getDownloadSize(this.props.downloadName)}</div>
<div className="DownloadSection" id="commonDownloadSectionContainer">
<div className="DownloadTitle" id="commonDownloadSectionTitle">
<div className="DownloadPath" id="commonDownloadSectionPath">{this.getFilenameFromPath()}</div>
<div className="DownloadStatus" id="commonDownloadSectionSize"> - {this.props.downloadManager.getDownloadSize(this.props.downloadName)}</div>
</div>
<div className="DownloadSectionInner" id={'commonDownloadSectionProgress'}>
<div className="DownloadSectionInner" id="commonDownloadSectionProgress">
<ProgressBar path={this.props.downloadName} downloadManager={this.props.downloadManager} />
</div>
</div>

View File

@@ -36,12 +36,12 @@ export default class HelpButton extends React.Component<IProps, IState> {
render() {
return (
<div className="HelpSection" id={'commonHelpButtonContainer'}>
<div className="HelpButton" id={'commonHelpButtonClosed'} onMouseEnter={this.setOpen} onMouseLeave={this.setClosed}>
<img id={'commonHelpButtonIcon'} src={Help} />
<div className="HelpSection" id="commonHelpButtonContainer">
<div className="HelpButton" id="commonHelpButtonClosed" onMouseEnter={this.setOpen} onMouseLeave={this.setClosed}>
<img id="commonHelpButtonIcon" src={Help} />
</div>
<div className="HelpContents" id={'commonHelpButtonContainerOpen'} style={{
<div className="HelpContents" id="commonHelpButtonContainerOpen" style={{
display: this.state.opened ? 'block' : 'none'
}}>
<MiniDialog closeFn={this.setClosed}>

View File

@@ -49,9 +49,9 @@ export default class ProgressBar extends React.Component<IProps, IState> {
render() {
return (
<div className="MainProgressBarWrapper" id={'commonMainProgressContainer'}>
<div className="ProgressBar" id={'commonMainProgress'}>
<div className="InnerProgress" id={'commonMainProgressInner'} style={{
<div className="MainProgressBarWrapper" id="commonMainProgressContainer">
<div className="ProgressBar" id="commonMainProgress">
<div className="InnerProgress" id="commonMainProgressInner" style={{
width: `${(() => {
// Handles no files downloading
if (this.state.files === 0) {
@@ -67,7 +67,7 @@ export default class ProgressBar extends React.Component<IProps, IState> {
}}></div>
</div>
<div className="MainProgressText" id={'commonMainProgressText'}>
<div className="MainProgressText" id="commonMainProgressText">
<Tr text="main.files_downloading" /> {this.state.files} ({this.state.speed})
<br />
<Tr text="main.files_extracting" /> {this.state.extracting}

View File

@@ -53,12 +53,12 @@ export default class ProgressBar extends React.Component<IProps, IState> {
render() {
return (
<div className="ProgressBarWrapper" id={'commonProgressBarContainer'}>
<div className="ProgressBarWrapper" id="commonProgressBarContainer">
<div style={{
width: '80%'
}}>
<div className="ProgressBar" id={'commonProgressBar'}>
<div className="InnerProgress" id={'commonProgressBarContent'} style={{
<div className="ProgressBar" id="commonProgressBar">
<div className="InnerProgress" id="commonProgressBarContent" style={{
width: `${(() => {
// Handles files with content-lengths of 0
if (this.state.status === 'finished') {
@@ -73,14 +73,14 @@ export default class ProgressBar extends React.Component<IProps, IState> {
})()}%`,
}}></div>
</div>
<div className="DownloadControls" id={'commonProgressbarDownContrContainer'}>
<div onClick={this.stopDownload} id={'commonProgressBarDownStopContainer'} className="downloadStop">
<img id={'commonProgressBarDownStopIcon'} src={Stop}></img>
<div className="DownloadControls" id="commonProgressbarDownContrContainer">
<div onClick={this.stopDownload} id="commonProgressBarDownStopContainer" className="downloadStop">
<img id="commonProgressBarDownStopIcon" src={Stop}></img>
</div>
</div>
</div>
<div className="ProgressText" id={'commonProgressBarText'}>
<div className="ProgressText" id="commonProgressBarText">
{capitalize(this.state.status) || 'Waiting'}
</div>
</div>

View File

@@ -44,14 +44,14 @@ export default class TextInput extends React.Component<IProps, IState> {
render() {
return (
<div className="TextInputWrapper" id={'commonTextInputContainer'} style={this.props.style || {}}>
<div className="TextInputWrapper" id="commonTextInputContainer" style={this.props.style || {}}>
<input id={this.props?.id} readOnly={this.props.readOnly || false} placeholder={this.props.placeholder || ''} className="TextInput" value={this.state.value} onChange={(e) => {
this.setState({ value: e.target.value })
if (this.props.onChange) this.props.onChange(e.target.value)
}} />
{
this.props.clearable ?
<div className="TextClear" id={'commonTextInputClearableContainer'} onClick={() => {
<div className="TextClear" id="commonTextInputClearableContainer" onClick={() => {
// Run custom behaviour first
if (this.props.customClearBehaviour) return this.props.customClearBehaviour()
@@ -61,7 +61,7 @@ export default class TextInput extends React.Component<IProps, IState> {
this.forceUpdate()
}}>
<img src={Close} className="TextInputClear" id={'commonTextInputClearableIcon'} />
<img src={Close} className="TextInputClear" id="commonTextInputClearableIcon" />
</div> : null
}
</div>