Beiträge von natalia

sk_calendar: Archive view

Bei der Archive view im sk_calendar (VCE) wollte ich eigentlich nur, dass die vergangenen Events wie in einer Liste angezeigt werden. Stattdessen bekam ich einen Button und eine komische Ausgabe. Ich habe einen Teil des Quelltextes geändert, damit meine Anforderungen erfüllt werden.

Die Variable Startdate wird auf 5 Jahre in der Vergangenheit gesetzt, die Variable Enddate auf den aktuellen Tag und damit die Ansicht so gerendert wird, wie die Liste, wird die Variable manuell neu gesetzt (ab Zeile 231).

case ‘archive’:
$this->conf[‘general’][‘view’] = ‘list’;
$offset_temp = date(‘m-d-Y’,$offset);
$offset_temp = explode(‘-‘,$offset_temp);
if (!$filters[‘startdate’]) $filters[‘startdate’] = mktime(0,0,0,$offset_temp[0],$offset_temp[1],$offset_temp[2]-5); // 5 years back
if (!$filters[‘enddate’]) $filters[‘enddate’] = $offset;
/*if ($filters[‘monthfilter’]) {
$filters[‘startdate’] = $filters[‘monthfilter’];
$offset_temp = date(‘m-d-Y’,$filters[‘monthfilter’]);
$offset_temp = explode(‘-‘,$offset_temp);
$filters[‘enddate’] = mktime(0,0,0,$offset_temp[0]+1,$offset_temp[1],$offset_temp[2]);
$offset = $filters[‘monthfilter’];
} else {
if (!$filters[‘startdate’]) $filters[‘startdate’] = 1; // show us everything (0 would disable filter)
$offset_temp = date(‘m-d-Y’);
if (!$filters[‘enddate’]) $filters[‘enddate’] = mktime(0,0,0)-1; // … until not quite today
}*/
break;

Und wenn man möchte, dass diese Liste auch noch umgekehrt sortiert wird – das letze Event zuerst – da kann man manuell die Sorting Variable setzen:


$this->conf[‘general’][‘view’] = ‘list’; // war schon da
$this->conf[‘sorting’] = ‘update’; // steht für “up” und “date”

Geschrieben in TYPO3 | Kommentare deaktiviert für sk_calendar: Archive view

Tabbed Content

Auf einer Seite befand sich zu viel Content, um eine Aufteilung auf mehrere Seite und Scrolling zu vermeiden, entstand die Idee den Content in eine Art Tabs anzuzeigen. Der Content sollte weiterhin in Typo3 gepflegt werden können und einige der Elemente sollten weiterhin dem Flow der Seite folgen.

Die Elemente, die in einen Mini-Tab-Browser gepackt werden sollte, werden in Typo3 mit einem Rahmen “Indent”/”Einzug” versehen. Die normalen Content Elemente werden nicht in den Browser gepackt.

Das Skript wird in den Header eingebunten, und am Ende der Seite wird die Funktion aufgerufen. Die Funktion sucht das Element mit der id “content” und überprüft alle darin befindlichen Elemente, ob sie den Klassennamen “csc-frame-indent” haben. Ich musste vorher im Template einstellen, dass nur csc-frame-indent verwendet wird. Dann werden die Elemente, die diese Voraussetzungen erfüllen, mit einer Id versehen, der Titel des Elementes wird extrahiert und auch in ein Array gepackt. Das Array wird dann abgearbeitet, es wird eine Navigation erstellt und an den Anfang des Content-Elementes gepackt. Bei Rollover wird das vorherige Element ausgeblendet und das neue eingeblendet.

Zu beachten: im HTML-Template muss der Content in <div id=”content”> eingefügt werden. Jedes Content-Element muss in einem Div mit dem Klassennamen “content-element” gewrappt werden. Und der Wrap für den Content-Rahmen muss auch geändert werden. Wie das geht, steht weiter unten im TypoScript Abschnitt.

Der Quelltext sollte nach den Änderungen etwas so strukturiert sein:

Irgenein Content

[… weitere divs]

Hier der Link zum Anschauen und darunter der Quelltext, zunächst das TypoScript Template und dann der JavaScript Teil.

page.headerData.20 = TEXT
page.headerData.20.value =
page.99 = HTML
page.99.value =
# damit jedes Content Element in ein div gewrappt wird
tt_content.stdWrap.dataWrap =

|

# jedes Content Element mit Rahmen “Indent” oder “Einzug” wird so gewrappt
tt_content.stdWrap.innerWrap.cObject.10.value =

|

var currentlyShowing = -1;
// array with titles, that should be linked
var titleArray = Array();
// array with indices of the elements, that should be display tabbed
var indexArray = Array();

function displayTabbedContent() {
var contentElement = document.getElementById(“content”);
contentElement.style.position = “relative”;
var contentChildren = contentElement.childNodes;
var counter = 0;
for(var i=0;i‘;
naviHTML+= ‘‘+titleArray[i]+’