_schedule hamlfy

_schedule changed to haml
This commit is contained in:
Ana 2016-06-30 13:57:25 +02:00
parent 818c55df5a
commit cd32ddd422
2 changed files with 68 additions and 82 deletions

View file

@ -1,82 +0,0 @@
<div id="schedule-content">
<h1 class="text-center"> Schedule for <%= @conference.title %></h1>
<div class="dropdown schedule-dropdown">
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
<%= @dates.first %>
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<% @dates.each do |date| %>
<li class='li-dropdown-schedule'>
<%= link_to date, "#" + "#{date}", "data-toggle" => "tab", "class" => "date-tab" %>
</li>
<% end %>
</ul>
</div>
<div class="tab-content">
<% @dates.each do |date| %>
<div class="tab-pane <%= 'active' if @dates.first == date %>" id ="<%= date %>" >
<div class="visible-xs-inline">
<% number_columns = 1 %>
<%= render 'carousel', date: date, number_columns: number_columns %>
</div>
<div class="visible-sm-inline">
<% number_columns = 2 %>
<%= render 'carousel', date: date, number_columns: number_columns %>
</div>
<div class="visible-md-inline visible-lg-inline">
<% number_columns = 3 %>
<%= render 'carousel', date: date, number_columns: number_columns %>
</div>
</div> <!-- Tab -->
<% end %>
</div>
</div>
<%= javascript_tag do %>
// change of active tab and the button title when a date clicked
$(function() {
$('.date-tab').on('click', function(e) {
$('.li-dropdown-schedule').removeClass('active');
$('.schedule-dropdown').find('button').text($(this).text());
});
});
// use the date tag in the url to select a tab and the title of the button
$(function() {
var hash = window.location.hash;
if(hash && !(hash === '#schedule')){
hash && $('ul a[href="' + hash + '"]').tab('show');
$('button.dropdown-toggle').text(hash.substr(1));
}
});
// hide the right and left controls when neccesary after moving the carousel
$('.carousel').on('slid.bs.carousel', '',
function(){
$(this).children('.left.carousel-control').show();
$(this).children('.right.carousel-control').show();
if($(this).find('.first').hasClass('active')) {
$(this).children('.left.carousel-control').hide();
} else if($(this).find('.last').hasClass('active')) {
$(this).children('.right.carousel-control').hide();
}
});
$(document).ready(function(){
// hide the left control when the page is ready
$('.carousel').children('.left.carousel-control').hide();
// carousel swipe
$(".carousel-inner").swiperight(function() {
$(this).parent().carousel('prev');
});
$(".carousel-inner").swipeleft(function() {
$(this).parent().carousel('next');
});
});
<% end %>

View file

@ -0,0 +1,68 @@
#schedule-content
%h1.text-center
Schedule for
= @conference.title
.dropdown.schedule-dropdown
%button{ type: "button", class: "btn btn-default dropdown-toggle", 'data-toggle' => "dropdown" }
= @dates.first
%span.caret
%ul.dropdown-menu
- @dates.each do |date|
%li.li-dropdown-schedule
= link_to date, "#" + "#{date}", "data-toggle" => "tab", "class" => "date-tab"
.tab-content
- @dates.each do |date|
%div{ class: "tab-pane #{ 'active' if @dates.first == date }", id: "#{ date }" }
.visible-xs-inline
= render partial: 'carousel', locals: { date: date, number_columns: 1 }
.visible-sm-inline
= render partial: 'carousel', locals: { date: date, number_columns: 2 }
.visible-md-inline.visible-lg-inline
= render partial: 'carousel', locals: { date: date, number_columns: 3 }
:javascript
// change of active tab and the button title when a date clicked
$(function() {
$('.date-tab').on('click', function(e) {
$('.li-dropdown-schedule').removeClass('active');
$('.schedule-dropdown').find('button').text($(this).text());
});
});
// use the date tag in the url to select a tab and the title of the button
$(function() {
var hash = window.location.hash;
if(hash && !(hash === '#schedule')){
hash && $('ul a[href="' + hash + '"]').tab('show');
$('button.dropdown-toggle').text(hash.substr(1));
}
});
// hide the right and left controls when neccesary after moving the carousel
$('.carousel').on('slid.bs.carousel', '',
function(){
$(this).children('.left.carousel-control').show();
$(this).children('.right.carousel-control').show();
if($(this).find('.first').hasClass('active')) {
$(this).children('.left.carousel-control').hide();
} else if($(this).find('.last').hasClass('active')) {
$(this).children('.right.carousel-control').hide();
}
});
$(document).ready(function(){
// hide the left control when the page is ready
$('.carousel').children('.left.carousel-control').hide();
// carousel swipe
$(".carousel-inner").swiperight(function() {
$(this).parent().carousel('prev');
});
$(".carousel-inner").swipeleft(function() {
$(this).parent().carousel('next');
});
});