added featured section

templates/index.html

@@ -30,16 +30,40 @@
 				</p>
 			</div>
 		</div>
+		{% if featured|length > 0 %}
 			<div class="panel panel-default">
 				<div class="panel-heading">
 					<h1 class="panel-title">Featured</h1>
 				</div>
 				<div class="panel-body">
-				<h1 class="panel-title">Collegium Musicum</h1 class="panel-title">
-				<img style="width:100%" src="http://www.cm.rwth-aachen.de/typo3/typo3temp/pics/c1d685f56a.jpg">
+					<div id="myCarousel" class="carousel slide" data-ride="carousel" style="background-color: #EEE; min-height: 400px;">
+						<!-- Indicators -->
+						<ol class="carousel-indicators">
+							{% for i in featured %}
+								<li data-target="#myCarousel" data-slide-to="0" {% if loop.first %} class="active" {% endif %}></li>
+							{% endfor %}
+						</ol>
+							<div class="carousel-inner" role="listbox">
+						{% for i in featured %}
+								<div class="item {% if loop.first %}active{% endif %}">
+									{{ i.text|safe }}
+									<div class="carousel-caption"><h1>{{ i.title }}</h1></div>
+								</div>
+						{% endfor %}
 							</div>
+						<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
+							<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
+							<span class="sr-only">Previous</span>
+						</a>
+						<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
+							<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
+							<span class="sr-only">Next</span>
+						</a>
 					</div>
 				</div>
+			</div>
+		{% endif %}
+	</div>
 	<div class="col-md-6">
 		<div class="panel panel-default">
 			<div class="panel-heading">