jm2l/jm2l/templates/Public/Programme.mako

<%inherit file="jm2l:templates/layout.mako"/>
<%
TabDisplay = [
    (u'Tables rondes', 'Table ronde'),
    (u'Conférences', 'Conference'),
    (u'Ateliers', 'Atelier'),
    (u'Stands', 'Stand'),    
]
%>
<style>
.myblock {
    background-color:#EEE;
    border: 1px solid #ccc;
    height: 65px;
}
.SvgBody {
    padding: 0px;
    background-color: transparent;
}
.EvtBox {
    font-size: 0.7em;
    line-height: 1.2em;
    padding:5px;
    height:100%;
}
.Conference {
    fill: #f9fde8;
}
.Concert {
    fill: #2EE;
}
.Atelier {
    fill: #faebeb;
    stroke: #dc7070;
}
.Table-ronde {
    fill: #fff4e5;
    stroke: #ff9912;
}
.Repas {
    fill: #2EE;
}
svg {
  font: 10px sans-serif;
  shape-rendering: crispEdges;
}

rect {
  stroke-width: 0px;
}

.axis path,
.axis line {
  fill: none;
  stroke: #222;
}

</style>
<h2>Le Programme ${DisplayYear}</h2>

<div class="tabbable" id="main_tab">
    <ul class="nav nav-tabs" style="margin-bottom: 5px;">
    % for Num, (Day, IdDay) in enumerate(Days):
        <li class="${['','active'][Num==0]}"><a href="#Day${Num}" id="Schedule_${Num}" data-toggle="tab">${Day}</a></li>
    % endfor
    </ul>
    <div class="tab-content" style="padding:0">
    % for Num, (Day, IdDay) in enumerate(Days):        
        <div class="tab-pane fade ${['','active '][Num==0]}in" id="Day${Num}">
            ## Container for SVG version of Programme
            <div id="Schedule_SVG_${IdDay}">
            </div>
        </div>
    % endfor
    </div>
</div>

<div id="DivProg" style="border: 1px solid black;"></div>

##<div class="accordion" id="accordionEvent">

% for num, (Title, EvtType) in enumerate( TabDisplay ):
<% 
Counter = Events.filter(Event.event_type==EvtType).count()
if Counter==0:
    continue
%>

##    <div class="accordion-group">
##        <div class="accordion-heading">
##            <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordionEvent" href="#collapseEvent${num}">
##                ${Counter} ${Title}
##            </a>
##        </div>
##        <div id="collapseEvent${num}" class="accordion-body collapse">
##            <div class="accordion-inner">

    <table width="100%" class="table table-striped table-bordered table-hover">
      <thead>
        <tr>
            <th style="width:7em;text-align:center;">Date</th>
            <th style="text-align:center;">Sujet - ${Counter} ${Title}</th>
        </tr>
      </thead>
      <tbody>
        % for event in Events.filter(Event.event_type==EvtType):
            <tr>
                <td style="text-align:center;">
                <% 
                    vid = event.video.first()
                    pres = event.presentation.first()
                %>  
                    ${event.start_time.strftime("%a %d %b").decode('utf-8')}<br>
                    ${event.start_time.strftime("%H:%M")} - ${event.end_time.strftime("%H:%M")}
                </td>
                <td style="position: relative;">
                    <strong>
                        <a href="/event/${event.for_year}/${event.slug}">${event.name}</a>            
                    </strong>
                        <span style="float:right;">
                            % if vid:
                            <a href="${vid.get_path}"> 
                                <i class="icon-film"></i>
                            </a>
                            % endif
                            % if pres:
                            <a href="${pres.get_path}"> 
                                <i class="icon-list-alt"></i>
                            </a>
                            % endif
                        </span>
                    <br/>
                    avec
                    % for num, inter in enumerate(event.intervenants.all()):
                        %if num>0:
                            ,
                        %endif
                        <a href="/user/${inter.slug}">${inter.prenom} ${inter.nom}</a>
                    % endfor
                    % if event.Salle:
                        <div style="position: absolute; bottom: 2px; right: 5px;">
                            ${event.Salle.name}
                        </div>
                    % endif
                </td>
            </tr>
        % endfor
      </tbody>
    </table>
    
##            </div>
##        </div>
##    </div>
    
% endfor
##</div>
<br/><br/>
<script type="text/javascript" src="/vendor/d3js/d3.v3.min.js"></script>
<script type="text/javascript" src="/js/programme.js"></script>