Improved Modal UI, updated text, restored roll boxes, fixed ED Engineer button hide/show/disable/enable

This commit is contained in:
Alex Williams
2024-07-08 18:55:08 +01:00
parent 2362ded438
commit 15fbf2c96d
4 changed files with 88 additions and 47 deletions

View File

@@ -355,40 +355,46 @@ export default class ModalShoppingList extends TranslatedComponent {
this.sendToEDEng = this.sendToEDEng.bind(this);
this.sendToEDOMH = this.sendToEDOMH.bind(this);
return <div className='modal' onClick={ (e) => e.stopPropagation() }>
<h2>{translate('PHRASE_SHOPPING_MATS')}</h2>
<p>{translate('PHRASE_DIFFERENT_ROLLS')}</p>
{/* <label>{translate('Grade 1 rolls ')}</label>
<input id={1} type={'number'} min={0} defaultValue={this.state.matsPerGrade[1]} onChange={this.changeHandler} />
<br/>
<label>{translate('Grade 2 rolls ')}</label>
<input id={2} type={'number'} min={0} defaultValue={this.state.matsPerGrade[2]} onChange={this.changeHandler} />
<br/>
<label>{translate('Grade 3 rolls ')}</label>
<input id={3} type={'number'} min={0} value={this.state.matsPerGrade[3]} onChange={this.changeHandler} />
<br/>
<label>{translate('Grade 4 rolls ')}</label>
<input id={4} type={'number'} min={0} value={this.state.matsPerGrade[4]} onChange={this.changeHandler} />
<br/>
<label>{translate('Grade 5 rolls ')}</label>
<input id={5} type={'number'} min={0} value={this.state.matsPerGrade[5]} onChange={this.changeHandler} /> */}
<h3>{translate('PHRASE_SHOPPING_MATS')}</h3>
<div>
<p>{translate('PHRASE_DIFFERENT_ROLLS')}</p>
<label>{translate('G1')}</label>
<input id={1} type={'number'} min={0} defaultValue={this.state.matsPerGrade[1]} onChange={this.changeHandler} />
&nbsp;|&nbsp;<label>{translate('G2')}</label>
<input id={2} type={'number'} min={0} defaultValue={this.state.matsPerGrade[2]} onChange={this.changeHandler} />
&nbsp;|&nbsp;<label>{translate('G3')}</label>
<input id={3} type={'number'} min={0} value={this.state.matsPerGrade[3]} onChange={this.changeHandler} />
&nbsp;|&nbsp;<label>{translate('G4')}</label>
<input id={4} type={'number'} min={0} value={this.state.matsPerGrade[4]} onChange={this.changeHandler} />
&nbsp;|&nbsp;<label>{translate('G5')}</label>
<input id={5} type={'number'} min={0} value={this.state.matsPerGrade[5]} onChange={this.changeHandler} />
</div>
<div>
<p>{translate('PHRASE_ALL_MODULES_ALL_ROLLS')}</p>
<textarea className='cb json' readOnly value={this.state.matsList} />
<p>{translate('PHRASE_FOR_FINER_CONTROL')}</p>
</div>
<p hidden={compatible} id={'browserbad'} className={'l'}>{translate('PHRASE_FIREFOX_EDENGINEER')}</p>
<p hidden={!this.state.failed} id={'failed'} className={'l'}>{translate('PHRASE_FAILED_TO_FIND_EDENGINEER')}</p>
<div id='edengineer' display={this.display} hidden={!!this.state.failed && !compatible}>
<label hidden={!compatible || !!this.state.failed} className={'l cap'}>{translate('CMDR Name')}</label>
<br/>
<select hidden={!compatible || !!this.state.failed} className={'cmdr-select l cap'} onChange={this.cmdrChangeHandler} defaultValue={this.state.cmdrName}>
<hr />
<h3>ED Engineer</h3>
<h4 hidden={compatible} id={'browserbad'} className={'l'}>{translate('PHRASE_FIREFOX_EDENGINEER')}</h4>
<h4 hidden={!this.state.failed} id={'failed'} className={'l'}>{translate('PHRASE_FAILED_TO_FIND_EDENGINEER')}</h4>
<label for='cmdr-select' hidden={!!this.state.failed || !compatible} className={'l cap'}>{translate('CMDR Name:')}</label>
<select id='cmdr-select' hidden={!!this.state.failed || !compatible} className={'cmdr-select l cap'} onChange={this.cmdrChangeHandler} defaultValue={this.state.cmdrName}>
{this.state.cmdrs.map(e => <option key={e}>{e}</option>)}
</select>
<br/>
<button className={'l cb dismiss cap'} hidden={!this.state.failed} disabled={!!this.state.failed || !compatible} onClick={this.sendToEDEng}>{translate('Send to EDEngineer')}</button>
<button className={'l cb dismiss cap'} disabled={!!this.state.failed || !compatible} onClick={this.sendToEDEng}>{translate('Send to EDEngineer')}</button>
</div>
<div id='edomh'>
<hr />
<h3>ED Odyssey Materials Helper</h3>
<p>{translate('PHRASE_ENSURE_EDOMH')}</p>
<button style={{marginTop: 5}} className={'l cb dismiss cap'} onClick={this.sendToEDOMH}>{translate('Send to EDOMH')}</button>
<button className={'l cb dismiss cap'} onClick={this.sendToEDOMH}>{translate('Send to EDOMH')}</button>
</div>
<hr />
<button className={'r dismiss cap'} onClick={this.context.hideModal}>{translate('close')}</button>
</div>;

View File

@@ -26,7 +26,9 @@
"PHRASE_NO_SPECIAL": "No experimental effect",
"PHRASE_SHOPPING_LIST": "Stations that sell this build",
"PHRASE_SHOPPING_MATS": "Materials needed for this build",
"PHRASE_DIFFERENT_ROLLS": "NOTE: ED Engineer and/or EDOMH likely have their own 'rolls' configuration, so material requirements may differ!",
"PHRASE_DIFFERENT_ROLLS": "Material requirements will differ, based on the number of rolls per grade, per module.",
"PHRASE_FOR_FINER_CONTROL": "For finer control over rolls per grade/module, a more accurate list of required mats and help in finding those mats, please consider using the export options below to ED Odyssey Materials Helper, or ED Engineer, or use the Crafting Lists feature on inara.cz.",
"PHRASE_ALL_MODULES_ALL_ROLLS": "The list below, assumes standard to G5 Engineered (approx 80% - 90%) with the rolls above, for ALL engineered modules in the build. You can adjust the number of rolls above for each grade, however it will still apply to all engineered modules in the build.",
"PHRASE_REFIT_SHOPPING_LIST": "Stations that sell required modules",
"PHRASE_TOTAL_EFFECTIVE_SHIELD": "Total amount of damage that can be taken from each damage type, if using all shield cells",
"PHRASE_TIME_TO_LOSE_SHIELDS": "Shields will hold for",
@@ -82,8 +84,7 @@
"TT_SUMMARY_UNLADEN_TOTAL_JUMP": "Farthest possible range with no cargo, a full fuel tank, and jumping as far as possible each time",
"TT_SUMMARY_LADEN_TOTAL_JUMP": "Farthest possible range with full cargo, a full fuel tank, and jumping as far as possible each time",
"HELP_MODIFICATIONS_MENU": "Click on a number to enter a new value, or drag along the bar for small changes",
"PHRASE_FAIL_EDENGINEER": "Failed to send to EDEngineer (Launch EDEngineer and make sure the API is started then refresh the page.)",
"PHRASE_ENSURE_EDOMH": "Ensure EDO Material Helper is installed and registered to handle edomh:// urls, else this button will do nothing!",
"PHRASE_ENSURE_EDOMH": "Ensure ED Odyssey Material Helper is installed and registered to handle edomh:// urls, else this button will do nothing!",
"PHRASE_FIREFOX_EDENGINEER": "Sending to EDEngineer is not compatible with Firefox's security settings. Please try again with Chrome.",
"PHRASE_FAILED_TO_FIND_EDENGINEER": "Failed to find ED Engineer API. Please ensure it is running and try again.",
"MISSING_MODULES": "Missing Modules",

View File

@@ -108,9 +108,9 @@ export class Persist extends EventEmitter {
this.matsPerGrade = matsPerGrade || {
1: 2,
2: 2,
3: 4,
3: 3,
4: 4,
5: 10
5: 5
};
this.cmdrName = cmdrName || { selected: '', cmdrs: [] };
this.tooltipsEnabled = tips === null ? true : tips;

View File

@@ -42,32 +42,66 @@
margin: 0;
}
h4 {
text-transform: uppercase;
font-family: @fStandard;
font-weight: normal;
font-size: 1em;
margin: 1em;
color: @warning;
}
p {
clear: left;
padding: 30, 0, 0, 0;
margin: 1em;
text-wrap: pretty;
}
button {
margin: 100px, 0;
clear: bottom;
margin: 5px;
}
}
textarea {
background: @primary-bg;
border: none;
outline: none;
color: @primary-disabled;
&.json {
display:block;
width:100%;
min-height: 10em;
resize: vertical;
user-select: text;
margin:2em 0;
hr {
clear: both;
margin: 15px, 10px, 15px, 10px;
padding: top, 5;
}
}
.dismiss {
background-color: @primary-bg;
}
select {
clear: bottom;
margin: 10px;
width: 50%;
}
label {
clear: bottom;
margin: 20px;
color: @primary;
}
input {
width: 6%;
margin: 5px;
text-align: center;
}
textarea {
background: @primary-bg;
border: none;
outline: none;
color: @primary-disabled;
&.json {
display:block;
width:100%;
min-height: 10em;
resize: vertical;
user-select: text;
margin:1em 0;
}
}
.dismiss {
background-color: @primary-bg;
}
}