[js] Hoe templates implementeren? *

[Reveller]

Een tijdje geleden heb ik in mijn cms'je de mogelijkheid gebouwd om een oneindig aantal templates te definieren: voor mijn eigen website heb ik er nu 4: de homepage template, een template met 2 en een met 3 kolommen, en een admin template (met het menu bovenaan de plagina ipv in de linker kolom).

Als ik een nieuwe pagina aanmaak, zeg een nieuw artikel invoer, moet ik bij het aanmaken in een dropdown menuutje aangeven welke template ik aan dit artikel wil toewijzen. In de database staat op deze manier 1 op 1 een template gekoppeld aan elke pagina binnen de site.

Op deze manier van werken ben ik de afgelopen dagen wat aan het terugkomen. Als ik naar nieuwe corporate websites kijk tegenwoordig (zoals Movabletype), vallen mij twee dingen op:

• het lijkt tegenwoordig steeds minder te gaan om de "kijk-mij-een-onwijze-flashfilm-en gephotoshopte-homepage-met-overal-ronde-hoekjes-en-kleine-plaatjes-hebben-waarbinnen-elke-
  pagina-er-weer-anders-uitziet" maar steeds meer om een cleane, uniforme look. Ik heb het idee dat veel sites gebouwd worden naar het weblog-model (steeds meer draaien ook op weblog software (http://www.spreadfirefox.com op Drupal bijvoorbeeld). Waar 2 jaar geleden alle titeltjes nog met gephotoshopte plaatjes werd weergeven, wordt nu weer "normale" tekst gebruikt;
• afhandeling van de template wordt steeds meer client-side gedaan. Het cms spuugt symantisch correcte html uit, welke mbv. een stylesheet wordt vormgegeven.

Mijn cms werkt met "schone" url's. Bijvoorbeeld site.com/persoonlijk/fotos en site.com/producten/appels. Nu lijkt het mij gezien bovenstaande ontwikkelingen beter om mijn cms om te bouwen: ik definieer geen templates meer, maar maak het design met een combinatie van javascript en css. Pseudo:

Java:

if (path == 'persoonlijk') {
  document.write('<link rel="stylesheet" href="css/persoonlijk.css>');
}
else {
  document.write('<link rel="stylesheet" href="css/standaard.css>');
}

Stel dat mijn site 2 of 3 kolommen heeft. In de linker kolom staat altijd het navigatie menu. Daarnaast staat OF 1 kolom van 500 pixels breed met een artikel OF 2 kolommen: 1 van 350 pixels met een artikel en 1 van 150 pixels met extra informatie over het artikel. Die extra info staat in een div genaamd "column_right". Nu zou ik bovenaan mijn site een javascriptje kunnen maken dat checkt op de "column_right" div. Vindt hij deze, maakt hij de div waar het artikel in staat 350 pixels; anders 500 pixels:

Java:

if (document.getElementById('column_right')) {
  document.getElementById('artikel_div').width == 350;
}
else {
  document.getElementById('artikel_div').width == 500;
}

Op deze manier hoef ik in mijn cms helemaal geen aparte templates te definieren; ik maar gewoon een zooi javascripts en css bestanden die alles clientside afhandelen. Een groot bijkomend voordeel is dat ik bij het maken van een nieuw artikel ook geen template meer hoef te selecteren.

Mijn vragen zijn:

• is dit een goede manier van werken?
• wie heeft er al ervaring met het volledig client-side bepalen van de lay-out?
• kom ik niet in problemen als de site ingewikkelder wordt (bijvoorbeeld met productpagina's etc)?

Ik hoop dat mijn vragen duidelijk zijn

[ Voor 4% gewijzigd door Reveller op 30-05-2005 13:18 ]

[crisp]

--> Programming & Webscripting

[.oisyn]

* taal aan titel toegevoegd

[LauPro]

Ik vind het een beetje ranzig om breedtes in pixels zo hard in javascript (java lijkt me stug?) neer te zetten, is dit niet iets wat je beter met CSS kan doen? Als je het goed aan pakt hoef je dan alleen en ander stylesheet te pakken waarin je aangeeft of het geheel in 2 kolommen moet of onder elkaar oid.

[.oisyn]

Bleh, mijn fout, en die van crisp vermoed ik, heeft idd geen zak met java te maken maar met javascript, en dus hoort het in W&G (domme crisp )

PW -> WG

[semicon]

het grappige aan jou idee is wel dat je server minder belast wordt handig met evil parse time als je bij vmet php werkt en template parsers. Ik zou dit niet zo snel gebruiken, alleen als ik echt niet anders kan, maar heb ook nog nooit zo veel vershcillende templates nodig gehad, een menu is hooguit het enige wat veranderd moet worden als je ergens "persoonlijk" ingelogd ben en een admin panel (maar die heeft al een andere map vaak /admin ofzo).

Ik denk ergens wel dat het niet erg is zolang het maar volledig crossbrowser is en absoluut geen fouten heeft, met javascirpt heeft dat nogal eens de nijging om dan gelijk de hele pagina niet meer te laten zien