From cd0b45627f0d8da8c8dc4edde223f3c36e9bcfbf Mon Sep 17 00:00:00 2001 From: Fabian Mastenbroek Date: Sun, 25 Apr 2021 16:01:14 +0200 Subject: build: Migrate to flat project structure This change updates the project structure to become flattened. Previously, the simulator, frontend and API each lived into their own directory. With this change, all modules of the project live in the top-level directory of the repository. This should improve discoverability of modules of the project. --- .../src/components/home/ContactSection.js | 54 ++++++++++++++++++++++ .../src/components/home/ContactSection.sass | 15 ++++++ .../src/components/home/ContentSection.js | 19 ++++++++ .../src/components/home/ContentSection.sass | 9 ++++ .../src/components/home/IntroSection.js | 40 ++++++++++++++++ .../src/components/home/JumbotronHeader.js | 18 ++++++++ .../src/components/home/JumbotronHeader.sass | 24 ++++++++++ .../src/components/home/ModelingSection.js | 22 +++++++++ .../src/components/home/ScreenshotSection.js | 24 ++++++++++ .../src/components/home/ScreenshotSection.sass | 5 ++ .../src/components/home/SimulationSection.js | 22 +++++++++ .../src/components/home/StakeholderSection.js | 30 ++++++++++++ .../src/components/home/TeamSection.js | 53 +++++++++++++++++++++ .../src/components/home/TechnologiesSection.js | 40 ++++++++++++++++ 14 files changed, 375 insertions(+) create mode 100644 opendc-web/opendc-web-ui/src/components/home/ContactSection.js create mode 100644 opendc-web/opendc-web-ui/src/components/home/ContactSection.sass create mode 100644 opendc-web/opendc-web-ui/src/components/home/ContentSection.js create mode 100644 opendc-web/opendc-web-ui/src/components/home/ContentSection.sass create mode 100644 opendc-web/opendc-web-ui/src/components/home/IntroSection.js create mode 100644 opendc-web/opendc-web-ui/src/components/home/JumbotronHeader.js create mode 100644 opendc-web/opendc-web-ui/src/components/home/JumbotronHeader.sass create mode 100644 opendc-web/opendc-web-ui/src/components/home/ModelingSection.js create mode 100644 opendc-web/opendc-web-ui/src/components/home/ScreenshotSection.js create mode 100644 opendc-web/opendc-web-ui/src/components/home/ScreenshotSection.sass create mode 100644 opendc-web/opendc-web-ui/src/components/home/SimulationSection.js create mode 100644 opendc-web/opendc-web-ui/src/components/home/StakeholderSection.js create mode 100644 opendc-web/opendc-web-ui/src/components/home/TeamSection.js create mode 100644 opendc-web/opendc-web-ui/src/components/home/TechnologiesSection.js (limited to 'opendc-web/opendc-web-ui/src/components/home') diff --git a/opendc-web/opendc-web-ui/src/components/home/ContactSection.js b/opendc-web/opendc-web-ui/src/components/home/ContactSection.js new file mode 100644 index 00000000..42bdab8a --- /dev/null +++ b/opendc-web/opendc-web-ui/src/components/home/ContactSection.js @@ -0,0 +1,54 @@ +import React from 'react' +import FontAwesome from 'react-fontawesome' +import './ContactSection.sass' +import ContentSection from './ContentSection' + +const ContactSection = () => ( + +
+
+ + +
+ atlarge-research/opendc + +
+
+ + + +
+
+
+ TU Delft +
+
+
+
+ A project by the   + + @Large Research Group + + . +
+
+
+
+ +
+ OpenDC is an experimental tool. Your data may get lost, overwritten, or otherwise become unavailable. +
+ The OpenDC authors should in no way be liable in the event this happens (see our{' '} + + license + + ). Sorry for the inconvenience. +
+
+ +) + +export default ContactSection diff --git a/opendc-web/opendc-web-ui/src/components/home/ContactSection.sass b/opendc-web/opendc-web-ui/src/components/home/ContactSection.sass new file mode 100644 index 00000000..997f8d98 --- /dev/null +++ b/opendc-web/opendc-web-ui/src/components/home/ContactSection.sass @@ -0,0 +1,15 @@ +.contact-section + background-color: #444 + color: #ddd + + a + color: #ddd + + a:hover + color: #fff + + .tudelft-icon + height: 100px + + .disclaimer + color: #cccccc diff --git a/opendc-web/opendc-web-ui/src/components/home/ContentSection.js b/opendc-web/opendc-web-ui/src/components/home/ContentSection.js new file mode 100644 index 00000000..9d4832d9 --- /dev/null +++ b/opendc-web/opendc-web-ui/src/components/home/ContentSection.js @@ -0,0 +1,19 @@ +import classNames from 'classnames' +import PropTypes from 'prop-types' +import React from 'react' +import './ContentSection.sass' + +const ContentSection = ({ name, title, children }) => ( +
+
+

{title}

+ {children} +
+
+) + +ContentSection.propTypes = { + name: PropTypes.string.isRequired, +} + +export default ContentSection diff --git a/opendc-web/opendc-web-ui/src/components/home/ContentSection.sass b/opendc-web/opendc-web-ui/src/components/home/ContentSection.sass new file mode 100644 index 00000000..a4c8bd66 --- /dev/null +++ b/opendc-web/opendc-web-ui/src/components/home/ContentSection.sass @@ -0,0 +1,9 @@ +@import ../../style-globals/_variables.sass + +.content-section + padding-top: 50px + padding-bottom: 150px + text-align: center + + h1 + margin-bottom: 30px diff --git a/opendc-web/opendc-web-ui/src/components/home/IntroSection.js b/opendc-web/opendc-web-ui/src/components/home/IntroSection.js new file mode 100644 index 00000000..a799272a --- /dev/null +++ b/opendc-web/opendc-web-ui/src/components/home/IntroSection.js @@ -0,0 +1,40 @@ +import React from 'react' + +const IntroSection = () => ( +
+
+
+
+

The datacenter (DC) industry...

+
    +
  • Is worth over $15 bn, and growing
  • +
  • Has many hard-to-grasp concepts
  • +
  • Needs to become accessible to many
  • +
+
+ +
+

OpenDC provides...

+
    +
  • Collaborative online DC modeling
  • +
  • Diverse and effective DC simulation
  • +
  • Exploratory DC performance feedback
  • +
+
+
+
+
+) + +export default IntroSection diff --git a/opendc-web/opendc-web-ui/src/components/home/JumbotronHeader.js b/opendc-web/opendc-web-ui/src/components/home/JumbotronHeader.js new file mode 100644 index 00000000..7b410679 --- /dev/null +++ b/opendc-web/opendc-web-ui/src/components/home/JumbotronHeader.js @@ -0,0 +1,18 @@ +import React from 'react' +import './JumbotronHeader.sass' + +const JumbotronHeader = () => ( +
+
+
+

+ OpenDC +

+

Collaborative Datacenter Simulation and Exploration for Everybody

+ OpenDC +
+
+
+) + +export default JumbotronHeader diff --git a/opendc-web/opendc-web-ui/src/components/home/JumbotronHeader.sass b/opendc-web/opendc-web-ui/src/components/home/JumbotronHeader.sass new file mode 100644 index 00000000..1b6a89fd --- /dev/null +++ b/opendc-web/opendc-web-ui/src/components/home/JumbotronHeader.sass @@ -0,0 +1,24 @@ +.jumbotron-header + background: #00A6D6 + +.jumbotron + background-color: inherit + margin-bottom: 0 + + padding-top: 120px + padding-bottom: 120px + + img + max-width: 110px + + h1 + color: #fff + font-size: 4.5em + + .dc + color: #fff + font-weight: bold + + .lead + color: #fff + font-size: 1.4em diff --git a/opendc-web/opendc-web-ui/src/components/home/ModelingSection.js b/opendc-web/opendc-web-ui/src/components/home/ModelingSection.js new file mode 100644 index 00000000..643dca65 --- /dev/null +++ b/opendc-web/opendc-web-ui/src/components/home/ModelingSection.js @@ -0,0 +1,22 @@ +import React from 'react' +import ScreenshotSection from './ScreenshotSection' + +const ModelingSection = () => ( + +

Collaboratively...

+
    +
  • Model DC layout, and room locations and types
  • +
  • Place racks in rooms and nodes in racks
  • +
  • Add real-world CPU, GPU, memory, storage and network units to each node
  • +
  • Select from diverse scheduling policies
  • +
+
+) + +export default ModelingSection diff --git a/opendc-web/opendc-web-ui/src/components/home/ScreenshotSection.js b/opendc-web/opendc-web-ui/src/components/home/ScreenshotSection.js new file mode 100644 index 00000000..c987d5d0 --- /dev/null +++ b/opendc-web/opendc-web-ui/src/components/home/ScreenshotSection.js @@ -0,0 +1,24 @@ +import classNames from 'classnames' +import React from 'react' +import ContentSection from './ContentSection' +import './ScreenshotSection.sass' + +const ScreenshotSection = ({ name, title, imageUrl, caption, imageIsRight, children }) => ( + +
+
+ {children} +
+
+ {caption} +
{caption}
+
+
+
+) + +export default ScreenshotSection diff --git a/opendc-web/opendc-web-ui/src/components/home/ScreenshotSection.sass b/opendc-web/opendc-web-ui/src/components/home/ScreenshotSection.sass new file mode 100644 index 00000000..2f454cb4 --- /dev/null +++ b/opendc-web/opendc-web-ui/src/components/home/ScreenshotSection.sass @@ -0,0 +1,5 @@ +.screenshot + outline: 2px black solid + padding-left: 0 + padding-right: 0 + margin-bottom: 5px diff --git a/opendc-web/opendc-web-ui/src/components/home/SimulationSection.js b/opendc-web/opendc-web-ui/src/components/home/SimulationSection.js new file mode 100644 index 00000000..b0244cb5 --- /dev/null +++ b/opendc-web/opendc-web-ui/src/components/home/SimulationSection.js @@ -0,0 +1,22 @@ +import React from 'react' +import ScreenshotSection from './ScreenshotSection' + +const ModelingSection = () => ( + +

Working with OpenDC:

+
    +
  • Seamlessly switch between construction and simulation modes
  • +
  • Choose one of several predefined workloads (Big Data, Bag of Tasks, Hadoop, etc.)
  • +
  • Play, pause, and skip around the informative simulation timeline
  • +
  • Visualize and demo live
  • +
+
+) + +export default ModelingSection diff --git a/opendc-web/opendc-web-ui/src/components/home/StakeholderSection.js b/opendc-web/opendc-web-ui/src/components/home/StakeholderSection.js new file mode 100644 index 00000000..e5ed9683 --- /dev/null +++ b/opendc-web/opendc-web-ui/src/components/home/StakeholderSection.js @@ -0,0 +1,30 @@ +import React from 'react' +import ContentSection from './ContentSection' + +const Stakeholder = ({ name, title, subtitle }) => ( +
+ {title} +
+

{title}

+

{subtitle}

+
+
+) + +const StakeholderSection = () => ( + +
+ + + + + +
+
+) + +export default StakeholderSection diff --git a/opendc-web/opendc-web-ui/src/components/home/TeamSection.js b/opendc-web/opendc-web-ui/src/components/home/TeamSection.js new file mode 100644 index 00000000..4b6f1e25 --- /dev/null +++ b/opendc-web/opendc-web-ui/src/components/home/TeamSection.js @@ -0,0 +1,53 @@ +import React from 'react' +import ContentSection from './ContentSection' + +const TeamMember = ({ photoId, name, description }) => ( +
+ {name} +
+

{name}

+
{description}
+
+
+) + +const TeamSection = () => ( + +
+ + + + + +
+
+ See{' '} + + atlarge.science/opendc + {' '} + for the full team! +
+
+) + +export default TeamSection diff --git a/opendc-web/opendc-web-ui/src/components/home/TechnologiesSection.js b/opendc-web/opendc-web-ui/src/components/home/TechnologiesSection.js new file mode 100644 index 00000000..c6013c71 --- /dev/null +++ b/opendc-web/opendc-web-ui/src/components/home/TechnologiesSection.js @@ -0,0 +1,40 @@ +import React from 'react' +import FontAwesome from 'react-fontawesome' +import ContentSection from './ContentSection' + +const TechnologiesSection = () => ( + +
    +
  • + + + Browser + + JavaScript, React, Redux, Konva +
  • +
  • + + + Server + + Python, Flask, FlaskSocketIO, OpenAPI +
  • +
  • + + + Database + + MongoDB +
  • +
  • + + + Simulator + + Kotlin +
  • +
+
+) + +export default TechnologiesSection -- cgit v1.2.3