diff --git a/README.md b/README.md index bdaf76ad..86352506 100644 --- a/README.md +++ b/README.md @@ -2,11 +2,13 @@ [![Build Status](https://travis-ci.com/HSLdevcom/helmet-ui.svg?branch=master)](https://travis-ci.com/HSLdevcom/helmet-ui) -Desktop user interface for [Helmet 4.0 Model System](https://github.com/HSLdevcom/helmet-model-system) and [EMME - Multimodal Transport Planning Software](https://www.inrosoftware.com/en/products/emme/). +Desktop user interface for [Helmet 4 Model System](https://github.com/HSLdevcom/helmet-model-system) and +[EMME - Multimodal Transport Planning Software](https://www.inrosoftware.com/en/products/emme/). ## Development -This is an [Electron](https://electrojs.org) application written in JavaScript _([NodeJS API](https://nodejs.org/api/) and [Electron API](https://www.electronjs.org/docs/api) available within app)_, HTML and CSS. +This is an [Electron](https://electrojs.org) application written in JavaScript _([NodeJS API](https://nodejs.org/api/) +and [Electron API](https://www.electronjs.org/docs/api) available within app)_, HTML and CSS. ### Requirements @@ -19,14 +21,16 @@ On Mac and Linux, [Wine](https://www.winehq.org/) and [Mono](https://www.mono-pr ### Setup -Due to tight integration with EMME, the application is mainly targeted for Windows but can be developed on Mac and Linux as well. However, the final testing should always happen on Windows with Emme. +Due to tight integration with EMME, the application is mainly targeted for Windows but can be developed on Mac and Linux as well. +However, the final testing should always happen on Windows with Emme. ``` $ git clone $ npm install ``` -See [End-User Enviroment](#end-user-environment) for preparing the Windows environment for testing. EMME and EMME-Python versions can be set in [versions.js](src/versions.js), affecting the automatic resolving of Python binary. +See [End-User Enviroment](#end-user-environment) for preparing the Windows environment for testing. +EMME and EMME-Python versions can be set in [versions.js](src/versions.js), affecting the automatic resolving of Python binary. ### Running and building @@ -36,19 +40,25 @@ See also: [Electronforge.io](https://www.electronforge.io/) ### Version Control -[Git](https://git-scm.com/) is used as the primary tool for version control and `master` branch is the main development line, aka. bleeding edge. All changes should be made in dedicated feature/bugfix branches, followed by a [pull request](https://help.github.com/en/articles/creating-a-pull-request) and a peer-review. Then, after all checks have passed, the branch may be merged in `master`. +[Git](https://git-scm.com/) is used as the primary tool for version control and `master` branch is the main development line, aka. bleeding edge. +All changes should be made in dedicated feature/bugfix branches, followed by a [pull request](https://help.github.com/en/articles/creating-a-pull-request) and a peer-review. +Then, after all checks have passed, the branch may be merged in `master`. ### Continuous Integration -The application is built automatically by [Travis CI](https://travis-ci.org/HSLdevcom/helmet-ui.svg?branch=master) when changes are pushed in master branch or pull requests are opened. +The application is built automatically by [Travis CI](https://travis-ci.org/HSLdevcom/helmet-ui.svg?branch=master) +when changes are pushed in master branch or pull requests are opened. -[Releases](https://github.com/HSLdevcom/helmet-ui/releases) are deployed automatically when changes are pushed in the `release` branch, which should be updated with `master` only to make new releases. +[Releases](https://github.com/HSLdevcom/helmet-ui/releases) are deployed automatically when changes are pushed in the `release` branch, +which should be updated with `master` only to make new releases. ### Publishing Releases -The Electron Forge's [Github publisher](https://www.electronforge.io/config/publishers/github) is used to upload files and draft a new release, thus avoiding the need to upload and tag releases manually. +The Electron Forge's [Github publisher](https://www.electronforge.io/config/publishers/github) is used to upload files and draft a new release, +thus avoiding the need to upload and tag releases manually. -The resulting draft must be reviewed, edited and approved in Github to make it publically available to everyone. This allows testing the package and making final fixes to it before making it public. +The resulting draft must be reviewed, edited and approved in Github to make it publically available to everyone. +This allows testing the package and making final fixes to it before making it public. 1. Test and bring all the desired changes in the `master` branch. 1. Remove if there's word `SNAPSHOT` in `version` field of [package.json](./package.json), and update version as per semver practises. @@ -74,63 +84,66 @@ _Notice: you cannot create drafts with an existing version number (i.e. release Before using Helmet UI, the following requirements must be met: - 1. [Emme 4.4.X](https://www.inrosoftware.com/en/products/emme/) is installed, with active license/dongle. + 1. [Emme 4.5.X](https://www.inrosoftware.com/en/products/emme/) is installed, with active license/dongle. 1. `%EMMEPATH%\programs` is set in user's `PATH` environment variable. - 1. _[optionally]_ [Helmet 4.0 Model System](https://github.com/HSLdevcom/helmet-model-system) is downloaded and set up _(or let UI download it)_ + 1. _[optionally]_ [Helmet 4 Model System](https://github.com/HSLdevcom/helmet-model-system) is downloaded and set up _(or let UI download it)_ The Helmet UI installer can be downloaded from [releases](https://github.com/HSLdevcom/helmet-ui/releases), where the exe packages is found under the **Assets** of each release. -:warning: **The release packages are not signed at the moment so Windows will complain about it and prevents the installer from running. This can be overridden in either of two ways:** +:warning: **The release packages are not downloaded by many so Windows will complain about it and prevents the installer from running. +This can be overridden in either of two ways:** - Simply by selecting "More info" ("Lisätiedot") and then clicking "Run anyway". (This option will probably work only if you have admin rights) - By right-clicking the downloaded .exe-file, selecting Properties and ticking the box "Unblock". ![Unblock](docs/unblock.png) -The application installs itself in the user's `%HOMEPATH%/AppData` folder. The app itself is located under `AppData\Local`, while settings are persisted in `AppData\Roaming`. The settings should survive as-is when updating to newer version, assuming the new version is backwards compatible with the old settings. +The application installs itself in the user's `%HOMEPATH%/AppData` folder. +The app itself is located under `AppData\Local`, while settings are persisted in `AppData\Roaming`. +The settings should survive as-is when updating to newer version, assuming the new version is backwards compatible with the old settings. -On first start, the application attempts to find Emme installation on the workstation and download the latest version of [Helmet 4.0 Model System](https://github.com/HSLdevcom/helmet-model-system) scripts. The application will also run `pip install`. The EMME Python path setup may fail if `EMMEPATH` environment variable is not set or the application is installed in an unusual way. If this is the case, you must set the location of Python executable manually in the setting dialog (Asetukset), along with the location of Scripts folder. +On first start, the application attempts to find Emme installation on the workstation and download the latest version of +[Helmet 4.0 Model System](https://github.com/HSLdevcom/helmet-model-system) scripts. +The application will also run `pip install`. +The EMME Python path setup may fail if `EMMEPATH` environment variable is not set or the application is installed in an unusual way. +If this is the case, you must set the location of Python executable manually in the setting dialog (Asetukset), along with the location of Scripts folder. ### Settings - Emme Python executable - This **must** be the `python.exe` shipped with Emme to meet some special dependencies. - - e.g. `C:\Program Files\INRO\Emme-4.4.2\Python27\python.exe` -- The `Scripts` folder of [Helmet 4.0 Model System](https://github.com/HSLdevcom/helmet-model-system) + - e.g. `C:\Program Files\INRO\Emme-4.5.0\Python37\python.exe` +- The `Scripts` folder of [Helmet 4 Model System](https://github.com/HSLdevcom/helmet-model-system) - This is the Python backend doing most of the work. - - This can be updated to a fresh/updated version by clicking "Lataa eri versio...". This will not overwrite your old (tweaked) scripts, it will always save the scripts in a new directory. + - This can be updated to a fresh/updated version by clicking "Lataa eri versio...". + This will not overwrite your old (tweaked) scripts, it will always save the scripts in a new directory. - It can also be set to an existing folder on your computer. - Project directory - This is where your model run specifications (.json) will be saved. - Base data directory - - This is where base demand matrices and base year (2016) data are located + - This is where base demand matrices and base year (2018) data are located - Result data directory - This is where you want your model run results to be saved ### Model run setup +**Need to update this!** For each HELMET scenario you want to run, you must also specify the following: 1. Scenario/run name -1. Emme project file (`.emp`) -1. The number of the Emme scenario where the bike network is located (usually 19), this scenario must be followed by the walk scenario and three time-dependent car and transit scenarios (aht, pt, iht). -1. Folder containing the input data. +2. Emme project file (`.emp`) +3. The number of the Emme scenario where the bike network is located (usually 19), + this scenario must be followed by the walk scenario and three time-dependent car and transit scenarios (aht, pt, iht). +4. Folder containing the input data. - e.g. `c:\Helmet\helmet-model-system\Scenario_input_data\2030` -1. Whether or not you have a pre-calculated transit cost matrix (located in the results folder for this scenario) -1. Number of iterations to be executed +5. Whether or not you have a pre-calculated transit cost matrix (located in the results folder for this scenario) +6. Number of iterations to be executed This is the download link that can be handed to users, along with an advice to download the latest version, i.e. the first one on the list. - https://github.com/HSLdevcom/helmet-ui/releases -The package to be downloaded is named `Helmet.4.0.UI-x.y.z.Setup.exe`, where the `x.y.z` corresponds to the application version. - -## TODO & Known Problems - -As of 2020-03-17: - -1. The application is not [signed](https://electronjs.org/docs/tutorial/code-signing), causing the anti-virus software and Windows to consider it suspicious. - - Fix: aqcuire a certificate and add it to the [build process](https://www.electronforge.io/config/makers/squirrel.windows) to enable signing +The package to be downloaded is named `Helmet.4.1.UI-x.y.z.Setup.exe`, where the `x.y.z` corresponds to the application version. ## Version history diff --git a/docs/kaytto-ohje.md b/docs/kaytto-ohje.md index 30cd354a..0d2ce202 100644 --- a/docs/kaytto-ohje.md +++ b/docs/kaytto-ohje.md @@ -77,7 +77,7 @@ Mallin ajoa varten tulee määritellä seuraavat asetukset. - Suorituskelpoinen Emme Python - Tämän **on oltava** Emmen mukana tullut ’python.exe’, jotta tietyt edellytykset täyttyvät. - - esim. `C:\Program Files\INRO\Emme\Emme 4\Emme-4.5.0\Python27\python.exe` + - esim. `C:\Program Files\INRO\Emme\Emme 4\Emme-4.5.0\Python37\python.exe` - GitHubin [Helmet 4.1 Model System](https://github.com/HSLdevcom/helmet-model-system)-sivuston kansio ’Scripts’ - Kansiossa ovat järjestelmän käyttämät Python-ohjelmat. - Version päivitys voidaan tehdä klikkaamalla "Lataa eri versio...". Nämä eivät korvaa skriptien vanhoja versioita, @@ -87,13 +87,15 @@ Mallin ajoa varten tulee määritellä seuraavat asetukset. - Tänne talletetaan Helmet-skenaarioiden (malliajojen) määrittelyt (.json) - Tämä **ei** siis viittaa Emmen projektitiedostoon (.emp) - Lähtödatan sisältävä kansio - - Tässä ovat omissa alakansioissaan pohjakysyntämatriisit ja nykytilanteen syöttötiedot (2016) + - Tässä ovat omissa alakansioissaan pohjakysyntämatriisit ja nykytilanteen syöttötiedot (2018) - Kansion sisällön saa HSL:ltä (ks. [lähtötietotiedostojen ohje](mallin_lahtotietotiedostot.md)) - Tulosten tallennuspolku - Tänne talletetaan ennusteajojen tulokset Näiden asetusten lisäksi on kehittäjille tarkoitettuja asetuksia helmet-model-system -kansion tiedostossa `dev-config.json`. Näihin ei ole tavalliselle käyttäjälle yleensä syytä koskea, mutta joissain tapauksissa hyödyllinen asetusmahdollisuus ei ole vielä implementoitu käyttöliittymään. +Lisää tietoja `dev-config.json`-tiedoston asetuksista löytyy +[tästä](https://github.com/HSLdevcom/helmet-model-system/tree/olusanya/Scripts#configuring-the-model-run-with-dev-configjson). ### Malliajon määrittely @@ -117,7 +119,7 @@ Jokaista ajettavaa HELMET-skenaariota kohden on tehtävä seuraavat määrittely 7. Valinta, poistetaanko sijoittelun strategiatiedostot malliajon jälkeen. 8. Valinta, tallennetaanko eri ajanjaksot erillisiin Emme-skenaarioihin. 9. Valinta, tallennetaanko mm. joukkoliikenteen matka-ajan osamatriisit (in-vehicle time, first - waiting time, jne.) talteen. Malliajoon ja hankearviointiin tarpeelliset matriisit tallennetaan + waiting time, jne.). Malliajoon ja hankearviointiin tarpeelliset matriisit tallennetaan aina .omx-muodossa riippumatta tästä valinnasta. - Mikäli halutaan useiden Helmet-skenaarioiden kaikki Emme-matriisit talteen samaan Emme-projektiin (.emx-tiedostoihin), voidaan lisäksi ennen jokaista malliajoa määrittää diff --git a/package.json b/package.json index 1ca3c4a2..ab8ece6a 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "helmet-ui", "productName": "Helmet 4.1", - "version": "4.1.0", + "version": "4.1.1", "description": "Helmet 4 Model System UI", "main": "src/main/index.js", "scripts": { diff --git a/src/main/index.js b/src/main/index.js index da5faf2d..486c3340 100644 --- a/src/main/index.js +++ b/src/main/index.js @@ -22,8 +22,8 @@ let mainWindow, entrypointWorkerWindow, cbaWorkerWindow, useMockAssignmentInstea async function createUI() { // Render main window including UI (index.html linking to all UI components) mainWindow = new BrowserWindow({ - width: 1200, - height: 800, + width: 1300, + height: 1200, resizable: false, maximizable: false, fullscreen: false, diff --git a/src/renderer/components/App.css b/src/renderer/components/App.css index d96b33d9..515a6a6b 100644 --- a/src/renderer/components/App.css +++ b/src/renderer/components/App.css @@ -8,22 +8,24 @@ body { padding: 0; position: relative; background: #ffffff; - font-size: 8pt; + font-size: 18px; font-family: gotham_rounded_medium, sans-serif; } button { + display: flex; + align-items: center; + justify-content: center; background-color: #ffffff; color: #007AC9; border: 1px solid #888888; - min-width: 120px; - height: 30px; - padding: 0 20px; - border-radius: 37px; - outline: none; - text-decoration: none; + height: 44px; + padding: 0 26px; + border-radius: 25px; font-family: inherit; font-size: inherit; + letter-spacing: -0.5px; + font-weight: 350; } button:hover { @@ -39,6 +41,16 @@ input { padding: 0 0.25em; } +input[type="checkbox"] { + background: #FFFFFF; + border: 1px solid #888888; + box-sizing: border-box; + border-radius: 3px; + width: 30px; + height: 30px; + margin: 0; +} + hr { border-top: 1px solid black; border-bottom: none; @@ -62,31 +74,38 @@ hr { height: 100%; } -.App__open-settings-btn { +.App__open-settings { position: absolute; - right: 0; - margin-right: 10px; - margin-top: 10px; + top: 87px; + right: 58px; + width: 24px; + height: 24px; + background-color: #ffffff; + background-image: url('Settings.png'); + background-repeat: no-repeat; } .App__header { - height: 50px; + display: flex; + align-items: center; + height: 70px; background-color: #007AC9; background-image: url('pylvasdiagrammi_valkoinen.png'), url('hsl_logo_valkoinen.png'); - background-size: auto, 102px 41px; - background-position: 10px, 97%; + background-size: 41px 41px, 102px 41px; + background-position: left 15px center, right 15px center; background-repeat: no-repeat, no-repeat; color: #ffffff; - font-size: 20pt; - padding: 30px 0 0 75px; + font-size: 24px; + padding: 0 0 0 85px; font-weight: normal; + letter-spacing: -0.02em; } .App__header-title { } .App__header-version { - font-size: 40%; + font-size: 60%; } .App__body { diff --git a/src/renderer/components/App.jsx b/src/renderer/components/App.jsx index 54cc4abb..ecc6e441 100644 --- a/src/renderer/components/App.jsx +++ b/src/renderer/components/App.jsx @@ -177,18 +177,9 @@ const App = ({helmetUIVersion, versions, searchEMMEPython}) => { {/* UI title bar, app-version, etc. */}
- Helmet 4.0 + Helmet 4.1   - {`UI v${helmetUIVersion}`} -
-
- + {`UI ${helmetUIVersion}`}
{/* HELMET Project -specific content, including runtime- & per-scenario-settings */} @@ -202,6 +193,11 @@ const App = ({helmetUIVersion, versions, searchEMMEPython}) => { signalProjectRunning={setProjectRunning} /> + +
setSettingsOpen(true)} + >
) }; diff --git a/src/renderer/components/Edit.png b/src/renderer/components/Edit.png new file mode 100644 index 00000000..d2610056 Binary files /dev/null and b/src/renderer/components/Edit.png differ diff --git a/src/renderer/components/HelmetProject/CostBenefitAnalysis/CostBenefitAnalysis.css b/src/renderer/components/HelmetProject/CostBenefitAnalysis/CostBenefitAnalysis.css index e7ed4aae..050ed788 100644 --- a/src/renderer/components/HelmetProject/CostBenefitAnalysis/CostBenefitAnalysis.css +++ b/src/renderer/components/HelmetProject/CostBenefitAnalysis/CostBenefitAnalysis.css @@ -1,38 +1,55 @@ .CBA { - padding-left: 10px; - background-image: url('pylvasdiagrammi_sininen.png'); - background-position: 10px 5px; - background-repeat: no-repeat; + background: #F4F4F5; + border-top: 1px solid #CCCCCC; + border-bottom: 1px solid #CCCCCC; + box-sizing: border-box; + padding: 20px; + margin-bottom: 20px; } .CBA__heading { - font-size: 1.25em; - margin: 10px 0 20px 60px; - padding-top: 30px; - font-weight: normal; + font-style: normal; + font-weight: 350; + font-size: 24px; + line-height: 28px; + letter-spacing: -0.02em; + margin-bottom: 10px; } .CBA__choices { - background-color: #EEF1F3; - width: 100%; - padding: 6px; + border-spacing: 0; +} + +.CBA__choices tr td { + vertical-align: bottom; } .CBA__pseudo-label { display: block; - line-height: 1.75em; - vertical-align: middle; + font-style: normal; + font-weight: 350; + font-size: 15px; + line-height: 24px; + letter-spacing: -0.3px; + color: #333333; + margin-top: 10px; } .CBA__pseudo-file-select { display: block; - width: 14em; - line-height: 1.75em; - margin-bottom: 6px; + width: 280px; + padding: 10px 12px; + font-style: normal; + font-weight: 325; + font-size: 16px; + letter-spacing: -0.3px; + color: #333333; background-color: #ffffff; - border: 1px solid #c0c0c0; - border-radius: 3px; - padding: 0 0.25em; + border: 1px solid #888888; + box-sizing: border-box; + border-radius: 5px; + margin-top: 4px; + margin-right: 10px; cursor: pointer; /* Overflowing file/dir names show as "First part..." */ white-space: nowrap; @@ -50,5 +67,8 @@ } .CBA__run { - padding-top: 12px; +} + +.CBA__run button { + margin-top: 20px; } \ No newline at end of file diff --git a/src/renderer/components/HelmetProject/CostBenefitAnalysis/CostBenefitAnalysis.jsx b/src/renderer/components/HelmetProject/CostBenefitAnalysis/CostBenefitAnalysis.jsx index 814be527..51787ad7 100644 --- a/src/renderer/components/HelmetProject/CostBenefitAnalysis/CostBenefitAnalysis.jsx +++ b/src/renderer/components/HelmetProject/CostBenefitAnalysis/CostBenefitAnalysis.jsx @@ -7,7 +7,7 @@ const CostBenefitAnalysis = ({ }) => { return (
-
Hyöty-kustannus-analyysi
+
Hyöty-kustannusanalyysi
@@ -109,7 +109,7 @@ const CostBenefitAnalysis = ({
- +
); diff --git a/src/renderer/components/HelmetProject/HelmetProject.css b/src/renderer/components/HelmetProject/HelmetProject.css index 5a5f7faa..1ac6b1cf 100644 --- a/src/renderer/components/HelmetProject/HelmetProject.css +++ b/src/renderer/components/HelmetProject/HelmetProject.css @@ -1,8 +1,20 @@ .Project { - display: grid; - grid-template-columns: 1fr minmax(0, 1fr); + position: relative; +} + /* +.Project__runtime { + position: absolute; + top: 0; + left: 0; + width: 100vw; + height: 100vh; +} + */ +.Project__selected-details { + position: absolute; + top: 130px; + right: 20px; + left: 635px; } - .HelmetProject__control-group-separator { - margin: 14px 0 0 10px; -} \ No newline at end of file +} diff --git a/src/renderer/components/HelmetProject/HelmetProject.jsx b/src/renderer/components/HelmetProject/HelmetProject.jsx index 589162cd..5a6a3ae2 100644 --- a/src/renderer/components/HelmetProject/HelmetProject.jsx +++ b/src/renderer/components/HelmetProject/HelmetProject.jsx @@ -350,7 +350,6 @@ const HelmetProject = ({ statusIterationsCompleted={statusIterationsCompleted} statusReadyScenariosLogfiles={statusReadyScenariosLogfiles} /> -
- + > -
- Perustiedot +
+ Skenaarion asetukset
{/* Name field (updates the filename live as well) */}
- Skenaarion nimi - Skenaarion nimi + Iteraatioiden enimmäismäärä {/* Choice whether to delete strategy files at the end of a model run */} -
@@ -190,7 +190,7 @@ const HelmetScenario = ({scenario, updateScenario, closeScenario, existingOtherN updateScenario({...scenario, save_matrices_in_emme: e.target.checked}); }} /> - Tallenna eri ajanjaksojen matriisit Emme-projektin Database-kansioon + Tallenna ajanjaksojen matriisit Emme-projektin Database-kansioon {/* Number of first matrix ID */} @@ -199,7 +199,7 @@ const HelmetScenario = ({scenario, updateScenario, closeScenario, existingOtherN style={{color: scenario.save_matrices_in_emme == false ? "#666666" : "inherit"}} htmlFor="first-matrix-id">Matriisit tallennetaan numeroille - –{parseInt(scenario.first_matrix_id == null ? 100 : scenario.first_matrix_id) + 299} + –{parseInt(scenario.first_matrix_id == null ? 100 : scenario.first_matrix_id) + 299}
diff --git a/src/renderer/components/HelmetProject/RunLog/RunLog.css b/src/renderer/components/HelmetProject/RunLog/RunLog.css index df21d28c..43177980 100644 --- a/src/renderer/components/HelmetProject/RunLog/RunLog.css +++ b/src/renderer/components/HelmetProject/RunLog/RunLog.css @@ -1,46 +1,74 @@ .Log { - padding: 1em 0.75em 0 0.75em; - margin: 50px 10px 10px 10px; - background-color: #EEF1F3; - border-radius: 3px; + background-color: #ffffff; + border: 1px solid #CCCCCC; + box-sizing: border-box; + border-radius: 5px; + display: flex; + flex-direction: column; + position: relative; + padding: 40px; + height: 850px; +} + +.Log__heading { + font-style: normal; + font-weight: 350; + font-size: 22px; + line-height: 26px; + letter-spacing: -0.6px; + color: #333333; + margin-bottom: 10px; } .Log__header { text-align: right; + margin-bottom: 10px; } -.Log__close-btn { - min-width: 0px; - width: auto; - heigth: auto; - color: #DC0451; - border-radius: 3px; - font-size: 15px; +.Log__close { + display: block; + position: absolute; + width: 16px; + height: 16px; + top: 17px; + right: 22px; + background-color: #ffffff; + background-image: url('../../close-large.png'); + background-repeat: no-repeat; } .Log__header-controls { - display: table; - margin: 0 auto; + display: flex; + justify-content: space-between; } .Log__header-control { - margin: 4px; + margin-right: 10px; + width: 100%; } .Log__header-control--on { background-color: #007AC9; color: #ffffff; - border: none; + border-color: #007AC9; +} + +.Log__overflow { + overflow: auto; + display: flex; + flex-direction: column-reverse; } .Log__entries { - max-height: 33em; - overflow-y: scroll; - overflow-x: scroll; - white-space: pre; + white-space: pre-wrap; + font-style: normal; + font-weight: 325; + font-size: 18px; + line-height: 24px; + letter-spacing: -0.5px; } .Log__entry { - color: #007AC9 + color: #333333; } .Log__entry--ui { diff --git a/src/renderer/components/HelmetProject/RunLog/RunLog.jsx b/src/renderer/components/HelmetProject/RunLog/RunLog.jsx index 9cca3808..62bc80b7 100644 --- a/src/renderer/components/HelmetProject/RunLog/RunLog.jsx +++ b/src/renderer/components/HelmetProject/RunLog/RunLog.jsx @@ -9,14 +9,13 @@ const RunLog = ({isScenarioRunning, entries, closeRunLog}) => { return (
-
+
Loki
+ +
isScenarioRunning ? undefined : closeRunLog()} + >
- +
+
{entries.map((entry) => { switch (entry.level) { @@ -89,6 +89,7 @@ const RunLog = ({isScenarioRunning, entries, closeRunLog}) => { } })}
+
) }; diff --git a/src/renderer/components/HelmetProject/Runtime/RunStatus/RunStatus.css b/src/renderer/components/HelmetProject/Runtime/RunStatus/RunStatus.css index 501882ed..6b5f5f66 100644 --- a/src/renderer/components/HelmetProject/Runtime/RunStatus/RunStatus.css +++ b/src/renderer/components/HelmetProject/Runtime/RunStatus/RunStatus.css @@ -2,9 +2,20 @@ } .Status__readiness { - margin: 1em 0; - border: 1px solid silver; - padding: 4px; + display: flex; + align-items: center; + width: 579px; + height: 31px; + background: #FFFFFF; + border: 1px solid #CCCCCC; + box-sizing: border-box; + border-radius: 4px; + margin: 10px 0; + font-style: normal; + font-weight: 350; + font-size: 15px; + letter-spacing: -0.5px; + padding-left: 9px; } .Status__finished-scenario { diff --git a/src/renderer/components/HelmetProject/Runtime/RunStatus/RunStatus.jsx b/src/renderer/components/HelmetProject/Runtime/RunStatus/RunStatus.jsx index b68d34f7..82563666 100644 --- a/src/renderer/components/HelmetProject/Runtime/RunStatus/RunStatus.jsx +++ b/src/renderer/components/HelmetProject/Runtime/RunStatus/RunStatus.jsx @@ -31,7 +31,7 @@ const RunStatus = ({isScenarioRunning, statusIterationsTotal, statusIterationsCo
: - "Setting up python-shell . . ." +

Setting up python-shell . . .

: "" } diff --git a/src/renderer/components/HelmetProject/Runtime/Runtime.css b/src/renderer/components/HelmetProject/Runtime/Runtime.css index 6978cbba..4fea7fb1 100644 --- a/src/renderer/components/HelmetProject/Runtime/Runtime.css +++ b/src/renderer/components/HelmetProject/Runtime/Runtime.css @@ -1,84 +1,121 @@ -.Runtime { - width: 600px; - padding-top: 20px; - padding-left: 10px; +.Runtime { +} + +/* Helmet project */ + +.Runtime__helmet-project-controls { + padding: 20px; } .Runtime__heading { - font-size: 1.25em; - margin-bottom: 15px; - font-weight: normal; + font-style: normal; + font-weight: 350; + font-size: 24px; + line-height: 28px; + letter-spacing: -0.02em; } .Runtime__project-path { - font-size: 1em; - margin-bottom: 7px; - font-weight: normal; - font-style: italic; } .Runtime__reload-scenarios-btn { - margin-bottom: 12px; +} + +/* Scenarios */ + +.Runtime__scenarios-controls { + background: #F4F4F5; + border-top: 1px solid #CCCCCC; + border-bottom: 1px solid #CCCCCC; + box-sizing: border-box; + padding: 20px; +} + +.Runtime__scenarios-heading { + font-style: normal; + font-weight: 350; + font-size: 24px; + line-height: 28px; + letter-spacing: -0.02em; + margin-bottom: 10px; } .Runtime__scenarios { - background-color: #EEF1F3; max-height: 160px; + width: 580px; overflow-y: auto; - padding: 6px; } .Runtime__scenario { - margin: 6px; + display: flex; + align-items: center; + margin-bottom: 18px; + flex-direction: row; } .Runtime__scenario-name { display: inline-block; - padding: 8px 0; - width: 120px; + width: 380px; overflow: hidden; } -.Runtime__scenario-activate-btn { - margin-right: 14px; +.Runtime__scenario-activate-checkbox { + display: inline-block; vertical-align: top; + margin-right: 31px !important; + border-radius: 4px !important; + width: 24px !important; + height: 24px !important; } -.Runtime__scenario-activate-btn--active { - background-color: #00985F; - color: #ffffff; - border: none; +.Runtime__scenario-activate-checkbox--active { } -.Runtime__scenario-open-config-btn { - margin-right: 14px; - white-space: pre; - overflow: hidden; +.Runtime__scenario-open-config { + display: inline-block; + margin-right: 31px; vertical-align: top; - text-overflow: ellipsis; -} -.Runtime__scenario-open-config-btn--active { - background-color: #007AC9; - color: #ffffff; - border: none; + width: 24px; + height: 24px; + background-image: url('../../Edit.png'); + background-repeat: no-repeat; } -.Runtime__scenario-delete-btn { - background: #F4DEEA; +.Runtime__scenario-delete { + display: inline-block; vertical-align: top; + width: 24px; + height: 24px; + background-image: url('../../trash.png'); + background-repeat: no-repeat; } .Runtime__scenarios-footer { - padding-top: 12px; + padding-top: 22px; } .Runtime__add-new-scenario-btn { + background: #007AC9; + border-color: #007AC9; + color: #ffffff; +} +.Runtime__add-new-scenario-btn:hover { + color: #ffffff; } -.Runtime__control-group-separator { - margin: 14px 0 0 0; +.Runtime__add-icon { + display: inline-flex; + align-items: center; + height: 35px; + padding-left: 45px; + background-color: #007AC9; + background-image: url(../../add.png); + background-repeat: no-repeat; } +/* Start-stop */ + .Runtime__start-stop-controls { + padding: 20px; } .Runtime__start-stop-description { diff --git a/src/renderer/components/HelmetProject/Runtime/Runtime.jsx b/src/renderer/components/HelmetProject/Runtime/Runtime.jsx index c59b2f43..cc7a32f7 100644 --- a/src/renderer/components/HelmetProject/Runtime/Runtime.jsx +++ b/src/renderer/components/HelmetProject/Runtime/Runtime.jsx @@ -10,19 +10,24 @@ const Runtime = ({ }) => { return (
-
Lisää HELMET-skenaario(t) ajettavaksi, tai luo uusi HELMET-skenaario
+ +
+
Projektin alustaminen

- HELMET-skenaarioiden tallennuspolku: {projectPath} + Helmet-skenaarioiden tallennuspolku: {projectPath}

+
+
+
Ladatut skenaariot
{/* Create table of all scenarios " " */} {scenarios.map((s) => { @@ -32,33 +37,27 @@ const Runtime = ({ {s.name ? s.name : `Unnamed project (${s.id})`}   - + handleClickScenarioToActive(s)} + />   - + onClick={(e) => runningScenarioID ? undefined : setOpenScenarioID(s.id)} + >
  - +
runningScenarioID ? undefined : deleteScenario(s)} + >
) })} @@ -68,21 +67,20 @@ const Runtime = ({ disabled={runningScenarioID} onClick={(e) => handleClickNewScenario()} > - Uusi skenaario + Uusi Helmet-skenaario
-
+ +
+
Ajettavana

{scenarioIDsToRun.length ? - - Ajettavana:  {scenarios.filter((s) => scenarioIDsToRun.includes(s.id)).map((s) => s.name).join(', ')} - : - "Ei ajettavaksi valittuja skenaarioita" + Ei ajettavaksi valittuja skenaarioita }

-
{/* Dark background overlay */}
+
closeSettings()}>{/* Dark background overlay */}
- + +
closeSettings()}>
+
Projektin asetukset
Emme Python v3.7 @@ -34,7 +34,7 @@ const Settings = ({ accept=".exe" onChange={(e) => setEMMEPythonPath(e.target.files[0].path)} /> -
- HELMET model-system + Helmet-model-system {isDownloadingHelmetScripts ? Downloading model-system {dlHelmetScriptsVersion === 'master' ? 'latest' : dlHelmetScriptsVersion}. . . @@ -72,10 +72,10 @@ const Settings = ({ }) }} /> -
diff --git a/src/renderer/components/add.png b/src/renderer/components/add.png new file mode 100644 index 00000000..68795e27 Binary files /dev/null and b/src/renderer/components/add.png differ diff --git a/src/renderer/components/close-large.png b/src/renderer/components/close-large.png new file mode 100644 index 00000000..ac213e32 Binary files /dev/null and b/src/renderer/components/close-large.png differ diff --git a/src/renderer/components/trash.png b/src/renderer/components/trash.png new file mode 100644 index 00000000..7f91b70b Binary files /dev/null and b/src/renderer/components/trash.png differ diff --git a/src/renderer/index.html b/src/renderer/index.html index e286ed9c..1c501cb4 100644 --- a/src/renderer/index.html +++ b/src/renderer/index.html @@ -2,7 +2,7 @@ - Helmet 4.0 + Helmet 4.1