osem-fcy/app/views/conferences/show.html.haml

- content_for :head do
  %meta{ property: "og:title", content: @conference.title }
  %meta{ property: "og:site_name", content: (ENV['OSEM_NAME'] || 'OSEM') }
  %meta{ property: "og:description", content: @conference.description }
  %meta{ property: "og:url", content: conference_url(@conference.short_title) }
  - if @conference.picture?
    %meta{ property: "og:image", content: @conference.picture_url }
    %meta{ property: "og:image:secure_url", content: @conference.picture_url }

= content_for :title do
  = @conference.title

#splash
  // header/description
  = render 'header'

  // attendance/registration
  - if @conference.splashpage.include_registrations && @conference.registration_open?
    = render 'registration'
  - if @conference.splashpage.include_tickets && @conference.tickets.any? && @conference.pending?
    = render 'tickets'

  // calls for content, or program
  - if @conference.splashpage.include_cfp
    = render 'call_for_content'
  - if @conference.splashpage.include_program
    = render 'schedule_splashpage'

  // geo
  - if @conference.splashpage.include_venue && @conference.venue
    = render 'venue'
  - if @conference.splashpage.include_lodgings && @conference.lodgings.any?
    = render 'lodging'

  // sponsorship
  - if @conference.splashpage.include_sponsors
    = render 'sponsors'

  // footer
  - if @conference.splashpage.include_social_media && @conference.contact.has_social_media?
    = render 'social_media'
  = render 'footer'

- cache [@conference.color, '#splash#inlinejs'] do
  - content_for :script_head do
    :javascript
      var triangle_tcs = tinycolor("#{h(@conference.color)}").monochromatic();
      var triangle_colors = triangle_tcs.map(function(t) { return t.toHexString(); });
      $(function () {
        $(document).ready(function() {
          var triangle_width = document.body.clientWidth;
          var triangle_height = ($( "#banner" ).height() + 200 );
          var pattern = Trianglify({ width: triangle_width,
                                     height: triangle_height,
                                     cell_size: 100,
                                     x_colors: triangle_colors
                                    });
          $('#banner').css('background-image', 'url("' + pattern.png() + '")');
        });
      });