[TYPO3-ttnews] tx_ttnews - tt_news als jquery.isotope Image Menu aus Category

[Matthias Eberlein]

Hallo Liste,
ich stehe hier vor einem kleinen Problem. Und zwar Erstelle ich per 
TYPOSCRIPT ein News Content was als jQuery Isoptope Dargestellt werden 
soll. Das Läuft Problemlos.

Hier mal das gesammte script dazu.


############################
# tt_news TEST mit ISOTOPE #
############################
lib.NewsSelect = CONTENT
lib.NewsSelect {
   table= tt_news
   select {
     pidInList =17
     selectFields = tt_news.title, tt_news.image, tt_news.bodytext, 
tt_news.crdate, tt_news.datetime, tt_news.author, tt_news_cat.title AS 
category
     andWhere = NOT tt_news.deleted AND NOT tt_news.hidden
     andWhere.intval = 1
     join = tt_news_cat_mm ON (tt_news_cat_mm.uid_local = tt_news.uid) 
JOIN tt_news_cat ON (tt_news_cat.uid = tt_news_cat_mm.uid_foreign)
     orderBy = tt_news.uid DESC
     max =
   }
}
lib.NewsSelectContent = CONTENT
lib.NewsSelectContent =< lib.NewsSelect
lib.NewsSelectContent {
   renderObj = COA
   renderObj{
     stdWrap.dataWrap = <div class="isotope-item {field:category}" 
data-category="{field:category}">|</div>
     stdWrap.dataWrap.insertData = 1
     stdWrap.innerWrap = <article>|</article>
     20 = IMAGE
     20 {
       #if not empty
       if.isTrue.field = image
       #        required=1
       file.import=uploads/pics/
       file.import.field=image
       file.width=
       file.height= 180c
       file.import.listNum = 0
       titleText.field = imagetitletext
       altText.field = imagecaption
       wrap =  <figure>|</figure>
     }
   }
}
lib.IsotopejQueryNewsNavigation= CONTENT
lib.IsotopejQueryNewsNavigation {
   stdWrap.outerWrap =  <section id="options" class="clearfix">|</section>
   stdWrap.innerWrap = <ul id="filters" class="option-set clearfix" 
data-option-key="filter">|</ul>
   table = tt_news_cat
   select {
     pidInList=17
     selectFields = title
     andWhere.data = page:uid
     andWhere = NOT deleted AND NOT hidden
     andWhere.intval = 1
   }
   renderObj >
   renderObj = COA
   renderObj {
     stdWrap.dataWrap = <li><a href="#filter" 
data-option-value=".{field:title}">|</a></li> // Hier müßte noch ein 
emty Zusätzlicher <li></li> rein
     stdWrap.dataWrap.insertData = 1
     10 =TEXT
     10.field = title
   }
}
lib.IsotopejQueryNews = COA
lib.IsotopejQueryNews {
   wrap = <div class="brick_container_wrapper">|</div>
   10 = COA
   10 {
     1 < lib.IsotopejQueryNewsNavigation
   }
   20 = COA
   20.wrap =  <div id="container" class="clearfix">|</div>
   20 {
     2 < lib.NewsSelectContent
   }
}

## END ISOTOPE NEWS ###


Wie man sehen kann werden im Moment nur Images Ausgegeben. (Dam Images 
habe ich Versucht bin aber Gescheitert).

Nun habe ich  20 -30 News Beiträge wovon alle einer oder mehrere 
Category/en Zugeordnet sind.
Die Frontend ausgabe sieht nun folgend aus. Die News Beiträge mit nur 
einer Category wird Normal dargestellt. Beiträge mit zb. 3 
Unterschiedlichen Categorien werden 3 x Dargestellt. Also habe ich 3x 
das gleiche Image im FE. Hat jemand einen Wink wie ich das umgehen kann 
oder Verbesserungs Vorschläge?

Desweiteren Stehe ich wie ein Ochs vorm Berg wie ich einen Zusätzlichen 
<li><a class="" href="#filter" data-option-value="*">Show all 
Images</a></li> in die <li>|</li> IsotopejQueryNewsNavigation 
hineinbekomme. Wenn ich es mit jQuery append mache Reagiert isotope 
nicht darauf.

Gruß und Danke für eure Hilfe....

Matthias Eberlein