Add initial support for theming via documents - [merged]

[dezhidki]

Merges feature-theming -> master

Lisää ensimmäisen alustavan version jaettujen teemojen tekemiselle (katso #1688).

Ensimmäisen version olennaiset ominaisuudet

• Teemat kirjoitetaan styles/official tai styles/user -hakemistoon

• Jokainen TIM-dokumentti on teemadokumnetti, jos

  1. Dokumentti sijaitsee styles/official tai styles/user -hakemistossa
  2. Dokumentin asetuksissa on description-attribuutti, jossa on lyhyesti kuvattu teeman tarkoitus

• Teemadokumenttiin laitetaan SCSS-lohkoja, jotka ovat muotoa

  ```scss
  // SCSS-tyylikoodi

  
  
  Lohkot saavat olla alueissa ja viitelohkoissa. SCSS-lohkoissa saa käyttää makroja.

• Teemadokumentissa saa olla muita lohkoja

• Lopullinen SCSS-tyyli luodaan teemadokumentista yhdistämällä kaikki SCSS-lohkot yhteen allekkain.

• Käyttäjä voi valita, järjestellä ja esikatsella tyylejä Customize TIM -sivulla. Esikatselu onnistuu myös suoraan tyylidokumentissa.

• styles/official-hakemistossa olevat tyylit saavat erikoiskäsittelyn vain käyttöliittymässä (merkitään "viralliseksi" ja näytetään ennen käyttäjätyylejä)

Kokeilu

Tällä hetkellä kokeilu pyörii tyhjässä timdevs01-2 -instanssilla, koska koodista puuttu vielä migraatioskripti käyttäjäasetusten päivittämiselle. Lisäksi vielä tarkempi dokumentaatio puuttuu.

• Esimerkki virallisesta tyylistä: https://timdevs01-2.it.jyu.fi/view/styles/official/lighttheme
• Esimerkki käyttäjätyylistä (testuser1:llä muokkausoikeus): https://timdevs01-2.it.jyu.fi/view/styles/user/kayttajatyyli-esimerkki

Vaiheet ennen mergetystä

Laitan MR:n jo nyt, koska peruskoodi on miltei valmis ja perustoimintaa voi testata. Listaan alle jutut, jotka pitää vielä korjata ja tehdä ennen mergeä:

• [x] Rebase nykyiseen masteriin
• [x] Korjaa regressiot automaatiotesteissä
• [x] Skripti vanhojen käyttäjäasetusten siirtämiseksi uuteen muotoon (s.e. nykyiset tyylivalinnat säilyvät)
• [x] Käyttäjätyylien valinta dokumentin tyyliksi
• [x] Kirjoita dokumentaatio tyylien luomisesta
• [x] Yksi tai muutama selaintesti (varmistetaan, että tyyli toimii, vaikka pääsy dokumenttiin muuttuu tai tyylidokumentti meni rikki)
  • Jätetään myöhemmäksi; sen sijaan on jo muutama palvelintesti, jolla varmistetaan tyylityksen toimivuus

[dezhidki]

In GitLab by @vesal on Dec 16, 2021, 22:45

Hieno, mutta ei saa tehdä uusia users-tyylejä?

Vesa

[dezhidki]

In GitLab by @vesal on Dec 16, 2021, 23:11

Voikos dokumentin tyylin asettaa näillä? Eli jos on joku tyylipohja, voisio sanoa että tämä dokumentti käyttää sitä?

[dezhidki]

Pitää olla edit-oikeus styles/users-kansioon. Laitoin testuser1lle nyt edit-oikeuden siihen.

Jos tekee uuden tyylin, dokumentin title on tyylin nimi ja dokumentin asetuksiin pitää lisätä description-attribuutti, jossa on tyylin kuvaus. Ilman description-attribuuttia dokumenttia ei tulkita aktiiviseksi tyylitiedostoksi.

Tuotannossa sitten tekisin niin, että ihan alkuun rajoittaisin SCSS-käyttäjätyylien tekoa teemakehittäjille. Jos homma toimii hyvin, niin voi jälkeenpäin laajentaa.

[dezhidki]

Voi käyttäen samaa themes-dokumenttiasetusta, joka on nytkin olemassa tuotannossa. Pitää vain dokumentoida sen merkitystä uusiksi, koska se toimii hieman eri tavoi virallisille tyyleille ja käyttäjätyyleille.

[dezhidki]

In GitLab by @vesal on Dec 17, 2021, 08:18

Voisikos sitten olla jollakin tavalla joku private jolla voisi tehdä samat jutut ja harjoitella theme-kehittäjäksi pääsyä. Eli menisi kansioon private/vesal ja ne näkyisi itselle?

Hyöty verrattuna siihen css ikkunaan olisi että niitä voi napsia päälle/pois tilanteen mukaan.

Sitten voisi olla sellainen "luo uusi theme" painikr joka tekisi hyvän pohjan.

Taustavärejä yms varten tarviisi pohjaan esimerkkejä koska sen vaihtaminen olisi varmaan yksi yleisimmistä.

Sitten jos tekee hyvän tyylin, voisi anella pääsyä siihen julkisempaan.

[dezhidki]

In GitLab by @vesal on Dec 17, 2021, 08:29

Voi, käyttäen samaa themes-dokumenttiasetusta, joka on nytkin olemassa

Mites jos oletetaan että joku laitos tai oppilaitos haluaa oman teeman omasta hakemistostaan alaspäin, niin tehdäänkö se hakemiston preamblella?

[dezhidki]

Voisikos sitten olla jollakin tavalla joku private jolla voisi tehdä samat jutut ja harjoitella theme-kehittäjäksi pääsyä. Eli menisi kansioon private/vesal ja ne näkyisi itselle?

Varmaan voisi tehdä helposti niin, että tyylien preview-komponentti toimisi myös henkilökohtaisessa kansiossa, mutta siinä tapauksessa generoitu SCSS tyyli ei laiteta levylle, vaan se menisi väliaikaiseen Redis-cacheen. Oikeat teemakehittäjien tyylit menisivät pysyvään tallennukseen, koska niitä ei ole tarkoitus poistaa.

Sitten voisi olla sellainen "luo uusi theme" painikr joka tekisi hyvän pohjan.

Taustavärejä yms varten tarviisi pohjaan esimerkkejä koska sen vaihtaminen olisi varmaan yksi yleisimmistä.

Joo, varmaan tuotantoon voi tehdä erilaisia pohjia yleisille tyyleille.

[dezhidki]

Mites jos oletetaan että joku laitos tai oppilaitos haluaa oman teeman omasta hakemistostaan alaspäin, niin tehdäänkö se hakemiston preamblella?

Tässä MRssä tyylit katsotaan vain styles-hakemistosta. Toki styles/user and styles/offical alle voi tehdä alihakemistoja ja käyttää themes-asetuksen kanssa.

[dezhidki]

added 32 commits

• 71d99204...3f75a779 - 14 commits from branch master
• de120bb1 - Add initial support for theming via documents
• 68e59bff - Don't require plugins to be in a paragraph
• aa100b6f - DataView: enhance alignment and visuals
• ef6a639d - Settings: Use vscrolling mode for themes
• 9abae667 - Add initial support for theme previewing
• adf94d49 - Refactor theme -> styles; remove old Theme object
• 09433b4b - Style: Generate SCSS without print; clean up code
• dfa1f197 - Settings: Improve style selector
• 407cd593 - Style: Add initial ability to set style via UI
• 7fcdb482 - Generate style lazily only in specific situations
• cbc06b13 - Settings: Implement initial current style selector and sorter
• cc110a41 - Settings: add error box for style errors
• 7031be91 - Styles: expand markdown when generating SCSS
• f9dff6bb - Settings: Add Custom CSS tab
• 511d2eb8 - Add StylePreviewComponent
• bf28c112 - Fix typing errors
• 9431d1ba - Convert old SCSS themes to doc-based themes
• 1fb77fda - Translate new UI

Compare with previous version

[dezhidki]

marked the task Rebase nykyiseen masteriin as completed

[dezhidki]

added 1 commit

• 1a6780d5 - Fix failing tests; add test for parsing code_lang

Compare with previous version

[dezhidki]

marked the task Korjaa regressiot automaatiotesteissä as completed

[dezhidki]

added 1 commit

• efaa7c66 - Fix failing tests; add test for parsing code_lang

Compare with previous version

[dezhidki]

marked the task Korjaa regressiot automaatiotesteissä as incomplete

[dezhidki]

marked the task Skripti vanhojen käyttäjäasetusten siirtämiseksi uuteen muotoon (s.e. nykyiset tyylivalinnat säilyvät) as completed

[dezhidki]

added 2 commits

• 131a6e15 - Add script for migrating to new styles system
• 25083ae5 - Fix regressions in all style tests; add minor optimizations

Compare with previous version

[dezhidki]

marked the task Yksi tai muutama selaintesti (varmistetaan, että tyyli toimii, vaikka pääsy dokumenttiin muuttuu tai tyylidokumentti meni rikki) as completed

[dezhidki]

marked the task Korjaa regressiot automaatiotesteissä as completed

[dezhidki]

added 2 commits

• c878d49e - Allow documents reference any style
• 6bb8033d - Document new functions

Compare with previous version

[dezhidki]

In GitLab by @vesal on Dec 17, 2021, 16:58

https://timdevs01-2.it.jyu.fi/view/styles/user/isofontti

Tuo isontaa fonttia, mutta itse tyylin sivulla perusfontti ei suurene?

Mutta aika paljon on näköjään korjaamsita esim csPluginin (mun vika) asetuksissa että fontin kasvatus toimisi kiltisti.

Sitten varmaan pitäisi nostaa eri pluginine "vakioita" tuonne muuttujalistaan niin niitä voisi helpommin muutella. Mutta jatkuu toisessa kortissa sitten...

Vesa

[dezhidki]

marked the task Käyttäjätyylien valinta dokumentin tyyliksi as completed

[dezhidki]

added 1 commit

• 75a11a48 - Settings: Note that preview disables other styles

Compare with previous version

[dezhidki]

added 1 commit

• 74055992 - Enable StylePreviewComponent for any style document

Compare with previous version

[dezhidki]

added 1 commit

• 4e7fb766 - DragComponent: restore removed code

Compare with previous version

[dezhidki]

added 1 commit

• 59bb6edb - DataViewComponent: Revert some changes

Compare with previous version

[dezhidki]

added 1 commit

• 192dc1c8 - StylePreviewComponent: Allow in all style documents

Compare with previous version

[dezhidki]

added 1 commit

• 589f66d6 - Styles: Clean up

Compare with previous version

[dezhidki]

added 1 commit

• 45381f19 - User CLI: Fix styles being cleared when using skip-warnings in migrate_themes_to_styles

Compare with previous version

[dezhidki]

added 1 commit

• 78d54dc7 - Mark all SCSS variables with !default, add post-variables mixin hook

Compare with previous version

[dezhidki]

marked the task Kirjoita dokumentaatio tyylien luomisesta as completed

[dezhidki]

resolved all threads

[dezhidki]

approved this merge request

[dezhidki]

mentioned in commit f77130a88f61c4d7bfc956d700cc52915aef04b9