holderdeord/hdo-site

<% page_title "#{@party.name} - #{t('app.title')}" %>
<% metadata[:image] = File.join(root_url, @party.logo.url) %>

<h2 class="party-title-name">
  <%= image_tag @party.logo, alt: "#{@party.name}s logo", width: '96', height: '96' %>
  <%= @party.name %>
</h2>

<div id="representatives">
  <div class="swiper-container">
    <div class="swiper-wrapper">
    <% @representatives.each_slice(1).with_index do |representative_group, index| %>
      <% representative_group.each do |representative| %>
        <div class="swiper-slide representative">
          <%= link_to(representative) do %>
            <img src="<%= path_to_image representative.image.versions[:small] %>" height="160" width="120">
            <span><%= representative.full_name %></span>
          <% end %>
        </div>
      <% end %>
    <% end %>
    </div>
  </div>
  <div class="swiper-navigation swiper-prev">&lt;</div>
  <div class="swiper-navigation swiper-next">&gt;</div>
</div>

<hr class="soften">

<div class="row-fluid">
  <div class="span6">
    <%= render partial: 'shared/propositions_feed', locals: { feed: @propositions_feed } %>
  </div>

  <% if @party.twitter_id %>
    <div class="span6">
      <h4>@<%= @party.twitter_id %></h4>

      <a href="https://twitter.com/<%= @party.twitter_id %>"
         class='twitter-timeline'
         data-dnt='true'
         data-widget-id='<%= AppConfig.twitter_widget_id %>'
         data-lang='no'
         data-link-color='#019ea2'
         data-chrome='noheader nofooter'
         data-screen-name='<%= @party.twitter_id %>'
         >
        Tweets fra <%= @party.name %>
      </a>

      <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
    </div>
  <% end %>
</div>

<% content_for :document_ready do %>
  <script>
    /* Returns the number of slides wanted dependig on container width.  */
    function getSlideSize() {
      var maxWidth = $('.container').first().width();
      var slideWidth = 120;
      return Math.floor(maxWidth/slideWidth);
    }
    /* Updates the slide count  */
    $(document).ready(function() {
      var swiperParty = new Swiper('.swiper-container', {'slidesPerSlide': getSlideSize()});

      $('#representatives .representative').fadeTo('slow', 1);

      $('.swiper-prev').on('click', swiperParty.swipePrev);
      $('.swiper-next').on('click', swiperParty.swipeNext);

      $(window).resize(function() {
        swiperParty.params.slidesPerSlide = getSlideSize();
      });
    })
  </script>
<% end %>