tietokonepaja/runosaari
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Updated to 2023

Browse Source
This commit is contained in:
Veikko Lintujärvi
2023-05-15 20:30:11 +03:00
parent 9a2e646776
commit df9b60a368
9 changed files with 136 additions and 383 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
data/performers/2023.ts Normal file
View File

@@ -0,0 +1,5 @@
import type Performer from '../../types/Performer';
const Performers: Array<Performer> = [];
export default Performers;

4
package-lock.json generated
View File

@@ -1,12 +1,12 @@
{ {
"name": "runosaari", "name": "runosaari",
"version": "0.1.0", "version": "1.0.0",
"lockfileVersion": 2, "lockfileVersion": 2,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "runosaari", "name": "runosaari",
"version": "0.1.0", "version": "1.0.0",
"dependencies": { "dependencies": {
"next": "12.1.6", "next": "12.1.6",
"react": "18.1.0", "react": "18.1.0",

89
pages/archive.tsx
View File

@@ -3,7 +3,8 @@ import Image from 'next/image';
import { CSSTransition } from 'react-transition-group'; import { CSSTransition } from 'react-transition-group';
import shared from '../styles/Shared.module.scss'; import shared from '../styles/Shared.module.scss';
import styles from '../styles/Archive.module.scss'; import styles from '../styles/Archive.module.scss';
import PerformersData from '../data/performers/2021'; import PerformersData2021 from '../data/performers/2021';
import PerformersData2022 from '../data/performers/2022';
import Performer from '../types/Performer'; import Performer from '../types/Performer';
import { BiChevronDown, BiChevronLeft } from 'react-icons/bi'; import { BiChevronDown, BiChevronLeft } from 'react-icons/bi';
@@ -13,36 +14,60 @@ interface PerformerCard extends Performer {
} }
const Archive = () => { const Archive = () => {
const [performers, setPerformers] = useState<PerformerCard[]>([]); const [performers2021, setPerformers2021] = useState<PerformerCard[]>([]);
const [performers2022, setPerformers2022] = useState<PerformerCard[]>([]);
useEffect(() => { useEffect(() => {
let cards: PerformerCard[] = []; let cards: PerformerCard[] = [];
PerformersData.map((p, index) => { PerformersData2021.map((p, index) => {
let newCard = { ...p, id: index, showDesc: false }; let newCard = { ...p, id: index, showDesc: false };
cards.push(newCard); cards.push(newCard);
}); });
setPerformers(cards); setPerformers2021(cards);
}, []); }, []);
const togglePerformerDesc = (id: number) => { useEffect(() => {
let cards: PerformerCard[] = [];
PerformersData2022.map((p, index) => {
let newCard = { ...p, id: index, showDesc: false };
cards.push(newCard);
});
setPerformers2022(cards);
}, []);
const togglePerformerDesc2021 = (id: number) => {
let updated: PerformerCard[]; let updated: PerformerCard[];
updated = performers.map((p) => { updated = performers2021.map((p) => {
if (p.id === id) { if (p.id === id) {
p.showDesc = !p.showDesc; p.showDesc = !p.showDesc;
} }
return p; return p;
}); });
setPerformers(updated); setPerformers2021(updated);
};
const togglePerformerDesc2022 = (id: number) => {
let updated: PerformerCard[];
updated = performers2022.map((p) => {
if (p.id === id) {
p.showDesc = !p.showDesc;
}
return p;
});
setPerformers2022(updated);
}; };
return ( return (
<section className={shared.page + ' ' + styles.archivePage}> <section className={shared.page + ' ' + styles.archivePage}>
<h1>Arkisto</h1> <h1>Arkisto</h1>
<h2 className={styles.year}>2021</h2> <h2 className={styles.year}>2022</h2>
{performers.map((p) => ( {performers2022.map((p) => (
<div className={styles.performerContainer} key={p.id}> <div className={styles.performerContainer} key={p.id}>
<Image <Image
className={styles.performerImage} className={styles.performerImage}
@@ -55,7 +80,51 @@ const Archive = () => {
<div className={styles.performerTextContainer}> <div className={styles.performerTextContainer}>
<div <div
className={styles.performerTitle} className={styles.performerTitle}
onClick={() => togglePerformerDesc(p.id)} onClick={() => togglePerformerDesc2022(p.id)}
>
<h2>{p.name}</h2>
<button className={shared.openingChevron}>
{p.showDesc ? (
<BiChevronDown size='3rem' />
) : (
<BiChevronLeft size='3rem' />
)}
</button>
</div>
<CSSTransition
in={p.showDesc}
timeout={1000}
classNames='fadeTransition'
>
{p.showDesc ? (
<div>
{p.paragraphs.map((parag, index) => (
<p key={index}>{parag.toString()}</p>
))}
</div>
) : (
<span></span>
)}
</CSSTransition>
<hr />
</div>
</div>
))}
<h2 className={styles.year}>2021</h2>
{performers2021.map((p) => (
<div className={styles.performerContainer} key={p.id}>
<Image
className={styles.performerImage}
src={p.imagePath}
width={100}
height={100}
layout='fixed'
alt={p.name + ' image'}
/>
<div className={styles.performerTextContainer}>
<div
className={styles.performerTitle}
onClick={() => togglePerformerDesc2021(p.id)}
> >
<h2>{p.name}</h2> <h2>{p.name}</h2>
<button className={shared.openingChevron}> <button className={shared.openingChevron}>

14
pages/components/Lead.tsx
View File

@@ -4,20 +4,16 @@ import styles from '../../styles/Lead.module.scss';
const Lead = () => { const Lead = () => {
return ( return (
<div className={styles.leadContainer}> <div className={styles.leadContainer}>
<h2 className={styles.leadNextYear}>Runosaari kiittää!</h2>
<h2 className={styles.leadNextYear}>
Tervetuloa seuraavaan Runosaareen 19.-22.7.2023
</h2>
<h2 className={styles.leadTitle}> <h2 className={styles.leadTitle}>
<span className={styles.dateAndPlace}> <span className={styles.dateAndPlace}>
20.-23.7. Naantalin Saaristo 19.-22.7. Naantalin Saaristo
</span> </span>
Eksymisretki omaan luontoosi, metsänpeiton suojaan! Eksymisretki omaan luontoosi, metsänpeiton suojaan!
</h2> </h2>
<p className={styles.leadText}> <p className={styles.leadText}>
Runosaari on poikkitaiteellinen runofestivaali Livonsaaren, Palvan ja Runosaari on poikkitaiteellinen runofestivaali Livonsaaren, Palvan ja
Velkuanmaan saarissa. Festivaali järjestetään toista kertaa Velkuanmaan saarissa. Festivaali järjestetään kolmatta kertaa
20.–23.7.2022. 19.-22.7.2023.
</p> </p>
<p className={styles.leadText}> <p className={styles.leadText}>
Tapahtuma kutsuu Naantalin saaristoon joukon valovoimaisia ja Tapahtuma kutsuu Naantalin saaristoon joukon valovoimaisia ja
@@ -30,10 +26,6 @@ const Lead = () => {
nousee Runosaari ihmettelemään ihmisen ja muun luonnon olemista taiteen nousee Runosaari ihmettelemään ihmisen ja muun luonnon olemista taiteen
ja ilmaisun keinoin. ja ilmaisun keinoin.
</p> </p>
<p className={styles.leadText}>
Runosaaren päätapahtuman ajan perjantaina 22.7. Sinervon talolla pitää
majaa kiehtovien kirjojen tori.
</p>
</div> </div>
); );
}; };

2
pages/index.tsx
View File

@@ -10,7 +10,7 @@ import Workshops from './workshops';
const Home: NextPage = () => { const Home: NextPage = () => {
return ( return (
<div className={styles.indexContainer}> <div className={styles.indexContainer}>
<h1>Runosaari 2022</h1> <h1>Runosaari 2023</h1>
<Lead /> <Lead />
<Performers /> <Performers />
<Program /> <Program />

10
pages/performers.tsx
View File

@@ -4,7 +4,7 @@ import styles from '../styles/Performers.module.scss';
import shared from '../styles/Shared.module.scss'; import shared from '../styles/Shared.module.scss';
import Performer from '../types/Performer'; import Performer from '../types/Performer';
import { BiChevronDown, BiChevronLeft } from 'react-icons/bi'; import { BiChevronDown, BiChevronLeft } from 'react-icons/bi';
import PerformersData from '../data/performers/2022'; import PerformersData from '../data/performers/2023';
import { CSSTransition } from 'react-transition-group'; import { CSSTransition } from 'react-transition-group';
interface PerformerCard extends Performer { interface PerformerCard extends Performer {
@@ -41,7 +41,8 @@ const Performers = () => {
return ( return (
<section className={shared.page}> <section className={shared.page}>
<h1>Esiintyjät</h1> <h1>Esiintyjät</h1>
{performers.map((p) => ( {performers.length !== 0 ? (
performers.map((p) => (
<div className={styles.performerContainer} key={p.id}> <div className={styles.performerContainer} key={p.id}>
<Image <Image
className={styles.performerImage} className={styles.performerImage}
@@ -83,7 +84,10 @@ const Performers = () => {
<hr /> <hr />
</div> </div>
</div> </div>
))} ))
) : (
<i>Lisätietoja tulossa myöhemmin...</i>
)}
</section> </section>
); );
}; };

259
pages/program.tsx
View File

@@ -31,264 +31,7 @@ const Program = () => {
return ( return (
<section className={shared.page}> <section className={shared.page}>
<h1 id='program-start'>Ohjelma</h1> <h1 id='program-start'>Ohjelma</h1>
<i className={shared.followNote}>Lisätietoja tulossa myöhemmin!</i> <i className={shared.followNote}>Lisätietoja tulossa myöhemmin...</i>
<div className={styles.dayContainer}>
<div
className={styles.programTitle}
onClick={() => toggleDayDesc('wed')}
>
<h2>Keskiviikko 20.7.</h2>
<button className={shared.openingChevron}>
{dayToggles.wed ? (
<BiChevronDown size='3rem' />
) : (
<BiChevronLeft size='3rem' />
)}
</button>
</div>
<CSSTransition
in={dayToggles.wed}
timeout={1000}
classNames='fadeTransition'
>
{dayToggles.wed ? (
<div>
<p>
<b>18-20</b> <i>Olen polkuni päässä</i> -illassa näyttelijä Ella
Pyhältö Helsingistä lausuu rakastettuja runoja Irja ja Veikko
Aro-Heinilän pihassa ke 20.7.22 klo 18. (sateella sisällä)
Osoite Huhtakarintie 24, Livonsaari.
</p>
<p>
Iltaa jatketaan osallistujien lempirunojen parissa. Ota siis
runoja mukaan. Muun muassa Antti Kinnanen lausuu tätinsä
kirjoittaman pakolaisrunon.
</p>
<p>Sydämellisesti tervetuloa!</p>
<p>Paikka: Huhtakarintie 24, Livonsaari</p>
</div>
) : (
<></>
)}
</CSSTransition>
<hr />
</div>
<div className={styles.dayContainer}>
<div
className={styles.programTitle}
onClick={() => toggleDayDesc('thu')}
>
<h2>Torstai 21.7.</h2>
<button className={shared.openingChevron}>
{dayToggles.thu ? (
<BiChevronDown size='3rem' />
) : (
<BiChevronLeft size='3rem' />
)}
</button>
</div>
<CSSTransition
in={dayToggles.thu}
timeout={1000}
classNames='fadeTransition'
>
{dayToggles.thu ? (
<div>
<p>
<b>14-16</b> Ainot ja Lauri, ohj. Leena Koivula, tulevat
Karviasta ja esittävät poikkitaiteellisen runosarjan LÄHELLÄ
sekä Irja Aro-Heinilän ja Arto Juurakon tekstejä to 21.7.22 klo
14. Irja ja Veikko Aro-Heinilän pihassa (sateella sisällä)
Osoite Huhtakarintie 24, Livonsaari.
</p>
<p>
Ainot ja Lauri -ryhmä on voittanut Willi Kansa -katselmuksessa
ensimmäisen sijan. Mukana on myös Tiina-Kaisa Aro-Heinilä, joka
laulaa lauluja syvistä vesistä, kasvusta ja menetyksestä sekä
soittaa herkkiä huilusävelmiä.
</p>
<p>
<b>17-19</b> Runollinen, musiikillinen ja merellinen matinea
Cafe Laiturissa. Esiintymässä runoilija Anja Erämaja ja
lauluyhtye Signe.
</p>
<p>
Paikka: Huhtakarintie 24, Livonsaari sekä Cafe Laituri,
Voiponlahdentie 37, Palva
</p>
</div>
) : (
<></>
)}
</CSSTransition>
<hr />
</div>
<div className={styles.dayContainer}>
<div
className={styles.programTitle}
onClick={() => toggleDayDesc('fri')}
>
<h2>Perjantai 22.7.</h2>
<button className={shared.openingChevron}>
{dayToggles.fri ? (
<BiChevronDown size='3rem' />
) : (
<BiChevronLeft size='3rem' />
)}
</button>
</div>
<CSSTransition
in={dayToggles.fri}
timeout={1000}
classNames='fadeTransition'
>
{dayToggles.fri ? (
<div>
<p>
<b>11:00-15:30</b> Kirjoittamisen työpajoja.
</p>
<p>
Monologityöpaja, vetäjä teatteritaiteen monitaituri Kati Urho.
</p>
<p>
PERUTTU Ympäristöjargonia luovasti -työpaja, vetäjä journalisti
ja viestintäkonsultti Laura Rantanen.
</p>
<p>
Lisätietoja <Link href='/workshops'>Työpajat-osiosta</Link>
</p>
<br />
<p>
<b>16:30</b> Runosaaren perjantain lavaohjelma alkaa!
</p>
<p>
<b>16:30</b> Alkusanat Katariina Vuorinen ja Kati Urho
</p>
<p>
<b>16:40</b> Heidi Iivari & Karl Kruuse
</p>
<p>
<b>17:10</b> Aki Salmela
</p>
<p>
<b>17:30-18:10</b> Maakuntauudistus! Mikko Innanen, Laura
Laakso, Juha Kulmala, Outi-Illuusia Parviainen
</p>
<p>
<i>Tauko</i>
</p>
<p>
<b>18:30</b> Sanna Karlström
</p>
<p>
<b>18:50</b> Kari Aronpuro
</p>
<p>
<b>19:20</b> Katariina Vuorinen & Mikko Innanen{' '}
</p>
<p>
<b>19:40-20:30</b> Äyräs
</p>
<p>
<i>Tauko</i>
</p>
<p>
<b>20:50</b> Susinukke Kosola
</p>
<p>
<b>21:10</b> Laura Laakso
</p>
<p>
<b>21:30-22:00</b> Tytti Metsä
</p>
<p>
<i>Tauko</i>
</p>
<p>
<b>22:20-23:00</b> Francis North & Ghosts on TV
</p>
<p>
<b>23:10</b> Päätössanat
</p>
<p>Muutokset mahdollisia. Samoin yllätysohjelma. </p>
<p>Tapahtuma suljetaan viimeistään klo 24.</p>
<br />
<p>
<b>Runoilijan vastaanotto</b>
</p>
<p>
Runoilijan vastaanotolla olet huomion keskipiste, ja sinusta
kirjoitetaan runo. Vastaanottoon kuuluu noin vartin mittainen
kahdenkeskinen haastattelu, jonka jälkeen kuulet
henkilökohtaisen runosi ja saat runon mukaasi. Kesto on noin 20
min.
</p>
<br />
<p>
Tapahtuman ajan Sinervon talolla pitää majaa kiehtovien kirjojen
tori.
</p>
<p>Saariston Savotan buffet 16:00 - 21:00</p>
<p>Paikka: Sinervon talo, Sauniementie 5, Teersalo</p>
</div>
) : (
<></>
)}
</CSSTransition>
<hr />
</div>
<div className={styles.dayContainer}>
<div
className={styles.programTitle}
onClick={() => toggleDayDesc('sat')}
>
<h2>Lauantai 23.7.</h2>
<button className={shared.openingChevron}>
{dayToggles.sat ? (
<BiChevronDown size='3rem' />
) : (
<BiChevronLeft size='3rem' />
)}
</button>
</div>
<CSSTransition
in={dayToggles.sat}
timeout={1000}
classNames='fadeTransition'
>
{dayToggles.sat ? (
<div>
<p>
<b>13-17</b> Runollinen iltapäivä. Romanttinen Velkuanmaa kutsuu
mystisen äärelle.
</p>
<p>
Saaristohotelli Vaihelan terassilla runoilijat vievät kuulijat
luomiinsa maailmoihin yhdessä muusikoiden kanssa. Samalla ehtii
myös nauttimaan lounasta, juttelemaan muiden festarikävijöiden
kanssa ja ihailemaan ympäröivää luontoa.
</p>
<p>
Juha Kulmala ja Diodi-yhtye, Saila Susiluoto ja Markku Pääskynen
(luuttu), Katariina Vuorinen ja Diodi.
</p>
<p>
Paikka: Vaihelan saaristohotelli, Velkuanmaantie 168, Velkuanmaa
</p>
</div>
) : (
<></>
)}
</CSSTransition>
<hr />
</div>
</section> </section>
); );
}; };

63
pages/workshops.tsx
View File

@@ -6,68 +6,7 @@ const Workshops = () => {
return ( return (
<section className={shared.page + ' ' + styles.workshopPage}> <section className={shared.page + ' ' + styles.workshopPage}>
<h1>Työpajat</h1> <h1>Työpajat</h1>
<p> <i>Lisätietoja tulossa myöhemmin...</i>
Pyydämme ilmoittautumisia ennakkoon:{' '}
<a href='mailto:runosaari@gmail.com'>runosaari@gmail.com</a>. Jos tilaa
jää, mukaan voi tulla suoraan paikan päällä.
</p>
<h2>Monologityöpaja, Kati Urho</h2>
<h3>
Perjantai 22.7.
<br />
11:00 - 14:15
</h3>
<h3>
Sinervon talolla
<br />
Sauniementie 5, Teersalo
</h3>
<p>Löydä oma sisäinen monologisi!</p>
<p>
Mikä on sinun tarinasi? Tervetuloa inspiroitumaan draamallisen
tarinankerronnan pariin. Työpajassa etsitään inspiraatiota luonnosta,
omasta sisäisestä äänestä sekä kirjoittamisen puhdistavasta voimasta.
Tämä työpaja avaa uusia näkökulmia kirjoittamiseen monologin keinoja
käyttäen.
</p>
<p>
Kati Urho on turkulainen teatterialan monitaituri, joka valmistui vuonna
2002 ammattinäyttelijäksi (FIA) Lontoossa (East 15 Acting School). Kati
toimii tällä hetkellä freelancer näyttelijänä, käsikirjoittajana,
laulajana, ohjaajana sekä tuottajana Turusta käsin. Vuonna 2022 Turun
kaupunki myönsi Katille vuoden Aboa-apurahan.
</p>
<p>
Työpajamaksu 10 euroa. Ilmoittautumiset:{' '}
<a href='mailto:runosaari@gmail.com'>runosaari@gmail.com</a>
</p>
<h2>
<b>PERUTTU</b> Ympäristöjargonia luovasti -työpaja, Laura Rantanen
</h2>
<h3>
Perjantai 22.7.
<br />
13:30 - 15:30
</h3>
<h3>
Sinervon talolla
<br />
Sauniementie 5, Teersalo
</h3>
<p>
Kuinka ottaa byrokraattinen kapulakieli haltuun ja tehdä siitä ystävä
runouden keinoin?
</p>
<p>
Työpaja ei vaadi minkäänlaista aikaisempaa kirjoittajakokemusta eikä
etenkään ympäristö- tai minkään muunkaan jargonin ymmärtämistä. Vetäjä
on itsekin saariston lapsi, journalisti ja viestintäkonsultti Laura
Rantanen.
</p>
<p>
Työpajamaksu 10 euroa. Ilmoittautumiset:{' '}
<a href='mailto:runosaari@gmail.com'>runosaari@gmail.com</a>
</p>
</section> </section>
); );
}; };

1
styles/Shared.module.scss
View File

@@ -18,6 +18,7 @@
text-align: center; text-align: center;
width: 47rem; width: 47rem;
max-width: 100%; max-width: 100%;
margin-bottom: 4rem;
} }
.followNote { .followNote {