Refactoring a lot of code

This commit is contained in:
2018-04-09 07:05:06 +10:00
parent 914b1beef8
commit 63d1e21b9a
26 changed files with 314 additions and 406 deletions

View File

@ -12,20 +12,11 @@
import React from 'react';
import { connect } from 'react-redux';
import Language from './../../language/Language';
import Page from './../Page';
import Poly from './../sections/Poly';
import TitleSection from './../sections/TitleSection';
import BodySection from './../sections/BodySection';
import SplitSection from './../sections/SplitSection';
import VideoTitle from './../title/VideoTitle';
import Window95 from './../w95/Window95';
import domsHead from './../../images/profile.png';
import aboutMP4 from './../../videos/about/about.mp4';
import programmingMP4 from './../../videos/about/programming.mp4';
import apiMP4 from './../../videos/about/api.mp4';
import otherMP4 from './../../videos/about/other.mp4';
import AboutScene from './../../3d/scenes/AboutScene';
class AboutPage extends React.Component {
constructor(props) {
@ -35,52 +26,16 @@ class AboutPage extends React.Component {
render() {
return (
<Page className="c-page--style-about">
<Poly />
{/* Bio */}
<SplitSection
className="c-page--style-about__bio-section"
leftClass="c-page--style-about__profile-container"
left={ <img src={domsHead} className="c-page--style-about__profile" /> }
right={
<Window95 title="Bio" className="c-window--style-about">
<div className="c-text-field">
<p>{ Language.get("about.descriptions.welcome") }</p>
</div>
</Window95>
}
rightClass="c-page--style-about__blurb"
<TitleSection
title="about.titles.me"
scene={<AboutScene />}
/>
{/* About Me */}
<BodySection
className="c-about-page__body-section"
title={
<VideoTitle
title="about.titles.me" mp4={aboutMP4}
/>
}
>
{ Language.get("about.descriptions.me") }
<BodySection>
Test
</BodySection>
{/* Programming */}
<BodySection className="c-about-page__body-section" title={[
<VideoTitle title="about.titles.programming" mp4={programmingMP4} to="/about/programming" />,
<VideoTitle title="about.titles.apis" mp4={apiMP4} to="/about/api" />,
<VideoTitle title="about.titles.other" mp4={otherMP4} to="/about/other" />
]}></BodySection>
</Page>
);
}
}
const mapStateToProps = function(state) {
return {
code: state.language.code
}
}
export default connect(mapStateToProps)(AboutPage);
export default AboutPage;

View File

@ -12,8 +12,8 @@
import React from 'react';
import Page from './../Page';
import PhoneSection from './../sections/PhoneSection';
import BodySection from './../sections/BodySection';
import TitleSection from './../sections/TitleSection';
import ContactForm from './../forms/ContactForm';
@ -28,15 +28,16 @@ class ContactPage extends React.Component {
render() {
return (
<Page>
<PhoneSection />
<TitleSection title="contact.form.title" />
<BodySection>
<h1>{Language.get("contact.form.title")}</h1>
<p>
{Language.get("contact.form.info")}
</p>
<div className="c-page--style-container__split">
<ContactForm className="c-page--style-container__split-part" />
<div className="c-page--style-container__split-part"></div>
<div className="c-page--style-container__split-part">
<p>
{Language.get("contact.form.info")}
</p>
</div>
</div>
</BodySection>
</Page>

View File

@ -12,7 +12,6 @@
import React from 'react';
import Page from './../Page';
import Poly from './../sections/Poly';
import BodySection from './../sections/BodySection';
import SplitSection from './../sections/SplitSection';
import { connect } from 'react-redux';
@ -26,9 +25,13 @@ class IndexPage extends React.Component {
render() {
return (
<Page>
<Poly />
<BodySection unpadded>
<SplitSection left={
"test"
} right={
"tost"
}
/>
<BodySection>
<h1>Lorem</h1>
</BodySection>
</Page>

View File

@ -1,7 +1,6 @@
import React from 'react';
import Page from './../Page';
import Poly from './../sections/Poly';
import BodySection from './../sections/BodySection';
class KitchenSinkPage extends React.Component {
@ -12,7 +11,6 @@ class KitchenSinkPage extends React.Component {
render() {
return (
<Page>
<Poly />
<BodySection>
<h1>This is the primary heading and there should only be one of these per page</h1>
@ -128,7 +126,7 @@ class KitchenSinkPage extends React.Component {
</tr>
</tbody>
</table>
<h3>A sub heading which is not as important as the second, but should be used with consideration</h3>
<p>
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.

View File

@ -0,0 +1,84 @@
/*
* About Page
* About that one lad.
*
* Dependencies:
* styles/components/_page--style-about.scss
*
* Version:
* 1.0.0 - 2018/03/18
*/
import React from 'react';
import { connect } from 'react-redux';
import Language from './../../language/Language';
import Page from './../Page';
import BodySection from './../sections/BodySection';
import SplitSection from './../sections/SplitSection';
import VideoTitle from './../title/VideoTitle';
import Window95 from './../w95/Window95';
import domsHead from './../../images/profile.png';
import aboutMP4 from './../../videos/about/about.mp4';
import programmingMP4 from './../../videos/about/programming.mp4';
import apiMP4 from './../../videos/about/api.mp4';
import otherMP4 from './../../videos/about/other.mp4';
class AboutPage extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<Page className="c-page--style-about">
{/* Bio */}
<SplitSection
className="c-page--style-about__bio-section"
leftClass="c-page--style-about__profile-container"
left={ <img src={domsHead} className="c-page--style-about__profile" /> }
right={
<Window95 title="Bio" className="c-window--style-about">
<div className="c-text-field">
<p>{ Language.get("about.descriptions.welcome") }</p>
</div>
</Window95>
}
rightClass="c-page--style-about__blurb"
/>
{/* About Me */}
<BodySection
className="c-about-page__body-section"
title={
<VideoTitle
title="about.titles.me" mp4={aboutMP4}
/>
}
>
{ Language.get("about.descriptions.me") }
</BodySection>
{/* Programming */}
<BodySection className="c-about-page__body-section" title={[
<VideoTitle title="about.titles.programming" mp4={programmingMP4} to="/about/programming" />,
<VideoTitle title="about.titles.apis" mp4={apiMP4} to="/about/api" />,
<VideoTitle title="about.titles.other" mp4={otherMP4} to="/about/other" />
]}></BodySection>
</Page>
);
}
}
const mapStateToProps = function(state) {
return {
code: state.language.code
}
}
export default connect(mapStateToProps)(AboutPage);

View File

@ -1,41 +0,0 @@
/*
* About Page
* About that one lad.
*
* Dependencies:
* styles/components/_page--style-about.scss
*
* Version:
* 1.0.0 - 2018/03/11
*/
import React from 'react';
import { connect } from 'react-redux';
import Page from './../Page';
import Poly from './../sections/Poly';
import BodySection from './../sections/BodySection';
import SplitSection from './../sections/SplitSection';
import Language from './../../language/Language';
class TestAboutPage extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<Page className="c-page--style-about">
About
</Page>
)
}
}
const mapStateToProps = function(state) {
return {
code: state.language.code
}
}
export default connect(mapStateToProps)(TestAboutPage);

View File

@ -13,7 +13,6 @@ import { connect } from 'react-redux';
import Language from './../../../language/Language';
import Page from './../../Page';
import Poly from './../../sections/Poly';
import BodySection from './../../sections/BodySection';
import VideoTitle from './../../title/VideoTitle';
import SkillBox from './SkillBox';
@ -28,8 +27,6 @@ class APIPage extends React.Component {
render() {
return (
<Page className="c-page--style-api-skills">
<Poly />
<BodySection
title={
<VideoTitle

View File

@ -13,7 +13,6 @@ import { connect } from 'react-redux';
import Language from './../../../language/Language';
import Page from './../../Page';
import Poly from './../../sections/Poly';
import BodySection from './../../sections/BodySection';
import VideoTitle from './../../title/VideoTitle';
import SkillBox from './SkillBox';
@ -28,7 +27,6 @@ class OtherSkillsPage extends React.Component {
render() {
return (
<Page className="c-page--style-other-skills">
<Poly />
<BodySection
title={

View File

@ -13,7 +13,6 @@ import { connect } from 'react-redux';
import Language from './../../../language/Language';
import Page from './../../Page';
import Poly from './../../sections/Poly';
import BodySection from './../../sections/BodySection';
import VideoTitle from './../../title/VideoTitle';
import SkillBox from './SkillBox';
@ -28,7 +27,6 @@ class ProgrammingPage extends React.Component {
render() {
return (
<Page className="c-page--style-programming">
<Poly />
<BodySection
title={