Mercurial > public > bravenewsurf

comparison bns_website/templates/bands/band_list.html @ 56:8bda0ec405e4

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Merged experimental band ui branch to default.
author Chris Ridgway <ckridgway@gmail.com>
date Mon, 14 Nov 2011 23:32:14 -0600
parents c3b4884fe4ea
children e0a0ebc56afe
comparison
equal deleted inserted replaced
54:f8b32ce38533 56:8bda0ec405e4
2 {% load core_tags %} 2 {% load core_tags %}
3 {% block title %}Bands{% endblock %} 3 {% block title %}Bands{% endblock %}
4 4
5 {% block custom_css %} 5 {% block custom_css %}
6 <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/redmond/jquery-ui.css"> 6 <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/redmond/jquery-ui.css">
7 <link rel="stylesheet" href="{{ STATIC_URL }}js/fancybox/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />
8 <link rel="stylesheet" href="{{ STATIC_URL }}css/bx_styles.css">
9 <style>
10 .hero-unit h1 { font-size: 50px; }
11 </style>
7 {% endblock %} 12 {% endblock %}
8 {% block custom_js %} 13 {% block custom_js %}
9 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> 14 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
10 <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script> 15 <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
16 <script type="text/javascript" src="{{ STATIC_URL }}js/bxslider/jquery.bxSlider.min.js"></script>
17 <script type="text/javascript" src="{{ STATIC_URL }}js/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
11 <script type="text/javascript"> 18 <script type="text/javascript">
12 $(function() { 19 $(document).ready(function(){
13 $("#accordion").accordion({active: false}); 20 $('#slider1').bxSlider({
14 }); 21 mode: 'fade',
22 speed: 500,
23 auto: true,
24 autoControls: true,
25 autoHover: true,
26 randomStart: true,
27 pager: true,
28 pagerType: 'full',
29 nextImage: '{{ STATIC_URL }}images/icon_arrow_right.png',
30 prevImage: '{{ STATIC_URL }}images/icon_arrow_left.png',
31 wrapperClass: 'bands-slider-wrap'
32 });
33
34 $("a.band-image").fancybox({
35 'transitionIn' : 'elastic',
36 'transitionOut' : 'elastic',
37 'speedIn' : 600,
38 'speedOut' : 200,
39 'overlayShow' : false
40 });
41 });
15 </script> 42 </script>
16 {% endblock %} 43 {% endblock %}
17 44
18 {% block content %} 45 {% block content %}
19 {% navbar 'bands' %} 46 {% navbar 'bands' %}
20 <h1>Bands</h1>
21 <p>This is too &quot;wall of text-y&quot;, so maybe break it up with band photos. And/or put a javascript slideshow of all the bands up here at the top.</p>
22 <dl>
23 {% for band in object_list %}
24 <dt><a href="{{ band.url }}">{{ band.name }}</a></dt>
25 <dd>{{ band.notes|linebreaksbr }}</dd>
26 {% endfor %}
27 </dl>
28 47
29 <p>And here is what it looks like as a jQuery accordion.</p> 48 <div class="hero-unit">
30 <div id="accordion"> 49 <div id="slider1">
31 {% for band in object_list %} 50 {% for band in object_list %}
32 <h3><a href="#">{{ band.name }}</a></h3> 51 <div>
33 <div> 52 <div class="row">
34 {{ band.notes|linebreaksbr }} 53 <div class="span4">
35 <p style="margin-top:1em"><a class="btn default" href="{{ band.url }}">{{ band.name }} Website</a></p> 54 {% if band.asset_prefix %}
36 </div> 55 <a class="band-image" href="{{ STATIC_URL }}images/bands/{{ band.asset_prefix }}_large.jpg">
37 {% endfor %} 56 <img src="{{ STATIC_URL }}images/bands/{{ band.asset_prefix }}_small.jpg" alt="{{ band.name }}" title="View {{ band.name }} full size" />
57 </a>
58 {% else %}
59 <img src="http://placehold.it/200x200&text={{ band.name|escapejs }}">
60 {% endif %}
61 </div>
62 <div class="span10">
63 <h1>{{ band.name }}</h1>
64 <br/>
65 <span>{{ band.notes }}</span>
66 {% if band.url %}
67 <p style="margin-top:1em"><a class="btn default" href="{{ band.url }}">Band Site</a></p>
68 {% endif %}
69 </div>
70 </div>
71 </div>
72 {% endfor %}
73 </div>
38 </div> 74 </div>
39 75
40 {% endblock %} 76 {% endblock %}