From 99bb908811cf355d68386086d9a06bb76a48f632 Mon Sep 17 00:00:00 2001
From: Karl Andin
- {hasActiveSemesters ? (
- translation.courseLabels.header_dropdown_menu_navigation
- ) : (
+ {hasActiveSemesters ? (
+ !hasOnlyOneRound && {translation.courseLabels.header_dropdown_menu_navigation}
{translation.courseLabels.lable_no_rounds}
- )}
-
You could meet obstacles if you're required to pay fees or if you do not have a Swedish Mobile BankID. `,
courseLabels: {
label_course_description: 'Introduction to course',
diff --git a/i18n/messages.se.js b/i18n/messages.se.js
index 93ebd0ca..f6a475d7 100644
--- a/i18n/messages.se.js
+++ b/i18n/messages.se.js
@@ -40,6 +40,10 @@ module.exports = {
menu_panel_close: 'Stäng',
menu_panel_menu: 'Meny',
},
+ showMoreContent: {
+ show: 'Visa mer',
+ hide: 'Dölj',
+ },
bankIdAlertText:
'Du behöver ett KTH-konto för att läsa en kurs på KTH, kontot aktiveras med Mobilt BankID eller genom att besöka KTH:s campus. Det enda sättet att starta en kurs utan att besöka campus, är om du har Mobilt BankID.',
courseLabels: {
diff --git a/public/css/kursinfo-web.scss b/public/css/kursinfo-web.scss
index d3a6665a..df1c22eb 100644
--- a/public/css/kursinfo-web.scss
+++ b/public/css/kursinfo-web.scss
@@ -140,6 +140,42 @@
margin-bottom: 1.5rem;
}
+ .roundInformation__infoGridItem {
+ display: flex;
+ flex-direction: column;
+
+ .roundInformation__infoGridItemContent {
+ position: relative;
+ overflow: hidden;
+ max-height: 96px;
+ transition: max-height 200ms ease-in;
+
+ &.hidden::after {
+ content: '';
+ position: absolute;
+ bottom: 0;
+ height: 24px;
+ width: 100%;
+ background: linear-gradient(to bottom, transparent, var(--color-background-alt));
+ display: block;
+ }
+ }
+
+ .roundInformation__infoGridItemShowMoreButton {
+ background-color: transparent;
+ border: none;
+ padding: 0;
+ margin-top: 4px;
+ color: var(--color-tertiary);
+ cursor: pointer;
+ align-self: flex-end;
+
+ &:hover {
+ text-decoration: underline;
+ }
+ }
+ }
+
.kth-alert {
background-color: var(--color-background);
}
diff --git a/public/js/app/components/RoundInformation/RoundInformationInfoGrid.jsx b/public/js/app/components/RoundInformation/RoundInformationInfoGrid.jsx
index 8ab06e78..b14f5104 100644
--- a/public/js/app/components/RoundInformation/RoundInformationInfoGrid.jsx
+++ b/public/js/app/components/RoundInformation/RoundInformationInfoGrid.jsx
@@ -1,12 +1,49 @@
-import React from 'react'
+import React, { useEffect, useState, useRef } from 'react'
import { useLanguage } from '../../hooks/useLanguage'
import InfoModal from '../InfoModal'
import { CourseMemoLink } from './CourseMemoLink'
import { CourseScheduleLink } from './CourseScheduleLink'
import { PlannedModules } from './PlannedModules'
+// Calculates if a "Show more" button should be displayed, and creates props for content and button elements.
+const useShowMoreContent = content => {
+ const ref = useRef(null)
+ const [hasMoreContent, setHasMoreContent] = useState(false)
+ const [contentHeight, setHeight] = useState(undefined)
+ const { translation } = useLanguage()
+
+ const showMoreContent = hasMoreContent && !!contentHeight
+ const hideMoreContent = hasMoreContent && !showMoreContent
+ useEffect(() => {
+ if (ref.current) {
+ const el = ref.current
+ const isOverflowing = el.clientHeight < el.scrollHeight
+ setHasMoreContent(isOverflowing)
+ }
+ }, [content])
+
+ const contentProps = {
+ ref,
+ style: { maxHeight: contentHeight }, // set max height for animation from the max value specified in css to actual content height
+ className: `roundInformation__infoGridItemContent ${hideMoreContent ? 'hidden' : ''}`,
+ }
+
+ const showMoreButtonProps = hasMoreContent
+ ? {
+ onClick: () => {
+ setHeight(showMoreContent ? undefined : ref.current.scrollHeight)
+ },
+ children: showMoreContent ? translation.showMoreContent.hide : translation.showMoreContent.show,
+ className: 'roundInformation__infoGridItemShowMoreButton',
+ }
+ : undefined
+
+ return { contentProps, showMoreButtonProps }
+}
+
const Item = ({ children, html, title, infoModalContent }) => {
const { translation } = useLanguage()
+ const { contentProps, showMoreButtonProps } = useShowMoreContent(html ?? children)
return (
{courseRound.round_seats || translation.courseRoundInformation.round_no_seats_limit}
• A course goes different course offerings. To see information about a specific course offering, choose semester and course offering. The course syllabus information will be updated depending on the chosen semester. Information from the course syllabus is marked with *.
• Please note: regulations in course syllabus are rules that are generally applicable and binding for both employees and students.
• If you have not chosen semester and course offering, you will see course information from the current or future course syllabus. The valid period of the course syllabus is stated on the page.
', + 'A course goes different course offerings. To see information about a specific course offering, choose semester and course offering. The course syllabus information will be updated depending on the chosen semester. Information from the course syllabus is marked with *
', sideMenu: { aria_label: 'Sub menu', page_about_course: 'About course', diff --git a/i18n/messages.se.js b/i18n/messages.se.js index f6a475d7..230d3360 100644 --- a/i18n/messages.se.js +++ b/i18n/messages.se.js @@ -106,7 +106,7 @@ module.exports = { 'Kursomgången kan komma att ställas in om antalet antagna understiger minimiantalet platser. Vid fler sökande än platser kommer urval att ske.', round_seats_info: 'Urvalet sker baserat på:', syllabus_info: - '• En kurs undervisas i olika kursomgångar. För att se information om en specifik kursomgång behöver du välja termin och kursomgång. Information från kursplan kommer att uppdateras beroende på vald termin. Information från kursplan är markerad med *.
• Observera: bestämmelser i kursplaner är regler som är generellt tillämpbara och bindande för såväl anställda som studenter.
• Har du inte valt termin och kursomgång ser du kursinformation från nuvarande eller kommande kursplan. På sidan anges den period som information från kursplan gäller för.
', + 'En kurs undervisas i olika kursomgångar. För att se information om en specifik kursomgång behöver du välja termin och kursomgång. Information från kursplan kommer att uppdateras beroende på vald termin. Information från kursplan är markerad med *
', sideMenu: { aria_label: 'Undermeny', page_about_course: 'Om kursen ', From a1411e56a67696ac6fa0e79880a7915afe56a916 Mon Sep 17 00:00:00 2001 From: amirhossein-haerianFantastisk kurs
', en: 'This course is awesome
' }, courseDisposition: { sv: 'Kursupplägg på svenska
', en: 'Course Disposition in english
' }, - supplementaryInfo: { sv: 'Övrig info
', en: 'Extra info
' }, imageInfo: 'own_image', }), })) diff --git a/server/controllers/mocks/mockedDiscontinuedCourse.js b/server/controllers/mocks/mockedDiscontinuedCourse.js index ee6f4011..c535ad6d 100644 --- a/server/controllers/mocks/mockedDiscontinuedCourse.js +++ b/server/controllers/mocks/mockedDiscontinuedCourse.js @@ -11,7 +11,6 @@ const mockedDiscontinuedCourse = { }, educationalLevelCode: 'RESEARCH', gradeScaleCode: 'PF', - supplementaryInfo: 'Ersätter kurs FBB3640.
', title: 'Kolhydratteknik inom glykovetenskap', titleOther: 'Carbohydrate Technologies in Glycoscience', cancelled: false, From 022ff43682cc77e4d55bbc6e83e74687cac55ba0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Axel=20Bj=C3=B6rkqvist?=Kursen ges inte läsåret 22/23.
Kontakta examinator / kursansvarig för information.
", - "course_code": "FCK3305", - "course_contact_name": "Ingen information tillagd", - "course_department": "CBH/Kemi", - "course_department_code": "CE", - "course_department_link": "CBH/Kemi", - "course_disposition": "Kursupplägg på svenska
", - "course_education_type_id": null, - "course_examiners": "Examiner 1
", - "course_grade_scale": "P, F", - "course_last_exam": [], - "course_level_code": "RESEARCH", - "course_literature": "Litteratur anvisas vid kursstart.
", - "course_main_subject": "Denna kurs tillhör inget huvudområde.", - "course_possibility_to_addition": "Ingen information tillagd", - "course_possibility_to_completions": "Ingen information tillagd", - "course_prerequisites": "Ingen information tillagd", - "course_recruitment_text": "Teori och metoder inom glykovetenskap.
", - "course_required_equipment": "Ingen information tillagd", - "course_state": "ESTABLISHED", - "course_suggested_addon_studies": "Ingen information tillagd", - "course_supplemental_information": "Övrig info
", - "course_supplemental_information_url": "Ingen information tillagd", - "course_supplemental_information_url_text": "Ingen information tillagd", - "imageFromAdmin": "own_image", - "sellingText": "Fantastisk kurs
", - }, - "courseTitleData": { - "course_code": "FCK3305", - "course_credits": 7.5, - "course_credits_text": "hp", - "course_other_title": "Carbohydrate Technologies in Glycoscience", - "course_title": "Kolhydratteknik inom glykovetenskap", - }, - "emptySyllabusData": { - "course_additional_regulations": "", - "course_content": "Ingen information tillagd", - "course_decision_to_discontinue": "", - "course_eligibility": "Ingen information tillagd", - "course_ethical": "", - "course_examination": "Ingen information tillagd", - "course_examination_comments": "", - "course_goals": "Ingen information tillagd", - "course_literature": "Ingen information tillagd", - "course_literature_comment": "Ingen information tillagd", - "course_required_equipment": "", - "course_requirments_for_final_grade": "", - "course_transitional_reg": "", - "course_valid_from": undefined, - "course_valid_to": undefined, - }, - "language": "sv", - "roundsBySemester": {}, - "syllabusList": [ - { - "course_additional_regulations": "", - "course_content": "Glykovetenskap är ett tvärvetenskapligt forskningsområde som fokuserar på att förstå strukturer och funktionella roller för glykaner (kolhydrater) i biologiska system. Det täcker ämnesområden som biologi, biokemi, kemi, medicin, materialvetenskap, nanoteknologi och beräkningsvetenskap. Kursens mål är att ge en översikt över aktuell kunskap och teknik inom glykovetenskap, utmaningar och möjligheter för bred tillämpning av kolhydratteknik inom hälsa, energi och materialvetenskap, samt god teoretisk insikt och praktiska färdigheter i hur kolhydratteknik kan bidra till hållbar utveckling inom energi- och materialvetenskap.
Ämnen som avhandlas omfattar kolhydratteknik inom hälsa, energi och materialvetenskap, glykaners funktioner, kolhydratanalys av komplexa kolhydrater, glykaner och glykokonjugat, uppbyggnaden av växters cellvägg, kolhydrataktiva enzymer, enzymatisk nedbrytning av växtbiomassa och modifiering av växtbaserade fibrer, biosyntes och av cellulosa och kitin, skapande av nya kompositer genom bioteknologisk modifiering av växtcellväggen, modifiering av glykaner genom att förändra syntesvägar, omvandling av växtbiomassa till finkemikalier och råmaterial, polymera material och nanomaterial, användande av biomassabaserade nanomaterial för nya material och tillämpningar.
", - "course_decision_to_discontinue": "Ingen information tillagd", - "course_eligibility": "Behörig till studier på forskarnivå. Goda kunskaper i engelska.
", - "course_ethical": "Betygskriterier redovisas i kurs-PM.
", - "course_goals": "Efter fullföljande av kursen förväntas studenten kunna
Godkänd skriftlig tentamen, godkända inlämningsuppgifter kopplade till föreläsningarna, 100% närvaro på laborationer och slutförande av laborationer, samt godkända laborationsrapporter.
", - "course_transitional_reg": "", - "course_valid_from": { - "semesterNumber": 2, - "year": 2019, - }, - "course_valid_to": undefined, - }, - ], - }, - "employees": { - "responsibles": [], - "teachers": [], - }, - "hostUrl": undefined, - "initiallySelectedRoundIndex": undefined, - "initiallySelectedSemester": null, - "isCancelledOrDeactivated": false, - "lang": "sv", - "paths": { - "system": { - "monitor": { - "uri": "/_monitor", - }, - "robots": { - "uri": "/robots.txt", - }, - }, - }, - "proxyPrefixPath": { - "uri": "/student/kurser/kurs", +{ + "applicationStore": {}, + "basename": "/student/kurser/kurs", + "context": { + "activeSemesters": [], + "browserConfig": { + "session": {}, + "sessionSecret": "xxx", + }, + "courseCode": "FCK3305", + "courseData": { + "courseInfo": { + "course_application_info": "Kursen ges inte läsåret 22/23.
Kontakta examinator / kursansvarig för information.
", + "course_code": "FCK3305", + "course_contact_name": "Ingen information tillagd", + "course_department": "CBH/Kemi", + "course_department_code": "CE", + "course_department_link": "CBH/Kemi", + "course_disposition": "Kursupplägg på svenska
", + "course_education_type_id": null, + "course_examiners": "Examiner 1
", + "course_grade_scale": "P, F", + "course_last_exam": [], + "course_level_code": "RESEARCH", + "course_literature": "Litteratur anvisas vid kursstart.
", + "course_main_subject": "Denna kurs tillhör inget huvudområde.", + "course_possibility_to_addition": "Ingen information tillagd", + "course_possibility_to_completions": "Ingen information tillagd", + "course_prerequisites": "Ingen information tillagd", + "course_recruitment_text": "Teori och metoder inom glykovetenskap.
", + "course_required_equipment": "Ingen information tillagd", + "course_state": "ESTABLISHED", + "course_suggested_addon_studies": "Ingen information tillagd", + "course_supplemental_information": "", + "imageFromAdmin": "own_image", + "sellingText": "Fantastisk kurs
", + }, + "courseTitleData": { + "course_code": "FCK3305", + "course_credits": 7.5, + "course_credits_text": "hp", + "course_other_title": "Carbohydrate Technologies in Glycoscience", + "course_title": "Kolhydratteknik inom glykovetenskap", + }, + "emptySyllabusData": { + "course_additional_regulations": "", + "course_content": "Ingen information tillagd", + "course_decision_to_discontinue": "", + "course_eligibility": "Ingen information tillagd", + "course_ethical": "", + "course_examination": "Ingen information tillagd", + "course_examination_comments": "", + "course_goals": "Ingen information tillagd", + "course_literature": "Ingen information tillagd", + "course_literature_comment": "Ingen information tillagd", + "course_required_equipment": "", + "course_requirments_for_final_grade": "", + "course_transitional_reg": "", + "course_valid_from": undefined, + "course_valid_to": undefined, + }, + "language": "sv", + "roundsBySemester": {}, + "syllabusList": [ + { + "course_additional_regulations": "", + "course_content": "Glykovetenskap är ett tvärvetenskapligt forskningsområde som fokuserar på att förstå strukturer och funktionella roller för glykaner (kolhydrater) i biologiska system. Det täcker ämnesområden som biologi, biokemi, kemi, medicin, materialvetenskap, nanoteknologi och beräkningsvetenskap. Kursens mål är att ge en översikt över aktuell kunskap och teknik inom glykovetenskap, utmaningar och möjligheter för bred tillämpning av kolhydratteknik inom hälsa, energi och materialvetenskap, samt god teoretisk insikt och praktiska färdigheter i hur kolhydratteknik kan bidra till hållbar utveckling inom energi- och materialvetenskap.
Ämnen som avhandlas omfattar kolhydratteknik inom hälsa, energi och materialvetenskap, glykaners funktioner, kolhydratanalys av komplexa kolhydrater, glykaner och glykokonjugat, uppbyggnaden av växters cellvägg, kolhydrataktiva enzymer, enzymatisk nedbrytning av växtbiomassa och modifiering av växtbaserade fibrer, biosyntes och av cellulosa och kitin, skapande av nya kompositer genom bioteknologisk modifiering av växtcellväggen, modifiering av glykaner genom att förändra syntesvägar, omvandling av växtbiomassa till finkemikalier och råmaterial, polymera material och nanomaterial, användande av biomassabaserade nanomaterial för nya material och tillämpningar.
", + "course_decision_to_discontinue": "Ingen information tillagd", + "course_eligibility": "Behörig till studier på forskarnivå. Goda kunskaper i engelska.
", + "course_ethical": "Betygskriterier redovisas i kurs-PM.
", + "course_goals": "Efter fullföljande av kursen förväntas studenten kunna
Godkänd skriftlig tentamen, godkända inlämningsuppgifter kopplade till föreläsningarna, 100% närvaro på laborationer och slutförande av laborationer, samt godkända laborationsrapporter.
", + "course_transitional_reg": "", + "course_valid_from": { + "semesterNumber": 2, + "year": 2019, }, + "course_valid_to": undefined, }, - "location": undefined, - } - `) + ], + }, + "employees": { + "responsibles": [], + "teachers": [], + }, + "hostUrl": undefined, + "initiallySelectedRoundIndex": undefined, + "initiallySelectedSemester": null, + "isCancelledOrDeactivated": false, + "lang": "sv", + "paths": { + "system": { + "monitor": { + "uri": "/_monitor", + }, + "robots": { + "uri": "/robots.txt", + }, + }, + }, + "proxyPrefixPath": { + "uri": "/student/kurser/kurs", + }, + }, + "location": undefined, +} +`) }) }) From b2446d8130766d89571e9d484347ccade7a9f8ee Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Axel=20Bj=C3=B6rkqvist?=