mirror of
https://github.com/EDCD/coriolis.git
synced 2025-12-10 15:15:34 +00:00
More refactoring and porting to React
This commit is contained in:
Colin McLeod
@@ -1,6 +1,6 @@
|
||||
import React from 'react';
|
||||
import Page from './Page';
|
||||
import Ships from '../shipyard/Ships';
|
||||
import { Ships } from 'coriolis-data';
|
||||
import cn from 'classnames';
|
||||
import Ship from '../shipyard/Ship';
|
||||
import * as ModuleUtils from '../shipyard/ModuleUtils';
|
||||
@@ -19,6 +19,8 @@ function countInt(slot) {
|
||||
this.maxCargo += crEligible ? ModuleUtils.findInternal('cr', slot.maxClass, 'E').capacity : 0;
|
||||
}
|
||||
|
||||
let cachedShipSummaries = null;
|
||||
|
||||
export default class ShipyardPage extends Page {
|
||||
|
||||
constructor(props, context) {
|
||||
@@ -26,14 +28,18 @@ export default class ShipyardPage extends Page {
|
||||
this.state = {
|
||||
title: 'Coriolis - Shipyard',
|
||||
shipPredicate: 'name',
|
||||
shipDesc: false
|
||||
shipDesc: true
|
||||
};
|
||||
this.context = context;
|
||||
this.shipSummaries = [];
|
||||
|
||||
for (let s in Ships) {
|
||||
this.shipSummaries.push(this._shipSummary(s, Ships[s]));
|
||||
if (!cachedShipSummaries) {
|
||||
cachedShipSummaries = [];
|
||||
for (let s in Ships) {
|
||||
cachedShipSummaries.push(this._shipSummary(s, Ships[s]));
|
||||
}
|
||||
}
|
||||
|
||||
this.shipSummaries = cachedShipSummaries;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -43,7 +49,7 @@ export default class ShipyardPage extends Page {
|
||||
_sortShips(shipPredicate, shipPredicateIndex) {
|
||||
let shipDesc = this.state.shipDesc;
|
||||
|
||||
if (typeof shipPredicateIndex == "object") {
|
||||
if (typeof shipPredicateIndex == 'object') {
|
||||
shipPredicateIndex = undefined;
|
||||
}
|
||||
|
||||
@@ -55,11 +61,6 @@ export default class ShipyardPage extends Page {
|
||||
};
|
||||
|
||||
_shipSummary(shipId, shipData) {
|
||||
let language = this.context.language;
|
||||
let u = language.units;
|
||||
let fInt = language.formats.int;
|
||||
let fRound = language.formats.round;
|
||||
let translate = language.translate;
|
||||
let summary = {
|
||||
id: shipId,
|
||||
hpCount: 0,
|
||||
@@ -81,24 +82,23 @@ export default class ShipyardPage extends Page {
|
||||
ship.optimizeMass({ th: ship.standard[1].maxClass + 'A' }); // Optmize mass with Max Thrusters
|
||||
summary.topSpeed = ship.topSpeed;
|
||||
summary.topBoost = ship.topBoost;
|
||||
summary.rowElement = this._shipRowElement(summary, translate, u, fInt, fRound);
|
||||
|
||||
return summary;
|
||||
}
|
||||
|
||||
_shipRowElement(s, translate, u, fInt, fRound) {
|
||||
return <tr key={s.id} className={'highlight'}>
|
||||
<td className={'le'}><Link href={'/outfitting/' + s.id}>{s.name}</Link></td>
|
||||
<td className={'le'}>{s.manufacturer}</td>
|
||||
<td className={'cap'}>{translate(SizeMap[s.class])}</td>
|
||||
<td className={'ri'}>{fInt(s.speed)}{u.ms}</td>
|
||||
<td className={'ri'}>{fInt(s.boost)}{u.ms}</td>
|
||||
<td className={'ri'}>{s.baseArmour}</td>
|
||||
<td className={'ri'}>{fInt(s.baseShieldStrength)}{u.MJ}</td>
|
||||
<td className={'ri'}>{fInt(s.topSpeed)}{u.ms}</td>
|
||||
<td className={'ri'}>{fInt(s.topBoost)}{u.ms}</td>
|
||||
<td className={'ri'}>{fRound(s.maxJumpRange)}{u.LY}</td>
|
||||
<td className={'ri'}>{fInt(s.maxCargo)}{u.T}</td>
|
||||
return <tr key={s.id} className='highlight'>
|
||||
<td className='le'><Link href={'/outfit/' + s.id}>{s.name}</Link></td>
|
||||
<td className='le'>{s.manufacturer}</td>
|
||||
<td className='cap'>{translate(SizeMap[s.class])}</td>
|
||||
<td className='ri'>{fInt(s.speed)}{u.ms}</td>
|
||||
<td className='ri'>{fInt(s.boost)}{u.ms}</td>
|
||||
<td className='ri'>{s.baseArmour}</td>
|
||||
<td className='ri'>{fInt(s.baseShieldStrength)}{u.MJ}</td>
|
||||
<td className='ri'>{fInt(s.topSpeed)}{u.ms}</td>
|
||||
<td className='ri'>{fInt(s.topBoost)}{u.ms}</td>
|
||||
<td className='ri'>{fRound(s.maxJumpRange)}{u.LY}</td>
|
||||
<td className='ri'>{fInt(s.maxCargo)}{u.T}</td>
|
||||
<td className={cn({ disabled: !s.hp[1] })}>{s.hp[1]}</td>
|
||||
<td className={cn({ disabled: !s.hp[2] })}>{s.hp[2]}</td>
|
||||
<td className={cn({ disabled: !s.hp[3] })}>{s.hp[3]}</td>
|
||||
@@ -112,31 +112,16 @@ export default class ShipyardPage extends Page {
|
||||
<td className={cn({ disabled: !s.int[5] })}>{s.int[5]}</td>
|
||||
<td className={cn({ disabled: !s.int[6] })}>{s.int[6]}</td>
|
||||
<td className={cn({ disabled: !s.int[7] })}>{s.int[7]}</td>
|
||||
<td className={'ri'}>{fInt(s.hullMass)}{u.T}</td>
|
||||
<td className={'ri'}>{s.masslock}</td>
|
||||
<td className={'ri'}>{fInt(s.retailCost)}{u.CR}</td>
|
||||
<td className='ri'>{fInt(s.hullMass)}{u.T}</td>
|
||||
<td className='ri'>{s.masslock}</td>
|
||||
<td className='ri'>{fInt(s.retailCost)}{u.CR}</td>
|
||||
</tr>;
|
||||
}
|
||||
|
||||
_renderSummaries(language) {
|
||||
let fInt = language.formats.int;
|
||||
let fRound = language.formats.round;
|
||||
let translate = language.translate;
|
||||
let u = language.units;
|
||||
// Regenerate ship rows on prop change
|
||||
for (let s of this.shipSummaries) {
|
||||
s.rowElement = this._shipRowElement(s, translate, u, fInt, fRound);
|
||||
}
|
||||
}
|
||||
|
||||
componentWillUpdate(nextProps, nextState, nextContext) {
|
||||
if (this.context.language !== nextContext.language) {
|
||||
this._renderSummaries(language);
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
let translate = this.context.language.translate;
|
||||
let { translate, formats, units } = this.context.language;
|
||||
let fInt = formats.int;
|
||||
let fRound = formats.round;
|
||||
let shipSummaries = this.shipSummaries;
|
||||
let shipPredicate = this.state.shipPredicate;
|
||||
let shipPredicateIndex = this.state.shipPredicateIndex;
|
||||
@@ -172,52 +157,52 @@ export default class ShipyardPage extends Page {
|
||||
});
|
||||
|
||||
for (let s of shipSummaries) {
|
||||
shipRows.push(s.rowElement);
|
||||
shipRows.push(this._shipRowElement(s, translate, units, fInt, fRound));
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={'page'}>
|
||||
<div className={'scroll-x'}>
|
||||
<div className='page'>
|
||||
<div className='scroll-x'>
|
||||
<table style={{ fontSize:'0.85em', whiteSpace:'nowrap', margin: '0 auto' }} align='center'>
|
||||
<thead>
|
||||
<tr className={'main'}>
|
||||
<th rowSpan={2} className={'sortable le'} onClick={sortShips('name')}>{translate('ship')}</th>
|
||||
<th rowSpan={2} className={'sortable'} onClick={sortShips('manufacturer')}>{translate('manufacturer')}</th>
|
||||
<th rowSpan={2} className={'sortable'} onClick={sortShips('class')}>{translate('size')}</th>
|
||||
<tr className='main'>
|
||||
<th rowSpan={2} className='sortable le' onClick={sortShips('name')}>{translate('ship')}</th>
|
||||
<th rowSpan={2} className='sortable' onClick={sortShips('manufacturer')}>{translate('manufacturer')}</th>
|
||||
<th rowSpan={2} className='sortable' onClick={sortShips('class')}>{translate('size')}</th>
|
||||
<th colSpan={4}>{translate('base')}</th>
|
||||
<th colSpan={4}>{translate('max')}</th>
|
||||
<th colSpan={5} className={'sortable'} onClick={sortShips('hpCount')}>{translate('hardpoints')}</th>
|
||||
<th colSpan={8} className={'sortable'} onClick={sortShips('intCount')}>{translate('internal compartments')}</th>
|
||||
<th rowSpan={2} className={'sortable'} onClick={sortShips('hullMass')}>{translate('hull')}</th>
|
||||
<th rowSpan={2} className={'sortable'} onClick={sortShips('masslock')}>{translate('MLF')}</th>
|
||||
<th rowSpan={2} className={'sortable'} onClick={sortShips('retailCost')}>{translate('cost')}</th>
|
||||
<th colSpan={5} className='sortable' onClick={sortShips('hpCount')}>{translate('hardpoints')}</th>
|
||||
<th colSpan={8} className='sortable' onClick={sortShips('intCount')}>{translate('internal compartments')}</th>
|
||||
<th rowSpan={2} className='sortable' onClick={sortShips('hullMass')}>{translate('hull')}</th>
|
||||
<th rowSpan={2} className='sortable' onClick={sortShips('masslock')}>{translate('MLF')}</th>
|
||||
<th rowSpan={2} className='sortable' onClick={sortShips('retailCost')}>{translate('cost')}</th>
|
||||
</tr>
|
||||
<tr>
|
||||
{/* Base */}
|
||||
<th className={'sortable lft'} onClick={sortShips('speed')}>{translate('speed')}</th>
|
||||
<th className={'sortable'} onClick={sortShips('boost')}>{translate('boost')}</th>
|
||||
<th className={'sortable'} onClick={sortShips('baseArmour')}>{translate('armour')}</th>
|
||||
<th className={'sortable'} onClick={sortShips('baseShieldStrength')}>{translate('shields')}</th>
|
||||
<th className='sortable lft' onClick={sortShips('speed')}>{translate('speed')}</th>
|
||||
<th className='sortable' onClick={sortShips('boost')}>{translate('boost')}</th>
|
||||
<th className='sortable' onClick={sortShips('baseArmour')}>{translate('armour')}</th>
|
||||
<th className='sortable' onClick={sortShips('baseShieldStrength')}>{translate('shields')}</th>
|
||||
{/* Max */}
|
||||
<th className={'sortable lft'} onClick={sortShips('topSpeed')}>{translate('speed')}</th>
|
||||
<th className={'sortable'} onClick={sortShips('topBoost')}>{translate('boost')}</th>
|
||||
<th className={'sortable'} onClick={sortShips('maxJumpRange')}>{translate('jump')}</th>
|
||||
<th className={'sortable'} onClick={sortShips('maxCargo')}>{translate('cargo')}</th>
|
||||
<th className='sortable lft' onClick={sortShips('topSpeed')}>{translate('speed')}</th>
|
||||
<th className='sortable' onClick={sortShips('topBoost')}>{translate('boost')}</th>
|
||||
<th className='sortable' onClick={sortShips('maxJumpRange')}>{translate('jump')}</th>
|
||||
<th className='sortable' onClick={sortShips('maxCargo')}>{translate('cargo')}</th>
|
||||
{/* Hardpoints */}
|
||||
<th className={'sortable lft'} onClick={sortShips('hp',1)}>{translate('S')}</th>
|
||||
<th className={'sortable'} onClick={sortShips('hp', 2)}>{translate('M')}</th>
|
||||
<th className={'sortable'} onClick={sortShips('hp', 3)}>{translate('L')}</th>
|
||||
<th className={'sortable'} onClick={sortShips('hp', 4)}>{translate('H')}</th>
|
||||
<th className={'sortable'} onClick={sortShips('hp', 0)}>{translate('U')}</th>
|
||||
<th className='sortable lft' onClick={sortShips('hp',1)}>{translate('S')}</th>
|
||||
<th className='sortable' onClick={sortShips('hp', 2)}>{translate('M')}</th>
|
||||
<th className='sortable' onClick={sortShips('hp', 3)}>{translate('L')}</th>
|
||||
<th className='sortable' onClick={sortShips('hp', 4)}>{translate('H')}</th>
|
||||
<th className='sortable' onClick={sortShips('hp', 0)}>{translate('U')}</th>
|
||||
{/* Internal */}
|
||||
<th className={'sortable lft'} onClick={sortShips('int', 0)} >1</th>
|
||||
<th className={'sortable'} onClick={sortShips('int', 1)} >2</th>
|
||||
<th className={'sortable'} onClick={sortShips('int', 2)} >3</th>
|
||||
<th className={'sortable'} onClick={sortShips('int', 3)} >4</th>
|
||||
<th className={'sortable'} onClick={sortShips('int', 4)} >5</th>
|
||||
<th className={'sortable'} onClick={sortShips('int', 5)} >6</th>
|
||||
<th className={'sortable'} onClick={sortShips('int', 6)} >7</th>
|
||||
<th className={'sortable'} onClick={sortShips('int', 7)} >8</th>
|
||||
<th className='sortable lft' onClick={sortShips('int', 0)} >1</th>
|
||||
<th className='sortable' onClick={sortShips('int', 1)} >2</th>
|
||||
<th className='sortable' onClick={sortShips('int', 2)} >3</th>
|
||||
<th className='sortable' onClick={sortShips('int', 3)} >4</th>
|
||||
<th className='sortable' onClick={sortShips('int', 4)} >5</th>
|
||||
<th className='sortable' onClick={sortShips('int', 5)} >6</th>
|
||||
<th className='sortable' onClick={sortShips('int', 6)} >7</th>
|
||||
<th className='sortable' onClick={sortShips('int', 7)} >8</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
|
||||
Reference in New Issue
Block a user