Top
Sichtreise / Tutorials  / HTML & PHP  / impress  / Impress.js – slide-functions

Impress.js – slide-functions

Damit wir es künftig aber noch komfortabler haben, packen wir alle “Folien”-Parameter ebenfalls in die dazugehörige functions.php
[code]<?php
// Impress.js Steuerparameter
$impressid = “”; // Optionaler eindeutiger Name für die Url-Ansteuerung
$cssclass = “”; // CSS Klasse damit die Formatierung funktioniert
$datax = “”; // Wo auf der X-Achse soll das Element liegen
$datay = “”; // Wo auf der Y-Achse soll das Element liegen
$dataz = “”; // Soll es auch weiter vorne (+ Wert) oder weiter hinten (- Wert) liegen
$scalefactor = “”; // Hier gehts um die Skalierung
$rotatefactor = “”; // Und hier geht um die Drehung. Gegen den Uhrzeigersinn (- Wert), im Uhrzeigersinn (+ Wert)

// Für den 3D Effekt
$rotatex = “”;
$rotatey = “”;
$rotatez = “”;
[/code] Dazu legen wir einfach mal lauter leere Variablen an. Damit ich mir mit der Identifizierung leichter tue, nenne ich sie “ähnlich” wie jene Platzhalter unter Impress.js. Natürlich mit ein paar Kommentaren, damit ich irgendwann mal auch weiß, wofür was gedacht war.

Danach lassen wir per PHP diese Zeile zusammenbauen:
[code]// ********************************************************************
// Die nachfolgenden Zeilen bauen je nach Werten die DIV-Zeile für die
// jeweilige Folie zusammen. Also z.B. das
// <div id=”big” class=”step” data-x=”3500″ data-y=”2100″ data-rotate=”180″ data-scale=”6″>
// Ausgewiesene Variable: impressslideargument

$impressslideargument = ‘<div’;
If ($impressid != “”) { $impressslideargument .= ‘ id=”‘ . $impressid . ‘” ‘; }
If ($cssclass != “”) { $impressslideargument .= ‘ class=”‘ . $cssclass . ‘” ‘; }
If ($datax != “”) { $impressslideargument .= ‘ data-x=”‘ . $datax . ‘” ‘; }
If ($datay != “”) { $impressslideargument .= ‘ data-y=”‘ . $datay . ‘” ‘; }
If ($dataz != “”) { $impressslideargument .= ‘ data-z=”‘ . $dataz . ‘” ‘; }
If ($scalefactor != “”) { $impressslideargument .= ‘ data-scale=”‘ . $scalefactor . ‘” ‘; }
If ($rotatefactor != “”) { $impressslideargument .= ‘ data-rotate=”‘ . $rotatefactor . ‘” ‘; }
$impressslideargument .= ‘>’;[/code] Schon sehr praktisch, oder?
Die ganze functions.php Datei sieht zurzeit also so aus:
[code]<?php
// Impress.js Steuerparameter
$impressid = “”; // Optionaler eindeutiger Name für die Url-Ansteuerung
$cssclass = “”; // CSS Klasse damit die Formatierung funktioniert
$datax = “”; // Wo auf der X-Achse soll das Element liegen
$datay = “”; // Wo auf der Y-Achse soll das Element liegen
$dataz = “”; // Soll es auch weiter vorne (+ Wert) oder weiter hinten (- Wert) liegen
$scalefactor = “”; // Hier gehts um die Skalierung
$rotatefactor = “”; // Und hier geht um die Drehung. Gegen den Uhrzeigersinn (- Wert), im Uhrzeigersinn (+ Wert)

// Für den 3D Effekt
$rotatex = “”;
$rotatey = “”;
$rotatez = “”;

/* ********************************************************************
********************************************************************
Ab hier bitte keine Änderungen mehr vornehmen!
********************************************************************
********************************************************************
*/

/* ********************************************************************
Die nachfolgenden Zeilen bauen je nach Werten die DIV-Zeile für die
jeweilige Folie zusammen. Also z.B. das
<div id=”big” class=”step” data-x=”3500″ data-y=”2100″ data-rotate=”180″ data-scale=”6″>
Ausgewiesene Variable: impressslideargument
*/

$impressslideargument = ‘<div’;
If ($impressid != “”) { $impressslideargument .= ‘ id=”‘ . $impressid . ‘” ‘; }
If ($cssclass != “”) { $impressslideargument .= ‘ class=”‘ . $cssclass . ‘” ‘; }
If ($datax != “”) { $impressslideargument .= ‘ data-x=”‘ . $datax . ‘” ‘; }
If ($datay != “”) { $impressslideargument .= ‘ data-y=”‘ . $datay . ‘” ‘; }
If ($dataz != “”) { $impressslideargument .= ‘ data-z=”‘ . $dataz . ‘” ‘; }
If ($scalefactor != “”) { $impressslideargument .= ‘ data-scale=”‘ . $scalefactor . ‘” ‘; }
If ($rotatefactor != “”) { $impressslideargument .= ‘ data-rotate=”‘ . $rotatefactor . ‘” ‘; }
$impressslideargument .= ‘>’;

/* ********************************************************************
Kleines PHP-Skript um den Ordnernamen dieser slide.php festzustellen
Ausgewiesene Variable: $letzterordner
*/

$verzeichnisInclude = dirname(__FILE__); // In welchem relativen Pfad liegt diese Datei
$pos = strripos($verzeichnisInclude, “/”)+1; // Ermittle das letzte / und gib die Position um +1 zurück
$letzterordner = substr($verzeichnisInclude, $pos); // Schneide den Pfad ab dem letzten gefunden / nach links ab und speichere den Wert in der Variable $letzterordner

?>[/code] Das fertig File in dieser Version kannst du auch wieder [hier] downloaden.

Ach ja, damit das Ganze auch funktioniert, muss in der slide.php noch folgende Zeile geändert werden:
[code]<div id=”bored” class=”step slide” data-x=”-1000″ data-y=”-1500″>[/code] in
[code]<?php echo $impressslideargument; ?>[/code] Also in Summe:
[code]<?php
include ‘functions.php’;
echo $impressslideargument; ?>

<q>Aren’t you just <b>bored</b> with all those slides-based presentations?</q>
<img src=”<?php echo $letzterordner; ?>/65103.png”>

</div>[/code] So, dann sehen wir uns doch mal an, was wir gelenrt haben und kommen unserem Ziel ein Stück näher: Impress.js – Kontrolle und Zusammenfassung

[content_band class=”center-text” no_margin=”true” inner_container=”true” border=”vertical” bg_color=”#fff”] [container] [column type=”1/1″ last=”true” fade=”true” fade_animation=”in”] [gap size=”1%”]

[icon type=”thumbs-up”] Notiz am Rande: Wenn ein Artikel gefällt, dann empfehle ihn doch bitte weiter. Nichts macht mehr Spaß, wenn man sieht, dass die Arbeit auch durch Liken & Sharen ein wenig Anerkennung findet. Liken & Sharen – eine bessere kostenlose Anerkennung gibt es nicht 😉

[gap size=”1%”] [share title=”Liken & Sharen” facebook=”true” twitter=”true” google_plus=”true” pinterest=”true” email=”true”] [/column] [/container] [/content_band] [custom_headline type=”left” level=”h3″ looks_like=”h4″ accent=”true”]Weitere Beiträge[/custom_headline] [recent_posts count=”4″ category=”impress”]

Author Profile

RonnyDee
RonnyDee"Wenn du tust, was du immer getan hast, dann wirst du bekommen, was du immer bekommen hast"
Ich blogge hier über alle Themen mit denen ich in Berührung komme. Möchtest du wissen, warum ich so denke was ich schreibe, dann findest du unter "Über mich" mehr Informationen über mich und mein Leben
No Comments

Post a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Skip to content