TIM-JYU / TIM

TIM (The Interactive Material) is an open-source cloud-based platform for creating interactive learning documents.
https://tim.education/view/about/en-US
MIT License
15 stars 4 forks source link

Step-by-step komponentin tietorakenne #3738

Open ylivuoto opened 2 weeks ago

ylivuoto commented 2 weeks ago

Steps komponentti

Työ on kesken tässä haarassa: https://github.com/TIM-JYU/TIM/commit/4341bfd6cd07eac135b2fc85eabdcb8619a087e9

Steps-komponentin (eräänlainen työkulkunäkymä) tietorakennetta pitäs hahmotella. Kuva näkymästä on alempana. Samoin kuvia tietorakenteen hahmottelemisesta.

Toistaiseksi komponentti koostuu angular-komponentista ja sille luodusta reitistä (routes.py). Oleellista olis, että tietokantaan voitais tallentaa

  1. tollasen komponentin tiedot eli vaiheet mitä työkulkuun kuuluu, ja sitten esim. sellanenkin että periytyykö komponentin tiedot joltain aiemmin luodulta komponentilta.
  2. tieto siitä missä vaiheessa työkulkua esim. kurssilla mennään
  3. tieto siitä, missävaiheessa työkulkua opiskelija menee

ja jotain muuta mitä? Myöhemmin komponentti voitais muuttaa vaikka omaksi pluginikseen.

Komponentti vois näyttää tältä:

Screenshot from 2024-11-12 11-57-46

Tietorakenteen idea on tässä:

d2 image

Tietorakenteen kaavio

Steps_: {
  shape: sql_table
  id: int {constraint: primary_key}
  user_group: int {constraint: foreign_key}
  master_block: int {constraint: foreign_key, nullable: true}
  steps_content: string {constraint: json, nullable: true}
  current_step: int
  name: string
  docid: int
}

Steps_.master_block -> Steps_.id

Sitä voi kikkailla täällä: https://play.d2lang.com/?script=4gIEAAD__w%3D%3D&layout=elk&

dezhidki commented 2 weeks ago

Laitoin vähän jo Slackissa kommenttia, mutta tähänkin talteen: minusta tässä on jo sen verran tallennettavaa asiaa, että on parempi tehdä plugin. Plugineilla saa aika kivasti määriteltyä tila YAML-markupilla. Esim. nämä:

Oleellista olis, että tietokantaan voitais tallentaa

  1. tollasen komponentin tiedot eli vaiheet mitä työkulkuun kuuluu,
  2. tieto siitä missä vaiheessa työkulkua esim. kurssilla mennään

voi mallintaa pluginin markupilla:

steps:
  - title: First step
    description: |!!
Content.

More content.

More.
!!
  - title: Last step
currentStep: 1  # Mikä on tämänhetkinen vaihe (esim. tämän avulla väritetään vaiheen numero)

Makroilla ja johdantodokumenteilla voi tehdä niin, että vaiheet ovat kaikki jossain keskitetyssä paikassa, mutta itse vaiheen numero päivitetään.

tieto siitä, missävaiheessa työkulkua opiskelija menee

En ihan saa kiinni, miten tämä eroaa siitä, missä vaiheessa kurssia mennään. Mutta jos se opiskelijan vaihe on joku eri ja pitää automaatiolla määrittää, niin sopivalla markupilla saa.

ellanenkin että periytyykö komponentin tiedot joltain aiemmin luodulta komponentilta.

Tuo tosiaankin voi saada makroilla tehtyä.

Oikeastaan kun mietin, niin onko tämä sellainen asia, jonka opettajien pitää pystyä muokkaamaan koko ajan? Tai onko tuossa jotain interaktiivisia elementtejä, joille tarvitaan erillinen käyttöliittymäkoodi? Jos ei, niin tämänhän saisi ehkä jo nytkin sopivalla CSSllä sekä makroilla. Toki jos tämä on sellainen, että opettajan pitää usein muokata, niin toki pluginin markup on vähän selkeämpi (tai voi rakentaa oma muokkaus-UI kuten esim. QST:llä tai timTablella).

Tavataan huomenna OP:n kanssa ja katsotaan nämä asiat läpi.

ylivuoto commented 2 weeks ago

Tuossahan oli jo hyvää ideointia huomisen pohjaksi huomisen plugin-muutokselle. Käyttöliittymäjuttuja tosiaan olis tarkoitus tehdä tuon konfiguraation muokkaamiseksi.

Jos vaikka olisi tämmönen markup:

steps:
  - title: First step
    description: |!!

Content here.

!!

Tossa siis olis hyvä, jos käyttöliittymätoimintojen avulla pellin alla pystyttäis vaikka tuohon TIM-paragraphiin sitten muuttamaan tuota yaml-pätkää, titlen arvoa ja descriptionin arvoa ja lisäämään toki uusia askeleita tuohon.

ylivuoto commented 1 week ago

Tilannepäivitys

Tuo muunnettiin pluginiksi. Markupista voisi saada siis steppien tiedot, kuvaukset ja sen kurssin vaiheen. Tietokantaan voisi sitten lisäksi tallentaa sen käyttäjän oman (tai työryhmän) vaiheen

Taulun tiedot voisivat olla seuraavat

image

sijualle commented 1 week ago

Se opiskelijoiden ryhmän tilanteen tallentamisen logiikka riippuu myös siitä miten lopullinen opiskelijan näkymä toteutetaan, eli onko opiskelijaryhmillä jokaisella oma dokumentti, jossa voi kliksutella askelkomponenttia, vai onko askelkomponentti yhdessä dokumentissa jota aikki eri opiskelijaryhmät käyttävät.

Jos opiskelijoiden ryhmillä on jokaisella oma dokumentti, silloin sen datan voi tallentaa helposti suoraan pluginin yamliin. Silloin yamlissa ei varmaan tarvita muuta kuin tieto että mistä löytyy opettajan säätämä askelkomponentti, ja mikä on opiskelijoiden ryhmän askelkomponentin nykyinen tilanne. Tai halutessaan voi laittaa suoraan tietokantaankin omaan tauluun sen opiskelijoiden tilanteen, tällöin askelkomponentin yamlissa pitäisi olla kirjattuna minkä opiskelijaryhmän tilannetta komponentti näyttää. Tai silloin jopa laittaa pluginin vastauksena se tilanne, ja käsitellä tuota pluginia samoiten kuin muita globaaleja plugineja eli kenen tahansa tekemä vastaus olisi kaikille näkyvä vastaus

Jos kaikki opiskelijaryhmät käyttävät vain yhtä ja saama dokumenttia (joku yleinen participant-dashboard dokumentti tms), tuo on vähän hankalampaa.

Jos voisi jotenkin määritellä ryhmäkokoelmia, opettaja voisi ensin luoda kurssin pääryhmän (esim "coding25"), ja tälle aliryhmiä (esim coding25-opet, coding25-kissat, coding25-koirat). Tällöin voisi kaikille yhteisessä dokumentissa olevalle askelkomponentille antaa yamlissa tiedon pääryhmästä coding25. Sitten askelkomponentin tilannetta käsiteltäisiin sen mukaan mihin ryhmään kuuluu. Opettajaryhmään kuuluva voisi kliksutella sitä opettajan määräämää tilannetta, ja tarvittaessa vaikka muokata kaikille ryhmille näkyviä askeleita. Jos komponenttia katselee johonkin aliryhmään kuuluva, hän näkisi tilanteen oman aliryhmänsä tilanteen mukaan ja voisi muokata tilannetta sen ryhmän mukaan.

Eli tällä hetkellä tuo kaikille opiskelijaryhmille yhteisen dokumentin teko vaikuttaa vähän haastavalta. Jos tuota tapaa haluaa käyttää, sen lopullinen tallennustapa on ehkä parempi jättää siihen vaiheeseen kun on on määritelty tapoja miten noita ryhmiä ja opiskelijoita tässä projektin käyttötapauksessa hallitaan. Mutta jos nuo komponentit sijaitsee kukin opiskelijaryhmän omassa dokumentissa niin tuo on suoraviivaisempi tehdä jo nykyisillä TIMin ominaisuuksilla.

Lisäksi yhtenä vaatimuksena (muistaakseni) oli tapaus että opettajan pitää voida nähdä mikä on opiskelijaryhmien tilanne heidän omissa askelkomponentissaan. Jos se on suoraan yamlissa ja komponentti sijaitsee opiskelijaryhmän omassa dokumentissa, opettaja voisi helposti avata opiskelijaryhmän dokumentin ja nähdä tilanteen sieltä, mutta tuon datan kokoaminen taulukkoihin tai visualisointeihin yamleista voi olla hankalaa. Jos taas se data on pluginin vastauksina tai tietokannan omina tauluina niin siihen on ehkä helpompi viritellä jotain visualisoijia.

vesal commented 1 week ago

Jos on plugin, niin eikö tuota voi tallentaa answeriin JSONina. EI tarvitse tietokantaan luoda uusia tauluja jotakin erikoistapausta varten. Osan voi "pelleillä" että onko GLO_ nimi vai ei että tuleeko kaikille vai osalle. Jos tarvitsee näidne väliin jotakin muuta esim ryhmäkohtaista, kehittäisin niin, että toimisi sitten kaikilla plugineilla, koska on joskus mielekästä että tulee ryhmien vastauksia.

vesal commented 1 week ago

Ehdotus:

EI tehdä step by step komponenttia, vaan vastaava kirjoitetaan normaalina TIMInä, mikä sallii että yhdessä stepissä voi olla vaikka mitä TIM-koodia, mukaan lukien videonäytin, malliohjelmaa jne..

Eli tuollainen kirjoitettaisiin

    #- {defaultplugin=stepNumber .stepStyle}
    {#mallistep1 primaryGroup: oscar25, stem: 1#}
    Ensimmäisessä vaiheessa lisää yksi steppi 

    #- {defaultplugin=stepNumber .stepStyle}
    {#mallistep2 primaryGroup: oscar25, stem: 2#}
    Toisessa vaiheessa lisää toisen steppi 

    #- {defaultplugin=stepNumber .stepStyle}
    {#mallistepV primaryGroup: oscar25, stem: Valmis#}
    Sitten onkin valmista

Tuo stepNumberon suurin piirtein kopio RadioButton fieldistä sillä erolla että näyttää vähän eri tavalla ja sitten "ruksii" kaikki itseään edeltävät samalla nimellä olevista komponenteista.

.stepStyle on tyyli, joka maalaa palkkia lohkon vasemmalle puolelle.

primaryGroup on kaikki plugineihin lisättävä attribuutti joka määrää että jos joku ryhmän osaryhmään kuuluva vastaa, niin vastaus laitetaan kaikille vastaajille kuten silloin kun on useita vastaajia kirjautuneena yhdessä vastaamaan. Paitsi silloin ei näytetä collobrators kuten ryhmävastaamisessa.