Zaprzęgnięcie wzorca MVC do pracy - dynamiczne generowanie stylów CSS

Aby zaprezentować, w jaki sposób można użyć wzorca MVC do dołączania odpowiednich arkuszy stylów do strony WWW generowanej przez odpowiednią klasę "WebPage", zdefiniuję trzy przykładowe pliki ze stylami CSS. Jak zaraz zobaczysz, style te będą wyświetlane dynamicznie w oparciu o dane otrzymane pierwotnie od klasy "PageController".

Oto wspomniane trzy przykładowe pliki CSS:

body{
    margin: 0;
    padding: 0;
    background: #fff;
}
h1 {
    font: bold 22px Arial, Tahoma;
    color: #000;
    margin: 0;
}
#header{
    height: 100px;
    background: #9c0;
}
#navbar{
    background: #cfc;
    padding: 4px 0 4px 20%;
}
#navbar ul{                  
    display: inline;
}
#navbar li{
    list-style-type: none;    
    display: inline;
}
#navbar a, #navbar a:visited{ 
    display: block;
    float: left;
    width: 100px;
    height: 15px;
    padding: 2px 0 0 0;
    margin-right: 4px;
    font: normal 11px Tahoma, Arial;
    color: #000;
    text-align: center;
    text-decoration: none;
    border: 1px solid #000;
}
#navbar a:hover{
    background: #fff;
}
#leftcol{
    float: left;
    width: 20%;
    height: 500px;
    background: #9c0;
}
#centercol{
    float: left;
    width: 58%;
    height: 500px;
    background: #fff;
}
#rightcol{
    float: right;
    width: 20%;
    height: 500px;
    background: #9c0;
}
#footer{
    clear: left;
    height: 20px;
    background: #cfc;
}

body{
    margin: 0;
    padding: 0;
    background: #fff;
}
h1 {
    font: bold 22px Arial, Tahoma;
    color: #000;
    margin: 0;
}
#header{
    height: 100px;
    background: #f60;
}
#navbar{
    background: #cfc;
    padding: 4px 0 4px 20%;
}
#navbar ul{
    display: inline;
}
#navbar li{
    list-style-type: none;
    display: inline;
}
#navbar a, #navbar a:visited{
    display: block;
    float: left;
    width: 100px;
    height: 15px;
    padding: 2px 0 0 0;
    margin-right: 4px;
    font: normal 11px Tahoma, Arial;
    color: #000;
    text-align: center;
    text-decoration: none;
    border: 1px solid #000;
}
#navbar a:hover{
    background: #fff;
}
#leftcol{
    float: left;
    width: 20%;
    height: 500px;
    background: #f60;
}
#centercol{
    float: left;
    width: 58%;
    height: 500px;
    background: #fff;
}
#rightcol{
    float: right;
    width: 20%;
    height: 500px;
    background: #f60;
}
#footer{
    clear: left;
    height: 20px;
    background: #cfc;
}

body{
    margin: 0;
    padding: 0;
    background: #fff;
}
h1 {
    font: bold 22px Arial, Tahoma;
    color: #000;
    margin: 0;
}
#header{
    height: 100px;
    background: #9cf;
}
#navbar{
    background: #cfc;
    padding: 4px 0 4px 20%;
}
#navbar ul{
    display: inline;
}
#navbar li{
    list-style-type: none;
    display: inline;
}
#navbar a, #navbar a:visited{
    display: block;
    float: left;
    width: 100px;
    height: 15px;
    padding: 2px 0 0 0;
    margin-right: 4px;
    font: normal 11px Tahoma, Arial;
    color: #000;
    text-align: center;
    text-decoration: none;
    border: 1px solid #000;
}
#navbar a:hover{
    background: #fff;
}
#leftcol{
    float: left;
    width: 20%;
    height: 500px;
    background: #9cf;
}
#centercol{
    float: left;
    width: 58%;
    height: 500px;
    background: #fff;
}
#rightcol{
    float: right;
    width: 20%;
    height: 500px;
    background: #9cf;
}
#footer{
    clear: left;
    height: 20px;
    background: #cfc;
}

W porządku, skoro mamy już trzy pliki CSS, spójrzmy teraz na przykład, który używając pierwszego z nich - generuje stronę web:

// wyświetlenie strony przy użyciu pierwszego pliku CSS 
try{
    $pageController=new PageController('styles1');
    $webPage=new WebPage($pageController);
    $webPage->doHeader();
    $webPage->doBody();
    $webPage->doFooter();
    $styleGenerator=new StyleGenerator($webPage);
    echo $styleGenerator->generateStyle();
}
catch(Exception $e){
    echo $e->getMessage();
    exit();
}

Jak widzisz, powyższy skrypt pokazuje, jak obiekt "PageController" (nasz kontroler) decyduje o tym, którego arkusza stylów użyć do wyrenderowania odpowiedniej strony WWW. Wynik działania powyższego kodu przedstawia obrazek poniżej:

Podobnie jest z pozostałymi dwoma arkuszami stylów, które mogą zostać dołączone do dokumentu:

// wyświetlanie strony z wykorzystaniem drugiego pliku CSS
try{
    $pageController=new PageController('styles2');
    $webPage=new WebPage($pageController);
    $webPage->doHeader();
    $webPage->doBody();
    $webPage->doFooter();
    $styleGenerator=new StyleGenerator($webPage);
    echo $styleGenerator->generateStyle();
}
catch(Exception $e){
    echo $e->getMessage();
    exit();
}

// wyświetlenie strony z wykorzystaniem trzeciego pliku CSS
try{
    $pageController=new PageController('styles3');
    $webPage=new WebPage($pageController);
    $webPage->doHeader();
    $webPage->doBody();
    $webPage->doFooter();
    $styleGenerator=new StyleGenerator($webPage);
    echo $styleGenerator->generateStyle();
}
catch(Exception $e){
    echo $e->getMessage();
    exit();
}

Nie sposób nie zgodzić się, że ten prosty kod oparty o schemat MVC naprawdę działa. Spróbuj stworzyć więcej plików ze stylami i zobaczyć, co będzie się działo z każdym z nich. Naprawdę warto poświęcić na to chwilkę czasu!