Template for MIGX MODx

I have some PHP foreach that i have moved to MIGX, now can somebody know how to make template for MIGX, here is my PHP

<?php
$i = 0;
$y = 0;
$active = 'active';
echo '<ol class="carousel-indicators">';
foreach(glob($dir) as $file) {
 if ($i < 1) {
  echo '<li data-target="#myCarousel" data-slide-to="' . $i . '" class="active"></li>';
  $i = $i + 1;
 }
 else {
  echo '
  <li data-target="#myCarousel" data-slide-to="' . $i . '"></li>';
  $i = $i + 1;
 }
}
echo '</ol>';
echo '<div class="carousel-inner">';
foreach(glob($dir) as $file) {
 $y = $y + 1;
 if ($y == 1) {
  echo '
  <div class="' . $active . ' item">
    <img class="img_book" src="' . $file . '" alt="">
  </div>
  ';
 }
 else {
  $active = 'not-active';
  echo '
  <div class="' . $active . ' item">
    <img class="img_book" src="' . $file . '" alt="">
  </div>
  ';
 }
}
echo '</div>';

Solution

The MIGX Extra comes with a Snippet getImageList that will parse the values in the MIGX TV and return them based on a Chunk template that you specify.

For example, you could put this snippet call in your Template:

    <div class="carousel-inner">
        [[getImageList? 
            &tvname=`myMIGXtv`
            &tpl=`myTplChunk`
        ]]
    </div>

The snippet would return the values stored in the MIGX TV named myMIGXtv, in the currently requested Resource, and format the output based on the tpl Chunk names myTplChunk. The content of myTplChunk would be something like:

    <div class="[[+idx:is=`1`:then=`active`:else=``]] item">
        <img class="img_book" src="[[+file]]" alt="[[+another_migx_field]]">
    </div>

The syntax of calling the [[+idx]] placeholder with a : after the tag name, invokes the MODX output modifier class, which supports conditionals.

Here are some reference materials for the methods described above: