Test code for new matter.vc carousel

test.php

<?php 

  // ***** N.B. this get_bloginfo function is a stub for testing, deleted from production site code.
  function get_bloginfo($key) {
   return 'http://matter.vc/wp-content/themes/matter';
  }

  /*
    matter_story_carousel() generates the html for the slides in the carousel.
  
    $carouselArray defines each slide, with the taglines as keys, and a list os possible options as the value.
    Each set of options for the tagline is itself an array that specifies text, image, and credit.

    At runtime, all tag lines will be rendered into html.
    For each tag line, one set of options will be selected at random.

    To add a new set of options for a tag line, add a new array of options within its array value.
    e.g. 'Stories define us.' has 2 arrays which are identical except for an html comment in the text.    

  */
  function matter_story_carousel() {

    $dir = get_bloginfo('template_directory');

    $carouselArray = array(
      'Stories define us.' => array(
        array(
          'text'   => '<!-- 0 -->The world watched the Apollo moon landing&mdash;the largest live television audience of its time.',
          'image'  => $dir.'/images/story/header-1.jpg',
          'credit' => '',
        ),
        array(
          'text'   => '<!-- 1 -->The world watched the Apollo moon landing&mdash;the largest live television audience of its time.',
          'image'  => $dir.'/images/story/header-1.jpg',
          'credit' => '',
        ),
      ),
      'Technology empowers us.' => array(
        array(
          'text'   => 'Social media frees the voices of the people during Arab Spring.',
          'image'  => $dir.'/images/story/header-2.jpg',
          'credit' => '',
        ),
      ),
      'Everything big started small.' => array(
        array(
          'text'   => 'Entrepreneur Jack Dorsey\'s first sketch of what would become Twitter.',
          'image'  => $dir.'/images/story/header-3.jpg',
          'credit' => 'Photo Credit: Jack Dorsey',
        ),
      ),
      'Start here.' => array(
        array(
          'text'   => '',
          'image'  => $dir.'/images/story/header-4.jpg',
          'credit' => '',
        ),
      ),
      'Change media for good.' => array(
        array(
          'text'   => '',
          'image'  => $dir.'/images/story/header-5.jpg',
          'credit' => '',
        ),
      )
    );

    $html = "<!-- matter carousel start -->\n<div id='carousel'>\n<div id='story-carousel'>\n";
    foreach ($carouselArray as $tag => $slides) {
      // pick a slide randomly from array of options
      $slide = $slides[rand(0, (count($slides) - 1))];
      $html .= "  <div style=\"background-image: url('".$slide['image']."');\">\n";
      $html .= "    <div class='container'>".$tag."\n";

      if ($slide['text'] != '') {
        $html .= "      <div class='small'>".$slide['text']."</div>\n";
      }

      if ($slide['credit'] != '') {
        $html .= "      <div class='credit'>".$slide['credit']."</div>\n";
      }

      $html .= "    </div>\n";
      $html .= "  </div>\n";
    }

    $html .= "</div>\n</div>\n<!-- matter carousel end -->\n";

    return $html;

  }

?>

<?php echo matter_story_carousel(); ?>