diff --git a/src/App.js b/src/App.js index 5f5582b..73be628 100644 --- a/src/App.js +++ b/src/App.js @@ -12,7 +12,7 @@ import Modal from './components/UI/Modal/Modal'; import DownloadProgress from './components/DownloadProgress/DownloadProgress'; import UpgradeUI from './components/UpgradeUI/UpgradeUI'; import UpgradeIcon from './components/UpgradeIcon/UpgradeIcon'; - +import Loading from './components/UI/Loading/Loading'; const Scheduler = require('node-schedule'); let ipcRenderer = null; @@ -62,12 +62,21 @@ class App extends Component { const locationsLookup = { ...response.data.Locations[this.state.Platform], }; + + const latestVersion = this.state.VersionLookup[this.state.ReleaseTypes[this.state.Release]].length - 1; + let version = this.state.Version; + if (version === -1) { + version = latestVersion; + } + this.setState({ AllowOptions: true, LocationsLookup: locationsLookup, + Version: version, + VersionAvailable: version !== latestVersion, VersionLookup: versionLookup, }); - this.checkVersionInstalled(this.state.Release, this.state.Version, versionLookup); + this.checkVersionInstalled(this.state.Release, version, versionLookup); }).catch(error => { console.log(error); }); @@ -212,6 +221,7 @@ class App extends Component { }, LocationsLookup: {}, MissingDependencies: [], + MountsBusy: false, Platform: 'unknown', Release: 3, ReleaseTypes: [ @@ -228,7 +238,8 @@ class App extends Component { UpgradeAvailable: false, UpgradeData: {}, UpgradeDismissed: false, - Version: 0, + Version: -1, + VersionAvailable: false, VersionLookup: { Alpha: [ 'unavailable' @@ -341,12 +352,13 @@ class App extends Component { handleReleaseChanged = (e) => { const val = parseInt(e.target.value, 10); + const versionIndex = this.state.VersionLookup[this.state.ReleaseTypes[this.state.Release]].length - 1; this.setState({ Release: val, - Version: 0 + Version: versionIndex }); - this.saveState(val, 0, this.state.Sia, this.state.Hyperspace); - this.checkVersionInstalled(val, 0); + this.saveState(val, versionIndex, this.state.Sia, this.state.Hyperspace); + this.checkVersionInstalled(val, versionIndex); }; handleReleaseDownload = () => { @@ -397,6 +409,10 @@ class App extends Component { notifyAutoMountProcessed = () => { this.setState({AutoMountChecked: true}); }; + + notifyMountsBusy = (busy) => { + this.setState({MountsBusy: busy}) + }; saveState = (release, version, sia, hyperspace)=> { if (ipcRenderer) { @@ -421,8 +437,11 @@ class App extends Component { }; render() { - const selectedVersion = this.state.VersionLookup[this.state.ReleaseTypes[this.state.Release]][this.state.Version]; + const selectedVersion = (this.state.Version === -1) ? + 'unavailable' : + this.state.VersionLookup[this.state.ReleaseTypes[this.state.Release]][this.state.Version]; const downloadEnabled = this.state.AllowDownload && + !this.state.MountsBusy && !this.state.DownloadActive && (((selectedVersion !== 'unavailable') && (selectedVersion !== this.state.RepertoryVersion))); const allowMount = this.state.RepertoryVersion !== 'none'; @@ -437,6 +456,7 @@ class App extends Component { processAutoMount={!this.state.AutoMountChecked} autoMountProcessed={this.notifyAutoMountProcessed} autoMountChanged={this.handleAutoMountChanged} + mountsBusy={this.notifyMountsBusy} version={this.state.RepertoryVersion} directory={Constants.DATA_LOCATIONS[this.state.Platform]} disabled={!allowMount}/>; @@ -484,51 +504,53 @@ class App extends Component { ); } - let options = null; + let mainContent = null; if (this.state.AllowOptions) { - options = ( + mainContent = ( - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + +
-

Release

-
-

Version

-
-

Installed

-
- - - - - {this.state.RepertoryVersion} -
- {releaseDisplay} -
- {mountDisplay} -
+

Release

+
+

Version

+
+

Installed

+
+ + + + + {this.state.RepertoryVersion} +
+ {releaseDisplay} +
+ {mountDisplay} +
); + } else { + mainContent = } return ( @@ -536,7 +558,7 @@ class App extends Component { {dependencyDisplay} {upgradeDisplay} {downloadDisplay} - + @@ -553,8 +575,8 @@ class App extends Component {
- - {options} + + {mainContent} ); diff --git a/src/assets/images/release_available.png b/src/assets/images/release_available.png new file mode 100644 index 0000000..07e4493 Binary files /dev/null and b/src/assets/images/release_available.png differ diff --git a/src/assets/images/upgrade_available.png b/src/assets/images/upgrade_available.png deleted file mode 100644 index dbd19d0..0000000 Binary files a/src/assets/images/upgrade_available.png and /dev/null differ diff --git a/src/components/UI/Loading/Loading.css b/src/components/UI/Loading/Loading.css new file mode 100644 index 0000000..eace39c --- /dev/null +++ b/src/components/UI/Loading/Loading.css @@ -0,0 +1,16 @@ +.Loading { + margin: 0; + padding: 0; + height: 100%; + width: 100%; +} + +.Content { + margin: 0; + padding: 0; + position: relative; + top: 50%; left: 50%; + transform: translate(-50%,-50%); + width: 28px; + height: 28px; +} \ No newline at end of file diff --git a/src/components/UI/Loading/Loading.js b/src/components/UI/Loading/Loading.js new file mode 100644 index 0000000..ef08431 --- /dev/null +++ b/src/components/UI/Loading/Loading.js @@ -0,0 +1,17 @@ +import React from 'react'; +import CSSModules from 'react-css-modules'; +import styles from './Loading.css' +import Loader from 'react-loader-spinner'; + +export default CSSModules((props) => { + return ( +
+
+ +
+
); +}, styles, {allowMultiple: true}); \ No newline at end of file diff --git a/src/components/UpgradeIcon/UpgradeIcon.css b/src/components/UpgradeIcon/UpgradeIcon.css index cf9e26c..4225165 100644 --- a/src/components/UpgradeIcon/UpgradeIcon.css +++ b/src/components/UpgradeIcon/UpgradeIcon.css @@ -7,8 +7,5 @@ border: 0; box-sizing: border-box; cursor: pointer; -} - -div.UpgradeIcon { - cursor: default; + opacity: 0.65; } \ No newline at end of file diff --git a/src/components/UpgradeIcon/UpgradeIcon.js b/src/components/UpgradeIcon/UpgradeIcon.js index 11a7fcb..11d5ee2 100644 --- a/src/components/UpgradeIcon/UpgradeIcon.js +++ b/src/components/UpgradeIcon/UpgradeIcon.js @@ -1,10 +1,15 @@ import React from 'react'; import CSSModules from 'react-css-modules'; import styles from './UpgradeIcon.css'; -import availableImage from '../../assets/images/upgrade_available.png'; +import availableImage from '../../assets/images/release_available.png'; export default CSSModules((props) => { + let style; + if (props.release) { + style = {float: 'right', marginRight: '5%', cursor: 'default'}; + } + return props.available ? - : -
; + : + null; }, styles, {allowMultiple: true}); \ No newline at end of file diff --git a/src/containers/MountItems/MountItems.js b/src/containers/MountItems/MountItems.js index d37e624..d0ce06d 100644 --- a/src/containers/MountItems/MountItems.js +++ b/src/containers/MountItems/MountItems.js @@ -35,6 +35,8 @@ class MountItems extends Component { Sia: sia, }); + this.props.mountsBusy(hs.Mounted || sia.Mounted); + let hsLocation = arg.data.Locations.Hyperspace; if ((hsLocation.length === 0) && (this.props.platform === 'win32')) { hsLocation = this.props.hyperspace.MountLocation || arg.data.DriveLetters.Hyperspace[0]; @@ -92,6 +94,7 @@ class MountItems extends Component { }; detectMounts = ()=> { + this.props.mountsBusy(true); ipcRenderer.send('detect_mounts', { Directory: this.props.directory, Version: this.props.version, @@ -117,6 +120,8 @@ class MountItems extends Component { [storageType]: state, }); + this.props.mountsBusy(true); + if (mount) { ipcRenderer.send('mount_drive', { Directory: this.props.directory,