0251 / 590 837 15
info@a-coding-project.de
;

SkinSelector Teil 2 (CMS)

Der SkinSelector unseres CMS wird heute zu Ende programmiert. Derzeit fehlen noch die Pfeile für die Navigation.

Als erstes hab ich Photoshop angeworfen und folgende Bilder erstellt:

http://cms.stevieswebsite.de/system/images/btnLeft.gif

und

http://cms.stevieswebsite.de/system/images/btnRight.gif

Diese Bitte unter /system/images speichern.

Die Navigation erfolgt über JavaScript. Hier wird die Value der Textbox verändert, Pfeile versteckt und das Bild ausgewechselt. Das Bild sollte ja eigentlich nach Ändern der Textbox ausgeführt werden, hat aber mit einer versteckten Textbox nicht geklappt. Deswegen habe ich das nun in den Pfeilen gemacht.

Das ist der neue Quelltext der /system/classes/skinselector.php:

<?PHP
  class skinselector extends Control{

    public function display(){
        ?>
          <input type="hidden" name="<?PHP echo htmlentities($this->name); ?>" value="<?PHP echo htmlentities($this->value); ?>" />
          <img id="btnLeft" OnClick="document.getElementsByName('<?PHP echo htmlentities($this->name); ?>')[0].value--;
                                     document.getElementById('skinpreview').src='/system/skins/' + skins[document.getElementsByName('<?PHP echo htmlentities($this->name); ?>')[0].value-1]['name'] + '/screenshot.jpg';
                                     document.getElementById('btnRight').style.visibility='visible';
                                     if(1 == document.getElementsByName('<?PHP echo htmlentities($this->name); ?>')[0].value){
                                         document.getElementById('btnLeft').style.visibility='hidden'
                                     };"
                             src="/system/images/btnLeft.gif" />
          <img id="skinpreview" style="border:1px solid #aaa" src="/system/skins/<?PHP echo SkinController::getCurrentSkinName(); ?>/screenshot.jpg" />
          <img id="btnRight" OnClick="document.getElementsByName('<?PHP echo htmlentities($this->name); ?>')[0].value++;
                                      document.getElementById('skinpreview').src='/system/skins/' + skins[document.getElementsByName('<?PHP echo htmlentities($this->name); ?>')[0].value-1]['name'] + '/screenshot.jpg';
                                      if(skins.length == document.getElementsByName('<?PHP echo htmlentities($this->name); ?>')[0].value){
                                          document.getElementById('btnRight').style.visibility='hidden';
                                      }
                                      document.getElementById('btnLeft').style.visibility='visible';" 
                             src="/system/images/btnRight.gif" />
          <script language="JavaScript">
              var skins = new Array();
              <?PHP
                $i = 0;
                foreach(SkinController::getInstalledSkins() as $skin){
                  echo "skins[".$i."] = new Object();";
                  echo "skins[".$i."]["id"] = "".$skin['id']."";";
                  echo "skins[".$i."]["name"] = "".$skin['name']."";";
                  $i++;
                }
              ?>
              if(skins.length == document.getElementsByName('<?PHP echo htmlentities($this->name); ?>')[0].value){
                  document.getElementById('btnRight').style.visibility='hidden';
              }
              if(1 == document.getElementsByName('<?PHP echo htmlentities($this->name); ?>')[0].value){
                  document.getElementById('btnLeft').style.visibility='hidden';
              }
          </script>
      <?PHP
    }

  }
?>

Als nächstes werden wir eine Datenbank-Klasse erstellen und diese überall einsetzen – Das wird Arbeit!

Kommentare

micha schrieb am 01.03.2010:

Wie siehts denn mit nem neuen Einstiegspunkt aus. Ist da was in Aussicht?

Stefan Wienströer schrieb am 01.03.2010:

Eigentlich sollte der Code nur noch über Codeplex abrufbarsein, aber ich hab noch mal ne Ausnahme gemacht: http://blog.stevieswebsite.de/2010/03/datenbankklasse-teil-1/