diff --git a/src/components/CollectiveImage.js b/src/components/CollectiveImage.js
new file mode 100644
index 00000000..c29b8077
--- /dev/null
+++ b/src/components/CollectiveImage.js
@@ -0,0 +1,9 @@
+const React = require('react')
+
+module.exports = ({data}) => (
+
+)
diff --git a/src/components/Image.js b/src/components/Image.js
new file mode 100644
index 00000000..f2b71b24
--- /dev/null
+++ b/src/components/Image.js
@@ -0,0 +1,12 @@
+const React = require('react')
+
+module.exports = ({data, alt, opa = true}) => (
+
+
`${url} ${density}x`)}
+ />
+
+)
diff --git a/src/components/TeacherCard.js b/src/components/TeacherCard.js
new file mode 100644
index 00000000..7a9ce22a
--- /dev/null
+++ b/src/components/TeacherCard.js
@@ -0,0 +1,37 @@
+const React = require('react')
+const Image = require('./Image')
+
+const Head = ({url, children}) => (
+
-
-
{name[0]} {name[1]} {name[2]}
-
-
-
-
{profile.position}
-
{profile.status}
-
Образование: {profile.edu}
-
Диплом: {profile.diploma}
-
-
{getHtml(biography)}
diff --git a/src/core/Config.js b/src/core/Config.js
index 39b07c80..64f3352d 100644
--- a/src/core/Config.js
+++ b/src/core/Config.js
@@ -24,6 +24,7 @@ class Config {
this.articlesPerPage = data.articlesPerPage || 5
this.collectiveOrder = data.collectiveOrder || []
this.articleCardDefaultPreview = data.articleCardDefaultPreview
+ this.collectiveImage = data.collectiveImage
this.redirect = new Map(Object
.entries(data.redirect)
diff --git a/src/core/Image.js b/src/core/Image.js
index 1fa0965c..dc096a3f 100644
--- a/src/core/Image.js
+++ b/src/core/Image.js
@@ -47,16 +47,18 @@ class Image {
const a = this.getArtifact(size)
const a2 = this.getArtifact(retinaSize)
+ const srcset = !a2
+ ? null
+ : [{
+ url: a2.url,
+ density: ImageArtifactType.RETINA_DENSITY,
+ }]
+
return {
src: a.url,
width: a.width,
height: a.height,
- set: [
- {
- url: a2.url,
- density: ImageArtifactType.RETINA_DENSITY,
- }
- ]
+ set: srcset,
}
}
}
diff --git a/src/core/ImageArtifactType.js b/src/core/ImageArtifactType.js
index 5a8722c4..9c85b01f 100644
--- a/src/core/ImageArtifactType.js
+++ b/src/core/ImageArtifactType.js
@@ -7,7 +7,8 @@ class ImageArtifactType {
ImageArtifactType.SMALL = 'small'
ImageArtifactType.MEDIUM = 'medium'
ImageArtifactType.BIG = 'big'
-ImageArtifactType.ORIGIN = 'origin'
+ImageArtifactType.ORIGIN = 'original'
+ImageArtifactType.ORIGINAL = 'original'
ImageArtifactType.FACEBOOK = 'fb'
diff --git a/src/core/Teacher.js b/src/core/Teacher.js
index cdb5b652..bcc09306 100644
--- a/src/core/Teacher.js
+++ b/src/core/Teacher.js
@@ -20,7 +20,7 @@ class Teacher {
constructor(data) {
this.id = data.id
- this.biography = data.biography
+ this.post = data.post
this.file = data.file
this.edu = data.edu
this.picture = data.picture
diff --git a/src/render/persons.js b/src/render/persons.js
new file mode 100644
index 00000000..52ee7f01
--- /dev/null
+++ b/src/render/persons.js
@@ -0,0 +1,107 @@
+const React = require('react')
+const Picture = require('../components/Image')
+const CollectiveImage = require('../components/CollectiveImage')
+const Page = require('../components/Page')
+const TeacherCard = require('../components/TeacherCard')
+const {render} = require('../lib/render')
+const timestamp = require('../lib/date').timestamp
+const ImageArtifactType = require('../core/ImageArtifactType')
+const Teacher = require('../core/Teacher')
+const Image = require('../core/Image')
+const Config = require('../core/Config')
+const {sortBy} = require('../utils/sort')
+const {prioritySort} = require('../lib/sort')
+
+function getMeta(teacher) {
+ return {
+ title: teacher.name,
+ description: teacher.name,
+ }
+}
+
+function getCollectiveMeta() {
+ return {
+ title: 'Преподаватели',
+ description: 'Преподаватели Шлиссельбургской ДХШ',
+ }
+}
+
+// function getMeta(article) {
+// const types = [
+// ImageArtifactType.FACEBOOK,
+// ImageArtifactType.MEDIUM,
+// ImageArtifactType.BIG,
+// ImageArtifactType.ORIGIN,
+// ]
+// const meta = {
+// title: article.title,
+// }
+//
+// if (article.preview) {
+// try {
+// const artifact = article.preview.findArtifact(types)
+// meta.image = artifact.url
+// meta.imageWidth = artifact.width
+// meta.imageHeight = artifact.height
+// } catch (error) {
+// meta.image = 'https://art.shlisselburg.org/entrance.jpg'
+// meta.imageWidth = 1200
+// meta.imageHeight = 630
+// }
+// }
+// return meta
+// }
+
+async function renderPerson(id) {
+ const teacher = await Teacher.findById(id)
+ if (!teacher) return null
+
+ const Component = (
+
+ )
+
+ return render(teacher.url, Component, getMeta(teacher), {commentsEnabled: true, menuPadding: true})
+}
+
+const profilePicture = profile => profile.picture.getPicture(ImageArtifactType.BIG)
+
+async function renderCollective(path, order) {
+ const config = await Config.findConfig()
+ if (!config) return null
+
+ const preview = await Image.findByFile(config.collectiveImage)
+ if (!preview) return null
+
+ let teachers = await Teacher.find({})
+ if (!teachers) return null
+
+ const teachersSorted = prioritySort.bind(null, [...order], t => t.id)
+ teachers = teachersSorted(teachers)
+
+ const image = preview.getPicture(ImageArtifactType.ORIGINAL)
+
+ const Component = (
+
+
+
+
+ {teachers.map((teacher, index) => (
+
+ ))}
+
+
+ )
+
+ return render(path, Component, getCollectiveMeta())
+}
+
+exports.renderPerson = renderPerson
+exports.renderCollective = renderCollective
diff --git a/src/routes/teachers.js b/src/routes/teachers.js
index 394f3c44..c25b81fd 100644
--- a/src/routes/teachers.js
+++ b/src/routes/teachers.js
@@ -1,69 +1,15 @@
-const React = require('react')
-const Article = require('../components/Article')
-const TeacherProfile = require('../components/TeacherProfile')
-const Teacher = require('../core/Teacher')
-const ImageArtifactType = require('../core/ImageArtifactType')
-const {render} = require('../lib/render')
-const {prioritySort} = require('../lib/sort')
const getPathWithNoTrailingSlash = require('../lib/url').getPathWithNoTrailingSlash
-
+const {renderPerson, renderCollective} = require('../render/persons')
const {get} = require('koa-route')
-function getCollectiveMeta() {
- return {
- title: 'Преподаватели',
- description: 'Преподаватели Шлиссельбургской ДХШ',
- }
-}
-
-function getMeta(teacher) {
- return {
- title: teacher.name,
- description: teacher.name,
- }
-}
-
-const pictureTypes = [
- ImageArtifactType.BIG,
- ImageArtifactType.MEDIUM,
- ImageArtifactType.ORIGIN,
-]
-
-const profilePicture = profile => profile.picture.findArtifact(pictureTypes)
-
function getCollective(order) {
- const teachersSorted = prioritySort.bind(null, order, t => t.id)
-
return get('/collective', async ctx => {
const path = getPathWithNoTrailingSlash(ctx.path)
- let teachers = await Teacher.find({})
-
- if (teachers) {
- teachers = teachersSorted(teachers)
-
- const Component = (
-
-

-
-
- {teachers.map((teacher, index) => (
-
- ))}
-
-
- )
+ const body = await renderCollective(path, order)
+ if (body) {
ctx.type = 'text/html'
- ctx.body = await render(path, Component, getCollectiveMeta(), {menuPadding: false})
+ ctx.body = body
} else {
ctx.status = 404
}
@@ -72,23 +18,11 @@ function getCollective(order) {
function getTeacher() {
return get('/teacher/:id', async (ctx, id) => {
- const path = getPathWithNoTrailingSlash(ctx.path)
- const teacher = await Teacher.findById(id)
-
- if (teacher) {
- const Component = (
-
-
-
- )
+ const body = await renderPerson(id)
+ if (body) {
ctx.type = 'text/html'
- ctx.body = await render(path, Component, getMeta(teacher), {commentsEnabled: true})
+ ctx.body = body
} else {
ctx.status = 404
}
diff --git a/src/style/components/CollectiveImage.scss b/src/style/components/CollectiveImage.scss
new file mode 100644
index 00000000..496deab4
--- /dev/null
+++ b/src/style/components/CollectiveImage.scss
@@ -0,0 +1,3 @@
+.CollectiveImage {
+ margin-bottom: var(--double-margin);
+}
\ No newline at end of file
diff --git a/src/style/components/teacher-proifile.scss b/src/style/components/TeacherCard.scss
similarity index 50%
rename from src/style/components/teacher-proifile.scss
rename to src/style/components/TeacherCard.scss
index ae4b6d9a..ffbe95dd 100644
--- a/src/style/components/teacher-proifile.scss
+++ b/src/style/components/TeacherCard.scss
@@ -3,13 +3,13 @@
$picture-width: 30%;
$info-width: 100% - $picture-width;
-.teacher-profile {
+.TeacherCard {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
- &__picture {
- margin: 0 0 $double-margin;
+ &-Picture {
+ margin-bottom: var(--double-margin);
width: $picture-width;
max-width: 15em;
min-width: 12em;
@@ -19,47 +19,29 @@ $info-width: 100% - $picture-width;
}
}
- &__info {
+ &-Info {
width: $info-width;
- padding-left: $double-margin;
- margin: 0 0 $double-margin;
+ padding-left: var(--double-margin);
+ margin-bottom: var(--double-margin);
box-sizing: border-box;
-
- h2 {
- font-size: $big-font-size;
- font-weight: 200;
- text-align: left;
-
- strong {
- font-weight: 600;
- }
- }
}
- &__position {
+ &-Position {
font-size: $bigger-font-size;
}
-
- &__biography {
- margin-top: $double-margin;
-
- p {
- margin-bottom: $single-margin;
- }
- }
}
@media (max-width: $mobile-width) {
- .teacher-profile {
- margin: 0 auto $double-margin;
+ .TeacherCard {
+ margin: 0 auto var(--double-margin);
- &__picture {
+ &-Picture {
width: 100%;
max-width: $mobile-width;
}
- &__info {
+ &-Info {
width: 100%;
padding-left: 0;
}
diff --git a/src/style/hmenu.scss b/src/style/hmenu.scss
index 04d657c0..d866afbf 100644
--- a/src/style/hmenu.scss
+++ b/src/style/hmenu.scss
@@ -15,7 +15,6 @@ $hmenu-icon-height: 32px;
width: 100%;
height: 100%;
- padding: 0 0 $half-margin;
position: relative;
diff --git a/src/style/style.scss b/src/style/style.scss
index 7d1ad62a..8ac38a70 100644
--- a/src/style/style.scss
+++ b/src/style/style.scss
@@ -3,7 +3,6 @@
@import "components/document";
@import "components/document-row";
@import "components/documents-container";
-@import "components/teacher-proifile";
@import "components/main-menu";
@import "components/navigation";
@import "components/breadcrumbs";
@@ -23,6 +22,8 @@
@import "components/ArticleCard";
@import "components/ArticleCardList";
+@import "components/CollectiveImage";
+@import "components/TeacherCard";
@import "main";
@import "body-wrapper";