Skip to content

Commit b496f64

Browse files
nygrenhnygrenh
committed
Add the rest of the intitial pages
1 parent 9168771 commit b496f64

7 files changed

Lines changed: 2438 additions & 2211 deletions

File tree

‎package-lock.json‎

Lines changed: 2254 additions & 2120 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,22 @@
11
{
22
"name": "ohjelmoinnin-mooc",
33
"dependencies": {
4-
"@fortawesome/fontawesome-svg-core": "^1.2.2",
5-
"@fortawesome/free-solid-svg-icons": "^5.2.0",
6-
"@fortawesome/react-fontawesome": "^0.1.0",
7-
"babel-plugin-styled-components": "^1.5.1",
8-
"gatsby": "next",
9-
"gatsby-plugin-react-helmet": "next",
10-
"gatsby-plugin-styled-components": "^3.0.0-beta.2",
4+
"@fortawesome/fontawesome-svg-core": "^1.2.4",
5+
"@fortawesome/free-solid-svg-icons": "^5.3.1",
6+
"@fortawesome/react-fontawesome": "^0.1.3",
7+
"babel-plugin-styled-components": "^1.7.1",
8+
"gatsby": "^2.0.0",
9+
"gatsby-plugin-react-helmet": "^3.0.0",
10+
"gatsby-plugin-styled-components": "^3.0.0",
1111
"interactjs": "^1.3.4",
1212
"moment": "^2.22.2",
13-
"react": "^16.4.1",
14-
"react-calendar-timeline": "^0.17.3",
15-
"react-dom": "^16.4.1",
13+
"react": "^16.5.2",
14+
"react-calendar-timeline": "^0.19.0",
15+
"react-dom": "^16.5.2",
1616
"react-helmet": "^5.2.0",
1717
"react-motion": "^0.5.2",
1818
"react-scrollspy": "^3.3.5",
19-
"styled-components": "^3.3.3",
19+
"styled-components": "^3.4.9",
2020
"typeface-open-sans-condensed": "0.0.54"
2121
},
2222
"keywords": [
@@ -30,6 +30,6 @@
3030
"test": "echo \"Error: no test specified\" && exit 1"
3131
},
3232
"devDependencies": {
33-
"prettier": "^1.12.0"
33+
"prettier": "^1.14.3"
3434
}
3535
}

‎src/components/Sidebar.js‎

Lines changed: 11 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -33,52 +33,20 @@ const TopContainer = styled.div`
3333
align-items: center;
3434
`
3535

36-
const content = [
36+
37+
const content2 = [
3738
{
38-
name: 'Johdanto',
39-
childrenVisibleByDefault: true,
40-
children: [
41-
{
42-
name: 'Kurssista',
43-
childrenVisibleByDefault: true,
44-
children: [
45-
{ name: 'Yleistä', href: '#yleistä' },
46-
{ name: 'Kurssin kaksi versiota', href: '#kurssin-kaksi-versiota' },
47-
{ name: 'Sisältö ja aikataulu', href: '#sisältö-ja-aikataulu' },
48-
{ name: 'Kokeet ja arvostelu' },
49-
],
50-
},
51-
{
52-
name: 'Opinto-oikeus',
53-
children: [
54-
{ name: 'Tietoa' },
55-
{ name: 'Näyttökoe' },
56-
{ name: 'Hyödyllistä tietoa' },
57-
],
58-
},
59-
{
60-
name: 'Opettajille ja opinto-ohjaajille',
61-
children: [
62-
{ name: 'Opetuksessa käyttö' },
63-
{ name: 'Oma versio kurssista' },
64-
],
65-
},
66-
],
39+
name: 'Tietoa kurssista',
40+
href: '/'
6741
},
6842
{
69-
name: 'Osa 1 -- Ensiaskeleet',
70-
children: [
71-
{
72-
name: 'Ohjelma ja lähdekoodi',
73-
children: [
74-
{ name: 'Ohjelmarunko' },
75-
{
76-
name: 'Ohjelman osia',
77-
},
78-
],
79-
},
80-
],
43+
name: 'Mahdollisuus opinto-oikeuteen',
44+
href: '/opinto-oikeus'
8145
},
46+
{
47+
name: 'Opettajille ja opinto-ohjaajille',
48+
href: '/opettajille'
49+
}
8250
]
8351

8452
export default class Sidebar extends React.Component {
@@ -89,7 +57,7 @@ export default class Sidebar extends React.Component {
8957
<Logo />
9058
<StyledIcon icon={faArrowAltCircleLeft} size="2x" />
9159
</TopContainer>
92-
<TreeView data={content} />
60+
<TreeView data={content2} />
9361
{/* <ul>
9462
<li>Johdanto</li>
9563
<ul>

‎src/components/TreeView/TreeViewItem.js‎

Lines changed: 54 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@ import { Motion, spring } from 'react-motion'
66
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
77
import { faCaretRight } from '@fortawesome/free-solid-svg-icons'
88
import { trackElementHeight } from '../../util/trackHeight'
9+
import GatsbyLink from 'gatsby-link'
10+
import { Location } from '@reach/router'
911

1012
const ChildrenList = styled.ul`
1113
height: calc(var(--open-ratio) * var(--calculated-height) * 1px);
@@ -19,6 +21,13 @@ const ListItem = styled.li`
1921
padding: 0.5rem;
2022
`
2123

24+
const NavigationLink = styled(GatsbyLink)`
25+
${props => props.active == "t" && `
26+
background-color: #ffccc6;
27+
width: 100%;
28+
`}
29+
`
30+
2231
const ItemTitleWrapper = styled.div`
2332
display: flex;
2433
align-items: center;
@@ -68,42 +77,53 @@ export default class TreeViewItem extends React.Component {
6877
render() {
6978
return (
7079
<React.Fragment>
71-
<Motion
72-
style={{ openRatio: spring(this.state.childrenVisible ? 1 : 0) }}
73-
>
74-
{({ openRatio }) => (
75-
<React.Fragment>
76-
<ItemTitleWrapper
77-
className={`nav-item-${this.props.item.name
78-
.toLowerCase()
79-
.replace(/ /g, '-')}`}
80-
>
81-
{this.props.item.children && (
82-
<StyledIcon
83-
style={{ '--open-ratio': `${openRatio}` }}
84-
icon={faCaretRight}
85-
size="1x"
86-
/>
87-
)}
88-
<a href={this.props.item.href}>
89-
<ListItem onClick={this.onClick}>
90-
{this.props.item.name}
91-
</ListItem>
92-
</a>
93-
</ItemTitleWrapper>
94-
{this.props.item.children && (
95-
<ChildrenList
96-
innerRef={this.childrenListRef}
97-
style={{ '--open-ratio': `${openRatio}` }}
98-
>
99-
{this.props.item.children.map(i => (
100-
<TreeViewItem key={i.name} item={i} />
101-
))}
102-
</ChildrenList>
80+
<Location>
81+
{({ navigate, location }) => (
82+
<Motion
83+
style={{
84+
openRatio: spring(this.state.childrenVisible ? 1 : 0),
85+
}}
86+
>
87+
{({ openRatio }) => (
88+
<React.Fragment>
89+
<ItemTitleWrapper
90+
className={`nav-item-${this.props.item.name
91+
.toLowerCase()
92+
.replace(/ /g, '-')}`}
93+
>
94+
{this.props.item.children && (
95+
<StyledIcon
96+
style={{ '--open-ratio': `${openRatio}` }}
97+
icon={faCaretRight}
98+
size="1x"
99+
/>
100+
)}
101+
<NavigationLink
102+
to={this.props.item.href}
103+
active={
104+
this.props.item.href == location.pathname ? 't' : 'f'
105+
}
106+
>
107+
<ListItem onClick={this.onClick}>
108+
{this.props.item.name}
109+
</ListItem>
110+
</NavigationLink>
111+
</ItemTitleWrapper>
112+
{this.props.item.children && (
113+
<ChildrenList
114+
innerRef={this.childrenListRef}
115+
style={{ '--open-ratio': `${openRatio}` }}
116+
>
117+
{this.props.item.children.map(i => (
118+
<TreeViewItem key={i.name} item={i} />
119+
))}
120+
</ChildrenList>
121+
)}
122+
</React.Fragment>
103123
)}
104-
</React.Fragment>
124+
</Motion>
105125
)}
106-
</Motion>
126+
</Location>
107127
</React.Fragment>
108128
)
109129
}

‎src/pages/index.js‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ const IndexPage = () => (
1414
<Banner />
1515
<Layout>
1616
<section id="yleistä">
17+
<h1>Tietoa kurssista</h1>
1718
<p>
1819
Ohjelmoinnin MOOC on ilmainen verkkokurssi, jossa perehdytään
1920
algoritmien laatimiseen ja nykyaikaisen ohjelmoinnin perusideoihin.
@@ -64,8 +65,6 @@ const IndexPage = () => (
6465
alettua.
6566
</p>
6667

67-
<ScheduleTimeline />
68-
6968
<table>
7069
<thead>
7170
<tr>

‎src/pages/opettajille.js‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import React, { Fragment } from 'react'
2+
3+
import Layout from '../components/layout'
4+
import Banner from '../components/Banner'
5+
import ScheduleTimeline from '../components/ScheduleTimeline'
6+
import MailinglistForm from '../components/MailinglistForm'
7+
import Sidebar from '../components/Sidebar'
8+
import ContentArea from '../components/ContentArea'
9+
10+
const IndexPage = () => (
11+
<Fragment>
12+
<Sidebar />
13+
<ContentArea>
14+
<Banner />
15+
<Layout>
16+
<section id="yleistä">
17+
<h1>Opettajille ja opinto-ohjaajille</h1>
18+
<p>
19+
Kurssin tai sen osan saa ottaa vapaasti osaksi peruskoulun, lukion,
20+
ammattikoulun, ammattikorkeakoulun tai yliopiston opintotarjontaa.
21+
Sano opiskelijoillesi, että osallistuvat kurssille ja järjestä
22+
halutessasi yhteisiä aikoja tehtävien tekemiseen.
23+
</p>
24+
<p>
25+
Jos haluat, että kurssillasi on koe ja opiskelijasi saavat kurssista
26+
merkinnän Helsingin yliopiston Avoimelta yliopistolta, ohjeista
27+
opiskelijasi osallistumaan Helsingin yliopiston Avoimen yliopiston
28+
ilmaiseksi tarjoamaan kokeeseen. Saat lisätietoja tästä
29+
järjestelystä ottamalla meihin yhteyttä (mooc@cs.helsinki.fi).
30+
</p>
31+
<p>
32+
Avoimen yliopiston kurssisuoritus luetaan automaattisesti osaksi
33+
Helsingin yliopiston opintoja. Useat toisen asteen oppilaitokset
34+
kuten lukiot tarjoavat Ohjelmoinnin MOOCin suorittamisesta useita
35+
kursseja.
36+
</p>
37+
</section>
38+
</Layout>
39+
</ContentArea>
40+
</Fragment>
41+
)
42+
43+
export default IndexPage

‎src/pages/opinto-oikeus.js‎

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
import React, { Fragment } from 'react'
2+
3+
import Layout from '../components/layout'
4+
import Banner from '../components/Banner'
5+
import ScheduleTimeline from '../components/ScheduleTimeline'
6+
import MailinglistForm from '../components/MailinglistForm'
7+
import Sidebar from '../components/Sidebar'
8+
import ContentArea from '../components/ContentArea'
9+
10+
const IndexPage = () => (
11+
<Fragment>
12+
<Sidebar />
13+
<ContentArea>
14+
<Banner />
15+
<Layout>
16+
<section id="yleistä">
17+
<h1>Mahdollisuus opinto-oikeuteen</h1>
18+
<p>
19+
Keväällä 2019 järjestettävä aikataulutettu Ohjelmoinnin MOOC antaa
20+
mahdollisuuden päästä opiskelemaan tietojenkäsittelytieteen
21+
kandiohjelmaan, matemaattis-luonnontieteelliseen tiedekuntaan,
22+
Helsingin yliopistoon.
23+
</p>
24+
<p>
25+
Opinto-oikeuden hakeminen Ohjelmoinnin MOOCin kautta edellyttää
26+
osallistumista aikataulutettuun versioon, tehtävien tekemistä
27+
annetussa aikataulussa, sekä osallistumista toukokuussa
28+
järjestettävään näyttökokeeseen.
29+
</p>
30+
<p>
31+
Saat kutsun näyttökokeeseen tekemällä aikataulutetun kurssin
32+
jokaisesta osasta vähintään 90% saatavissa olevista pisteistä.
33+
Pisteiden laskemisessa otetaan huomioon vain ohjelmointitehtävät.
34+
Kyselyt sekä mahdollisesti sivulla näkyvä visualisaatio eivät
35+
vaikuta näihin pisteisiin.
36+
</p>
37+
<p>
38+
Näyttökokeen menestyksekkäästi suorittamalla sinulla on mahdollisuus
39+
saada opinto-oikeus tietojenkäsittelytieteen luonnontieteen
40+
kandidaatin (LuK) ja filosofian maisterin (FM) tutkintoihin.
41+
Näyttökokeeseessa tehdään kurssitehtävien kaltainen hieman laajempi
42+
ohjelmointitehtävä, sekä kirjoitetaan lyhyt kirjoitelma.
43+
</p>
44+
<p>
45+
MOOC-kurssin perusteella haetaan päähaussa, joka on osa yhteishakua.
46+
Sinun tulee siis täyttää päähaun hakulomake, jossa asetat Helsingin
47+
Yliopiston tietojenkäsittelytieteen ohjelman haluamallesi
48+
prioriteetille.
49+
</p>
50+
<p>
51+
Yhteishaun hakuaika on <b>TODO: YHTEISHAUN HAKUAIKA TÄHÄN</b>
52+
</p>
53+
<p>
54+
Hakulomake sekä lisää tietoa päähausta ja opinnoista löytyy
55+
osoitteesta <b>TODO: Linkki tähän</b>.
56+
</p>
57+
</section>
58+
</Layout>
59+
</ContentArea>
60+
</Fragment>
61+
)
62+
63+
export default IndexPage

0 commit comments

Comments
 (0)