Zum Inhalt springen

jQueryMobile, tt_news, iPad

Erstellt am 9. September 2012 · Noch keine Antworten

Tags: tt_news, JavaScript & AJAX, Frage

siala ·

folgendes Problem: Eine tt_news Singleansicht soll via Gestensteuerung ("swipe") zum nächsten bzw. zum vorherigen Newsartikel blättern (oder wohl eher gleiten ;-) ).

Bisher verwende ich UID der News als ID der section im DOM. Die fortlaufend via IDs nummerierten sections ermöglichen normalerweise ein vor- bzw. zurückblättern via Gestensteuerung.
Dazu werden die einzelnen News bereits in der Listenansicht via data-prefetch ins DOM vorausgeladen, um im Falle der swipe-Action zur Ansicht zur Verfügung zu stehen.
Im Frontend werden momentan drei News-Beiträge nebeneinander angezeigt. Mein Ziel ist durch wischen mit dem finger über den Bildschirm weitere News-Beiträge anzuzeigen.

Das Javascript, welches mit dem jQueryMobile Framework arbeitet um die Swipes zu ermöglich, ist ein bekanntes Standardskript:

(function($) {
var methods = {
init : function(options) {
var settings = {
callback : function() {}
}
if (options) {
$extend(settings, options);
}
// Alle Seiten (section id="pageXX") auswählen und mit Event Listenern versehen
$(":jqmData(role='page')").each(function() {
// Wischen von links nach rechts:
$(this).bind("swipeleft", function() {
// Aktuelle Seitennummer auslesen und nach oben zählen
var nextPage = parseInt($(this).attr("id").split("page")[1])+1;
//if (nextPage > 5) nextPage = 1;
// Seitenübergang ausführen
//$.mobile.changePage("#page"+nextPage, "slide", true);
$.mobile.changePage("#page"+nextPage, {
transition: "slide",
reverse: false,
});
});
// Wischen von rechts nach links
$(this).bind("swiperight", function() {
// Aktuelle Seitennummer auslesen und abwärts zählen
var nextPage = parseInt($(this).attr("id").split("page")[1])-1;
//if (nextPage === 0) nextPage = 5;
// Seitenübergang ausführen
//$.mobile.changePage("#page"+nextPage, "slide");
$.mobile.changePage("#page"+nextPage, {
transition: "slide",
reverse: true,
});
})
})
}
}
$.fn.initApp = function(method) {
// Logik für Methodenaufrufe
if (methods[method]) {
return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
} else if (typeof method === 'object' || !method) {
return methods.init.apply(this, arguments);
} else {
$.error('Methode ' + method + ' Seite existiert nicht' );
}
}
})(jQuery);

$(document).ready(function() {
$().initApp();
});

Problem: Man bekommt die News nie mit fortlaufenden IDs. Ich müsste also irgendwas einbauen, dass die News quasi fortlaufend durchnummeriert - denn ohne fortlaufende Nummerierung keine Swipes!
An diesem Punkt hakt's bei mir gerade. Gibt es irgendeine Möglichkeit, die News einer Kategorie mittels Typoscript "durchzunummerieren"? Oder soll ich nicht mit News arbeiten, sondern mit normale content (Text mit Bild).
Vielen Dank im Voraus für eure Tipps oder Beispiel.