diff --git a/.eslintrc.json b/.eslintrc.json index a30a47c..b2093c6 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -3,7 +3,8 @@ "node": true, "browser": true, "es2021": true, - "jest": true + "jest": true, + "webextensions": true }, "extends": [ "eslint:recommended", diff --git a/package.json b/package.json index 390bb98..cbcb5e9 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@dynamods/splash-screen", - "version": "0.3.1", + "version": "1.0.0", "description": "Splash Screen maintained by Dynamo Team@Autodesk", "author": "Autodesk Inc.", "license": "MIT", diff --git a/src/App.css b/src/App.css index ca0ac23..7db7ea1 100644 --- a/src/App.css +++ b/src/App.css @@ -17,6 +17,37 @@ } .screenBackground { - height: 377px; - width: 320px; + height: 452px; + width: 404px; +} + +.close { + position: absolute; + cursor: pointer; + right: 32px; + top: 15px; + width: 32px; + height: 32px; + opacity: 0.3; +} + +.close:hover { + opacity: 1; +} + +.close:before, .close:after { + position: absolute; + left: 25px; + content: ' '; + height: 33px; + width: 2px; + background-color: #333; +} + +.close:before { + transform: rotate(45deg); +} + +.close:after { + transform: rotate(-45deg); } \ No newline at end of file diff --git a/src/App.js b/src/App.js index 7c0980d..a3359d2 100644 --- a/src/App.js +++ b/src/App.js @@ -36,7 +36,7 @@ class App extends React.Component { render() { return ( - + @@ -56,20 +56,21 @@ class App extends React.Component { { - this.state.loadingDone ? - : + this.state.loadingDone ? + : } + @@ -91,7 +92,7 @@ class App extends React.Component { setSignInStatus(val) { this.setState({ signInTitle: val.signInTitle, - signInStatus: val.signInStatus === "True", + signInStatus: val.signInStatus === 'True', }); } @@ -100,7 +101,12 @@ class App extends React.Component { this.setState({ loadingDone: true }); + }; + + closeDynamo(){ + if (chrome.webview !== undefined) { + chrome.webview.hostObjects.scriptObject.CloseWindow(); + } } } - export default App; diff --git a/src/Dynamic.css b/src/Dynamic.css index acb278f..fb29dc0 100644 --- a/src/Dynamic.css +++ b/src/Dynamic.css @@ -48,4 +48,9 @@ .loadingTimeFooter { font-size: 9px; +} + +.loadingDescription{ + height: 3.6em; + line-height: 1.8em; } \ No newline at end of file diff --git a/src/Dynamic.js b/src/Dynamic.js index 244c33c..ffeaac2 100644 --- a/src/Dynamic.js +++ b/src/Dynamic.js @@ -27,7 +27,7 @@ class Dynamic extends React.Component {
-
+
{this.state.loadDescription}

diff --git a/src/Static.css b/src/Static.css index 1fda4a4..10fbbc6 100644 --- a/src/Static.css +++ b/src/Static.css @@ -17,18 +17,36 @@ height: 24px; } -.disableButton{ +.primaryButton:hover { + box-shadow: 0px 0px 2px rgba(255, 255, 255, 0.85); +} + +.primaryButton:active { + box-shadow: 0px 0px 2px rgba(56, 171, 223, 0.65); +} + +.disableButton { background-color: #6e6e6e; } .secondaryButton { color: white; border-radius: 2px; - border: 2px solid #0696D7; - box-shadow: none; background-color: #0696D7; - padding: 1px 0px !important; + border: 2px solid #0696D7; font-size: 12px; + height: 26px; + line-height: normal; + position: relative; + z-index: 10 +} + +.secondaryButton:hover { + box-shadow: 0px 0px 2px rgba(128, 128, 128, 0.85); +} + +.secondaryButton:active { + box-shadow: 0px 0px 4px rgba(128, 128, 128, 0.75); } .buttonLabel { @@ -64,6 +82,10 @@ input[type="file"] { --bs-tooltip-bg: white !important; } -.tooltip{ +.tooltip { --bs-tooltip-border-radius: 2px !important; +} + +.loadingTimeFooter { + font-size: 9px; } \ No newline at end of file diff --git a/src/Static.js b/src/Static.js index 040a1c5..222f1a3 100644 --- a/src/Static.js +++ b/src/Static.js @@ -9,8 +9,6 @@ import { warningIcon, checkMarkIcon } from './encodedImages'; import './Static.css'; -/*global chrome*/ - const importStatusEnum = { none: 1, error: 2, @@ -28,11 +26,18 @@ class Static extends React.Component { errorDescription: 'Something went wrong when importing your custom setting file. Please try again or proceed with default settings.', signInTitle: this.props.signInTitle, signInStatus: this.props.signInStatus, - importSettingsTitle: this.props.importSettingsTitle, + loadingTime: 'Total loading time: ', + importSettingsTitle: this.props.importSettingsTitle }; window.setImportStatus = this.setImportStatus.bind(this); + window.setTotalLoadingTime = this.setTotalLoadingTime.bind(this); + } + + componentDidMount() { + document.addEventListener('keydown', this.handleKeyDown); } + render() { return ( @@ -43,7 +48,7 @@ class Static extends React.Component { - @@ -62,7 +67,9 @@ class Static extends React.Component { this.readFile(e)} /> + accept='.xml' + onChange={(e) => this.readFile(e)} + />
+ +
+ {this.state.loadingTime} +
+
); } @@ -103,29 +115,29 @@ class Static extends React.Component { var ret = await chrome.webview.hostObjects.scriptObject.SignOut(); this.setState({ signInStatus: !ret, - signInTitle: "Sign In" - }) + signInTitle: 'Sign In' + }); } else { - var btn = document.getElementById("btnSignIn"); + var btn = document.getElementById('btnSignIn'); btn.classList.add('disableButton'); btn.disabled = true; - this.setState({ signInTitle: "Signing In" }) - var ret = await chrome.webview.hostObjects.scriptObject.SignIn(); - this.setState({ signInStatus: ret }); + this.setState({ signInTitle: 'Signing In' }); + var status = await chrome.webview.hostObjects.scriptObject.SignIn(); + this.setState({ signInStatus: status }); btn.classList.remove('disableButton'); btn.disabled = false; if (ret) { - this.setState({ signInTitle: "Sign Out" }) + this.setState({ signInTitle: 'Sign Out' }); } else { - this.setState({ signInTitle: "Sign In" }) + this.setState({ signInTitle: 'Sign In' }); } } } - } + }; //This method calls another method from Dynamo to actually launch it launchDynamo() { @@ -159,10 +171,24 @@ class Static extends React.Component { }); } + + setTotalLoadingTime(loadingTime) { + this.setState({ + loadingTime: loadingTime + }); + } + //Every time the checkbox is clicked, this method is called handleChange() { checked = !checked; } + + handleKeyDown = (e) => { + if (e.key === 'Enter') { + document.removeEventListener('keydown', this.handleKeyDown); + this.launchDynamo(); + } + }; } Static.defaultProps = { @@ -175,7 +201,9 @@ Static.defaultProps = { Static.propTypes = { signInTitle: PropTypes.string, launchTitle: PropTypes.string, - showScreenAgainLabel: PropTypes.string + showScreenAgainLabel: PropTypes.string, + signInStatus: PropTypes.bool, + importSettingsTitle: PropTypes.string }; export default Static;