Skip to content

Commit 996aea4

Browse files
authored
Merge pull request #3 from ferrari212/dev
Version 1.1.0
2 parents f245238 + 7a6b554 commit 996aea4

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

48 files changed

+12548
-203
lines changed

app/Main.js

Lines changed: 25 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { useImmerReducer } from "use-immer"
44
import { BrowserRouter, Switch, Route } from "react-router-dom"
55
import Axios from "axios"
66

7-
Axios.defaults.baseURL = process.env.BACKENDURL || "https://ferrari--complex-back-end.herokuapp.com"
7+
Axios.defaults.baseURL = process.env.BACKENDURL || "https://platform-twin-ship.herokuapp.com"
88

99
import StateContext from "./StateContext"
1010
import DispatchContext from "./DispatchContext"
@@ -18,7 +18,7 @@ import About from "./components/About"
1818
import Terms from "./components/Terms"
1919
const CreatePost = React.lazy(() => import("./components/CreatePost"))
2020
const ViewSinglePost = React.lazy(() => import("./components/ViewSinglePost"))
21-
const ThreeModelRayCaster = React.lazy(() => import("./components/ThreeModelRayCaster"))
21+
const ThreeModelRayCaster = React.lazy(() => import("./components/ThreeComponents/ThreeModelRayCaster"))
2222
import FlashMessages from "./components/FlashMessages"
2323
import Profile from "./components/Profile"
2424
import EditPost from "./components/EditPost"
@@ -34,7 +34,11 @@ function Main() {
3434
username: localStorage.getItem("complexappUsername"),
3535
avatar: localStorage.getItem("complexappAvatar"),
3636
versions: [],
37-
shipId: 0
37+
shipId: 0,
38+
shipStage: {
39+
lifeCycle: "project",
40+
method: "simulate"
41+
}
3842
}
3943
}
4044

@@ -59,6 +63,15 @@ function Main() {
5963

6064
case "flashMessage":
6165
draft.flashMessages.push(action.value)
66+
draft.user.versions = action.clearData
67+
return
68+
69+
case "setAnalysis":
70+
if (action.command) {
71+
draft.user.shipStage.method = "analyse"
72+
} else {
73+
draft.user.shipStage.method = "simulate"
74+
}
6275
return
6376
}
6477
}
@@ -67,39 +80,35 @@ function Main() {
6780

6881
useEffect(() => {
6982
if (state.loggedIn) {
70-
// var versionsLocalStorage = state.user.versions.map(e => {
71-
// console.log(e)
72-
// return JSON.stringify(e)
73-
// })
74-
7583
localStorage.setItem("complexappToken", state.user.token)
7684
localStorage.setItem("complexappUsername", state.user.username)
7785
localStorage.setItem("complexappAvatar", state.user.avatar)
78-
// localStorage.setItem("complexappVersions", versionsLocalStorage)
86+
// localStorage.setItem("complexappVersions", state.user.versions)
7987
localStorage.setItem("complexappShipIndex", state.user.shipId)
8088

8189
async function getVersions(component) {
8290
const ourRequest = Axios.CancelToken.source()
8391

8492
try {
85-
const versions = await Axios.get(`/profile/${component.username}/posts`, { cancelToken: ourRequest.token })
93+
const versions = await Axios.get(`/profile/${component.username.toLowerCase()}/posts`, { cancelToken: ourRequest.token })
94+
// console.log(versions)
95+
// debugger
96+
8697
dispatch({ type: "setVersion", data: versions.data })
8798
} catch (e) {
8899
console.log("There was a problem.", e)
89100
}
90101
}
91102

92103
if (state.user.versions.length === 0) getVersions(state.user)
93-
94-
// console.log(versionsLocalStorage)
95104
} else {
96105
localStorage.removeItem("complexappToken")
97106
localStorage.removeItem("complexappUsername")
98107
localStorage.removeItem("complexappAvatar")
99-
localStorage.removeItem("complexappVersions")
108+
// localStorage.removeItem("complexappVersions")
100109
localStorage.removeItem("complexappShipIndex")
101110
}
102-
}, [state.loggedIn])
111+
}, [state.loggedIn, state.user.versions])
103112

104113
return (
105114
<StateContext.Provider value={state}>
@@ -109,7 +118,7 @@ function Main() {
109118
<Header />
110119
<Suspense fallback={<LoadingDotsIcon></LoadingDotsIcon>}>
111120
<Switch>
112-
<Route path="/three-model/:username">{state.user.versions.length > 0 ? <ThreeModelRayCaster user={state.user} addScenarioStatus={true} /> : ""}</Route>
121+
<Route path="/three-model/:username">{state.user.versions.length > 0 ? <ThreeModelRayCaster user={state.user} /> : ""}</Route>
113122
<Route path="/profile/:username">
114123
<Profile />
115124
</Route>
@@ -122,7 +131,7 @@ function Main() {
122131
<Route path="/post/:id/edit" exact>
123132
<EditPost />
124133
</Route>
125-
<Route path="/create-post">
134+
<Route path="/create-version">
126135
<CreatePost />
127136
</Route>
128137
<Route path="/about-us">
Lines changed: 265 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,265 @@
1+
import React, { useState, useEffect } from "react"
2+
3+
import { Vessel } from "../../vessel/build/vessel"
4+
import LineChart from "./LineChart"
5+
import PieChart from "./PieChart"
6+
import { Accordion, Card, Button } from "react-bootstrap"
7+
import Page from "../Page"
8+
9+
function AnalysisChart(props) {
10+
class DataStructure {
11+
constructor(xLabel) {
12+
this.chartData = {
13+
labels: [],
14+
datasets: []
15+
}
16+
17+
this.xLabel = this.chartData.labels
18+
}
19+
20+
pushDataSet = (labelText = "", color = [], hoverColor = []) => {
21+
this.chartData.datasets.push({
22+
label: labelText,
23+
data: [],
24+
backgroundColor: color,
25+
hoverBackgroundColor: hoverColor,
26+
borderColor: color,
27+
fill: false,
28+
pointHoverBackgroundColor: "rgba(166, 13, 13, 1)"
29+
})
30+
31+
const INDEX = this.chartData.datasets["length"] - 1
32+
33+
return this.chartData.datasets[INDEX].data
34+
}
35+
36+
setLabels(xLabel) {
37+
if (xLabel && xLabel.length !== 0) {
38+
xLabel.forEach(e => this.xLabel.push(e))
39+
} else {
40+
console.warn("Invalid data type in setLabels() method, probably xLabel === undefined or xLabel.lenght ==== 0")
41+
}
42+
}
43+
}
44+
45+
class VesselModels {
46+
constructor(params) {
47+
this.ship = params
48+
this.shipState = new Vessel.ShipState(this.ship.designState.getSpecification())
49+
this.propellerSpecification = new Object({
50+
AeAo: 0.55,
51+
D: 3,
52+
P: 1.2,
53+
beta1: 0.57,
54+
beta2: 0.44,
55+
gamma1: 0.105,
56+
gamma2: 0.077,
57+
noBlades: 4,
58+
noProps: 2
59+
})
60+
61+
this.wave = new Vessel.WaveCreator()
62+
63+
if (!this.ship.designState.calculationParameters.speed) {
64+
this.v_proj = 10
65+
} else {
66+
this.v_proj = this.ship.designState.calculationParameters.speed
67+
}
68+
69+
this.hullRes = new Vessel.HullResistance(this.ship, this.shipState, this.propellerSpecification, this.wave)
70+
this.hullRes.writeOutput()
71+
this.propellerInteraction = new Vessel.PropellerInteraction(this.ship, this.shipState, this.propellerSpecification)
72+
73+
this.setSpeed(this.v_proj)
74+
this.setPowerPercentages()
75+
}
76+
77+
setSpeed(speed) {
78+
this.hullRes.setSpeed(speed)
79+
this.hullRes.writeOutput()
80+
this.propellerInteraction.setSpeed(speed)
81+
this.propellerInteraction.writeOutput()
82+
}
83+
84+
setPowerPercentages() {
85+
var PPw = (100 * (this.hullRes.calmResistance.Rw * this.hullRes.coefficients.speedSI)) / this.propellerInteraction.resistanceState.Pe
86+
var PPf = (100 * (this.hullRes.calmResistance.Rf * this.hullRes.coefficients.speedSI)) / this.propellerInteraction.resistanceState.Pe
87+
var PPr = (100 * this.propellerInteraction.resistanceState.Pe) / this.propellerInteraction.resistanceState.Pe - PPw - PPf
88+
89+
this.percentages = new Object({
90+
Wave: PPw,
91+
Frictional: PPf,
92+
Residual: PPr
93+
})
94+
}
95+
}
96+
97+
function parseResistenceData(models) {
98+
var dataResitance = new DataStructure()
99+
var dataPower = new DataStructure()
100+
101+
var datasetTotal = dataResitance.pushDataSet("Total", "rgba(138, 103, 83, 0.6)")
102+
var datasetCalmResist = dataResitance.pushDataSet("Calm Water", "rgba(1, 28, 64, 0.6)")
103+
var datasetViscous = dataResitance.pushDataSet("Viscous", "rgba(115, 69, 41, 0.6)")
104+
var datasetWave = dataResitance.pushDataSet("Wave", "rgba(41, 85, 115, 0.6)")
105+
106+
var pieColor = ["rgba(1, 28, 64, 0.6)", "rgba(41, 85, 115, 0.6)", "rgba(166, 13, 13, 0.6)"]
107+
var hoverPieColor = ["rgba(1, 28, 64, 1)", "rgba(41, 85, 115, 1)", "rgba(166, 13, 13, 1)"]
108+
var datasetPower = dataPower.pushDataSet("Power percentage", pieColor, hoverPieColor)
109+
110+
if (isNaN(models.hullRes.calmResistance.Rt)) throw "Resistance not possible to be calculated"
111+
112+
for (let type of Object.keys(models.percentages)) {
113+
datasetPower.push(models.percentages[type].toFixed(2))
114+
dataPower.xLabel.push(type)
115+
}
116+
117+
for (let v = 0; v <= Math.floor(models.v_proj * 1.2); v++) {
118+
models.hullRes.setSpeed(v)
119+
120+
dataResitance.xLabel.push(v.toFixed(0))
121+
datasetCalmResist.push(models.hullRes.calmResistance.Rt.toFixed(2))
122+
datasetViscous.push(models.hullRes.calmResistance.Rf.toFixed(2))
123+
datasetWave.push(models.hullRes.calmResistance.Rw.toFixed(2))
124+
datasetTotal.push(models.hullRes.totalResistance.Rtadd.toFixed(2))
125+
}
126+
127+
return (
128+
<div className="container-fluid align-items-center p-3">
129+
<div className="row">
130+
<div className="col-lg-6 text-center ">
131+
<LineChart chartData={dataResitance.chartData} textTitle="Resistence by Velocity" xLabel="Ship Speed (Knots)" yLabel="Resistence (N)" legendPosition="top" />
132+
</div>
133+
<div className="col-lg-6 text-center ">
134+
<PieChart chartData={dataPower.chartData} textTitle={`Power % for ${models.v_proj} knots`} />
135+
</div>
136+
</div>
137+
</div>
138+
)
139+
}
140+
141+
function parseHydrostaticData(models) {
142+
var dataDisp = new DataStructure()
143+
var dataCenter = new DataStructure()
144+
var dataBuoyancy = new DataStructure()
145+
var dataCoeff = new DataStructure()
146+
147+
var datasetDisp = dataDisp.pushDataSet("Disp", "rgba(138, 103, 83, 0.6)")
148+
149+
var datasetLCB = dataCenter.pushDataSet("LCB", "rgba(1, 28, 64, 0.6)")
150+
var datasetLCF = dataCenter.pushDataSet("LCF", "rgba(115, 69, 41, 0.6)")
151+
152+
var datasetKB = dataBuoyancy.pushDataSet("KB", "rgba(41, 85, 115, 0.6)")
153+
var datasetBMt = dataBuoyancy.pushDataSet("KMt", "rgba(1, 28, 64, 0.6)")
154+
var datasetBMl = dataBuoyancy.pushDataSet("0.1 x KMl", "rgba(138, 103, 83, 0.6)")
155+
var datasetGMt = dataBuoyancy.pushDataSet("GMt", "rgba(166, 13, 13, 0.6)")
156+
157+
var datasetCb = dataCoeff.pushDataSet("Cb", "rgba(41, 85, 115, 0.6)")
158+
var datasetCm = dataCoeff.pushDataSet("Cm", "rgba(1, 28, 64, 0.6)")
159+
var datasetCp = dataCoeff.pushDataSet("Cp", "rgba(138, 103, 83, 0.6)")
160+
var datasetCWp = dataCoeff.pushDataSet("Cwp", "rgba(166, 13, 13, 0.6)")
161+
162+
var draft = 0.25
163+
var drafts = []
164+
var draftVariation = 0.25
165+
166+
var CG = models.ship.getWeight(models.shipState)
167+
168+
while (draft <= models.ship.structure.hull.attributes.Depth) {
169+
drafts.push(draft.toFixed(2))
170+
var attributes = models.ship.structure.hull.calculateAttributesAtDraft(draft)
171+
172+
datasetDisp.push(attributes["Vs"].toFixed(2))
173+
datasetLCB.push(attributes["LCB"].toFixed(2))
174+
datasetLCF.push(attributes["LCF"].toFixed(2))
175+
datasetKB.push(attributes["KB"].toFixed(2))
176+
datasetBMt.push(attributes["BMt"].toFixed(2))
177+
datasetBMl.push((0.1 * attributes["BMl"]).toFixed(2))
178+
datasetGMt.push(attributes["BMt"].toFixed(2))
179+
datasetCb.push(attributes["Cb"].toFixed(2))
180+
datasetCm.push(attributes["Cm"].toFixed(2))
181+
datasetCp.push(attributes["Cp"].toFixed(2))
182+
datasetCWp.push(attributes["Cwp"].toFixed(2))
183+
184+
draft = draft + draftVariation
185+
}
186+
187+
dataDisp.setLabels(drafts)
188+
dataCenter.setLabels(drafts)
189+
dataBuoyancy.setLabels(drafts)
190+
dataCoeff.setLabels(drafts)
191+
192+
return (
193+
<div className="container-fluid align-items-center p-3">
194+
<div className="row">
195+
<div className="col-lg-6 text-center ">
196+
<LineChart chartData={dataDisp.chartData} textTitle="Displacement x Draft" xLabel="Draft (m)" yLabel="Displacement (m^3)" displayLegend="false" />
197+
</div>
198+
<div className="col-lg-6 text-center ">
199+
<LineChart chartData={dataCenter.chartData} textTitle="Longitudinal Centers" xLabel="Draft (m)" yLabel="Value (m)" legendPosition="top" />
200+
</div>
201+
</div>
202+
<div className="row">
203+
<div className="col-lg-12 text-center ">
204+
<LineChart chartData={dataBuoyancy.chartData} textTitle={`Vertical Centers, with vertical CG = ${CG.cg.z.toFixed(2)} m`} xLabel="Draft (m)" yLabel="Displacement (m)" />
205+
</div>
206+
</div>
207+
<div className="row">
208+
<div className="col-lg-12 text-center ">
209+
<LineChart chartData={dataCoeff.chartData} textTitle="Adm. Coefficients" xLabel="Draft (m)" yLabel="Displacement (m)" />
210+
</div>
211+
</div>
212+
</div>
213+
)
214+
}
215+
216+
function returnAnalysis(params) {
217+
try {
218+
var models = new VesselModels(params)
219+
220+
return (
221+
<div>
222+
<Accordion defaultActiveKey="0">
223+
<Card>
224+
<Card.Header>
225+
<Accordion.Toggle as={Button} variant="secondary" eventKey="0">
226+
Resistance
227+
</Accordion.Toggle>
228+
</Card.Header>
229+
<Accordion.Collapse eventKey="0">
230+
<Card.Body>
231+
<div>{parseResistenceData(models)}</div>
232+
</Card.Body>
233+
</Accordion.Collapse>
234+
</Card>
235+
</Accordion>
236+
<Accordion defaultActiveKey="1">
237+
<Card>
238+
<Card.Header>
239+
<Accordion.Toggle as={Button} variant="secondary" eventKey="1">
240+
Hydrostatic
241+
</Accordion.Toggle>
242+
</Card.Header>
243+
<Accordion.Collapse eventKey="1">
244+
<Card.Body>
245+
<div> {parseHydrostaticData(models)}</div>
246+
</Card.Body>
247+
</Accordion.Collapse>
248+
</Card>
249+
</Accordion>
250+
</div>
251+
)
252+
} catch (e) {
253+
console.warn("Chart not feed with proper data:", e)
254+
return ""
255+
}
256+
}
257+
258+
return (
259+
<Page title="Analyisis" wide={true}>
260+
{returnAnalysis(props.state.ship)}
261+
</Page>
262+
)
263+
}
264+
265+
export default AnalysisChart

0 commit comments

Comments
 (0)